@import url('/');
@import url(https://fonts.googleapis.com/css?family=Titillium+Web:300);

/*#region Objetos Comunes */

@font-face {
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 300;
    src: local('Titillium WebLight'), local('TitilliumWeb-Light'), url(http://themes.googleusercontent.com/static/fonts/titilliumweb/v2/anMUvcNT0H1YN4FII8wpr24bNCNEoFTpS2BTjF6FB5E.woff) format('woff');
}

* {
    margin: 0;
    padding: 0;
    font-family: 'Varela', sans-serif;
}

.cuerpo {
    margin: 15px auto;    
    text-align: center;
    border: none;    
}

/*#endregion */

/*#region Texto y Encabezados */

h1 {
    font-family: 'Raleway', sans-serif;
    font-size: 30px;
    font-style: normal;
    color: rgb(58, 135, 233);
    margin: 0;
    padding: 0;
}

.fechasclase {
    font-family: 'Raleway', sans-serif;
    font-size: 25px;
    font-style: normal;
    text-align: justify;
    color: rgb(58, 135, 233);
    /*color: #4CAF50;*/
    margin: 0;
    padding: 0;
}

p.tit {
    font-family: 'Raleway', sans-serif;
    color: rgb(58, 135, 233);
    font-size: 17px;
    text-align: left;
}

p.subtit {
    font-family: 'Raleway', sans-serif;
    font-size: 16px;
    text-align: center;
}

/*#region Encabezados internos */
/*@media screen and (max-width: 640px) {
    .franjatitulo {
        display: none;
    }
}

@media screen and (min-width: 641px) {
    .franjatitulo {
        width: 75%;
        height: auto;
        margin: auto;
        font-family: 'Raleway', sans-serif;
        font-size: 20px;
        font-style: normal;
    }
}*/

.tabladetitulos {
    width: 100%;
    position: relative;
    margin: auto;
}

.excbutton {
    width: 30%;
    height: 50px;
    position: relative;
    background-color: #5fa2db;
    border: none;
    font-family: 'Raleway', sans-serif;
    font-size: 20px;
    color: white;
    font-style: normal;
    border-radius: 15px;
}

    .excbutton:hover {
        background-color: #95c8f4;
    }

    #Excelbutton {
        width: 30%;
    height: 50px;
    }

/*#endregion */

/*#endregion */

/*#region Master */

/*#region MasterPantalla Grande */
@media screen and (min-width: 951px) {

    #movilmenu {
        display: none;
    }

    .todo {
        display: block;
        text-align: center;
        width: 100%;
        height: 100%;
    }

    .main-menu {
        display: block;
        float: left;
        padding: 10px 0 0 0;
        text-align: left;
        position: fixed;
        background: #f6f7f8;
        border-right: 0.3px solid #d3d3d3;
        width: 220px;
        height: 100%;
        overflow: hidden;
        -webkit-transition: width .05s linear;
        transition: width .05s linear;
        -webkit-transform: translateZ(0) scale(1, 1);
        z-index: 1000;
    }

    #Paghija {
        /*width: calc(100% - 200px);*/
        width: 80%;
        /*background: rgb(240, 240, 240);*/        
        border-radius: 15px;
        display: block;
        float: left;
        position: relative;
        /*margin: 20px 0 20px 0px;        */
        margin: 20px 10% 5px 10%;
        text-align: center;
    }

    #logo {
        height: 47px;
        padding: 5px 0 0 10px;
    }

    .fa {
        position: relative;
        display: table-cell;
        width: 60px;
        height: 36px;
        text-align: center;
        vertical-align: middle;
        font-size: 20px;
        /*font-size: 2em;*/
    }

    .main-menu > ul {
        margin: 7px 0;
    }

    /*Etiquetas <li> que esten dentro del main-menu*/
    .main-menu li {
        position: relative;
        display: block;
        width: 250px;
    }
        /*Etiquetas <a> que sean menores que <li> dentro del main-menu*/
        .main-menu li > a {
            position: relative;
            display: table;
            border-collapse: collapse;
            border-spacing: 0;
            color: #999;
            font-family: arial;
            font-size: 14px;
            text-decoration: none;
            -webkit-transform: translateZ(0) scale(1, 1);
            -webkit-transition: all .1s linear;
            transition: all .1s linear;
        }

    nav {
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }

    .nav-text {
        position: relative;
        display: table-cell;
        vertical-align: middle;
        width: 190px;
        font-family: 'Titillium Web', sans-serif;
    }

    .main-menu > ul.logout {
        position: absolute;
        left: 0;
        bottom: 10px;
    }

    .main-menu li:hover > a {
        text-decoration: none;
        color: #fff;
        background-color: #5fa2db;
    }

    nav ul,
    nav li {
        outline: 0;
        margin: 0;
        padding: 0;
    }

    .tablascentradasest {
        width: 90%;
        margin: 30px 20px;
        padding: 6px 12px;
        border: none;
    }

}

/*#endregion */

/*#region MasterMovil */
@media screen and (max-width: 950px) {
    /*https://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_overlay
    https://www.w3schools.com/howto/howto_js_fullscreen_overlay.asp
    https://www.w3schools.com/css/tryit.asp?filename=trycss_navbar_horizontal_responsive*/
    .todo {
        display: block;
        text-align: center;
        width: 100%;
        height: 100%;
    }

    #logo2 {
        position: relative;
        display: inline-block;
        float: left;
        width: 75%;
        height: auto;
        padding: 5px;
        cursor: pointer;
    }

    #logo3 {
        display: block;
        margin: auto;
        width: 170px;
    }

    #touchmenu {
        position: relative;
        display: inline-block;
        float: right;
        width: 45px;
        height: auto;
        cursor: pointer;
        padding: 5px;
    }

    #movilmenu {
        text-align: center;
        display: table;
        height: 100%;
        width: 90%;
        margin: auto;
    }

    .main-menu {
        display: none;
    }

    #Paghija {        
        width: 90%;
        /*width: fit-content;*/
        display: block;
        float: none;
        position: relative;
        /*background: rgb(240, 240, 240);*/
        border-radius: 15px;
        margin: 10px;
        text-align: center;
    }

    .overlay {
        height: 100%;
        width: 0;
        position: fixed;
        z-index: 1;
        top: 0;
        left: 0;
        background-color: rgb(0,0,0);
        background-color: rgba(0,0,0, 0.9);
        overflow-x: hidden;
        transition: 0.5s;
    }

    .overlay-content {
        position: relative;
        top: 7%;
        width: 100%;
        text-align: center;
    }

    .overlay a {
        padding: 8px;
        text-decoration: none;
        font-size: 30px;
        color: #818181;
        display: block;
        transition: 0.3s;
    }

        .overlay a:hover, .overlay a:focus {
            color: #f1f1f1;
        }

    .overlay .closebtn {
        position: absolute;
        top: 10px;
        right: 40px;
        font-size: 50px;
    }

    .tablascentradasest {
        width: 90%;
        margin: 30px auto;
        padding: 6px 12px;
        border: none;
    }

}
/*#endregion */

/*#endregion */

/*#region Fondo */

/*-----------------------------------------------------------------------*/
/*--------------------------------Fuentes--------------------------------*/

.titulos {
    vertical-align: middle;
    position: relative;
    margin: auto;
    width: auto;
}

.e-phone {
    font-size: 17px;
    color: #898989;
}

.e-name {
    font-size: 27px;
    color: #333;
}

.e-mail {
    font-size: 13px;
    color: #898989;
}

.labels {
    font-size: 14px;
    color: #b94242;
}

.labels2 {
    font-size: 17px;
    color: #b94242;
}

/*-----------------------------------------------------------------------*/
/*--------------------------------Datos Principales--------------------------------*/

#titulosprincipales {
    margin: auto;
    padding: 22px 0 0 0;
    width: fit-content;
    height: 60px;
    font-size: 32px;
}

#datosgen {
    width: fit-content;
    padding: 10px 30px 0 30px;
    margin: auto;
    line-height: 28px;
    text-align: left;
}

#Tcambios {
    width: auto;
    margin: auto;
    padding: 0 10px;
    text-align: right;
    font-size: 13px;
    line-height: 20px;
}

.hrr {
    width: 90%;
    height: 1px;
    margin: auto;
    border: 0;
    background-image: -webkit-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
    background-image: -moz-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
    background-image: -ms-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
    background-image: -o-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
}

#letraspquenas {
    width: 80%;
    position: relative;
    margin: auto;
    text-align: left;
    font-size: 10px;
    line-height: 20px;
}

.subcantidades {
    font-size: 15px;
    font-weight: bold;
}

.datostabla h4 {
    padding: 19px 10px 6px 20px;
    font-size: 17px;
    color: #b94242;
}

/*-----------------------------------------------------------------------*/
/*---------------------Temporales para Labels----------------------------*/

.positivo {
    color: green;
}

.negativo {
    color: red;
}

.neutral {
    color: black;
}

/*#endregion */

/*#region Patrocinadores */

.tbdatospersonales {
    margin: auto;
}

    .tbdatospersonales td {
        padding: 5px 5px;
    }

        .tbdatospersonales td:nth-child(1) {
            text-align: right;
            width: 200px;
            font-size: 15px;
        }

        .tbdatospersonales td:nth-child(3) {
            text-align: left;
        }

.cajas {
    width: 300px;
}

p.subtitdatospersonales {
    color: #4CAF50;
    font-size: 30px;
}

p.avisoninguna {
    margin: auto;
    width: 800px;
    font-size: 20px;
    font-style: italic;
    color: firebrick;
}

/*#endregion */

/*#region contacto */

.tabla1 {
    width: fit-content;
    margin: auto;
}

    .tabla1 td {
        text-align: left;
        padding-left: 10px;
    }

.tabla2 {
    position: relative;
    width: 90%;
    margin: auto;
    padding: 0 10px;
    text-align: left;
    line-height: 20px;
}

p.cargo {
    font-size: 17px;
    font-weight: bolder;
}

/*#endregion */

/*#region acceso */

.tabla1acceso {
    margin: auto;
    text-align: left;
    width: auto;
}

    .tabla1acceso td {
        padding: 0 10px;
    }

.unicatabla {
    width: 420px;
    margin: auto;
    text-align: right;
}


/*#endregion */

/*#region stats */

.scrollbardx {
    height: 350px;
    width: 295px;
    overflow-y: scroll;
    overflow-x: hidden;
}

/*#endregion */


/*#region Tablas */

.tablasdiv {
    font-size: 14px;
    border-radius: 15px;
}

    /*Toda la tabla*/
    .tablasdiv th, .tablasdiv td {
        border-bottom: 1px solid #b9b9b9;
        padding: 8px 5px;        
    }

    /*Titulo del las tablas*/
    .tablasdiv th {
        height: 30px;
        vertical-align: middle;
        text-align: center;
        font-size: 16px;
        font-weight: normal;
        border-bottom: 2px solid #4CAF50;
        background: rgb(240, 240, 240);        
        color: #4CAF50;
        font-family: 'Raleway', sans-serif;
    }

    /*Celdas de las tablas*/
    .tablasdiv td {        
    }

    .tablasdiv tr:hover {
        background-color: #5fa2db;
        color: white;        
    }

.tablascentradas {
    width: 75%;
    margin: 30px auto;
    padding: 6px 12px;    
    border-radius:15px;
}

/*#endregion */