@charset "UTF-8";
*
{
	-moz-user-select: none;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
  	-ms-user-select: none;
}
html 
{
	-webkit-font-smoothing: antialiased;
	
}
body
{
	width: 100vw;
	height: 100vh;
	background-color: #415b9f; /*este es el color fondo header*/
	background: linear-gradient(to bottom, #415b9f 30vh,#ECEFF1 30vh); /*poner aca tambien el color fondo header*/
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-position: top center, left top;
	background-size:100vw 100vh;
}
.nobody
{
	overflow-y: hidden;
	background: none;
	background: linear-gradient(rgba(0, 0, 0, 0) 0%, rgb(77, 60, 41) 100%), url(../img/fondoperfil.jpg),rgb(75, 59, 42);
	background-size: 100% 62.5vw,100% auto;
	background-position: top center, top center;
	background-repeat: no-repeat;
}
.headerProfile
{
	position: fixed;
	width: 100vw;
	top: 0px;
	position: fixed;
	background-color: #25818B;
	background-image: url(../img/simbolo.png), url(../img/fondo2.png);
	background-position: 12px center, top center;
	background-repeat: no-repeat,repeat;
	background-size: auto 99%,400px;
	font-size: 20px;
	color: #fafafa;
	font-weight: 500;
}
.SlidePerfil
{
	background-color: #25818B;
	background-image: url(../img/fondo2.png);
	background-position: top center;
	background-repeat: repeat;
	background-size: 300px;
}
.patron1
{
	width: 100vw;
	top: 0px;
	height: 30vh;
	position: fixed;
	background: url(../img/fondo2.png);
	background-size: 430px;
	background-position: top center;
	
}
.patron2
{
	width: 100vw;
	bottom: 0px;
	height: 68vh;
	position: fixed;
	background-size: auto 96%;
	background: url(../img/fondo.svg);
	background-position: bottom center;
	background-repeat: repeat-x;
	opacity: 0.5;
	
}
.header
{
	position: fixed;
	width: 100vw;
	top: 0px;
}
.navOn
{
	-webkit-transition:height .6s, box-shadow .6s, background-color .4s, background-position .6s ease;
	-moz-transition:height .6s, box-shadow .6s, background-color .4s, background-position .6s ease;
	-o-transition:height .6s, box-shadow .6s, background-color .4s, background-position .6s ease;
	transition: height .6s, box-shadow .6s, background-color .4s, background-position .6s ease;
	position: fixed;
	background-color: #414687; /*color barra sup aparece*/
	background-image: url(../img/didacticamatematica1.svg),url(../img/fondo2.png);
	background-position: 97%,top center;
	background-repeat: no-repeat, repeat;
	background-size: auto, 430px;
	font-size: 20px;
}
.navOn .nav-wrapper #title
{
	color: #fff;
	font-weight: 500;
	width: 100%;
	-webkit-transition:all .8s ease; 
	-moz-transition:all .8s ease; 
	-o-transition:all .8s ease; 
	transition: all .8s ease;
}
.navOff
{
	-webkit-transition:height .6s, box-shadow .6s, background-color .4s, background-position .1s ease;
	-moz-transition:height .6s, box-shadow .6s, background-color .4s, background-position .1s ease;
	-o-transition:height .6s, box-shadow .6s, background-color .4s, background-position .1s ease;
	transition: height .6s, box-shadow .6s, background-color .4s, background-position .1s ease;
	box-shadow: none;
	background-color: transparent;
	height: 20vh;
	background: url(../img/didacticamatematica1.svg);
	background-repeat: no-repeat;
	background-position: center;
	
	font-size: 20px;	
}
.navOff .nav-wrapper #title
{
	color: rgba(0,0,0,0);
	font-weight: 500;
	width: 100%;
	-webkit-transition:all .4s ease; 
	-moz-transition:all .4s ease; 
	-o-transition:all .4s ease; 
	transition: all .4s ease;
}
.formulario
{
	position: absolute;
	top: 20vh;
	width: 40vw;
	left: calc(50% - 20vw);
	background: #fafafa;
	margin-bottom: 20px;
	padding: 0px;	
	transition: all .4s ease;
}
.tabs
{
	background: linear-gradient(to bottom, #1E818C 8px,#FFF 8px);
	padding-top: 8px;
	height: 57px!important;
}
.jornada
{
	font-size: 1.2rem;
	padding-bottom: 10px;
	color: rgba(0, 0, 0, 0.42)
}
.modal-content
{
	overflow: hidden;
	padding: 0px!important;
	border: 30px solid #fafafa;
	border-right: 16px solid#fafafa;
	max-height: 70vh;
}

.modal-content article
{
	overflow-y: auto;
	color: #363636;
	line-height: 1.1;
	padding-right: 10px;
	margin: 0px;
	max-height: calc(70vh - 60px);
}
.modal-content article p:last-child
{
	margin-bottom: 0px;
}
.modal-content h5
{
	margin-top: 0px;
	font-weight: 400;
	color: #EE7556;
}
.modal-content article p
{
	text-align: justify;
	/*font-size: 16px;*/
}
h5
{
	color: #BBDDE2;
}
.error #barra
{
	width: 100%;
	height: 8px;
	background: rgba(246, 71, 71, 0.7);
	position: absolute;
	top: 0px;
}
.exito #barra
{
	width: 100%;
	height: 8px;
	background: rgba(46, 204, 113, 0.7);
	position: absolute;
	top: 0px;
}
.reset #barra
{
	width: 100%;
	height: 8px;
	background: #51BCB5;
	position: absolute;
	top: 0px;
}
.atras
{
	margin-top: -90px;
}
.salir #barra
{
	width: 100%;
	height: 8px;
	background: rgba(241, 196, 15, 0.7);
	position: absolute;
	top: 0px;
}
.slforgot #barra
{
	width: 100%;
	height: 8px;
	background: rgba(185, 60, 80, 0.7);
	position: absolute;
	top: 0px;
}
.Ayuda #barra
{
	width: 100%;
	height: 8px;
	background: rgba(142, 68, 173, .5);
	position: absolute;
	top: 0px;
}
.error p, .reset p, .exito p, .salir p, .perfil p, .slforgot p
{
	font-weight: 400;
}
.error h5 a
{
	font-size: 16px;
}
.error .title
{
	font-size: 33px; 
	margin-left: calc(50% - 55px); 
	line-height: 1; color: #F64747; 
}
.exito h5 a
{
	color: #2ecc71;
	margin-top: 20px;
}
.exito .title
{
	font-size: 33px; 
	margin-left: calc(50% - 55px); 
	line-height: 1; color: #2ecc71; 
}
.salir h5 a
{
	color: #f1c40f;
	margin-top: 20px;
}
.slforgot h5 a
{
	color: #b93c4f;
	margin-top: 20px;
}
.salir .title
{
	font-size: 33px; 
	margin-left: calc(50% - 180px); 
	line-height: 1; color: #f1c40f; 
}
.slforgot .title
{
	font-size: 33px; 
	margin-left: calc(50% - 180px); 
	line-height: 1; color: #b93c4f; 
}
.reset h5 a
{
	color: #8E44AD;
	margin-top: 20px;
}
.reset .title
{
	font-size: 33px; 
	margin-left: calc(50% - 55px); 
	line-height: 1; color: #8E44AD;
}
ul li a
{
	font-size: 1.2rem;
	font-weight: 400;
}

footer
{
	color: red!important;
	background: url(../img/fondo2.png);
	background-position: top center;
	background-size: 380px;
	background-color: rgba(65, 91, 159, .9)!important; /*este es el color fondo footer*/
	margin-top: 30px;
}
.padres button
{ 
	border-radius: 0px;
	bottom: 100px;
	right: -75px;
	position: fixed;
	transition: all .6s ease;
}

.ayuda button
{ 
	border-radius: 0px;
	bottom: 160px;
	right: -68px;
	position: fixed;
	transition: all .6s ease;
}

.padres button:hover, .ayuda button:hover
{
	right: 0px; 
	position: fixed;
	transition: all .6s ease;
}

.padresPop
{
	background: url(../img/padres.png);
	background-repeat: no-repeat;
	background-position: 45% bottom;
	background-size: 80%;
}
.soporte
{
	text-align-last: center;
	background-color:#bce8f1;
	background-position: 45% bottom;
	background-size: 80%;
	

}
.soporte p
{
    color: #31708f;
    
}
.tippedpass
{
	margin-top: 0px;
	padding: 0px!important;
	height: 45px;
	padding-top: 30px!important;
}
.tippedpass a 
{
	color: gray;
}
.tippedpass a i
{
	font-size: 20px!important;	
	cursor: pointer;
}
.tippedpass a:hover
{
	color: orange;
}
.CuerpoPerfil #barra
{
	width:100%;
	height: 8px;
	background: #15595E;
	margin-top: 0px;
	margin-left: 0px;
}
.CuerpoPerfil
{
	overflow: hidden;
	position: absolute;
	top: 100px;
	width: 40vw;
	left: calc(50% - 20vw);
	background: #fafafa;
	margin-bottom: 0px;
	padding: 0px;	
	max-height: calc(100vh - 100px);
	transition: all .4s ease;
}
.CuerpoPerfil .title
{
	width: 100%;
	font-size: 33px; 
	line-height: 1; 
	color:#2ecc71;
}
.CuerpoPerfil .Contenido
{
	overflow: auto;
	max-height: calc(100vh - 108px);
}




.BodyProfile
{
	overflow-y: hidden;
	margin-top: 10vw;
	width: 60vw;
	margin-left: 20vw;
	background: #fafafa;
	margin-bottom: 0px;
	transition: all .4s ease;
	height: calc(100vh - 0vw);
}

.contenidoPerfil
{
	overflow-y: auto;
	width: 100%;
	height: 100%;
	background-color: red;
}
.foterprofile
{
	position: absolute;
	bottom: 0px;
	width: 60vw;
	transition: all .6s ease;
}
@media (max-width: 1500px) and (min-width: 1200px){
	.formulario, .CuerpoPerfil
	{
		width:50vw;
		left: calc(50% - 25vw);
		transition: all .4s ease;
	}
}
@media (max-width: 1200px) and (min-width: 1000px){
	.formulario, .CuerpoPerfil
	{
		width:70vw;
		left: calc(50% - 35vw);
		transition: all .4s ease;
	}
}

@media (max-width: 1000px) and (min-width: 600px){
	.formulario, .CuerpoPerfil
	{
		width:80vw;
		left: calc(50% - 40vw);
		transition: all .4s ease;
	}
}
@media (max-width: 600px)
{
	.formulario, .CuerpoPerfil
	{
		width: 100vw;
		left: calc(50% - 50vw);
		transition: all .4s ease;
	}
}
 fieldset textarea:first-letter, input #Otro:first-letter
{
	text-transform: uppercase;
}