@font-face {
  font-family: Pompadour;
  src: url("../fonts/02_APompadourTextSample.ttf");
}

@font-face {
  font-family: Pompadour;
  src: url("../fonts/03_APompadourBoldSample.ttf");
  font-weight: bold;
}


@font-face {
  font-family: Encode;
  src: url("../fonts/encode/EncodeSans-Bold.ttf");
  font-weight: bold;
}


@font-face {
  font-family: Encode;
  src: url("../fonts/encode/EncodeSans-Light.ttf");
  font-weight: 100;
}

@font-face {
  font-family: Encode;
  src: url("../fonts/encode/EncodeSans-Medium.ttf");
}



html *
{
   font-family: Montserrat; !important;
}

.wrapper { overscroll-behavior: none } /* para sacar el pull to refresh en el browser */


    :root {   
        --colorFondo: #f7f7f7;        
        --colorhxep: #49a5eb;
        --colorhxepLight: #1b8de4;
        --colorhxepLight2: #e8f4fc;
        --coloramarillo: #cca300;
        --colorrojo: #d60405;
        --colorverde: #2c800e;
        --colorceleste: #2e88d6;
        --colorbordo: #4d0302;
        --colorturquesa: #01755e;
        --colorEncabezado: #3f51b5;
        --colorSolUC: #fdc600;
        --colorAzul: #00a8e4;
        --transparenciaFondo: #0000004d;

    }      

   /* .row { margin-bottom: 0; }
    .col { margin-top: 0px;  margin-right: 0px; padding: 1px ;} */

    .row { margin-bottom: 0; }
    .col { margin-top: 1px;  margin-right: 0px; padding: 1px !important;}    
    
    .row .col.s7 {
            height: 11px;    
    }

    .encabezado1   {
        background-color: var(--colorEncabezado);
        height: 12vh; !important;  
        font-size:7vw; 
        letter-spacing: 3px;
        color: white;
        font-weight: bold;  
        text-align: center;        
        z-index:1;         
    }   

    ul {
      list-style-type: circle;
      padding: 0;
      border: 1px solid #ddd;
    }

    ul li {
      padding: 2vh 4vw;
      border-bottom: 1px solid #ddd;
    }

    ul li:last-child {
      border-bottom: none
    }


    div.sticky {
      position: -webkit-sticky;
      position: sticky;
      background-color: var(--colorhxepLight2);
      top: 0;
      
    }

    .solUC {   
        height: 80%;
        width: auto;
        display: inline-block;
        line-height: 12vh;
        vertical-align: middle;           
    }

    .vcentrado {
        display: inline-block;
        line-height: 12vh;
        vertical-align: middle;        
    }


.fotoPerfil {
    background-image: url("../gAuth.php?img");   
    background-size: 50%;
    border-radius: 50%;          
    background-repeat: no-repeat;
    width: 100%;
    height: 100%;     
    background-position: center center;   
}   


    .letraLight {
        font-weight: 300;
        transform: scale(1, 1.3);
        -webkit-transform: scale(1, 1.3); /* Safari and Chrome */
        -moz-transform: scale(1, 1.3); /* Firefox */
        -ms-transform: scale(1, 1.3); /* IE 9+ */
        -o-transform: scale(1, 1.3); /* Opera */        
    }

    .letraBold {
        font-weight: 900;
        transform: scale(1, 1.3);
        -webkit-transform: scale(1, 1.3); /* Safari and Chrome */
        -moz-transform: scale(1, 1.3); /* Firefox */
        -ms-transform: scale(1, 1.3); /* IE 9+ */
        -o-transform: scale(1, 1.3); /* Opera */        
    }

    .btn-wp {
        background-image: url("../assets/wp.png");   
        background-size: 80%;  
        background-repeat: no-repeat;
        background-position: center center;                     
    }

    .btn-fb {
        background-image: url("../assets/fb.png");   
        background-size: 40%;  
        height: 6.6vh;
        background-repeat: no-repeat;
        background-position: center center;                     
    }

    .btn-ig {
        background-image: url("../assets/ig.png");   
        background-size: 40%;  
        height: 6.6vh;        
        background-repeat: no-repeat;
        background-position: center center;                     
    }

    .btn-sh {
        background-image: url("../assets/sh.png");   
        background-size: 40%;  
        background-repeat: no-repeat;
        background-position: center center;                     
    }  

    .btn-cerrar {
        background-image: url("../assets/cerrar.png");   
        background-size: 30%;  
        background-repeat: no-repeat;
        background-position: center center;                     
    }      

    .tile {
        background-image: url("../assets/busBlanco.png?a=4");
        border-radius: 1vh;
        background-repeat: no-repeat;
        background-position: center 80%;         
        background-size: 40%;
        height: 12vh; !important;         
        text-transform:uppercase;
        font-size:6vw; 
        letter-spacing: 3px;
        ttext-shadow: 1px 1px ;
        color: white;
        font-weight: bold;
        padding-top: 4px;
        position: relative;
    }


    .encabezadoDetalle {
        border-radius: 1vh;
        height: 10vh; !important;
        line-height: 10vh;                      
        ztext-transform:uppercase;
        font-size:5vw; 
        zletter-spacing: 2px;
        xtext-shadow: 1px 1px ;  
        color: black;
        font-weight: 500;
        position: relative;
        border: 3px;
        border-style: solid;     
        border-color: var(--colorhxep);         
    }   


    .boton3x1 {
        border-radius: 1vh;
        height: 32.5vh; !important;
        xline-height: 11vh;                      
        text-transform:uppercase;
        font-size:7vw; 
        xletter-spacing: 2px;
        xtext-shadow: 1px 1px ;  
        color: black;
        font-weight: 500;
        padding-top: 40px;
        position: relative;
        border: 3px;
        border-style: solid;     
        border-color: var(--colorhxep);         
    }    

    .boton6x1 {
        text-align: left;
        border-radius: 1vh;
        height: 13.7vh; !important;
        xline-height: 11vh;                      
        text-transform:uppercase;
        font-size:5vw; 
        xletter-spacing: 2px;
        xtext-shadow: 1px 1px ;  
        color: black;
        font-weight: 500;
        xpadding-top: 15px;
        position: relative;
        border: 3px;
        border-style: solid;     
        border-color: var(--colorhxep);   
    }        

    .boton4x2 {
        text-align: center;
        border-radius: 1vh;
        height: 24.7vh; !important;
        xline-height: 11vh;                      
        text-transform:uppercase;
        font-size:4.5vw; 
        xletter-spacing: 2px;
        xtext-shadow: 1px 1px ;  
        color: black;
        font-weight: 500;
        padding-top: 15px;
        position: relative;
        border: 3px;
        border-style: solid;     
        border-color: var(--colorhxep);   
    }    

    .boton2x2 {
        text-align: center;
        border-radius: 1vh;
        height: 49.5vh; !important;
        xline-height: 11vh;                      
        text-transform:uppercase;
        font-size:5vw; 
        xletter-spacing: 2px;
        xtext-shadow: 1px 1px ;  
        color: black;
        font-weight: 500;
        padding-top: 15px;
        position: relative;
        border: 3px;
        border-style: solid;     
        border-color: var(--colorhxep);   
    } 

    .boton5x2 {
        text-align: center;
        border-radius: 1vh;
        height: 19.7vh; !important;
        xline-height: 11vh;                      
        text-transform:uppercase;
        font-size:4.5vw; 
        xletter-spacing: 2px;
        xtext-shadow: 1px 1px ;  
        color: black;
        font-weight: 500;
        padding-top: 50px;
        position: relative;
        border: 3px;
        border-style: solid;     
        border-color: var(--colorhxep);   
    }  

    .boton2x1 {
        text-align: center;
        border-radius: 1vh;
        height: 48.8vh;  
        line-height: 48vh;                      
        text-transform:uppercase;
        font-size:7vw; 
        letter-spacing: 2px;
        xtext-shadow: 1px 1px ;  
        color: black;
        font-weight: 500;
        padding-top: 10px;
        position: relative;
        border: 3px;
        border-style: solid;     
        border-color: var(--colorhxep);   
    }  

    .boton2x1b {
        text-align: center;
        border-radius: 1vh;
        height: 45vh;  
        xline-height: 48vh;                      
        text-transform:uppercase;
        font-size:5vw; 
        xletter-spacing: 2px;
        xtext-shadow: 1px 1px ;  
        color: black;
        font-weight: 500;
        padding-top: 10px;
        position: relative;
        border: 3px;
        border-style: solid;     
        border-color: var(--colorhxep);   
    }  




    .mapa {
        height: 54vh; !important;
    }

    .leyenda {
        text-align: center;
        border-radius: 1vh;
        height: 8vh; !important;
        line-height: 8vh;                      
        text-transform:uppercase;
        font-size:4vw; 
        xletter-spacing: 2px;
        xtext-shadow: 1px 1px ;  
        color: black;
        font-weight: 500;
        position: relative;
    }  

    .protocolo {
        padding-top: 25%;        
        font-size:7vw;  
    }

    .lineas {
            padding-top: 45%;         
            background-repeat: no-repeat;
            background-position: center bottom;         
            background-size: 30%;
            height: 1vh;
    }

    .lineasNumeroGrande {
        font-size:7vw;         
        font-weight: 700;        
    }

    .textoCarrera {
        margin-top: 18%;
    }

    .spacer {
        text-align: center;
        border-radius: 1vh;
        height: 10vh; !important;
        xline-height: 50vh;                      
        text-transform:uppercase;
        font-size:5vw; 
        xletter-spacing: 2px;
        xtext-shadow: 1px 1px ;  
        color: black;
        font-weight: 500;
        padding-top: 15px;
        position: relative;
    }  


.matriculacion {  background-image: url("../assets/matriculacion.png");   }
.inscripcionCursadas {  background-image: url("../assets/inscripcion.png");   }
.revisacionMedica {  background-image: url("../assets/medico.png");   }
.problemasSIU {  background-image: url("../assets/problemasconelSIU.png");   }
.certificadoRegular {  background-image: url("../assets/certificadoalumnoregular.png");   }
.carnetComedor {  background-image: url("../assets/come.png");   }
.carnetDeportivo {  background-image: url("../assets/deportes.png");   }


.bedelia {  background-image: url("../assets/bedelia.png");   }
.consejeros {  background-image: url("../assets/consejeres.png");   }
.divisionAlumnos {  background-image: url("../assets/divisionalumnos.png");   }
.ptd {  background-image: url("../assets/ptd.png");   }
.siuGuarani {  background-image: url("../assets/SIUguarani.png");   }
.teoricosPracticos {  background-image: url("../assets/teoricopractico.png");   }
.promocion {  background-image: url("../assets/promocion.png");   }
.pasivoActivo {  background-image: url("../assets/pasivoactivo.png");   }
.gestor {  background-image: url("../assets/gestor.png");   }
.departamentos {  background-image: url("../assets/dtos.png");   }
.deportes {  background-image: url("../assets/deportes.png");   }
.mesaentradas {  background-image: url("../assets/mesaentradas.png");   }
.divisiondocencia {  background-image: url("../assets/divisiondocencia.png");   }
.divisionconcursos {  background-image: url("../assets/divisionconcursos.png");   }
.planofacu {  background-image: url("../assets/planoFacultadHumanidades.png");     
              background-repeat: no-repeat;  background-size: 100% 100%  }
.lineasTelefonicas {  background-image: url("../assets/llama144108.png");   }



.tramitesTile {
    background-repeat: no-repeat;
    background-position: center center;         
    background-size: 54%;
    height: 10vh;
}

.gestorTile {
    background-repeat: no-repeat;
    background-position: 50% 23%;         
    background-size: 34%;
    line-height: 34.5vh;
    padding-top: 10px;
}


.diccionarioTile {
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: 34%;
    height: 50%;
    padding-top: 10px;
    margin-top: 10px;    
}


    .rojo { background-color: var(--colorrojo); }
    .amarillo { background-color: var(--coloramarillo); }    
    .verde { background-color: var(--colorverde); }
    .celeste { background-color: var(--colorceleste); }    
    .bordo { background-color: var(--colorbordo); }
    .turquesa { background-color: var(--colorturquesa); } 
    .azul { background-color: var(--colorazul); } 
    .azulE { background-color: var(--colorEncabezado); }
    .colorHXEP { background-color: var(--colorhxep); }
    .colorHXEPLight { background-color: var(--colorhxepLight); }

    .numerosLineas {
          width: 100%;
          z-index:1;
          position: absolute;
          bottom: 4px;
          text-align: center;
          font-weight: normal;
          font-size:5vw;  
          color: #f9f5f5;
          letter-spacing: 1px;                 
    }
       
.contenedor {
  width:100vw;
  height: 100vh;
  position: relative;
  /* overflow: hidden; con esto no escrolea */
}

.detalles {
    width:100%;
    z-index:2;
    background-color: #ffffff;
    position:absolute;
    sleft:100%;
    height:100%;
}

.listaReportes {
    width:100%;
    z-index:2;
    background-color: #ffffff;
    position:absolute;
    sleft:100%;
    height:100%;
}

.panelLineas {
    width: 100%;
    z-index:1;
    position:absolute;  
}


i.icono-blanco {
    color: white; text-align: center; 
}

.bienvenida {
        font-size: 2vw;
        margin-top: 10px;
        line-height: 8  vh;
        color: #1878a1;
        text-align: left;
        font-weight: 800;
        background-color: white;
        border: 3px;
        border-radius: 1vh;        
        border-style: solid;     
        border-color: #1878a1;        
}

.page-footer {
        background-color: #7fbff1;
        padding-top: 0px;
        position: fixed;
        bottom: 0;
        width: 100%;       
        height: 6.6vh; 
        line-height: 6.6vh;
}

.tituloDetalle {
        height: 10vh; 
        font-size: 6vw; 
        zletter-spacing: 1px;
        line-height: 10vh;
        display: inline;
        text-align: center !important;  
        color: var(--colorhxep);
        font-weight: bold;
        padding-top: 0px !important;
        margin-top: 0px;        
}

.cuerpoDetalle {
        text-align: left !important; 
        font-size: 6vw;         
}

.tituloFicha {
        background-image: url("../assets/busBlanco.png?a=4");
        background-repeat: no-repeat;
        background-position: 95% center;      
       /* height: 1vh; */  
        background-color: var(--colorazul);               
        text-transform:uppercase;
        font-size: 1.5em; /*4vw;*/ 
        letter-spacing: 3px;
        line-height: 10vh;
        text-align: left !important;  
        color: white;
        font-weight: bold;
}
.textoFicha {
        font-weight: normal;   
        font-size: 3vh;          
}

.fechaGrande {
        height: 12vh; !important;         
        text-transform:uppercase;
        font-size: 6vh; 
        letter-spacing: 3px;
        line-height: 12vh;
        text-align: center;
        color: #757575;
        font-weight: bold;
}

.campoOtros { 
    font-size: 1.4rem !important;
    margin: 1vh 0 1vh 0 !important;
}

.google-maps {
    position: relative;
    padding-bottom: 75%; // This is the aspect ratio
    height: 0;
    overflow: hidden;
}
.google-maps iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
}    

.facebook {
    background-image: url('../assets/fb.png');
    background-size: 50%;      

    background-repeat: no-repeat;
    line-height: 6.6vh;
  
    
}

.instagram {
    
}

input:not([type]), input[type=text]:not(.browser-default), input[type=password]:not(.browser-default), input[type=email]:not(.browser-default), input[type=url]:not(.browser-default), input[type=time]:not(.browser-default), input[type=date]:not(.browser-default), input[type=datetime]:not(.browser-default), input[type=datetime-local]:not(.browser-default), input[type=tel]:not(.browser-default), input[type=number]:not(.browser-default), input[type=search]:not(.browser-default), textarea.materialize-textarea {
    background-color: transparent;
    border: none;
    /* border-bottom: 1px solid #9e9e9e; */
    border-radius: 0;
    margin: 0 0 3vh 0;
    outline: none;
    height: 3rem;
    width: 100%;
    font-size: 1.7rem;
    color: #757575;
}

.w3_whatsapp_btn {
    background-image: url('../assets/iconWP.png');
    border: 1px solid rgba(0, 0, 0, 0.1);
    display: inline-block !important;
    position: relative;
    font-family: Arial,sans-serif;
    letter-spacing: .4px;
    cursor: pointer;
    font-weight: 400;
    text-transform: none;
    color: #fff;
    border-radius: 2px;
    background-color: #5cbe4a;
    background-repeat: no-repeat;
    line-height: 1.2;
    text-decoration: none;
    text-align: left;
}
.w3_whatsapp_btn_small {
    font-size: 12px;
    background-size: 16px;
    background-position: 5px 2px;
    padding: 3px 6px 3px 25px;
}

.w3_whatsapp_btn_medium {
    font-size: 16px;
    background-size: 20px;
    background-position: 4px 2px;
    padding: 4px 6px 4px 30px;
}

.w3_whatsapp_btn_large {
    font-size: 16px;
    background-size: 20px;
    background-position: 5px 5px;
    padding: 8px 6px 8px 30px;
    color: #fff;
}
a.whatsapp { color: #fff;}
 

.picker__date-display {
    text-align: center;
    padding: 0px
}

.datepicker {
 height: 10vw;
}

.fondoColor {
    //background-color: #9e9e9e;
}

.input-field label, label {
    color: black;
    font-size: 3.2vh; //1.2rem;
    text-align: center;    
}
label {
    font-weight: bold; 
}


[type="checkbox"]+label {
    font-size: 4.5vw; // 3vh;
    font-weight: normal;     
}

.checkbox-blanco[type="checkbox"].filled-in:checked + label:after{
     border: 2px solid #ff9800;
     background-color: #ff9800;
}
   

#panelOtros {
    display: none;
}


.btn, .btn-large, .btn-flat {
        border-radius: 10px;
}

#toast-container {
    bottom: 80%;       
}

.toast.rounded {
    background-color: var(--colorSolUC);             
}
.toast {
    text-align: center;
    line-height: 1.5em;
    font-size: 1.5em;
    font-weight: 400;
    background-color: var(--colorhxepLight);                
    color: white;
    text-align: center;    
}

.estiloModal {
    background-color: #d3d3d3; 
    text-align: center;
    line-height: 1.3em;
    font-size: 1.5em;
    font-weight: 370; 
}

    IMG.flotando {
    position:fixed;
    left:50%;
    top:50%; 
    z-index: 10000000;    
    margin-left: -64px;
    margin-top: -64px;
    width:auto;
    height:auto;
    max-width:100%;
    max-height:90%;
 }

.contenidoLista {
    position: absolute;
    top: 100px;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: auto;
}
      .loader {
            position: fixed;
            top :0;
            left: 0;
            right: 0;
            bottom: 0;
            margin: auto;
            }


#toast-container {
  z-index: 10000000;
}
.tooltip {
    position: relative;
    display: inline-block;
}

.tooltip .tooltiptext {
    visibility: hidden;
    width: 120px;
    background-color: teal;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;
    
    /* Position the tooltip */
    position: absolute;
    z-index: 1;
    /* bottom: 100%;
    left: 50%;
    margin-left: -60px; */
    top: -5px;
    left: 105%;     
}

.tooltip:hover .tooltiptext {
    visibility: visible;
}

    #selector {
        font-size: 200%;
        color: white;
        background-color: #1878a1;
    }

    progress {
      background-color: #bce4f5;
      xxborder: 1px;
      height: 18px;
      border-radius: 9px;
    }
    progress::-webkit-progress-bar {
        background: #bce4f5; 
    }
    progress::-webkit-progress-value {background: #1878a1; }    

blockquote {
    border-left: 5px solid var(--colorhxep);
}

/* Texto animado */
.marquee {
    margin: 0 auto;
    white-space: nowrap;
    overflow: hidden;
}

.marquee span {
    display: inline-block;
    padding-left: 100%;
    text-indent: 0;
    animation: marquee 15s linear infinite;
}pan
.marquee span:hover {
    animation-play-state: paused
}

/* Make it move */
@keyframes marquee {
    0%   { transform: translate(0, 0); }
    100% { transform: translate(-100%, 0); }
}

.fade-in-text {
  display: inline-block;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 150px;
  color: black;
  animation: fadeIn linear 3s;
  -webkit-animation: fadeIn linear 3s;
  -moz-animation: fadeIn linear 3s;
  -o-animation: fadeIn linear 3s;
  -ms-animation: fadeIn linear 3s;
}

@keyframes fadeIn {
  0% {opacity:0;}
  100% {opacity:1;}
}

@-moz-keyframes fadeIn {
  0% {opacity:0;}
  100% {opacity:1;}
}

@-webkit-keyframes fadeIn {
  0% {opacity:0;}
  100% {opacity:1;}
}

@-o-keyframes fadeIn {
  0% {opacity:0;}
  100% {opacity:1;}
}

@-ms-keyframes fadeIn {
  0% {opacity:0;}
  100% {opacity:1;}
}