﻿

.Octicon {
    filter: invert(100%) sepia(100%) saturate(100%) hue-rotate(86deg) brightness(100%) contrast(100%);
}


.OcticonAzul {
    filter: invert(55%) sepia(86%) saturate(3699%) hue-rotate(162deg) brightness(95%) contrast(101%);
}

.OcticonRojo {
    filter: invert(67%) sepia(89%) saturate(7492%) hue-rotate(346deg) brightness(84%) contrast(146%);
}

.Titulo {
    font-family: 'Graublau Web';
    font-size: larger;
    text-align: center;
}

.Politicas {
    padding: 40px 80px;
    font-family: Constantia, "Lucida Bright", "DejaVu Serif", Georgia, "serif";
    font-size: 13pt;
    text-align: justify !important;
}


table.paleBlueRows {
    font-family: "Times New Roman", Times, serif;
    border: 1px solid #FFFFFF;
    width: 90%;
    margin: auto;
    background: white;
    height: 200px;
    text-align: center;
    border-collapse: collapse;
}

    table.paleBlueRows td, table.paleBlueRows th {
        border: 1px solid #FFFFFF;
        padding: 3px 2px;
    }

    table.paleBlueRows tbody td {
        font-size: 13px;
    }

    table.paleBlueRows tr:nth-child(even) {
        background: #D0E4F5;
    }

    table.paleBlueRows thead {
        background: #0B6FA4;
        border-bottom: 5px solid #FFFFFF;
    }

        table.paleBlueRows thead th {
            font-size: 17px;
            font-weight: bold;
            color: #FFFFFF;
            text-align: center;
            border-left: 2px solid #FFFFFF;
        }

            table.paleBlueRows thead th:first-child {
                border-left: none;
            }

    table.paleBlueRows tfoot {
        font-size: 14px;
        font-weight: bold;
        color: #333333;
        background: #D0E4F5;
        border-top: 3px solid #444444;
    }

        table.paleBlueRows tfoot td {
            font-size: 14px;
        }


.PestaniaBarra {
    height: auto;
    /*display:inline-block;*/
    width: 100%;
}

.Pestania {
    width: 120px;
    padding: 10px;
    line-height: 55px;
    border-top: 1px solid black;
    border-left: 1px solid black;
    border-right: 1px solid black;
    border-radius: 5px 0px;
    font-family: 'Graublau Web';
    margin-left: 2px;
    cursor: pointer;
}

    .Pestania:hover {
        color: black;
        opacity: 1;
        background-color: wheat;
    }

.PestaniaActivo {
    background-color: white;
    opacity: 1;
    color: black;
}

.PestaniaInactivo {
    background-color: black;
    color: white;
    opacity: .75;
}

.DivContenido {
    border: 1px solid lightgray;
    background-color: white;
    box-shadow: lightgray 5px 5px;
    width: auto;
    height: auto;
    top: -5px;
    bottom: 0px;
    left: 0px;
    right: 0px;
    padding-left: 25px;
    position: relative;
    border-radius: 0px 10px;
    overflow-y: auto;
}

.DivActivo {
    display: block;
}

.DivInactivo {
    display: none;
}

.Titulo1 {
    font-family: Lato;
    color: cadetblue;
    opacity: .75;
}

.ActividadesLista {
    list-style: none;
    padding: 10px;
}

.Cambio {
    background-color: lightcyan;
    opacity: .75;
}

.Recursos {
    float: left;
    width: 97%;
    right: 0px;
    left: 0px;
    padding-left: 25px;
    padding-right: 25px;
}

    .Recursos a, .Recursos a:visited {
        text-decoration: none;
        color: lightseagreen;
    }



.BtnServicios a {
    color: white ;
    text-decoration: none !important;
}

    .BtnServicios a:visited {
        color: white ;
        text-decoration: none !important;
    }

    .BtnServicios a:link {
        color: white ;
        text-decoration: none !important;
    }


.BtnServicios:hover {
    transform: scale(1.3);
    transition: transform 0.35s cubic-bezier(0.11, 0, 0.5, 0);
    color:darkcyan !important;
}

.Crecer:hover {
    -webkit-transform: scale(1.5);
    transform: scale(1.5);
    -webkit-transition: background-color 0.5s, -webkit-transform 0.5s ease-out;
    transition: background-color 0.5s, -webkit-transform 0.5s ease-out;
    transition: background-color 0.5s, transform 0.5s ease-out;
    transition: background-color 0.5s, transform 0.5s ease-out, -webkit-transform 0.5s ease-out;
}


.blink {
    animation: blinker 1.5s linear infinite;
    /*color: wh !important;*/
    font-weight: 700;
    color: orange !important;
}

.blinkRed {
    animation: blinker 1.1s linear infinite;
    /*color: wh !important;*/
    font-weight: 700;
    color: red !important;
}

@keyframes blinker {
    50% {
        opacity: .2;
    }
}

.Tab {
    border: 2px solid black;
    border-radius: 10px 0px 10px 0px;
    background-color: white;
    color: black;
    display: inline-block;
    padding: 10px 7px;
    text-decoration: none;
}

    .Tab:hover {
        -webkit-transform: scale(1.5);
        transform: scale(1.5);
        -webkit-transition: background-color 0.5s, -webkit-transform 0.5s ease-out;
        transition: background-color 0.5s, -webkit-transform 0.5s ease-out;
        transition: background-color 0.5s, transform 0.5s ease-out;
        transition: background-color 0.5s, transform 0.5s ease-out, -webkit-transform 0.5s ease-out;
    }


    .Tab a {
        margin: 25px 15px;
        text-decoration: none;
        font-weight: bold;
    }

        .Tab a:visited {
            text-decoration: none;
        }


        .Tab a:link {
            text-decoration: none;
        }



    .Tab:hover {
        background-color: lightskyblue;
        text-decoration: none;
    }

.TabActive {
    border: 2px solid black;
    border-radius: 10px 0px 10px 0px;
    background-color: #3b49df;
    display: inline-block;
    padding: 10px 7px;
    font-weight: bold;
}

    .TabActive a {
        margin: 15px 8px;
        text-decoration: none;
        color: white;
    }

        .TabActive a:visited {
            text-decoration: none;
        }

        .TabActive a:link {
            text-decoration: none;
        }

        .TabActive a:hover {
            text-decoration: none;
            color: white;
        }

.Iconos {
    display: inline-block;
    margin-top: 60px;
    margin-left: 30px;
    margin-right: 30px;
    margin-bottom: 60px;
    cursor: pointer;
    width: 200px;
    text-align: center
}

    .Iconos img {
        margin-left: 40px;
        margin-right: 40px;
        width: 120px
    }

    .Iconos p {
        font-size: 16pt;
        color: #2b2a29;
        text-align: center;
    }

    .Iconos:hover {
        /*margin-top: 10px;
        margin-left: 50px;
        margin-right: 50px;
        margin-bottom: 0px;*/
        -webkit-transform: scale(1.5);
        transform: scale(1.5);
        -webkit-transition: background-color 0.5s, -webkit-transform 0.5s ease-out;
        transition: background-color 0.5s, -webkit-transform 0.5s ease-out;
        transition: background-color 0.5s, transform 0.5s ease-out;
        transition: background-color 0.5s, transform 0.5s ease-out, -webkit-transform 0.5s ease-out;
    }

    /*.Iconos:hover img {
        margin-left: 10px;
        margin-right: 10px;
        width: 160px
    }
    .Iconos:hover p {
        font-size: 20pt;
        
    }*/


    .Iconos p {
        background-image: linear-gradient( to right, #54b3d6, #54b3d6 50%, #000 50% );
        background-size: 200% 100%;
        background-position: -100%;
        display: inline-block;
        padding: 5px 0;
        position: relative;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        transition: all 0.3s ease-in-out;
    }

    .Iconos:before p {
        content: '';
        background: #54b3d6;
        display: block;
        position: absolute;
        bottom: -3px;
        left: 0;
        width: 0;
        height: 3px;
        transition: all 0.3s ease-in-out;
    }

    .Iconos:hover p {
        background-position: 0;
    }

    .Iconos:hover::before p {
        width: 100%;
    }



.IconoBiblioteca {
    display: inline-block;
    margin: 30px 30px;
    cursor: pointer;
    width: 300px;
    text-align: center;
}

    .IconoBiblioteca img {
        margin-left: 40px;
        margin-right: 40px;
    }

.Crecer180:hover {
    width: 180px !important;
}

.Crecer270:hover {
    width: 270px !important;
}

.Crecer135:hover {
    width: 135px !important;
}

@media (max-width:1980px) {

    .ui-tabs-left .ui-tabs-nav {
        width: 15% !important;
    }

    .ui-tabs-left .wijmo-wijtabs-content {
        width: 83% !important;
    }
}


@media (max-width:1100px) {

    .ui-tabs-left .ui-tabs-nav {
        width: 20% !important;
    }

    .ui-tabs-left .wijmo-wijtabs-content {
        width: 78% !important;
    }
}

@media (max-width:750px) {
    .ui-tabs-left .wijmo-wijtabs-content ul {
        display: block !important;
    }

    .ui-tabs-left .wijmo-wijtabs-content {
        width: 100% !important;
    }

    .ui-tabs-left ul {
        display: none !important;
    }

    .ui-tabs-left .ui-tabs-nav {
        width: 0% !important;
    }
}
