@charset "utf-8";
/*CSS Document*/

*{margin:0px}

body {max-width: 960px; margin: 0 auto; font-family:'Oswald', 'arial', sans-serif;}

header {
    background-color:  rgb(73,207,177);
    width: 85%;
    position: relative;
    overflow: visible;
    margin: auto; 
    padding: 1em;   
}

.logomora{
   width: 89%;
    position: relative;
    overflow: visible;
    margin: auto; 
    padding: 1em;
}

main img{
    width: 21em;
    padding: 0.5em;
}

nav  {
  width: 85%;
    position: relative;
    overflow: visible;
    margin: auto; 
    padding: 1em;

}

ul li {
    display: inline-block;
    width: 85%;
    margin: auto; 
    padding: 1em;

}

 ul li a {
    width: 85%;
    margin: auto; 
    padding: 1em;
}

nav ul li a:hover {
    color: #FFF; 
    border-bottom: 1px solid #FFF;
    text-decoration: none;  
}

a:link {
    text-decoration: none;
    color: #000;
}

a:visited {
    text-decoration: none;
    color: #000;
}

div span a{
border-style: none;
}

h1, h2, h3 {
    font-size: 16px;
    color: rebeccapurple;
padding-top: 0.5em;
margin-left: 0.5em;}

p{
    font-family: 'Fira Sans', 'arial', sans-serif;
    font-size: 10pt;
    font-weight: 300;
    margin-left: 0.5em;
}

footer {
    background-color: rgb(73,207,177); 
       font-family:'Oswald', 'arial', sans-serif;
    color: #FFF;
    padding: 1em;
    font-size: 14px;
    text-align: center;
   width: 86%;
    margin: auto;
    margin-top: 1em;
}

@media screen and (min-width: 848px) {


header {
    width: 97%;
    height: 105px;  
    background: rgb(73,207,177);
    color: white;
    margin-left: 0.5em;
    padding-top: 10 px;
    }
    
.logomora{
    float:left; margin-top: 0px; margin-left: 20px;
    background-image: url(imagenes/mfa.png);
    background-size: cover;
}
    
    main img{
    width: 100%;
}

nav  {
    float: right;
    width: auto;
    margin-top: 35px;
    margin-right: 20px;
}

ul li {
    display: inline;
    padding-right: 5px;
    padding-left: 5px;
 }

 ul li a {
    width: 90%; 
    color: #000;
    font-family:'Oswald', 'arial', sans-serif;
    font-weight: 400;
    text-transform: uppercase; 
    text-decoration: none;
    font-size: 12px;
    margin: 10px;
    padding-bottom: 5px;
}

nav ul li a:hover {
    color: #FFF; 
    border-bottom: 1px solid #FFF;
    text-decoration: none;  
}

a:link {
    text-decoration: none;
    color: #000;
}

a:visited {
    text-decoration: none;
    color: #000;
}

div span a{
border-style: none;
}


h1{
    font-family:'Oswald', 'arial', sans-serif; 
    font-weight: 400; 
    font-size: 15pt;
    text-transform:uppercase; 
    color: rebeccapurple; 

}

#title{width: 150px; margin-top: 20px; margin-left: 43%; padding-left: 10px; padding-top:10px; padding-bottom:5px; }

.titulomapa{width:150px; text-align: center; margin-top: 20px; padding-top:10px; padding-bottom:5px; margin-left: 42%}

h2{
    font-family: 'Oswald', 'arial', sans-serif;
    font-size: 12pt;
    font-weight: 400;
    text-transform: uppercase;
	color: rebeccapurple;
    padding-bottom: 5px;
    background-size: contain;
}


#uno {width: 230px;}

#dos {background-color: aquamarine; width: 100%; margin-left: -10px; margin-bottom: auto; background-color: white; color: rebeccapurple; text-align:justify; padding:0px;}

#tres {width: 60%; margin-left: 0px; margin-bottom: auto; background-color: purple; color: white; text-align:justify; padding:5px;}

h3{
    font-family:'Oswald', 'arial', sans-serif;
    font-size: 12pt;
    font-weight: 400;
    text-transform: uppercase;
    color:whitesmoke;
    text-align: justify;
    padding-left: 5px;
    background-color: rebeccapurple;
border-color: rebeccapurple;
    display:block;
}

#materias{font-size: 10pt; padding: 5px; padding-left: 10px; margin-bottom: auto;}
#encurso {font-size: 10pt; margin-left: -20px; padding: 0px; padding-left: 10px; margin-bottom: auto;}


p{
    font-family: 'Fira Sans', 'arial', sans-serif;
    font-size: 10pt;
    font-weight: 300;
    padding-top: 8px;

}

#bold2{font-family: 'Oswald', 'arial', sans-serif;
    font-size: 11pt;
    font-weight: 500;
    }

.user{text-transform: uppercase; color: rgb(73,207,177); font-size: 11pt; font-weight: 500}


/*////// CONTENIDO /////////*/

#content-about {margin-top: 20px;}

#content-about #quien { 

float: left;
width: 250px;
height: 180px;
margin-left: 0px;

}

#content-about #que{

float: left;
width: 250px;
height: 180px;
position: relative;  
left:20px;
}

#content-about #materias {

float: right;
width: 320px;
height: 180px;
    left:10px;
margin-right:5px;
}

#content-about #proyecto {

float: left;
width: 340px;
height: 60px;
margin-left: 0px;
}


#textoproyecto {width: 570px; padding-left: 0px; margin: 5px; padding-bottom: 0px;}

aside{margin-top: 230px;}

#content-portfolio{margin-bottom:20px; padding-top: 15px;}

.left{margin-left:20px;}
.center{float:right; margin-right:20px;}

.bottom{height: 180px; margin-top: 580px; margin-bottom:20px; padding-top: 15px; border-top: 2px solid #000 ;}

.bottom2{height: 180px; margin-top: 20px; padding-bottom:20px; padding-top: 15px; border-top: 2px solid #000 ;}

.bottom3{height: 180px; margin-top: 0px; padding-bottom: 20px; padding-top: 15px; border-top: 2px solid #000 ;}

#textodgpc{height: 180px; border-left: 3px solid #000; padding-left: 25px ; margin-right: 300px; float:right;}

footer {
    background:rgb(73,207,177);
    width: 99%; 
    margin: 0px; 
    text-align: left; 
    padding: 5px; 
    height: 80px; 
    float: left;
    
}

footer{
    color: whitesmoke;
    font-family: 'Fira Sans', 'arial', sans-serif;
    font-weight: 400;
    font-size: 13px;
    text-align: left;
}

.logofadu { margin: 8px 20px 8px 100px; width: 5%; float: left; padding-top: 10px;}

}