*{
    margin:auto;
}

li{
    list-style: none;
}

a{
    text-decoration: none;
}


/*USUARIO*/

#logo-usuario{
    margin:auto;
    margin-bottom: 5em;
    padding: 25px;
    bottom: 5em;
    display: flex;
    justify-content: center;
    width: 40%;
}

.usuario {
    background-image: url(../img/fondo.png);
    background-size:cover;
    background-attachment:fixed;
    background-position: center;
   
}


nav{
    margin-top: 50px;
}

input[type="text"] {
    border: 0;
    border-bottom: 1px solid white;
    display: block;
    font-size: 12px;
    margin-top: 10px;
    margin-left: auto;
    margin-right: auto;
    padding-bottom: 6px;
    padding-top: 10px;
    width:50%;
    max-width: 300px;
    text-align: center;
   
}

.completar .boton {
    background-color: black;
    border: 0;
    cursor: pointer;
   display: flex;
    font-size: 12px;
    margin-top: 20px;
    padding: 6px 12px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 5em;
    
}
.boton a {
    color: white;
    font-family: 'Open Sans Condensed', sans-serif;
}


/* HOME */

.left img {
   max-width: 100%;
  vertical-align: bottom;   
}

/*BODY*/

#body-home{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    background-color: #69C0BA;
    height:50%;
    min-height: 100vh;
    font-family: "helvetica",sans-serif;
    box-sizing: border-box;
}

/*<header>*/

.encabezado {
    background-color:#69C0BA;
    overflow: hidden;
    padding: 10px;
    height: 60px;
    margin:0;
    width: 100%;
    position: fixed;
    z-index: 999;
    top:0;
}

.encabezado .left {
    float: left;
    width: 50px;
    margin-top: 3px;
    margin: auto;
    margin-left: 3px;
}

.encabezado .center {
    padding-left: 0.5em;
    float: left;
    width: 76%; 
}

.encabezado .right {
    float: left;
    width: 5%;
}

.right label {
    float: left;
}

.encabezado h1 {
    
    padding-bottom: 2px;
    margin-top: 0;
    font-weight: 100;
    font-family: 'Roboto', sans-serif;
    color: #FCC51D;
    font-size: 25px;
    font-weight: 700;
}

.encabezado p {
    margin-top:1px;
    font-family: 'helvetica', sans-serif;
    color: white;
    padding-top: 2px;
}

/*menu desplegable*/

.right input {
    display:none;   
}

.desplegable{
    padding: 0.3em;
    margin-bottom: 1em;
    margin-right: -100%;
    transition: all 0.3s;
    position: fixed;
    right:0;
    z-index: 999;
    background:#69C0BA;
    top: 45px;
   
    }

.desplegable img {
    padding: 1em;
    margin-left:1em;
}
   
#menu-bar:checked ~ .desplegable {
        margin:0;
}

header label {
    float: right;
    font-size: 28px;
    margin-right: 35px;
    cursor: pointer;  
}

.desplegable  a{
    color: #fff;
    height: 20px;
    text-decoration: none;
    padding: 10px;
    padding-right: 20px;
    display:flex;
    font-family: 'Roboto', sans-serif;  
}

.desplegable a:hover {
    background: rgba(51,51,51,0.3);
    width: 100%;
    border-left: 0.1em solid #fff;
}

/*MAIN*/

#main-home {
    background-color: #3C4457;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    height: 50vh;
    width: 100%;
    margin-top: 13vh;
}


#seccion-home {
    border-top: solid 1px rgba(0,0,0,.1);
    width: 100%;
    margin: 0;

}


.cuadros-home {
    padding-bottom: 20em;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    flex-wrap: wrap;
}

.cuadros-home img {
    display: flex;
}


.cuadros-home figure:hover figcaption{
    background-color: #3C4457;
    top: 0%;
}


.titulos-segmentos-home{
    color: white;
    font-family: 'Fjalla One', sans-serif;
    font-size: 5.2mm;
    font-weight: lighter;
    margin-top: 3vh;
    margin-left: 3vw;
}


/*CADA SECTOR*/

/*-seguimiento academico-*/

#sa-home{ 
    background:#FCC51D;
    height: 18vh;
    width: 100%;
    justify-content: flex-end;
    
}

#titulo-sa-home{
    color: #3C4457;
    font-family: 'Fjalla One', sans-serif;
    font-size: 7mm;
    font-weight: lighter;
    margin-top: 3vh;
    margin-left: 3vw;
}
#fondo-sa-home{
    display: flex; 
    justify-content: flex-end;
    width: 100%
}
#fondosa-home{
    width: auto;
    height: 15vh;
    margin-top: 3vh;
    align-content: flex-end;
}

.link-sa-home{
    color: #3C4457;
}

#icono-sa-home{
   width: auto;
    height: 5vh;
    margin-top: 2vh;
    margin-right: 3vw; 
}

#contenedor-icono-tituolo-home{
    display: flex;
    position: absolute;
    justify-content: space-between;
    width: 100%;
    
}

#contenedor-texto-icono-sa-home{
    display: flex;
    justify-content: space-between
}

#ver-mas-desplegable-sa-home{
    position: absolute;
    color: white;
    font-family: 'helvetica', sans-serif;
    font-size: 3.4mm;
    font-weight: bold;
    z-index: 500;
    margin-top: -4vh;
    margin-left: -4vw;
    color: #3C4457
   
}

#ver-mas-desplegable-sa-home:hover{
    color: #676C77; 
}

#menu-sa-home{
    margin-top: -9.5vh;
    background-color: #FCC51D;
    color: white;
    position: fixed;
    right: -110vw;
    top: 22.5vh;
    height: 18vh;
    width: 100vw;
    transition: all .6s ease;
    z-index: 999;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

#menu-sa-home:target {
    right: 0;
    transition: all .3s ease;
}

#menu-x-sa-home {
    padding: 5mm;
    color:#3C4457;
    position: absolute;
    right: 0;
    top: 0;
    font-size: 3.5mm;
    font-family: 'helvetica neue', sans-serif;
    font-weight: bold;
    background: transparent;
}

#menu-x-sa-home:hover {
    color: #676C76;
}

#ul-sa-home{
    display: flex; 
    justify-content: center;
    align-content: center;
    height: 18vh;
    padding-left: 5mm;
}

.link-sa-home {
    color:#3C4457;
    display: block;
    padding: 2.5mm;
    text-align: left;
    text-decoration: none;
    font-family: 'helvetica neue', sans-serif;
    font-size: 3.5mm;
    margin-top: 3vh;
}

.link-sa-home:hover {
    color: #676C76;
    background: #FFD96F;
}

/*CONTENEDOR PAGOS COMEDOR VIRTUAL*/

#contenedor-pagos-comedor-virtual-home{
  display: flex;
  height: 32vh;
}

/*-Pagos-*/

#pagos-home{
    display: flex; 
    background:#3C4457;
    height: 32vh;
    width: 50%;
    height: 32vh;
}

#link-pagos-home-grande{
    height: 50%;
    width: 32vh;
    margin: 0;
}

#fondo-pagos-home{
    height:32vh;
    width: auto;

} 

#contenedor-icono-titulo-pagos-home{
    display: flex;
    position: absolute;
    justify-content: space-between;
    width: 50%;
}

#icono-pagos-home{
    width: auto;
    height: 5vh;
    margin-top: 2vh;
    margin-right: 3vw; 
    z-index: 1;
}


#texto-pagos-1-home{
    position: absolute;
    color: #69C0BB;
    font-family: 'helvetica', sans-serif;
    font-size: 3.5mm;
    font-weight: bold;
    margin-top: -24vh;
    padding: 3vw;
    width: 50%;
    
}

#texto-pagos-2-home{
    position: absolute;
    color: white;
    font-family: 'helvetica', sans-serif;
    font-size: 3.4mm;
    font-weight: normal;
    margin-top: -17vh;
    margin-left: 3vw; 
}

/*CONTENEDOR COMEDOR VIRTUAL*/

#contenedor-comedor-virtual-home{
    display: block;  
    width: 50%;
}

#ver-mas-desplegable-home{
    color: white;
    font-family: 'helvetica', sans-serif;
    font-size: 3.3mm;
    font-weight: bold;
    margin-left: -4vw;
    padding-left: 0vw;
}

#ver-mas-desplegable-home:hover{
    color: #E6E8E8; 
}

/*-Comedor-*/

#comedor-home{
    background: #E53434;
    height: 16vh;
    width: 50vw; 
}


#icono-comedor-home{
    width: auto;
    height: 5vh;
    margin-top: 2vh;
    margin-right: 5vw; 
}

#contenedor-texto-icono-comedor-home{
    display: flex;
    justify-content: space-between
}


#menu-comedor-home{
    margin-top: 45px;
    background-color: #E53434;
    color: white;
    position: fixed;
    right: -55vw;
    margin-top: -9.7vh;
    height: 16vh;
    width: 50vw;
    transition: all .6s ease;
    z-index: 999;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

#menu-comedor-home:target {
    right: 0;
    transition: all .3s ease;
}

#menu-comedor-home a:hover {
    color: #D9DADB;
    background: #F95A5A;
}

#menu-x-comedor-home {
    color: white;
    position: absolute;
    right: 0;
    top: 0;
    font-family: 'helvetica neue', sans-serif;
    font-weight: bold;
    background: transparent;
    margin-top: 2vh;
    font-size: 3mm;
}

#menu-comedor-home a {
    color:white;
    display: block;
    padding: .1em 1em;
    text-align: left;
    text-decoration: none;
    font-family: 'helvetica neue', sans-serif;
    font-size: 3.5mm;
    margin-top: 4mm;
    margin-left: -5vw;
}

/*-Virtual-*/

#virtual-home{
    display: block;
    background: #FCC51D;
    height: 16vh;
    width: 50vw; 
    
}

#contenedor-texto-icono-virtual-home{
    display: flex;
    justify-content: space-between
}

#icono-virtual-home{
   width: auto;
    height: 5vh;
    margin-top: 2vh;
    margin-right: 5vw; 
}


#menu-virtual-home{
    background-color: #FCC51D;
    color: white;
    position: fixed;
    right: -55vw;
    margin-top: -9.8vh;
    height: 16vh;
    width: 50vw;
    min-width: 50vw;
    transition: all .6s ease;
    z-index: 999;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

#menu-virtual-home:target {
    right: 0;
    transition: all .3s ease;
}

#menu-virtual-home a:hover {
    color: #EAEAEA;
    background: #FFD96E;
}

#menu-x-virtual-home {
    color: white;
    position: absolute;
    right: 0;
    top: 0;
    font-family: 'helvetica neue', sans-serif;
    font-weight: bold;
    background: transparent;
}

#menu-virtual-home a {
    color:white;
    display: block;
    padding: .1em 1em;
    text-align: left;
    text-decoration: none;
    font-family: 'helvetica neue', sans-serif;
    font-size: 3.5mm;
    margin-top: 4mm;
    margin-left: -5vw;
}

/*CONTENEDOR COMUNICADOS CALENDARIO*/

#contenedor-comunicados-calendario-home{
    display: flex;
    height: 70vh;
}

/*-Comunicados-*/

#comunicados-home{
    display: flex;
    background:#E53434;
    height: 75vh;
    width: 50vw;
}

#contenedor-texto-icono-comunicados-home{
   display: flex;
    position: absolute;
    justify-content: space-between;
    width: 50%;  
}

#icono-comunicados-home{
   width: auto;
    height: 5vh;
    margin-top: 2vh;
    margin-right: 3.1vw;  
}

#subtitulo-comunicados-1-home{
    position: absolute;
    color: white;
    font-family: 'helvetica', sans-serif;
    font-size: 4mm;
    font-weight: bold;
    margin-top: 10vh;
    margin-left: 3vw;
}

#subtitulo-comunicados-2-home{
    position: absolute;
    color: white;
    font-family: 'helvetica', sans-serif;
    font-size: 4mm;
    font-weight: bold;
    margin-top: 26vh;
    margin-left: 3vw;
}

#texto-comunicados-1-home{
    position: absolute;
    color: white;
    font-family: 'helvetica', sans-serif;
    font-size: 4mm;
    font-weight: lighter;
    width: 40%;
    margin-top: 10vh;
    margin-left: 3vw;
}

#texto-comunicados-2-home{
    position: absolute;
    color: white;
    font-family: 'helvetica', sans-serif;
    font-size: 4mm;
    font-weight: lighter;
    width: 40%;
    margin-top: 26vh;
    margin-left: 3vw;
    box-sizing: border-box;
}

#icono-notificaciones-home{
    width: auto;
    height: 5vh;
    margin-top: 54vh;
    margin-left: -20vw;
}

/*Calendario*/

#calendario-home{
    display: flex;
    background:#69C0BB;
    height: 75vh;
    width: 50%;
    justify-content: flex-end;
     
}

#fondo-calendario-home{
   position: absolute;
   max-width: 40%;
height: auto;
}

#contenedor-titulo-calendario-home{
    display: flex;
    height: 70vh;
    width: 50vw; 
    
}
#titulo-calendario-home{
   position: absolute;
   font-family:'Fjalla One', sans-serif;
   color: #3C4457;
   font-size: 7mm;
   font-weight: lighter;
   z-index: 2;
   margin-top: 2vh;
   margin-left: 3vw;
}

#imagen-calendario-home{
    position: absolute;     
    height:25vh;
    width: auto; 
    z-index: 1;
    margin-top: 9vh;
    margin-left: 3vw;
}

#cotenedor-texto-calendario-home{
    display: block;
    position: absolute;
    width: 40vw;
    margin-top: 37vh;
    margin-left: -5vw;
}

.subtitulo-calendario-home{
    font-family:'helvetica', sans-serif;
   color: #FCC51D;
   font-size: 4.5mm;
   font-weight: bold;
    margin-bottom: 8mm;
}

.texto-calendario-1-home{
    font-family:'helvetica', sans-serif;
   color: white;
   font-size: 4mm;
   font-weight: normal;
    margin-top: -5mm;
}

.texto-calendario-2-home{
    font-family:'helvetica', sans-serif;
   color: white;
   font-size: 4mm;
   font-weight: normal;
    margin-top: -5mm;
}

#link-calendario-home{
   position: absolute;
    color: white;
    font-family: 'helvetica', sans-serif;
    font-size: 3.3mm;
    font-weight: bold;
    margin-top: 3vh;
    z-index: 1000;
}

#link-calendario-home:hover{
    color: #E6E8E8; 
}

/*@media Home*/


@media (min-width: 38em) {

#body-home{

    background-color: white;
}
    
/*HEADER*/

/*<header>*/

.encabezado .left {

    margin-left: 9vh;
}

.encabezado .center {
    width: 69%; 
}

.encabezado .right {
    float: left;
    width: 5%;
}

.encabezado h1 {
    
    padding-bottom: 2px;
    margin-top: 0;
    font-weight: 100;
    font-family: 'Roboto', sans-serif;
    color: #FCC51D;
    font-size: 25px;
    font-weight: 700;
}

.encabezado p {
    margin-top:1px;
    font-family: 'helvetica', sans-serif;
    color: white;
    padding-top: 2px;
}

/*menu desplegable*/

.right input {
    display:none;   
}

    
.desplegable{
    padding: 0.3em;
    margin-bottom: 1em;
    margin-right: -100%;
    transition: all 0.3s;
    position: fixed;
    right:0;
    z-index: 999;
    background:#69C0BA;
    top: 45px;
}
 
/*main*/
    
 #main-home {
    background-color: white;
     width: 80%
 }


.titulos-segmentos-home{
    color: white;
    font-family: 'Fjalla One', sans-serif;
    font-size: 5.2mm;
    font-weight: lighter;
    margin-top: 3vh;
    margin-left: 3vw;
}

/*sa*/
    
#sa-home{ 
    background:#FCC51D;
    height: 13vh;
    width: 100%;
    margin-top: 3vh;
}

#titulo-sa-home{
    color: #3C4457;
    font-family: 'Fjalla One', sans-serif;
    font-size: 7mm;
    font-weight: lighter;
    margin-top: 3vh;
    margin-left: 3vw;
}
#fondo-sa-home{
    width: 100%;
    height: 13vh;
}

#fondosa-home{
    opacity: 0;
}


#icono-sa-home{
    opacity: 0;
}

#contenedor-icono-tituolo-home{
    display: flex;
    position: absolute;
    justify-content:flex-start;
    width: 70vw;
}

#ver-mas-desplegable-sa-home{
    margin-top: -4vh;
    margin-left: -2vw;
}

#menu-sa-home{
    margin-top: -6.3vh;
    height: 13vh;
}

#ul-sa-home{
    height: 13vh;
    padding-left: 5mm;
}

.link-sa-home {

    padding: 3mm;
    font-size: 4mm;
    margin-top: 1vh;
}

/*CONTENEDOR PAGOS COMEDOR VIRTUAL*/

#contenedor-pagos-comedor-virtual-home{
  flex-direction: column;
  height: 41vh;
  margin-top: 2vh;
}

/*PAGOS*/

#pagos-home{
    height: 13vh;
    width: 100%;
}

#link-pagos-home-grande{
    height: 13vh;
    width: 100%;
}

#fondo-pagos-home{
    height:13vh;
    width: auto;
} 

#icono-pagos-home{
   opacity: 0;
}

#texto-pagos-1-home{
    opacity: 0;
}

#texto-pagos-2-home{
    opacity: 0;
}

/*CONTENEDOR COMEDOR VIRTUAL*/

#contenedor-comedor-virtual-home{
    flex-direction: column;
    width: 100%;
    height: 28vh;
}

#ver-mas-desplegable-home{
    top: 5mm;
    margin-left: -3vw;
}

#ver-mas-desplegable-home:hover{
    color: #E6E8E8; 
}


/*COMEDOR*/

#comedor-home{
    height: 13vh;
    width: 100%; 
    margin-top: 2vh;
}


#icono-comedor-home{
    opacity: 0;
}

#contenedor-texto-icono-comedor-home{
    margin-bottom: 2vh;
}


#menu-comedor-home{
    display:flex;
    justify-content: center;
    margin-top: 45px;
    right: -105vw;
    margin-top: -13.6vh;
    height: 13vh;
    width: 100%;
}


#menu-comedor-home a {
    text-align: center;
    font-size: 4mm;
    margin-top: 4mm;
}


/*VIRTUAL*/

#virtual-home{
   height: 13vh;
    width: 100%; 
    margin-top: 2vh;
}
    
#contenedor-texto-icono-virtual-home{
    margin-bottom: 2vh;
}

#icono-virtual-home{
   opacity: 0;
}


#menu-virtual-home{
    display: flex;
    justify-content: center;
    right: -105vw;
    margin-top: -13.6vh;
    height: 13vh;
    width: 100%;
}


#menu-virtual-home a {
    text-align: center;
    font-size: 4mm;
}


/*CONTENEDOR COMUNICADOS CALENDARIO*/

#contenedor-comunicados-calendario-home{
    flex-direction: column;
    height: 55vh;
    margin-top: 5vh;
}

/*COMUNICADOS*/

#comunicados-home{
    height: 13vh;
    width: 100%;
    margin-bottom: 3vh;
    margin-top: 0vh;

}

#contenedor-texto-icono-comunicados-home{
    width: 70%;  
}

#icono-comunicados-home{
   opacity: 0;  
}

#subtitulo-comunicados-2-home{
  opacity: 0;
}

#subtitulo-comunicados-1-home{
    margin-top: 3.7vh;
    margin-left: 20vw;  
}

#texto-comunicados-1-home{
    font-size: 3.5mm;
    width: 55%;
    margin-top: 5vh;
    margin-left: 20vw;
}

#texto-comunicados-2-home{
   opacity: 0;
}

#icono-notificaciones-home{
    height: 3vh;
    margin-top: 8vh;
    margin-left: -36vw;
}

/*CALENDARIO*/


#calendario-home{
    height: 40vh;
    width: 100%;
    justify-content: flex-end;
     
}

#fondo-calendario-home{
   opacity: 0;
}

#contenedor-titulo-calendario-home{
    display: flex;
    height: 40vh;
    width: 100%; 
    
}
#titulo-calendario-home{
   position: absolute;
   font-family:'Fjalla One', sans-serif;
   color: #3C4457;
   font-size: 7mm;
   font-weight: lighter;
   z-index: 2;
   margin-top: 2vh;
   margin-left: 3vw;
}

#imagen-calendario-home{
    position: absolute;     
    height:25vh;
    width: auto; 
    z-index: 1;
    margin-top: 9vh;
    margin-left: 3vw;
}

#cotenedor-texto-calendario-home{
    width: 30%;
    margin-top: 9vh;
    margin-left: -0vw;
}

.subtitulo-calendario-home{
   margin-bottom: 11mm;
    
}

.texto-calendario-1-home{
    margin-top: -5mm;
}
}


/*@media Home*/


@media (min-width: 75em) {

#body-home{

    background-color: d;
}
    
/*HEADER*/

/*<header>*/

.encabezado .left {
   margin-left: 17vh;
}

.encabezado .center {
    width: 74%; 
}

/*sa*/
    
#ver-mas-desplegable-sa-home{
    margin-top: -4vh;
    margin-left: 0vw;
}

#menu-sa-home{
    margin-top: -4vh;
}

/*CONTENEDOR PAGOS COMEDOR VIRTUAL*/

#contenedor-pagos-comedor-virtual-home{
  flex-direction: column;
  height: 41vh;
  margin-top: 2vh;
}

/*CONTENEDOR COMEDOR VIRTUAL*/

#contenedor-comedor-virtual-home{
    flex-direction: column;
    width: 100%;
    height: 28vh;
}

#ver-mas-desplegable-home{
    margin-left: 0vw;
}

/*COMEDOR*/


#menu-comedor-home{
   margin-top: -11.3vh;
}


/*VIRTUAL*/

#menu-virtual-home{
    margin-top: -11.3vh;
}


/*CONTENEDOR COMUNICADOS CALENDARIO*/

#contenedor-comunicados-calendario-home{
    flex-direction: column;
    height: 55vh;
    margin-top: 5vh;
}

/*COMUNICADOS*/

#subtitulo-comunicados-1-home{
    margin-top: 3.4vh;
    margin-left: 41vw;  
}

#texto-comunicados-1-home{
    width: 40%;
    margin-top: 5vh;
    margin-left: 41vw;
}

#icono-notificaciones-home{
    margin-top: 7vh;
    margin-left: -36.5vw;
}

/*CALENDARIO*/

#titulo-calendario-home{
   position: absolute;
   font-family:'Fjalla One', sans-serif;
   color: #3C4457;
   font-size: 7mm;
   font-weight: lighter;
   z-index: 2;
   margin-top: 2vh;
   margin-left: 3vw;
}

#imagen-calendario-home{     
    height:27vh;
    margin-top: 8vh;
}

#cotenedor-texto-calendario-home{
    width: 30%;
    margin-top: 13vh;
    margin-left: -0vw;
}

.subtitulo-calendario-home{
   margin-bottom: 11mm;
    
}

.texto-calendario-1-home{
    margin-top: -5mm;
}
}


/*PAGOS*/
.fondopagos {
    background-image: url(../img/fondopag.jpg);
    background-repeat: no-repeat;
    
    
}

.scrol {
    top: 30px;
    z-index: 995;
    background-color: #3b4458;
    padding: 10px;
    margin-top: 50px;
    position: relative;
}

.scrol ul {
    margin: 0;
    overflow: hidden;
    padding-left: 0;
}

.scrol li {
    list-style: none;
    float: left;
    text-align: center;
    width: 25%;
}

.scrol img {
    height: 30px;
}

.scrol a{
    color: white;
    list-style: none;
    font-family: 'Roboto', sans-serif;
    text-decoration: none;
    font-size: 12px;
}

.raya:hover{
    
    border-bottom: 2px solid #fff; 
}

.raya2:hover{
    border-bottom:2px solid #3C4457;
}

.pagos {
    
    top:30px;
    position: relative;
    height: 60vh;
    padding: 20px;
    margin: auto;
}
.pagos h2 {
    font-family: 'Fjalla One', sans-serif;
    font-weight: 100;
    font-size: 18px;
    color: white;
}

.pagos form {
    overflow: hidden;
    width: 100%;
    font-family: 'Helvetica', sans-serif;
    color: white;
    text-align: center;
  
}

.pagos input[type="text"] {
    background-color: #5A6775
    border: 0;
    border-bottom: 1px solid gray;
    display: block;
    font-size: 16px;
    margin-top: 10px;
    margin-bottom: 20px;
    padding-bottom: 10px;
    padding-top: 10px;
    width: 100%;
    margin-right: auto;
}
.pagos input[type="date"] {
    display: block;
}

.pagos .boton {
    background-color: #3b4458;
    border: 0;
    color: white;
    cursor: pointer;
    display: flex;
    font-size: 16px;
    margin-top: 20px;
    margin-right: auto;
    padding: 8px 10px;
    font-family: 'Roboto', sans-serif;
    
}


/*<footer>*/
.piecomedor { 
    background-color:#e52f34;
    display: flex;
    padding: 5px;
    height: 40px;
    width: 100%;
    position: fixed;
    z-index: 9999;
    bottom: 0;
}


.piepagos { 
    background-color:#3b4458;
    display: flex;
    padding: 5px;
    height: 40px;
    width: 100%;
    position: fixed;
    z-index: 9999;
    bottom: 0;
}

 .casita {
    float: left;
    width: 50px;
    margin-top: 3px;
    margin: auto;
    margin-left: 3px;
    
}
.casita img{
    width: 30px;
}

.lugar {
    text-align: center;
    float: left;
    width: 65%; 
}
.fotoperfil img{
    padding-right: 2em;
    width: 45px;
}
.fotoperfil {
    float: left;
    width: 5%;
    margin-right: 3em;
}


h3 {
    
    padding-bottom: 2px;
    margin-top: 0;
    font-weight: 100;
    font-family: 'Roboto', sans-serif;
    color: white;
    font-size: 18px;
    font-weight: 700;
}


/*VIRTUAL*/

.fondovirtual{
    background-image: url(../img/fondovirtual.jpg);
}

.scrolvirtual {
    
    top: 30px;
    z-index: 995;
    background-color: #fcc520;
    padding: 10px;
    margin-top: 50px;
    position: relative;
}

.scrolvirtual ul {
    margin: 0;
    overflow: hidden;
    padding-left: 0;
}

.scrolvirtual li {
    list-style: none;
    float: left;
    text-align: center;
    width: 25%;
}

.scrolvirtual img {
    height: 30px;
}

.scrolvirtual a{
    color: #3c4458;
    list-style: none;
    font-family: 'Roboto', sans-serif;
    text-decoration: none;
    font-size: 12px;
}


.pievirtual{
    background-color:#fcc520;
    display: flex;
    padding: 5px;
    height: 40px;
    width: 100%;
    position: fixed;
    z-index: 9999;
    bottom: 0;
}
iframe{
    margin-top: 10px;
    margin-left: 30px;
    width: 90%;
    margin-bottom: 10%;
    
    
}
.pievirtual h3 {
    color: #3c4458;
    margin-left: 8px;
    margin-bottom: 15px;
}
video {
    height: 50%;
   margin-bottom: auto;
   margin-top: 50px;
    width: 90%;
    
}

/*SEGUIMIENTO ACADÉMICO*/
.mainsa img {
    width: 100%;
    margin-top:  50px;
}
.mainsa {
    margin-bottom: 20%;
}

.fondosa{
    background-image: url(../img/fondosa.jpg);
}

.scrolsa {
    top: 30px;
    z-index: 995;
    background-color: #FCC51D;
    padding: 10px;
    margin-top: 50px;
    position: relative;
}

.scrolsa ul {
    margin: 0;
    overflow: hidden;
    padding-left: 0;
}

.scrolsa li {
    list-style: none;
    float: left;
    text-align: center;
    width: 25%;
}

.scrolsa img {
    height: 30px;
}

.scrolsa a{
    color: #3C4457;
    list-style: none;
    font-family: 'Roboto', sans-serif;
    text-decoration: none;
    font-size: 12px;
}

    
.piesa h3{
    color: #3C4457;
}

.piesa{
    background-color:#FCC51D;
    display: flex;
    padding: 5px;
    height: 40px;
    width: 100%;
    position: fixed;
    z-index: 9999;
    bottom: 0;
}

/*AGENDA*/
.fondoagenda {
    background-image: url(../img/fondoagenda.jpg);
}

.scrolagenda {
    
    border-top: 0.1em solid #fff;
    top: 30px;
    z-index: 995;
    background-color: #68c0ba;
    padding: 10px;
    margin-top: 50px;
    position: relative;
    bottom: 0;
    
}

.scrolagenda ul {
    margin: 0;
    overflow: hidden;
    padding-left: 0;
}

.scrolagenda li {
    margin-left:15%;
    margin-right: 10%;
    list-style: none;
    float: left;
    text-align: center;
    width: 25%;
}

.scrolagenda img {
    height: 30px;
}

.scrolagenda a{
    color: #3C4457;
    list-style: none;
    font-family: 'Roboto', sans-serif;
    text-decoration: none;
    font-size: 12px;
}


.mainagenda {
    margin-top: 50px;
    width: 100%;
    
}

.mainagenda .fotosizq {
   
    float: left;
    width: 50px;
    margin-top: 3px;
    margin: auto;
    margin-left: 3px;
}

.mainagenda .listado {
    padding-left: 0.5em;
    float: left;
    width: 65%; 
}



.mainagenda p5 {
    
    display: block;
    padding:2em;
    padding-bottom: 2px;
    font-family: 'Roboto', sans-serif;
    margin: auto;
}

.barra{
    display: flex;
    background-color: #3C4457; 
    width: 80%;
    margin: 0;
    
}

.barra p8{
    margin-left: 5px;
    color: white;
    font-family: 'Fjalla One', sans-serif; 
}

.mainagenda .costado {
    cursor: pointer;
    float: right;
    width: 2%;
    background-color: #3C4457;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 5px;
    padding-bottom: 5px;
    
}
.costado p7 {
    color: white;
    font-family: 'Roboto', sans-serif;
}

.buscador {
    cursor: pointer;
    position: fixed;
    float: right;
    margin-left: 80%;
    bottom: 10%;
}

.pieagenda h3{
    color: #3C4457;
}

.pieagenda{
    background-color:#68c0ba;
    display: flex;
    padding: 5px;
    height: 40px;
    width: 100%;
    position: fixed;
    z-index: 9999;
    bottom: 0;
    
}
/*COMUNICADOS*/

.fondocomunicados {
    background-image: url(../img/fondocomunicados.jpg);
}

.scrolcomunicados {
    top: 30px;
    z-index: 995;
    background-color: #e52f34;
    padding: 10px;
    margin-top: 50px;
    position: relative;
}

.scrolcomunicados ul {
    margin: 0;
    overflow: hidden;
    padding-left: 0;
}

.scrolcomunicados li {
    margin-left: 10px;
    list-style: none;
    float: left;
    text-align: center;
    width: 28%;
}

.scrolcomunicados img {
    height: 30px;
}

.scrolcomunicados a{
    color: white;
    list-style: none;
    font-family: 'Roboto', sans-serif;
    text-decoration: none;
    font-size: 12px;
}


.piecomunicados{
    background-color:#e52f34;
    display: flex;
    padding: 5px;
    height: 40px;
    width: 100%;
    position: fixed;
    z-index: 9999;
    bottom: 0;
}



/*COMEDOR*/
.fondocomedor{
    background-image: url(../img/fondocomedor.jpg);
}


.menu-comedor{
    display: block;
    margin-top: 30px;

}

.mes{
   font-family: "roboto", sans-serif;
    font-weight: 500;
    color: white;
    padding: 15px 6px;
    width: 100%;
    text-align: center;
    margin: auto;
    margin-left: 0;
    display: flex;
    font-size: 11pt;
   }


.mayo:active, .junio:active, .julio:active, agosto:active, .septiembre:active{
    font-size: 15pt;
    color:#69C0BA;
}
.mayo:hover, .junio:hover, .julio:hover, .agosto:hover, .septiembre:hover {
    font-size: 13pt;
}


.mes, .semana{
   cursor: pointer;
}

.menu-tradicional{
    font-family: "helvetica", sans-serif;
    font-size: 10pt;
    margin: auto;
    text-align: center;
    width: 50%;
    margin-top: 4em;
    border: 3px solid #fff;
    display: flex;
    float: left;
    margin-left: 3em;
    flex-direction: column;
    padding-top: 30px;
    padding-bottom: 30px;
    
   }

.titulo-menu{
    font-family: "helvetica", sans-serif;
    font-weight: 800;
    color:white;
    font-size: 12pt;
    display: flex;
    flex-wrap: wrap;
}

.info-menu{
    font-family: "helvetica", sans-serif;
    color:#232a3d;
    
}

span{
    font-weight: 700
}

.semana{
    padding: 10px 10px;
    font-family: "helvetica", sans-serif;
    font-size: 11pt;
    color: white;
    font-weight: 600;
    display: flex;
    flex-direction: column;
    margin-top: 1.2em;
    margin-right: 0.3em;
}

.lunes:hover, .martes:hover, .miercoles:hover, .jueves:hover, .viernes:hover {
    font-size: 12pt;
}

.scrolcomedor {
    top: 30px;
    z-index: 995;
    background-color: #e52f34;
    padding: 10px;
    margin-top: 50px;
    position: relative;
}

.scrolcomedor ul {
    margin: 0;
    overflow: hidden;
    padding-left: 0;
}

.scrolcomedor li {
    list-style: none;
    float: left;
    text-align: center;
    width: 25%;
}

.scrolcomedor img {
    height: 30px;
}

.scrolcomedor a{
    color: white;
    list-style: none;
    font-family: 'Roboto', sans-serif;
    text-decoration: none;
    font-size: 12px;
}