@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Open+Sans:700|Poppins:300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i');

* {
    margin: 0;
    padding: 0;
}

/*--- Menu Hamburguesa ---*/

nav ul li {
    font-family: Poppins;
    font-size: 0.9em;
    font-weight: 700;
    list-style-type: none;
    line-height: 2rem;
    position: relative;}

nav ul li ul {
    position: absolute;
    background-color: #fff;
    transition: 0s all;
}

nav ul li ul li {
    width: 15em;
}

nav ul li a {
    text-decoration: none;
    color: grey;
    padding: 0 2rem;
    display: block;
    transition: 0s all;
    transition: 
}

nav ul li a:hover {
    background-color: black;
    color: #fff;
}

nav ul#principal li:hover>ul {    
    max-height: 500px;
    overflow: visible;
}

nav ul#hamburguesa>li { line-height: 0;}

nav ul#hamburguesa li:hover>ul {
    max-height: 500px;
    overflow: visible;
}

ul#principal {
    background-color: white;
    display: flex;
    flex-direction: column;
}

ul#principal li {
    border-bottom: 0.0px solid #ccc;
}

ul#principal li ul, ul#principal {
    max-height: 0;
    overflow: hidden;
}

ul .secundario {
    top: 0%;
    left: 100%;
    z-index: 1;
    max-height: 0;
    overflow:visible;

}


/* --- ENCABEZADO HOME ---*/

.homeuser {
    display: flex;
    margin-top: 2em;
    margin-bottom: 2em;
    flex-direction: column;
    align-items: center;
}


/*--- ENCABEZADO ---*/

header{ 
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1;
}
.headcnt {    
    display: flex;
    justify-content: center;    
}

.encabezado {  
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;  
    align-items:center;
    justify-content: space-between;
    padding: 1em;
    background-color: rgba(255, 255, 255, 0.37);}

.socialhead img {
    max-height: 3.5em;

}

.sui {
    width:200px;
}


h1{ color: #ffffff;
    font-family: 'Poppins', sans-serif;
    font-weight: 700;
    text-align: center;
    font-size: 2.7em;
    padding: 0.5em;

}

.sombreado {
    -webkit-box-shadow: inset 0px 47px 27px -41px rgba(0,0,0,0.24);
    -moz-box-shadow: inset 0px 47px 27px -41px rgba(0,0,0,0.24);
    box-shadow: inset 0px 47px 27px -41px rgba(0,0,0,0.24);}



/*--- FIN ENCABEZADO ---*/





/* TEXTOS ------------------*/

.txt1{ 
    color: #ffffff;
    font-family: 'Poppins', sans-serif;
    font-weight: 700;
    text-align: center;
    font-size: 1.5em;
    padding: 0.5em;
    line-height: 0em;
}

.txt2{ 
    color: #ffffff;
    font-family: 'Poppins', sans-serif;
    font-weight: 700;
    text-align: center;
    font-size: .8em;
    letter-spacing: 0.2em;
    padding: 0.8em 1em;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;    

}
.txt3{ 
    color: #ffffff;
    font-family: 'Poppins', sans-serif;
    font-weight: 300;
    text-align: center;
    font-size: 1em;
    padding: 0.5em;

}
.txt4{ 
    color: #ffffff;
    font-family: 'Poppins', sans-serif;
    font-weight: 300;
    text-align: center;
    font-size: .6em;
    padding: 0.5em;  
}

.txt8 { 
    color: #fff;
    font-family: 'Poppins', sans-serif;
    font-family: 'Poppins', sans-serif;
    font-weight: 300;
    text-align: center;
    font-size: 2em;
}


.txt9 { 
    color: #fff;
    font-family: 'Poppins', sans-serif;
    font-weight: 300;
    text-align: center;
    font-size: 1em;
    line-height: 1.3;
    padding-left: 2em;
    padding-right: 2em;
}


.txt11 { 
    color: #666;
    font-family: 'Poppins', sans-serif;
    font-weight: 700;
    text-align: center;
    font-size: 0.6em;
    line-height: 1.3;
}

.txt13 { 
    color: #333;
    font-family: 'Poppins', sans-serif;
    font-weight: 300;
    text-align: left;
    font-size: 0.8em;
    line-height: 1.3;
}

.txt14 { 
    color: #808080;
    font-family: 'Poppins', sans-serif;
    font-weight: 300;
    text-align: left;
    font-size: 0.8em;
}
.txt15 { 
    color: #999;
    font-family: 'Poppins', sans-serif;
    font-weight: 700;
    text-align: left;
    font-size: 0.9em;
}

.txt16 { 
    font-family: 'Poppins', sans-serif;
    font-weight: 300;
    text-align: center;
    font-size: 0.8em;
    color: #808080;
}

.txt17 {

    font-family: 'Poppins', sans-serif;
    font-weight: 300;
    text-align: center;
    font-size: 1em;
    color: #fff;

    margin-left: auto;
    margin-right: auto;
}
.txt18 { 
    color: #808080;
    font-family: 'Poppins', sans-serif;
    font-weight: 300;
    text-align: left;
    font-size: 0.6em;
    line-height: 1.6em;
}


.txt50{ 
    color: rgba(160, 78, 138, 0.59);
    font-family: 'Poppins', sans-serif;
    font-weight: 300;
    text-align: center;
    font-size: .7em;
    padding: 0.5em;  
}

.txt50_alt{
    color: #a29898;
    font-family: 'Poppins', sans-serif;
    font-weight: 300;
    text-align: center;
    font-size: .7em;
    padding: 0.5em;  
}

.txt51 { 
    padding: 0.9em 1em;
    color: #646262;
    font-family: 'Poppins', sans-serif;
    font-weight: 300;
    text-align: center;
    font-size: .8em;
    padding-bottom: 1em;
    display: flex;
    justify-content: flex-start;
}


.txt52b { 
    color: white;
    text-align: left;
    background: rgba(99, 54, 99, 0.6);
    color: rgb(255, 255, 255);
    padding: 1em;
    font-family: 'Poppins', sans-serif;
    font-weight: 600;
    font-size: .7em;
    padding: 0.5em;
    line-height: 1.6em;
    margin: 1em 3em 0em 0em;
    border-bottom: 0.1px solid #a04e8a;
}


.txt53 { 
    padding: .4em .5em;
    color: white;
    font-family: 'Poppins', sans-serif;
    font-weight: 300;
    font-size: .7em;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
}


.txt55{
    margin-bottom: -.3em;
    color: black;
    font-family: 'Poppins', sans-serif;
    font-weight: 300;
    font-size: 2em;
    display: flex;
    flex-direction: row;

}

.txt56{
    padding: 0;
    color: black;
    font-family: 'Poppins', sans-serif;
    font-weight: 500;
    font-size: .9em;
    display: flex;
    flex-direction: row;

}


/* FIN TEXTOS ------------------*/



/* MAIN */

.left {
    text-align: left;
    padding-left: 0;
}

a {
    text-decoration: none;   
}

.grisesito {
    background-color: #cecece;
}

/* --- LOG IN --- */

input {
    background-color:#222; 
    border:0;
    border-bottom: 0.2em solid #000;
    text-align: center;
    font-size: 1em;
    font-family: 'Poppins', sans-serif; 
    margin:0.5em;
    width: 20em;
    height: 2.5em;
}

input::placeholder {
    color: #555;
}
.login {
    display: flex;
    flex-direction: column;
    align-items: center;
}
button {
    background-color: white;
    border:0;
    font-family: 'Poppins', sans-serif; 
    font-weight: 700;
    color:#000;

    height: 3em;
    width:10em;
    font-size: 0.7em;
    margin-top: 0.5em;
    letter-spacing: 0.07em;
}

button:hover {
    background-color: #000;
    color:white;
}

.caja {
    background-color: #dedede

}

/* --- FIN LOG IN --- */


body {
    min-height: 400px;
    margin-bottom: 0px;
    clear: both;
    height: auto;
    background: url(img/bg1.jpg) no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
.containerbtn {
    display: flex; 
    align-content: center;
    width: 20em;
    margin-left: auto;
    margin-right: auto;
}

/* cols */

.col-main { 
    color: black;
    flex: 1;  

}  


.col-main2 { color: black;
    flex: 2;  
}  

.colpad {
    padding: 1em;
}

.container {
    max-width: 50em;
    margin-right: auto;
    margin-left: auto;
    padding-top: 13em;

}

.container1 {
    padding-top: 6em;
    max-width: 50em;
    margin-right: auto;
    margin-left: auto;
}


.container2b {   
    padding-bottom: 5em;
}

.container2 {
    max-width: 50em;
    margin-right: auto;
    margin-left: auto;
    padding: 1.5em;
}

.space {
    padding-top: 12em;
}
.space1 {
    padding-top: 6em;
}

main {
    padding-bottom: 1.5em;
}

.mainnopadding {
    padding: 0;
}

.boton { 
    display: flex;
    flex-direction: column;
    align-content:center;
    justify-content:center;
    padding: 1em;
}


.portada {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    padding-bottom: 2em; 
}


.percent { 
    width: 50%;
    margin-left: auto;
    margin-right: auto;
    align-content: center;
}



.destacado1 {
    background: #444;
    color: #fff;
    padding: 1em;
    font-family: 'Poppins', sans-serif;
    font-weight: 700;
    text-align: center;
    font-size: .9em;
    padding: 0.5em;
    line-height: 1em;
}


.destacado2 {    
    color: white;
    padding: 1em;  

}

.destacado2:hover {
    background: #333;
    color: white;
}

.destacado3 {
    background-color: #333;
    text-align: center;
    color: white;
    font-family: Poppins;
    font-weight: 700;
    font-size: 0.7em;
    letter-spacing: 0.2em;  
}

.destacado4 {
    background-color: white;
    color: #222;
    padding: 1em;
    font-family: 'Poppins', sans-serif;
    font-weight: 700;
    text-align: center;
    font-size: .9em;
    padding: 0.5em;
    line-height: 1em;
}

.destacado20 {
    display: flex;
    justify-content: center;
    flex-direction: row;
    background: #cecece;
    color: #444;
    padding: 1em;
    width: 70%;
    margin: 1em;
    margin-left: 4.5em;
}

.destacado20:hover {
    background: #333;
    color: white;
}

.descripcion1 {
    font-family: Poppins;
    font-size: 0.8em;
    text-align: center;
    color: #333;
    background-color: #cecece;
    padding: 0.5em;
    margin-bottom: 0.5em;
}


.btntxt {
    color: #40a5b4;
    font-weight: 700;
    font-size: 0.8em;
    letter-spacing: 0.2em;
    line-height: 2em;
}

.btntxt:hover {
    color: #666;
    font-weight: 700;
    font-size: 0.8em;
    letter-spacing: 0.2em;
}


.cajagris {
    background-color: #222;
    border-bottom: 0.2em solid white;
}

.gris2 {
    background-color: #444;
}

.stars {

    width: 3.5em;
}


.iconredes {
    display: flex;
    width: 4em;
    height: 5em;
}

.icon{ /* Pone en su lugar los iconos del menu principal del home*/    
    max-width: 50px;
    max-height: 50px;    
}
.contenido{
    display: flex;    
    flex-direction: column; 
    margin-left: 1em;  
}


footer {
    background-color: #111;
    position: fixed;
    bottom: 0;
    width: 100%;
}

.pie {
    width: 85%;
    margin-top: 0;
    margin-left: auto;
    margin-right: auto; 
}


/* Inscripciones */

.container53 {
    max-width: 50em;
    margin-right: auto;
    margin-left: auto;
    padding-top: 12em;
    display: flex;
    justify-content: center;

}

#griinsc h4{
    text-align: center;
    font-size: 10px;
    color: #fff;
    font-family: 'Poppins', sans-serif;
    font-weight:100;
}

#griinsc .contenedor53{
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    max-width: 300px;
}

#contenedor53 .container53{
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    max-width: 400px;
}

#griinsc article{
    margin: 15px;
}

#griinsc img{
    width: 100%;
    max-width: 280px;
}

/* Inscripciones */

.volver a  {
    color: #fff;
    display: flex;
    justify-content: center;
    margin-left: auto;
    margin-right: auto;
    font-family: Poppins;
    text-align: center;
    width: 8em;
    background-color: #333;

}

.volver a:hover  {
    background-color: #666;
}


.infoinscripciones1{
    font-family: 'Poppins';
    font-size: 0.8em;
    font-weight: 400;
    line-height: 1em;
    color: #E85D94;
    padding: 2em 1em;
    background: white;
    box-shadow: inset 0px 47px 27px -41px #E85D94;
}



/*----- MATERIA -------- */
.controw {
    width:100%;
    display: flex;
    flex-direction: row;
    justify-content:space-between;
    margin-bottom: 2em;
}
.contcol {
    width:100%;
    display: flex;
    flex-direction: column;
}

.fotoprof {
    width: 6em;
    margin-left: auto;
    margin-right: auto;
    height: auto;
    display: flex;
}

.fotoprof img {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: .8em;

}

.botonredsocial {
    width: 150px;
    height: 30px;
    background-color: blue;

}

/*------------ SOCIAL ------------*/

.comentario {
    display: flex;
    flex-direction: row;
    width: 100%;
    margin-bottom: 1em;
}
.comenthead {
    display: flex;
    flex-direction: row;
    justify-content: ;
    align-content: flex-start;
}

.comentario2 {
    display: flex;
    flex-direction: column;
    width: 85%;
    margin-left: 15%;
    margin-bottom: 1em;
}
.fotocoment {
    display: flex;
    flex-direction: column;
    padding-right: 1em;
}

.fotocoment img {
    width: 3.5em;
}

.comentcont {
    background-color: #eaeaea;
    display: flex;
    flex-direction: column;
    justify-content:space-between;
    padding: 1.5em;
    margin-bottom: 1em;
}

.comentcont img {

    display: flex;
}


.socialbody {
    display: flex;
    flex-wrap: wrap;
    justify-content:space-between;
}

.socialbtn {
    display: flex;
    flex-direction: row;
    margin: 0;
    align-self: flex-end;
    justify-content: flex-end;

}

.socialbtn button {
    font-family: 'Poppins', sans-serif; 
    font-weight: 700;
    color:#fff;
    height: 1.5em;
    width:10em;
    font-size: 0.7em;
    margin-top: 1em;
    letter-spacing: 0.07em;
}


.socialicon {
    margin-right: 1em;
}

.fotocoment img {
    max-width: 6em;

}

.boton2 {
    margin-top: -1.3em;
    margin-bottom: 1em;
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
}
#space{
    margin-left: .5em;
}

.enviar {
    display: flex;
    flex-direction: row;
}

.enviar img {
    width: 2em;
    height: 1.8em;
    margin-left: 1em; 

}


/*-------- FIN MATERIA ----------*/


/*--- Landing ---*/

.store {

    margin: 0.5em;
}

.redes {
    display: flex;
    flex-direction: row;
    justify-content: center;
}
.redes1 {
    display: flex;
    flex-direction: row;
    justify-content: center;
    flex-wrap: wrap;
}




.btnlanding {
    width: 8em;
    font-family: Poppins;
    font-weight: 700;
    font-size: 0.8em;
    color: #cecece;
    background-color: #222;
    text-align: center;
    line-height: 2em;
}

.btnlanding:hover {
    font-family: Poppins;
    font-weight: 700;
    font-size: 0.8em;
    color: #888;
    background-color: #333;
    text-align: center;
    line-height: 2em;
}



/* ------- Botoneras ------- */


.navmini ul li {
    display: flex;    
    font-family: Poppins;
    font-size: 0.6em;
    font-weight: 300;
    text-align: left;
    list-style-type: none;
    line-height: 2rem;
    /* interlinea*/

}

.navmini ul li a {
    display: flex;    
    font-size: 1.6em;
    color: white;
    text-align: left;
    list-style-type: none;
    line-height: 3em;
    width: 100%;
    justify-content: space-between;

}

.navmini ul li a:hover{
    opacity: 0.9;
    filter: alpha(opacity=50); 
    background: #09A7BE; /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(left,  #4ECBC2 , #09A7BE); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(right, #4ECBC2 , #09A7BE); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(right, #4ECBC2 , #09A7BE); /* For Firefox 3.6 to 15 */
    background: linear-gradient(to right, #4ECBC2 , #09A7BE); /* Standard syntax */
}


.navceleste ul li {
    font-family: Poppins;
    font-size: 0.9em;
    font-weight: 700;
    text-align: center;
    list-style-type: none;
    /* quita las viÃ±etas de la lista*/
    line-height: 2rem;
    /* interlinea*/
    position: relative;
}

.navceleste ul li a {
    font-size: 1.6em;
    color: white;
    font-family: Poppins;
    font-weight: 700;
    text-align: center;
    list-style-type: none;
    /* quita las viÃ±etas de la lista*/
    line-height: 3em;
    /* interlinea*/
    position: relative;
}


.navceleste ul li a:hover{
    opacity: 0.9;
    filter: alpha(opacity=50); 
    background: #09A7BE; /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(left,  #4ECBC2 , #09A7BE); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(right, #4ECBC2 , #09A7BE); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(right, #4ECBC2 , #09A7BE); /* For Firefox 3.6 to 15 */
    background: linear-gradient(to right, #4ECBC2 , #09A7BE); /* Standard syntax */
}

.navvioleta ul li {
    font-family: Poppins;
    font-size: 0.9em;
    font-weight: 700;
    text-align: center;
    list-style-type: none;
    /* quita las viÃ±etas de la lista*/
    line-height: 2rem;
    /* interlinea*/
    position: relative;
}

.navvioleta ul li a {
    font-size: 1.6em;
    color: white;
    font-family: Poppins;
    font-weight: 700;
    text-align: center;
    list-style-type: none;
    /* quita las viÃ±etas de la lista*/
    line-height: 3em;
    /* interlinea*/
    position: relative;
}

.navvioleta ul li a:hover{
    opacity: 0.9;
    filter: alpha(opacity=50); 
    background: #09A7BE; /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(left,  #633663 , #A04E8A); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(right, #633663 , #A04E8A); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(right, #633663 , #A04E8A); /* For Firefox 3.6 to 15 */
    background: linear-gradient(to right, #633663 , #A04E8A); /* Standard syntax */
}

.navrosa ul li {
    font-family: Poppins;
    font-size: 0.9em;
    font-weight: 700;
    text-align: center;
    list-style-type: none;
    /* quita las viÃ±etas de la lista*/
    line-height: 2rem;
    /* interlinea*/
    position: relative;
}

.navrosa ul li a {
    font-size: 1.6em;
    color: white;
    font-family: Poppins;
    font-weight: 700;
    text-align: center;
    list-style-type: none;
    /* quita las viÃ±etas de la lista*/
    line-height: 3em;
    /* interlinea*/
    position: relative;
}

.navrosa ul li a:hover{
    opacity: 0.9;
    filter: alpha(opacity=50); 
    background: #FF8A70; /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(left,  #E85D94 , #FF8A70); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(right, #E85D94 , #FF8A70); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(right, #E85D94 , #FF8A70); /* For Firefox 3.6 to 15 */
    background: linear-gradient(to right, #E85D94 , #FF8A70); /* Standard syntax */
}


/* ------- Fin Botoneras ------- */


/*--- COLAPSABLES --- */

.infoseccion{
    padding: 3em;
}


.tituloseccionh2{
    font-family: 'Poppins', sans-serif;
    font-size: 2.5em;
    font-weight: 700;
    text-align: center;
    color: #a04e8a;

}

.bajadaseccion{
    font-family: 'Poppins', sans-serif;
    font-size: 1em;
    font-weight: 400;
    text-align: center;
    color: #a04e8a;
}

.botonera{  
    display: flex;
    justify-content: center;
    padding: 1em;
}
.botonera1{  
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    padding: 1em 0 1em 0;
}
.mgleft {
    margin-left: 1em;
}

.contenido2{    
    width: 18em;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

h3 {
    text-decoration: none;
    font-family: 'Poppins', sans-serif;
    font-size: 1em;
    font-weight: 500;
    color:white; 
}


.mas{
    content: url('img/mas.svg');
    opacity: 0.5;
}

.mas:hover{opacity: 1;}

.menos{
    content: url('img/menos.svg');
    opacity: 0.5;
}

.menos:hover{opacity: 1;}

.cajainfo {
    width: auto;
    display:none;
    margin: auto;
}

.cajainfocolor {
    padding-top: 1em;
    padding-bottom: 1em;
    background-color: #222;
    box-shadow: inset 0px 47px 27px -41px #000;
}


.infohistorial {
    text-align: center;
    padding-left: 5em;
    padding-right: 5em;
    padding-top: 0.5em;
    padding-top: 0.5em;
    font-family: 'Poppins', sans-serif;
    font-size: 1em;
    font-weight: 400;
    color: #09A7BE;
    border-bottom: dotted 0.1em #444;
}

.infohistorialb {
    text-align: center;
    padding-left: 5em;
    padding-right: 5em;
    padding-top: 0.5em;
    padding-top: 0.5em;
    font-family: 'Poppins', sans-serif;
    font-size: 1em;
    font-weight: 400;
    color: #09A7BE;
}



.infohistorial1{
    font-family: 'Poppins', sans-serif;
    font-size: 0.8em;
    font-weight: 400;
    line-height: 1em;
    color: #a04e8a;
    padding: 2em 1em;
    background: white;
    box-shadow: inset 0px 47px 27px -41px #A04E8A;

}


.cajainfo a {
    color:#cecece;

}
.cajainfo a:hover {
    color: #13b2c9;
}


textarea {
    width: 100%;
    display: flex;
    min-height: 10em;
    font-family: Poppins;
    font-size: 0.8em;
    font-weight: 300;
    color: #888;
    border: 0;
    background-color: #555;
    padding: 1em;
    margin-bottom: 1em;
}




/*--- FIN COLAPSABLES ---*/



/*--- GRADIENTES PARA HEADER --- */

.empty { 
    background-color: #222;
}

.gris {
    opacity: 1;
    filter: alpha(opacity=50); 
    background: #09A7BE; 
    background: -webkit-linear-gradient(left, #111 , #333); 
    background: -o-linear-gradient(right, #111 , #333); 
    background: -moz-linear-gradient(right, #111 , #333); 
    background: linear-gradient(to right, #111 , #333); 
}

.celeste1 {
    opacity: 1;
    filter: alpha(opacity=50); 
    background: #09A7BE; 
    background: -webkit-linear-gradient(left, #09A7BE , #4ECBC2); 
    background: -o-linear-gradient(right, #09A7BE , #4ECBC2); 
    background: -moz-linear-gradient(right, #09A7BE , #4ECBC2); 
    background: linear-gradient(to right, #09A7BE , #4ECBC2); 
}

.celeste1inv {
    opacity: 1;
    filter: alpha(opacity=50); 
    background: #09A7BE; 
    background: -webkit-linear-gradient(left, #4ECBC2 , #09A7BE); 
    background: -o-linear-gradient(right, #4ECBC2 , #09A7BE); 
    background: -moz-linear-gradient(right, #4ECBC2 , #09A7BE); 
    background: linear-gradient(to right, #4ECBC2 , #09A7BE); 
}


.rosa1 {
    opacity: 1;
    filter: alpha(opacity=50); 
    background: #FF8A70; 
    background: -webkit-linear-gradient(left, #FF8A70 , #E85D94); 
    background: -o-linear-gradient(right, #FF8A70 , #E85D94); 
    background: -moz-linear-gradient(right, #FF8A70 , #E85D94); 
    background: linear-gradient(to right, #FF8A70 , #E85D94); 
}
.violeta1 {
    opacity: 1;
    filter: alpha(opacity=50); 
    background: #A04E8A; 
    background: -webkit-linear-gradient(left, #633663, #A04E8A ); 
    background: -o-linear-gradient(right, #633663, #A04E8A ); 
    background: -moz-linear-gradient(right, #633663, #A04E8A ); 
    background: linear-gradient(to right, #633663, #A04E8A ); 
}

/*--- BOTONES GRADIENTES ---*/

.celeste {
    opacity: 1;
    filter: alpha(opacity=50); 
    background: #09A7BE; 
    background: -webkit-linear-gradient(left, #09A7BE , #4ECBC2); 
    background: -o-linear-gradient(right, #09A7BE , #4ECBC2); 
    background: -moz-linear-gradient(right, #09A7BE , #4ECBC2); 
    background: linear-gradient(to right, #09A7BE , #4ECBC2); 
}

.celeste:hover {
    opacity: 0.9;
    filter: alpha(opacity=50); 
    background: #09A7BE; 
    background: -webkit-linear-gradient(left,  #4ECBC2 , #09A7BE); 
    background: -o-linear-gradient(right, #4ECBC2 , #09A7BE); 
    background: -moz-linear-gradient(right, #4ECBC2 , #09A7BE); 
    background: linear-gradient(to right, #4ECBC2 , #09A7BE); 
}
.celesteinv {
    opacity: 1;
    filter: alpha(opacity=50); 
    background: #09A7BE; 
    background: -webkit-linear-gradient(left, #4ECBC2 , #09A7BE); 
    background: -o-linear-gradient(right, #4ECBC2 , #09A7BE); 
    background: -moz-linear-gradient(right, #4ECBC2 , #09A7BE); 
    background: linear-gradient(to right,#4ECBC2 , #09A7BE);
}

.celesteinv:hover {
    opacity: 0.9;
    filter: alpha(opacity=50); 
    background: #09A7BE; 
    background: -webkit-linear-gradient(left, #09A7BE , #4ECBC2); 
    background: -o-linear-gradient(right, #09A7BE , #4ECBC2); 
    background: -moz-linear-gradient(right, #09A7BE , #4ECBC2); 
    background: linear-gradient(to right,#09A7BE , #4ECBC2);
}

.rosa {
    opacity: 1;
    filter: alpha(opacity=50); 
    background: #FF8A70; 
    background: -webkit-linear-gradient(left, #FF8A70 , #E85D94); 
    background: -o-linear-gradient(right, #FF8A70 , #E85D94); 
    background: -moz-linear-gradient(right, #FF8A70 , #E85D94); 
    background: linear-gradient(to right, #FF8A70 , #E85D94);
}

.rosa:hover {
    opacity: 0.9;
    filter: alpha(opacity=50); 
    background: #FF8A70; 
    background: -webkit-linear-gradient(left,  #E85D94 , #FF8A70); 
    background: -o-linear-gradient(right, #E85D94 , #FF8A70); 
    background: -moz-linear-gradient(right, #E85D94 , #FF8A70); 
    background: linear-gradient(to right, #E85D94 , #FF8A70); 
}

.rosainv {
    opacity: 1;
    filter: alpha(opacity=50); 
    background: #FF8A70; 
    background: -webkit-linear-gradient(left,  #E85D94 , #FF8A70); 
    background: -o-linear-gradient(right, #E85D94 , #FF8A70); 
    background: -moz-linear-gradient(right, #E85D94 , #FF8A70); 
    background: linear-gradient(to right, #E85D94 , #FF8A70); 
}

.rosainv:hover {
    opacity: 0.9;
    filter: alpha(opacity=50); 
    background: #FF8A70; 
    background: -webkit-linear-gradient(left, #FF8A70 , #E85D94); 
    background: -o-linear-gradient(right, #FF8A70 , #E85D94); 
    background: -moz-linear-gradient(right, #FF8A70 , #E85D94); 
    background: linear-gradient(to right, #FF8A70 , #E85D94); 
}

.violeta {
    opacity: 1;
    filter: alpha(opacity=50); 
    background: #A04E8A; 
    background: -webkit-linear-gradient(left, #633663, #A04E8A ); 
    background: -o-linear-gradient(right, #633663, #A04E8A ); 
    background: -moz-linear-gradient(right, #633663, #A04E8A ); 
    background: linear-gradient(to right, #633663, #A04E8A ); 
}

.violeta:hover {
    opacity: 0.9;
    filter: alpha(opacity=50); 
    background: #FF8A70; 
    background: -webkit-linear-gradient(left,  #A04E8A , #633663); 
    background: -o-linear-gradient(right, #A04E8A , #633663); 
    background: -moz-linear-gradient(right, #A04E8A , #633663);
    background: linear-gradient(to right, #A04E8A , #633663); 
}

.violetainv {
    opacity: 1;
    filter: alpha(opacity=50); 
    background: #FF8A70; 
    background: -webkit-linear-gradient(left,  #A04E8A , #633663); 
    background: -o-linear-gradient(right, #A04E8A , #633663); 
    background: -moz-linear-gradient(right, #A04E8A , #633663);
    background: linear-gradient(to right, #A04E8A , #633663); 
}

.violetainv:hover {
    opacity: 0.9;
    filter: alpha(opacity=50); 
    background: #A04E8A; 
    background: -webkit-linear-gradient(left, #633663, #A04E8A ); 
    background: -o-linear-gradient(right, #633663, #A04E8A ); 
    background: -moz-linear-gradient(right, #633663, #A04E8A ); 
    background: linear-gradient(to right, #633663, #A04E8A ); 
}

.verde {
    opacity: 1;
    filter: alpha(opacity=50); 
    background: #87a33c; 
    background: -webkit-linear-gradient(left, #87a33c , #b9c332); 
    background: -o-linear-gradient(right, #87a33c , #b9c332); 
    background: -moz-linear-gradient(right, #87a33c , #b9c332); 
    background: linear-gradient(to right, #87a33c , #b9c332);
}

.verde1 {
    opacity: 1;
    filter: alpha(opacity=50); 
    background: #87a33c; 
    background: -webkit-linear-gradient(left, #87a33c, #b9c332); 
    background: -o-linear-gradient(right, #87a33c, #b9c332); 
    background: -moz-linear-gradient(right, #87a33c, #b9c332); 
    background: linear-gradient(to right, #87a33c, #b9c332); 
}

.verde1:hover {
    opacity: 1;
    filter: alpha(opacity=50); 
    background: #87a33c; 
    background: -webkit-linear-gradient(left, #b9c332, #87a33c); 
    background: -o-linear-gradient(right, #b9c332, #87a33c); 
    background: -moz-linear-gradient(right, #b9c332, #87a33c); 
    background: linear-gradient(to right, #b9c332, #87a33c);
}


/* Gradiente animada */

.gradiente {
    width: 100wh;
    height: 90vh;
    color: #fff;
    background: linear-gradient(-45deg, #09A7BE, #E85D94, #09A7BE, #A04E8A);
    background-size: 400% 400%;
    -webkit-animation: Gradient 5s ease infinite;
    -moz-animation: Gradient 5s ease infinite;
    animation: Gradient 5s ease infinite;
}

@-webkit-keyframes Gradient {
    0% {
        background-position: 0% 50%
    }
    50% {
        background-position: 100% 50%
    }
    100% {
        background-position: 0% 50%
    }
}

@-moz-keyframes Gradient {
    0% {
        background-position: 0% 50%
    }
    50% {
        background-position: 100% 50%
    }
    100% {
        background-position: 0% 50%
    }
}

@keyframes Gradient {
    0% {
        background-position: 0% 50%
    }
    50% {
        background-position: 100% 50%
    }
    100% {
        background-position: 0% 50%
    }
}


/* Fin gradiente animada */


/* Alumno */

#ok { 
    display: flex;
    width: 6em;
    margin-right: auto;
    margin-left: auto;
}

.infoalumno{ 
    display: flex;
    justify-content: center;
    flex-direction: column;
    padding: 0em;
}

/* Fin Alumno */


/* Historial */

.portadahistorial{
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-bottom: 2em;   
}

#totalmaterias{

    display: flex;
    flex-direction: column;
    justify-content: center;
    background-color:#444 ;
    padding: 0.7em;
    margin: 1.5em 4em;  
}

/* Fin historial */


/* Colapsables */

.infoseccion{
    padding: 3em;
}


.tituloseccionh2{
    font-family: 'Poppins', sans-serif;
    font-size: 2.5em;
    font-weight: 700;
    text-align: center;
    color: #a04e8a;
}

.bajadaseccion{
    font-family: 'Poppins', sans-serif;
    font-size: 1em;
    font-weight: 400;
    text-align: center;
    color: #a04e8a;
}

.contenido2{    
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}


h3 {
    text-decoration: none;
    font-family: 'Poppins', sans-serif;
    font-size: 1em;
    font-weight: 500;
    color:white; 
}

.mas{
    content: url('img/mas.svg');
    opacity: 0.5;
}

.mas:hover{opacity: 1;}

.menos{
    content: url('img/menos.svg');
    opacity: 0.5;
}

.menos:hover{opacity: 1;}

.cajainfo {
    display:none;
    overflow: hidden;    
}

.infoyredes{
    background: white;
    box-shadow: inset 0px 47px 27px -41px #A04E8A;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.infohistorial1{
    font-family: 'Poppins', sans-serif;
    font-size: 0.8em;
    font-weight: 400;
    line-height: 1em;
    color: #a04e8a;
    padding: 2em 2em;  
}

/* Fin Colapsables */


/* Datos censales */

.fondoseccion{
    background-color: rgba(160, 78, 138, 0.72);
}

.tituloform{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    background: rgba(255, 255, 255, 0.21);

}

.tituloform2{
    display: flex; 
    justify-content: center;
    width: 100%;           
}


.tituloform img{
    text-align: right;
    background: rgba(255, 255, 255, 0.22);
    padding: .5em 1em .5em 1em;      
}

.formulario1{
    display: flex;
    flex-direction:row;
    justify-content: center;
    margin: 1.8em .1em;   
}

.formulario3{
    padding-top: 1.2em;
}

.datos{
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    flex-wrap: nowrap;   
}

.textbox{
    background-color:rgb(99, 54, 99); 
    border-radius:0.4em;
    border-bottom: 0.1em solid rgba(255, 255, 255, 0.41);
    text-align: start;
    font-size: .8em;
    font-family: 'Poppins', sans-serif;
    font-weight: 300;
    margin:0.5em;
    width: 12em;
    height: 2em;
    padding-left: 1em;
}

.textbox2{
    text-decoration: none;
    background-color:rgba(5, 5, 5, 0); 
    text-align: start;
    font-size: .8em;
    width: 1em;
    height: 1em; 
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: 50%;
    width: 12px;
    height: 12px;
    border: 2px solid #999;
    transition: 0.3s all linear;
    outline: none;
    margin-right: 5px;
    position: relative;
    top: 2px;   

}

.textbox2:checked {
    border: 6px solid white;
    background-color: white;     
}

.inputcenso{
    display: flex;
    flex-direction: column;  
}

.inputcirculo{
    display: flex;
    flex-direction: column;
    padding-left: .5em;
}

.check{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: .1em;
    height: 185px;    
}

.check img{
    display: flex;
    flex-direction: column;
    padding: .3em;
    justify-content: space-between;   
}

.contenedorpreguntas{
    width: 100%;
    display: flex;    
}

.preguntasgenerales1{
    display: flex;
    flex-direction: row;
    width: 100%;
}

.preguntasgenerales2{
    display: flex;
    flex-direction:row-reverse;
    flex-wrap: nowrap;
    align-self: flex-start;
    justify-content: space-around;
    width: 80%;
}

.pregunta{
    display: flex;
    flex-direction: column;
    padding: 0em 1em;
    width: 100%;
    justify-content: space-around;
    vertical-align: top;
    align-self: flex-start;
}

.botonsig{
    display: flex;
    justify-content: center;
    opacity: .5;
    padding-top: 1em;
    padding-bottom: 1em;  
}

.botonsig button{
    color:rgb(160, 78, 138);  
}


.botonsig:hover{
    opacity: 1;   
}


/* Fin datos censales */



/* Calendario */ 
.introcalendario{
    background-color: white;
    height: 40px;
    display: flex;
    flex-direction: row;
    justify-content: space-around;
}

.fondocalendario{
    background: white;
    box-shadow: inset 0px 47px 27px -41px #87a33c;   
}

select{
    text-decoration: none;
    border: none;

}

.contenidocalendario{
    display: flex;
    flex-direction: row;
    align-self: center;
    padding: 1em 0em 1em 0em;  
}


.fecha{
    padding: 1em;
}

.actividadgral{
    width: 90%;
}

.actividad1{
    background: #09a7be;
    padding: 1em 0em 1em 0em;
    margin-top: 1.3em;
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    width: 99%;
    flex-wrap: wrap;

}

.actividad2{
    background: #ff8a70;
    padding: 1em 0em 1em 0em;
    margin-top: 1.3em;
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    width: 99%;
    flex-wrap: wrap;
}

#actividad2{
    background: #9cbf4e;
    padding: 1em 0em 1em 0em;
    margin-top: 1.3em;
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    width: 99%;
    flex-wrap: wrap;
    border: 0.1em solid rgba(8, 8, 8, 0.31);
}

.actividad3{
    background: #e85d94;
    padding: 1em 0em 1em 0em;
    margin-top: 1.3em;
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    width: 99%;
    flex-wrap: wrap;
}

.actividad4{
    background: #a04e8a;
    padding: 1em 0em 1em 0em;
    margin-top: 1.3em;
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    width: 99%;
    flex-wrap: wrap;
}

.actividad5{
    background: #4ecbc2;
    padding: 1em 0em 1em 0em;
    margin-top: 1.3em;
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    width: 99%;
    flex-wrap: wrap;   
}

.siguiente{
    display: flex;
    justify-content: center;
    padding: 1.2em;
    box-shadow: inset 0px 47px 27px -41px #87a33c;
}


#sig{
    opacity: .7;   
}

#sig:hover{
    opacity: 1;

}


.img1{
    display: flex;
    margin-left: auto;
    margin-right: auto;
    justify-content: center;
    padding: 1em 1em 0em 0em;   
}

.img2{
    display: flex;
    flex-direction: row;
    justify-content: center;
    padding-top: 1.5em ; 
    opacity: .8;
}

.img2:hover{
    opacity: 1;

}

.img3{
    padding: 2em 0em 2em 0em;
}

.imgcalendario{
    padding: 2em 0em;
}


.hr1{
    margin-top: .5em;
    margin-bottom: .5em   
}
/* Fin Calendario */



/* ------ MEDIA ------ */ 



/* Media 20em */
@media screen and (min-width:20em) {
    .layout{
        display: flex;
        flex-direction: column;

    }

    .docentes{
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
    }


    .txt9 {
        padding: 0;
    }

    .iconredes {
        padding: 1em;
    }
    .logoxs {
        display: flex;
        width: 100%;

    }

    .socialbody {
        display: flex;
        flex-direction: column;
        align-items: center;

    }
    .socialbody img {
        min-width: 17em;
        padding-top: 1em;
    }

    .colpadlr {
        padding-left: 0.5em;
        padding-right: 0.5em;
    }
    .redes img {
        width: auto;
    }

    #logolan { 
        display: flex;
        margin-left: auto;
        margin-right: auto;
        width: 18em;
    }


}


/* Media 40em */

@media screen and (min-width:40em) {
    .layout {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
    }


    #logolan { 
        display: flex;
        margin-left: auto;
        margin-right: auto;
        width: 30em;
    }

    .docentes{
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
    }


    .docentes{
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
    }
    .redes img {
        width: auto;
    }


}

/* Media 50em */

@media screen and (min-width:50em) {



    .socialbody {
        display: flex;
        flex-direction: row;
        align-items: center;

    }
    .socialbody img {
        min-width: 15em;
        padding-top: 1em;
    }



}

/* Media 60em */

@media screen and (max-width:60em)
{
    .preguntasgenerales1{
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;
        justify-content: space-around;
        align-self: flex-start;     
    } 
    .container{
        width: 90%;
    }
    .txt58{
        font-size: 2.7em;
        padding: .6em 0em .6em 0em;
        display: flex;   
    }


}

.landing {
    display: flex;
    flex-direction: column;
    align-content: center;
    justify-content: center;
}

.landingris{
    background-color: #222;
    padding-bottom: 1em;
}


.mano {
    display: flex;
    margin-left: auto;
    margin-right: auto; 
    width: 20em;

}
