/*Css W*/
.W { /*Estilo botoes de trimites y sucursal*/
background: -webkit-gradient(linear, left top, left bottom, from(#57B7FF), to(#57B7FF));
   background: -webkit-linear-gradient(top, #57B7FF, #57B7FF);
    background: -moz-linear-gradient(top, #57B7FF, #57B7FF);
    background: -ms-linear-gradient(top, #57B7FF, #57B7FF);
    background: -o-linear-gradient(top, #57B7FF, #57B7FF);
    padding: 0.0001em 0.0001em;
    margin-bottom: 0.01em;
    -webkit-border-radius: 0.5em;
    -moz-border-radius: 0.5em;
    border-radius: 0.5em;
    color: white;
    text-decoration: none;
    vertical-align: middle;
    font-size: 5em;
}
.navinfo{
vertical-align:middle;
}
h1{
    font-size: 5em;
    text-align:center;
	font-weight:normal;
}

.DivDatos{
	width:30%;
    position:static;
    margin:0 auto;
    padding-top: 0.3em;
}

.W:hover  
{
    background: -webkit-gradient(linear, left top, left bottom, from(#57B7FF), to(rgba(35, 35, 35, 1)));
    background: -webkit-linear-gradient(top, white, white);
    background: -moz-linear-gradient(top, white, white);
    background: -ms-linear-gradient(top, white, white);
    background: -o-linear-gradient(top, white, white);
    color: #57B7FF;
    cursor: pointer;
}

.calendar-day
{
	width: 14.28%;
    margin: 0 !important;
    padding: 0 !important;
    position: relative;
    display: block;
    float: left;
    border: solid #CCCCCC;
	background-color:#f5f5f5;
	color:#CCC;
    border-width:1px;
    overflow: hidden;
    font-size: 220%;
    border-radius: 0%;
	text-align:center;
}
.calendar-day.have-events {
	cursor: pointer;
	background-color:#FFFFFF;
	color:#000000;
}
.calendar-day.have-events:hover {
	color:#FFFFFF;
	background-color:#57B7FF;
}
.calendar-holder  {
	width:80%;
	position: relative;
	margin:0 auto;
	top:30px;
}
.calendar-day.this-day {
	background-color:#AEDDFF;
}
@media screen and (max-height: 800px) {
	.calendar-day .date-holder{height: 60px;font-size:32px; line-height: 60px;}
	.calendar-holder {height: 400px;}
	.letrasDay{font-size:26px; font-weight:normal;}
}

.letrasDay{
	top:30px;
}

.calendar-day .date-holder table{
   margin-left: auto;
   margin-right: auto;
   margin-bottom:auto;
   margin-top:auto;
   
   vertical-align:middle;
   text-align: center;
   left: 0;
   right: 0;
}
.calendar-day .event-notif {
	height: 0.5em;
	background: #57B7FF;
	width: 100%;
	margin: 1px 0px;
}

/*head botones de navegacion*/
.divnav
{
    width: 100%;
    background-color: #908b8b42;
    color: grey;
    text-decoration: none;
    vertical-align: middle;
}

.barramenu{
   height: auto;
   padding: 0.1em 2.1em;
   background-color:#57B7FF;
   color:#18265a;
   vertical-align:middle;
}

.btnatras{
	width: 7em;
	height:2.5em;
	background-color: #CAE9FF;
	color: #57B7FF;
	padding-top: 0.22em;
	cursor: pointer;
	font-size: 1.2em;
	text-align:center;
	vertical-align:middle;
}

/*.divnavbtn {
    width: 20%;
    text-align:center;
    height: 2em;
    font-size: 1.2em;
    background-color: #36576921;
    padding-top: 0.36em;
    cursor: pointer;
}*/

.btnatras:hover {
    box-shadow: 0px 5px #57B7FF;
	background-color: #57B7FF;
	color: white;
    cursor: pointer;
}
.radiobtn{
    -webkit-border-radius: 0.5em;
    border-radius: 0.5em;
    -moz-border-radius: 0.5em;
}

hr
{
    background-color: #57B7FF;
    height: 0.6em;
    border:none;
}
 .link:hover{color: #57b7ff;}

.barraCelesteTop{
    height: 5em;
}

/*Desktop*/
@media screen and (max-width: 4080px){
    h1 {font-size: 5em;}
    .title{font-size: 1.8em;}
    .subtitle{font-size: 1.5em;}
    th, td{ font-size: 1.1em; padding: 0.001em; text-align: center; border-bottom: 1px solid #57b7ff;}
    .calendar-day .date-holder{height: 80px; font-size: 46px;   line-height: 97px;}
    .calendar-holder {height: 640px;}
    .letrasDay{font-size:36px; font-weight:normal;}
    .selechora:hover{background-color:#57b7ff87; cursor:pointer;}
    .tdaux {border: 1px solid #57B7FF;float: left; width: 48.5%; font-size: 1em; }
    .tablavespe{margin-left: 0.5%; margin-right: 0.5%; margin-top: 0.5%; margin-bottom:0.3%;}
    .tablamatutino{margin-left: 0.5%; margin-right: 0.5%; margin-top: 0.5%; margin-bottom:0.3%; }
    .calendar-month-view {font-size: 3.8em; line-height: 2em;}
    .W{font-size: 5em;height:3em;}
	.calendar-day { height:100px;}
	.DivDatos{width:40%;}
   
}

@media screen and (max-width: 1080px)
{
    .calendar-day .date-holder{height: 80px; font-size: 44px;   line-height: 64px;}
    .calendar-holder {height: 400px;}
    .letrasDay{font-size:34px; font-weight:normal; }
    .btnatras{padding-top: 0.22em;}
    th, td {font-size: 1.1em; padding: 1.1em; text-align: center; border-bottom: 1px solid #57b7ff;}
    th {background-color: #57B7FF;}
    .title {font-size: 1.5em;}
    .subtitle {font-size: 1.1em;}
    .navinfo {background-color: #eeeeee; height: 2em; width: 100%; color: #18265a;}
    .tablebasehora {display: flex; justify-content: center;}
    .tdaux {border: 1px solid #57B7FF; width: 98%;}
    .W{font-size: 5em;height:3em;}
	.calendar-day { height:60px;}
	.DivDatos{width:70%;}
	
}

@media screen and (max-width: 620px){
    .divnav {color: grey;}
    h1 {font-size: 3.3em;}
    .calendar-day .date-holder{height: 80px; font-size: 40px;   line-height: 64px;}
    th, td{ font-size: 1.1em; padding: 1em; text-align: center; border-bottom: 1px solid #57b7ff;}
    .letrasDay{font-size:22px; font-weight:normal;}
    .calendar-month-view {font-size: 3em; line-height: 1.8em;}
    .W{font-size: 2.5em;height:3.5em;}
    .title{font-size: 1.5em;}
    .subtitle{font-size: 1em;}
	.calendar-day { height:60px;}
	.tdaux {width: 98%; font-size: 1.4em;}
	.DivDatos{width:80%;}
}

/*min-width: 420px*/
@media screen and (max-width: 420px){
    .btnatras{padding-top: 0.12em;}
    h1 {font-size: 2.3em;}
    th, td{ font-size: 1.01em; padding: 1em; vertical-align: top; border-bottom: 1px solid #57b7ff;}
    th {background-color: #57B7FF;}
    .calendar-day .date-holder{height: 80px; font-size: 29px; line-height: 64px;}
    .letrasDay{font-size:19px; font-weight:normal;}
    table{border: 1px solid #57B7FF; border-collapse: collapse; width: 200px; }
    .w3-input{padding:8px;display:block;border:none;border-bottom:1px solid #57b7ff;width:200px;}
    .w3-btn,.w3-button{border:none;display:inline-block;padding:8px 16px;vertical-align:middle;overflow:hidden;text-decoration:none;color:inherit;background-color:inherit;text-align:center;cursor:pointer;white-space:nowrap}
    .w3-blue,.w3-hover-blue:hover{color:white!important;background-color:#57b7ff!important;font-size: 2em;}
    label{font-size: 1.5em; color: #808080;}
    .title{font-size: 1.5em;}
    .subtitle{font-size: 0.9em;}
    .navinfo {background-color: #eeeeee; height: 2em; width: 100%; color: #18265a}
    .tdaux {border:none; width: 98%; font-size: 0.8em;}
    .W{font-size: 2.5em;height:3.5em;}
    .DivDatos{width:90%;}
}

/*mobile*/
@media only screen and (max-width: 410px){
    /* IE */
    h1 {font-size: 1.8em;}
    .W{font-size: 2em;height:3em;}
    .letrasDay .date-holder .calendar-day {font-size: 1.1em; line-height:1.1em; height:1em;}
	.DivDatos{width:90%;}
}

.selechora{
	height:2.3em;
}

table
{
    border: 1px solid #57B7FF;
    border-collapse: collapse;
    width: 100%;
}

th{
background-color: #57B7FF;  
}

/*th, td{
    padding: 5px;
    text-align: center; 
}*/

label
{
   font-size: 1.5em; 
   color: #808080;
}

.container{
   max-width: 1920px;
   position: relative;
   display: inline-block;
   margin: 0 0 auto;
}

.w3-container,.w3-panel{padding:0.01em 16px}.w3-panel{margin-top:16px;margin-bottom:16px}
.w3-container:after,.w3-container:before,.w3-panel:after,.w3-panel:before,.w3-row:after,.w3-row:before,.w3-row-padding:after,.w3-row-padding:before,
.w3-cell-row:before,.w3-cell-row:after,.w3-clear:after,.w3-clear:before,.w3-bar:before,.w3-bar:after{content:"";display:table;clear:both}
.w3-input{padding:8px;display:block;border:none;border-bottom:1px solid #57b7ff;width:100%}
.w3-btn,.w3-button{border:none;display:inline-block;padding:8px 16px;vertical-align:middle;overflow:hidden;text-decoration:none;color:inherit;background-color:inherit;text-align:center;cursor:pointer;white-space:nowrap}
.w3-blue,.w3-hover-blue:hover{color:white!important;background-color:#57b7ff!important;font-size: 2em;}

.diverror{
	color:#FF0000;
	font-size:1.5em;
}