/* hoja de estilos de numero 2 para determinadas páginas */

@import url(http://fonts.googleapis.com/css?family=Roboto+Condensed:300,400italic,700|Roboto:400,700,300italic);

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


/*pagina de Alumnos*/ 

.txt-gal {width: 70%; margin: 0; float: right; margin-top: 1rem;}

div#nota p {padding-top: 0.5rem;}
.flecha1 {margin-top: 1.5rem;}

.cajauno h1 {color: #2eebd2; font-weight: 300; font-size: 2.5rem; padding-bottom: 1rem; letter-spacing: 0.1rem;}

.gal{
    width: 20%;
    height: 11rem;
    float: left;
    margin-right: 3%;
    margin-top: 0.5rem;
    background-position: center;
    background-repeat: no-repeat;
}

#srg {background-image: url(imagenes/alumnos/srg1.png)}

#srg:hover {background-image: url(imagenes/alumnos/srg2.png)}

#m1 {background-image: url(imagenes/alumnos/MI1.png)}

#m1:hover {background-image: url(imagenes/alumnos/MI2.png)}

#m2 {background-image: url(imagenes/alumnos/MII1.png)}

#m2:hover {background-image: url(imagenes/alumnos/MII2.png)}

/*panel lateral*/

.nav-alumnos {width: 25%; float: right; margin: 1rem; margin-top: 4rem;}

.nav-alumnos li {display: block; list-style: none; margin: 0.5rem; padding: 0.5rem;  background-color: #2eebd2; color: #000; font-family: 'Roboto Condensed', sans-serif; font-size: 1rem; letter-spacing: 0.1rem;}

.nav-alumnos a li:hover {background-color: #f21f58; font-weight: 700; color:#fff;}

.a {width: 33%; height: 5rem; float: left; margin-top: 2rem; background-image: url(imagenes/alumnos/doc1.png); background-repeat: no-repeat; background-position: center;}

.a:hover {background-image: url(imagenes/alumnos/doc2.png);}


/*calendario académico :D*/

/*vamos de lo particular a lo general aca... dia, semana, mes y semestre*/


.dia /*dias comunes*/ {width: 2.5rem; height: 1.5rem; margin: 0.1rem; padding: 0.1rem; border-bottom-style: double; border-right-style: solid; border-right-width: thin; border-color: #077761; float: left;}

.dia1 /*fines de semana*/ {width: 2.5rem; height: 1.5rem; margin: 0.1rem; padding: 0.1rem; border-bottom-style: double; border-right-style: solid; border-color: #2eebd2 ;  border-right-width: thin; float: left; }

.dia2 /*LMNJVSD*/ {width: 2.5rem; height: auto; margin: 0.1rem; padding: 0.1rem; border-bottom-style: double; border-color: #fff; float: left; font-size: 1.5rem; font-weight: 300; text-align: center; color: #077761; font-weight: 700;}

.semana1 { border-bottom-style: double; border-top-style: solid; border-color: #2eebd2; clear: both; width: 20.7rem; overflow: auto;}
.semana { clear: both; width: 21rem; overflow: auto;}

.calenda {width: 21rem; margin: 0.5rem; margin-right: 2rem; float: left;}
.calenda h4 {color: #077761;}

#calendario {width: 48rem; float: left;}

.fecha p{color: #fff; font-weight: 700; font-size: 1rem; background-color: #2eebd2;}

.fecha p:hover {background-color: #f21f58;}

/*notas laterales del calendario*/

#notas {width: 30%; float: right; margin-top: 0.5rem;}

#notas h6 {
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: 300; 
    font-size: 1.5rem;
    letter-spacing: 0.1rem;
    display: block;
    border-bottom-style: solid;
    border-bottom-color: #f21f58;
    color: #f21f58;
    margin-bottom: 1rem;
    }

#notas h2 {font-size: 1.5rem; color:#077761; }

#notas h4 { color:#2eebd2; font-weight: 700; float: left; font-size: 1REM;}

.n2 {clear: both;}

#notas p { width: 75%; float: right; margin-bottom: 1rem;}

.n1 {border-bottom-style: double; border-top-style: solid; border-top-width: thin; border-bottom-width: medium; border-color: #f21f58; padding-top: 0.5rem; padding-bottom: 1rem; overflow: auto; background-image: url(imagenes/fondo1.png); background-size: cover; background-position: right; background-repeat: no-repeat;}

.pc {margin-bottom: 3rem; }

/*galeria de imagenes*/

.gal1 {clear: both; margin-bottom: 1rem; overflow: auto;}

h1.gal2 {display: block; text-align: center; padding: 1rem;  border-style: double; border-bottom-style: dotted; border-color: #2eebd2; color: #f21f58; font-weight: 300; letter-spacing: 0.2rem; clear: both;}

.g1 {height: 15rem; width: 18rem; margin: 1rem; float: left; background-image: url(imagenes/Galeria/fondo.png); background-repeat: no-repeat; background-size: cover; text-align: center; font-size: 8rem; padding-top: 3rem; font-weight: 300; color: rgba(255, 255, 255, 0.88); border-bottom-style: dashed;}

.g1:hover {color: rgba(255, 255, 255, 0); }

#f1:hover {background-image: url(imagenes/Galeria/miniatura1.png); background-repeat: no-repeat; background-size: cover;}
#f2:hover {background-image: url(imagenes/Galeria/miniatura2.png); background-repeat: no-repeat; background-size: cover;}
#f3:hover {background-image: url(imagenes/Galeria/miniatura3.png); background-repeat: no-repeat; background-size: cover;}
#f4:hover {background-image: url(imagenes/Galeria/miniatura4.png); background-repeat: no-repeat; background-size: cover;}
#f5:hover {background-image: url(imagenes/Galeria/miniatura5.png); background-repeat: no-repeat; background-size: cover;}
#f6:hover {background-image: url(imagenes/Galeria/miniatura6.png); background-repeat: no-repeat; background-size: cover;}
#f7:hover {background-image: url(imagenes/Galeria/miniatura7.png); background-repeat: no-repeat; background-size: cover;}
#f8:hover {background-image: url(imagenes/Galeria/miniatura8.png); background-repeat: no-repeat; background-size: cover;}
#f9:hover {background-image: url(imagenes/Galeria/miniatura9.png); background-repeat: no-repeat; background-size: cover;}
#f10:hover {background-image: url(imagenes/Galeria/miniatura10.png); background-repeat: no-repeat; background-size: cover;}
#f11:hover {background-image: url(imagenes/Galeria/miniatura11.png); background-repeat: no-repeat; background-size: cover;}
#f12:hover {background-image: url(imagenes/Galeria/miniatura12.png); background-repeat: no-repeat; background-size: cover;}


/*Académico*/

.w30 {width: 30%; padding: 2%; float: left; border-style: double; color: #077761;}

.w30 h2 {font-size: 1.5rem; font-weight: 700; width: 90%; margin-bottom: 2rem; text-align: center;}

h2.cor {margin: 0; display: block; background-color: #077761; padding: 0.5rem; width: 96%; color: #fff; text-align: center; margin-bottom:1rem; }

.w30 h4 {margin-left: 1rem; font-size: 1.5rem; }

.w30 p {padding: 1rem; color: rgba(0, 0, 0, 0.57); font-size: 0.9rem; margin-bottom: 1rem;}

.w60 {width: 60%; float: right;}

.w100 {width: 100%; clear: both; margin-bottom: 2rem;}

#cursada {width: 48rem; height: 19rem; background-image: url(imagenes/academic/cursada1.png); margin: auto; background-size: contain;}

#cursada:hover {background-image: url(imagenes/academic/cursada2.png);}

.nota-aca {float: right; padding-top: 3rem; }

.nota2 {clear: both; overflow: auto;}

.titular {display: block; width: 100%; background-color: #2eebd2; color: #fff; margin-bottom: 0.5rem;}

/*Trabajos practicos*/

.tp h1 {color: #2eebd2; font-size: 1.8rem; display: block; border-bottom-style: dotted; border-width: medium; border-color: #f21f58; width: 100%; margin-bottom: 1rem;}

.tp1{width: 47%; margin: 1.5%; float: left; overflow:}

.tp2 {width: 11rem; height: 16rem; float: left; margin-right: 2rem; background-size: contain; background-repeat: no-repeat;}

.tp3 h2 {font-size: 1.3rem; color: #077761;}

.tp3 p {font-size: 0.8rem; text-align: justify; margin-bottom: 1rem;}

.tp3 img {float: right; margin-left: 1rem;}

.tp5 {background-image: url(imagenes/tp/tp1.png);}
.tp5:hover {background-image: url(imagenes/tp/tp3.png);}

.tp6 {background-image: url(imagenes/tp/tp2.png);}
.tp6:hover {background-image: url(imagenes/tp/tp4.png);}

.tp3 a img:hover {border-style: double; color: #2eebd2;}



/*contacto*/

#contacoto {margin-top: 2rem;}

#izquierdo {width: 20rem;  float: left;  margin-right: 6rem; overflow: auto; background-image: url(imagenes/fondo1.png); background-position: center; background-repeat: no-repeat;;}

#centro {width: 25rem; float: left;  margin-right: 1rem; overflow: auto; background-color: #077761; border-radius: 1rem; padding: 1rem; padding-top: 2rem; padding-bottom: 1rem;}

#derecho {width: 25rem; float: right;  margin-right: 1rem; overflow: auto;}

#izquierdo h2 {font-size: 1.5rem; color:#2eebd2; float: right; font-weight: 700; margin-bottom: 1rem;}

#izquierdo p {width: 16rem; text-align: left; padding: 0.5rem;; float: right; margin-bottom: 1rem; font-size: 0.8;}

#izquierdo a {color: rgba(255, 255, 255, 0); float: right; margin-bottom: 1rem; margin-right: 1rem;}
#izquierdo a:hover {color: #f21f58; }

.c1 { font-size: 1.5rem;  font-weight: 700; color: #fff; display: block; width: 15rem; background-color: #2eebd2; clear: both; margin-bottom: 0.3rem; float: right; text-align: center;}

.c2 { color: #000; display: block; width: 15rem; background-color: #2eebd2; clear: both; margin-bottom: 0.3rem; float: right; text-align: center;}

.c3 {color: #fff; display: block; width: 15rem; background-color: #077761; clear: both; margin-bottom: 0.3rem; float: right; text-align: center;}

a.c1:hover {color: #fff; background-color: #f21f58;}
a.c2:hover {color: #fff; background-color: #f21f58;}
a.c3:hover {color: #fff; background-color: #f21f58;}


.nombre {background-color: #2eebd2; padding: 0.5rem; width: 9rem; margin-left: 1.5rem; margin-right: 1; border: none; color: #077761; margin-bottom: 1rem;}
.apellido {background-color: #2eebd2; padding: 0.5rem; width: 9rem; margin-left: 1rem; margin-right: 1.5; border: none; color: #077761; margin-bottom: 1rem;}
.mail  {background-color: #2eebd2; padding: 0.5rem; width: 20.2rem; margin-left: 1.5rem; margin-right: 1.5; border: none; color: #077761; margin-bottom: 1rem;}
.comentario {background-color: #2eebd2; padding: 0.5rem; width: 20.2rem; margin-left: 1.5rem; margin-right: 1.5; border: none; color: #077761; margin-bottom: 1rem; height: 4rem;;}
#centro a {color: #fff; display: block; background-color: #f21f58; border-style: double; border-color: #fff; float: right;
margin-right: 2.5rem; width: 4rem; text-align: center;} 

#centro a:hover {background-color: #2eebd2;}



@media all and ( max-width: 22.5rem ) /*para pantallas de menos de 360x640*/
    {
    .sale {display: none;}
    #calendario {width: 22rem; clear: both; margin: auto;} 
    #notas {width: 100%; float: left;}
    .n1 {background-image: none; padding: 2%;}
    #notas h2 {margin-top: 2rem;}
    #notas h6 { margin-bottom: 0;}
        
    }


@media all and (min-width: 22.51rem) and (max-width: 48rem ) /*para pantallas de menos de 768x1024*/
    {
      
    .calenda {margin: 1rem; width: 20rem;}
    #notas {width: 100%; float: left;}
    .pc {width: 31%; margin: 1%;  float: left}
    #notas h6 {clear: both; width: 96%; margin-left: 2%; margin-right: 2%;}
    #calendario {width: 44rem; clear: both; margin:auto;} 
    .n1 {background-image: none; padding: 5%; background-color: #2eebd2; height: 14.5rem;}
    #notas p { width: 100%; }
    #notas h4 { color:#fff; font-weight: 700; font-size: 1REM;}
    
    }

@media all and (max-width: 43rem ) 
    {
    .sale {display: none;}
    #calendario {width: 22rem; clear: both; margin: auto;}

    
    }