:root{
    --color1: rgb(26,98,185);
    --color2: rgb(255,255,255);
    --color3: rgb(241,196,15);
}

::-webkit-scrollbar-track {
    background-color: transparent; }

::-webkit-scrollbar {
    height: 0px;
    width: 5px;
    background-color: transparent; }

::-webkit-scrollbar-thumb {
    box-shadow: inset 0px 0px 0px white;
    border-radius: 3px;
    background-color: rgba(0,0,0,0.1); }

@font-face{
    font-family:'freescpt';
    font-style: normal;
    font-weight: normal;
    src: url('../fonts/freescpt.TTF');
}

@font-face{
    font-family:'comic';
    font-style: normal;
    font-weight: normal;
    src: url('../fonts/comic.ttf');
}

*{
    margin: 0px;
    padding: 0px;
    box-sizing: border-box;
}

.textdisable{
    pointer-events: none;
}

body{
    overflow: hidden;
    width: 100%;
    height: auto;
    background-color: white;
}

#body2{
    overflow: hidden;
    width: 100%;
    height: auto;
    background-color: rgb(236, 240, 241);
}

#bodycalificacionimprimible{
   width: 100%;
   height: 100%;
   position: fixed;
   background-color: rgb(54,54,54);
}

#contenedorloader {
    visibility: visible;
    opacity: 1;
    margin-top: 0px;
    top: 0px;
    z-index: 900000;
    position: fixed;
    text-align: center;
    height: 100vh;
    width: 100%;
    background-color: var(--color1);
    transition: all 1s ease-in-out;  
}

#contenedorlogoloader{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: calc(100vh - 200px);
}


#imglogoloader{
    margin: auto;
    width: auto;
    height: 200px;
    box-sizing: border-box; 
    animation: animarinsignia 1.5s infinite;
}

@keyframes animarinsignia{
    0%{height: 200px;}
    50%{height: 250px;}    
    100%{height: 200px;}    
}

#contenedortextoloader{
    padding: 0px 10px;
    display: flex;
    justify-content: center;
    align-items:   center;
    width: 100%;
    height: 150px;
}

#textoloader{
    font-family: 'freescpt';
    font-size: 30px;
    margin: auto;
    color: rgba(255,255,255,1);
}

.header{
    background-color: var(--color1);
    top: 0px;
    position: fixed;
    z-index: 12;
    width: 100%;
    height: 50px;
}

.header2{    
    top: 0px;
    position: fixed;
    z-index: 12;
    width: 100%;
    height: 50px;
}

.contenedornombreie{
    float: right;
    height: 50px;
    width: 100%;
    background-color: var(--color1);    
    border-radius: 0px 0px 0px 15px;
}

.contenedornombreie2{
    float: right;
    height: 50px;
    width: 100%;
    background-color: var(--color1);     
    border-radius: 0px 0px 0px 15px;
}

.slogan1{
    float: left;
    font-family: 'freescpt';
    font-size: 30px;
    color: var(--color2);
    margin-left: 55px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: calc(100% - 105px);
    height: 50px;
}

.slogan2{
    float: left;
    font-family: 'freescpt';
    font-size: 30px;
    color: var(--color2);
    margin-left: 55px;
    display: none;
    justify-content: center;
    align-items: center;
    display: none;
    width: calc(100% - 105px);
    height: 50px;
}

.contenedorinsignia{
    margin-top: -50px;
    float: left;
    background-color: var(--color1);
    height: 70px;
    width: 55px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    
}

.contenedorinsignia2{
    margin-top: -50px;
    float: left;
    background-color: var(--color1); 
    height: 70px;
    width: 55px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    
}

.imginsignia{
    height: 60px;
    width: auto;
}

.headersandwich{
    float: left;
    margin: auto;
    width: 50px;
    height: 50px;
    display: flex;
    justify-content: center;
    align-content: center;
}

#sandwich{
    width: 40px;
    height: 40px;
    margin: auto;
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    transition: all 0.2s ease-in-out;
}

#sandwichsis{
    width: 40px;
    height: 40px;
    margin: auto;
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    transition: all 0.2s ease-in-out;
}

.btnlogincontenedor{    
    border-radius: 50%;
    font-size: 18px;
    color: white;
}

.btnsalirsistema{    
    border-radius: 50%;
    font-size: 16px;
    color: white;
}


#sandwich:hover{
    background-color: rgba(0,0,0,0.1);
    cursor: pointer;
}

#sandwichsis:hover{
    background-color: rgba(0,0,0,0.1);
    cursor: pointer;
}

.sandwichhijos{
    background-color: white;
    width: 25px;
    height: 2px;
    border-radius: 2px;
    margin: 3px auto;
    transition: all 0.2s ease-in-out;
}

#pantalla{
    text-align: center;    
    position: relative;
    width: 100%;
    height: 100vh;
    margin-top: 0px;
    overflow-y: scroll;
}

.contenedorslider{    
    overflow: hidden;
    position: relative;
    margin-top: 50px;
    width: 100%;
}

ul ol{
    list-style: none;
}

.imgslider{
    width: 100%;
}

.pagination{
    list-style: none;
    position: absolute;
    top: 90%;
    width: 100%;
    display: flex;
    justify-content: center;
}

.pagination li{
    font-size: 18px;
    color: rgb(189, 195, 199);
    margin: 2px 5px;
    cursor: pointer;
    transition: all ease-in-out 0.3s;
}

.arrowleft{
    top: 0;
    height: 100%;
    position: absolute;
    color: rgba(255,255,255,0.6);
    font-size: 40px;
    display: flex;
    align-items: center;
    left: 10px;    
}

.arrowleft i{
    cursor: pointer;
    transition: all ease-in-out 0.3s;
}

.arrowleft i:hover{
    color: var(--color3);
}

.arrowright{
    top: 0;
    height: 100%;
    position: absolute;
    color: rgba(255,255,255,0.6);
    font-size: 40px;
    display: flex;
    align-items: center;
    right: 10px;    
}

.arrowright i{
    cursor: pointer;
    transition: all ease-in-out 0.3s;
}

.arrowright i:hover{
    color: var(--color3);
}

.slidersesgo{
    position: absolute;    
    bottom: 4px;
    top: auto;
    border-style: solid;
    border-width: 0px 0px 150px 100vw;
    border-color: transparent transparent white transparent;
}

.contenedoropciones{
    padding: 30px 20px 20px 20px;
    margin: auto;
    width: 100%;
    height: auto;
    min-height: 300px;
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;  
    gap:20px;
}

.itemopciones{
    border-radius: 5px;
    box-shadow: 0 0 5px rgba(100,100,100,0.5);
    color: var(--color1);
    box-sizing:  content-box;
    margin: 10px auto;
    width: 150px;
    height: 150px;
    border-style: solid;
    border-width: 0px;
    border-color: var(--color1);
    transition: ease-in-out all 0.5s;
}

.itemopcionesicon{
    font-size: 60px;
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    width: 100%;
    height: 100px;
}

.itemopcionestexto{    
    font-family: 'comic';
    text-align: center;
    font-size: 15px;
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    width: 100%;
    height: 50px;
    padding-left: 5px;
    padding-right: 5px;
}

.itemopciones:hover{
    color: rgba(255,255,255,1);
    cursor: pointer;
    background-color: var(--color1);
}

.contenedorimgskwed{
    overflow: hidden;
    position: relative;
    width: 100%;
    height: 550px;
}

.itemimgskewed{    
    height: 100%;
    width: 33%;
    float: left;
    position: relative;
    
}

#itemimgskewedid2{
    width: 34%;
}

.imgskiwed{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.coverimgskiwed{
    top: 0;
    position: absolute;
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    width: 100%;
    height: 100%;
    font-family: sans-serif;
    font-weight: bold;
    font-size: 18px;
    color: rgba(255,255,255,1);
    background-color: rgba(26,98,185,0.6);
}

#coverimgskiwedid2{
    background-color: rgba(119, 140, 163,0.6);
}

#coverimgskiwedid3{
    background-color: rgba(255,223,23,0.6);
}

.contenedorimgskwedsesgotop{    
    position: absolute;
    top: 0;
    border-style: solid;
    border-width: 150px 100vw 0px 0px;
    border-color: white transparent transparent transparent;
}

.contenedorimgskwedsesgobottom{
    position: absolute;    
    bottom: 0px;
    top: auto;
    border-style: solid;
    border-width: 0px 0px 150px 100vw;
    border-color: transparent transparent white transparent;
}

.contenedorinfoprincipal{ 
    overflow: hidden;
    width: 100%;
    height: auto;
    position: relative;   
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap; 
}

.contenedorimginfoprincipal{
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    width: 30%;
    height: 400px;    
}

.imginfoprincipal{  
    box-sizing: border-box;
    padding: 5px;
    width:  100%;
    height: 100%;
    object-fit: contain;  
}

.contenedortextoinfoprincipal{
    color: rgba(119, 140, 163,1);
    font-family: sans-serif;
    font-size: 16px;
    text-align: justify;
    padding: 20px;
    display: flex;
    justify-content: flex-start;
    align-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    width: 70%;
    height: 400px;    
}

.contenedorinfoprincipalsesgo{    
    border-style: solid;
    border-width: 0px 0px 150px 100vw;
    border-color: transparent transparent var(--color1) transparent;
}

footer{
    overflow: hidden;
    padding: 15px 0px;
    box-sizing: content-box;
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-size: 15px;
    font-family: sans-serif;
    color: rgba(255,255,255,0.9);
    position: relative;
    width: 100%;
    height: auto;
    background-color: var(--color1);
}


.footerleft{    
    width: 50%;
    height: 25px;
}

.fontfooterleft{
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    height: 100%;
    float: left;
    margin: 0px 10px 0px 20px;
}

.pfooterleft{
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    height: 100%;
    float: left;
}

.footerrigth{   
    width: 50%;
    height: 25px;
}

.fontfooterrigthhidden{
    display: none;
}

.pfooterrigth{
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    height: 100%;
    float: right;
    margin: 0px 20px 0px 10px;
}

.fontfooterrigth{
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    height: 100%;
    float: right;
}

.footerleft{    
    width: 100%;
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}   

.fontfooterleft{
    float: none;
}

.pfooterleft{
    float: none;
}

.footerrigth{    
    width: 100%;
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.pfooterrigth{        
    float: none;
    margin: 0px;
}

.fontfooterrigth{ 
    float: none;
    display: none;
}

.fontfooterrigthhidden{
    display:  block;
    margin: auto 10px auto 0px;
}

.footerbottomfull{
    font-size: 13px;
    width: 100%;
    height: 25px;
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

#contadorvistas{
    margin-top: 10px;
    padding: 6px;
    border-radius: 5px;
    box-shadow: 0 0 5px rgba(0,0,0,0.7);
    background-color: var(--color3);
    font-style: italic;
    font-weight: bold;
}

#btnmenuredessociales{
    position: fixed;
    background-color: rgba(255,223,23,0.7);
}

#contenedorcajaredesosciales{
    opacity:0;
    transform: rotate(90deg);
    position: fixed;
    left: -110px;
    bottom: -110px;
    height: 220px;
    width: 220px;
    background-color: transparent;
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    transition: ease-in-out all 0.5s;
    box-shadow: 0 0 5px rgba(0,0,0,0.7);
    border-radius: 50%;
    background-color: rgba(255,223,23,0.7);
    overflow: hidden;
}

.contenedorcajaseccionredesosciales{ 
    position: relative;
    height: 50%;
    width: 50%;
    background-color: transparent;
}

.contenedoritemredessociales{
    height: 220px;
    width: 30px;
    position: absolute;
}

#contenedoritemredessociales1{
    transform: rotate(12deg);
}

#contenedoritemredessociales2{
    transform: rotate(34deg);
}

#contenedoritemredessociales3{
    transform: rotate(56deg);
}

#contenedoritemredessociales4{
    transform: rotate(78deg);
}

.itemredessociales{
    border-radius: 50%;
    margin-top: 3px;
    height: 30px;
    width: 30px;
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    color: rgba(255,255,255,0.8);
    font-size: 25px;
    transition: ease-in-out all 0.5s;
}

.itemredessociales:hover{
    cursor: pointer;
    color: rgba(255,255,255,1);
}

#contenedorbtnlogins{   
    z-index: 9;
    position: fixed;
    height: 230px;
    width: 40px;
    top: 0;
    right: 0;
    margin-right: 10px;
    margin-top: -240px;
    transition: ease-in-out all 0.5s;
}

.btnlogins{
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 5px auto auto auto;
    width: 40px;
    height: 40px;
    background-color: white;
    color: rgb(26,98,185); 
    transition: ease-in-out all 0.3s;
    border-radius: 50%;
    font-size: 20px;
    box-shadow: 0 0 5px rgba(0,0,0,0.7);           
}

.btnlogins:hover{
    cursor: pointer;
    transform: rotate(360deg);     
}

#btnlogins4{
    display: none;
}

#btnlogins5{
    color: rgb(74, 83 ,136);
}

#btnlogins6{
    color: rgb(74, 83 ,136);
}

#contenedorpantallaopcionesindex{
    pointer-events: none;
    opacity: 0;
    z-index: 10;
    position: fixed;
    height: 100%;
    width: 100%;
    background-color: rgba(45,54,76,0.8);
    top: 0;
    right: 0;
    transition: ease-in-out all 1s;
}

#contenedorpantallaopcionesest{
    pointer-events: auto;
    opacity: 1;
    z-index: 10;
    position: fixed;
    height: 100%;
    width: 100%;
    background-color: rgba(45,54,76,0.8);
    top: 0;
    right: 0;
    transition: ease-in-out all 1s;
}

#contenedorpantallaemergente{
    pointer-events: none;
    opacity: 0;
    z-index: 10;
    position: fixed;
    height: 100%;
    width: 100%;
    background-color: rgba(45,54,76,0.8);
    top: 0;
    right: 0;
    transition: ease-in-out all 1s;
}

#examcontenedorpantallaemergente{
    pointer-events: none;
    opacity: 0;
    z-index: 16;
    position: fixed;
    height: 100%;
    width: 100%;
    background-color: rgba(45,54,76,0.8);
    top: 0;
    right: 0;
    transition: ease-in-out all 1s;
}

#examcontenedorpantallaemergente2{
    pointer-events: none;
    opacity: 0;
    z-index: 17;
    position: fixed;
    height: 100%;
    width: 100%;
    background-color: rgba(255,255,255,0.9);
    top: 0;
    right: 0;
    transition: ease-in-out all 1s;
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

#contenedorpantallaemergente2{
    pointer-events: none;
    opacity: 0;
    z-index: 10;
    position: fixed;
    height: 100%;
    width: 100%;
    background-color: rgba(45,54,76,0.8);
    top: 0;
    right: 0;
    transition: ease-in-out all 1s;
}

#contenedoropcionesindex{
    text-align: center;
    z-index: 10;
    position: fixed;
    height: 100%;
    width: 100%;
    background-color: rgba(255,255,255,.3);  
    top: 0;
    right: 0;
    margin-top: 50px;
    border-width: 0px;
    border-style: solid;
    border-color: var(--color1);
    transition: ease-in-out all 1s;
    overflow-y: scroll;
    backdrop-filter: blur(2px);
    padding-bottom: 50px;
}

#contenedoropcionesest{
    padding: 10px;
    z-index: 10;
    position: fixed;
    height: calc(100% - 100px);
    width: calc(100% - 50px);
    background-color: rgb(236, 240, 241);
    top: 0;
    right: 0;
    margin-right: 25px;
    margin-top: 75px;
    border-width: 5px;
    border-style: solid;
    box-shadow: 0 0 10px rgba(255,255,255,0.3);
    border-radius: 15px;
    border-color: var(--color1);
    transition: ease-in-out all 1s;
    overflow-y: scroll;
}

#contenedorventanaemergente{
    z-index: 10;
    position: fixed;
    height: calc(100% - 100px);
    width: calc(100% - 50px);
    background-color: rgb(45,54,76);    
    top: 0;
    right: 0;
    margin-right: 25px;
    margin-top: 75px;
    border-width: 5px;
    border-style: solid;
    box-shadow: 0 0 10px rgba(255,255,255,0.3);
    border-radius: 15px;
    border-color: var(--color1);
    transition: ease-in-out all 1s;
    padding: 15px;
    justify-content: center;
    align-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

#contenedorventanaemergenteestudiante{
    z-index: 10;
    position: fixed;
    height: calc(100% - 95px);
    width: calc(100% - 30px);
    background-color: rgb(45,54,76);    
    top: 0;
    right: 0;
    margin-right: 15px;
    margin-top: 75px;
    border-width: 5px;
    border-style: solid;
    box-shadow: 0 0 10px rgba(255,255,255,0.3);
    border-radius: 15px;
    border-color: var(--color1);
    transition: ease-in-out all 1s;
    padding: 15px;
    justify-content: center;
    align-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

#contenedorventanaemergenteestudianteexamest{
    z-index: 10;
    position: fixed;
    height: calc(100% - 95px);
    width: calc(100% - 30px);
    background-color: rgb(45,54,76);    
    top: 0;
    right: 0;
    margin-right: 15px;
    margin-top: 75px;
    border-width: 5px;
    border-style: solid;
    box-shadow: 0 0 10px rgba(255,255,255,0.3);
    border-radius: 15px;
    border-color: var(--color1);
    transition: ease-in-out all 1s;
    padding: 15px;
    justify-content: center;
    align-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

#contenedorventanaemergenteestudiante2{
    z-index: 10;
    position: fixed;
    height: calc(100% - 95px);
    width: calc(100% - 30px);
    background-color: white;    
    top: 0;
    right: 0;
    margin-right: 15px;
    margin-top: 75px;
    border-width: 5px;
    border-style: solid;
    box-shadow: 0 0 10px rgba(255,255,255,0.3);
    border-radius: 15px;
    border-color: var(--color1);
    transition: ease-in-out all 1s;
    padding: 15px;
    justify-content: center;
    align-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    overflow-y: scroll;    
}

.DocenteExamenContenedorVisualizar{
    margin: auto;
    height: auto;
    width: 100%;
    max-width: 1280px;
}

.DocentePreguntaContenedorVisualizarCaja{
    padding-top: 5px;
    margin-top: 10px;    
    font-family: sans-serif;
    font-size: 15px;
    color: rgb(74, 83 ,136);
    width: 100%;
    height: auto;
    border-color: var(--color1);
    border-width: 1px 0px 0px 0px;
    border-style: solid;
}

.DocentePreguntaContenedorVisualizar{
    margin-top: 5px;
    padding: 5px;
    font-family: sans-serif;
    font-size: 15px;
    color: rgb(74, 83 ,136);
    width: 100%;
    height: auto;
    text-align: justify;
}

.DocentePreguntaContenedorVisualizar2{
    margin-top: 10px;
    margin-bottom: 10px;
    padding: 5px;
    font-family: sans-serif;
    font-size: 15px;
    color: rgb(74, 83 ,136);
    width: 100%;
    height: auto;
    text-align: center;
}

.DocentePreguntaContenedorVisualizar3{  
    position: relative;
    width: 100%;
    height: auto;
}

.DocentePreguntaContenedorVisualizar4{
    pointer-events: none;
    opacity: 0;
    top: 0;
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: white;
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    transition: ease-in-out all 0.3s;
}

.DocentePreguntaImagenContenedorVisualizar{
    margin: auto;
    text-align: center;
    width: 100%;    
    height: auto;
    max-height: 350px;
    overflow-y: scroll;
    overflow-x: scroll;
}

.imgminexamsempreguntaimgfull2{
    margin: auto;
    width: auto;
    max-width: 900px;
    height: auto;
}

.contendornosostros{
    box-shadow: 0 0 10px rgba(0,0,0,0.7);
    position: relative;
    margin: 30px auto;
    max-width: 900px;
    width: calc(100% - 40px);
    height: 400px;
    border-radius: 10px;
}

#contendornosostros1{
    background: linear-gradient(45deg, rgba(167,122,194,1) 0%, rgba(76,85,130,1) 52%, rgba(109,119,173,1) 60%, rgba(75,83,136,1) 85%, rgba(75,83,136,1) 100%);
}

#contendornosostros2{
    background: linear-gradient(45deg, rgba(0,175,239,1) 0%, rgba(43,181,227,1) 11%, rgba(211,177,232,1) 67%, rgba(159,226,245,1) 80%, rgba(194,112,245,1) 100%);
}

#contendornosostros3{
    background: linear-gradient(45deg, rgba(167,122,194,1) 0%, rgba(134,45,189,1) 56%, rgba(161,96,201,1) 66%, rgba(130,18,198,1) 100%);
    height: 550px;
}

.contendornosostrosimg{
    float: left;
    height: 100%;
    width: 250px;
    display: flex;
    justify-content: center;
    align-items: center;
}

#contendornosostrosimg3{
    float:  none;
    width: 100%;
}

.imgnosotros{
    height: 90%;
    width: auto;
    margin: auto;
}

.contendornosostrostexto{    
    float: left;
    height: 100%;
    width: calc(100% - 250px);
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.contendornosostrostitle{
    width: 100%;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-family: 'comic';
    font-weight: bold;
    font-size: 30px;
    color: rgb(241, 196, 15);
}

#contendornosostrostitle2{
    color: rgba(255,223,23,1);
}

#contendornosostrostitle3{
    color: rgb(52, 152, 219);
    position: absolute;
    bottom: 10px;
    top: auto;
}

.contendornosostrosparrafo{
    width: 100%;
    padding: 20px;
    font-family: 'comic';
    font-size: 25px;
    color: rgba(255,255,255,0.9);
    text-align: justify;
}

.contenedormatriculaoptions{
    position: relative;
    width:100%;
    height: 100%;
    text-align: center;
}

.imgmatricula{
    box-sizing:  content-box;
    margin: 20px 20px;
    width: auto;
    height: calc(100% - 40px);
    padding-bottom: 20px;
}

#btncerraropcionesindex{
    display: flex;
    justify-content: center;
    align-items: center;
    color: white;
    z-index: 11;
    position: fixed;
    height: 30px;
    width: 40px;
    background-color: var(--color1);
    top: 0;
    right: 0;
    margin-right: 5px;
    margin-top: 55px;
    border-color: var(--color1);
    transition: ease-in-out all 0.5s;
    font-size: 16px;
}

#btncerraropcionesindex:hover{
    color: var(--color3);
    cursor: pointer;
}

#btncerrarventanaemergente{
    display: flex;
    justify-content: center;
    align-items: center;
    color: white;
    z-index: 11;
    position: fixed;
    height: 30px;
    width: 30px;
    background-color: var(--color1);
    top: 0;
    right: 0;
    margin-right: 15px;
    margin-top: 65px;
    box-shadow: 0 0 15px rgba(255,255,255,0.3);
    border-radius: 50%;
    border-color: rgb(179,164,238);
    transition: ease-in-out all 1s;
    font-size: 16px;
}

#btncerrarventanaemergente:hover{
    color: var(--color3);
    cursor: pointer;
}

#btncerrarventanaemergenteestudiante{
    display: flex;
    justify-content: center;
    align-items: center;
    color: white;
    z-index: 11;
    position: fixed;
    height: 30px;
    width: 30px;
    background-color: var(--color1);
    top: 0;
    right: 0;
    margin-right: 5px;
    margin-top: 65px;
    box-shadow: 0 0 15px rgba(255,255,255,0.3);
    border-radius: 50%;
    border-color: rgb(179,164,238);
    transition: ease-in-out all 1s;
    font-size: 16px;
}

#btncerrarventanaemergenteestudiante:hover{
    color: var(--color3);
    cursor: pointer;
}

#btncerrarventanaemergenteestudiante02{
    display: flex;
    justify-content: center;
    align-items: center;
    color: white;
    z-index: 11;
    position: fixed;
    height: 30px;
    width: 30px;
    background-color: var(--color1);
    top: 0;
    right: 0;
    margin-right: 5px;
    margin-top: 65px;
    box-shadow: 0 0 15px rgba(255,255,255,0.3);
    border-radius: 50%;
    border-color: rgb(179,164,238);
    transition: ease-in-out all 1s;
    font-size: 16px;
}

#btncerrarventanaemergenteestudiante02:hover{
    color: var(--color3);
    cursor: pointer;
}

#btncerrarventanaemergenteestudiante2{
    display: flex;
    justify-content: center;
    align-items: center;
    color: rgba(255,255,255,0.8);
    z-index: 11;
    position: fixed;
    height: 30px;
    width: 30px;    
    top: 0;
    right: 0;
    margin-right: 30px;
    margin-top: 90px;    
    border-radius: 50%;
    border-color: rgb(179,164,238);
    transition: ease-in-out all 0.5s;
    font-size: 20px;
}

#btncerrarventanaemergenteestudiante2:hover{
    color: var(--color3);
    cursor: pointer;
    transform: rotate(360deg);  
    box-shadow: 0 0 10px rgba(255,255,255,0.3);
}

#contenedorlogin{
    z-index: 9;
    position: fixed;
    height: 270px;
    width: 250px;
    background-color: rgba(26,98,185,0.9);
    top: 0;
    right: 0;
    margin-right: 65px;
    margin-top: -230px;
    transition: ease-in-out all 0.5s;
    box-shadow: 0 0 10px rgba(0,0,0,0.7);
}

#encabezadofrmlogin{
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    margin-top: 10px;
    margin-left: 5px;
    margin-bottom: 5px;
    width: 240px;
    height: 30px;
    border-style: solid;
    border-width: 0px 0px 1px 0px;
    border-color: rgba(255,255,255,0.7);
}

#contenedorlogofrm{
    color: rgba(255,255,255,0.7);
    font-size: 20px;
    margin: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 30px;
    height: 30px;
}

#contenedortextologofrm{
    display: flex;
    justify-content: center;
    align-items: center;
    margin: auto;
    height: 30px;
    width: 210px;
}

#textologofrm{
    margin: auto;
    color: rgba(255,255,255,0.7);
    font-size: 25px;
    font-family: 'freescpt';
}

.selectlogin{
    box-sizing: border-box;
    color: white;
    margin: 10px auto 0px 25px;
    font-family: sans-serif;
    font-size: 15px;
    padding-left: 5px;
    outline: none;
    border-width: 0px;
    border-style: solid;
    border-color: rgba(255,255,255,0.3);
    background-color: transparent;
    height: 25px;
    width: 200px;  
    background-color: rgba(0,0,0,0.2);
}

.inputlogin{
    box-sizing: border-box;
    color: white;
    margin: 10px auto 0px 25px;
    font-family: sans-serif;
    font-size: 15px;
    padding-left: 5px;
    outline: none;
    border-width: 0px 0px 1px 0px;
    border-style: solid;
    border-color: rgba(255,255,255,0.3);
    background-color: transparent;
    height: 25px;
    width: 200px;    
}

.inputlogin::placeholder{
    color: rgba(255,255,255,0.5);
    font-style: italic;
}

#passlogin{
    margin-left: 0px;
    margin-top: 0px;
    box-sizing: border-box;
    float: left;
    width: 170px;
    border-width: 0px;
}

.contenedorojologin{
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    float: left;
    width: 30px;
    height: 25px;
    box-sizing: border-box;
    font-size: 20px;
    cursor: pointer;
    transition: ease-in-out all 0.3s;
    color: rgba(255,255,255,0.5);
}

.contenedorojologin:hover{
   cursor: pointer;
}

.contenedorpassword{
    margin: 20px auto 0px auto;
    color: white;
    font-family: sans-serif;
    font-size: 15px;
    outline: none;
    border-width: 0px 0px 1px 0px;
    border-style: solid;
    border-color: rgba(255,255,255,0.3);
    background-color: transparent;
    height: 25px;
    width: 200px;
}

.btnlogin{
    margin-left: 25px;
    margin-top: 30px;
    color: rgba(255,255,255,0.5);
    height: 30px;
    width: 200px;   
    outline: none;
    border-width: 1px;
    border-style: solid;
    background-color: rgba(0,0,0,0.2);
    border-color: rgba(255,255,255,0.3);
    transition: all 0.3s ease-in-out;
}

.btnlogin:hover{
    color: rgba(255,255,255,1);
    background-color: rgb(255,223,23);
    cursor: pointer;
}

#contenedormenu{
    z-index: 9;
    position: absolute;
    height: calc(100vh - 50px);
    width: 250px;
    background-color: rgba(26,98,185,0.9);
    top: 0;
    right: 0;
    margin-top: 50px;
    margin-right:  -250px;
    transition: ease-in-out all 0.5s;
    overflow-y: scroll;
}

#contenedorlogouser{
    border-color: rgba(255,255,255,0.7);
    border-style: solid;
    border-width: 2px;
    margin: 10px 0px 0px 95px;
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    width: 60px;
    height: 60px;
    border-radius: 50%; 
    color: rgba(255,255,255,0.7);
    font-size: 35px;
}

#contenedornombreuser{    
    margin: 0px 0px;
    display: flex;
    justify-content: center;
    align-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    width: 100%;
    height: 40px;
    color: rgba(255,255,255,0.7);
    font-family: sans-serif;
    font-style: italic;
    font-size: 13px;
    padding-top: 5px;
    padding-left: 10px;
    text-align: center;
}

.contenedoritemmenu{
    color: rgba(255,255,255,0.7);
    width: 240px;
    height: 40px;
    border-style: solid;
    border-width: 0px 0px 1px 0px;
    border-color: rgba(255,255,255,0.2);
    margin-left: 5px;
    cursor: pointer;
    transition: ease-in-out all 0.3s;
}

.contenedoritemmenu:hover{
    color: rgb(255,223,23);
}

.contenedoriconoitemmenu{
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    width: 40px;
    height: 40px;
    float: left;
    font-size: 20px;
}

.contenedortextoitemmenu{
    padding-left: 10px;
    padding-top: 12px;
    font-family: sans-serif;
    width: 40px;
    height: 40px;
    float: left;
    font-size: 15px;
}

#pantallasistema{
    position: fixed;
    width: 100%;
    height: calc(100vh - 50px);
    margin-top: 50px;
}

#pantalla{
    text-align: center;    
    position: relative;
    width: 100%;
    height: 100vh;
    margin-top: 0px;
    overflow-y: scroll;
}

.sis_admin_masmenu{
    box-shadow: 0 0 7px rgba(0,0,0,0.6);
    background-color: rgba(26,98,185,0.9);
    margin-left: -80px;
    position: fixed;
    z-index: 14;
    margin-top: 80px;
    float: left;
    height: calc(100% - 160px);
    width: 70px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    overflow-y: scroll;
    transition: ease-in-out all 0.3s;
    border-radius: 0px 10px 10px 0px;
}

#sis_admin_usuariosmenuid{
    margin-top: 75px;    
    height: 250px;
}

.item_sis_admin_masmenu{     
    margin-top: 3px;
    margin-bottom: 3px;
    width: 45px;
    height: 45px;
    color: white;
    border-radius:50%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-family: sans-serif;
    font-size: 20px;
    transition: ease-in-out all 0.1s;
}

.item_sis_admin_masmenu:hover{
    color: var(--color3);
    cursor: pointer;  
    font-size: 28px;
}

.texto_item_sis_admin_masmenu{
    transition: ease-in-out all 0.1s;
    font-size: 10px;
}

.item_sis_admin_masmenu:hover>.texto_item_sis_admin_masmenu{
    opacity: 0;
}

#pantallaestudiante{    
    position: fixed;
    width: 200%;
    height: calc(100% - 50px);
    margin-top: 50px;
    transition: ease-in-out all 1s;
}

#pantallaestudianteleft{
    position: relative;
    transition: ease-in-out all 1s;
    padding: 15px;
    overflow-y: scroll;
    display: grid;
    grid-template-columns: repeat(4,1fr);
    grid-auto-rows: 150px;
    grid-gap: 15px;
    float: left;
    width: 50%;
    height: calc(100% - 25px);
    margin-top: 10px;
    margin-left: 0;
}

.boxitempantallaestudianteleft{
    user-select: none;
    display: grid;
    gap:5px;
    grid-templates-rows: repeat(5,1fr);
    border-radius: 5px;
    padding: 10px;
    background-color: blueviolet;
    text-align: center;
    color: white;
    cursor: pointer;
    transition: ease-in-out all 0.4s;
}

.boxitempantallaestudianteleft:hover{
    box-shadow: 0 0 10px rgba(0,0,0,0.6);    
}

#boxitempantallaestudianteleft1:hover>#itempantallaestudianteleft1id1>.contenedorimagenestudiante{
    font-size: 43px;
    color: white;
    border-color: rgba(255,255,255,1);
    box-shadow: 0 0 5px rgba(255,255,255,0.7);
   
}

#boxitempantallaestudianteleft1{
    grid-row: 1/3;    
    grid-template-rows: repeat(2,1fr);
    gap:10px;    
    background-color: rgb(74, 83 ,136);    
}

#boxitempantallaestudianteleft2{ 
    background-color: rgb(52, 152, 219);
}

#boxitempantallaestudianteleft2:hover>.textoboxitempantallaestudianteleft{
   background-color: rgba(0,0,0,0.1);   
}

#boxitempantallaestudianteleft3{ 
    background-color: rgb(240, 98, 146);
}

#boxitempantallaestudianteleft3:hover>.textoboxitempantallaestudianteleft{
    background-color: rgba(0,0,0,0.1);    
}

#boxitempantallaestudianteleft4{ 
    background-color: rgb(194,176,218);
}

#boxitempantallaestudianteleft4:hover>.textoboxitempantallaestudianteleft{
    background-color: rgba(0,0,0,0.1);
}

#boxitempantallaestudianteleft5{ 
    background-color: rgb(22, 160, 133);
}

#boxitempantallaestudianteleft5:hover>.textoboxitempantallaestudianteleft{
    background-color: rgba(0,0,0,0.1);
}

#boxitempantallaestudianteleft6{ 
    background-color: rgb(241, 196, 15);
}

#boxitempantallaestudianteleft6:hover>.textoboxitempantallaestudianteleft{
    background-color: rgba(0,0,0,0.1);
}

#boxitempantallaestudianteleft7{ 
    background-color: var(--color1);
}

#boxitempantallaestudianteleft7:hover>.textoboxitempantallaestudianteleft{
    background-color: rgba(0,0,0,0.1);
}

#boxitempantallaestudianteleft8{ 
    background-color: rgb(125,84,181);
}

#boxitempantallaestudianteleft8:hover>.textoboxitempantallaestudianteleft{
    background-color: rgba(0,0,0,0.1);
}

#itempantallaestudianteleft1id1{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.contenedorimagenperfilminiatura{    
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-size: 40px;
    color: rgba(74, 83 ,136,0.5);
    background-color: white;
    margin: auto;
    margin-top: 10px;
    height: 100px;
    width: 100px;
    border-radius: 100%;
    border-width: 5px;
    border-style: solid;
    border-color: white;
    overflow: hidden;   
    transition: ease-in-out all 0.1s;
    box-shadow: 0 0 5px rgba(50,50,50,0.7);
}

.contenedorimagenestudiante{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-size: 40px;
    color: rgba(255,255,255,0.7);
    background-color: rgba(74, 83 ,136,1);
    margin: auto;
    height: 120px;
    width: 120px;
    border-radius: 50%;
    border-width: 7px;
    border-style: solid;
    border-color: rgba(255,255,255,0.7);
    overflow: hidden;   
    transition: ease-in-out all 0.1s;
    box-shadow: 0 0 5px rgba(50,50,50,0.7);
}

.imgestudiante{
    width: 100%;
    height: auto;
}

#itempantallaestudianteleft1id2{
    overflow: hidden;
    text-align: left; 
    font-family: 'comic';
    font-size: 12px;
    display: grid;
    grid-auto-rows: 1fr;
}

.textorowitempantallaestudianteleft1id2_1{
    height: 100%;
    display: flex;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

#rowitempantallaestudianteleft1id2_1{
    grid-row: 1/3;
}

.itemboxitempantallaestudianteleft{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-family: sans-serif;
    font-size: 14px;
}

.iconoboxitempantallaestudianteleft{
    transition: ease-in-out all 0.5s;
    font-size: 50px;
    grid-row: 1/5;
}

.textoboxitempantallaestudianteleft{
    border-radius: 3px;
    transition: ease-in-out all 0.4s;
    font-family: 'comic';
}

#pantallaestudianteright{
    padding: 15px 6px;
    background-color: transparent;
    position: relative;
    transition: ease-in-out all 1s;
    float: left;
    width: 50%;
    height: calc(100% - 25px);
    margin-top: 10px;
    overflow-y: scroll;
}

#contenedorsistemaestudianteasistencia{
    height: 100%;
    width: 100%;
    display: grid;
    grid-template-columns: repeat(30,1fr);
    grid-template-rows: 1fr;
    grid-gap: 15px;
}

#contenedorsistemaestudiantepagos{    
    height: 100%;
    width: 100%;    
}

#contenedorseccionprematricula{  
    padding: 0px 10px 10px 10px;
    height: 100%;
    width: 100%;    
}

#contenedormostrarestudiantepagos{
    width: 100%;
    height: calc(100% - 40px); 
    display: flex;
    align-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    overflow-y: scroll;
}

#contenedormostrarestudiantematricula{
    padding: 10px;
    width: 100%;
    height: calc(100% - 40px); 
    display: flex;
    align-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    overflow-y: scroll;
}

#contenedormostrarseccionprematricula{
    border-style: solid;
    border-width: 0px 2px 2px 2px;
    box-sizing: border-box;
    border-color: rgb(125,84,181); 
    padding: 10px;
    width: 100%;
    height: calc(100% - 40px); 
    display: flex;
    align-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.seccionprematriculacontenido{
    height: 100%;
    width: 50%;
}

#seccionprematriculacontenidoregistros{    
    padding-right: 5px;
}

#seccionprematriculacontenidodetalles{  
    position: relative;
    padding-left: 5px; 
}

.seccionprematriculacontenidodetallesinfo{
    padding: 10px;
    overflow-y: scroll;
    position: relative;
    height: 100%;
    width: 100%; 
    background-color: rgba(125,84,181,0.04);
    display: flex;
    justify-content: center;
    align-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 15px;
}

.registrovacioprematriculaicono{
    width: 100%;
    height: auto;
    text-align: center;
    font-size: 100px;
    color: rgba(125,84,181,0.5);
}

.registrovacioprematriculatexto{
    width: 100%;
    height: auto;
    text-align: center;
    font-size: 15px;
    font-weight: bold;
    font-family: 'comic';
    font-style: italic;
    color: rgba(125,84,181,0.5);
}

.seccionprematriculacontenidoregistrostop{
    width: 100%;
    height: 30px;
    box-sizing: border-box;
    padding: 5px 5px 0px 5px;
    background-color: rgb(125,84,181);
    font-family: 'comic';
    font-size: 14px;
    display: flex;
    align-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 5px;
}

.prematriculamenuitem{
    height: 100%;
    width: auto;
    display: flex;
    align-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    padding: 0px 7px;
    color: white;
    background-color: rgb(125,84,181);
    border-radius: 5px 5px 0px 0px;
    transition: ease-in-out all 0.3s;
    border-width: 0px;
    border-style:  groove;
    border-color: rgba(125,84,181,0.8);
}

.prematriculamenuitem:hover{
    cursor: pointer;     
}

#prematriculamenuitempendientes{
    background-color: rgba(255,255,255,0.96);
    color: rgb(125,84,181);
    border-width: 2px 2px 0px 2px;
}

.seccionprematriculacontenidoregistrosbottom{
    width: 100%;
    height: calc(100% - 30px);
    background-color: rgba(125,84,181,0.04);
    position: relative;
}

.prematriculacontenedorbuscador{
    padding-left: 5px;
    padding-right: 5px;
    width: 100%;
    height: 40px;
    display: flex;
    align-content: center;
    align-items: flex-end;
    flex-direction: row;
    flex-wrap: wrap;
}

.prematriculabuscador{
    background-color: white;
    margin: auto;
    width: 100%;
    max-width: 400px;
    height: 25px;
    border-radius: 5px;
    border-width: 1px;
    border-style:  solid;
    border-color: rgb(125,84,181);
    display: flex;
    align-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.prematriculabuscadoricono{
    height: 100%;
    width: 25px;
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    color: rgb(125,84,181);
    font-size: 14px;
}

.prematriculabuscadorinput{
    height: 100%;
    width: calc(100% - 25px);
    display: flex;
    align-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.prematriculainputbuscar{
    height: 20px;
    width: 100%;
    outline: none;
    border-width: 0px;
    color: rgb(125,84,181);
    display: flex;
    align-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    background-color: transparent;
    font-style: italic;
}

.prematriculainputbuscar::placeholder{
    color: rgba(125,84,181,0.5);
}

.prematriculacontenedorregistros{
    height: calc(100% - 40px);
    width: 100%;
    position: relative;    
}

.prematriculacontenedorregistrosresultados{
    height: 100%;
    width: 100%;
    overflow-y: scroll;
    display: flex;
    align-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 10px;
    padding: 10px;
}

.prematriculacontenedorregistroscover{
    transition: ease-in-out all 0.5s;
    pointer-events: none;
    visibility: hidden;
    opacity: 0;
    top: 0;
    left: 0;
    text-align: center;
    position: absolute;
    height: 100%;
    width: 100%;
    display: flex;
    align-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    background-color: rgb(250,248,252);
}

#pogoonlineobservacioncoverid{    
    background-color: white;
}

#pagoonlineresultadosbusquedacodigocover{
    background-color: white;
}

.datospagosonlineseleccionado{
    position: relative;
    padding: 5px;
    overflow: hidden;
    margin: auto;
    max-width: 280px;
    width: 100%;
    height: auto;
    border-radius: 5px;
    background-color: white;
    box-shadow: 0 0 5px rgba(0,0,0,0.3);
    transition: ease-in-out all 0.2s;
    cursor: pointer;
}

#datospagosonlineseleccionadocontenedorobsv{
    max-width: 400px;
}

.pagosenlineavoucher{
    border: 5px solid white;   
    transition: ease-in-out all 0.3s;
    width: 100%;
    height: auto;
    max-width: 400px;
    box-shadow: 0 0 5px rgba(0,0,0,0.3);
    transition: ease-in-out all 0.3s;
}

.pagosenlineavoucher:hover{
    cursor: pointer;
}

.prematricularesultados{
    padding: 5px;
    overflow: hidden;
    margin: auto;
    width: 220px;
    height: 130px;
    border-radius: 5px;
    background-color: white;
    box-shadow: 0 0 5px rgba(0,0,0,0.3);
    transition: ease-in-out all 0.2s;
    cursor: pointer;
}
.prematricularesultadosplus{
    height: 170px;
}

.prematricularesultados:hover{
    box-shadow: 0 0 7px rgba(0,0,0,0.5);
}

.prematricularesultadosparte{
    width: 100%;
    height: 40px;
    border-width: 0.5px 0px 0px 0px;
    border-style: solid;
    border-color: rgba(125,84,181,0.3);
}

#pagoonlinebtnprocesar{
    transition: ease-in-out all 0.3s;
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-family: sans-serif;
    font-size: 18px;
    color: white;
    opacity: 0.7;
    border-width: 0px;
    background-color: rgb(125,84,181);
    margin-top: 5px;
    height: 35px;
    border-radius: 3px;
}

#pagoonlinebtnprocesar:hover{
    cursor: pointer;
    opacity: 1;
}

.spantamanio14{
    font-size: 14px;
}

#prematricularesultadospartetop{
    border-width: 0px;
}

#prematricularesultadospartetopobservaciones{
    border-width: 0px;
    height: 20px;
}

#pagoonlineseleccionarbanco{
    border-width: 0px;
    height: 30px;
}

#pagoonlineresultadosbusquedacodigo{ 
    position: relative;
    margin-top: 5px;
    margin-bottom: 5PX;
    border-width: 1px;
    border-color: rgba(125,84,181,0.7);
    border-style: solid;
    border-radius: 3px;
    height: 230px;
}

.resultadospagoonlinebuscarcodigooperacion{
    height: 100%;
    width: 100%;
    padding: 10px 5px;
    overflow: scroll;
    display: flex;
    justify-content: center;
    align-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 10px;
}



#prematricularesultadospartedescobservaciones{
    border-width: 0px;
    height: 100px;
    padding: 5px 0px;
}

.prematricularesultadospartedescobservacionesleft{
    float: left;
    width: calc(100% - 30px);
    height: 100%;       
}

.textareapagoonlineobservacion{
    border-width: 1px;
    border-color: rgba(125,84,181,0.7);
    border-style: solid;
    border-radius: 3px;
    color: rgb(125,84,181);
    font-size: 13px;
    text-align: justify;    
    outline: none;
    resize: none;
    width: 100%;
    height: calc(100% - 15px);
    padding: 5px;
    overflow-y: scroll; 
    font-style: italic;
    font-family: sans-serif;
}

.textareapagoonlineobservacion::placeholder{
    color: rgba(125,84,181,0.5);    
}

.textareapagoonlineobservacioncontador{
    margin-top: -5px;
    text-align: right;
    color: rgba(125,84,181,0.7);
    font-size: 10px;
    width: 100%;
    height: 15px;
    padding: 3px 5px;
    font-style: italic;
    font-family: sans-serif;
}

.prematricularesultadospartedescobservacionesright{
    float: left;
    width: 30px;
    height: 100%;  
    border-width: 0px 0px 0px 0px;
    border-style: solid;
    border-color: rgb(74,83,136);
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;    
    gap: 10px;
    background-color: white;
}

.pagoonlineobservacionbtn{    
    font-size: 25px;
    color: rgba(125,84,181,0.7);
    transition: ease-out all 0.3s;
}

.pagoonlineobservacionbtn:hover{
    cursor: pointer;
    color: rgba(125,84,181,1);
}

#imgloadingprematricula{
    width: 50px;
    height: auto;
    margin: auto;
}

.prematricularesultadospartetopleft{
    float: left;
    height: 100%;
    width: 30px;
    display: flex;
    align-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.prematricularesultadospartetopleftinterior{
    display: flex;
    justify-content: center;    
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    margin: auto;    
    height: calc(100% - 5px);
    width: 100%;
    background-color: rgb(125,84,181);
    color: white;
    font-family: 'comic';
    font-size: 15px;
}

.prematricularesultadospartetopright{
    float: left;
    margin-top: 2.5px;
    height: calc(100% - 5px);
    width: calc(100% - 30px);
}

.prematricularesultadospartetoprightinterior{
    padding-left: 10px;
    height: 50%;
    width: 100%;
    display: flex;
    justify-content: flex-start;    
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-family: sans-serif;
    font-size: 13px;
    font-style: italic;
    color: rgb(125,84,181);
}

.prematricularesultadospartetoprightinterior2{    
    height: 50%;
    width: 100%;
    display: flex;
    justify-content: flex-start;    
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-family: sans-serif;
    font-size: 13px;
    font-style: italic;
    color: rgb(125,84,181);
}

.prematricularesultadosparteleft{   
    font-family: sans-serif;
    font-weight: bold;
    float: left;
    height: 100%;
    width: 25px;
    display: flex;
    justify-content: center;    
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-size: 14px;
    color: rgb(125,84,181);
}

.prematricularesultadosparteleftplus{
    padding-left: 5px;
    font-family: sans-serif;
    float: left;
    height: 100%;
    width: 60px;
    display: flex;
    justify-content: flex-start;    
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-size: 14px;
    color: rgb(125,84,181);
}

#pagoonlineingresarmonto{
    height: 35px;
    border-width: 0px;
}

#pagoonlinetipopago{
    height: 30px;
    border-width: 0px;
}

.prematricularesultadosparteright{
    padding-left: 5px;
    float: left;    
    height: 100%;
    width: calc(100% - 25px);
    display: flex;
    justify-content: flex-start;    
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-family: sans-serif;
    font-size: 13px;
    font-style: italic;
    color: rgb(125,84,181);
}

.prematricularesultadosparterightplus{
    padding-left: 5px;
    float: left;    
    height: 100%;
    width: calc(100% - 60px);
    display: flex;
    justify-content: flex-end;    
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-family: sans-serif;
    font-size: 13px;
    font-style: italic;
    color: rgb(125,84,181);
}

#contenedormostrarestudiantecalificaciones{
    margin-top: 5px;
    width: 100%;
    height: calc(100% - 45px); 
    display: flex;    
}

.contenedorestudiantespagosadvertencia{
    padding: 10px;
    margin-top: 10px;
    width: 100%;
    min-height: 40px;
    height: auto; 
    border-color: rgba(22, 160, 133,1); 
    border-width: 1px;
    border-style: solid;
    border-radius: 5px;
    color: rgba(22, 160, 133,1);
    display: flex;
    align-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    text-align: justify;
    font-size: 13px;
    font-family: sans-serif;
}

.contenedorestudiantesinicioadvertencia{
    padding: 10px;
    margin-top: 10px;
    width: 100%;
    min-height: 40px;
    height: auto; 
    border-color: rgb(74,83,136); 
    border-width: 1px;
    border-style: solid;
    border-radius: 5px;
    color: rgb(74,83,136); 
    display: flex;
    align-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    text-align: justify;
    font-size: 13px;
    font-family: sans-serif;
}

.contenedorestudiantesinicioadvertencia2{
    padding: 10px;
    margin-top: 10px;
    width: 100%;
    min-height: 30px;
    height: auto; 
    border-color: rgb(74,83,136); 
    border-width: 1px;
    border-style: solid;
    border-radius: 5px;
    background-color: rgb(74,83,136); 
    color: white;
    display: flex;
    align-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    text-align: center;
    font-size: 13px;
    font-family: sans-serif;
}

.contenedorestudiantespagoscuentasbancarias{    
    padding: 7px;
    width: 100%;
    height: auto;
    background-color: red;
    display: flex;
    align-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    text-align: center;
}

.contenedorbanco{    
    background-color: white;;   
    width: 180px;
    height: 70px;
    font-family: sans-serif;
    border-radius: 5px;
    box-shadow: 0 0 4px rgba(0,0,0,0.6);
    margin: 7px;
    overflow: hidden;
}

#boxseccionprematriculatitulo{ 
    width: 100%;
    height: 40px;
    background-color: rgba(125,84,181,1); 
    display: flex;
    align-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    padding-left: 10px;
    font-size: 18px;
    font-family: sans-serif;
    color: white;
}

.spantitulopremat{
    font-size: 14px;
}

#boxsistemaestudiantematriculatitulo{ 
    width: 100%;
    height: 40px;
    background-color: rgba(125,84,181,1);    
}

#boxsistemaestudiantepagostitulo{ 
    width: 100%;
    height: 40px;
    background-color: rgba(22, 160, 133,1);    
}

#boxsistemaestudiantecalificacionestitulo{ 
    width: 100%;
    height: 40px;
    background-color: rgb(194,176,218);   
}

.itemsistemaestudiantepagostitulo{        
    float: left;    
    padding: 5px;
    height: 100%;
    width: 140px;
    color: white;
    font-family: sans-serif;
    font-size: 25px;
    display: flex;
    align-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;    
}

#aniosistemaestudiantepagostitulo{
    display: block;
    float: left;
    height: 100%;
    width: calc(100% - 140px);
}    

.spantitulo{
    padding-left: 5px;
    font-size: 15px;
}

.boxitemestudianteasistencia{
    color: white;
    font-family: sans-serif;
    font-size: 14px;
    background-color: rgb(52, 152, 219);    
}

.boxsistemaestudiantepagos{
    font-size: 14px;
    font-family: sans-serif;
    background-color: transparent;
}

.fondocolorpagado{
    background-color: rgba(22, 160, 133,0.6);
}

.fondocolorpendiente{
    background-color: rgba(241, 196, 15,0.6);
}

.fondocoloralerta{
    background-color: rgba(240, 98, 146,0.6);
}

#boxsistemaestudiantepagosmatmod{
    grid-row: 1/3;
    color: rgb(74, 83 ,136); 
    background-color: rgba(22, 160, 133,0.6);
    display: grid;
    grid-template-columns: repeat(20,1fr);
    grid-template-rows: repeat(1,1fr);    
}

.itemsistemaestudiantepagosmatmod{
    display: flex;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

#montosistemaestudiantepagosmatmod{
    grid-column: 1/8;
}

#fechasistemaestudiantepagosmatmod{
    grid-column: 8/18;
}

#iconosistemaestudiantepagosmatmod{
    grid-column: 18/21;
    padding-right: 10px;
    padding-top: 5px;
    display: block;
    text-align: right;
    color: white;
    font-size: 30px;
}

#boxsistemaestudiantepagospensionmar{
    grid-row: 3/5;
    color: rgb(74, 83 ,136); 
    display: grid;
    grid-template-columns: repeat(20,1fr);
    grid-template-rows: repeat(1,1fr); 
}

.itemsistemaestudiantepagospension{
    display: flex;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

#montosistemaestudiantepagospension{
    grid-column: 1/6;
}

#fechasistemaestudiantepagospension{
    grid-column: 6/12;
}

#horasistemaestudiantepagospension{
    grid-column: 12/18;
}

#iconosistemaestudiantepagospension{
    grid-column: 18/21;
    padding-right: 10px;
    padding-top: 5px;
    display: block;
    text-align: right;
    color: white;
    font-size: 30px;
}

#boxsistemaestudiantepagospensionabr{
    grid-row: 5/7;
    color: rgb(74, 83 ,136); 
    display: grid;
    grid-template-columns: repeat(20,1fr);
    grid-template-rows: repeat(1,1fr); 
}

#boxsistemaestudiantepagospensionmay{
    grid-row: 7/9;
    color: rgb(74, 83 ,136); 
    display: grid;
    grid-template-columns: repeat(20,1fr);
    grid-template-rows: repeat(1,1fr); 
}

#boxsistemaestudiantepagospensionjun{
    grid-row: 9/11;
    color: rgb(74, 83 ,136); 
    display: grid;
    grid-template-columns: repeat(20,1fr);
    grid-template-rows: repeat(1,1fr); 
}

#boxsistemaestudiantepagospensionjul{
    grid-row: 11/13;
    color: rgb(74, 83 ,136); 
    display: grid;
    grid-template-columns: repeat(20,1fr);
    grid-template-rows: repeat(1,1fr); 
}

#boxsistemaestudiantepagospensionago{
    grid-row: 13/15;
    color: rgb(74, 83 ,136); 
    display: grid;
    grid-template-columns: repeat(20,1fr);
    grid-template-rows: repeat(1,1fr); 
}

#boxsistemaestudiantepagospensionsep{
    grid-row: 15/17;
    color: rgb(74, 83 ,136); 
    display: grid;
    grid-template-columns: repeat(20,1fr);
    grid-template-rows: repeat(1,1fr); 
}

#boxsistemaestudiantepagospensionoct{
    grid-row: 17/19;
    color: rgb(74, 83 ,136); 
    display: grid;
    grid-template-columns: repeat(20,1fr);
    grid-template-rows: repeat(1,1fr); 
}

#boxsistemaestudiantepagospensionnov{
    grid-row: 19/21;
    color: rgb(74, 83 ,136); 
    display: grid;
    grid-template-columns: repeat(20,1fr);
    grid-template-rows: repeat(1,1fr); 
}

#boxsistemaestudiantepagospensiondic{
    grid-row: 21/23;
    color: rgb(74, 83 ,136); 
    display: grid;
    grid-template-columns: repeat(20,1fr);
    grid-template-rows: repeat(1,1fr); 
}

.spannegrita{
    font-weight: bold;
    padding-left: 5px;
}

.spancolor{
    color: white;
}

.spanitalic{
    font-style: italic;
}

.spanespacioleft{
    padding-right: 5px;
}

.spanespacioright{
    padding-left: 5px;
}

#boxitemestudianteasistenciaid1{
    border-radius: 5px;
    padding: 7px;
    grid-column: 2/7;
    display: grid;
    grid-template-rows: repeat(13,fr);
    grid-gap: 7px;
}

.itemestudianteasistencia1{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    background-color: rgba(255,255,255,0.1);  
    transition: ease-in-out all 0.3s;
}

.itemestudianteasistencia1:hover{    
    background-color: rgba(0,0,0,0.1); 
    cursor: pointer;
}

#itemestudianteasistenciaid1{
    background-color: transparent;
    grid-row: 1/4;
    display: grid;    
    grid-template-rows: repeat(3,fr);
    grid-gap: 5px;
}

#itemestudianteasistenciaid1:hover{
    background-color: transparent;  
    cursor:  auto;
}

.itemestudianteasistencia1contenido{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

#itemestudianteasistencia1icono{
    font-size: 80px;
    grid-row:1/3;
}

#itemestudianteasistencia1texto{
    font-weight:bold;
    display: grid;
    grid-template-rows: repeat(2,fr);
    grid-gap: 5px;
}

.itemestudianteasistencia1contenidoi{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

#boxitemestudianteasistenciaid2{
    border-radius: 5px;
    grid-column: 8/30;
    display: grid;
    grid-template-columns: repeat(7,1fr);
    grid-template-rows: repeat(6,1fr);
    grid-auto-rows: 1fr;
    grid-gap: 7px;
    padding: 7px;
}

.itemestudianteasistencia2{
    padding: 2px;
    font-weight: bold;
    border-radius: 3px;
    color: rgb(68,84,106);
    font-family: sans-serif;
    font-size: 16px;
    background-color: white; 
    transition: ease-in-out all 0.3s;
}

.itemestudianteasistencia2:hover{
    cursor: pointer;
    background-color: rgba(255,255,255,0.9); 
}

.diasemana{
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-family: sans-serif;
    font-weight: bold;
    font-size: 35px;
    background-color: transparent; 
    transition: ease-in-out all 0.3s;
}

.diasemana:hover{
    cursor: auto;
    background-color: transparent; 
}

.itemestudianteasistencia2transparente{
    cursor: auto;
    background-color: rgba(255,255,255,0.7);
}

.itemestudianteasistencia2transparente:hover{
    cursor: auto;
    background-color: rgba(255,255,255,0.7); 
}

.itemestudianteasistencia2grid{
    display: grid;
    grid-template-columns: repeat(3,1fr);
    grid-gap: 3px;
}

#itemestudianteasistenciafecha{
    grid-column: 1/2;
}

#itemestudianteasistenciacontrol{
    grid-column: 2/4;
    font-size: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.colorasistenciaA{   
    color: rgb(22, 160, 133);    
}

.colorasistenciaT{   
    color: rgb(74, 83 ,136);     
}

.colorasistenciaTJ{   
    color: rgb(52, 152, 219);   
}

.colorasistenciaI{   
    color: rgb(240, 98, 146);    
}

.colorasistenciaIJ{   
    color: rgb(241, 196, 15);  
}

.bienvenido{    
    height: 100%;
    width: 100%;
    color: rgba(26,98,185,0.6);
}

#contenedorimgbienvenido{    
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;   
    width: 100%;
    height: calc(100% - 200px);
    font-size: 200px;
}

#contenedortextobienvenido{
    text-align: center;
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
    width: 100%;
    height: 200px;
    font-size: 25px;
    font-family: sans-serif;
    font-style: italic;
}

.pantallasliderleft{
    margin-top: 10px;
    float: left;      
    width: 250px;
    height: calc(100% - 20px);
    overflow-y: scroll;
    border-width: 0px 1px 0px 0px;
    border-style: dotted;
    border-color: var(--color1);
}

.pantallasliderleftcontenedorimg{
    border-style: solid;
    border-width: 3px;
    border-color: rgb(26,98,185);
    border-radius: 5px;
    overflow: hidden;
    opacity: 0.6;
    text-align: center;
    width: calc(100% - 20px);
    height: auto;
    margin: 20px 10px;
    transition: ease-in-out all 0.3s;
}

.pantallasliderleftcontenedorimg:hover{
    box-shadow: 0 0 10px rgba(0,0,0,0.7);
    cursor: pointer;
}

.pantallasliderleftimg{
    width: 100%;
    height: auto;
}

.pantallasliderleftimgtexto{
    margin: auto;
    padding-bottom: 3px;
    color: rgb(26,98,185);
    font-family: sans-serif;
    font-size: 12px;    
}

.pantallasliderrigth{
    margin-top: 10px;
    float: left;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;  
    width: calc(100% - 250px);
    height: calc(100% - 20px);
    overflow-y: scroll;
}

.pantallasliderrigthcontenedorimg{
    text-align: center;
    margin: auto;
    width: calc(100% - 40px);
    height: calc(100% - 40px);
}

.pantallasliderrigthcontenedorimgleft{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;  
    float: left;
    height: 100%;
    width: calc(100% - 40px);
}

.pantallasliderrigthimg{
    width: calc(100% - 30px);
    height: auto;
    border-style: solid;
    border-width: 0px;
    border-color: var(--color1);
    box-shadow: 0 0 10px rgba(0,0,0,0.7);
}

.contenedorimgvacioperfilminiatura{
    text-align: center;
    margin: auto;
    color: rgba(74, 83 ,136,0.4);
    font-size: 40px;
}

.contenedorimgvacioperfil{
    text-align: center;
    margin: auto;
    color: rgba(74, 83 ,136,0.4);
    font-size: 100px;
}

.contenedorimgvacio{
    text-align: center;
    margin: auto;
    color: rgba(26,98,185,0.4);
    font-size: 100px;
}

.imgvaciotexto{
    margin-top: 0px;
    font-size: 15px;
    font-family: 'comic';
    font-style: italic;
}

.imgvaciotextominiatura{
    margin-top: 10px;
    margin-bottom: 0px;
    font-size: 12px;
    font-family: 'comic';
    font-style: italic;
}

.pantallasliderrigthcontenedorimgrigth{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;  
    float: left;
    height: 100%;
    width: 40px;
}

.pantallasliderrigthcontenedorimgrigthoptions{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    margin: auto;
    height: auto;
    width: 30px;
    color: var(--color1);
    font-size: 25px;    
}

.contenedoroptionsimgslider{
    margin-top: 15px;
    transition: ease-in-out all 0.3s;
}

.contenedoroptionsimgslider:hover{
    cursor: pointer;
    color: var(--color3);
}

#contenedorloading{
    opacity:0;
    visibility: hidden; 
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    top: 0;
    left: 0;
    position: absolute;
    background-color: white;
    height: 100%;
    width: 100%;
}

#contenedorloadingprincipal{
    opacity:0;
    visibility: hidden; 
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    top: 0;
    left: 0;
    position: absolute;
    background-color: white;
    height: 100%;
    width: 100%;
}

#contenedorloadingestudiante{
    z-index: 11;
    opacity:0;
    visibility: hidden; 
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    top: 0;
    left: 0;
    position: absolute;
    background-color: white;
    height: 100%;
    width: 100%;
}


#imgloading{
    width: 120px;
    height: auto;
}

.btnslidernuevo{
    user-select:none;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    position: absolute;
    left: 5px;
    bottom: 5px;
    background-color: rgba(26,98,185,0.9);
    width: 45px;
    height: 45px;
    border-radius: 50%;  
    color: rgba(255,255,255,0.7);
    font-size: 20px;
    transition: ease-in-out all 0.5s;
    box-shadow: 0 0 5px rgba(0,0,0,0.7);
}

.btnslidernuevo:hover{
    cursor: pointer;
    background-color: rgba(26,98,185,1);
    color: rgba(255,255,255,1);
}

.btnestudiantemenu{
    user-select: none;
    z-index: 10;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    position: fixed;
    right: 10px;
    bottom:10px;
    background-color: rgba(26,98,185,0.9);
    width: 45px;
    height: 45px;
    border-radius: 50%;  
    color: rgba(255,255,255,0.7);
    font-size: 20px;
    box-shadow: 0 0 5px rgba(0,0,0,0.7);
    pointer-events: none;
    visibility: hidden;
    opacity: 0;
    transition: ease-in-out all 1s;
}

.btnestudiantemenuvisible{    
    pointer-events: auto;
    visibility: visible;
    opacity: 1;
}

.btnestudiantemenu:hover{
    cursor: pointer;
    background-color: rgba(26,98,185,1);
    color: rgba(255,255,255,1);
}

.btndocentemenuvisible{
    user-select: none;
    z-index: 10;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    position: fixed;
    left: 10px;
    bottom:10px;
    background-color: rgba(26,98,185,0.9);
    width: 45px;
    height: 45px;
    border-radius: 50%;  
    color: rgba(255,255,255,0.7);
    font-size: 20px;
    box-shadow: 0 0 5px rgba(0,0,0,0.7);
    transition: ease-in-out all .5s;
}


.btndocentemenuvisible:hover{
    cursor: pointer;
    background-color: rgba(26,98,185,1);
    color: rgba(255,255,255,1);
}

.btndocentemenu{
    user-select: none;
    z-index: 10;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    position: fixed;
    left: 10px;
    bottom:10px;
    background-color: rgba(26,98,185,0.9);
    width: 45px;
    height: 45px;
    border-radius: 50%;  
    color: rgba(255,255,255,0.7);
    font-size: 20px;
    box-shadow: 0 0 5px rgba(0,0,0,0.7);
    pointer-events: none;
    visibility: hidden;
    opacity: 0;
    transition: ease-in-out all 1s;
}


.btndocentemenu:hover{
    cursor: pointer;
    background-color: rgba(26,98,185,1);
    color: rgba(255,255,255,1);
}

#btniniciosistema_estudiante2{
    background-color: rgba(52, 152, 219,0.8);
}

#btniniciosistema_estudiante2:hover{
    background-color: rgba(52, 152, 219,1);
}

#btniniciosistema_estudiante3{
    background-color: rgba(240, 98, 146,0.8);
}

#btniniciosistema_estudiante3:hover{
    background-color: rgba(240, 98, 146,1);
}

#btniniciosistema_estudiante4{
    background-color: rgba(194,176,218,0.8);
}

#btniniciosistema_estudiante4:hover{
    background-color:  rgba(194,176,218,1);
}

#btniniciosistema_estudiante5{
    background-color: rgba(22, 160, 133,0.8);
}

#btniniciosistema_estudiante5:hover{
    background-color: rgba(22, 160, 133,1);
}

#btniniciosistema_estudiante6{
    background-color: rgba(241, 196, 15,0.8);
}

#btniniciosistema_estudiante6:hover{
    background-color: rgba(241, 196, 15,1);
}

#btniniciosistema_estudiante7{
    background-color: rgba(26,98,185,0.8);
}

#btniniciosistema_estudiante7:hover{
    background-color: rgba(26,98,185,1);
}

#btniniciosistema_estudiante8{
    background-color: rgba(125,84,181,0.8);
}

#btniniciosistema_estudiante8:hover{
    background-color: rgba(125,84,181,1);
}

#btniniciosistema_estudiante9{
    background-color: rgba(74, 83 ,136,0.9);
}

#btniniciosistema_estudiante9:hover{
    background-color: rgba(74, 83 ,136,1);
}

#btnmenututoria{
    background-color: rgba(22, 160, 133,0.8);
}

#btnmenututoria:hover{
    background-color: rgba(22, 160, 133,1);
}

#btnmenuaulavirtual{
    background-color: rgba(241, 196, 15,0.8);
}

#btnmenuaulavirtual:hover{
    background-color: rgba(241, 196, 15,1);
}

#btnmenuasistenciaclase{
    background-color: rgba(52,152,219,0.8);
}

#btnmenuasistenciaclase:hover{
    background-color: rgba(52,152,219,1);
}

#btnmenucalificaciones{
    background-color: rgba(194,176,218,0.8);
}

#btnmenucalificaciones:hover{
    background-color: rgba(194,176,218,1);
}

#btnmenuhorariocursos{
   background-color: rgba(240, 98, 146,0.8);
}

#btnmenuhorariocursos:hover{
    background-color: rgba(240, 98, 146,1);
}

#btnmenuperfil{
   background-color: rgba(74, 83 ,136,0.9);
}

#btnmenuperfil:hover{
    background-color: rgba(74, 83 ,136,1);
}

.contenedorslidernuevo{
    z-index: 5;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    position: absolute;
    top: 100%;
    left: calc(100% - 230px);
    background-color: rgba(26,98,185,0.9);
    width: 225px;
    height: 135px;  
    color: rgba(255,255,255,0.7);
    font-size: 20px;
    transition: ease-in-out all 0.3s;
    font-family: sans-serif;    
}

#contenedorslidernuevoperfil{
    z-index: 5;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    position: absolute;
    top: auto;
    bottom: -150px;
    left: 65px;
    background-color: rgba(74, 83 ,136,0.9);
    width: 225px;
    height: 135px;  
    color: rgba(255,255,255,0.7);
    font-size: 20px;
    transition: ease-in-out all 0.3s;
    font-family: sans-serif;    
}

#contenedorfile{
    width: 205px;
    height: 135px;
    overflow: hidden;
}


.imgnuevanota{
    padding: 5px;
    margin-top: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    color: rgba(255,255,255,0.7);
    width: 205px;
    height: 35px;
    text-align: justify;   
    font-size: 13px;
    border-width: 0px 0px 1px 0px;
    border-style: solid;
    border-color: rgba(255,255,255,0.3);
    font-style: italic;
}

.imgnueva{
    margin-top: 20px;
    margin-left: -103px;
    outline: none; 
    pointer-events: none;
}

.fileclick2{
    z-index: 2;
    top: 55px;
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    float: left;
    background-color: white;
    border-radius: 5px;
    width: 30px;
    height: 30px;
    color: rgba(74, 83 ,136,0.9);
    font-size: 20px;
    transition: ease-out all 0.3s;
}

.fileclick2:hover{
    background-color: rgb(241, 196, 15);
    color: rgba(255,255,255,1);
    cursor: pointer;  
}

.fileclick{
    z-index: 2;
    top: 55px;
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    float: left;
    background-color: white;
    border-radius: 5px;
    width: 30px;
    height: 30px;
    color: rgba(26,98,185,0.9);
    font-size: 20px;
    transition: ease-out all 0.3s;
}

.fileclick:hover{
    background-color: rgb(241, 196, 15);
    color: rgba(255,255,255,1);
    cursor: pointer;  
}

#enviarimagennueva{
    margin-left: 0px;
    margin-top: 15px;
    color: rgba(255,255,255,0.5);
    height: 30px;
    width: 205px;   
    outline: none;
    border-width: 1px;
    border-style: solid;
    background-color: rgba(0,0,0,0.2);
    border-color: rgba(255,255,255,0.3);
    transition: all 0.3s ease-in-out;
}

#enviarimagennueva:hover{
    color: rgba(255,255,255,1);
    background-color: rgb(241, 196, 15);
    cursor: pointer;
}

.pantallaprincipal{
    width: 100%;
    height: 100%;
}

.patallaprincipaltop{
    position: fixed;
    width: 100%;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.contenedorbuscador{
    position: relative;
    overflow: hidden;
    height: 30px;
    width: calc(100% - 20px);
    max-width: 400px;
    border-radius: 15px;
    border-color: var(--color1);
    border-style: solid;
    border-width: 1px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    box-sizing: content-box;
}

.contenedorbuscadornuevamat{
    margin-top: 10px;
    margin-left: 10px;
    background-color: white;
    position: relative;
    overflow: hidden;
    height: 25px;
    width: calc(100% - 20px);
    max-width: 400px;
    border-radius: 12.5px;
    border-color: rgba(255,255,255,0.8);
    border-style: solid;
    border-width: 0px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    box-sizing: content-box;
}

.contenedorpantallanuevamat{
    overflow-y: scroll;
    margin-top: 10px;
    margin-left: 10px;
    background-color: white;
    width: calc(100% - 20px);
    height: 150px;
    border-radius: 7px;
}

#contenedorpantallamatseccionest{
    margin-left: 0px;
    width: 100%;
     height: 180px;
}

.imgbuscador{    
    width: 30px;
    height: 30px;
    color: rgba(26,98,185,0.6);
    font-size: 15px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    border-radius: 50%;
    transition: ease-in-out all 0.3s;
}

.imgbuscadornuevamat{    
    width: 25px;
    height: 25px;
    color: rgba(26,98,185,0.6);
    font-size: 13px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    border-radius: 50%;
    transition: ease-in-out all 0.3s;
}

.buscadorinput{
    text-align: center;
    background-color: transparent;
    padding-left: 5px;
    font-family: sans-serif;
    color: rgba(26,98,185,0.6);
    font-style: italic;
    font-size: 15px;
    outline: none;
    border-width: 0px;
    height: 25px;
    width: calc(100% - 60px);
}

.buscadorinput::placeholder{
    color: rgba(26,98,185,0.6);
}

.buscadorinputnuevamat{
    text-align: center;
    background-color: transparent;
    padding-left: 5px;
    font-family: sans-serif;
    color: rgba(26,98,185,0.6);
    font-style: italic;
    font-size: 13px;
    outline: none;
    border-width: 0px;
    height: 25px;
    width: calc(100% - 25px);
}

.buscadorinputnuevamat::placeholder{
    color: rgba(26,98,185,0.6);
}

.imgrefresh{
    width: 30px;
    height: 30px;
    color: rgba(26,98,185,0.6);
    font-size: 15px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    border-radius: 50%;
    transition: ease-in-out all 0.3s;
    
}

.imgrefresh:hover{
    cursor: pointer;
    color: rgba(26,98,185,1);
    transform: rotate(360deg);
}

.patallaprincipalbottom{
    position: fixed;
    margin-top: 50px;
    width: 100%;
    height: calc(100% - 100px);
}

#patallaprincipalbottomestudiante{  
    width: 200%;
}

.patallaprincipalbottomleft{    
    text-align: center;
    overflow: scroll;
    margin-left: 10px;
    margin-right: 10px;
    float: left;
    height: calc(100% - 10px);
    width: calc(50% - 20px);
    transition: ease-in-out all 1s;
}

.patallaprincipalbottomright{
    overflow-y: scroll;
    float: left;
    height: calc(100% - 10px); 
    width: 50%;
    background-color: transparent;
    transition: ease-in-out all 1s;
}

.patallaprincipalbottomindividual{
    overflow-y: scroll;
    float: right;
    width: 50%;
    height: calc(100% - 10px);
    border-style: dotted;
    border-color: var(--color1);
    border-width: 0px 0px 0px 1px;
    text-align: center;
}

.patallaprincipalbottomgeneral{
    text-align: center;
    float: right;
    width: 50%;
    height: calc(100% - 10px);
    overflow: scroll;
}

.noresultado{
    width: 100%;
    margin: 30px auto;
    color: rgba(26,98,185,0.7);
    font-style: italic;
    font-family: sans-serif;
    font-size: 14px;
    font-weight: bold;
    text-align: center;
}

.noresultadonuevamat{
    width: 100%;
    margin: 10px auto;
    color: rgba(26,98,185,0.6);
    font-style: italic;
    font-family: sans-serif;
    font-size: 13px;
    text-align: center;
}

.noresultadoseccion{
    width: 100%;
    margin: 30px auto -10px auto;
    color: rgba(26,98,185,0.7);
    font-style: italic;
    font-family: sans-serif;
    font-size: 14px;
    text-align: center;
}

.noresultadoseccioncursohorario{
    width: 100%;
    margin: 30px auto;
    color: rgba(45,54,76,0.8);
    font-style: italic;
    font-family: sans-serif;
    font-size: 13px;
    text-align: center;
}

.seccionencabezadonivel{
    border-radius: 5px;
    background-color: var(--color1);
    width: 330px;
    height: 30px;
    margin: 30px auto -10px auto;
    color: white;
    font-family: sans-serif;
    font-size: 14px;
    text-align: center;
}

.seccionencabezadoprematricula{
    transition: ease-in-out all 0.3s;
    border-radius: 5px;
    background-color: var(--color1);
    width: 330px;
    height: 30px;
    margin: 10px auto -10px auto;
    color: white;
    font-family: 'comic';
    font-size: 14px;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    padding-left: 10px;
}

.seccionencabezadoprematricula:hover{
    cursor: pointer;
    background-color: rgb(125,84,181);
}

.nivelseccionencabezadonivel{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    float: left;
    width: 110px;
    height: 30px;
    color: white;
    font-family: sans-serif;
    font-size: 14px;
    text-align: center;
}

.masculinoseccionencabezadonivel{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    float: left;
    width: 55px;
    height: 30px;
    color: white;
    font-family: sans-serif;
    font-size: 14px;
    text-align: center;
}

.masculinoseccionencabezadonivel2{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    float: left;
    width: 65px;
    height: 30px;
    color: white;
    font-family: sans-serif;
    font-size: 14px;
    text-align: center;
}

.femeninoseccionencabezadonivel{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    float: left;
    width: 55px;
    height: 30px;
    color: white;
    font-family: sans-serif;
    font-size: 14px;
    text-align: center;
}

.femeninoseccionencabezadonivel2{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    float: left;
    width: 65px;
    height: 30px;
    color: white;
    font-family: sans-serif;
    font-size: 14px;
    text-align: center;
}

.alumnosseccionencabezadonivel{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    float: left;
    width: 80px;
    height: 30px;
    color: white;
    font-family: sans-serif;
    font-size: 14px;
    text-align: center;
}

.alumnosseccionencabezadonivel2{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    float: left;
    width: 90px;
    height: 30px;
    color: white;
    font-family: sans-serif;
    font-size: 14px;
    text-align: center;
}

.excelseccionencabezadonivel{    
    float: left;
    width: 30px;
    height: 30px;
    color: white;
    font-family: sans-serif;
    font-size: 14px;
    text-align: center;
}

.tabla{
    border-collapse: collapse;
    font-family: sans-serif;
    font-size: 13px;
    margin: 15px auto;
    color: rgba(255,255,255,0.8);
    border-width: 10px;
    border-style: solid;
    border-color: rgb(26,98,185);
    background-color: rgb(26,98,185);
}

.fontcomic{
    font-family: 'comic';
}

.tabla2{
    border-collapse: collapse;
    font-family: sans-serif;
    font-size: 13px;
    margin: 15px auto;
    color: rgba(255,255,255,0.8);
    border-width: 10px;
    border-style: solid;
    border-color: rgba(26,98,185,1);
    background-color: rgba(26,98,185,1);
}

.tabla3{
    border-collapse: collapse;
    font-family: sans-serif;
    font-size: 13px;
    margin: 15px auto;
    color: rgba(255,255,255,0.8);
    border-width: 10px;
    border-style: solid;
    border-color: rgb(74, 83 ,136);
    background-color: rgb(74, 83 ,136);
}

.tabla3left{
    border-collapse: collapse;
    font-family: sans-serif;
    font-size: 13px;
    margin-top: 15px;
    margin-left: 5px;
    color: rgba(255,255,255,0.8);
    border-width: 10px;
    border-style: solid;
    border-color: rgb(74, 83 ,136);
    background-color: rgb(74, 83 ,136);
}

.tablatrh{
    color: rgba(255,255,255,1);
    font-size: 14px;
}

.tablath{
    padding: 5px 10px;
    cursor: pointer;
}

.tablatrbtotal{
    background-color: rgba(0,0,0,0.2);
    height: 40px;
    font-weight: bold;
    border-width: 1px 0px 0px 0px;
    border-style: solid;
    border-color: rgba(255,255,255,0.2);
    transition: ease-in-out all 0.3s;
    cursor: pointer;
}

.tablatrb{
    border-width: 1px 0px 0px 0px;
    border-style: solid;
    border-color: rgba(255,255,255,0.2);
    transition: ease-in-out all 0.3s;
    cursor: pointer;
}

.tablatrb:hover{
    background-color: rgba(255,255,255,0.1);
    color: var(--color3);
}

.tablatrb2{
    border-width: 1px 0px 0px 0px;
    border-style: solid;
    border-color: rgba(255,255,255,0.2);
    transition: ease-in-out all 0.3s;
    cursor: pointer;
}

.tablatrb2:hover{
    background-color: rgba(255,255,255,0.1);
    color: rgb(194,176,218);
}

.tablatrb2verde{
    border-width: 1px 0px 0px 0px;
    border-style: solid;
    border-color: rgba(255,255,255,0.2);
    transition: ease-in-out all 0.3s;
    cursor: pointer;
}

.tablatrb2verde:hover{
    background-color: rgba(22, 160, 133,1);
    color: rgba(255,255,255,255,0.8);
}

.tablatdright{
    padding: 5px 10px 5px 5px;
    text-align: right;
}

.hovertdazulwhite{
    transition: ease-in-out all 0.3s;
}

.hovertdazulwhite{
    cursor: pointer;
    color: white;
}

.tablatdright1{
    padding: 5px 10px 5px 5px;
    text-align: right;
    font-size: 12px;
}

.tablatdcenter{
    padding: 5px 10px;
    text-align: center;
}

#tablatdoption{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;    
}

.divtdoptiontd{
    padding: 5px 10px;
    text-align: left; 
}

.divtdoption{
    font-size: 15px;
    width: 23px;
    height: 23px;
    margin: auto;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap; 
}

.divtdoption:hover{    
    color: white;
}

.divtdoptionsave{
    font-size: 15px;
    width: 23px;
    height: 23px;
    margin: auto;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap; 
}

.divtdoptionsave:hover{    
    color: white;
}

.divtdoptioncumpleall{
    width: 23px;
    height: 23px;
    margin: auto;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap; 
    transition: ease-in-out all 0.3s;
}

.divtdoptioncumpleall:hover{
    cursor: pointer;
    color: var(--color3);
}

.divtdoptionsaveall{
    padding-bottom: 2px;
    font-size: 22px;
    width: 25px;
    height: 25px;
    margin: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap; 
    transition: ease-in-out all 0.3s;
}

.divtdoptionsaveall:hover{
    cursor: pointer;
    color: var(--color3);
}

.alertapagopensionadmin{
    color: var(--color3);
}

.divtdasistencia{
    background-color: white;
    font-family: 'comic';
    box-sizing: border-box;
    border-radius: 50%;
    font-size: 12px;
    height: 23px;
    width: 23px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    color: white;
    box-shadow: 0 0 4px rgba(255,255,255,0.7)
}

#divtdasistenciaA{   
    background-color: rgb(22, 160, 133);    
}

#divtdasistenciaT{   
    background-color: rgb(52, 152, 219);     
}

#divtdasistenciaTE{   
    background-color: var(--color1);     
}

#divtdasistenciaTJ{ 
    background-color: rgb(125,84,181);
}

#divtdasistenciaF{   
    background-color: rgb(240, 98, 146);    
}

#divtdasistenciaFJ{   
    background-color: rgb(241, 196, 15);  
}

.tablatdleft{    
    padding: 5px 5px 5px 10px;
    text-align: left;
}

.tablatdleft1{
    font-size: 12px;
    padding: 5px 5px 5px 10px;
    text-align: left;
}

.contenedorfrmnuevo{
    box-shadow: 0 0 5px rgba(0,0,0,0.7);
    position: absolute;
    top: 9px;
    right: -360px;
    height: auto;
    width: calc(100% - 18px);
    max-width: 350px;
    background-color: rgba(26,98,185,0.9);
    text-align: center;    
    transition: ease-in-out all 0.5s;
}

#contenedorfrmvacante{    
    top: 99px;
    right: -360px;
    height: auto;
    width: calc(100% - 18px);
    max-width: 350px;
    background-color: rgba(26,98,185,0.9);
    text-align: center;    
    transition: ease-in-out all 0.5s;
}

#contenedorfrmmatricularnuevoestudiante{  
    overflow-y: scroll;
    top: 99px;
    right: -360px;
    height: 450px;
    width: calc(100% - 18px);
    max-width: 350px;
    background-color: rgba(26,98,185,0.9);
    text-align: center;    
    transition: ease-in-out all 0.5s;
}

#contenedorfrmcursosseccionagregar{    
    top: 99px;
    right: -360px;
    height: auto;
    width: calc(100% - 18px);
    max-width: 350px;
    background-color: rgba(26,98,185,0.9);
    text-align: center;    
    transition: ease-in-out all 0.5s;
}

#contenedorfrmcursosseccionhorarioagregar{    
    top: 99px;
    right: -360px;
    height: auto;
    width: calc(100% - 18px);
    max-width: 350px;
    background-color: rgba(26,98,185,0.9);
    text-align: center;    
    transition: ease-in-out all 0.5s;
}

#contenedorfrmexamsemanal{    
    top: 99px;
    right: -360px;
    height: auto;
    width: calc(100% - 18px);
    max-width: 350px;
    background-color: rgba(26,98,185,0.9);
    text-align: center;    
    transition: ease-in-out all 0.5s;
}

#contenedorexamsemanalarea{    
    top: 99px;
    right: -360px;
    height: auto;
    width: calc(100% - 18px);
    max-width: 350px;
    background-color: rgba(26,98,185,0.9);
    text-align: center;    
    transition: ease-in-out all 0.5s;
}

#contenedorfrmcursosseccionhorarioeditar{    
    top: 99px;
    right: -360px;
    height: auto;
    width: calc(100% - 18px);
    max-width: 350px;
    background-color: rgba(26,98,185,0.9);
    text-align: center;    
    transition: ease-in-out all 0.5s;
}

#contenedorfrmmatricularequisitos{    
    top: 99px;
    right: -360px;
    height: auto;
    width: calc(100% - 18px);
    max-width: 350px;
    background-color: rgba(26,98,185,0.9);
    text-align: center;    
    transition: ease-in-out all 0.5s;
}

#contenedorfrmmatriculamontos{    
    top: 99px;
    right: -360px;
    height: auto;
    width: calc(100% - 18px);
    max-width: 350px;
    background-color: rgba(26,98,185,0.9);
    text-align: center;    
    transition: ease-in-out all 0.5s;
}

#contenedorfrmmatriculaseccion{    
    top: 99px;
    right: -360px;
    height: auto;
    width: calc(100% - 18px);
    max-width: 350px;
    background-color: rgba(26,98,185,0.9);
    text-align: center;    
    transition: ease-in-out all 0.5s;
}

#contenedorfrmmatriculaseccionestudiante{    
    top: 99px;
    right: -360px;
    height: auto;
    width: calc(100% - 18px);
    max-width: 350px;
    background-color: rgba(26,98,185,0.9);
    text-align: center;    
    transition: ease-in-out all 0.5s;
}

#contenedorfrmmatriculapagospension{    
    top: 99px;
    right: -360px;
    height: auto;
    width: calc(100% - 18px);
    max-width: 350px;
    background-color: rgba(26,98,185,0.9);
    text-align: center;    
    transition: ease-in-out all 0.5s;
}

#contenedorfrmeditarpagospension{    
    top: 99px;
    right: -360px;
    height: auto;
    width: calc(100% - 18px);
    max-width: 350px;
    background-color: rgba(26,98,185,0.9);
    text-align: center;    
    transition: ease-in-out all 0.5s;
}

.encabezadofrmnuevo{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    box-sizing: content-box;
    margin: auto;
    width: calc(100% - 10px);
    height: 30px;
    color: rgba(255,255,255,0.8);
    border-style: solid;
    border-width: 0px 0px 1px 0px;
    border-color: rgba(255,255,255,0.8);      
}

.encabezadofrmnuevoicono{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    width: 30px;
    height: 30px;
    font-size: 15px;
}

.encabezadofrmnuevotitulo{
    text-align: left;
    padding-top: 10px;
    padding-left: 10px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    width: calc(100% - 50px);
    height: 30px;
    font-family: sans-serif;
    font-style: italic;
    font-size: 14px;
}

.encabezadofrmnuevocerrar{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    width: 20px;
    height: 30px;
    font-size: 15px;
    transition: ease-in-out all 0.3s;
}

.encabezadofrmnuevocerrar:hover{
    cursor: pointer;
    color: var(--color3);
}

.frmpadrenuevo{    
    width: calc(100% - 20px);
    height: auto;
    margin: 10px auto;
    text-align: left;
}

.txtnuevo{
    box-sizing: border-box;
    padding-left: 5px;
    font-family: sans-serif;
    font-size: 14px;
    margin-top: 10px;
    width: 100%;
    height: 25px;
    background-color: transparent;
    outline: none;
    color: rgba(255,255,255,0.8);
    border-width: 0px 0px 1px 0px;
    border-style: dotted;
    border-color: rgba(255,255,255,0.5);
}

.txtnuevo::placeholder{
    color: rgba(255,255,255,0.5);
}

.txtnuevo3{
    box-sizing: border-box;
    padding-left: 5px;
    font-family: sans-serif;
    font-size: 14px;
    margin-top: 10px;
    width: 55%;
    height: 25px;
    background-color: transparent;
    outline: none;
    color: rgba(255,255,255,0.8);
    border-width: 0px 0px 1px 0px;
    border-style: dotted;
    border-color: rgba(255,255,255,0.5);
}

.txtnuevo3::placeholder{
    color: rgba(255,255,255,0.5);
}

.txtnuevamat{
    pointer-events: none;
    box-sizing: border-box;
    padding-left: 5px;
    font-family: sans-serif;
    font-size: 13px;
    margin-top: 10px;
    width: 100%;
    height: 20px;
    background-color: transparent;
    outline: none;
    color: rgba(255,255,255,0.8);
    border-width: 0px 0px 1px 0px;
    border-style: dotted;
    border-color: rgba(255,255,255,0.5);
}

.txtnuevamat::placeholder{
    color: rgba(255,255,255,0.5);
}

.txtnuevamat2{
    box-sizing: border-box;
    padding-left: 5px;
    font-family: sans-serif;
    font-size: 13px;
    margin-top: 10px;
    width: 51%;
    height: 20px;
    background-color: transparent;
    outline: none;
    color: rgba(255,255,255,0.8);
    border-width: 0px 0px 1px 0px;
    border-style: dotted;
    border-color: rgba(255,255,255,0.5);
}

.txtnuevamat2::placeholder{
    color: rgba(255,255,255,0.5);
}

.txtnuevamat3{
    box-sizing: border-box;
    padding-left: 5px;
    font-family: sans-serif;
    font-size: 13px;
    margin-top: 0px;
    width: 51%;
    height: 20px;
    background-color: transparent;
    outline: none;
    color: rgba(255,255,255,0.8);
    border-width: 0px 0px 1px 0px;
    border-style: dotted;
    border-color: rgba(255,255,255,0.5);
}

.txtnuevamat3::placeholder{
    color: rgba(255,255,255,0.5);
}

.contenedorlabelmat{
    font-style: italic;
    margin-top: 7px;
    width: 100%;
    height: 20px;
    font-size: 13px;
    color: rgba(255,255,255,0.8);
    font-family: sans-serif;
}

.contenedorlabelnomcurso{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-style: italic;
    margin-top: 7px;
    width: 100%;
    height: 20px;
    font-size: 13px;
    color: rgba(255,255,255,0.8);
    font-family: sans-serif;
    background-color: rgba(0,0,0,0.2);
}

.contenedorlabelmat2{
    margin-top: 20px;
    width: 100%;
    height: 20px;
    font-size: 13px;
    color: rgba(255,255,255,0.8);
    font-family: sans-serif;
}

#contenedorlabelmatestudiante{
    padding-left: 5px;
    padding-top: 3px;
    margin-top: 15px;  
    background-color: rgba(0,0,0,0.2);
}

#contenedorlabeleditpensionestudiante{
    padding-left: 5px;
    padding-top: 3px;
    margin-top: 15px;  
    background-color: rgba(0,0,0,0.2);
}

#contenedorlabelexamsemanalnuevo{
    text-align: center;
    padding-left: 5px;
    padding-top: 3px;
    margin-top: 15px;  
    background-color: rgba(0,0,0,0.2);
}

.checkboxmat{
    float: left;
    margin-top: 2.5px;
    width: 15px;
    height: 15px;
    background-color: rgba(255,255,255,0.8);
    margin-right: 5px;
}

.checkboxmatinactive{
    float: left;
    margin-top: 2.5px;
    width: 15px;
    height: 15px;
    background-color: rgba(255,255,255,0.8);
    margin-right: 5px;
    pointer-events: none;
    opacity: 0.6;
}

.spancheckboxmat{
    float: left;
    width: 200px;
    padding-top: 2.5px;
    height: 20px;
}

.spancheckboxmatinactive{
    float: left;
    width: 200px;
    padding-top: 2.5px;
    height: 20px;
    pointer-events: none;
    opacity: 0.6;
}

#spancheckboxmat4{   
    width: 100px;
}

#spancheckboxmat8{   
    width: 160px;
}

#editspancheckboxmat4{   
    width: 100px;
}

#editspancheckboxmat8{   
    width: 160px;
}

.activarlabel{
    transition: ease-in-out all 0.3s;
    font-size: 16px;
    float: left;
    width: 17px;
    height: 16px;
    margin-top: 1.5px;
}

.activarlabel:hover{
    cursor: pointer;
    color: var(--color3);
}

#txtoculto{
    float: left;
    margin-top: 0px;
    opacity: 0;
    pointer-events: none;
    font-size: 0px;
    width: 100%;
    height: 1px;
    background-color: transparent;
    outline: none;
    color: rgba(255,255,255,0.8);
    border-width: 0px 0px 0px 0px;
}

.txtnuevo2{
    margin-top: 0px;
    float: right;
    box-sizing: border-box;
    padding-left: 5px;
    font-family: sans-serif;
    font-size: 14px;
    margin-top: 17px;
    width: calc(45% - 10px);
    height: 25px;
    background-color: transparent;
    outline: none;
    color: rgba(255,255,255,0.8);
    border-width: 0px 0px 1px 0px;
    border-style: dotted;
    border-color: rgba(255,255,255,0.5);
}

.txtnuevo2::placeholder{
    color: rgba(255,255,255,0.5);
}

#txtnumdocpadre{
    pointer-events: none;
    opacity: 0.4;
}

#txtnumdocestudiante{
    pointer-events: none;
    opacity: 0.4;
}

.selectnuevo{
    box-sizing: border-box;
    font-family: sans-serif;
    font-size: 14px;
    margin-top: 17px;
    height: 25px;
    width: 55%;
    outline: none;
    background-color: rgba(0,0,0,0.2);
    border-width: 0px;
    border-style: dotted;
    border-color: rgba(255,255,255,0.5);
    color: rgba(255,255,255,0.8);
}

.frmprematricula{
    position: relative;
    margin: auto;
    padding: 5px;
    height: auto;
    width: 100%;
    max-width: 400px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 10px;
}

.contenedorfilepagomat{
    overflow: hidden;
    position: relative;
    box-sizing: border-box;
    font-family: sans-serif;
    font-size: 14px;
    height: 25px;    
    width: calc(100% - 18px);
    outline: none;
    background-color: white;
    border-radius: 3px;
    color: rgb(125,84,181);
    transition: ease-in-out all 0.5s;    
    cursor: pointer;
    box-sizing: border-box;
    border-color: rgb(125,84,181);
    border-style: solid;
    border-width: 2px;
}



#imgpagopreview{ 
    opacity: 0.8;
    background-color: rgb(125,84,181);
    width: 200px;
    height: auto;
    border-color: rgb(125,84,181);
    border-style: solid;
    border-width: 3px;
    transition: ease-in-out all 0.5s;
}

#imgpagopreview:hover{
    opacity: 1;
    cursor: pointer;
    box-shadow: 0 0 10px rgba(0,0,0,0.7); 
}

#contenedorbtnpagomat{
    cursor:  auto;
    border-width: 0;
    font-family: sans-serif;
    font-size: 14px;
    height: 30px;    
}

#contenedorbtnpagomat:hover{
    background-color: white;
}

.btnenviarfrmprematid{
    float: right;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    margin: auto;
    border-radius: 3px;
    height: 100%;
    width: 100px;
    background-color: rgb(125,84,181);
    color: rgba(255,255,255,0.8);
    transition: ease-in-out all 0.5s;
}

.btnenviarfrmprematid:hover{
    cursor: pointer;
    box-shadow: 0 0 5px rgba(0,0,0,0.7); 
    color: white;
}

.contenedorfilepagomat:hover{
    background-color: rgb(125,84,181);
    color: white;
}

.contenedorfilepagomat:hover>.imgformpago{    
    background-color: rgb(125,84,181);
    color: white;
}

.selectnuevomat{
    box-sizing: border-box;
    font-family: sans-serif;
    font-size: 14px;
    height: 25px;    
    width: 180px;
    outline: none;
    background-color: rgb(125,84,181);
    border-radius: 3px;
    color: rgba(255,255,255,0.8);
    transition: ease-in-out all 0.5s;
}

.selectnuevomat:hover{
    cursor: pointer;
    box-shadow: 0 0 5px rgba(0,0,0,0.7);    
}

.selectcodigooperacion{
    cursor: auto;
    pointer-events: none;
    opacity: 0.5;
    padding: 0px 5px;
    box-sizing: border-box;
    font-family: sans-serif;
    font-size: 13px;
    height: 25px;    
    width: 100%;
    outline: none;
    background-color: white;
    border-radius: 3px;
    color: rgb(125,84,181);
    transition: ease-in-out all 0.5s;
    border: 1px solid rgb(125,84,181);
}

.selectcodigooperacion::placeholder{
    color: rgba(125,84,181,0.5);
}

.selectcodigooperacion2{
    cursor: auto;
    padding: 0px 5px;
    box-sizing: border-box;
    font-family: sans-serif;
    font-size: 13px;
    height: 25px;    
    width: 100%;
    outline: none;
    background-color: white;
    border-radius: 3px;
    color: rgb(125,84,181);
    transition: ease-in-out all 0.5s;
    border: 1px solid rgb(125,84,181);
}

.selectcodigooperacion2::placeholder{
    color: rgba(125,84,181,0.5);
}

#pagoonlinemontomatid{
    pointer-events: auto;
    opacity: 1;
}

#pagoonlinemontomodid{
    pointer-events: auto;
    opacity: 1;
}

#pagoonlinemontopenid{
    pointer-events: auto;
    opacity: 1;
}

.fileclickpago{
    box-sizing: border-box; 
    outline: none;
    margin-left: -105px;
    width: 400px;
    height: 21px; 
    cursor: pointer;
}

.imgformpago{
    background-color: white;
    box-sizing: border-box;    
    top: 0;
    left: 0;
    position: absolute;
    height: 21px;
    width: 30px;
    z-index: 3;
    color: rgb(125,84,181);
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-size: 17px;
    transition: ease-in-out all 0.5s;
    cursor: pointer;
}

#contenedorfilepagomatcover{
    top: 0;
    left: 0;
    position: absolute;
    height: 100%;
    width: 100%;
    z-index: 4;
}

.frmprematwating{
    pointer-events: none;
    visibility: hidden;
    position: absolute;
    height: 100%;
    width: 100%;
    background-color: white;
    z-index: 4;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.selectnuevo2{
    box-sizing: border-box;
    font-family: sans-serif;
    font-size: 14px;
    margin-top: 17px;
    height: 25px;
    width: 100%;
    outline: none;
    background-color: rgba(0,0,0,0.2);
    border-width: 0px;
    border-style: dotted;
    border-color: rgba(255,255,255,0.5);
    color: rgba(255,255,255,0.8);
}

.optionnuevo{
    background-color: rgb(236, 240, 241);
    color: rgba(26,98,185,0.7);
}

.optionnuevoselectseccionmat{
    background-color: white;
    color: rgb(125,84,181);
}

.optiondisplaynone{
    display: none;
}

.optionnuevoselectseccion{
    background-color: rgb(236, 240, 241);
    color: rgba(26,98,185,0.7);
}

.optionnuevoselectseccionedit{
    background-color: rgb(236, 240, 241);
    color: rgba(26,98,185,0.7);
}

.optionnuevoselectseccioneditar{
    background-color: rgb(236, 240, 241);
    color: rgba(26,98,185,0.7);
}

#selectpaispadre{
    opacity: 0.4;
    pointer-events: none;
}

#selectpaisestudiante{
    opacity: 0.4;
    pointer-events: none;
}

#selectanioseccion{
    opacity: 0.4;
    pointer-events: none;
}

#selectnivelseccion{
    opacity: 0.4;
    pointer-events: none;
}

#selectgradoseccion{
    opacity: 0.4;
    pointer-events: none;
}

#selectnomseccion{
    opacity: 0.4;
    pointer-events: none;
}

#selectnomseccioneditar{
    opacity: 0.4;
    pointer-events: none;
}

#txtnomseccionideditar{
    opacity: 0.5;
    pointer-events: none;
}

#txtnomseccionid{
    opacity: 0.5;
    pointer-events: none;
}

.datenuevo{
    padding-left: 5px;
    float: right;
    box-sizing: border-box;
    font-family: sans-serif;
    font-size: 14px;
    margin-top: 17px;
    width: calc(45% - 10px);
    height: 25px;
    outline: none;
    background-color: rgba(0,0,0,0.2);
    color: rgba(255,255,255,0.8);
    border-width: 0px;
    border-style: dotted;
    border-color: rgba(255,255,255,0.5);
}

.datepension{
    padding-left: 5px;
    box-sizing: border-box;
    font-family: sans-serif;
    font-size: 14px;
    margin-top: 0px;
    width: calc(45% - 10px);
    height: 25px;
    outline: none;
    background-color: rgba(0,0,0,0.2);
    color: rgba(255,255,255,0.8);
    border-width: 0px;
    border-style: dotted;
    border-color: rgba(255,255,255,0.5);
}

#datecm{
    float: left;
    margin-top: 5px;
}

#dateeditarnacestudiante{
    margin-top: 0px;
    padding-left: 3px;
    box-sizing: border-box;
    font-family: sans-serif;
    font-size: 14px;
    width: 140px;
    height: 25px;
    outline: none;
    background-color: rgba(26,98,185,1);
    color: rgba(255,255,255,0.8);
    border-width: 0px;
    border-style: dotted;
    border-color: rgba(255,255,255,0.5);
}

#dateeditarnacpadre{
    margin-top: 0px;
    padding-left: 3px;
    box-sizing: border-box;
    font-family: sans-serif;
    font-size: 14px;
    width: 140px;
    height: 25px;
    outline: none;
    background-color: rgba(26,98,185,1);
    color: rgba(255,255,255,0.8);
    border-width: 0px;
    border-style: dotted;
    border-color: rgba(255,255,255,0.5);
}

#dateeditarnacadministrativo{
    margin-top: 0px;
    padding-left: 3px;
    box-sizing: border-box;
    font-family: sans-serif;
    font-size: 14px;
    width: 140px;
    height: 25px;
    outline: none;
    background-color: rgba(26,98,185,1);
    color: rgba(255,255,255,0.8);
    border-width: 0px;
    border-style: dotted;
    border-color: rgba(255,255,255,0.5);
}

#dateeditarnacdocente{
    margin-top: 0px;
    padding-left: 3px;
    box-sizing: border-box;
    font-family: sans-serif;
    font-size: 14px;
    width: 140px;
    height: 25px;
    outline: none;
    background-color: rgba(26,98,185,1);
    color: rgba(255,255,255,0.8);
    border-width: 0px;
    border-style: dotted;
    border-color: rgba(255,255,255,0.5);
}

.submitenviarnuevo{
    opacity: 0;
    visibility: hidden;    
    margin-top: 17px;   
}

.btnenviarnuevo{
    margin-top: 17px;
    float: right;
    width: 30px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-size: 30px;
    color: rgba(255,255,255,0.8);
    transition: ease-in-out all 0.3s; 
    margin-bottom: 10px;
}

#btnescale{
    float: left;
}

.btnenviarnuevo:hover{
    cursor: pointer;
    color: var(--color3);
}

.contenedorfrmeditar{ 
    position: relative;
    background-color: rgba(26,98,185,0.1);
    margin: 10px auto;
    width: calc(100% - 30px);
    height: auto;
    color: var(--color1);
    font-family: sans-serif;
}

.contenedorfrmeditar2{ 
    background-color: transparent;
    margin: 10px auto;
    width: calc(100% - 30px);
    height: auto;
    color: var(--color1);
    font-family: sans-serif;
}

.contenedorseccionexamsemanal{
    background-color: transparent;
    margin: 0px auto;
    width: calc(100% - 20px);
    height: calc(100% - 20px);
    color: var(--color1);
    font-family: sans-serif;
}

.encabezadofrmeditar{
    background-color: var(--color1);
    color: white;
    width: 100%;
    height: 35px;
    display: flex;
    font-weight: bold;
    font-size: 14px;
}

.encabezadofrmeditaricono{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    width: 30px;
    height: 35px;
    font-size: 16px;
}

.encabezadofrmeditartitulo{
    display: flex;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    height: 35px;
    width: calc(100% - 60px);
    padding-left: 5px;
}

.encabezadofrmeditartitulo2{
    font-size: 13px;
    display: flex;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    height: 35px;
    width: calc(100% - 90px);
    padding-left: 5px;
}

.encabezadofrmeditartitulo3{
    display: flex;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    height: 35px;
    width: calc(100% - 30px);
    padding-left: 5px;
}

.encabezadofrmeditarvacante{
    margin-top: 2px;
    background-color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    width: 26px;
    height: 26px;
    font-size: 15px;
    border-radius: 50%;
    transition: ease-in-out all 0.5s;
    color: var(--color1);
}

.encabezadofrmeditarvacante:hover{
    background-color: var(--color3);
    cursor: pointer;
    color: white;
    box-shadow: 0 0 5px rgba(255,255,255,0.5)
}

#btnsecciongenerarexcel{
    margin-top: 2px;
    margin-left: 0px;
    margin-right: 4px;
    background-color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    width: 26px;
    height: 26px;
    font-size: 18px;
    border-radius: 50%;
    transition: ease-in-out all 0.5s;
    color: var(--color1);
}

#btnsecciongenerarexcel:hover{    
    cursor: pointer;
    color: white;
    background-color: rgb(33,115,70);
    box-shadow: 0 0 5px rgba(255,255,255,0.5)
}

#btnsecciongenerarexcelpagos{
    margin-top: 2px;
    margin-left: 0px;
    margin-right: 4px;
    background-color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    width: 26px;
    height: 26px;
    font-size: 15px;
    border-radius: 50%;
    transition: ease-in-out all 0.5s;
    color: var(--color1);
}

#btnsecciongenerarexcelpagos:hover{    
    cursor: pointer;
    color: white;
    background-color: rgb(33,115,70);
    box-shadow: 0 0 5px rgba(255,255,255,0.5)
}

#btnexamsemanalareas{
    margin-top: 2px;
    margin-left: 0px;
    margin-right: 4px;
    background-color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    width: 26px;
    height: 26px;
    font-size: 15px;
    border-radius: 50%;
    transition: ease-in-out all 0.5s;
    color: var(--color1);
}

#btnexamsemanalareas:hover{    
    cursor: pointer;
    color: white;
    background-color: rgb(52, 152, 219);
    box-shadow: 0 0 5px rgba(255,255,255,0.5)
}

#btnsecciongenerarexcel2{
    margin-top: 4px;
    margin-left: 4px;
    background-color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    width: 22px;
    height: 22px;
    font-size: 15px;
    border-radius: 50%;
    transition: ease-in-out all 0.5s;
    color: var(--color1);
}

#btnsecciongenerarexcel2:hover{    
    cursor: pointer;
    color: white;
    background-color: rgb(33,115,70);
    box-shadow: 0 0 5px rgba(255,255,255,0.5)
}

.contenedorfrmeditartxt{
    padding-top: 10px;    
    display: flex;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    margin: auto;
    width: calc(100% - 30px);
    height: 50px; 
}

.contenedorfrmeditartxt2{
    padding-top: 10px;
    display: flex;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    margin: auto;
    width: calc(100% - 30px);
    height: 50px;
}

.contenedorfrmeditartxtauxiliarasistencia{
    padding-top: 10px;
    display: flex;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    margin: auto;
    width: calc(100% - 20px);
    height: 30px;
}

#contenedorfrmeditartxttelef{
    margin-top: 10px;
}

#contenedorfrmeditartxtdoc{    
    height: 50px;
}

#contenedorfrmeditartxtpaistelef{    
    height: 50px;
}

#contenedorfrmeditartxtsubmit{
    display: block;
    width: 100%;
    padding-top: 0px;
    height: 50px;
    margin-top: 0px;
}

.labeltxteditar{
    display: flex;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    width: 100%;
    height: 15px;
    font-size: 13px;
    font-weight: bold;
}

.labeltxteditar2{
    display: flex;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    width: 100%;
    height: 20px;
    font-size: 13px;
    font-weight: bold;
}

.txteditar{
    outline: none;
    border-width: 0px 0px 1px 0px;
    border-style: dotted;
    border-color: var(--color1);
    max-width: 500px;
    width: 100%;
    height: 25px;
    padding-left: 3px;
    background-color: transparent;
    font-size: 13px;
    color: var(--color1);
    font-style: italic;
    font-family: sans-serif;
    padding-top: 10px;
}

.txteditar::placeholder{
    color: rgba(26,98,185,0.5);
}

.nopointersevent{
    pointer-events: none;
}

.txteditarnoselect{
    pointer-events: none;
    padding-top: 0px;
    margin-top: 5px;
    background-color: var(--color1);
    color: white;    
}

.txteditarnonormal{    
    padding-top: 0px;
    margin-top: 5px;
    background-color: var(--color1);
    color: white;    
}

.txteditarnoselectlast{
    max-width: 170px;
    margin-bottom: 10px;
}

.mostrarpasswordusuario{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    height: 25px;
    width: 30px;
    background-color: var(--color1);
    color: white;
    transition: ease-in-out all 0.3s;
    cursor: pointer;
    font-size: 18px;
    margin-top: -5px;
}

.mostrarpasswordusuario:hover{
    color: var(--color3);
}

#txtnumdocpadreeditar{
    width: calc(100% - 150px);
    margin-left: 10px;
    max-width: 100px;
}

#txtnumdocadministrativoeditar{
    width: calc(100% - 150px);
    margin-left: 10px;
    max-width: 100px;
}

#txtnumdocdocenteeditar{
    width: calc(100% - 150px);
    margin-left: 10px;
    max-width: 100px;
}

#txtnumdocestudianteeditar{
    width: calc(100% - 150px);
    margin-left: 10px;
    max-width: 100px;
}

#txttelefpadreditar{
    width: 100px;
}

#txttelefadministrativoditar{
    width: 100px;
}

#txttelefdocenteeditar{
    width: 100px;
}

#txttelefdocenteditar{
    width: 100px;
}

.span1{
    padding: 5px;
    font-family: sans-serif;
    font-size: 14px;
    border-width: 0px;
    outline: none;
    background-color: var(--color1);
    height: 25px;
    width: auto;
    color: rgba(255,255,255,0.8);
    border-radius: 3px;
}

.span2{
    margin-top: 15px;
    width: calc(100% - 20px);
    margin-left: 10px;
    max-width: 400px;
    font-family: sans-serif;
    font-size: 14px;
    border-width: 0px;
    outline: none;
    height: 25px;
    width: auto;
    color: var(--color1);
    border-radius: 3px;
    font-style: italic;
}

.selecteditar{
    border-width: 0px;
    outline: none;
    background-color: var(--color1);
    height: 25px;
    width: 140px;
    color: rgba(255,255,255,0.8);
}

.selecteditar4{
    border-width: 0px;
    outline: none;
    background-color: var(--color1);
    height: 25px;
    width: 230px;
    color: rgba(255,255,255,0.8);
}

.selectnoselected{
    pointer-events: none;
}

#cargoadministrativoeditarid{
    width: 100%;
    max-width: 300px;
}

.selecteditar5{
    border-width: 0px;
    outline: none;
    background-color: var(--color1);
    height: 25px;
    width: 105px;
    background-color: transparent;
    transition: ease-in-out all 0.3s;
    color: rgba(255,255,255,0.8);
}

.selecteditar5:hover{
    cursor: pointer;
    background-color: rgba(0,0,0,0.2);
}

.selecteditar2{
    border-width: 0px;
    outline: none;
    background-color: var(--color1);
    height: 25px;
    max-width: 500px;
    width: 100%;
    color: rgba(255,255,255,0.8);
}

.selecteditar3{
    border-width: 0px;
    outline: none;
    background-color: var(--color1);
    height: 25px;
    width: calc(100% - 25px);
    max-width: 475px;
    color: rgba(255,255,255,0.8);
}

.selecteditar4{
    border-width: 0px;
    outline: none;
    background-color: var(--color1);
    height: 25px;
    width: calc(100% - 25px);
    max-width: 150px;
    color: rgba(255,255,255,0.8);
}

.selecteditarseccion{
    margin-left: 10px;
    border-width: 0px;
    outline: none;
    background-color: var(--color1);
    height: 25px;
    width: 140px;
    color: rgba(255,255,255,0.8);
}

#iditemsistemaestudiantebtnimprimircalificaiones{
    font-size: 25px;
    color: rgba(255,255,255,0.8);
    margin-right: 5px;
    border-radius: 50%;
    margin-top: 0px;
    font-size: 15px;
    float: right;
    padding: 1px;
    height: 30px;
    width: 30px;
    background-color: rgba(0,0,0,0.2);
    display: flex;
    justify-content: center;
    align-items: center;
    transition: ease-in-out all 0.3s
}

#iditemsistemaestudiantebtnimprimircalificaiones:hover{
    cursor: pointer;
    background-color: white;
    color: rgb(194,176,218);
}

#selectaniomatriculaestudiante{
    margin-top: 2.5px;
    font-size: 15px;
    float: right;
    padding-left: 2px;
    height: 25px;
    width: 70px;
    background-color: rgba(0,0,0,0.2);
}

#selectpaispadreeditardni{
    pointer-events: none;
    opacity: 0.6;
}

#selectpaisadministrativoeditardni{
    pointer-events: none;
    opacity: 0.6;
}

#selectpaisdocenteeditardni{
    pointer-events: none;
    opacity: 0.6;
}

#selectpaisestudianteeditardni{
    pointer-events: none;
    opacity: 0.6;
}

.submitenviareditar{
    visibility: hidden;
    opacity: 0;
    height: 0px;
    width: 0px;
}

.btnenviareditar{
    float: right;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    width: 50px;
    height: 50px;
    font-size: 35px;
    transition: ease-in-out all 0.3s;
}

.btnenviareditar:hover{
    cursor: pointer;
    color: var(--color3);
}

.optioneditar2{
    background-color: var(--color2);
    color: var(--color1);
}

#btneditarsecciontutor{
    float: right;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    width: 25px;
    height: 25px;
    font-size: 20px;
    transition: ease-in-out all 0.3s;
}

#btneditarseccionexcel{
    float: right;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    width: 25px;
    height: 25px;
    font-size: 20px;
    transition: ease-in-out all 0.3s;
}

#btneditarseccionexcel:hover{
    color: rgb(33,115,70);
}

#btneditarseccionauxiliar{
    float: right;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    width: 25px;
    height: 25px;
    font-size: 20px;
    transition: ease-in-out all 0.3s;
}

.contenedorregistroseccionestudiantes{
    margin-top: 15px;
    width: 100%;
    height: auto;
    overflow-x: scroll;
}

.contenedorseccionexamsemanaldatos{
    padding-top: 5px;
    border-color: var(--color1);
    border-width: 0px 2px 2px 2px;
    border-style: solid;
    margin-top: 0px;
    width: 100%;
    height: calc(100% - 20px);
    background-color: white;
    overflow-y: scroll;
}

.contenedorregistroasistenciaauxiliar{
    margin-top: 0px;
    width: 100%;
    height: auto;
    overflow-x: scroll;
}

.contenedorestudiantesacargo{
    width: calc(100% - 30px);    
}

.cuerpofrmeditar{
    padding-bottom: 1px;
}

#bodyCV{
    overflow: scroll;
    width: 100%;
    height: 100%;
    background-color: rgb(51,63,80);
}

#hojaA4{
    left: calc(50% - 375px);
    position: absolute;
    margin: 20px auto;
    background-color: white;
    width: 750px;
    height: 1080px;
}

#contenedorbtnimp{    
    display: flex;
    flex-direction:row;
    flex-wrap:wrap;
    justify-content:center;
    position: fixed;
    width: 80px;
    height: 100%;
}

#btnimp{
    color: white;
    background-color: var(--color1);
    transition:all 0.3s ease-in-out;
    margin: auto;
    width: 70px;
    height: 70px;
    opacity: 0.8;
}

#btnimp:hover{ 
    cursor: pointer;
    opacity: 1;
}

.cumpletop{
    width: 100%;
    height: 50px;
    float: right;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.cumplebtn{
    font-size: 18px;
    margin: 5px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: var(--color1);
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    transition: ease-in-out all 0.3s;
}

.cumplebtn:hover{
    cursor: pointer;
    box-shadow: 0 0 5px rgba(0,0,0,0.7); 
    background-color: var(--color3);
}

.cumplebottom{    
    margin-top: 50px;
    width: 100%;
    height: calc(100% - 50px);
}

.cumplepantalla{
    overflow: hidden;
    border-radius: 5px;
    border-color: var(--color1);
    border-style: solid;
    border-width: 2px;
    margin-left: 10px;
    width: calc(100% - 20px);
    height: calc(100% - 10px);
}

.cumplepantallatop{
    background-color: var(--color1);
    width: 100%;
    height: 35px;
}

.cumplepantallatop1{
    color: white;
    float: left;
    width: 50%;
    height: 35px;
}

.cumplepantallatop1icon{
    font-size: 18px;
    float: left;
    width: 35px;
    height: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.cumplepantallatop1texto{
    font-family: sans-serif;
    font-size: 15px;
    padding-top: 11px;
    float: left;
    width: calc(100% - 35px);
    height: 35px;    
}

.cumplepantallatop2{
    display: flex;
    justify-content:  flex-end;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    float: left;
    width: 50%;
    height: 35px;
}

.cumplepantallatop2left{
    font-family: sans-serif;
    font-size: 13px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    color: white;
    margin-right: 5px;
    background-color: rgba(0,0,0,0.2);
    height: 28px;
    width: 170px;
}

.cumplepantallatop2right{
    font-family: sans-serif;
    font-size: 13px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    color: white;
    margin-right: 5px;
    background-color: rgba(0,0,0,0.2);
    height: 28px;
    width: 170px;
}

.cumplepantallatop2texto{
    padding-right: 5px;
    display: flex;
    justify-content:  flex-end;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    height: 28px;
    width: 35px;    
}

.cumplepantallatop2date{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    height: 25px;
    width: 135px;
}

.inputcumplepantallatop2date{
    padding-left: 2px;
    outline: none;
    border-width: 0px;
    color: var(--color1);
    height: 20px;
    width: 131px;
}

.cumplepantallatop2btn{
    margin-right: 5px;
    border-radius: 50%;
    color: var(--color1);
    background-color: white;
    font-size: 15px;
    width: 25px;
    height: 25px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    transition: ease-in-out all 0.3s;
}

.cumplepantallatop2btn:hover{  
    cursor: pointer;
    box-shadow: 0 0 5px rgba(255,255,255,0.7); 
    color: white;
    background-color: var(--color3);
}

.cumplepantallabottom{
    overflow-y: scroll;
    width: 100%;
    height: calc(100% - 35px);
}

.bodyimprimir2{
    width: 100%;
    height: auto;
    text-align: center;
    background-color: rgb(74,83,136);
    overflow: scroll;
}

.bodyimprimir{
    height: auto;
    text-align: center;
    background-color: rgb(41,50,63);
    overflow:  auto;
}

.contenedorbtnimp{
    top: 0px;
    right: 0px;
    left: auto;
    width: 40px;
    height: 100%;
    position: fixed;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap; 
    z-index: 6;
    gap: 10px;
}

.contenedorbtnimpauto{
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap; 
    gap: 10px;
}

.btnimp{
    margin: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap; 
    height: 35px;
    width: 35px;
    color: white;
    font-size: 20px;
    border-radius: 50%;
    background-color: var(--color3);
    box-shadow: 0 0 7px rgba(255,255,255,0.7);
    transition: ease-in-out all 0.3s;
}

.btnimp:hover{
    background-color: var(--color1);
    cursor: pointer;
}

.hojaimpA4{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap; 
    position: relative;
    margin: 10px auto;
    background-color: white;
    width: 100%;
    height: auto;
    min-height: 792px;
    max-width: 612px;
}

.hojaimp2{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap; 
    position: relative;
    margin: 10px auto;
    background-color: white;
    width: 100%;
    height: calc(100% - 25px);
    max-width: 1434px;
}

.hojaimp2left{
    box-sizing: border-box;
    overflow: hidden;
    border-width: 1px;
    border-style: solid;
    border-color: rgb(41,50,63);
    width: 50%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-direction: row;
    flex-wrap: wrap;
}

.hojaimp2right{
    overflow: hidden;
    border-width: 1px 1px 1px 0px;
    border-style: solid;
    border-color: rgb(41,50,63);
    width: 50%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-direction: row;
    flex-wrap: wrap;
}

.hojaimp2top{   
    overflow: hidden;
    padding-top: 15px;
    padding-left: 70px;
    color: rgb(26,98,185);
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    font-family: 'freescpt';
    font-size: 28px;
    position: relative;
    margin: 0px;
    width: 100%;
    height: 90px;
    background-color: rgb(241,196,15);
}

.hojaimp2topimgpng{
    transform: rotate(180deg);
    top: 30px;
    left: 0px;
    position: absolute;
    height: calc(100% - 10px);
    width: 100%;
}

.hojaimp2topimglogo{
    filter: drop-shadow(0 3px 3px rgba(0, 0, 0, 0.5));
    position: absolute;
    top: 7.5px;
    left: 10px;
    height: 60px;
    width: auto;
    z-index: 5;
}

.hojaimp2centerleft{
    position: relative;    
    padding:  5px;    
    width: 100%;
    height: calc(100% - 180px);
}

.hojaimp2centerright{
    position: relative;
    gap:5px;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-direction: row;
    flex-wrap: wrap;
    background-color: transparent;
    padding:  5px;    
    width: 100%;
    height: 100%;
}

.hojaimp2centerlogocontenedor{
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    justify-content: center;
    align-items:center;
    opacity: 0.1;
}

.hojaimp2centerlogo{
    filter: drop-shadow(0 3px 3px rgba(0, 0, 0, 0.5));
    margin: auto;
    height: 180px;
    width: auto;
}

.hojaimp2centercontenido{
    width: 100%;
    height: auto;
    padding-bottom: 10px;
}

.hojaimp2centercontenidodatos{
    width: 100%;
    height: auto;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;    
}

.hojaimp2centercontenidoobservaciones{
    margin-top: 10px;
    padding-left: 10px;
    padding-right: 10px;
    width: 100%;
    height: auto;
    display: grid;
    gap: 15px;
    grid-auto-rows: 120px;
    grid-template-columns: repeat(auto-fill,minmax(min(100%,14rem),1fr));
}

.hojaimp2centerdatosseccion{    
    font-family: sans-serif;
    font-size: 12px;
    color: rgb(74, 83 ,136);
    width: 100%;
    height: 25px;
}

.hojaimp2centercontenidonotas{
    height: 100%;
    transform: scale(.85);
    margin-top: -50px;
    padding-top: 20px;
    padding-bottom: 10px;
    width: 100%;
    position: relative;
}

.hojaimp2centerdatossecciontitulocenter{   
    top: 5;
    left: 0;
    position: absolute;
    font-weight: bold;
    text-align: center;
    overflow: hidden;
    font-family: sans-serif;
    font-size: 12px;
    color: rgb(74, 83 ,136);
    width: 100%;
    height: 25px; 
}

.docenteaulavirtualpantallaencabezadotitulo80{
    overflow: hidden;    
    float: left;
    height: 25px;
    width: 100%;
    display: flex;
    justify-content: center;
}

.contenedorreporte{
    cursor:  default;
    margin: auto;
    margin-top: 10px;
    box-shadow: 0 0 4px rgba(0,0,0,0.3);
    border-radius: 5px;
    padding: 5px;
    width: 100%;
    min-width: 320px;
    max-width: 500px;
    height: auto;
    min-height: 300px;  
    color: rgba(74,83,136,0.8);
    font-family: sans-serif;
    font-size: 13px;
}

.contenedorobservaciones{
    cursor:  default;
    margin: auto;
    margin-top: 10px;
    box-shadow: 0 0 4px rgba(0,0,0,0.3);
    border-radius: 5px;
    padding: 5px;
    width: 100%;
    min-width: 320px;
    max-width: 500px;
    height: auto;  
    color: rgba(74,83,136,0.8);
    font-family: sans-serif;
    font-size: 13px;
}

.contenedorobservaciones2{
    cursor:  default;
    margin: auto;
    box-shadow: 0 0 3px rgba(0,0,0,0.3);
    border-radius: 5px;
    padding: 5px;
    width: 100%;
    height: auto;  
    color: rgba(74,83,136,0.8);
    font-family: sans-serif;
    font-size: 13px;
}

.contenedorobservacionestop{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    height: 35px;
    font-family: sans-serif;
    font-size: 13px;
    font-weight: bold;
    color: rgb(74,83,136);
}

.contenedorobservacionestop2{    
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    height: 20px;
    font-family: sans-serif;
    font-size: 12px;
    font-weight: bold;
    color: rgb(74,83,136);
    border-width: 0px 0px 1px 0px;
    border-style: solid;
    border-color: rgb(74,83,136);
}

.contenedorobservacionestopleft{
    padding-left: 5px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    height: 100%;
    width: calc(100% - 40px);
}

.contenedorobservacionestopright{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    height: 100%;
    width: 40px;
}

.observacionesiconsave{
    width: 30px;
    height: 30px;
    font-size: 20px;
    transition: ease-in-out all 0.3s;
}

.observacionesiconsave:hover{
    cursor: pointer;
    color: rgb(22, 160, 133);
}

.contenedorobservacionesbottom{    
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    height: auto;
    font-family: sans-serif;
    font-size: 13px;
    font-weight: bold;
    color: rgb(74,83,136);
    padding: 5px;
}

.contenedorobservacionesbottom2{    
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-direction: row;
    flex-wrap: wrap;
    height: 90px;
    font-family: sans-serif;
    font-size: 10px;
    font-style: italic;
    color: rgb(74,83,136);
    padding: 10px 5px;
    text-align: justify;
}

.resolucionnuevaitemcontenedor{
    position: relative;
    width: 100%;
    height: 100px;
    overflow: hidden;
    border-radius: 3px;
    border-width: 1px;
    border-style: solid;
    border-color: rgb(74,83,136);
}

.textareacomunicadoparrafo{
    border-width: 0px;
    color: rgb(74,83,136);
    font-size: 12px;
    text-align: justify;    
    outline: none;
    resize: none;
    width: 100%;
    height: calc(100% - 15px);
    padding: 5px;
    overflow-y: scroll; 
    font-style: italic;
    font-family: sans-serif;
}

.textareacomunicadoparrafo::placeholder{
    color: rgba(74,83,136,0.5);    
}

.textareacomunicadoparrafocontador{
    margin-top: -5px;
    text-align: right;
    color: rgba(74,83,136,0.5);
    font-size: 10px;
    width: 100%;
    height: 15px;
    padding: 2px 5px;
    font-style: italic;
    font-family: sans-serif;
}

.coverobservacion{
    pointer-events: none;
    opacity: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-family: sans-serif;
    font-size: 14px;
    font-weight: normal;
    position: absolute;
    top: 0;
    left: 0;
    color: white;
    background-color: rgba(22, 160, 133,0.8);
    width: 100%;
    height: 100%;
    transition: ease-in-out all 0.5s;
}

.coverobservacionicon{
    font-size: 25px;
    margin-right: 5px;
}

.coverobservacioncerrar{
    position: absolute;
    top: 5px;
    right: 5px;
    width: 30px;
    height: 30px;
    font-size: 15px;
    transition: ease-in-out all 0.3s;
}

.coverobservacioncerrar:hover{
    cursor: pointer;
    color: rgb(74,83,136);
}

.contenedorreporteencabezado{
    font-weight: bold;
    width: 100%;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.contenedorreporteencabezadocurso{
    height: auto;
    min-height: 30px;
    padding: 5px;
    width: calc(100% - 240px);
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.contenedorreportecasillabold{
    font-weight: bold;
    width: 40px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.contenedorreportecasilla{
    width: 40px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.contenedorreportecurso{  
    background-color: rgba(194,176,218,0.1);
    border-color: rgba(74,83,136,0.8);
    border-width: 1px 0px 0px 0px;
    border-style: solid;
    overflow: hidden;
    height: auto;
    width: 100%;
    min-height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.contenedorreporteconducta{  
    background-color: rgba(22,160,133,0.1);
    border-color: rgba(74,83,136,0.8);
    border-width: 1px 0px 0px 0px;
    border-style: solid;
    overflow: hidden;
    height: auto;
    width: 100%;
    min-height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.contenedorreporteordenmerito{  
    background-color: rgba(52,152,219,0.1);
    border-color: rgba(74,83,136,0.8);
    border-width: 1px 0px 0px 0px;
    border-style: solid;
    overflow: hidden;
    height: auto;
    width: 100%;
    min-height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.contenedorreporteoption{
    font-size: 15px;
    transition: ease-in-out all 0.05s;
    cursor: pointer;
}

.contenedorreporteoption:hover{
    font-size: 20px;
}

.contenedorreportecursoregistro{
    background-color: white;
    overflow: hidden;
    max-height: 120px;
    height: auto;
    width: 100%;
    display: none;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.contenedorreportecursoregistro90px{
    background-color: white;
    overflow: hidden;
    max-height: 90px;
    height: auto;
    width: 100%;
    display: none;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.contenedorreportecursocurso{
    font-weight: bold;
    font-size: 12.5px;
    height: auto;
    min-height: 30px;
    padding: 5px;
    width: calc(100% - 240px);
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.contenedorreportecursocursoright{
    font-weight: bold;
    font-size: 12.5px;
    height: auto;
    min-height: 30px;
    padding: 5px;
    padding-right: 10px;
    width: calc(100% - 240px);
    display: flex;
    justify-content: flex-end;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.tabla4{  
    margin: auto;
    margin-top: 5px;
    box-sizing: border-box;    
    position: relative;
    border-radius: 5px;
    overflow: hidden;
    border-collapse: collapse;
    font-family: sans-serif;
    font-size: 12px;
    color: rgba(74,83,136,0.8);
    border-style: solid;
    border-width: 8px;  
    border-color: transparent;
    box-shadow: 0 0 4px rgba(0,0,0,0.3);
}

.tabla4trh{
    height: 20px;
}

.tabla4th{
    padding: 0px 5px;
    text-align: center;
}

.tabla4trb{
    font-size: 12px;
    height: auto;
    height: 20px;
    border-style: solid;
    border-width: 1px;
    border-color: rgba(74,83,136,0.5);
    transition: ease-in-out all 0.3s;
}

.tabla4trb:hover{
   cursor:  default;
   background-color: rgba(74,83,136,0.04);
}

.tabla4tdright{
    padding: 5px 10px;
    text-align: right;
}

.tabla4tdcenterbold{
    padding: 5px 10px;
    text-align: center;
    font-weight: bold;
}

.tabla4tdcenter{
    padding: 5px 10px;
    text-align: center;
}

.tabla4tdjustify{
    padding: 5px 10px;
    text-align: justify;
}

.tabla4left{
    padding: 5px 10px;
    text-align: left;
}

.th4titulo{
    max-width: 400px;
}

.th4descripcion{
    max-width: 400px;
}

.hojaimp2centercontenidofirma{
    margin-top: 10px;
    height: 90px;
    width: auto;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    padding: 10px;
}

.hojaimp2centercontenidofirma2{
    margin-top: -20px;
    height: 55px;
    width: auto;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    padding: 10px;
}

.hojaimp2centerfirma{
    height: 100%;
    width: auto;
}

.hojaimp2bottom{
    padding-right: 20px;
    padding-bottom: 10px;
    color: rgba(255,255,255,0.9);
    display: flex;
    justify-content: flex-end;;
    align-items: flex-end;
    font-family: 'freescpt';
    font-size: 25px;
    position: relative;
    margin: 0px;
    background-color: rgb(26,98,185);
    width: 100%;
    height: 90px;
}

.hojaimp2bottomimgpng{
    bottom: 30px;
    left: 0px;
    position: absolute;
    height: calc(100% - 10px);
    width: 100%;
    z-index: 5;
}

.hojaimp{   
    padding-bottom: 10px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    margin: 10px auto;
    background-color: white;
    width: 717px;
    height: auto;
}

.contenedortarjeta{
    position: relative;
    margin-top: 19.2px;
    margin-left: 11px;
    width: 342px;
    height: 190px;    
}

.tarjetafondo{
    z-index: 2;
    width: 100%;
    height: 100%;
}

.tarjetacumple{
    font-size: 17px;
    font-style: italic;
    left: 80px;
    top: 27px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    width: 50px;
    height: 50px;
    z-index: 3;
    position: absolute;
    color: white;
    font-family: sans-serif;
    font-weight: bold;
}

.tarjetanombre{
    font-size: 15px;
    left: 137px;
    top: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    width: 190px;
    height: 50px;
    z-index: 3;
    position: absolute;
    color: var(--color1);
    font-family: sans-serif;
    font-weight: bold;
    font-style: italic;
}

.contendorseccioncursos{
    width: 100%;
    min-height: 100px;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-direction: row;
    flex-wrap: wrap;
    overflow-x: scroll;
}

.divseccioncurso{
    box-shadow: 0 0 8px rgba(0,0,0,0.5);
    padding-bottom: 3px;
    border-radius: 5px;
    margin: 10px;
    height: auto;
    min-width: 300px;
    width: 300px;
    background-color: var(--color1);
    text-align: center;
}

.divseccioncursotop{
    font-family: sans-serif;
    color: white;
    font-size: 13px;
    margin: auto;
    height: 35px;
    width: 294px;
}

.divseccioncursotopleft{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    float: left;
    height: 35px;
    width: 25px;
}

.numseccioncurso{
    font-weight: bold;
    text-align: center;
    margin: auto;
    background-color: white;
    color: var(--color1);
    border-radius: 50%;
    height: 22px;
    width: 22px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.divseccioncursotopcenter{    
    font-weight: bold;
    text-align: left;
    padding-left: 5px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    float: left;
    height: 35px;
    width: 244px;
}

.divseccioncursotopright{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    float: left;
    height: 35px;
    width: 25px;
    font-size: 17px;
    transition: ease-in-out all 0.3s;
}

.divseccioncursotopright:hover{
    cursor: pointer;
    color: var(--color3);
}

.divseccioncursocenter{
    padding-top: 5px;
    overflow: none;
    margin: auto;
    background-color: white;
    height: auto;
    width: 294px; 
}

.divseccioncursoleft{
    float: left;
    height: 50px;
    width: 264px;    
}

.divseccioncursolabeldocente{
    padding-left: 5px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    width: 100%;
    height: 20px;
    font-size: 13px;
    font-weight: bold;
}

.divseccioncursoselectdocente{
    padding-left: 5px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    width: 100%;
    height: 30px;
    font-size: 13px;
}

.selectseccioncursodocente{
    font-size: 12px;
    color: rgba(45,54,76,1);
    height: 20px;
    width: calc(100% - 10px);
    outline: none;
    border-width: 1px;
    border-style: solid;
    border-color: var(--color1);
    background-color: rgba(26,98,185,0.5);
}

.divseccioncursoright{
    margin-top: 20px;
    float: left;
    height: 30px;
    width: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.divseccioncursobtndocente{
    width: 25px;
    height: 25px;
    background-color: var(--color1);
    color: white;
    border-radius: 4px;
    transition: ease-in-out all 0.3s;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-size: 21px;
}

.divseccioncursobtndocente:hover{
    background-color: var(--color3);
    cursor: pointer
}

.divseccioncursobottom{
    padding-bottom: 5px;
    height: auto;
    width: 294px;
    margin-left: 3px;
    background-color: white;
    border-radius: 0px 0px 3px 3px;
}

.divseccioncursolabelhorario{
    padding-top: 10px;
    padding-left: 5px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    width: 100%;
    height: 25px;
    font-size: 13px;
    font-weight: bold;
}

.divbtnagregarcursohorario{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    background-color: var(--color1);
    margin-left: auto;
    margin-right: 2.5px;
    height: 25px;
    width: 25px;
    font-size: 18px;
    border-radius: 3px;
    color: white;
    transition: ease-in-out all 0.3s;
}

.divbtnagregarcursohorario:hover{
    background-color: var(--color3);
    cursor: pointer
}

.contendorseccionhorario{
    display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-direction: row;
    flex-wrap: wrap;
    padding: 0px 5px 5px 0px;
    margin-top: 20px;
    width: 100%;
    height: auto; 
}

#contendorestudianteseccionhorarioid{
    margin-top: 0px;
    padding: 0px;
    width: auto;
}

.contendorauntocuentabancaria{
    display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-direction: row;
    flex-wrap: wrap;    
    width: auto;
    height: auto;
}

.seccionhorariodia{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    background-color: rgb(74, 83 ,136);
    margin: 3px 0px 0px 3px;
    border-radius: 5px;
    width: 150px;
    height: auto;
    font-family: sans-serif;
    padding: 0px 5px 5px 5px;
}

.seccionhorariodiaest{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    background-color: white;;   
    width: 200px;
    height: auto;
    font-family: sans-serif;
    border-radius: 5px;
    box-shadow: 0 0 4px rgba(0,0,0,0.6);
    margin: 7px;
    overflow: hidden;
}

.bancoestudiantepago{
    font-size: 17px;
    position: relative;    
    background-color: white;;   
    width: 240px;
    height: 80px;
    font-family: sans-serif;
    border-radius: 5px;
    box-shadow: 0 0 4px rgba(0,0,0,0.6);
    margin: 7px;
    overflow: hidden;
}

.bancoconceptopago{    
    font-family: sans-serif;
    position: relative;
    overflow: hidden;
    width: 150px;
    height: auto;    
    border-radius: 5px;
    box-shadow: 0 0 4px rgba(0,0,0,0.6);
    margin: 7px;
}

.bancoconceptopagocirculopagado{
    font-weight: bold;
    box-shadow: 0 0 3px rgba(0,0,0,0.6);
    border-radius: 50%;
    width: 80px;
    height: 80px;
    margin-left: 35px;
    margin-top: 40px;
    position: absolute;
    background-color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-size: 17px;
    color: rgb(22,160,133);
}

.bancoconceptopagocirculopendiente{
    font-weight: bold;
    box-shadow: 0 0 3px rgba(0,0,0,0.6);
    border-radius: 50%;
    width: 80px;
    height: 80px;
    margin-left: 35px;
    margin-top: 40px;
    position: absolute;
    background-color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-size: 17px;
    color: rgb(241,196,15);
}

.bancoconceptopagocirculovencido{
    font-weight: bold;
    box-shadow: 0 0 3px rgba(0,0,0,0.6);
    border-radius: 50%;
    width: 80px;
    height: 80px;
    margin-left: 35px;
    margin-top: 40px;
    position: absolute;
    background-color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-size: 17px;
    color: rgb(240,98,146);
}

.contenedorpagonombre{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    color: white;
    font-size: 17px;
    width: 100%;
    height: 40px;
}

.bancoconceptopagotoppendiente{    
    padding: 5px;
    background-color: rgb(241,196,15);
    width: 100%;
    height: 80px;    
}

.bancoconceptopagotopvencido{    
    padding: 5px;
    background-color: rgb(240,98,146);
    width: 100%;
    height: 80px;    
}


.bancoconceptopagotoppagado{    
    padding: 5px;
    background-color: rgb(22,160,133);
    width: 100%;
    height: 80px;    
}

.contenedorestudiantepagopagado{ 
    font-size: 15px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    margin-top: 35px;
    height: 35px;
    width: 100%;
    color: rgb(22,160,133);
}

.contenedorestudiantepagopendiente{ 
    font-size: 15px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    margin-top: 35px;
    height: 35px;
    width: 100%;
    color: rgb(241,196,15);
}

.contenedorestudiantepagovencido{ 
    font-size: 15px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    margin-top: 35px;
    height: 35px;
    width: 100%;
    color: rgb(240,98,146);
}

.bancoestudiantepagoleft{
    float: left;
    height: 100%;
    width: 40px;
}

#bancoestudiantepagoleftbn{
    background-color: rgb(230,33,43);
}

#bancoestudiantepagoleftbbva{
    background-color: rgb(49,154,175);
}

#bancoestudiantepagoleftbcp{
    background-color: rgb(255,120,0);
}

.bancoestudiantepagoright{
    float: left;
    height: 100%;
    width: calc(100% - 40px);
    color: rgb(74,83,136);
}

#bancoestudiantepagorightbbva{
    color: rgb(17,57,109);
}

#bancoestudiantepagorightbcp{
    color: rgb(0,73,140);
}

.bancoestudiantepagorighttop{
    font-style: italic;
    font-weight: bold;
    padding-top: 15px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-family: sans-serif;
    font-size: 14px;
    margin-left: 30px;
    height: 50%;
    width: calc(100% - 30px);
}

.bancoestudiantepagorightbottom{
    padding-bottom: 15px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-family: sans-serif;
    font-size: 13px;
    margin-left: 30px;
    height: 50%;
    width: calc(100% - 30px);
}

.bancoestudiantepagocirculo{
    float: left;
    position: absolute;
    background-color: white;
    margin-left:10px;  
    margin-top: 10px;
    overflow: hidden;
    position: absolute;
    border-radius: 50%;
    box-shadow: 0 0 4px rgba(0,0,0,0.6);
    width: 60px;
    height: 60px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.periodopromedio1{
    background-color:rgb(231,86,72);
    box-shadow: 0 0 3px rgba(255,255,255,0.6);
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    border-radius: 50%;
    font-family: sans-serif;
    font-weight: bold;
    font-size: 12px;
    width: 18px;
    height: 18px;
}

.anualpromedio1{
    background-color:white;
    box-shadow: 0 0 3px rgba(231,86,72,0.6);
    color: rgb(231,86,72);
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    border-radius: 50%;
    font-family: sans-serif;
    font-weight: bold;
    font-size: 12px;
    width: 18px;
    height: 18px;
}

.periodopromedio2{
    background-color:rgb(241, 196, 15);
    box-shadow: 0 0 3px rgba(255,255,255,0.6);
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    border-radius: 50%;
    font-family: sans-serif;
    font-weight: bold;
    font-size: 12px;
    width: 18px;
    height: 18px;
}

.anualpromedio2{
    background-color:white;
    box-shadow: 0 0 3px rgba(241, 196, 15,0.6);
    color: rgb(241, 196, 15);
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    border-radius: 50%;
    font-family: sans-serif;
    font-weight: bold;
    font-size: 12px;
    width: 18px;
    height: 18px;
}

.periodopromedio3{
    background-color: var(--color1);
    box-shadow: 0 0 3px rgba(255,255,255,0.6);
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    border-radius: 50%;
    font-family: sans-serif;
    font-weight: bold;
    font-size: 12px;
    width: 18px;
    height: 18px;
}

.anualpromedio3{
    background-color: white;
    box-shadow: 0 0 3px rgba(26,98,185,0.6);
    color: var(--color1);
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    border-radius: 50%;
    font-family: sans-serif;
    font-weight: bold;
    font-size: 12px;
    width: 18px;
    height: 18px;
}

.periodopromedio4{
    background-color: rgb(22, 160, 133);
    box-shadow: 0 0 3px rgba(255,255,255,0.6);
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    border-radius: 50%;
    font-family: sans-serif;
    font-weight: bold;
    font-size: 12px;
    width: 18px;
    height: 18px;
}

.anualpromedio4{
    background-color: white;
    box-shadow: 0 0 3px rgba(22, 160, 133,0.6);
    color: rgb(22, 160, 133);
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    border-radius: 50%;
    font-family: sans-serif;
    font-weight: bold;
    font-size: 12px;
    width: 18px;
    height: 18px;
}

.colorambar{
    color:rgb(241, 196, 15);
}

.imgbanco{
    width: 45px;
    height: auto;
}

#imgbancobbva{
    width: 35px;
}

.seccionhorariodiatitulo{
    padding-top: 10px;
    width: 100%;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    color: white;
    font-size: 14px;
    font-weight: bold;
    border-color: rgba(255,255,255,0.4);
    border-width: 0px 0px 1px 0px;
    border-style: solid;
}

.seccionhorariodiatituloest{
    font-weight: bold;
    background-color: rgb(240, 98, 146);
    padding: 10px 5px 10px 5px;
    width: 100%;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    color: white;
    font-size: 13px;  
    font-family: 'comic';
}

.seccionhorariodiacuerpo{
    width: 100%;
    height: auto;
}

.seccionhorariodiacuerpoest{
    padding: 0px 5px 5px 5px;
    width: 100%;
    height: auto;
}

.seccionhorariodiacurso{
    background-color: rgba(0,0,0,0.2);
    width:100%;
    height: 50px;
    margin-top: 5px;
    font-size: 12px;
    color:rgba(255,255,255,0.8);
}

.seccionhorariodiacursoest{
    border-style: solid;
    border-color: rgb(240, 98, 146); 
    border-width: 1px 0px 0px 0px;
    width:100%;
    height: auto;
    margin-top: 5px;
    font-size: 12px;
    color: rgb(74,83,136);
}

#seccionhorariodiacursoest1{   
    border-width: 0px;    
    margin-top: 0px;
}

.seccionhorariodiacursonombre{    
    font-style: italic;
    margin-top: 1px;
    text-align: center;
    padding: 3px 3px;
    width:100%;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.seccionhorariodiacursonombreestsede{  
    font-family: 'comic';    
    margin-top: 1px;
    text-align: center;
    padding: 2px 5px;
    width:100%;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    color: rgb(74,83,136);
}

.seccionhorariodiacursonombreest{ 
    font-family: 'comic';    
    margin-top: 1px;
    text-align: center;
    padding: 0px 5px;
    width:100%;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    color: rgb(240, 98, 146); 
}

.seccionhorariodiacursohora{
    font-family: 'comic';
    margin-top: 2px;
    padding: 2px 5px;
    width:100%;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.pantalladocente{
    position: relative;
    overflow: hidden;
    height: 100%;
    width: 100%;
}

.pantalladocenteaulavirtualleft{
    overflow-y: scroll;
    position: absolute;
    float: left;
    height: 100%;
    width: 200px;
    background-color: rgb(74, 83 ,136);
    transition: ease-in-out all 0.5s;
}

.pantallaestudianteaulavirtualleft{
    padding-bottom: 20px;
    padding-top: 5px;
    padding-left: 5px;
    overflow-y: scroll;
    position: absolute;
    float: left;
    height: 100%;
    width: 200px;
    background-color: rgb(74, 83 ,136);
    transition: ease-in-out all 0.5s;
}

.resultadoaulavirtual0{
    box-shadow: 0 0 5px rgba(255,255,255,0.3);
    background-color: rgba(0,0,0,0.2);
    height: auto;
    width: calc(100% - 5px);
    margin-left: 5px;
    margin-top: 5px;
    padding: 6px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-size: 13px;
    font-family: sans-serif;
    font-style: italic;
    color: rgba(255,255,255,0.8);
}

.resultadoaulavirtualactividad0{        
    height: auto;
    width: 100%;    
    padding: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-size: 13px;
    font-family: sans-serif;
    font-style: italic;
    color: rgb(74, 83 ,136);
}

.resultadoaulavirtualactividad01{        
    height: auto;
    width: 100%;    
    padding: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-size: 13px;
    font-family: sans-serif;
    font-style: italic;
    color: white;
}

.resultadovacioprematricula{        
    height: auto;
    width: 100%;    
    padding: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-size: 13px;
    font-family: sans-serif;
    font-style: italic;
    color: rgb(125,84,181);
}

.menuaulavirtualseccioncontenedornivel{
    border-width: 1px;
    border-style: solid;
    border-color: rgba(255,255,255,0.4);
    background-color: rgba(0,0,0,0.1);
    height: auto;
    width: calc(100% - 5px);
    margin-left: 5px;
    margin-top: 10px;
    margin-bottom: 10px;
    font-size: 13px;
    font-family: sans-serif;
    font-style: italic;
    color: rgba(255,255,255,0.8);
}

.menuselectsede{
    background-color: rgba(0,0,0,.2);
    color: rgba(255, 255, 255, 0.8);
    outline: none;
    margin-top: 5px;
    margin-left: 5px;
    width: calc(100% - 5px);
    height: 25px;
    border-width: 1px;
    border-style: solid;
    border-color: rgba(255,255,255,0.2);
    padding: 2px;
    font-family: sans-serif;
    font-size: 12px;
    font-weight: bold;
    font-style: italic;
    transition: ease-in-out all 0.2s;
}

.selectsedeoption{
    background-color: white;
    color: rgb(74, 83, 136);
}

.menuaulavirtualseccionnivel{
    font-weight: bold;
    margin-left: 5px;
    padding: 5px;
    height: auto;
    width: calc(100% - 10px);
    border-width: 0px 0px 1px 0px;
    border-style: solid;
    border-color: rgba(255,255,255,0.2);
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.menuaulavirtualseccioncontenedorsecciones{
    font-weight: bold;
    margin-left: 5px;
    padding-bottom: 10px;
    height: auto;
    width: calc(100% - 10px);    
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.menuaulavirtualseccionseccion{
    user-select: none;
    font-size: 23px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    color: white;
    border-radius: 3px;
    transition: ease-in-out all 0.3s;
    margin: 10px 13px 0px 13px;
    background-color: rgba(0,0,0,0.2);
    height: 60px;
    width: 60px;
}

.menuaulavirtualseccionseccion:hover{  
    box-shadow: 0 0 8px rgba(255,255,255,0.7);
    cursor: pointer;
}

.aulavirtualsecciongrado{
    text-align: center;
    width: 100%;
}

.aulavirtualseccioncompseccion{
    width: 100%;
    text-align: center;
    font-weight: normal;
    font-size: 12px;
}

.aulavirtualseccionseccion{
    font-size: 9px;
}

.pantalladocenteaulavirtualright{  
    box-sizing: border-box;
    overflow: hidden;
    position: absolute;
    margin-left: 200px;
    height: 100%;
    width: calc(100% - 200px);
    background-color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    transition: ease-in-out all 0.5s;
}

.pantallaestudianteaulavirtualright{  
    box-sizing: border-box;
    overflow: hidden;
    position: absolute;
    margin-left: 200px;
    height: 100%;
    width: calc(100% - 200px);
    background-color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    transition: ease-in-out all 0.5s;
}

.pantalladocenteaulavirtualrighticono{
    width: 100%;
    height: auto;
    text-align: center;
    font-size: 100px;
    color: rgba(74, 83 ,136,0.6);
}

.pantalladocenteaulavirtualrighttexto{
    width: 100%;
    height: auto;
    text-align: center;
    font-size: 15px;
    font-family: 'comic';
    color: rgba(74, 83 ,136,0.6);
}

.docenteaulavirtualpantalla{
    padding: 0px 0px 0px 5px;
    height: 100%;
    width: 100%;
}

#estudiantecalificacionespantallaid{
    padding: 0px;  
}

.seccionaulavirtualpantalla{
    padding: 0px 0px 0px 5px;
    height: 100%;
    width: 100%;
}

.docenteaulavirtualpantallaencabezado{
    overflow: hidden;
    font-family: sans-serif;
    font-size: 13px;
    color: rgb(74, 83 ,136);
    width: 100%;
    height: 35px;
    background-color: rgb(241, 196, 15);    
}

.docentetutoriapantallaencabezado{
    overflow: hidden;
    font-family: sans-serif;
    font-size: 13px;
    color: white;
    width: 100%;
    height: 35px;
    background-color: rgb(22, 160, 133);    
}

.seccioncalificacionespantallaencabezado{
    overflow: hidden;
    font-family: sans-serif;
    font-size: 13px;
    color: rgb(74, 83 ,136);
    width: 100%;
    height: 35px;
    background-color: rgb(194,176,218);    
}

.seccionasistenciaclasespantallaencabezado{
    overflow: hidden;
    font-family: sans-serif;
    font-size: 13px;
    color: white;
    width: 100%;
    height: 35px;
    background-color: rgb(52,152,219);    
}

.docenteaulavirtualpantallaencabezado7{
    overflow: hidden;
    font-family: sans-serif;
    font-size: 13px;
    color: rgb(255,255,255);
    width: 100%;
    height: 35px;
    background-color: var(--color1);    
}

.docentecalificacionespantallaencabezado{
    overflow: hidden;
    font-family: sans-serif;
    font-size: 13px;
    color: rgb(255,255,255);
    width: 100%;
    height: 35px;
    background-color: rgb(194,176,218);    
}

.docenteaulavirtualpantallaencabezado8{
    overflow: hidden;
    font-family: sans-serif;
    font-size: 13px;
    color: var(--color1);
    width: 100%;
    height: 30px;        
}

.estudianteexamenseccionactualizar{ 
    margin-top: 20px;
    width: 100%;
    height: auto; 
}

.estudianteexamenactualizartiempo{
    margin-top: -240px;
    width: 100%;
    height: auto; 
}

.docenteaulavirtualpantallaencabezado9{
    text-align: left;
    overflow: hidden;
    font-family: sans-serif;
    font-size: 13px;
    color: rgb(74, 83 ,136);
    width: 100%;
    height: 30px;        
}

.contenedorexamenestudiantebtnirexamen{
    margin-top: 80px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    height: 60px;
    width: 100%;
    padding: 5px;
}

.contenedorexamenestudiantebtnirexamen2{
    margin-top: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    height: 60px;
    width: 100%;
    padding: 5px;
}

#contenedorpantallaemergentetotal{
    padding: 10px;
    pointer-events: none;
    opacity: 0;
    position: fixed;
    z-index: 15;
    width: 100%;
    height: 100%;
    background-color: white;  
    overflow-y: scroll;
    transition: ease-in-out all 1s;
}

.btnexamenestudiantebtnirexamen{
    opacity: 0.4;
    pointer-events: none;
    border-radius: 5px;
    margin: auto;
    user-select: none;
    color: white;
    background-color: rgb(74, 83 ,136);
    padding: 5px;
    width: 100%;
    max-width: 300px;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-family: sans-serif;
    font-size: 16px;
    transition: ease-in-out all 0.3s;    
}

.btnexamenestudiantebtnirexamen:hover{
    cursor: pointer;
    background-color: var(--color1);
    box-shadow: 0 0 7px rgba(0,0,0,0.5);
}

.btnexamenestudiantebtnirexamenfin{
    opacity: 1;
    pointer-events: auto;
    border-radius: 5px;
    margin: auto;
    user-select: none;
    color: white;
    background-color: rgb(74, 83 ,136);
    padding: 5px;
    width: 100%;
    max-width: 300px;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-family: sans-serif;
    font-size: 16px;
    transition: ease-in-out all 0.3s;    
}

.btnexamenestudiantebtnirexamenfin:hover{
    cursor: pointer;
    background-color: var(--color1);
    box-shadow: 0 0 7px rgba(0,0,0,0.5);
}

.btnexamenestudiantebtnirexamenfin2{
    opacity: 0;
    pointer-events: none;
    border-radius: 5px;
    margin: auto;
    user-select: none;
    color: white;
    background-color: rgb(74, 83 ,136);
    padding: 5px;
    width: 100%;
    max-width: 300px;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-family: sans-serif;
    font-size: 16px;
    transition: ease-in-out all 0.3s;    
}

.btnexamenestudiantebtnirexamenfin2:hover{
    cursor: pointer;
    background-color: var(--color1);
    box-shadow: 0 0 7px rgba(0,0,0,0.5);
}

.btnexamenestudiantebtnirexamen2{
    opacity: 1;
    pointer-events: none;
    border-radius: 5px;
    margin: auto;
    user-select: none;
    color: white;
    background-color: rgb(74, 83 ,136);
    padding: 5px;
    width: 100%;
    max-width: 100px;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-family: sans-serif;
    font-size: 20px;    
}

.docenteaulavirtualpantallaencabezadoicono{
    float: left;
    height: 35px;
    width: 35px;
    font-size: 18px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.docenteaulavirtualpantallaencabezadoicono8{
    float: left;
    height: 30px;
    width: 30px;
    font-size: 15px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.docenteaulavirtualpantallaencabezadotitulo{
    overflow: hidden;
    font-weight: bold;
    font-style: italic;
    float: left;
    height: 35px;
    width: calc(100% - 70px);
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.docenteaulavirtualpantallaencabezadotitulo3{
    overflow: hidden;
    font-weight: bold;
    font-style: italic;
    float: left;
    height: 35px;
    width: calc(100% - 140px);
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.docenteaulavirtualpantallaencabezadotitulo4{
    overflow: hidden;
    font-weight: bold;
    font-style: italic;
    float: left;
    height: 35px;
    width: calc(100% - 175px);
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.docenteaulavirtualpantallaencabezadotitulo8{
    overflow: hidden;    
    float: left;
    height: 30px;
    width: calc(100% - 30px);
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.docenteaulavirtualpantallaencabezadotitulo2{
    overflow: hidden;
    font-weight: bold;
    font-style: italic;
    float: left;
    height: 35px;
    width: calc(100% - 105px);
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.docenteaulavirtualpantallaencabezadobtn{
    float: left;
    height: 35px;
    width: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.docenteaulavirtualpantallabtncursos{
    height: 30px;
    width: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-size: 17px;
    border-radius: 50%;
    transition: ease-in-out all 0.5s;
}

.docenteaulavirtualpantallabtncursos:hover{
    box-shadow: 0 0 10px rgba(255,255,255,1);
    cursor: pointer;
    background-color: rgb(74, 83 ,136);
    color: white;  
}

.floatdocenteaulavirtual{
    padding: 5px;
    opacity: 0;
    pointer-events: none;
    transition: ease-in-out all 0.5s;
    position: absolute;
    top: 45px;
    right: 12px;
    height: auto;
    width: 210px;
    background-color: rgb(241, 196, 15);
    z-index: 10;
}

.floatdocenteaulavirtual2{
    padding: 5px;
    opacity: 0;
    pointer-events: none;
    transition: ease-in-out all 0.5s;
    position: absolute;
    top: 45px;
    right: 12px;
    height: auto;
    width: 210px;
    background-color: var(--color1);
    z-index: 10;
    box-shadow: 0 0 5px rgba(0,0,0,0.6);
}

.floatdocentecalificaciones{
    padding: 5px;
    opacity: 0;
    pointer-events: none;
    transition: ease-in-out all 0.5s;
    position: absolute;
    top: 45px;
    right: 12px;
    height: auto;
    width: 210px;
    background-color: rgb(194,176,218); 
    z-index: 10;
    box-shadow: 0 0 5px rgba(0,0,0,0.6);
}

.floatseccioncalificaciones{
    border-radius: 3px;
    overflow-y: scroll;
    padding: 5px 0px 5px 5px;
    opacity: 0;
    pointer-events: none;
    transition: ease-in-out all 0.5s;
    position: absolute;
    top: 45px;
    right: 12px;
    height: auto;
    max-height: 350px;
    width: 200px;
    background-color: rgb(194,176,218);
    z-index: 10;
    box-shadow: 0 0 5px rgba(0,0,0,0.6);
}

.floatseccioncalificaciones2{
    border-radius: 3px;
    overflow-y: scroll;
    padding: 5px 0px 5px 5px;
    opacity: 0;
    pointer-events: none;
    transition: ease-in-out all 0.5s;
    position: absolute;
    top: 45px;
    right: 12px;
    height: auto;
    max-height: calc(100% - 57px);
    width: 270px;
    background-color: rgb(74, 83 ,136);
    z-index: 10;
    box-shadow: 0 0 5px rgba(0,0,0,0.6);
}

.floatestudianteaulavirtual{
    border-radius: 3px;
    overflow-y: scroll;
    padding: 5px 0px 5px 5px;
    opacity: 0;
    pointer-events: none;
    transition: ease-in-out all 0.5s;
    position: absolute;
    top: 45px;
    right: 12px;
    height: auto;
    max-height: 350px;
    width: 270px;
    background-color: rgb(241, 196, 15);
    z-index: 10;
    box-shadow: 0 0 5px rgba(0,0,0,0.6);
}

.floatestudianteaulavirtual2{
    border-radius: 3px;
    overflow-y: scroll;
    padding: 5px 0px 5px 5px;
    opacity: 0;
    pointer-events: none;
    transition: ease-in-out all 0.5s;
    position: absolute;
    top: 45px;
    right: 12px;
    height: auto;
    max-height: 350px;
    width: 270px;
    background-color: rgb(74, 83 ,136);
    z-index: 10;
    box-shadow: 0 0 5px rgba(0,0,0,0.6);
}

.floatestudianteaulavirtual3{
    border-radius: 3px;
    overflow-y: scroll;
    padding: 10px;
    opacity: 0;
    pointer-events: none;
    transition: ease-in-out all 0.5s;
    position: absolute;
    top: 45px;
    right: 12px;
    height: auto;
    max-height: calc(100% - 50px);
    width: calc(100% - 27px);
    background-color: rgb(255,255,255);
    z-index: 10;
    box-shadow: 0 0 5px rgba(0,0,0,0.6);
}

.floatestudianteaulavirtual4{
    border-radius: 3px;
    padding: 5px 0px 5px 5px;
    opacity: 0;
    pointer-events: none;
    transition: ease-in-out all 0.5s;
    position: absolute;
    top: 45px;
    right: 12px;
    height: auto;
    max-height: 350px;
    width: 175px;
    background-color: white;
    z-index: 20;
    box-shadow: 0 0 5px rgba(0,0,0,0.6);
}

.margintop5px{
    margin-top: 5px;
}

.docenteaulavirtualcursomenu{    
    color: rgb(74, 83 ,136);
    width: 100%;
    font-family: sans-serif;
    font-style: italic;
    font-size: 13px;
    height: 30px;
    margin-top: 0px;
    transition: ease-in-out all 0.5s;
}

.docenteaulavirtualcursomenu:hover{    
    color: white;
    cursor: pointer;
    background-color: rgb(74, 83 ,136);
}

.docenteaulavirtualcursomenu2{    
    color: white;
    width: 100%;
    font-family: sans-serif;
    font-style: italic;
    font-size: 13px;
    height: 30px;
    margin-top: 0px;
    transition: ease-in-out all 0.5s;
}

.docenteaulavirtualcursomenu2:hover{   
    cursor: pointer;
    background-color: rgb(74, 83 ,136);
    box-shadow: 0 0 5px rgba(255,255,255,0.6)
}

.estudianteaulavirtualactvidadpendiente{ 
    border-width: 1px 0px 0px 0px;
    border-style: solid;
    border-color: rgb(74, 83 ,136);
    color: rgb(74, 83 ,136);
    width: 100%;
    font-family: sans-serif;
    font-style: italic;
    font-size: 13px;
    height: 40px;
    transition: ease-in-out all 0.5s;
}

.estudianteaulavirtualactvidadpendiente:hover{    
    color: white;
    cursor: pointer;
    background-color: rgb(74, 83 ,136);
}

#estudianteaulavirtualactvidadpendienteid{    
    border-width: 0px;
}

.estudianteaulavirtualclaseenvivodia{ 
    border-width: 1px 0px 0px 0px;
    border-style: solid;
    border-color: rgba(255,255,255,0.3);
    color: rgba(255,255,255,0.8);
    width: 100%;
    font-family: sans-serif;
    font-style: italic;
    font-size: 13px;
    height: 40px;
    transition: ease-in-out all 0.3s;
}

.estudianteaulavirtualclaseenvivodia:hover{   
    cursor: pointer;
    color: rgb(241, 196, 15);
}

#estudianteaulavirtualclaseenvivodiaid{    
    border-width: 0px;
}

.estudianteaulavirtualclaseenvivodia2{ 
    border-width: 1px 0px 0px 0px;
    border-style: solid;
    border-color: rgba(255,255,255,0.3);
    color: white;
    width: 100%;
    font-family: sans-serif;
    font-style: italic;
    font-size: 13px;
    height: auto;
    transition: ease-in-out all 0.5s;
}

.estudianteaulavirtualclaseenvivodia2:hover{   
    cursor: pointer;
    background-color: rgb(194,176,218);
}

.estudianteaulavirtualclaseenvivodiaverde{ 
    border-width: 1px 0px 0px 0px;
    border-style: solid;
    border-color: rgba(255,255,255,0.3);
    color: white;
    width: 100%;
    font-family: sans-serif;
    font-style: italic;
    font-size: 13px;
    height: auto;
    transition: ease-in-out all 0.5s;
}

.estudianteaulavirtualclaseenvivodiaverde:hover{   
    cursor: pointer;
    background-color: rgb(22, 160, 133);
}

.estudianteaulavirtualcursomenu{ 
    margin-top: 5px;
    color: rgba(255,255,255,0.8);
    width: 100%;
    font-family: sans-serif;
    font-style: italic;
    font-size: 13px;
    height: 30px;
    transition: ease-in-out all 0.5s;
}

.estudianteaulavirtualcursomenu:hover{    
    box-shadow: 0 0 8px rgba(241, 196, 15,0.8);
    cursor: pointer;   
}

.seccionasistenciaclasecursomenu{ 
    margin-top: 5px;
    color: rgba(255,255,255,0.8);
    width: 100%;
    font-family: sans-serif;
    font-style: italic;
    font-size: 13px;
    height: 30px;
    transition: ease-in-out all 0.5s;
}

.seccionasistenciaclasecursomenu:hover{    
    box-shadow: 0 0 8px rgba(52,152,219,0.7);
    cursor: pointer;   
}

.seccioncalificacionescursomenu{ 
    margin-top: 5px;
    color: rgba(255,255,255,0.8);
    width: 100%;
    font-family: sans-serif;
    font-style: italic;
    font-size: 13px;
    height: 30px;
    transition: ease-in-out all 0.5s;
}

.seccioncalificacionescursomenu:hover{    
    box-shadow: 0 0 8px rgba(194,176,218,0.7);
    cursor: pointer;   
}

.estudianteaulavirtualcursomenu2{ 
    margin-top: 5px;
    color: rgba(255,255,255,0.8);
    width: 100%;
    font-family: sans-serif;
    font-style: italic;
    font-size: 13px;
    height: 30px;
    transition: ease-in-out all 0.5s;
}

.estudianteaulavirtualcursomenu2:hover{    
    box-shadow: 0 0 8px rgba(255,255,255,0.7);
    cursor: pointer;   
}

.docenteaulavirtualcursomenuicono{
    float: left;
    width: 25px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-size: 12px;
}

.estudianteaulavirtualactvidadpendienteleft{
    float: left;
    width: 25px;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-size: 20px;
}

.docenteaulavirtualcursomenutexto{
    font-size: 12px;
    float: left;
    width: calc(100% - 25px);
    height: 30px;
    display: flex;
    justify-content: flex-start;
    text-align: left;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.estudianteaulavirtualactvidadpendienteright{
    font-size: 12px;
    float: left;
    width: calc(100% - 25px);
    height: 100%;
    display: flex;
    justify-content: center;
    text-align: left;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.estudianteaulavirtualactvidadpendienterighttop{
    padding-left: 5px;
    padding-top: 4px;
    font-weight: bold;
    width: 100%;
    height: 50%;
    display: flex;
    justify-content: flex-start;
    text-align: left;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.estudianteaulavirtualactvidadpendienterighttop2{
    padding-left: 5px;
    padding-top: 4px;
    padding-bottom: 4px;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: flex-start;
    text-align: left;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.estudianteaulavirtualactvidadpendienterightbottom{
    padding-bottom: 4px;
    padding-right: 5px;
    width: 100%;
    height: 50%;
    display: flex;
    justify-content: flex-end;
    text-align: left;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.docenteaulavirtualpantallacuerpo{ 
    overflow-y: scroll;
    padding: 5px 0px 5px 5px;
    border-width: 0px 2px 2px 2px;
    border-style: solid;
    border-color: rgb(241, 196, 15);
    width: 100%;
    height: calc(100% - 35px);
}

.docentetutoriapantallacuerpo{ 
    overflow-y: scroll;
    padding: 5px 0px 5px 5px;
    border-width: 0px 2px 2px 2px;
    border-style: solid;
    border-color: rgb(22, 160, 133);
    width: 100%;
    height: calc(100% - 35px);
}

.seccioncalificaionespantallacuerpo{ 
    overflow-y: scroll;
    padding: 5px 0px 5px 5px;
    border-width: 0px 2px 2px 2px;
    border-style: solid;
    border-color: rgb(194,176,218);
    width: 100%;
    height: calc(100% - 35px);
}

.seccionasistenciaclasespantallacuerpo{ 
    overflow-y: scroll;
    padding: 5px 0px 5px 5px;
    border-width: 0px 2px 2px 2px;
    border-style: solid;
    border-color: rgb(52,152,219);
    width: 100%;
    height: calc(100% - 35px);
}

.docenteaulavirtualpantallacuerpo2{ 
    overflow-y: scroll;
    padding: 5px 0px 5px 5px;
    border-width: 0px 2px 2px 2px;
    border-style: solid;
    border-color: var(--color1);
    width: 100%;
    height: calc(100% - 35px);
}

.docentecalificacionespantallacuerpo{ 
    overflow-y: scroll;
    padding: 10px 10px 10px 10px;
    border-width: 0px 2px 2px 2px;
    border-style: solid;
    border-color: rgb(194,176,218); 
    width: 100%;
    height: calc(100% - 35px);
}

.centrarbox{
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.docenteaulavirtualcontenedordatoscurso{
    overflow: hidden;
    width: 100%;
    height: 30px;
    border-width: 0px 0px 2px 0px;
    border-style: solid;
    border-color: rgb(74, 83 ,136);
}

.docenteaulavirtualcontenedornomcurso{
    float: left;
    height: 100%;
    width: 220px;
    background-color: rgb(74, 83 ,136);
    color: white;
    border-radius: 10px 10px 0px 0px;
}

.docenteaulavirtualcontenedornomcurso2{
    float: left;
    height: 100%;
    width: 240px;
    background-color: rgb(74, 83 ,136);
    color: white;
    border-radius: 5px 5px 0px 0px;
}


.docenteaulavirtualicononomcurso{
    float: left;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    height: 30px;
    width: 35px;
}

.docenteaulavirtualtextonomcurso{
    float: left;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;   
    padding-right: 5px;
    height: 30px;
    width: 185px;
    font-family: sans-serif;
    font-size: 12px;
    font-style: italic;
}

.docenteaulavirtualtextonomcurso2{
    float: left;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;   
    padding-right: 5px;
    height: 30px;
    width: 200px;
    font-family: sans-serif;
    font-size: 12px;
    font-style: italic;
}

.docenteaulavirtualcontenedorbtncurso{
    border-radius: 3px;
    margin-left: 4px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    float: left;
    height: 25px;
    width: 30px;
    font-size: 18px;
    background-color: rgb(74, 83 ,136);
    color: white;
    transition: ease-in-out all 0.5s;
}

.docenteaulavirtualcontenedorbtncurso:hover{
    cursor: pointer;
    background-color: rgb(241, 196, 15);
    color: rgb(74, 83 ,136);
    box-shadow: 0 0 5px rgba(74, 83 ,136,0.7);
}

.docentecursoexameninsertar{  
    height: 42px;
    padding: 5px;
    overflow: hidden;
    margin-top: 5px;
    border-radius: 3px;
    width: 100%;
    border-width: 1px;
    border-style: solid;
    border-color: rgb(74, 83 ,136);    
}

.docentecursoexameninsertar2{ 
    position: relative;
    margin-top: 23px;
    height: 42px;
    padding: 5px;
    overflow: hidden;
    border-radius: 3px;
    width: 100%;
    border-width: 1px;
    border-style: solid;
}  

.docentecursoexameninsertarleft{
    float: left;
    width: calc(100% - 40px);
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.docentecursoexameninsertarright{
    border-radius: 3px;
    float: left;
    width: 40px;
    height: 100%;
    background-color: rgb(74, 83 ,136);  
    color: white;
    font-size: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    transition: ease-in-out all 0.3s;
}

.docentecursoexameninsertarright:hover{    
    background-color: var(--color1);
    cursor: pointer;
}

.docenteaulavirtualcontenedorcursoclaseinsertar{
    overflow: hidden;
    margin-top: 10px;
    height: 30px;
    width: 100%;
    border-width: 1px 0px 0px 0px;
    border-color: rgb(74, 83 ,136);
    border-style: solid;
    padding-top: 5px;
}

.docenteaulavirtualcontenedorcursoclaseinsertar2{
    overflow: hidden;
    margin-top: 10px;
    height: 40px;
    width: 100%;
    border-width: 1px 0px 1px 0px;
    border-color: rgb(74, 83 ,136);
    border-style: solid;
    padding-top: 5px;
    padding-bottom: 5px;
}

.docenteaulavirtualcontenedorcursoclaseinsertarperiodo{
    overflow: hidden;
    float: left;
    height: 100%;
    width: 115px;
}

.docenteaulavirtualcontenedorcursoclaseinsertarperiodoestudiantesilabus{
    overflow: hidden;
    float: left;
    height: 100%;
    width: 115px;
}

.docenteaulavirtualcontenedorcursoclaseinsertarperiodo2{    
    overflow: hidden;
    float: right;
    height: 30px;
    width: 115px;
    margin-right: 20px;
}

.docenteaulavirtualcontenedorcursoclaseinsertarperiodo3{
    overflow: hidden;
    float: right;
    height: 30px;
    width: 130px;
    margin-right: 20px;
}

.docenteaulavirtualcontenedorcursoclaseinsertarperiodo4{
    overflow: hidden;
    float: right;
    height: 30px;
    width: 180px;
    margin-right: 20px;
}

.docenteaulavirtualcontenedorcursoclaseinsertarperiodo5{   
    overflow: hidden;
    float: right;
    height: 30px;
    width: 150px;
    margin-right: 20px;
}

.docenteaulavirtualcontenedorcursoclaseinsertarperiodo6{    
    overflow: hidden;
    float: right;
    height: 30px;
    width: 135px;
    margin-right: 20px;
}

.docenteaulavirtualcontenedorcursoclaseinsertarperiodolabel{
    float: left;
    height: 100%;
    width: 65px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    color: rgb(74, 83 ,136);
    font-family: sans-serif;
    font-size: 13px;
    font-weight: bold;
}

.docenteaulavirtualcontenedorcursoclaseinsertarperiodolabelsilabusestudiante{
    float: left;
    height: 100%;
    width: 115px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    color: rgb(74, 83 ,136);
    font-family: sans-serif;
    font-size: 12px;
    font-weight: bold;
}

.docenteaulavirtualcontenedorcursoclaseinsertarperiodolabel2{
    float: left;
    height: 100%;
    width: 65px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    color: rgb(74, 83 ,136);
    font-family: sans-serif;
    font-size: 13px;
    font-weight: bold;
}

.docenteaulavirtualcontenedorcursoclaseinsertarperiodolabel3{    
    float: left;
    height: 100%;
    width: 35px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    color: rgb(74, 83 ,136);
    font-family: sans-serif;
    font-size: 13px;
    font-weight: bold;
}

.docenteaulavirtualcontenedorcursoclaseinsertarperiodolabel4{   
    float: left;
    height: 100%;
    width: 45px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    color: rgb(74, 83 ,136);
    font-family: sans-serif;
    font-size: 13px;
    font-weight: bold;
}

.docenteaulavirtualcontenedorcursoclaseinsertarperiodolabel5{   
    float: left;
    height: 100%;
    width: 40px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    color: rgb(74, 83 ,136);
    font-family: sans-serif;
    font-size: 13px;
    font-weight: bold;
}

.docenteaulavirtualcontenedorcursoclaseinsertarperiodolabel6{   
    float: left;
    height: 100%;
    width: 25px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    color: rgb(74, 83 ,136);
    font-family: sans-serif;
    font-size: 13px;
    font-weight: bold;
}

.docenteaulavirtualcontenedorcursoclaseinsertarperiodoselect{    
    float: left;
    height: 100%;
    width: 45px;    
}

.docenteaulavirtualcontenedorcursoclaseinsertarperiodoselect2{
    margin-left: 5px;
    float: left;
    height: 100%;
    width: 45px;    
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.docenteaulavirtualcontenedorcursoclaseinsertarperiodoselect3{
    margin-left: 5px;
    float: left;
    height: 100%;
    width: 90px;    
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.docenteaulavirtualcontenedorcursoclaseinsertarperiodoselect4{
    margin-left: 5px;
    float: left;
    height: 100%;
    width: 130px;    
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.docenteaulavirtualcontenedorcursoclaseinsertarperiodoselect5{
    margin-left: 5px;
    float: left;
    height: 100%;
    width: 105px;    
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.selectdocenteclasevirtualperiodo{ 
    margin-top: 2.5px;
    height: 20px;
    width: 45px;
    background-color: rgba(74, 83 ,136,0.1);
    border-radius: 3px;
    color: rgb(74, 83 ,136);
    font-family: sans-serif;
    font-size: 13px;
    outline: none;   
    text-align: center;
    border-width: 1px;
    border-color:rgb(74, 83 ,136); 
    border-style: solid;
    padding-left: 5px;
}

.selectexamcandpreguntas{ 
    margin-left: 5px;
    float: left;
    margin-top: 6px;
    height: 20px;
    width: 45px;
    background-color: rgba(74, 83 ,136,0.1);
    border-radius: 3px;
    color: rgb(74, 83 ,136);
    font-family: sans-serif;
    font-size: 13px;
    outline: none;   
    text-align: center;
    border-width: 1px;
    border-color:rgb(74, 83 ,136); 
    border-style: solid;
    padding-left: 5px;
}

.selectexampreguntaproc{ 
    margin-left: 0px;
    float: left;
    margin-top: 6px;
    height: 20px;
    width: 50px;
    background-color: rgba(74, 83 ,136,0.1);
    border-radius: 3px;
    color: rgb(74, 83 ,136);
    font-family: sans-serif;
    font-size: 13px;
    outline: none;   
    text-align: center;
    border-width: 1px;
    border-color:rgb(74, 83 ,136); 
    border-style: solid;
    padding-left: 5px;
}

.selectdocenteclasevirtualperiodo2{ 
    margin-top: 2.5px;
    height: 20px;
    width: 90px;
    background-color: rgba(74, 83 ,136,0.1);
    border-radius: 3px;
    color: rgb(74, 83 ,136);
    font-family: sans-serif;
    font-size: 13px;
    outline: none;   
    text-align: center;
    border-width: 1px;
    border-color:rgb(74, 83 ,136); 
    border-style: solid;
    padding-left: 5px;
}

.selectdocenteclasevirtualperiodo3{ 
    margin-top: 2.5px;
    height: 20px;
    width: 130px;
    background-color: rgba(74, 83 ,136,0.1);
    border-radius: 3px;
    color: rgb(74, 83 ,136);
    font-family: sans-serif;
    font-size: 13px;
    outline: none;   
    text-align: center;
    border-width: 1px;
    border-color:rgb(74, 83 ,136); 
    border-style: solid;
    padding-left: 5px;
}

.selectdocenteclasevirtualperiodo4{ 
    margin-top: 2.5px;
    height: 20px;
    width: 105px;
    background-color: rgba(74, 83 ,136,0.1);
    border-radius: 3px;
    color: rgb(74, 83 ,136);
    font-family: sans-serif;
    font-size: 13px;
    outline: none;   
    text-align: center;
    border-width: 1px;
    border-color:rgb(74, 83 ,136); 
    border-style: solid;
    padding-left: 5px;
}

.optiondocenteclasevirtualperiodo{
    background-color: white;
    color: rgb(74, 83 ,136);
}

.docenteaulavirtualcontenedorcursoclaseinsertarbtn{
    color: white;
    border-radius: 3px;
    margin-right: 5px;
    margin-left: 5px;
    overflow: hidden;
    float: left;
    height: 100%;
    width: 25px;
    background-color: rgb(74, 83 ,136);
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    transition: ease-in-out all 0.3s;
    font-size: 15px;
}

.docenteaulavirtualcontenedorcursoclaseinsertarbtn:hover{
    cursor: pointer;
    color: rgb(74, 83 ,136);
    background-color: rgb(241, 196, 15); 
}

.docenteaulavirtualcontenedorclases{
    width: 100%;
    height: auto;
    padding: 5px 0px;
    border-width: 0px 0px 1px 0px;
    border-style: solid;
    border-color: rgb(74, 83 ,136);
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.candclases0{
    margin-top: 5px;
    width: 100%;
    text-align: center;
    font-family: sans-serif;
    font-size: 13px;
    font-style: italic;
    font-weight: bold;
    color: rgb(74, 83 ,136);
}

.candclases0nota{
    margin-bottom: 15px;
    margin-top: 5px;
    width: 100%;
    text-align: center;
    font-family: sans-serif;
    font-size: 13px;
    font-style: italic;
    font-weight: bold;
    color: rgb(74, 83 ,136);
}

.docenteaulavirtualclase{
    margin: 5px;
    transition: ease-in-out all 0.3s;
    height: 50px;
    width: 50px;
    background-color: rgb(74, 83 ,136);
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-size: 25px;
    color: white;
    border-radius: 3px;
    font-family: sans-serif;
}

.docenteaulavirtualclase:hover{
    cursor: pointer;
    color: rgb(74, 83 ,136);
    background-color: rgb(241, 196, 15);
}

.seccionasistenciaclaseseleccionar{
    margin: 5px;
    transition: ease-in-out all 0.3s;
    height: 50px;
    width: 100px;
    background-color: rgb(74, 83 ,136);
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-size: 25px;
    color: white;
    border-radius: 3px;
    font-family: 'comic';
}

.seccionasistenciaclaseseleccionar:hover{
    cursor: pointer;
    color: rgb(74, 83 ,136);
    background-color: rgb(241, 196, 15);
}

.docenteexamenexam{
    margin: 5px;
    transition: ease-in-out all 0.3s;
    height: 50px;
    width: 50px;
    background-color: rgb(74, 83 ,136);
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-size: 25px;
    color: white;
    border-radius: 3px;
    font-family: sans-serif;
}

.docenteexamenexam:hover{
    cursor: pointer;
    color: white;
    background-color: var(--color1);
}

.docentecalificacionesperiodo{
    margin: 5px;
    transition: ease-in-out all 0.3s;
    height: 50px;
    width: 100px;
    background-color: rgb(74, 83 ,136);
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-size: 25px;
    color: white;
    border-radius: 3px;
    font-family: sans-serif;
}

.docentecalificacionesperiodo:hover{
    cursor: pointer;
    box-shadow: 0 0 7px rgba(74, 83 ,136,0.7);
}

.docenteaulavirtualclaseicono{  
    padding-top: 5px;
    height: 30px;
    width: 50px;
    font-size: 25px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.seccionasistenciaclaseseleccionaricono{
    padding-top: 5px;
    height: 30px;
    width: 22px;
    font-size: 16px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.seccionasistenciaclaseseleccionarnum{
    padding-top: 3px;
    height: 30px;
    width: 30px;
    font-size: 13px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.seccionasistenciaclaseseleccionarfecha{
    height: 20px;
    width: 100px;
    font-size: 11px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.docentecalificacionesperiodoicono{  
    padding-top: 5px;
    height: 30px;
    width: 100%;
    font-size: 25px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.docenteaulavirtualclasenum{
    height: 20px;
    width: 50px;
    font-size: 13px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-weight: bold;
}

.docentecalificacionesperiodonom{
    height: 20px;
    width: 100%;
    font-size: 13px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.docenteaulavirtualcontenedordatosclase{
    width: 100%;
    height: auto;
    padding: 0px 0px;
    border-width: 0px 0px 0px 0px;
    border-style: solid;
    border-color: rgb(74, 83 ,136);
    text-align: center;
}

.docenteaulavirtualclasenumero{
    margin-top: 10px;
    width: 100%;
    height: 20px;
    font-size: 14px;
    font-family: sans-serif;
    font-weight: bold;
    color: rgb(241, 196, 15);
    margin-bottom: 5px;
}

.docenteaulavirtualclasearchivos{    
    overflow: hidden;
    margin: 20px auto auto auto;
    width: 100%;
    padding: 5px;
    max-width: 400px;
    box-shadow: 0 0 5px rgba(0,0,0,0.5);
    border-radius: 5px;
}

.divnoselect{
    opacity: 0.5;
    pointer-events: none; 
}

.parraforesenia{
    margin: 5px 0px;
    color: rgb(74, 83 ,136);
    font-family: 'comic';
    overflow-y: scroll;
}

#docenteaulavirtualclasetema{
    height: auto;
    margin-top: 30px;
}

#docenteaulavirtualclaseclasevivo{
    margin-bottom: 10px;
}

.docenteaulavirtualclaselabel{
    width: 100%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    padding-left: 5px;
    padding-top: 5px;
    padding-left: 5px;
    font-family: sans-serif;
    font-weight: bold;
    font-size: 13px;
    color: rgb(74, 83 ,136);
}

.docenteaulavirtualclasearchivostxt{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    float: left;
    height: 40px;
    width: calc(100% - 40px);
    max-width: 400px;
}

#estudianteulavirtualclasearchivosmaterialfile{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    float: left;
    height: 40px;
    width: calc(100% - 40px);
}

.contenedordatesaulavirtualclasematerial{
    padding-left: 5px;
    float: left;
    width: 100%;
    height: auto;
}

#docenteaulavirtualclasearchivostxttemaidedit{
    width: calc(100% - 75px);
}

#docenteaulavirtualclasearchivostxtvideoidedit{
    width: calc(100% - 75px);
}

#docenteaulavirtualcursosilabusfileedit{
    width: calc(100% - 75px);
}

#docenteaulavirtualclasearchivosmaterialfileedit{
    width: calc(100% - 75px);
}

#docenteaulavirtualclasearchivosactividadfileedit{
    width: calc(100% - 75px);
}

#docenteaulavirtualclasearchivosresolucionfileedit{
    width: calc(100% - 75px);
}

#docenteaulavirtualclasearchivosfichafileedit{
    width: calc(100% - 75px);
}

#formestudianteaulavirtualclaseactividad{
    height: 40px;
    width: 100%
}

.txtclasetema{
    margin-left: 5px;
    outline: none;
    width: calc(100% - 5px);
    height: 30px;
    padding-left: 3px;
    padding-right: 3px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    color: rgb(74, 83 ,136);
    border-color: rgb(74, 83 ,136);
    border-radius: 3px;
    border-style: solid;
    border-width: 1px;
    font-family: sans-serif;
    font-size: 13px;
}

.txtclasetema::placeholder{
    color: rgba(74, 83 ,136,0.6);
}

.txtclasetema:focus{
    box-shadow: 0 0 5px rgba(241, 196, 15,0.7);
}

.docenteaulavirtualclasearchivosbtn{
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    margin-top: 5px;
    margin-left: 5px;
    float: left;
    height: 30px;
    width: 30px;
    max-width: 400px;
    background-color: rgb(74, 83 ,136);
    border-radius: 3px;
    transition: ease-in-out all 0.3s;
}

.docenteaulavirtualclasearchivosbtn:hover{
    cursor: pointer;
    color: rgb(74, 83 ,136);
    background-color: rgb(241, 196, 15);
}

.estudianteaulavirtualclasetoolsbtn{
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    margin-left: 5px;
    float: left;
    height: 30px;
    width: 30px;
    max-width: 400px;
    background-color: rgb(74, 83 ,136);
    border-radius: 3px;
    transition: ease-in-out all 0.3s;
}

.estudianteaulavirtualclasetoolsbtn:hover{
    cursor: pointer;
    color: rgb(74, 83 ,136);
    background-color: rgb(241, 196, 15);
}

#docenteaulavirtualclasearchivosbtnactividad{
    float: left;
    margin-left: 155px;
    margin-top: -55px;
}

.docenteaulavirtualclasecontenedorvideo{
    padding: 5px 0px;
    width: 100%;
    margin-top: 5px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.docenteaulavirtualclasecontenedorvideo2{
    padding: 5px 0px;
    width: 100%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.docenteaulavirtualclaseiframevideo{
    border-radius: 5px;
    float: left;
    margin-left: 5px;
    max-width: 395px;
    width: calc(100% - 45px);
    height: auto;    
    box-shadow: 0 0 9px rgba(74, 83 ,136,0.7);
    border-style: solid;
    border-color: rgb(74, 83 ,136);
    border-width: 0px;
}

#filecursosilabusid{
    margin-left: 5px;
    color: rgb(74, 83 ,136);
    overflow: hidden;
    padding-top: 3px;
    padding-left: 3px;
    padding-right: 3px;
    border-radius: 3px;
    height: 30px;
    width: 100%;
    border-width: 1px;
    border-color: rgb(74, 83 ,136);
    border-style: solid;
    background-color: white;
    outline: none;
}

#fileclasematerialid{
    margin-left: 5px;
    color: rgb(74, 83 ,136);
    overflow: hidden;
    padding-top: 3px;
    padding-left: 3px;
    padding-right: 3px;
    border-radius: 3px;
    height: 30px;
    width: 100%;
    border-width: 1px;
    border-color: rgb(74, 83 ,136);
    border-style: solid;
    background-color: white;
    outline: none;
}

#fileclasefichaid{
    margin-left: 5px;
    color: rgb(74, 83 ,136);
    overflow: hidden;
    padding-top: 3px;
    padding-left: 3px;
    padding-right: 3px;
    border-radius: 3px;
    height: 30px;
    width: 100%;
    border-width: 1px;
    border-color: rgb(74, 83 ,136);
    border-style: solid;
    background-color: white;
    outline: none;
}

#fileclaseactividadid{
    margin-left: 5px;
    color: rgb(74, 83 ,136);
    overflow: hidden;
    padding-top: 3px;
    padding-left: 3px;
    padding-right: 3px;
    border-radius: 3px;
    height: 30px;
    width: 100%;
    border-width: 1px;
    border-color: rgb(74, 83 ,136);
    border-style: solid;
    background-color: white;
    outline: none;
}

#fileclaseresolucionid{
    margin-left: 5px;
    color: rgb(74, 83 ,136);
    overflow: hidden;
    padding-top: 3px;
    padding-left: 3px;
    padding-right: 3px;
    border-radius: 3px;
    height: 30px;
    width: 100%;
    border-width: 1px;
    border-color: rgb(74, 83 ,136);
    border-style: solid;
    background-color: white;
    outline: none;
}

#fileclaseactividadestudianteid{
    margin-left: 5px;
    color: rgb(74, 83 ,136);
    overflow: hidden;
    padding-top: 3px;
    padding-left: 3px;
    padding-right: 3px;
    border-radius: 3px;
    height: 30px;
    width: 100%;
    border-width: 1px;
    border-color: rgb(74, 83 ,136);
    border-style: solid;
    background-color: white;
    outline: none;
}

#docenteaulavirtualclasearchivosmaterialbarra{
    margin-top: 0px;
    width: 100%;
}

.barra_inicial{
    display: none;
    overflow: hidden;
    width: 100%;
    max-width: 395px;
    height: 30px;
    text-align: center;
    transition: ease-in-out all 0.5s;
    pointer-events: none;
    opacity: 0;
}

#imgloadingupload{
    width: auto;
    height: 30px;
}

.docenteaulavirtualclaseiframepdf{
    float: left;
    margin-left: 5px;
    max-width: 125px;
    width: calc(100% - 45px);
    height: 150px;    
    box-shadow: 0 0 10px rgba(74, 83 ,136,0.7);
    border-style: solid;
    border-color: rgb(74, 83 ,136);
    border-width: 3px;
}

.docenteaulavirtualclaseiframepdf:hover{
    cursor: pointer;    
    box-shadow: 0 0 10px rgba(241, 196, 15,0.7);
}

.contenedordocenteaulavirtualclaseclasevivo{
    width: 100%;
    max-width: 440px;
    height: 190px;
}

.contenedordocenteaulavirtualclaseclasevivoleft{
    padding-left: 5px;
    padding-top: 5px;
    float: left;
    width: calc(100% - 40px);
    height: 100%;
}

.txtdocenteaulavirtualclasevivo{
    margin-top: 5px;
    margin-bottom: 7px;
    width: 100%;
    max-width: 250px;
    outline: none;
    height: 30px;
    padding-left: 3px;
    padding-right: 3px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    color: rgb(74, 83 ,136);
    border-color: rgb(74, 83 ,136);
    border-radius: 3px;
    border-style: solid;
    border-width: 1px;
    font-family: sans-serif;
    font-size: 13px;
}

.txtdocenteaulavirtualclasevivo::placeholder{
    color: rgba(74, 83 ,136,0.6);
}

.txtdocenteaulavirtualclasevivo:focus{
    box-shadow: 0 0 5px rgba(241, 196, 15,0.7);
}

.contenedorasistenciafechaclase{
    width: 100%;
    height: 30px;
    padding-right: 3px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 5px;    
}

.timeseccionasistenciaclasefecha{    
    width: 130px;    
    outline: none;
    height: 30px;
    padding-left: 3px;
    padding-right: 3px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    color: white;
    border-radius: 3px; 
    border-width: 0px;
    font-family: sans-serif;
    font-size: 13px;
    background-color: rgb(74, 83 ,136);
}

.asistenciafechabtn{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    border-radius: 3px; 
    height: 100%;
    width: 30px;
    font-size: 18px;
    background-color: rgb(74, 83 ,136);
    color: rgba(255,255,225,0.9);
    transition: ease-in-out all 0.3s;
}

.asistenciafechabtn:hover{    
    background-color: rgb(52,152,219);
    color: rgba(255,255,225,1);
    cursor: pointer;
}

.asistenciafechabtn2{
    margin-left: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    border-radius: 3px; 
    height: 100%;
    width: 30px;
    height: 30px;
    font-size: 18px;
    background-color: rgb(74, 83 ,136);
    color: rgba(255,255,225,0.9);
    transition: ease-in-out all 0.3s;
}

.asistenciafechabtn2:hover{    
    background-color: rgb(52,152,219);
    color: rgba(255,255,225,1);
    cursor: pointer;
}

.asistenciamesselect{
    width: 100%;    
    outline: none;
    height: 30px;
    padding-left: 3px;
    padding-right: 3px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    color: white;
    border-radius: 3px; 
    border-width: 0px;
    font-family: sans-serif;
    font-size: 13px;
    background-color: rgb(74, 83 ,136); 
}

.timedocenteaulavirtualclasevivo{
    margin-top: 5px;
    margin-bottom: 7px;
    width: 100%;
    max-width: 150px;
    outline: none;
    height: 30px;
    padding-left: 3px;
    padding-right: 3px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    color: white;
    border-radius: 3px; 
    border-width: 0px;
    font-family: sans-serif;
    font-size: 13px;
    background-color: rgb(74, 83 ,136);
}

.contenedordocenteaulavirtualclaseclasevivoright{
    float: left;
    width: 40px;
    height: 100%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.contenedoraulavirtualclasetitulo{
    border-width: 1.5px 0px 0px 0px;
    border-style: solid;
    border-color: rgb(74, 83 ,136);
    margin-top: -5px;
    width: 100%;
    height: 15px;
    background-color: rgb(74, 83 ,136);
}



.aulavirtualclasetitulo{
    font-family: sans-serif;
    font-size: 12px;
    font-weight: bold;
    color: rgb(241, 196, 15);
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    width: 80px;
    height: 30px;
    float: left;
    background-color: rgb(74, 83 ,136);
    border-bottom-right-radius: 10px;
}

.aulavirtualclaseright{
    overflow: hidden;
    font-weight: bold;
    color: rgb(74, 83 ,136);
    font-family: sans-serif;
    font-size: 12px;
    font-style: italic;
    padding-left: 5px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    float: left;
    height: 30px;
    width: calc(100% - 80px);
    background-color: white;
    border-top-left-radius: 10px;
}

.contenedoraulavirtualclasecontenido{
    margin-top: 25px;
    width: 100%;
    height: auto;  
    text-align: center;
}

.contenedoraulavirtualclasecontenido1{
    margin: auto;
    border-radius: 5px;
    overflow: hidden;
    max-width: 100%;
    width: 400px;
    height: 200px;   
    box-shadow: 0 0 5px rgba(0,0,0,0.5);
}

.estudianteiframevideo{
    float: left;
    height: 200px;
    width: calc(100% - 40px);
}

.estudianteyoutubevideo{
    float: left;
    height: 200px;
    width: 40px;
    background-color: rgb(74, 83 ,136);
    color: white;
    transition: ease-in-out all 0.3s;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-size: 25px;
}

.estudianteyoutubevideo:hover{
    cursor: pointer;
    background-color: rgb(241, 196, 15);
    color: rgb(74, 83 ,136);    
}

.contenedoraulavirtualclasecontenido2{
    margin: auto;
    margin-top: 10px;
    max-width: 100%;
    width: 400px;
    height: 80px;  
}

.contenedoraulavirtualclasecontenido2material{
    border-radius: 5px;
    overflow: hidden;
    color: white;
    float: left;
    height: 100%;
    width: calc(50% - 5px);
    background-color: rgb(74, 83 ,136); 
    transition: ease-in-out all 0.3s;
    box-shadow: 0 0 5px rgba(0,0,0,0.5);
}

.contenedoraulavirtualclasecontenido2material:hover{
    cursor: pointer;
    background-color: rgb(241, 196, 15);
    color: rgb(74, 83 ,136);
}

.contenedoraulavirtualclasecontenido2vacio{    
    float: left;
    height: 100%;
    width: 10px;
}

.contenedoraulavirtualclasecontenido2actividad{
    border-radius: 5px;
    overflow: hidden;
    color: white;
    float: left;
    height: 100%;
    width: calc(50% - 5px);
    background-color: rgb(74, 83 ,136); 
    transition: ease-in-out all 0.3s;
    box-shadow: 0 0 5px rgba(0,0,0,0.5);
}

.contenedoraulavirtualclasecontenido2actividad:hover{
    cursor: pointer;
    background-color: rgb(241, 196, 15);
    color: rgb(74, 83 ,136);
}

.contenedoraulavirtualclasecontenido2ficha{
    border-radius: 5px;
    overflow: hidden;
    color: white;
    background-color: rgb(74, 83 ,136); 
    transition: ease-in-out all 0.3s;
    box-shadow: 0 0 5px rgba(0,0,0,0.5);
    margin: auto;
    margin-top: 10px;
    max-width: 100%;
    width: 400px;
    height: 80px; 
}

.contenedoraulavirtualclasecontenido2ficha:hover{
    cursor: pointer;
    background-color: rgb(241, 196, 15);
    color: rgb(74, 83 ,136);
}

.contenedoraulavirtualclasecontenido2materialicono{    
    padding-top: 5px;
    width: 100%;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-size: 35px;    
}

.contenedoraulavirtualclasecontenido2materialtexto{    
    width: 100%;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;  
    font-family: sans-serif;
    font-size: 13px;
}

.contenedoraulavirtualclasecontenido3{
    margin: auto;
    box-shadow: 0 0 5px rgba(0,0,0,0.5);
    background-color: rgb(74, 83 ,136);
    border-width: 2px;
    border-style: solid;
    border-color: rgb(74, 83 ,136);
    margin-top: 10px;
    max-width: 100%;
    width: 400px;
    height: 94px; 
    border-radius: 5px;
    overflow: hidden;
}

.contenedoraulavirtualclasecontenido4{
    box-shadow: 0 0 5px rgba(0,0,0,0.5);
    background-color: rgb(74, 83 ,136);
    border-width: 2px;
    border-style: solid;
    border-color: rgb(74, 83 ,136);
    margin: 10px auto auto auto;
    width: 100%;
    max-width: 400px;
    height: 74px; 
    border-radius: 5px;
    overflow: hidden;
}

#contenedoraulavirtualclasecontenidoactividadplazo{
    background-color: rgb(74, 83 ,136);
    border-width: 2px;
    border-style: solid;
    border-color: rgb(74, 83 ,136);
    margin-top: 10px;
    max-width: 100%;
    width: 400px;
    height: 102px; 
    border-radius: 5px;
    overflow: hidden;
}

.contenedoraulavirtualclasecontenido3titulo{
    width: 100%;
    height: 30px;    
    color: white;
}

.contenedoraulavirtualclasecontenido3icono{
    padding-left: 2px;
    float: left;
    width: 30px;
    height: 30px;
    font-size: 18px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.contenedoraulavirtualclasecontenido3texto{
    padding-left: 5px;
    float: left;
    width: calc(100% - 30px);
    height: 30px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-family: sans-serif;
    font-size: 13px;
}

.contenedoraulavirtualclasecontenido3cuerpo{
    width: 100%;
    height: 60px;    
    background-color: white;
    border-radius: 0px 0px 3px 3px;
}

.contenedoraulavirtualclasecontenido4cuerpo{
    width: 100%;
    height: 40px;    
    background-color: white;
    border-radius: 0px 0px 3px 3px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

#contenedoraulavirtualclasecontenido3cuerpoplazo{
    width: 100%;
    height: calc(100% - 30px);    
    background-color: white;
    border-radius: 0px 0px 3px 3px;
}

.contenedoraulavirtualclasecontenido3cuerpoleft{
    float: left;
    height: 100%;
    width: calc(100% - 36px);
}

.contenedoraulavirtualclasecontenido3cuerpolefttop{
    height: 30px;
    width: 100%;
}

.contenedoraulavirtualclasecontenido3cuerpoleftbottom{
    height: calc(100% - 30px);
    width: 100%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.contenedoraulavirtualclasecontenido3cuerporight{
    position: relative;
    float: left;
    height: 100%;
    width:36px;
}

.actividadplazoarchivo{
    width: 30px;
    height: calc(100% - 6px);
    margin-top: 3px;
    margin-left: 3px;
    color: rgba(74, 83 ,136,0.6);
    background-color: rgba(74, 83 ,136,0.1);
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    text-align: center;
    font-weight: bold;
    border-bottom-right-radius: 3px;
}


.actividadplazoarchivo2{
    margin-top: 3px;
    margin-left: 3px;
    width: 30px;
    height: calc(100% - 6px);
    color: white;
    background-color: rgb(74, 83 ,136);
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    text-align: center;
    font-weight: bold;
    border-bottom-right-radius: 3px;
    transition: ease-in-out all 0.3s;
}

.actividadplazoarchivo2:hover{
    cursor: pointer;
    background-color: rgb(241, 196, 15);
    color: rgb(74, 83 ,136);
}


.contenedoraulavirtualclasecontenido3cuerpodiv{
    padding-right: 3px; 
    float: left;
    width: 50%;
    height: 60px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    color: rgb(74, 83 ,136);
    font-family: sans-serif;
    font-size: 13px;
}

.contenedoraulavirtualclasecontenido3cuerpohorario{
    color: rgb(74, 83 ,136);
    overflow: hidden;
    width: 100%;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-family: sans-serif;
}

#contenedoraulavirtualclasecontenido3cuerpohorarioactividadfecha{
    float: left;
    color: rgb(74, 83 ,136);
    overflow: hidden;
    width: 50%;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-family: sans-serif;
}

#contenedoraulavirtualclasecontenido3cuerpohorarioactividadhora{
    float: left;
    color: rgb(74, 83 ,136);
    overflow: hidden;
    width: 50%;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-family: sans-serif;
}

.contenedoraulavirtualclasecontenido3cuerpohorarioicono{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-family: sans-serif;
    font-size: 15px;
    width: 25px;
    height: 25px;
}

.contenedoraulavirtualclasecontenido3cuerpohorarioicono2{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-family: sans-serif;
    font-size: 13px;
    width: 25px;
    height: 25px;
    font-weight: bolder;
}

.contenedoraulavirtualclasecontenido3cuerpohorariodatetime{
    padding-left: 0px;
    width: calc(100% - 25px);
    height: 25px;
    font-family: sans-serif;
    font-size: 13px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-family: sans-serif;
}

.fontsizeless{
    font-size: 13px;
    font-weight: bold;
}

.estudianteaulavirtualclaseinfozoom{
    overflow: hidden;
    float: left;
    height: 100%;
    width: calc(100% - 33px);
}

.estudianteaulavirtualclasebtnzoom{
    text-align: center;
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    border-bottom-right-radius: 3px;
    margin-left: 3px;    
    float: left;
    height: calc(100% - 6px);
    width: 30px;    
    background-color: rgb(74, 83 ,136);
    overflow: hidden;
    transition: ease-in-out all 0.3s;
}

.estudianteaulavirtualclasebtnzoom:hover{
    cursor: pointer;
    background-color: rgb(241, 196, 15);
    color: rgb(74, 83 ,136);
}

.estudianteaulavirtualclasebtnzoomiconoplazo{
    font-family: sans-serif;
    margin: auto;
    font-size: 25px;
}

.estudianteaulavirtualclasebtnzoomicono{
    margin: auto;
    font-size: 20px;
}

.estudianteaulavirtualclasebtnzoomtexto{
    margin: auto;
    font-size: 10px;
    font-family: sans-serif;
}

.contenedormenuexamsemanal{
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    flex-direction: row;
    flex-wrap: wrap;
    margin-left: 5px;
    width: calc(100% - 5px);
    min-height: 50px;
    border-color: var(--color1);
    border-width: 0px 0px 1px 0px;
    border-style: solid;
}

.contenedordatosexamsemanal{    
    margin-left: 5px;
    width: calc(100% - 5px);
    min-height: 50px;
}

.examsemseccion0{
    font-family: sans-serif;
    font-style: italic;
    font-size: 13px;
    color: var(--color1);
    width: 100%;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.examsemseccion1{
    font-family: sans-serif;
    font-style: italic;
    font-size: 13px;
    color: rgb(179,164,238);
    width: 100%;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.examsemseccion2{
    font-family: sans-serif;
    font-style: italic;
    font-size: 13px;
    color: rgb(74, 83 ,136);
    width: 100%;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.inputexamsemanalarea{
    outline: none;
    border-width: 0px;
    background-color: transparent;
    color: rgba(255,255,255,0.8);
    font-family: sans-serif;
    font-size: 13px;
    transition: ease-in-out all 0.3s;
}

.inputexamsemanalarea:hover{
    color: var(--color3);    
}

.inputexamsemanalarea:focus{
    color: white;   
}

.inputactividadestudiante{
    line-height: 13px;
    padding-top: 1px;
    text-align: center;
    height: 20px;
    width: 30px;
    outline: none;
    border-width: 0px;
    background-color: transparent;
    color: rgba(255,255,255,0.8);
    font-family: sans-serif;
    font-size: 13px;
    transition: ease-in-out all 0.3s;
    border-width: 1px;
    border-radius: 3px;
    border-style: solid;
    border-color: rgba(255,255,255,0.8);
}

.inputactividadestudiante:hover{
    color: var(--color3);
    border-color: var(--color3); 
}

.inputactividadestudiante:focus{
    color: var(--color3);   
    border-color: var(--color3);
}

.inputcompetenciaestudianteneutral{
    pointer-events: none;
    line-height: 13px;
    padding-top: 1px;
    text-align: center;
    height: 20px;
    width: 30px;
    outline: none;
    border-width: 0px;
    background-color: transparent;
    color: rgba(255,255,255,0.8);
    font-family: sans-serif;
    font-size: 13px;
    transition: ease-in-out all 0.3s;
    border-width: 1px;
    border-radius: 3px;
    border-style: solid;
    border-color: rgba(255,255,255,0.8);
}

.inputcompetenciaestudiante{
    line-height: 13px;
    padding-top: 1px;
    text-align: center;
    height: 20px;
    width: 30px;
    outline: none;
    border-width: 0px;
    background-color: transparent;
    color: rgba(255,255,255,0.8);
    font-family: sans-serif;
    font-size: 13px;
    transition: ease-in-out all 0.3s;
    border-width: 1px;
    border-radius: 3px;
    border-style: solid;
    border-color: rgba(255,255,255,0.8);
}

.inputcompetenciaestudiante:hover{
    color: rgb(194,176,218); 
    border-color: rgb(194,176,218); 
}

.inputcompetenciaestudiante:focus{
    color: rgb(194,176,218);    
    border-color: rgb(194,176,218);
}

.examsemanalperiodo{
    width: 100%;
    height: auto;
    margin-bottom: 5px;
}

.examsemanalperiodotitulo{
    padding-bottom: 3px;
    padding-top: 2px;
    font-size: 13px;
    font-weight: bold;
    font-style: italic;
    width: 100%;
    height: auto;
    text-decoration: underline;
}

.examcontenedorperiodo{
    margin-right: 5px;
    height: auto;
    width: 140px;
}

.examsemanalperiodotitulocalificaciones{
    font-family: sans-serif;
    padding-left: 7px;
    padding-top: 5px;
    font-size: 13px;
    font-weight: bold;
    width: 100%;
    height: auto;
    text-decoration: underline;
    color: rgb(74, 83 ,136);
}

.examsemanalperiodotitulo2{
    font-family: sans-serif;
    padding-bottom: 0px;
    padding-top: 5px;
    font-size: 13px;
    font-weight: bold;
    font-style: italic;
    width: 100%;
    height: auto;
    text-decoration: underline;
    color: rgb(74, 83 ,136);
}

.examsemanalperiodotitulo3{
    padding-left: 5px;
    text-align: left;
    font-family: sans-serif;
    padding-bottom: 0px;
    padding-top: 5px;
    font-size: 13px;
    font-weight: bold;
    font-style: italic;
    width: 100%;
    height: auto;
    color: rgb(74, 83 ,136);
}

#examenpreguntavisualizarid:hover{
    cursor: pointer;
    color: var(--color1);
}

.examsemanalperiodotitulo4{
    padding-right: 5px;
    padding-left: 5px;
    font-family: sans-serif;
    padding-bottom: 10px;
    padding-top: 5px;
    font-size: 13px;    
    width: 100%;
    height: auto;
    color: rgb(74, 83 ,136);
    text-align: justify;
    transition: ease-in-out all 0s;
    font-weight: bold;
}

.examsemanalperiodotitulo4:hover{
   cursor: pointer;
   color: var(--color1);   
}

.examsemanalperiodotitulo5{
    padding-right: 5px;
    padding-left: 5px;
    font-family: sans-serif;
    padding-bottom: 5px;
    padding-top: 5px;
    font-size: 15px;    
    width: 100%;
    height: auto;
    color: rgba(74, 83 ,136,0.8);
    text-align: justify;
    transition: ease-in-out all 0s;    
}

.examsemanalperiodotitulo7{
    padding-right: 5px;
    padding-left: 5px;
    font-family: sans-serif;
    padding-bottom: 5px;
    padding-top: 5px;
    font-size: 15px;    
    width: 100%;
    height: auto;
    color: rgba(74, 83 ,136,0.8);
    text-align: justify;
    transition: ease-in-out all 0.3s;    
}

.examsemanalperiodotitulo7:hover{    
    color: var(--color1);
    cursor:  auto;    
}

.examsemanalperiodotitulo6{
    padding-right: 5px;
    padding-left: 5px;
    font-family: sans-serif;
    padding-bottom: 5px;
    padding-top: 5px;
    font-size: 15px;    
    width: 100%;
    height: auto;
    color: rgb(22,160,133);
    text-align: justify;
    transition: ease-in-out all 0s;    
}

.examsemanalperiodotituloambar{
    padding-right: 5px;
    padding-left: 5px;
    font-family: sans-serif;
    padding-bottom: 5px;
    padding-top: 5px;
    font-size: 15px;    
    width: 100%;
    height: auto;
    color: rgb(241, 196, 15);
    text-align: justify;
    transition: ease-in-out all 0s;    
}

.examsemanalperiodotitulored{
    padding-right: 5px;
    padding-left: 5px;
    font-family: sans-serif;
    padding-bottom: 5px;
    padding-top: 5px;
    font-size: 15px;    
    width: 100%;
    height: auto;
    color: rgb(213,14,33);
    text-align: justify;
    transition: ease-in-out all 0s;    
}

.examcontenedorexamenes{
    width: 100%;
    height: auto;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    flex-direction: row;
    flex-wrap: wrap;
}

.examsemanalperiodocuerpo{
    width: 100%;
    height: auto;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    flex-direction: row;
    flex-wrap: wrap;
}

.examsemanal{
    margin-bottom: 5px;
    margin-left: 5px;
    background-color: var(--color1);
    color: white;
    height: 50px;
    width: 50px;
    border-radius: 3px;
    overflow: hidden;
    transition: ease-in-out all 0.3s;
}

.examsemanal:hover{
    cursor: pointer;
    color: var(--color1);
    background-color: var(--color3);
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.examsemanaltexto{
    width: 100%;
    height: 23px;
    font-style: italic;
    font-size: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.examsemanalicono{
    width: 100%;
    height: 27px;
    font-size: 18px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.examsemanaldatostitulo{
    border-width: 1px 0px 0px 0px;
    border-style: solid;
    border-color: var(--color1);
    width: 100%;
    height: 15px;
    background-color: var(--color1);
}

.aulavirtualclasedatostitulo{
    border-width: 1px 0px 0px 0px;
    border-style: solid;
    border-color: rgb(74, 83 ,136);
    width: 100%;
    height: 15px;
    background-color: rgb(74, 83 ,136);
}

.aulavirtualclasedatostitulo2{
    margin-top: 10px;
    border-width: 1px 0px 0px 0px;
    border-style: solid;
    border-color: rgb(74, 83 ,136);
    width: 100%;
    height: 15px;
    background-color: rgb(74, 83 ,136);
}

.examsemanaldatostituloleft{
    border-bottom-right-radius: 8px;
    float: left;
    width: 180px;
    height: 25px;
    background-color: var(--color1);
    color: white;
}

.examsemanaldatostituloright{
    border-top-left-radius: 8px;
    float: left;
    width: calc(100% - 180px);
    height: 25px;
    background-color: white;
}

.aulavirtualclasedatostituloleft{
    border-bottom-right-radius: 8px;
    float: left;
    width: 120px;
    height: 28px;
    background-color: rgb(74, 83 ,136);
    color: rgb(241, 196, 15);
}

.docentecalificacionesdatostituloleft{
    border-bottom-right-radius: 8px;
    float: left;
    width: 120px;
    height: 28px;
    background-color: rgb(74, 83 ,136);
    color: white;
}

.docenteexamendatostituloleft{
    border-bottom-right-radius: 8px;
    float: left;
    width: 230px;
    height: 28px;
    background-color: rgb(74, 83 ,136);
    color: white;
    transition: ease-in-out all 0.3s;
}

.docenteexamendatostituloleft2{
    border-bottom-right-radius: 8px;
    float: left;
    width: 230px;
    height: 28px;
    background-color: rgb(74, 83 ,136);
    color: white;
    transition: ease-in-out all 0.3s;
}

.docenteexamendatostituloleft:hover{    
    background-color: var(--color1); 
    cursor: pointer;
}

.docenteexamenpreguntatituloleft{
    border-bottom-right-radius: 8px;
    float: left;
    width: 120px;
    height: 28px;
    background-color: rgb(74, 83 ,136);
    color: white;
}

.aulavirtualclasedatostituloright{   
    border-top-left-radius: 8px;
    float: left;
    width: calc(100% - 120px);
    height: 28px;
    background-color: white;
}

.docenteexamendatostituloright{   
    border-top-left-radius: 8px;
    float: left;
    width: calc(100% - 230px);
    height: 28px;
    background-color: white;
}

.docentecalificacionesdatostituloright{   
    border-top-left-radius: 8px;
    float: left;
    width: calc(100% - 120px);
    height: 28px;
    background-color: white;
}

.docenteexamenpreguntatituloright{   
    border-top-left-radius: 8px;
    float: left;
    width: calc(100% - 120px);
    height: 28px;
    background-color: white;
}

#aulavirtualclasedatostitulorightidestudiante{
    font-weight: bold;    
    padding-left: 5px;
    padding-top: 5px;
    font-family: 'comic';
    font-size: 12px;
    color: rgb(74, 83 ,136);
}

.aulavirtualclasedatosbtneliminar{
    float: left;
    border-radius: 5px;
    margin-top: 3px;
    margin-left: 3px;
    width: 25px;
    height: 25px;
    background-color: rgb(74, 83 ,136);
    color: white;
    font-size: 14px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    transition: ease-in-out all 0.3s;
}

.aulavirtualclasedatosbtneliminar:hover{
    cursor: pointer;
    color: rgb(74, 83 ,136);
    background-color: rgb(241, 196, 15);    
}

.docenteexamendatosbtneliminar{
    float: left;
    border-radius: 5px;
    margin-top: 3px;
    margin-left: 3px;
    width: 25px;
    height: 25px;
    background-color: rgb(74, 83 ,136);
    color: white;
    font-size: 14px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    transition: ease-in-out all 0.3s;
}

.docenteexamendatosbtneliminar:hover{
    cursor: pointer;    
    background-color: var(--color1);    
}

.docentecalificacionesbtn{
    font-family: sans-serif;
    float: left;
    border-radius: 3px;
    margin-top: 3px;
    margin-left: 3px;
    width: 35px;
    height: 25px;
    background-color: rgb(74, 83 ,136);
    color: white;
    font-size: 13px;
    font-weight: bold;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    transition: ease-in-out all 0.3s;
}

.docentecalificacionesbtn:hover{
    cursor: pointer;    
    box-shadow: 0 0 7px rgba(74, 83 ,136,0.7);    
}

#BtnDocenteCalificacionesRegistros1{
    background-color: rgb(194,176,218);
}

.examsemanaldatostituloicono{
    float: left;
    height: 25px;
    width: 25px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-size: 13px;    
}

.examsemanaldatostitulotexto{
    float: left;
    height: 25px;
    width: calc(100% - 25px);   
    font-size: 12px;
    font-weight: bold;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;    
}

.aulavirtualclasedatostituloicono{
    padding-left: 5px;
    float: left;
    height: 25px;
    width: 25px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-size: 14px;    
}

.aulavirtualclasedatostitulotexto{
    padding-left: 5px;
    font-family: sans-serif;
    float: left;
    height: 25px;
    width: calc(100% - 25px);   
    font-size: 12px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap; 
    font-weight: bold;
}

.examsemanaldatosmodificar{    
    margin-top: 20px;    
    width: 100%;
    max-width: 250px;
    height: 120px;   
}

.examsemanaldatosmodificarleft{ 
    padding-left: 5px;
    overflow: hidden;
    float: left;
    width: calc(100% - 30px);
    height: auto;
    border-width: 2px 0px 2px 2px;
    border-color: var(--color1);
    border-style: solid;
    border-radius: 3px 0px 0px 3px;
}

.examsemanaldatosmodificarright{
    float: left;
    width: 30px;
    height: 100%;    
}

.examsemanaldatosmodificaritem{
    overflow: hidden;
    width: 100%;
    height: 25px;
    margin-bottom: 5px;
    border-radius: 3px;
}

.examsemanaldatodlabel{
    float: left;
    height: 100%;
    width: 60px;
    font-size: 12px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;    
}

.inputexamsemanaldatos{
    font-size: 12px;
    padding-left: 3px;
    float: left;
    max-width: 120px;
    height: 20px;
    margin-top: 2.5px;
    background-color: var(--color1);
    border-radius: 3px;
    color: white;
    outline: none;
    border-width: 0px;
}

.optionexamsemanal{
    outline: none;
    background-color: white;
    color: var(--color1);
}

.btnexamsemanladatos{
    margin-top: 0px;
    margin-left: 0px;
    background-color: var(--color1);
    height: calc(100% + 4px);
    width: 30px;
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap; 
    font-size: 20px;    
    border-radius: 0px 3px 3px 0px;
    transition: ease-in-out all 0.3s;
}

.btnexamsemanladatos:hover{
    color: var(--color3);
    cursor: pointer;
}

.examsemanalpreguntastitulo{
    margin-top: 15px;
    border-width: 2.5px 0px 0px 0px;
    border-style: solid;
    border-color: rgb(179,164,238);
    width: 100%;
    height: 15px;
    background-color: rgb(179,164,238);
}

.examsemanalpreguntastituloleft{
    border-bottom-right-radius: 8px;
    float: left;
    width: 180px;
    height: 25px;
    background-color: rgb(179,164,238);
    color: white;
}

.examsemanalpreguntastituloright{
    border-top-left-radius: 8px;
    float: left;
    width: calc(100% - 180px);
    height: 25px;
    background-color: white;
}

.examsemanalpreguntastituloicono{
    float: left;
    height: 25px;
    width: 25px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-size: 15px;    
}

.examsemanalpreguntastitulotexto{
    float: left;
    height: 25px;
    width: calc(100% - 25px);   
    font-size: 12px;
    font-weight: bold;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;    
}

.examsemanalpreguntacontenedor{
    margin-top: 20px;
    width: 100%;
    max-width: 500px;
    height: 140px;
}

.examsemanalpreguntacontenedor2{
    margin-top: 23px;
    width: 100%;
    max-width: 500px;
    height: 120px;
}

.examsemanalpreguntacontenedor3{
    margin-top: 10px;
    width: 100%;
    max-width: 500px;
    height: 120px;
}

.examsemanalpreguntacontenedorleft{
    padding-left: 5px;
    float: left;
    height: 100%;
    width: calc(100% - 30px);
    border-width: 2px 0px 2px 2px;
    border-color: rgb(179,164,238);
    border-style: solid;
    border-radius: 3px 0px 0px 3px;
}

.examsemanalpreguntacontenedorleft2{    
    float: left;
    height: 100%;
    width: calc(100% - 30px);    
}

.examsemanalpreguntacontenedorleft3{    
    float: left;
    height: 100%;
    width: calc(100% - 65px);    
}

.selectexamsemanalpregunta{
    margin-top: 5px;
    outline: none;
    border-width: 0px;
    background-color: rgb(179,164,238);
    color: white;
    font-size: 12px;
    padding-left: 3px;
    width: 200px;
    height: 20px;
}

.textareaexamsemanalpregunta{
    color: rgb(74, 83 ,136);
    font-size: 12px;
    text-align: justify;
    padding: 5px;
    margin-top: 5px;
    outline: none;
    resize: none;
    width: calc(100% - 5px);
    height: 100px;
    border-radius: 3px;
    border-width: 1px;
    border-style: solid;
    border-color: rgb(179,164,238);
    font-style: italic;
    font-family: sans-serif;
}

.formexamendocentepreguntainsertar{
    height: 100%;
    width: 100%;
}

.textareaexamsemanalpregunta2{
    color: rgb(74, 83 ,136);
    font-size: 12px;
    text-align: justify;
    padding: 5px;
    margin-top: 5px;
    outline: none;
    resize: none;
    width: calc(100% - 5px);
    height: calc(100% - 10px);
    border-radius: 3px;
    border-width: 1px;
    border-style: solid;
    border-color: rgb(74, 83 ,136);
    font-style: italic;
    font-family: sans-serif;
}

.textareaexamsemanalpregunta2::placeholder{
    color: rgba(74, 83 ,136,0.4);    
}

.textareaexamsemanalpregunta3{
    color: rgb(74, 83 ,136);
    font-size: 12px;
    text-align: justify;
    padding: 5px;
    outline: none;
    resize: none;
    width: calc(100% - 5px);
    height: 100%;
    border-radius: 3px;
    border-width: 1px;
    border-style: solid;
    border-color: rgb(74, 83 ,136);
    font-style: italic;
    font-family: sans-serif;
}

.textareaexamsemanalpregunta3::placeholder{
    color: rgba(74, 83 ,136,0.4);    
}

.examsemanalpreguntacontenedorright{
    float: left;
    height: 100%;
    width: 30px;    
}

.examsemanalpreguntacontenedorright2{
    float: left;
    height: 100%;
    width: 65px;    
}

.btnexamsemanalpreguntanueva{
    margin-top: 0px;
    margin-left: 0px;
    background-color: rgb(179,164,238);
    height: 100%;
    width: 30px;
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap; 
    font-size: 20px;    
    border-radius: 0px 3px 3px 0px;
    transition: ease-in-out all 0.3s;
}

.btnexamsemanalpreguntanueva:hover{
    color: rgb(99,224,224);
    cursor: pointer;
}

.btnexamsemanalpreguntanueva2{
    border-width: 1px;
    border-style: solid;
    border-color: rgb(74, 83 ,136);
    margin-top: 5px;
    margin-left: 0px;
    background-color: rgb(74, 83 ,136);
    height: calc(100% - 10px);
    width: 30px;
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap; 
    font-size: 20px;    
    border-radius: 3px;
    transition: ease-in-out all 0.3s;
}

.btnexamsemanalpreguntanueva2:hover{
    background-color: var(--color1);
    cursor: pointer;
}

.btnexamsemanalpreguntanueva3{
    float: left;
    border-width: 1px;
    border-style: solid;
    border-color: rgb(74, 83 ,136);
    margin-top: 5px;
    margin-left: 0px;
    background-color: rgb(74, 83 ,136);
    height: calc(100% - 10px);
    width: 30px;
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap; 
    font-size: 20px;    
    border-radius: 3px;
    transition: ease-in-out all 0.3s;
}

.btnexamsemanalpreguntanueva3:hover{
    background-color: var(--color1);
    cursor: pointer;
}

.btnexamsemanalpreguntanueva4{
    float: left;
    border-width: 1px;
    border-style: solid;
    border-color: rgb(74, 83 ,136);
    margin-top: 5px;
    margin-left: 5px;
    background-color: rgb(74, 83 ,136);
    height: calc(100% - 10px);
    width: 30px;
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap; 
    font-size: 20px;    
    border-radius: 3px;
    transition: ease-in-out all 0.3s;
}

.btnexamsemanalpreguntanueva4:hover{
    background-color: var(--color1);
    cursor: pointer;
}

.contenedorexamsemanalareapregunta{
    margin-top: 10px;
    width: 100%;
    height: auto;
    border-width: 1px 0px 0px 0px;
    border-style: solid;
    border-color: rgb(179,164,238);
}

.contenedorexamenpregunta{
    margin-top: 10px;
    width: 100%;
    height: auto;
    border-width: 1px 0px 0px 0px;
    border-style: solid;
    border-color: rgb(74, 83 ,136);
}

.examsempreguntaarea{
    width: 100%;
    height: auto;
    margin-top: 5px;
}

.examsempreguntaareatitulo{
    color: rgb(179,164,238);
    padding-bottom: 3px;
    padding-top: 2px;
    font-size: 13px;
    font-weight: bold;
    font-style: italic;
    width: 100%;
    height: auto;
    text-decoration: underline;
}

.examsempreguntaareacuerpo{
    width: 100%;
    height: auto;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    flex-direction: row;
    flex-wrap: wrap;
}

.examsempreguntaareacuerpo2{
    margin-top: 10px;
    width: 100%;
    height: auto;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    flex-direction: row;
    flex-wrap: wrap;
}



.examsemanalpregunta{
    margin-bottom: 5px;
    margin-left: 5px;
    background-color: rgb(179,164,238);
    color: white;
    height: 50px;
    width: 50px;
    border-radius: 3px;
    overflow: hidden;
    transition: ease-in-out all 0.3s;
}

.examsemanalpregunta:hover{
    cursor: pointer;
    color: rgb(99,224,224);    
}

.examenpreguntaitem{
    user-select: none;
    font-family: sans-serif;
    border-radius: 50%;
    margin-bottom: 5px;
    margin-left: 5px;
    background-color: rgb(74, 83 ,136);
    color: white;
    height: 50px;
    width: 50px;
    overflow: hidden;
    transition: ease-in-out all 0.3s;
}

.examenpreguntaitem:hover{
    cursor: pointer;
     background-color: var(--color1);
}

.examsemanalpreguntatexto{
    width: 100%;
    height: 20px;
    font-size: 14px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-weight: bold;
}

.examsemanalpreguntaicono{
    padding-top: 5px;
    width: 100%;
    height: 30px;
    font-size: 25px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.examsempreguntadetalle{
    padding-bottom: 10px;
    margin-top: 5px;
    width: 100%;
    height: auto;
    border-width: 1px 0px 0px 0px;
    border-style: solid;
    border-color: rgb(179,164,238);
}

.examsempreguntadetalle2{
    padding-bottom: 10px;
    margin-top: 5px;
    width: 100%;
    height: auto;
    border-width: 1px 0px 0px 0px;
    border-style: solid;
    border-color: rgb(74, 83 ,136);
}

.contenedorexamsempreguntaedit{
    margin-top: 5px;
    margin-bottom: 5px;
    width: 100%;
    height: auto;
}

.examsempreguntaedit{
    height: 100px;
    width: 100%;
    max-width: 500px;
}

.examsempreguntaeditleft{
    height: 100%;
    width: calc(100% - 30px);
    float: left;
}

.examsempreguntaeditright{
    height: 100%;
    width: 30px;
    float: left;
    background-color: rgb(179,164,238);
    border-radius: 0px 3px 3px 0px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.textareaexamsemanalpreguntaedit{
    color: rgb(74, 83 ,136);
    font-size: 12px;
    text-align: justify;
    padding: 5px;
    outline: none;
    resize: none;
    width: 100%;
    height: 100%;
    border-radius: 3px 0px 0px 3px;
    border-width: 1px;
    border-style: solid;
    border-color: rgb(179,164,238);
    font-style: italic;
    font-family: sans-serif;
}

.btnexamsempreguntaedit{
    transition: ease-in-out all 0.3s;
    height: 30px;
    width: 30px;
    font-size: 18px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    color: white;
}

.btnexamsempreguntaedit:hover{
    cursor: pointer;
    color: rgb(99,224,224);
}

.btnexamsempreguntaedit2{
    border-radius: 50%;
    transition: ease-in-out all 0.3s;
    height: 25px;
    width: 25px;
    font-size: 15px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    color: white;
}

.btnexamsempreguntaedit2:hover{
    cursor: pointer;
    background-color: var(--color1);
    box-shadow: 0 0 5px rgba(255,255,255,0.6);
}

.contenedorexamsempreguntaimgedit{
    margin-top: 0px;
    width: 100%;
    height: auto;
}

.contenedorexamsempreguntaimgedit2{
    margin-top: 30px;
    width: 100%;
    height: auto;
}

.contenedorexamsempreguntaimgedit3{
    margin-top: 10px;
    width: 100%;
    height: auto;
}

.examsempreguntaimgedit{
    height: 150px;
    width: 100%;
    max-width: 500px;
}

.examsempreguntaimgedit2{
    margin-top: 5px;
    height: 150px;
    width: 100%;
    max-width: 500px;
}

.examsempreguntaimgedit3{
    margin-top: 5px;
    height: 100px;
    width: 100%;
    max-width: 500px;
}

.examsempreguntaimgedit4{
    margin-top: 0px;
    height: 30px;
    width: 100%;    
}

.examsempreguntaimgeditleft{
    padding: 5px;
    height: 100%;
    width: calc(100% - 30px);
    float: left;
    border-radius: 3px 0px 0px 3px;
    border-width: 1px;
    border-style: solid;
    border-color: rgb(179,164,238);
}

.examsempreguntaimgeditleft2{
    padding: 5px;
    height: 100%;
    width: calc(100% - 30px);
    float: left;
    border-radius: 3px 0px 0px 3px;
    border-width: 1px;
    border-style: solid;
    border-color: rgb(74, 83 ,136);
}

.examsempreguntaimgeditright{
    height: 100%;
    width: 30px;
    float: left;
    background-color: rgb(179,164,238);
    border-radius: 0px 3px 3px 0px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.examsempreguntaimgeditright2{
    height: 100%;
    width: 30px;
    float: left;
    background-color: rgb(74, 83 ,136);
    border-radius: 0px 3px 3px 0px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.examsempreguntaimgeditright3{
    height: 100%;
    width: 30px;
    float: left;
    background-color: rgb(74, 83 ,136);
    border-radius: 3px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.contenedorexamsempreguntaimgfile{
    padding: 2.5px;
    height: 30px;
    width: 100%;
    border-radius: 3px;
    border-width: 1px;
    border-style: solid;
    border-color: rgb(179,164,238);
    overflow: hidden;
}

.contenedorexamsempreguntaimgfile2{
    padding: 2.5px;
    height: 30px;
    width: 100%;
    border-radius: 3px;
    border-width: 1px;
    border-style: solid;
    border-color: rgb(74, 83 ,136);
    overflow: hidden;
}

#fileexamsempreguntaimgid{
    outline: none;
    color: rgb(179,164,238);
}

#fileexamsempreguntaimgid2{
    outline: none;
    color: rgba(74, 83 ,136,0.8);
}

.contenedorexamsempreguntaimgmin{
    overflow: hidden;
    position: relative;
    color: rgba(79,164,238,0.6);
    font-size: 50px;
    text-align: center;
    margin-top: 5px;
    padding: 2.5px;
    height: 105px;
    width: 100%;
    border-radius: 3px;
    border-width: 1px;
    border-style: solid;
    border-color: rgb(179,164,238);
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.contenedorexamsempreguntaimgmin2{
    overflow: hidden;
    position: relative;
    color: rgba(74, 83 ,136,0.4);
    font-size: 50px;
    text-align: center;
    margin-top: 5px;
    padding: 2.5px;
    height: 105px;
    width: 100%;
    border-radius: 3px;
    border-width: 1px;
    border-style: solid;
    border-color: rgb(74, 83 ,136);  
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.contenedorexamsempreguntaimgmin3{
    overflow: hidden;
    position: relative;
    color: rgba(74, 83 ,136,0.4);
    font-size: 50px;
    text-align: center;
    margin-top: 5px;
    padding: 2.5px;
    height: 105px;
    width: 100%;    
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.examsempreguntaimggifloading{
    pointer-events: none;
    opacity: 0;
    z-index: 3;
    width: 100%;
    height: 100%;
    display: none;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    position: absolute;
    background-color: white;
}

#estudianarchivoimggifloadingid{
    width: 35px;
    margin-top: -65px;    
    position: absolute;
}

#imgloadingexamsempreguntaimg{
    height: 50px;
    width: auto;    
}

#imgloadingactividadplazoimg{
    height: 30px;
    width: auto;    
}

.examsempreguntaimgmindiv{
    opacity: 0.8;
    height: 90px;
    width: auto;
    overflow: hidden;
    border-radius: 3px;
    border-width: 3px;
    border-style: solid;
    border-color: rgb(179,164,238); 
    transition: ease-in-out all 0.3s;
}

.examsempreguntaimgmindiv:hover{
    cursor: pointer;
    opacity: 1;
    box-shadow: 0 0 5px rgba(0,0,0,0.7);
}

.examsempreguntaimgmindiv2{
    opacity: 0.8;
    height: 90px;
    width: auto;
    overflow: hidden;
    border-radius: 3px;
    border-width: 3px;
    border-style: solid;
    border-color: rgb(74, 83 ,136); 
    transition: ease-in-out all 0.3s;
}

.examsempreguntaimgmindiv2:hover{
    cursor: pointer;
    opacity: 1;
    box-shadow: 0 0 5px rgba(0,0,0,0.7);
}

#imgminexamsempreguntaimg{
    height: 90px;
    width: auto;
}

.examsempreguntaimgdiv{
    width: 100%;
    height: 100%;
    overflow-x: scroll;
    overflow-y: scroll;
}

.examsempreguntaimgdiv2{
    text-align: center;
    width: 100%;
    height: 100%;
    overflow-x: scroll;
    overflow-y: scroll;        
}

.contenedorimgpago{ 
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    width: 100%;
    height: 100%;
    overflow-x: scroll;
    overflow-y: scroll;        
}

.imgminexamsempreguntaimgfull{ 
    margin: auto;
    width: auto;
    max-width: 1200px;
    height: auto;
}

.imgpagofull{ 
    transition: ease-in-out all 0.5s;    
    width: 100%;
    max-width: 800px;
    height: auto;
}

.estudianteactividadiframepdf{
    width: 100%;
    height: 100%;
    border-width: 0px;
    border-radius: 10px;
}

.pantallaestudiantehorario{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    height: 100%;
    width: 100%;
}

.pantallaestudiantepagobancos{
    padding: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    height: auto;
    width: 100%;
}

.contenedorestudiantecurso{
    position: relative;
    overflow: hidden;
    width: 220px;
    height: auto;    
    border-radius: 5px;
    box-shadow: 0 0 4px rgba(0,0,0,0.6);
    margin: 7px;
}

.contenedorestudiantecursotop{
    padding: 5px;
    background-color: rgb(240, 98, 146);
    width: 100%;
    height: 80px;    
}

.contenedorestudiantecursonombre{
    text-align: center;
    height: 35px;
    width: 100%;
    font-family: sans-serif;
    font-size: 14px;
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.contenedorestudiantecursobottom{
    padding: 5px;
    width: 100%;
    height: auto;
    background-color: white;    
}

.vacacionalgrupobottom{
    padding: 5px;
    width: 100%;
    height: auto;
    min-height: 50px;
    background-color: white;    
}

.contenedorestudiantecursocirculo{
    box-shadow: 0 0 3px rgba(0,0,0,0.6);
    border-radius: 50%;
    width: 80px;
    height: 80px;
    margin-left: 70px;
    margin-top: 40px;
    position: absolute;
    background-color: rgb(253,239,244);
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-size: 35px;
    color: rgb(240, 98, 146);
}

.contenedorestudiantecursodocente{   
    min-height: 30px;
    height: auto;
    width: 100%;
    color: rgb(74,83,136);
}

.contenedorestudiantecursodocenteaulavirtual{
    padding: 3px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    min-height: 25px;
    height: auto;
    width: 100%;
    color: rgb(74,83,136);
}



#contenedorestudiantecursodocentefirst{    
    margin-top: 35px;
    height: 35px;
}

#contenedorestudiantecursodocentehorario{
    height: 30px;
    color: rgb(240, 98, 146);
}    

#contenedorestudiantecursodocentelast{
    border-width: 0px 0px 1px 0px;
    border-style: solid;
    border-color: rgb(240, 98, 146);
}

.contenedorestudiantecursodocenteicono{ 
    float: left;
    height: 100%;
    width: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-size: 15px;    
}

.contenedorestudiantecursodocentenombre{
    height: 100%;
    width: calc(100% - 30px);
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-size: 12px;    
    font-family: sans-serif;
    font-style: italic;
}

.contenedorestudiantecursodocenteleft{
    float: left;
    height: 25px;
    width: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-size: 15px;    
}

#contenedorestudiantecursodocenteleftdia{
    width: 40px;
    font-family: sans-serif;
    font-size: 12px;
    color: rgb(240, 98, 146);
}

.contenedorestudiantecursodocenteright{
    float: left;
    height: 25px;
    width: calc(100% - 30px);
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-size: 12px;    
    font-family: sans-serif;
    font-style: italic;
}

#contenedorestudiantecursodocenterighthora{
    width: calc(100% - 40px);
    font-family: sans-serif;
    font-size: 12px;
}

.cotenedorvacacional{
    width: 100%;
    height: auto;
    padding: 30px 10px 20px 10px;
}

.vacacionaltitulo{
    height: auto;
    padding:  0px 5px;
    font-family: 'comic';
    font-size: 25px;
    color: var(--color2);
}

.vacacionalduracion{
    height: auto;
    padding: 5px;
    font-family: sans-serif;
    font-size: 14px;
    font-style: italic;
    color: rgb(130,130,130);
}

.vacacionalimportante{
    height: auto;
    padding: 5px;
    font-family: 'comic';
    font-size: 14px;
    color: rgb(130,130,130);
    margin-bottom: 20px;
}

.vacacionalcontenedorgrupo{
    margin: auto;
    width: 100%;
    padding: 20px 10px 10px 10px;
    height: auto;
    max-width: 900px;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 20px;
}

.contenedorgrupopropuesta{
    margin: auto;
    width: 100%;
    padding: 20px 10px 10px 10px;
    height: auto;
    max-width: 1200px;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 40px;
}

.imgpropuesta{
    box-sizing: border-box;
    border-width: 5px;
    border-style: solid;
    border-color: black;
    border-radius: 0px;
    overflow: hidden;
    width: calc(100% - 25px);
    max-width: 450px;
    height: auto; 
    box-shadow: 0 0 10px rgba(0,0,0,0.6);    
}

#imgpropuesta1{
    transform: rotate(5deg);
}

#imgpropuesta2{
    transform: rotate(0deg);
}

#imgpropuesta3{
    transform: rotate(0deg);
}

#imgpropuesta4{
    transform: rotate(-5deg);
}

.imginfraestructura{
    box-sizing: border-box;
    border-width: 5px;
    border-style: solid;
    border-color: black;
    border-radius: 0px;
    overflow: hidden;
    width: 100%;
    max-width: 550px;
    height: auto; 
    box-shadow: 0 0 10px rgba(0,0,0,0.6);    
}

#imginfraestructura1{
    transform: rotate(5deg);
}

#imginfraestructura2{
    transform: rotate(0deg);
}

#imginfraestructura3{
    transform: rotate(0deg);
}

#imginfraestructura4{
    transform: rotate(-5deg);
}

#imginfraestructura5{
    transform: rotate(5deg);
}

#imginfraestructura6{
    transform: rotate(0deg);
}

#imginfraestructura7{
    transform: rotate(0deg);
}

#imginfraestructura8{
    transform: rotate(-5deg);
}

#imginfraestructura9{
    transform: rotate(0deg);
}


.vacacionalgrupo{
    position: relative;
    overflow: hidden;
    width: 200px;
    height: auto;    
    border-radius: 5px;
    box-shadow: 0 0 7px rgba(0,0,0,0.6);
}

.vacacionalgrupocirculo{
    font-family: sans-serif;
    font-size: 16px;
    font-weight: bold;
    box-shadow: 0 0 3px rgba(0,0,0,0.6);
    border-radius: 5px;
    width: 80px;
    height: 40px;
    margin-left: 60px;
    margin-top: 40px;
    position: absolute;
    background-color: rgb(255,255,255);
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.matriculagrupocirculo{
    font-family: sans-serif;
    font-size: 16px;
    font-weight: bold;
    box-shadow: 0 0 3px rgba(0,0,0,0.6);
    border-radius: 50%;
    width: 75px;
    height: 75px;
    margin-left: 120px;
    margin-top: 15px;
    position: absolute;
    background-color: rgb(255,255,255);
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.vacacionalgrupotop{
    padding: 5px;
    width: 100%;
    height: 60px;    
}

.matriculagrupotop{
    padding: 5px;
    width: 100%;
    height: 100px;    
}

.vacacionalgruponombre{
    color: rgba(255,255,255,0.9);
    text-align: center;
    height: 35px;
    width: 100%;
    font-family: 'comic';
    font-size: 14px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.mariculagruponombre{
    margin-top: 27.5px;
    color: rgba(255,255,255,0.9);
    text-align: center;
    height: 35px;
    width: calc(100% - 80px);
    font-family: 'comic';
    font-size: 13px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.vacacionalgruposubtitulo{
    min-height: 25px;
    height: auto;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

#vacacionalgruposubtitulofirst{
    margin-top: 20px;
}

.bordergrupo1{    
    box-sizing:  content-box;
    padding-bottom: 5px;
    border-width: 0px 0px 1px 0px;
    border-style: solid;
    border-color: rgb(22, 160, 133);
}

.bordergrupo2{
    box-sizing:  content-box;
    padding-bottom: 5px;
    border-width: 0px 0px 1px 0px;
    border-style: solid;
    border-color: rgb(74, 83 ,136);
}

.bordergrupo3{
    box-sizing:  content-box;
    padding-bottom: 5px;
    border-width: 0px 0px 1px 0px;
    border-style: solid;
    border-color: rgb(241, 196, 15);
}

.bordergrupo4{
    box-sizing:  content-box;
    padding-bottom: 5px;
    border-width: 0px 0px 1px 0px;
    border-style: solid;
    border-color: rgb(52, 152, 219);
}

.bgcolor1{
    background-color: rgb(22, 160, 133);
}

.bgcolor2{
    background-color: rgb(74, 83 ,136);
}

.bgcolor3{
    background-color: rgb(241, 196, 15);
}

.bgcolor4{
    background-color: rgb(52, 152, 219);
}

.color1{
    color: rgb(22, 160, 133);
}

.color2{
    color: rgb(74, 83 ,136);
}

.color3{
    color: rgb(241, 196, 15);
}

.color4{
    color: rgb(52, 152, 219);
}

.vacacionalgruposubtituloicono{ 
    float: left;
    height: 100%;
    width: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-size: 15px;    
}

.vacacionalgruposubtitulonombre{
    height: 100%;
    width: calc(100% - 30px);
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-size: 12px;    
    font-family: sans-serif;
    font-style: italic;
}

.vacacionalgrupoitem{
    padding-left: 10px;
    height: 17px;
    width: 100%;
    color: rgba(0,0,0,0.5);
}

#vacacionalgrupoitemlast{
    width: calc(100% - 10px);
}

.vacacionalgrupoitemicono{ 
    float: left;
    height: 100%;
    width: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-size: 8px;    
}

.vacacionalgrupoitemnombre{
    height: 100%;
    width: calc(100% - 20px);
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-size: 12px;    
    font-family: sans-serif;
    font-style: italic;
}

.vacacoinalcontenedorinscripcion{    
    background-color: white;
    margin: auto;
    margin-top: 30px;
    width: 100%;
    padding: 10px;
    height: auto;
    max-width: 860px;
    border-radius: 5px;
    box-shadow: 0 0 7px rgba(0,0,0,0.6);
}

.pantallaloginmatricula{
    margin-top: 20px;
    width: 100%;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 50px;
}

.pantallaloginmatriculaest2020{
    width: 100%;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 30px;
}

.contenedorloginmatricula{
    width: 150px;
    height: 150px;
}

.contenedorloginmatriculaprocedimiento{
    width: 350px;
    height: 350px;
}

#contenedorloginmatriculaprocedimientovertical{
    width: 100%;
    max-width: 550px;
    height: auto;
}


.imgmatest2020{
    width: 100%;
    height: 100%;
    object-fit: contain;
}



.contenedorloginmatriculatop{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    width: 100%;
    height: 130px;
}

.iconologinmatricula{
    color: var(--color1);
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    width: 105px;
    height: 105px;
    font-size: 40px;
    border-radius: 50%;
    box-shadow: 0 0 7px rgba(0,0,0,0.6);
    transition: ease-in-out all 0.1s;
}

#iconologinmatriculanuevo{
    color: rgb(22, 160, 133);
}

.iconologinmatriculamin{
    font-size: 20px;
}

.iconologinmatricula:hover{
    width: 120px;
    height: 120px;
    cursor: pointer;
}

.contenedorloginmatriculabottom{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    width: 100%;
    height: 20px;
}

.iconologinmatriculatexto{
    color: var(--color1);
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-family: 'comic';
    font-size: 16px;
}

#iconologinmatriculatextonuevo{
    color: rgb(22, 160, 133);
}

.vacacionalinscripciontitulo{
    width: 100%;
    height: auto;
    padding:  0px 5px;
    font-family: 'comic';
    font-size: 18px;
    color: var(--color1);
    margin-bottom: 10px;
}

.matest2020titulo{
    width: 100%;
    height: auto;
    padding:  0px 5px;
    font-family: 'comic';
    font-size: 18px;
    color: var(--color1);
    margin-top: 10px;
}

#adevertenciapremat{
    text-align: center;
    font-size: 15px;
    color: rgb(241, 196, 15);
}

#adevertenciaprematred{
    text-align: center;
    font-size: 15px;
    color: red;
}

#successpremat{
    text-align: center;
    font-size: 15px;
    color: rgb(22, 160, 133);
}

#tituloestudiantematricula{
    text-align: center;
    color: rgb(125,84,181);
}

#nombreestudiantematricula{
    text-align: center;
    color: rgb(130,130,130);
    font-size: 14px;
}

.vacacionalinscripcionparrafo{
    margin: 5px 0px;
    width: 100%;
    text-align: justify;
    height: auto;
    padding:  0px 5px;
    font-family: 'comic';
    font-size: 14px;
    color: rgb(130,130,130);
}


#seccioncalificacionesbtnimprimirtutoria{
    margin-top: 3px;
    margin-left: 5px;
    width: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: ease-in-out all 0.1s;
}

#seccioncalificacionesbtnimprimirtutoria:hover{
    cursor: pointer;
    margin-top: 0px;
}

#seccioncalificacionesbtntareasacademicastutoria{
    margin-top: 3px;
    margin-left: 5px;
    width: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: ease-in-out all 0.1s;
}

#seccioncalificacionesbtntareasacademicastutoria:hover{
    cursor: pointer;
    margin-top: 0px;
}


#seccioncalificacionesbtnlibretanotastutoria{
    margin-top: 3px;
    background-color: rgb(22, 160, 133);
    margin-left: 5px;
    width: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: ease-in-out all 0.1s;
}

#seccioncalificacionesbtnlibretanotastutoria:hover{
    cursor: pointer;
    margin-top: 0px;
}

.contenedorbtnprocesarordenmerito{
    width: 100%;
    height: auto;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    
}

.btnprocesarordenmerito{
    padding: 5px;
    background-color: rgb(74, 83 ,136);
    margin-top: 5px;
    margin-left: 5px;
    width: 120px;
    height: 50px;
    border-radius: 5px;
    color: white;
    font-family: 'comic';
    font-size: 13px;  
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    transition: ease-in-out all 0.3s;
}

.contenedorordenmeritotabla{
    border-color: rgb(74, 83 ,136);
    border-width: 1px 0px 0px 0px;
    border-style: solid;
    padding-top: 10px;
    margin-top: 10px;
    width: 100%;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-direction: row;
    flex-wrap: wrap;
}

.btnprocesarordenmerito:hover{
    cursor: pointer;
    background-color: rgb(22, 160, 133);
}

.seccioncalificacionesbtnom{
    margin-top: 3px;
    background-color: rgb(74, 83 ,136);
    margin-left: 5px;
    width: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: ease-in-out all 0.1s;
    font-family: sans-serif;
    font-size: 12.5px; 
    font-weight: bold;
}

.seccioncalificacionesbtnom:hover{
    cursor: pointer;
    margin-top: 0px;
}

#seccioncalificacionesbtnimprimir{
    margin-left: 5px;
    width: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: ease-in-out all 0.3s;
}

#seccioncalificacionesbtnimprimir:hover{
    cursor: pointer;
    background-color: rgb(194,176,218);
}

#seccioncalificacionesbtntareasacademicas{
    margin-left: 5px;
    width: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: ease-in-out all 0.3s;
}

#seccioncalificacionesbtntareasacademicas:hover{
    cursor: pointer;
    background-color: rgb(194,176,218);
}


#seccioncalificacionesbtnlibretanotas{
    margin-left: 5px;
    width: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: ease-in-out all 0.3s;
}

#seccioncalificacionesbtnlibretanotas:hover{
    cursor: pointer;
    background-color: rgb(194,176,218);
}

.margintop10px{
    margin-top: 10px;
}



@page {
  size: A4 landscape; 
  margin: 0.8cm;
  
}

@media print{
   
   .bodyimprimir2{
       position: relative;
       webkit-print-color-adjust: exact; 
       color-adjust: exact;
       background-color: white;
    }
    
    .bodyimprimir{
       background-color: white;
    }
    
    .hojaimp{
        margin: 0px auto;
        padding-bottom: 0px;
    }
    
    .hojaimp2{  
        position: relative;
        margin: 0;
        width: 100%;
        height: 734px;
        page-break-before:always;
    }
    
    .hojaimp2center{
        width: 100%;
        height: calc(100% - 180px);
    }
    
    .contenedorbtnimp{
        display: none;
    }
    
    .tabla4trb:hover{
        background-color: transparent;
    }
    
    .contenedorobservacionesbottom2{    
        font-size: 8px;
    }
}

@media screen and (max-width: 1280px){
    
    .slidersesgo{        
        border-width: 0px 0px 120px 100vw;        
    }
    .contenedorimgskwedsesgotop{        
        border-width: 120px 100vw 0px 0px;
    }
    
    .contenedorimgskwedsesgobottom{        
        border-width: 0px 0px 120px 100vw;        
    }
    
    .contenedorinfoprincipalsesgo{        
        border-width: 0px 0px 120px 100vw;        
    }        
    
    #pantallaestudianteleft{        
        grid-template-columns: repeat(3,1fr);
    }
    
    .itemestudianteasistencia2{        
        font-size: 15px;
    }
    
    .diasemana{        
        font-size: 30px;
    }
    
    #itemestudianteasistenciacontrol{        
        font-size: 27px;
    }    
}

.eyered{
    color: rgb(231,86,72);
    font-size: 17px;
}

.eyegreen{
    color:  rgb(22, 160, 133);
    font-size: 17px;
}

@media screen and (max-width: 1100px){
    .docentecursoexameninsertar{  
        height: 72px;            
    } 
    
    .docentecursoexameninsertar2{  
        height: 72px;            
    }  
}

@media screen and (max-width: 1024px){
    
    .slidersesgo{        
        border-width: 0px 0px 90px 100vw;        
    }
    
    .pantallasliderleft{
        width: 180px;
    }
    
    .pantallasliderrigth{        
        width: calc(100% - 180px);
    }
    
    .pantallasliderrigthimg{        
        border-width: 6px;        
    }
    
    .contenedorimgskwedsesgobottom{        
        border-width: 0px 0px 90px 100vw;        
    }
    
    .contenedorimgskwedsesgotop{        
        border-width: 90px 100vw 0px 0px;
    }
    
    .imginfoprincipal{    
        height: auto;
        width: calc(100% - 20px);
    }
    
    .contenedorinfoprincipalsesgo{        
        border-width: 0px 0px 90px 100vw;        
    }
    
    #boxitemestudianteasistenciaid1{ 
       grid-column: 1/7;
    }
    
    #boxitemestudianteasistenciaid2{
        grid-column: 7/31;
    }
    
}

@media screen and (max-width: 900px){
    .contendornosostrosimg{       
        width: 157px;        
    }
    
    .contendornosostrostexto{ 
        width: calc(100% - 157px);
    }
}

@media screen and (max-width: 800px){
    ::-webkit-scrollbar {
        width: 0px; }
    
    #imglogoloader{
        height: 150px;
        animation: animarinsignia 1.5s infinite;
    }

    @keyframes animarinsignia{
        0%{height: 150px;}
        50%{height: 200px;}    
        100%{height: 150px;}    
    }
    
    .slidersesgo{        
        border-width: 0px 0px 70px 100vw;        
    }
    
    .pagination{        
        top: 87%;       
    }
    
    .pantallasliderleftcontenedorimg{        
        border-width: 2px;
    }
    
    .pantallasliderleft{
        width: 140px;
    }
    
    .pantallasliderrigth{        
        width: calc(100% - 140px);
    }
    
    .pantallasliderrigthimg{        
        border-width: 4px;        
    }
    
    .contenedorimgskwedsesgobottom{        
        border-width: 0px 0px 70px 100vw;        
    }
    
    .contenedorimgskwedsesgotop{        
        border-width: 70px 100vw 0px 0px;
    }
    
    .contenedorimginfoprincipal{        
        width: 100%;
        height: auto;
        float:  none;
        padding-bottom: 10px;
    }
    
    .contenedortextoinfoprincipal{        
        width: 100%;
        height: auto;
        float:  none;
        font-size: 15px;
    }
    
    .imginfoprincipal{    
        width: auto;
        height: 180px;
    }
    
    .contenedorinfoprincipalsesgo{        
        border-width: 0px 0px 70px 100vw;        
    }
    
    .patallaprincipalbottomindividual{
        margin-left: 5px;
        float: none;
        width: calc(100% - 10px);
        height: 50%;        
        border-width: 0px 0px 1px 0px;
    }

    .patallaprincipalbottomgeneral{  
        margin-left: 5px;
        margin-top: 5px;
        float: none;
        width: calc(100% - 10px);
        height: calc(50% - 10px);
    }
    
    .tabla{       
        margin: 5px auto;        
    }
    .contendornosostrostitle{
        font-size: 25px;
    }
    
    .contendornosostrosparrafo{
        font-size: 18px;
    }
    
    #pantallaestudianteleft{        
        grid-template-columns: repeat(2,1fr);
        transition: ease-in-out all 0.5s;        
    }
    
    .btnestudiantemenu{
        transition: ease-in-out all 0.5s;
    }
    
    #contenedorsistemaestudianteasistencia{
        grid-template-columns: 1fr;
        grid-template-rows: repeat(8,1fr)
    }
    
    #boxitemestudianteasistenciaid1{
        padding: 5px;
        grid-column: 1/2;
        grid-row: 1/3;
        display: grid;
        grid-template-columns: repeat(7,1fr);
        grid-template-rows: repeat(2,fr);
        grid-gap: 5px;
    }
    
    #boxitemestudianteasistenciaid2{
        grid-column: 1/2;
        grid-row: 3/9;
        display: grid;
        grid-gap: 5px;
        padding: 5px;
    }
    
    #itemestudianteasistenciaid1{
        grid-row: 1/3;
        grid-column: 1/3;
        display: grid;    
        grid-template-rows: repeat(3,fr);
        grid-gap: 5px;
    }
    
    #itemestudianteasistencia1icono{
        font-size: 50px;
    }
    
    .itemestudianteasistencia2{        
        font-size: 13px;
    }
    
    .diasemana{        
        font-size: 25px;
    }
    
    #itemestudianteasistenciacontrol{        
        font-size: 22px;
    }
    
    #boxsistemaestudiantepagospensionmar{
        grid-row: 3/6;        
        grid-template-columns: repeat(5,1fr);
        grid-template-rows: repeat(3,1fr) 
    }   

    #montosistemaestudiantepagospension{
        grid-column: 1/5;
    }

    #fechasistemaestudiantepagospension{
        grid-column: 1/5;
    }

    #horasistemaestudiantepagospension{
        grid-column: 1/5;
    }

    #iconosistemaestudiantepagospension{
        grid-column: 5/6;
        grid-row: 1/4;
        padding-top: 18px;
    }
    
    #boxsistemaestudiantepagospensionabr{
        grid-row: 6/9;        
        grid-template-columns: repeat(5,1fr);
        grid-template-rows: repeat(3,1fr) 
    } 
    
    #boxsistemaestudiantepagospensionmay{
        grid-row: 9/12;        
        grid-template-columns: repeat(5,1fr);
        grid-template-rows: repeat(3,1fr) 
    } 
    
    #boxsistemaestudiantepagospensionjun{
        grid-row: 12/15;       
        grid-template-columns: repeat(5,1fr);
        grid-template-rows: repeat(3,1fr) 
    } 
    
    #boxsistemaestudiantepagospensionjul{
        grid-row: 15/18;        
        grid-template-columns: repeat(5,1fr);
        grid-template-rows: repeat(3,1fr) 
    } 
    
    #boxsistemaestudiantepagospensionago{
        grid-row: 18/21;        
        grid-template-columns: repeat(5,1fr);
        grid-template-rows: repeat(3,1fr) 
    } 
    
    #boxsistemaestudiantepagospensionsep{
        grid-row: 21/24;         
        grid-template-columns: repeat(5,1fr);
        grid-template-rows: repeat(3,1fr) 
    } 
    
    #boxsistemaestudiantepagospensionoct{
        grid-row: 24/27;        
        grid-template-columns: repeat(5,1fr);
        grid-template-rows: repeat(3,1fr) 
    } 
    
    #boxsistemaestudiantepagospensionnov{
        grid-row: 27/30;        
        grid-template-columns: repeat(5,1fr);
        grid-template-rows: repeat(3,1fr) 
    } 
    
    #boxsistemaestudiantepagospensiondic{
        grid-row: 30/33;        
        grid-template-columns: repeat(5,1fr);
        grid-template-rows: repeat(3,1fr) 
    } 
    
    .cumplepantallatop1{ 
        width: 34%;
    }
    
    .cumplepantallatop2{ 
        width: 66%;
    }
    
    .resultadoaulavirtual0{        
        width: calc(100% - 10px);        
    }
    
    .menuaulavirtualseccioncontenedornivel{
        width: calc(100% - 10px);
    }    
    
    .docenteaulavirtualpantallacuerpo{
        padding: 5px;
    }  
    
    .docenteaulavirtualpantallacuerpo2{
        padding: 5px;
    } 
   
    .pantallaestudianteaulavirtualleft{
        padding-right: 5px;
    }
    
    .contenedormenuexamsemanal{        
        width: calc(100% - 10px);
    }

    .contenedordatosexamsemanal{
        width: calc(100% - 10px);
    }  
    
    .floatestudianteaulavirtual{        
        padding: 5px;
    }
    
    .docentecursoexameninsertar{  
        height: 102px;            
    }
    
    .docentecursoexameninsertar2{  
        height: 102px;            
    }
}

@media screen and (max-width: 602px){  
    #imglogoloader{
        height: 100px;
        animation: animarinsignia 1.5s infinite;
    }

    @keyframes animarinsignia{
        0%{height: 100px;}
        50%{height: 150px;}    
        100%{height: 100px;}    
    }
    
    .slogan1{
       display: none;
    }

    .slogan2{       
        display:  flex;
    }    
    
       
    .slidersesgo{        
        border-width: 0px 0px 70px 600px;        
    }
    
    .pagination{        
        display: none;       
    }    
    
    .arrowleft{
        display: none;
    }

    .arrowright{
        display: none;
    }
    
    .pantallasliderleft{
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        flex-wrap: wrap;
        margin-left: 10px;
        float: none;
        width: calc(100% - 20px);
        height: 110px;
        overflow-x: scroll;
        border-width: 0px 0px 1px 0px;
    }
    
    .pantallasliderleftcontenedorimg{        
        width: 120px; 
        margin: 10px;
    }
       
    
    .pantallasliderrigth{
        margin: 0px;
        float: none;
        width: 100%;
        height: calc(100% - 110px);
    }   
    
    .pantallasliderrigthcontenedorimg{
        text-align: center;
        margin: auto;
        width: calc(100% - 20px);
        height: calc(100% - 20px);
    }

    .pantallasliderrigthcontenedorimgleft{ 
        margin-top: 20px;
        float: none;
        height: auto;
        width: 100%;
    }

    .pantallasliderrigthimg{
        width: 100%;        
    }

    .pantallasliderrigthcontenedorimgrigth{
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: row;
        flex-wrap: wrap;  
        float: left;
        height: 40px;
        width: 100%;
    }

    .pantallasliderrigthcontenedorimgrigthoptions{    
        width: 100%; 
    }

    .contenedoroptionsimgslider{
        margin: 15px 10px;
    }
    
    .itemopciones{        
        width: 120px;
        height: 120px;
    }

    .itemopcionesicon{
        font-size: 50px;        
        height: 80px;
    }

    .itemopcionestexto{       
        font-size: 14px;
        height: 40px;
    }  
    
    .contenedorimgskwedsesgobottom{        
        border-width: 0px 0px 70px 600px;        
    }
        
    .contenedorimgskwedsesgotop{        
        border-width: 70px 600px 0px 0px;
    }
    
    .contenedorimgskwed{
        height: 300px;    
    }
    
    .contenedorinfoprincipalsesgo{        
        border-width: 0px 0px 70px 600px;        
    }
    
    .footerleft{    
        width: 100%;
        display: flex;
        justify-content: center;
        align-content: center;
        align-items: center;
        flex-direction: row;
        flex-wrap: wrap;
    }   

    .fontfooterleft{
        float: none;
    }

    .pfooterleft{
        float: none;
    }
    
    .footerrigth{    
        width: 100%;
        display: flex;
        justify-content: center;
        align-content: center;
        align-items: center;
        flex-direction: row;
        flex-wrap: wrap;
    }
        
    .pfooterrigth{        
        float: none;
        margin: 0px;
    }

    .fontfooterrigth{ 
        float: none;
        display: none;
    }
    
    .fontfooterrigthhidden{
        display:  block;
        margin: auto 10px auto 0px;
    }
    
    #contenedorimgbienvenido{
        font-size: 120px;
    }

    #contenedortextobienvenido{
        font-size: 18px;
    }
    
    .contendornosostrosimg{       
        width: 110px;        
    }
    
    .contendornosostrostexto{ 
        width: calc(100% - 110px);
    }
    
    #contendornosostros3{        
        height: 450px;
    }
    
    .imgnosotros{
        height: 65%;
    }
    
    #imgnosotros3{
        height: 95%;
    }    
    
    #boxitemestudianteasistenciaid1{ 
        grid-template-columns: repeat(5,1fr);
        grid-template-rows: repeat(3,1fr);
    }
    
    #itemestudianteasistenciaid1{
        grid-column: 1/6;
        grid-row: 1/2;
        grid-template-columns: repeat(5,1fr);
        grid-template-rows: repeat(1,1fr);
    }
    
    #itemestudianteasistencia1icono{
        font-size: 30px;
        grid-column: 1/2;
        grid-row:1/2;
    }

    #itemestudianteasistencia1texto{
        grid-row: 1/2;
        grid-column: 2/6;
    }
    
    .cumplepantallatop{        
        height: 70px;
    }
    
    .cumplepantallabottom{        
        height: calc(100% - 70px);
        
    }
    .cumplepantallatop1{ 
        width: 100%;
    }
    
    .cumplepantallatop2{ 
        width: 100%;
        justify-content:  center;
    }
    
    .docentecursoexameninsertar{  
        height: 162px;            
    }
    
    .docentecursoexameninsertar2{  
        height: 162px;            
    }
    
    .contenedorimagenperfilminiatura{
        margin-top: 5px;
        height: 90px;
        width: 90px;
    }
}

@media screen and (max-width: 500px){        
    .coverimgskiwed{        
        font-size: 16px;        
    }
    
    .contendornosostrosimg{       
        width: 85px;        
    }
    
    .imgnosotros{
        height: 48%;
    }
    
    .contendornosostrostexto{ 
        width: calc(100% - 85px);
    }
    
    .contendornosostrostitle{
        font-size: 20px;
    }
    
    .contendornosostrosparrafo{
        font-size: 15px;
    }
    
    #contendornosostros3{
        height: 400px;
    }
    
    #imgnosotros3{
        height: 85%;
    }
    
    .imgmatricula{
        margin: 20px 20px;
        width: calc(100% - 40px);
        height: auto;
        padding-bottom: 20px;
    }    
    
    #boxitempantallaestudianteleft1{
        grid-column: 1/3;    
    }
    
    .itemestudianteasistencia2{  
        padding: 3;
        grid-gap:3;
        font-size: 13px;
    }
    
    .diasemana{        
        font-size: 20px;
    }
    
    #itemestudianteasistenciacontrol{        
        font-size: 20px;
        grid-column: 1/2;
        grid-row: 2/4;
    }
    
    #itemestudianteasistenciafecha{
        grid-column: 1/2;
        grid-row: 1/2;
    }
        
    .itemestudianteasistencia2grid{
        grid-template-columns: repeat(1,1fr);
        grid-template-rows: repeat(3,1fr);
        grid-gap:3;
    }
    
    
    #boxitemestudianteasistenciaid1{ 
        grid-template-columns: repeat(4,1fr);
        grid-template-rows: repeat(4,1fr);
    }
    
    #boxitemestudianteasistenciaid2{
        grid-column: 1/2;
        grid-row: 3/10;
        display: grid;
        grid-gap: 3px;
        padding: 3px;
    }
    
    #itemestudianteasistenciaid1{
        grid-row: 1/2;
        grid-column: 1/5;        
    }
    
    .itemestudianteasistencia1{
        font-size: 13px;
    }
    
    #boxsistemaestudiantepagosmatmod{
        grid-row: 1/3;        
        grid-template-columns: repeat(5,1fr);
        grid-template-rows: repeat(2,1fr);    
    }

    #montosistemaestudiantepagosmatmod{
        grid-column: 1/5;
    }

    #fechasistemaestudiantepagosmatmod{
        grid-column: 1/5;
    }

    #iconosistemaestudiantepagosmatmod{
        grid-column: 5/6;
        grid-row: 1/3;
    }
    
    .cumplepantallatop2left{
        font-size: 12px;
        width: 165px;
    }
    
    .cumplepantallatop2right{        
        font-size: 12px;
        width: 165px;
    }

    .cumplepantallatop2texto{
        width: 30px;    
    }
    
    .contenedorfilepagomat{
        width: 180px;   
    }
    
}

@media screen and (max-width: 400px){        
    .coverimgskiwed{        
        font-size: 16px;        
    }
    
    .contendornosostrosparrafo{
        max-height: 320px;
        overflow-y: scroll;
    }
    
    #imgnosotros3{
        height: auto;
        width: 95%;
    }  
    
    #boxitemestudianteasistenciaid2{      
        grid-gap:3px;
        padding: 3px;
    }
    
    .cumplepantallatop{        
        height: 105px;
    }
    
    .cumplepantallabottom{        
        height: calc(100% - 105px);
        
    }
    
    .cumplepantallatop2{ 
        height: 70px;
        display: grid;
        grid-gap:5px;
        padding: 5px;
        grid-template-columns: 1fr 1fr 60px;
        grid-template-rows: repeat(2,1fr);
    }
    
    .cumplepantallatop2left{
        width: 100%;
        grid-column:1/3;
        grid-row:1/2;
    }
    
    .cumplepantallatop2right{ 
        width: 100%;
        grid-column:1/3;
        grid-row:2/3;
    }
    
    .cumplepantallatop2btn{
        border-radius: 0px;
        background-color: rgba(0,0,0,0.2);
        font-size: 25px;
        width: 100%;
        height: 100%;
        grid-column:3/4;
        grid-row:1/3;
    }
    
    .docenteaulavirtualclaseiframevideo{
        height: 200px;  
    }
    
    .contenedortextoinfoprincipal{ 
        font-size: 13px;
    }

@media screen and (max-width: 300px){        
    .slogan2{       
        opacity: 0;
    }
    
    .docenteaulavirtualclaseiframevideo{
        height: 150px;  
    }
}