*{
margin:0px;
padding:0px;
outline:0px;
}

body {
background-image:url(imagenes/background2.png);
font-family:'Lato',sans-serif;
font-weight:400;
font-size:16px;
}

header{
background-color:rgba(255, 255, 255, 0.79);
width:100%;
max-width:1280px;
margin: auto;
height:50px;
position:fixed;
top:10%;
left:0%;
z-index:10;
display: block;
}

#logo{
position:absolute;
float:left;
display:block;
left:8%;
top:-45px;
}

/*navegacion*/

nav ul {
list-style:none;
font-family:'Raleway', sans-serif;
font-weight:400;
display: block;
}

nav ul li{
line-height:0px;
float:left;
padding:25px 22px 25px 22px;
display:block;
color:black;
position:relative;
left:22%;
font-size:15px;
text-decoration:none;
}

nav ul li a{
text-decoration:none;
color: black;
}

nav ul li:hover{
background-color:#63fbce;
color:white;
}

.submenu {
margin-left: -50px;
position:absolute;
top:100%;
height:0px;
overflow:hidden;
background:white;
box-shadow:2px 2px 15px rgba(136, 136, 136, 0.39);
width: 250px;
}

nav li:hover .submenu {
height:auto;
}

.submenu:hover ul{
background:#63fbce;
color:white;
font-size:15px;
}
    
.vertical{
position: relative;
top: 60px;
width:0px;

}
.vertical ul li{
float: left;
padding:0px 0px 5px 0px;
}

/*fin de navegacion*/


#imgprincipal{
width:100%;
margin:auto;
max-width:1280px;
height: 650px;
z-index:1;
position:relative;
box-shadow:0px 10px 10px #888888;
display:block;
}

.presentacion{
font-family:'Raleway', sans-serif;
font-weight: 300;
font-size: 1.5rem;
line-height:40px;
color:white;
z-index: 2;
position: absolute;
top:350px;
right:0px;
background-color:rgba(99, 251, 206, 0.9);
padding: 20px 140px 20px 20px;
box-shadow:10px 10px 10px #888888;
}

.conoce{
color: white;
font-size: 1rem;
font-weight: 600;
text-decoration: none;
}

.conoce:hover{
color: black;
}

div#contenedor{
width:100%;
max-width:960px;
margin:auto;
height:700px;
overflow: hidden;
}

.fotorama{
width:650px;
height:390px;
display:block;
position:relative;
left: 31%;
top: 77px;    
box-shadow:5px 5px 10px #888888;
}

.propuesta{
width:250px;
position:absolute;    
left:4%;
top:727px; 
font-size:0.8rem;
text-align:center;
line-height:20px;
}

.propuesta h4{
background-color: rgba(99, 251, 206, 0.76);
margin-top:15px;
margin-bottom: 10px;
padding: 10px 0px 10px 0px;
font-family: 'Raleway';
font-size: 1rem;
font-weight:300;
box-shadow:2px 4px 8px #888888;
text-decoration:none;
}

.ingresar{
position:absolute;
top:450px;
left: 0%;
}

.miniaturas{
list-style-type: none;
position: relative;
left: 30%;
top:137px;
}

.miniaturas li{
float: left;
padding:0% 2% 0% 2%;
}

.miniaturas li a:hover{
border-bottom:solid 5px rgba(99, 251, 206, 0.76);
}


footer{
background-color: rgba(0, 0, 0, 0.49);
width: 100%;
margin-top: 50px;
clear: both;
z-index:20;
height:220px;
padding: 20px 0px 20px 50px;
}

footer h4{
font-family:'Lato', sans-serif;
font-weight: 700;
color: rgba(99, 251, 206, 0.76);
line-height:20px;
clear: both;
}

footer li{
list-style-type: none;
font-size: 14px;
font-family: 'Lato', sans-serif;
font-weight: 300;
line-height:25px;
color: white;
clear: both;
}

.mapa{
width:150px;
position: relative;
margin-left:4%;
}
.mapa1{
width:150px;
margin-left: 23%;
margin-top: -95px;
position: absolute;
}

.mapa2{
width:150px;
margin-left: 38%;
margin-top:-95px;
position: absolute;
}

.mapa li:hover{
color: black;
}

.mapa1 li:hover{
color: black;
}

.mapa2 li:hover{
color: black;
}

.contactanos{
float: right;
position: relative;
width: 180px;
top: -135px;
right:20%;
clear: both;
}

.pie{
position:relative;
font-family: 'lato',sans-serif;
font-weight:300;
font-size: 0.6rem;
color: rgba(99, 251, 206, 0.76);
line-height:140%;
text-align:center;
top:70px;
width: 450px;
display: block;
}

/*fin index*/
/*inicio propuesta*/

div#contenedor2{
width:100%;
max-width:960px;
margin:auto;
height:810px;}

main h4{
display: block;
background-color: rgb(99, 251, 206);
color: white;
padding: 10px 10px 10px 10px;
font-family:'Raleway',sans-serif;
font-size: 1.3rem;
font-weight:500;
box-shadow:2px 4px 8px #888888;
width:290px;
position:relative;
float: right;
right:8%;
top:150px;
z-index:10px;
}

div.bloquetxt{
display: block;
background-color: rgba(99, 251, 206, 0.76);
width:890px;
height:330px;
position:relative;
left:5%;
top:175px;
z-index:-2;
}

.parrafo1{
font-family: 'lato',sans-serif;
font-size: 0.8rem;
font-weight:400;
width: 250px;
position:absolute;
top:30px;
left:5%;
}

.parrafo2{
font-family: 'lato',sans-serif;
font-size: 0.8rem;
font-weight:300;
width: 250px;
position:absolute;
top:125px;
left:5%;
}

#grupo{
position:relative;
float:right;
right: 2%;
top:-170px;
width:500px;
z-index:-1;
clear: both;
}

.seccion2{
display: block;
list-style-type: none;
position: absolute;
right:1%;
top:560px;
float: right;
clear: both;
width: 600px;
}

.seccion2 li{
float: left;
padding:0% 0% 0% 1%;
}

.seccion2 li a:hover{
border-bottom:solid 5px rgba(99, 251, 206, 0.76);
}

.lista{
position:absolute; 
width:260px;
top:560px;
left:5%;
display: block;
font-family: 'Lato',sans-serif;
font-size: 1rem;
font-weight: 400;
color: white;
}

.lista ul{
list-style-type: none;
}

.lista ul li{
background-color: rgba(99, 251, 206, 0.76);
padding: 10px 0px 10px 20px;
margin:0px 0px 5px 0px ;
}

.lista li:hover{
background-color: grey;
}

/*fin propuesta
inicio galeria*/

div#contenedor3{
width:100%;
max-width:960px;
margin:auto;
height:960px;}

.galeria{
position: relative;
top:250px;
float:left;
left: 8%;
display: block;
font-family: 'Lato',sans-serif;
font-size: 1rem;
font-weight: 400;
color: white;
}

.galeria ul{
list-style-type: none;
}

.galeria ul li{
background-color: rgb(99, 251, 206);
text-align: center;
padding: 10px 10px 10px 10px;
margin:5px 0px 0px 0px ;
}

.galeria li:hover{
background-color: grey;
}

.imagenes{
position: relative;
top: 202px;
left:8%;
width:640px;
margin: auto;
list-style:none;
overflow: hidden;
}

.imagenes ul li{
float: left;
display: inline-block;
padding: 2px 2px 2px 2px;
}

#otrasgalerias{
position: relative;
top: -30px;
float: left;
left: 5%;
}

/*fin galeria
inicio docentes*/

div#contenedor4{
width:100%;
max-width:960px;
margin:auto;
height:1000px;
overflow: hidden;}

.docentes{
position:relative;
top:180px;
float:left;
left: 3%;
right: 8%;
margin: auto;
list-style:none;
overflow: hidden;
}

.docentes ul li{
float: left;
display: inline-block;
padding: 2px 2px 2px 2px;
}

/*fin docentes
inicio cronograma*/

.cronograma{
width: 180px;
position:relative;
top:220px;
left: 3%;
list-style:none;
overflow: hidden;
}

.cronograma2{
width: 600px;
position: relative;
font-family: 'Lato',sans-serif;
font-size: 0.8rem;
top:-220px;
left:25%;
line-height: 1.2rem;
}

.cronograma2 ul{
list-style: none;
}

.cronograma2 ul li{
width: 200px;
float: left;
padding:5% 5% 5% 5%;
border-top: 5px solid rgba(99, 251, 206, 0.9);
}