/* HOJA DE ESTILOS VM20 */

body {background-color: rgb(0,0,0);
     font-family: 'Open Sans', sans-serif;
    font-size: 10pt;   

}

#pagina {margin: auto; width: 990px;}

img {
  max-width: 100%;
  max-height: 100%;
}


.titulos{ font-size: 2rem;
    color: rgb(211,212,0);
   }

.textosdestacados1{font-family: 'Open Sans', 800;
        font-size: 0.8rem;
    font-weight: 800;
    color: rgb(211,212,0);}


/* header*/

header{height: 7.5rem; border-bottom: solid 0.5rem; border-bottom-color: rgb(211,212,0);margin-bottom: 1.5rem; padding-bottom: 1.2rem; }

#logo h1{ font-family: 'Open Sans', 800;
    font-weight: 800;
        font-size: 3.5rem;
    margin: 0rem;
    margin-left: 3rem;
    color: rgb(211,212,0);
}
#logo h2{ font-family: 'Open Sans', 700;
            font-size: 1.8rem;
    font-weight: 700;
   margin: -0.5rem;
    margin-left: 3rem;
    padding-top: 0rem;
    color: rgb(88,100,244);
            
}

#logo{float: left;}

#arriba {float:left; width: 60rem;}

/* iconos */
#redes{height:2rem;
float: left;margin-top: 4.7rem;
padding-left: 1.2rem;}



.redes-item{
padding: 1rem;
color: #5864F4;

}

.redes-item:hover{
color:#D3D400;
    
}

/* ---->FIN header*/


/*nav*/
a {text-decoration: none;}
nav {font-family: 'Open Sans', 700;
    font-weight: 700;
}

li{list-style: none;}
section nav{margin-left:0rem; width: 66%; }
section nav ul li { float: left; margin-top: 0rem;
}

 section nav ul li a h5 { background-image: url(imagenes/nivel1.jpg); background-repeat: no-repeat; 
 }

h3 {
    height: 3rem;
    margin-top: 0rem;
    margin-right: 0.2rem;
    margin-left: 0.2rem;
    margin-bottom: 0.2rem;
    padding-top: 0.2rem;
    padding-bottom: 3rem;
    padding-left: 0.4rem;
    padding-right: 2.8rem;
    width: 4rem;
    border: solid;
    border-width: 0.5rem 0 0.5rem 0;
    border-color: rgb(88,100,244);
    color: rgb(88,100,244);
    font-size: 1rem;

     
}

h4 {
    height: 3rem;
    margin-top: 0rem;
    margin-left: 0.2rem;
    margin-right: 0.2rem;
    margin-bottom: 0.2rem;
    padding-top: 0.2rem;
    padding-bottom: 3rem;
    padding-left: 0.4rem;
    padding-right: 2.8rem;
    width: 4rem;
    border: solid;
    border-width: 0.5rem 0 0.5rem 0;
    border-color: rgb(211,212,0);
    color: rgb(211,212,0);
     font-size: 1rem;
}

h5 {
    font-size: 2rem;
    height: 5rem;
    margin-top: 0rem;
    margin-left: 0.2rem;
    margin-right: 0.2rem;
    padding-top: 0.2rem;
    padding-bottom: 8.8rem;
    padding-left: 0.8rem;
    padding-right: 6rem;
    width: 8rem;
    color: rgb(211,212,0);
     border: solid;
    border-width: 0.5rem 0 0.5rem 0;
    border-color: rgb(211,212,0);
  
}

.nivel2 { margin-top: -10.6rem; background-image: url(imagenes/nivel2.jpg);background-repeat: no-repeat}
.quienessomos {margin-top: -10.6rem}
.galeria {margin-top: -2.8rem; 
    color: rgb(255,59,130); border-color: rgb(255,59,130);}

aside{float: right; width: 34%; margin-top: -18.4rem; }
#imgrelleno{margin-top: 0.2rem;}


#relleno {margin-left: 0.2rem;width: 14.8rem; margin-top: -2.8rem; }
#relleno1 { width: 61%; float: left; margin-left: -37.8rem; margin-top: 5rem; height: 12.4rem; border-bottom: solid 1.9rem; border-bottom-color: rgb(211,212,0); margin-bottom: 2rem;}


nav ul li a h3:hover{
background-color: rgb(88,100,244);
color: black;
}

nav ul li a h4:hover{
background-color: rgb(211,212,0);
color: black;
}

nav ul li a h5:hover{
color:black;
}

.galeria:hover{
color:black;
background-color: rgb(255,59,130);
}


/*FOOTER*/


footer { 
    border-top: solid 0.5rem; border-color: rgb(255,59,130);
         height: 12rem;
                padding-top: 0.4rem;
    font-family: 'Open Sans', 700;
    font-weight: 700;
        font-size: 1rem; 
    clear: both;
     margin-top: 2rem;
}

footer ul li a {color: rgb(211,212,0);
font-family: 'Open Sans';
        font-size: 0.8rem;
    font-weight: 600;
    text-decoration: underline;
    
}
footer ul li{margin-left: -2.5rem; }

#footerinformacion {float: left; margin: 0.5rem; margin-right: 2rem; }
#footergaleria {float: left; margin: 0.5rem; margin-right: 2rem; }
#footercontacto {float: left; margin: 0.5rem; margin-right: 2rem;}
#footerexposiciones {float: left; 
        color: rgb(211,212,0);
        font-family: 'Open Sans';
        font-size: 0.8rem;
        font-weight: 600;
         margin: 0.5rem;
         margin-right: 2rem;}

footer img {float: right; margin: 2rem;}


footer .textosdestacados1{font-family: 'Open Sans', 800;
        font-size: 0.8rem;
    font-weight: 800;
    color: rgb(211,212,0);}

footer ul li a:hover{color: rgb(255,59,130); }




    


/*ULTIMA CLASE*/

#accesos h3{float: left; margin-left: 0rem; width: 4rem; height: 3rem; background-color: rgba(88, 100, 244, 0.70); color:rgb(0,0,0); font-size: 1.3rem; margin-bottom: 0rem;}

#ultimaclase { width: 25rem; height: 27rem; float: left;
    background-color: rgb(88,100,244);
margin:0rem;
}

#imguc {width: 7.8rem;
    margin-left: 0.2rem; margin-top:0rem; margin-bottom: 0.4rem; height: 19.1rem; 
}
.proxclase:hover{background-color: rgb(211,212,0);
color: black;}


#relleno2 {float: left; width: 30.8rem; height: 7.2rem; 
margin-top:0rem;
margin-left: 2.2rem;}
#relleno3 { width: 38.8rem; float: left; height: 7.2rem;
    margin-top: 0.2rem; margin-left: 2.2rem;  margin-bottom: 1rem;}

.proxclase{float: left; margin-left: 0.40rem;margin-top: 0rem;}

#coluc{width: 20rem; height:34.2rem; ; margin-left: 0.4rem; margin-top: -24.9rem; border-bottom:solid 0.5rem; border-color: rgb(88,100,244);}
aside #coluc{width: 100%;}

#cuadradosrelleno{width: ; height:7.2rem; ; margin-left: 0.4rem; margin-top: 0.4rem; float: right; }


/*FIN---->ULTIMA CLASE*/


/* BOTON ATRAS*/

#botonatras {
    width: 7.2rem;
    height: 8rem;
    background-image: url(imagenes/atras.svg); background-repeat: no-repeat;
    margin-left: 0.2rem;
}

.atras li a{ padding-top: 5.7rem; padding-left: 3.4rem;
    font-size: 1.2rem;
    color: rgb(255,59,130); border-bottom: solid 0.3rem;   
}
.atras li{padding-top: 5.4rem;}

.atras li a:hover{color:black;background-color: rgb(255,59,130);}

/* FIN---->BOTON ATRAS*/


/*MATERIAL*/
#paginamaterial section{width: 66%; height: 55rem; float: left;}
 section {font-family: 'Open Sans', 800;
    font-weight: 800;}



#accesos h4{float: left; margin-left: 0rem; width: 4rem; height: 3rem; background-color: rgba(211,212,0,0.7); color:rgb(0,0,0); font-size: 1.3rem; margin-bottom: 0rem;}

#accesos{width: 7.8rem;height: 27rem; float: left; }
#accesos ul {width: 4.6rem; float: left; margin-top: 0rem; }
#accesos ul li{border: solid;
    border-width: 0.3rem 0 0.3rem 0;
    border-color: rgb(211,212,0);
    margin-top: 0.7rem;
    padding-bottom: 0.3rem;
    padding-top: 0.3rem;
    
}
#accesos ul li a{color: rgb(211,212,0); padding-bottom: 0.6rem;
    padding-top: 0.6rem; padding-right: 2rem;
}

#accesos ul li a:hover{color: rgb(88,100,244);}
#accesos ul li:hover{border-color: rgb(88,100,244);}


.pmaterial{margin-top: 2rem; margin-left: 2rem;margin-right: 2rem;}

#materialyatras{float: left; width: 7.6rem; margin-left: 0.4rem;margin-top:0rem;}

#material li {width: 7.5rem; margin-bottom: 0.5rem;}

#material li a h3:hover{font-size: 4.6rem;color: black; background-color: rgb(88,100,244);}

#materialfondo {float: left;  margin-left: 0.4rem; margin-top: 3.6rem; border-top: solid 0.5rem; border-color: rgb(255,59,130); }
#materialfondo img {padding-top: 0.2rem; padding-bottom: 0.2rem;}

#colmat{width: 100%;margin-top: 0rem;margin-left: 0.4rem;}
#paginamaterial aside{margin-top:0rem;}



/*MATERIAL N1*/

.n1{
    font-size: 4.6rem;background-color:rgb(88,100,244); color: rgb(255,59,130); }


/*video*/
iframe {margin-left: 0rem;margin-top: 
2.8rem; margin-bottom: 
1rem;float:left; padding-top: 2rem;
    
}
/*fin video*/


#colmatn1{width: 100%; margin-left: 0.4rem;margin-top: 0rem; height: 57rem;}
#horarios{width: 20rem; height: 12rem;margin: 0rem;}
#colmatn1 #horarios p{color: rgb(211,212,0); font-size: 0.8rem; width: 20rem; margin: 
0rem;}

#colmatn1 .textosdestacados1{font-size: 0.8rem;color: rgb(211,212,0);}

#recomendaciones {background-color: rgb(255,59,130); width: 19.8rem; height: 18rem; padding-left: 0.4rem;margin: 0rem;}
#recomendaciones h4{font-size: 1rem; border: 0; margin:0rem; height: 1rem; width:11rem; padding-bottom: 1rem; margin-left:-0.4rem; padding-top: 0.6rem;
}
#colmatn1 #recomendaciones p{ font-size: 0.8rem; width: 18.2rem; margin: 
0rem;padding-left: 0.2rem; padding-right: 0.4rem;}

#cuadradosn1{width: 16.8rem; height: 8rem; margin-top: 0.6rem;padding-bottom:0.6rem;}

#condiciones{background-color: rgb(255,59,130); width: 19.8rem; height: 17rem; padding-left: 0.4rem;margin: 0rem; margin-bottom: 0.4rem;}
#condiciones h4{font-size: 1rem; border: 0; margin:0rem; height: 2.3rem; width:16rem; padding-bottom: 0rem; margin-left:-0.4rem; color: rgb(0,0,0); padding-top: 0.6rem;
}
#colmatn1 #condiciones p{ font-size: 0.8rem; width: 18.2rem; margin: 
0rem;padding-left: 0.2rem; padding-right: 0.4rem;}
#condiciones .textosdestacados1{font-size: 0.8rem;color: black;}

#materialfondon1 {float: left;  
    margin-left: 0.4rem; 
    margin-top: 3.6rem; border-top: solid 0.5rem; border-color: rgb(255,59,130); }


#materialfondon1 img {padding-top: 0.2rem; padding-bottom: 0.2rem;}


#rellenomn1{float: 
left; width: 61rem; height: 
    42rem; margin-top:0rem; margin-left: 
        0.5rem;

}


#rellenomn1 img{padding-bottom: 
0.6rem;}

/*---->FIN MATERIAL N1*/

/*QUIENES SOMOS*/

#paginaquienessomos section{width: 66%; float: left; margin-bottom: 1.5rem; }


#paginaquienessomos h4 { margin-top: 0rem; float: left;}

#paginaquienessomos #ultimaclase{background-color: rgb(211,212,0);height: 28.9rem;}

#paginaquienessomos p{margin: 1.5rem;}

#materialyatras{float: left; width: 7.6rem; margin-left: 0.4rem;margin-top:0rem;}

#somosyatras{float: left; width: 7.6rem; margin-left: 0.4rem; margin-top:0;
}


#somosyatras h3{
    color: rgb(255,59,130);
    margin-top: 0rem;
    border-width: 0.5rem 0 0.5rem 0;
    border-color: rgb(255,59,130);
}

#somosyatras li a h3:hover{font-size: 1.4rem;color: black; background-color: rgb(255,59,130);}


#paginaquienessomos aside {margin:0rem;padding-left: 0.4rem; width: 20.6rem;}


/*-FIN--->QUIENES SOMOS*/


/*DOCENTES*/

#paginaquienessomos1 section{width: 66%; float: left; margin-bottom: 1.5rem; }


#paginaquienessomos1 h4 { margin-top: 0rem; float: left;}

#paginaquienessomos1 #ultimaclase{background-color: rgb(255,59,130);height: 15rem;}

#paginaquienessomos1 p{margin: 1.5rem;}
#paginaquienessomos1 .textosdestacados2{color: rgb(211,212,0);}

#paginaquienessomos1 section img{margin-left: 7.8rem; float: left; width: 32.8rem; margin-top: -11.2rem;}

#paginaquienessomos1 h3{background-color:  rgba(255,59,130,0.7);
    color: black;
    margin-top: 0rem;
    border-width: 0.5rem 0 0.5rem 0;
    border-color: rgb(255,59,130);
    font-size: 1.2rem;
}



#paginaquienessomos1 aside {margin:0rem;padding-left: 0.4rem; width: 20.6rem;height: 48.8rem;}


/*-FIN--->DOCENTES*/



/*--MAPA TEMATICO--*/

#mapa{width: 8rem; height: 30rem; float: left; background-color: rgb(88,100,244); margin-right: 0.6rem; margin-bottom: 2rem;}
#mapa .titulos{font-size: 1.3rem; color: rgb(0,0,0);
                 }
#mapa .titulos1{font-size: 1.3rem; color: rgb(211,212,0); border-color: rgb(211,212,0);}

#mapa ul {padding: 0.4rem; margin-top: 0.5rem;
}

#mapa li { margin-bottom: 4rem;
border: solid;
               border-width: 0.5rem 0 0.5rem 0;
    border-color: black;}

#mapa li a .titulos:hover{color: rgb(211,212,0);}
#mapa li:hover { 
               border-width: 0.5rem 0 0.5rem 0;
    border-color: rgb(211,212,0);}



#mapa1{width: 8rem; height: 30rem; float: left;background-color: rgb(211,212,0); margin-right: 0.6rem;margin-bottom: 2rem;}

#mapa1 .textosdestacados1{font-size: 0.9rem; color: rgb(0,0,0);}
#mapa1 .textosdestacados2{font-size: 0.9rem; color: rgb(255,59,130);}

#mapa1 ul {padding: 0.4rem; margin-top: 0.5rem;
}

#mapa1 li { margin-bottom: 0.4rem;
border: solid;
               border-width: 0.4rem 0 0.4rem 0;
    border-color: black;}

#mapa1 .destacados2{border-color: rgb(255,59,130);}


#mapa1 li a .textosdestacados1:hover{color: rgb(255,59,130);}
#mapa1 li:hover { 
    border-color: rgb(255,59,130);}


#mapa2{width: 15rem; height: 30rem; float: left; margin-right: 0.6rem;margin-bottom: 2rem;}

#mapa2 p{color: rgb(255,59,130); padding: 0.4rem;}

.asidemapa{margin: 0rem;}
#colmapa{ width: 21rem;}





/*--MAPA TEMATICO-- IMPRESION-----*/

p .titulos1{color:rgb(211,212,0);}


/*--MAPA TEMATICO-- INSUMOS-----*/


#insumos{width: 8rem; height: 19rem; float: left; margin-right: 0.6rem;margin-bottom: 2rem;padding-top: 11rem;}
#insumos h4{border: none; padding-bottom: 3.8rem;}

.pinsumos{font-size: 0.75rem; width: 7rem;float: left; padding: 0rem; margin-left: -2rem;}
#imginsumos{float: right; width: 8rem; margin:0rem;}


















/*----GALERIA-----*/
#paginagaleria{width: 100%; height: 40rem; background-color: rgba(255,59,130,0.7);float: left;}
#accesos .galeria {margin-top: 0rem; 
    color: rgb(0,0,0); border-color: rgb(255,59,130); background-color: rgba(255,59,130,0.7);}

#paginagaleria li{font-family: 'Open Sans', 800;
        font-size: 0.8rem;
    font-weight: 800; }

#slide{width: 35rem; height: 25.5rem; float: left; margin-left: 8.5rem;}
.bxslider{width: 35rem;height: 24.4rem; float: left; background-color: rgb(255,59,130);}
.bxslider li{width: 100%; height: 100%;}
script{width: 50rem; height: 25rem;}



/*----FIN GALERIA-----*/



/*----NIVEL 1-----*/

#niveles h5{ background-image: url(imagenes/nivel1.jpg); background-repeat: no-repeat; border-color: rgb(88,100,244);float: left; margin-top: 0rem;
 }

#niveles #accesos ul{float: right; margin-right: 0.6rem; margin-top: -3rem;}

#niveles section{width: 66%; float: left;margin-top: 0rem;margin-bottom: 2rem;}
#niveles section #accesos{width: 15.8rem; float: left; height: 35rem;}
#sectionnivel1 {width: 17rem; float: left;background-color: rgb(88,100,244);height: 40.2rem;
margin-top: 0rem;}

#sectionnivel1 p{font-size: 0.7rem;margin: 1rem;}
#sectionnivel1  .titulos1{border: none;margin: 1rem; padding-bottom: 0.2rem; width: 15rem;
    font-weight: 800;
        font-size: 1.2rem; }

#imgnivel1{float: left; margin-left: 0.6rem;height: 40.2rem;}

#niveles aside{margin-top: 0rem; width: 21rem; border-bottom: solid 0.4rem;border-bottom-color: rgb(255,59,130);}

#nivelbotones {float: right; width: 15.8rem; margin-right: 0.6rem;}
#nivelbotones li{float: right; margin-right: 0rem;}
#nivelbotones #botonatras{margin-left: 0.8rem; height: 7.3rem;}

#nivelbotones li h4:hover{font-size: 2rem;background-color: rgba(211, 212, 0, 0.7); color: rgb(0,0,0);}
#nivelbotones h4 {background-color: black; color: rgb(211,212,0);}

/*---- FIN NIVEL 1-----*/

/*----NIVEL 2-----*/

#niveles .nivel2 { margin-top: 0rem; background-image: url(imagenes/nivel2.jpg);background-repeat: no-repeat; border-color: rgb(211,212,0);}


#sectionnivel2 {width: 17rem; float: left;background-color: rgb(255,59,130);height: 40.2rem;
margin-top: 0rem;}

#sectionnivel2  .titulos1{border: none;margin: 1rem; width: 12rem;
    font-weight: 800;
        font-size: 1.5rem; padding-bottom: 6rem;}

#sectionnivel2 .textosdestacados2{color: rgb(211,212,0);float: right;margin-right: 1rem; margin-top: -3.5rem;}

#niveles .niv2 {border-bottom:0rem; border-color: black; }

/*---- FIN NIVEL 2-----*/

/*MEDIA*/
#media{display:none;}

@media all and (min-width:1px) and (max-width:600px){
#pagina{width:600px;}
body{width:320px;}
#media{display:block;}

 
header{height: 5rem; border-bottom: solid 0.4rem; border-bottom-color: rgb(211,212,0);}

#logo h1{
    font-size: 1.5rem;
    margin: 0rem;
    margin-left: 1rem;}
    
#logo h2{
    font-size: 1rem;
    margin-left: 1rem;
    padding-top: 0.2rem;}

#logo{float: left;}

#redes{display:none;}
    
section nav{width: 66%; }
section nav ul li { float: left; margin-top: 0rem;}

h3 {
    height: 1rem;
    width: 1.5rem;
    border-width: 0.5rem 0 0.5rem 0;
    font-size: 0.7rem;}

h4 {
    height: 1rem;
    width: 1.5rem;
    font-size: 0.7rem;}

h5{display:none;}   
aside{display:none;}    
footer{display:none;}
#relleno{display:none;}
#relleno1{display:none;}
.quienessomos {display:none;}
.galeria{margin-top: -0rem;}

#media img{margin-left: 2.6rem;
margin-top: 0.4rem;width: 320px;}
    
#bienvenidos2{
    width: 311px;
      font-weight: 800;
    font-family: 'Open sans';
    padding:0.3rem;
    margin-top: 0.4rem;
    padding-left: 0.3rem;
    margin-left: 2.6rem;
background-color:rgb(255,59,130);
color:rgb(211,212,0);}

#objetivos2{width: 311px;
      font-weight: 800;
    font-family: 'Open sans';
    padding:0.3rem;
    margin-top: 0.4rem;
    padding-left: 0.3rem;
    margin-left: 2.6rem;
background-color:rgb(88,100,244);
color:rgb(211,212,0);}

#catedra2{width: 311px;
      font-weight: 800;
    font-family: 'Open sans';
    padding:0.3rem;
    margin-top: 0.4rem;
    padding-left: 0.3rem;
    margin-left: 2.6rem;
background-color:rgb(211,212,0);
color:rgb(88,100,244);}    
}