﻿/*.pantalla {
    display: grid;*/
    /*grid-template-rows: fr auto;*/
    /*grid-template-rows: 48px auto 2fr 48px;
    background-color: white;*/
    /*grid-template-areas: "header banner cuerpo pie";*/
/*}*/

/* header */
/*.header {*/
    /*grid-area: header;*/
    /*max-height: 48px;
    min-height: 48px;
    display: grid;
    grid-template-columns: fr fr;
    grid-template-areas: "izq der";
    background-color: #3D5A80;
    color: white;
    font-weight: bold;
    font-size: 15px;
    border-radius: 0px 0px 15px 15px;
    margin-bottom: 2px;

}

.headerLeft {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding-left: 10px;*/
    /*background-color: aqua;*/
/*}

.headerRight {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-right: 10px;
}

.botonAtras {
    cursor: pointer;
}

    .botonAtras:hover {
        color: lightgray;
    }*/





.contenido {
    display: grid;
    grid-template-rows: auto 2fr;
}    
/* banner */

/*.banner {
    margin: 15px 0px;
    background-color: lightblue;
    display: grid;
    grid-template-columns: 3fr fr;
    grid-template-areas: "izq der";
    border-radius: 15px;
    font-size: clamp(20px,2vw,26px);
}*/

.cuerpoPantalla {
    margin: 5px 5% 0px;
}


.bannerCoordinador {
    background-color: #3D5A80;
    margin-top:10px;
}

.ImagenColegio {
    width: auto;
    height: 100%;
    object-fit: cover;
    position: absolute;

}

.ImagenColegio img {
    max-height: 300px;
    width: none;
}


/* Cuerpo */

/*.cuerpo {
    border-radius: 15px;*/

    /*background-color: lightblue;*/
    /*margin-bottom: 2px;
    margin: 0px 5% ;
}*/

.cuerpoInterno {
    display: grid;
    grid-template-columns: 3fr 2fr;
    grid-template-areas: "izq der";
    margin: 0px 15px 0px 15px;
    /*background-color:yellow;*/
    height:100%;
    margin-bottom:40px;
}

/*.cuerpoLeft {
    grid-area: izq;
    display: flex;
    align-items: center;
    justify-content: flex-start;*/
    /*padding-left: 10px;*/
    /*background-color: aqua;*/
    /*background-color: grey;*/
/*}

.cuerpoRight {
    grid-area: der;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-right: 10px;
    margin-top:35px;
}*/

.franjaContenidoEntrada {
    /*height: 55vh;*/
    /*background-color:yellow*/
}

/*.cuadroDentroDefranjaContenidoEntrada {
    display: block;*/
    /*height: 50vh;*/
    /*background-color: #E0E0E0;*/
    /*border-radius: 0px 10px 10px 0px;*/
    /*border-radius: 10px;
    padding: 10px 10px 0px 15px;
    background-color: lightgray;
    height: 90%;
}*/

.VideoIntro {
    /*padding: 5%;*/
    display: flex;
    align-items: center;
    justify-content:center;
    margin:16px;
    /*width: 90%;*/
    /*background-color:yellow;*/
    /*display: flex;*/
    /*justify-content: flex-end;*/
}

video {
    /*width: 90%;*/
    /*min-height: 400px;*/
    /*height: 90%;*/
    /*max-height: 500px;*/
    /*object-fit: cover;*/
}







.AreaEstudiante {
    /*font-size: clamp(15px, 2vw, 24px);*/
}




.footerDeChat {
    position: fixed;
    left: 0;
    bottom: 0px;
    background-color: #1376a0;
    color: white;
    font-size: 22px;
    font-weight: bold;
    align-items: center;
    border-radius: 5px;
    padding: 0px 10px 0px 10px;
    width: 100%;
    margin: 0px 10% 0px 10%;
    display: grid;
    grid-template-columns: 1fr 1fr;
}



/*.div.e-headertext.e-cellvalue {
    display: grid;
    background-color: red;
    align-content: center;
    justify-content: center;
    align-items: center;
    padding: 4px;
}*/

.e-grid .e-headercell {
    /*background-color: gray;*/
}

.e-headercell {
    /*display:flex;*/
    color: white;
    font-size: 1.5rem;
    font-weight: bold;
}

.encabezadoTabla {
    /*background-color: lightblue;*/
    width: 100%;
    padding: 2px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
}


/*Barra de avance*/
/*Estilo de barra de avance*/

.contenedorBarra {
    display: grid;
    grid-template-rows: 1fr 10fr 1fr;
    grid-template-columns: 90fr 4fr;
    padding: 2px 2px;
    /*margin-top: -10px;*/
    background-color:#f0f0f0;
}

.fondoBarra {
    height: 100%;
    background-color: gray;
    border-radius: 3px;
    padding: 2px 2px;
}

.barraAvance {
    display: grid;
    grid-row-start: 1;
    grid-column-start: 1;
    grid-column-end: 2;
    place-items: center;
    /*height: 6vh;*/
    /*width: 50%;*/
    background-color: aqua;
    border-radius: 3px;
    max-width: 100%;
    /*overflow: hidden;*/
}

.porcentajeBarra {
    margin-left: 3px;
    grid-column-start: 2;
    display: grid;
    place-items: center;
}

.datoBarra {
    display: grid;
    place-items: center;
    padding: 0px 2px;
    font-size: .7rem;
    z-index: 100;
    background-color: blue;
}


.sf-pivotview .e-filters-popup .e-popup-wrapper {
    background-color: blue !important;
}

.e-pivotview .e-grouping-bar .e-pivot-button, .e-pivotview .e-group-rows .e-pivot-button {
    background-color: #3D5A80;
}

/*Chips*/
.e-multi-select-wrapper .e-chips {
    background-color: #3D5A80;
}

/*Asignaturas*/
.e-chip-list.e-chip.e-active, .e-chip-list .e-chip.e-active {
    background-color: #3D5A80;
}

.e-btn-group:not(.e-outline), .e-css.e-btn-group:not(.e-outline) {
    box-shadow: none;
    background-color: transparent;
}


.encabezadoTablaPivote {
    /*background-color:lightblue;*/
    cursor: pointer;
    display: grid;
    grid-template-rows: 1fr 1fr;
    align-items: center;
    justify-items: center;
    place-content: center;
    margin:2px;
    /*height:40px;*/
}

    .encabezadoTablaPivote:hover {
        background-color: lightblue;
        cursor: pointer;
        padding: 2px;
        margin:1px;
    }
.e-headercell {
    color:grey;
}

.autenticacion {
    height:100vh;
    display: grid;
    align-items: center;
    justify-items: center;
}

/*.e-list-item {

    background-color:yellow;
    height:100px;
}*/

#ham {
  
    /*margin-top:1px;*/
}