/*estilos generales by JTM -2017*/

/*reservadas*/
/************/

@import url('site.css');

* {
    margin: 0;
    padding: 0;
}

hr {
    margin-top: .4rem;
    margin-bottom: .2rem;
    border: 0;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
}

/*generales*/
.cerrar {
    clear: both;
}

.visibilidad {
    display: block;
}

.visibilidad-inverse {
    display: none;
}

.visibilidad-md {
    display: block;
}

.visibilidad-inverse-md {
    display: none;
}

.visibilidad-sm {
    display: block;
}

.visibilidad-inverse-sm {
    display: none;
}

.bg-Eurosoft {
    background-color: #0b304b;
}

.bg-Eurosoft-Warning {
    background-color: #d08e05;
}

.bg-Eurosoft-Light {
    background-color: #384D5D;
}

.bg-Eurosoft-Green {
    background-color: #3c6850;
}

.bg-Eurosoft-Red {
    background-color: #cb4747;
}

.bg-Light {
    background-color: #ebe9e9;
}

.bg-Transparent {
    background-color: rgba(0,0,0,.03);
}

.marginAuto {
    margin: auto;
}

.text-Decoration-None {
    text-decoration: none !important;
}

.ml-1px {
    margin-left: -1px;
}

.font14 {
    font-size: 14px;
}

.font15 {
    font-size: 15px;
}

.font12 {
    font-size: medium;
}

.font11 {
    font-size: 11px;
}

.font9em {
    font-size: .9em;
}

.font8em {
    font-size: .8em;
}

.font1rem {
    font-size: 1rem;
}

.font13em {
    font-size: 1.3em;
}

/*LOGIN*/
.bgLogin {
    width: 100%;
    height: 100vh;
}

.bgLoginImg {
    background-repeat: no-repeat;
    /*background-size: 100% 57%;*/
    background-size: cover;
    background-position: left top;
    background-attachment: fixed;
}

.bgOpacity {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100vh;
    background-color: rgba(0,0,0,0.3); /*en caso de que la imagen de fondo sea muy brillante se puede subir o bajar la opacidad*/
}

.bgWelcomeImg {
    width: 98%;
    height: 60vh;
    margin-left: 20px;
    background-image: url('../img/bgWelcome.png');
    background-repeat: no-repeat;
    background-size: contain;
    background-position: left bottom;
    resize: both;
}

.titulo {
    padding-top: 25px;
    font-size: 0.8em;
}

/*************/
/***General***/

.bnrHead {
    padding: 2px 1px 2px 3px !important;
    font-size: 1.1em;
    font-weight: 500;
    height: 50px;
    width: 100% !important;
}

    .bnrHead a {
        color: #fff;
        text-decoration: none;
    }

.bnrUser {
    padding: 3px !important;
    font-size: .95em;
    font-weight: 500;
    text-decoration: none;
}

.btnMain {
    font-size: 1.2em;
    padding: .2rem .4rem .2rem .4rem;
    border: 1px solid rgba(255, 255, 255, 0.30);
    border-radius: 5px;
    width: 36px;
}

.bgLineaAcordeon {
    background-image: url('../img/lineaAcordeon.png');
}

.fa-sq-size {
    font-size: 5px;
}

.iconMenu {
    font-size: 1.2em;
    width: 55px !important;
    height: 34px !important;
    background: #0b304b;
}

/****menu lateral****/

.menuLateral {
    position: absolute;
    left: 98.5%;
    top: 20px;
    z-index: 10;
    width: 40px;
    height: auto;
/*    transition: 1.5s ease-in-out;*/
}

/*    .menuLateral:hover {
        transition: 1.5s ease-in-out;
        transform: translate(-25px,0);
    }*/

.menuLateralRombos {
    margin-top: 20px;
    background-color: rgba(56,77,93,0.75);
    width: 40px;
    height: 40px;
    transform: rotate(45deg);
    vertical-align: central;
    color: #fff;
}

    .menuLateralRombos i {
        transform: rotate(-45deg);
        margin-left: 11px;
        margin-top: 12px;
    }

.menuLateralRombosDis {
    margin-top: 20px;
    background-color: #d0d1d1;
    width: 40px;
    height: 40px;
    transform: rotate(45deg);
    vertical-align: central;
    color: rgba(79, 79, 79, 0.40);
    cursor: default;
    pointer-events: none;
}

    .menuLateralRombosDis i {
        transform: rotate(-45deg);
        margin-left: 11px;
        margin-top: 12px;
        cursor: default;
        pointer-events: none;
    }


.menuLateralRombosGreen {
    margin-top: 20px;
    background-color: #44664b;
    width: 40px;
    height: 40px;
    transform: rotate(45deg);
    vertical-align: central;
    color: #fff;
}

    .menuLateralRombosGreen i {
        transform: rotate(-45deg);
        margin-left: 11px;
        margin-top: 12px;
    }

.menuLateralRombosMagenta {
    margin-top: 20px;
    background-color: #2386a9;
    width: 40px;
    height: 40px;
    transform: rotate(45deg);
    vertical-align: central;
    color: #fff;
}

    .menuLateralRombosMagenta i {
        transform: rotate(-45deg);
        margin-left: 11px;
        margin-top: 12px;
    }

.menuLateralRombosRed {
    margin-top: 20px;
    background-color: #dc3545;
    width: 40px;
    height: 40px;
    transform: rotate(45deg);
    vertical-align: central;
    color: #fff;
}

    .menuLateralRombosRed i {
        transform: rotate(-45deg);
        margin-left: 11px;
        margin-top: 12px;
    }


.menuLateralRombosYellow {
    margin-top: 20px;
    background-color: #dda51f;
    width: 40px;
    height: 40px;
    transform: rotate(45deg);
    vertical-align: central;
    color: #fff;
}

    .menuLateralRombosYellow i {
        transform: rotate(-45deg);
        margin-left: 11px;
        margin-top: 12px;
    }

.aDis {
    cursor: default;
    pointer-events: none;
}

.aEna {
    cursor: pointer;
}

.divTitle {
    font-size: 1.7em;
    padding: 2px;
    font-weight: 600;
    color: #0b304b;
}

.divMsg {
    font-size: 1em;
    padding: 2px;
}


/*********grid*********/

.tabGrid {
    border: 1px solid #999;
    background-color: #fff;
    color: #333;
}

    .tabGrid .tabHead {
        background-color: #0b304b;
    }

        .tabGrid .tabHead [type="checkbox"] + label:before,
        .tabGrid .tabHead [type="checkbox"]:not(.filled-in) + label:after {
            content: '';
            position: absolute;
            top: 0;
            left: 1px;
            width: 14px;
            height: 14px;
            z-index: 0;
            border: 2px solid #FFF;
            border-radius: 1px;
            -webkit-transition: .2s;
            -o-transition: .2s;
            transition: .2s;
        }

        .tabGrid .tabHead [type="checkbox"]:checked + label:before {
            top: -3px;
            left: -4px;
            width: 9px;
            height: 17px;
            border-top: 2px solid transparent;
            border-left: 2px solid transparent;
            border-right: 2px solid #fff;
            border-bottom: 2px solid #fff;
            -webkit-transform: rotate(40deg);
            -ms-transform: rotate(40deg);
            transform: rotate(40deg);
            -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
            -webkit-transform-origin: 100% 100%;
            -ms-transform-origin: 100% 100%;
            transform-origin: 100% 100%;
        }

    .tabGrid th {
        font-size: .85em;
        color: #ddd;
        text-decoration: none;
        background-color: transparent;
        font-weight: 500;
        height: 22px;
        padding: 0px 3px;
        text-transform: uppercase;
    }

        .tabGrid th a {
            font-size: .9em;
            color: #ddd;
            text-decoration: none;
            background-color: transparent;
            vertical-align: top;
        }

            .tabGrid th a:hover {
                text-decoration: none;
                color: #ebebeb;
            }

    .tabGrid td {
        font-size: .88em;
        padding: .05px 2px .1px 3px;
        text-align: left;
    }

    .tabGrid .on {
        background: #e4eaee;
    }

    .tabGrid .minwith {
        min-width: 90px;
    }

    .tabGrid .selectRow {
        background: #bfcbd5;
    }

.tabGrid_Pager table {
    margin: auto;
    float: right;
    border: none;
}

tr.tabGrid_Pager {
    padding: 5px;
    text-align: center;
    background-color: rgba(0, 0, 0, 0.28);
}

.tabGrid_Pager table td {
    font-size: .9em;
    padding: 2px 4px;
}

.tabGrid_Pager a {
    padding: 0px 3px 1px 3px;
    color: #0b304b;
    margin-left: 2px;
    font-weight: 600;
}

.tabGrid_Pager .selected {
    background: #0b304b;
    border-radius: 50%;
    padding: 0px 5px;
    color: white;
    text-decoration: none;
    font-weight: 500;
    font-size: .9em;
}

.tabGridIn {
    border: 1px solid #999;
    background-color: #fff;
    color: #333;
}

    .tabGridIn .tabHeadIn {
        background-color: #384D5D;
        border: 1px solid #384D5D;
    }

    .tabGridIn th {
        font-size: .85em;
        color: #ddd;
        text-decoration: none;
        background-color: transparent;
        font-weight: 500;
        padding: 0px 2px;
        text-align: left;
        border-bottom: 0px solid #fff;
    }

        .tabGridIn th a {
            font-size: .9em;
            color: #ddd;
            text-decoration: none;
            background-color: transparent;
            font-weight: 500;
        }

            .tabGridIn th a:hover {
                text-decoration: none;
            }

    .tabGridIn td {
        font-size: .88em;
        padding: .05px 2px .1px 3px;
        text-align: left;
    }

    .tabGridIn .Not {
        right: 5px;
        border-radius: 25px;
        border: 1px solid #ce5c12;
        background-color: rgba(211, 84, 0, 0.10);
        text-align: center;
        padding: 0 5px;
        color: #ce5c12;
        font-weight: 600;
        font-size: .8rem;
        font-family: 'Open Sans', sans-serif;
    }

    .tabGridIn .tabHeadIn [type="checkbox"] + label:before,
    .tabGridIn .tabHeadIn [type="checkbox"]:not(.filled-in) + label:after {
        content: '';
        position: absolute;
        top: 0;
        left: 1px;
        width: 14px;
        height: 14px;
        z-index: 0;
        border: 2px solid #FFF;
        border-radius: 1px;
        margin-top: 3px;
        -webkit-transition: .2s;
        -o-transition: .2s;
        transition: .2s;
    }

    .tabGridIn .tabHeadIn [type="checkbox"]:checked + label:before {
        top: -3px;
        left: -4px;
        width: 9px;
        height: 17px;
        border-top: 2px solid transparent;
        border-left: 2px solid transparent;
        border-right: 2px solid #fff;
        border-bottom: 2px solid #fff;
        -webkit-transform: rotate(40deg);
        -ms-transform: rotate(40deg);
        transform: rotate(40deg);
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-transform-origin: 100% 100%;
        -ms-transform-origin: 100% 100%;
        transform-origin: 100% 100%;
    }

    .tabGridIn .algLeft {
        text-align: left;
    }

    .tabGridIn .bgrRight {
        border-right: 1px solid #384D5D;
        padding-left: 9px;
        padding-right: 4px;
    }

    .tabGridIn .bgrRightHead {
        border-right: 1px solid #fff;
        padding-left: 2px;
        padding-right: 7px;
    }

    .tabGridIn .on {
        background: #e4eaee;
    }

    .tabGridIn .selectRow {
        background: #bfcbd5;
    }

.tabGridIn_Pager table {
    margin: auto;
    float: right;
    border: none;
}

tr.tabGridIn_Pager {
    padding: 5px;
    text-align: center;
    background-color: rgba(0, 0, 0, 0.28);
}

.tabGridIn_Pager table td {
    font-size: .9em;
    padding: 2px 4px;
}

.tabGridIn_Pager a {
    padding: 0px 3px 1px 3px;
    color: #0b304b;
    margin-left: 2px;
    font-weight: 600;
}

.tabGridIn_Pager .selected {
    background: #0b304b;
    border-radius: 50%;
    padding: 0px 5px;
    color: white;
    text-decoration: none;
    font-weight: 500;
    font-size: .9em;
}

/*********Grid Global*********/

.tabGridGlobal {
    border: 1px solid #999;
    background-color: #fff;
    color: #333;
}

    .tabGridGlobal .tabHead {
        background-color: #0b304b;
        border: 1px solid #0b304b;
    }


        .tabGridGlobal .tabHead [type="checkbox"] + label:before,
        .tabGridGlobal .tabHead [type="checkbox"]:not(.filled-in) + label:after {
            content: '';
            position: absolute;
            top: 0;
            left: 4px;
            width: 14px;
            height: 14px;
            z-index: 0;
            border: 2px solid #FFF;
            border-radius: 1px;
            margin-top: 3px;
            -webkit-transition: .2s;
            -o-transition: .2s;
            transition: .2s;
        }

        .tabGridGlobal .tabHead [type="checkbox"]:checked + label:before {
            top: -3px;
            left: -6px;
            width: 9px;
            height: 17px;
            border-top: 2px solid transparent;
            border-left: 2px solid transparent;
            border-right: 2px solid #fff;
            border-bottom: 2px solid #fff;
            -webkit-transform: rotate(40deg);
            -ms-transform: rotate(40deg);
            transform: rotate(40deg);
            -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
            -webkit-transform-origin: 100% 100%;
            -ms-transform-origin: 100% 100%;
            transform-origin: 100% 100%;
        }

    .tabGridGlobal th {
        font-size: .85em;
        color: #ddd;
        text-decoration: none;
        background-color: transparent;
        font-weight: 500;
    }

        .tabGridGlobal th a {
            font-size: .85em;
            color: #ddd;
            text-decoration: none;
            background-color: transparent;
        }

            .tabGridGlobal th a:hover {
                text-decoration: none;
            }

    .tabGridGlobal td {
        font-size: .9em;
        padding: 2px 2px 1px 3px;
        text-align: left;
    }

    .tabGridGlobal .on {
        background: #e4eaee;
    }

    .tabGridGlobal .selectRow {
        background: #bfcbd5;
    }

.tabGridGlobal_Pager table {
    margin: auto;
    float: right;
    border: none;
}

tr.tabGridGlobal_Pager {
    text-align: center;
    background-color: rgba(0, 0, 0, 0.28);
}

.tabGridGlobal_Pager table td {
    font-size: .95em;
    padding: 2px;
    font-weight: 600
}

.tabGridGlobal_Pager a {
    background: #ddd;
    border: 1px solid #0b304b;
    padding: 1px 4px;
    color: #000;
}

.tabGridGlobal_Pager span {
    padding: 1px 4px;
    color: #fff;
    border: 1px solid #0b304b;
    background: #0b304b;
    text-decoration: none;
}


/*********Grid Asis******/
.tabGridAsis {
    font-size: .87em;
    border: 1px solid #999;
    margin: 0 0 3px 0;
    background-color: #fff;
    color: #333;
    border: 1px solid #0b304b;
}

    .tabGridAsis .tabHead {
        font-size: .9em;
        background-color: #0b304b;
        border: 1px solid #0b304b;
        color: #fff;
    }

    .tabGridAsis .tabHeadIin {
        background-color: #384D5D;
        border: 1px solid #384D5D;
        color: #fff;
    }

    .tabGridAsis th {
        padding: 0 1px;
        text-align: center;
        border-bottom: 0px solid #fff;
    }

        .tabGridAsis th a {
            color: #fff;
            text-decoration: none;
            background-color: transparent;
        }

            .tabGridAsis th a:hover {
                text-decoration: none;
            }

    .tabGridAsis td {
        padding: 0 1px;
        text-align: center;
        border-right: 1px solid #0b304b;
    }

    .tabGridAsis .on {
        background: #e4eaee;
    }

    .tabGridAsis .selectRow {
        background: #bfcbd5;
    }

    .tabGridAsis .FooterStyle {
        background-color: #384D5D;
        color: White;
        text-align: right;
        font-weight: 500;
    }

        .tabGridAsis .FooterStyle td {
            border: 1px solid #384D5D;
            font-weight: 500;
        }

/*******Grid Goblal ********/

.tabGridPanel {
    font-size: .85em;
    border: 0px solid #999;
    margin: 0 0 2px 0;
    background-color: transparent;
    color: #333;
}

    .tabGridPanel td {
        padding: 0px;
        margin: 0px;
    }

        .tabGridPanel td [type="checkbox"] + label:before,
        .tabGridPanel td [type="checkbox"]:not(.filled-in) + label:after {
            content: '';
            position: absolute;
            top: 0;
            left: 1px;
            width: 12px;
            height: 12px;
            z-index: 0;
            border: 2px solid #0b304b;
            border-radius: 1px;
            margin-top: 2px;
            -webkit-transition: .2s;
            -o-transition: .2s;
            transition: .2s;
        }

        .tabGridPanel td [type="checkbox"]:checked + label:before {
            top: -1px;
            left: -2px;
            width: 8px;
            height: 14px;
            border-top: 2px solid transparent;
            border-left: 2px solid transparent;
            border-right: 2px solid #0b304b;
            border-bottom: 2px solid #0b304b;
            -webkit-transform: rotate(40deg);
            -ms-transform: rotate(40deg);
            transform: rotate(40deg);
            -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
            -webkit-transform-origin: 100% 100%;
            -ms-transform-origin: 100% 100%;
            transform-origin: 100% 100%;
        }


        .tabGridPanel td [type="checkbox"] + label {
            position: relative;
            padding-left: 5px;
            cursor: pointer;
            display: inline-block;
            line-height: 14px;
            font-size: .8rem;
            -webkit-user-select: none;
            /* webkit (safari, chrome) browsers */
            -moz-user-select: none;
            /* mozilla browsers */
            -khtml-user-select: none;
            /* webkit (konqueror) browsers */
            -ms-user-select: none;
            margin: 0;
            /* IE10+ */
        }



/*********Cajas*********/

.ddlGen {
    border: 1px solid #838383;
    text-align: left;
    padding: 0px 2px;
    border-radius: 0.1rem;
    height: 25px;
    background: #FFF;
    /*margin-top: 1px;*/
    font-size: .95rem;
}

    .ddlGen :hover {
        border: 1px solid #838383;
        text-align: left;
        padding-top: 2px;
        border-radius: 0.1rem;
        padding: 2px;
    }

    .ddlGen:focus {
        border: 1px solid #838383;
        text-align: left;
        border-radius: 0.1rem;
        padding: 0px 2px;
    }

.ddlGenIn {
    font-size: .9em;
    border: 1px solid #838383;
    text-align: left;
    padding: 1px;
    border-radius: 0.1rem;
    height: 25px;
    background: #FFF;
}

    .ddlGenIn :hover {
        border: 1px solid #838383;
        text-align: left;
        padding-top: 1px;
        border-radius: 0.1rem;
        padding: 1px;
    }

    .ddlGenIn:focus {
        border: 1px solid #838383;
        text-align: left;
        padding-top: 1px;
        border-radius: 0.1rem;
        padding: 1px;
    }
/*.ddlGen:focus {
        border: 1px solid #838383;
        content: "";
    }*/


.ddlTransparet {
    border: 1px solid rgba(255, 255, 255, 0.60);
    text-align: left;
    font-size: .85em;
    padding: 0px;
    margin: 0 0 0 0;
    height: 21px;
    background: rgba(15, 56, 86, 0.10);
    color: #fff;
}

    .ddlTransparet:focus {
        border: 1px solid rgba(255, 255, 255, 0.60);
        text-align: left;
        font-size: .85em;
        padding: 0px;
        margin: 0 0 0 0;
        height: 21px;
        background: #0b304b;
        color: #fff;
    }

.txtGen {
    border: 1px solid #838383;
    text-align: left;
    border-radius: 0.1rem;
    padding: 2px 4px 4px 4px;
    height: 25px;
    background: #fff;
    /*margin-top: 1px;*/
    font-size: .95em;
}

    .txtGen :hover {
        border: 1px solid #838383;
        text-align: left;
        border-radius: 0.1rem;
        padding: 2px 4px 4px 4px;
    }

    .txtGen:focus {
        border: 1px solid #838383;
        text-align: left;
        border-radius: 0.1rem;
        padding: 2px 4px 4px 4px;
    }

.txtTransparet {
    border: 1px solid rgba(255, 255, 255, 0.60);
    text-align: left;
    font-size: 1em;
    padding: 2px 4px 4px 4px;
    margin: 1px 0 0 2px;
    height: 20px;
    background: rgba(15, 56, 86, 0.10);
    color: #fff;
}

    .txtTransparet:focus {
        border: 1px solid rgba(255, 255, 255, 0.60);
        text-align: left;
        font-size: 1em;
        padding: 2px 4px 4px 4px;
        margin: 1px 0 0 2px;
        height: 20px;
        background: rgba(126, 156, 178, 0.30);
        color: #fff;
    }

.txtGenIn {
    border: 1px solid #838383;
    text-align: left;
    border-radius: 0.1rem;
    font-size: .8em;
    padding: 3px 4px 0px 4px;
    height: 21px;
    background: #fff;
}

    .txtGenIn :hover {
        border: 1px solid #838383;
        text-align: left;
        border-radius: 0.1rem;
        padding: 2px 4px 4px 4px;
    }

    .txtGenIn:focus {
        border: 1px solid #838383;
        text-align: left;
        border-radius: 0.1rem;
        padding: 2px 4px 4px 4px;
    }

.txtIncome {
    border: 1px solid #838383;
    text-align: left;
    border-radius: 0.1rem;
    padding: 2px 4px 4px 4px;
    height: 25px;
    background: #fff;
    /*margin-top: 1px;*/
    font-size: .95em;
}

    .txtIncome :hover {
        border: 1px solid #838383;
        text-align: left;
        border-radius: 0.1rem;
    }

    .txtIncome:focus {
        border: 1px solid #838383;
        text-align: left;
        border-radius: 0.1rem;
    }

.txtIp {
    border: 1px solid #838383;
    text-align: left;
    border-radius: 0.1rem;
    padding: 2px 4px 4px 4px;
    height: 25px;
    background: #fff;
    /*margin-top: 1px;*/
    font-size: .95em;
}

    .txtIp :hover {
        border: 1px solid #838383;
        text-align: left;
        border-radius: 0.1rem;
    }

    .txtIp:focus {
        border: 1px solid #838383;
        text-align: left;
        border-radius: 0.1rem;
    }

.txtUpper {
    font-size: .9em;
    border: 1px solid #838383;
    text-align: left;
    padding: 2px 4px 4px 4px;
    border-radius: 0.1rem;
    height: 25px;
    text-transform: uppercase;
    background: #fff;
}

    .txtUpper :hover {
        border: 1px solid #838383;
        text-align: left;
        border-radius: 0.1rem;
        text-transform: uppercase;
    }

    .txtUpper:focus {
        border: 1px solid #838383;
        text-align: left;
        border-radius: 0.1rem;
        text-transform: uppercase;
    }

.txtVacation {
    font-size: .95em;
    border: 1px solid #838383;
    text-align: left;
    padding: 3px 5px;
    border-radius: 0.1rem;
    height: 22px;
    background: #fff;
}

.lblRigth {
    text-align: right;
}

/**********sitemap*******/

.divSiteMap {
    float: left;
    width: 100%;
    min-width: 1000px;
    padding: 5px 2px 0px 15px;
    height: 32px;
    display: block;
}

    .divSiteMap a {
        color: #0b304b;
        font-weight: 500;
    }

    .divSiteMap span {
        color: rgb(112, 112, 112);
    }

/*******Panel busqueda*****/
.heads {
    border: 1px solid #0b304b;
    background: #0b304b;
    padding: 0px 0px 1px 5px;
    color: #ddd;
    display: flow-root;
    font-size: .9em
}

    .heads a {
        color: #ddd;
    }

    .heads [type="checkbox"] + label {
        position: relative;
        padding-left: 20px;
        cursor: pointer;
        display: inline-block;
        line-height: 20px;
        font-size: .85rem;
        -webkit-user-select: none;
        /* webkit (safari, chrome) browsers */
        -moz-user-select: none;
        /* mozilla browsers */
        -khtml-user-select: none;
        /* webkit (konqueror) browsers */
        -ms-user-select: none;
        margin: 0;
        color: #ddd;
        /* IE10+ */
    }

        .heads [type="checkbox"] + label:before,
        .heads [type="checkbox"]:not(.filled-in) + label:after {
            content: '';
            position: absolute;
            top: 0;
            left: 0px;
            width: 14px;
            height: 14px;
            z-index: 0;
            border: 2px solid #ddd;
            border-radius: 1px;
            margin-top: 3px;
            -webkit-transition: .2s;
            -o-transition: .2s;
            transition: .2s;
        }

    .heads [type="checkbox"]:checked + label:before {
        top: -3px;
        left: -6px;
        width: 9px;
        height: 17px;
        border-top: 2px solid transparent;
        border-left: 2px solid transparent;
        border-right: 2px solid #ddd;
        border-bottom: 2px solid #ddd;
        -webkit-transform: rotate(40deg);
        -ms-transform: rotate(40deg);
        transform: rotate(40deg);
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-transform-origin: 100% 100%;
        -ms-transform-origin: 100% 100%;
        transform-origin: 100% 100%;
    }

.secGen {
    border: 1px solid #999;
    /*border-radius: 0 0 4px 4px;*/
    background-color: #f7f7f7;
    padding: 2px 6px 2px 6px;
}

.divResultsGrid {
    /*border: 1px solid #999;*/
    background-color: #f7f7f7;
    padding: 2px 6px 2px 6px;
    width: 100%;
    overflow-y: hidden;
    overflow-x: scroll;
}

.secTitles {
    border: 1px solid #999;
    background-color: #f7f7f7;
}

.headsGrp {
    border: 1px solid #0b304b;
    background: #0b304b;
    padding: 1px 1px 1px 3px;
    color: #ddd;
    font-size: .9em;
}
/*******Foto******/

.circulo {
    width: 90px;
    height: 105px;
    border-radius: 12%;
    -moz-border-radius: 12%;
    -webkit-border-radius: 12%;
    border: 2px solid #0b304b;
    background-image: url('../img/imgPhoto.png');
    background-position: center;
    background-size: cover;
}

.circuloVac {
    width: 80px;
    height: 100px;
    border-radius: 15%;
    -moz-border-radius: 15%;
    -webkit-border-radius: 15%;
    border: 2px solid #0b304b;
    background-image: url('../img/imgPhoto.png');
    background-position: center;
    background-size: cover;
}


/****Barra reportes*****/

.BodyReporte {
    height: 33px;
    background: #384D5D;
    border: 1px solid #445d70;
    background: rgba(90,118,138,1);
    background: -moz-linear-gradient(top, rgba(90,118,138,1) 0%, rgba(56,77,93,1) 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(90,118,138,1)), color-stop(100%, rgba(56,77,93,1)));
    background: -webkit-linear-gradient(top, rgba(90,118,138,1) 0%, rgba(56,77,93,1) 100%);
    background: -o-linear-gradient(top, rgba(90,118,138,1) 0%, rgba(56,77,93,1) 100%);
    background: -ms-linear-gradient(top, rgba(90,118,138,1) 0%, rgba(56,77,93,1) 100%);
    background: linear-gradient(to bottom, rgba(90,118,138,1) 0%, rgba(56,77,93,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5a768a', endColorstr='#384d5d', GradientType=0 );
}

    .BodyReporte a {
        margin-top: 4px;
        font-size: 18px;
        vertical-align: middle;
        text-align: center;
        color: #fff;
        text-decoration: none;
    }

        .BodyReporte a:hover {
            color: #9f9f9f;
        }


/******Panel********/
.pnlChk {
    position: absolute;
    border: 1px solid #0b304b;
    padding: 2px 5px;
    font-size: .9em;
    color: #333333;
    overflow-x: hidden;
    overflow-y: hidden;
    height: 29.1vh;
    width: 100%;
}

.pnlNoBorder {
    position: absolute;
    padding: 2px 5px;
    font-size: .9em;
    color: #333333;
    overflow-x: hidden;
    overflow-y: hidden;
    width: 100%;
}

.pnlChk85 {
    position: absolute;
    border: 1px solid #0b304b;
    padding: 2px 5px;
    font-size: .9em;
    color: #333333;
    overflow-x: hidden;
    overflow-y: hidden;
    height: 158px;
    width: 100%;
}

.pnlChkFull {
    border: 1px solid #0b304b;
    color: #333333;
}

.pnlMassive {
    position: relative;
    border: 1px solid #0b304b;
    padding: 2px 5px;
    font-size: .9em;
    color: #333333;
    overflow-x: hidden;
    overflow-y: hidden;
}

.pnlChkEjem {
    border: 1px solid rgb(164, 192, 212);
    color: #333333;
    height: calc(100vh - 170px);
}

.pnlChkEjem01 {
    border: 1px solid rgb(164, 192, 212);
    color: #333333;
    height: 350px;
}

.pnlChkReport {
    position: absolute;
    border: 1px solid #0b304b;
    padding: 2px 5px;
    font-size: .95em;
    color: #333333;
    overflow-x: hidden;
    overflow-y: hidden;
    height: 100px;
    width: 100%;
}

.pnlGlobal {
    border: 1px solid rgb(164, 192, 212);
    color: #333333;
    overflow-x: visible;
    overflow-y: visible;
    padding: 0 5px;
}

legend {
    display: block;
    width: 100%;
    max-width: 100%;
    padding: 0;
    margin-bottom: 0.5rem;
    font-size: .9rem;
    line-height: inherit;
    color: inherit;
    white-space: normal;
}

/***Media Screen***/
@media (max-width:767px) {
    .visibilidad {
        display: none;
    }

    .visibilidad-inverse {
        display: block;
    }
}

@media (min-width:0px) and (max-width:981px) {
    .visibilidad-md {
        display: none;
    }

    .visibilidad-inverse-md {
        display: block;
    }
}

@media (min-width:620px) and (max-width:981px) {

    .visibilidad-sm {
        display: none;
    }

    .visibilidad-inverse-sm {
        display: block;
    }
}

@media screen and (min-width:800px) and (max-width:1024px) {
    .font14 {
        font-size: 14px;
    }

    .font12 {
        font-size: 12px;
    }
}


/* inicia div advertencias */

#info_message {
    display: none;
    width: 100%;
    position: absolute;
    z-index: 99;
    height: auto;
}

    #info_message .message_area {
        font-size: .85em;
        font-family: Arial,Verdana;
    }

/*termina div advertencias*/

/*******GridPermisos*****/

.accordionHeader {
    border: 1px solid #0b304b;
    background: #0b304b;
    padding: 2px;
    color: #ddd;
    text-align: center;
    width: 99%;
    font-size: .85em;
}

.accordionHeaderItem {
    padding: 2px;
    text-align: center;
}

    .accordionHeaderItem td {
        padding: 2px;
        text-align: center;
    }

.accordionContent {
    background-color: #f8f8f8;
    border: 1px dashed #cacaca;
    border-top: none;
    padding: 5px 0;
    color: #333;
}

.switch {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 18px;
    left: 18px;
}

    .switch input {
        display: none;
    }

.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #d0d0d0;
    -webkit-transition: .4s;
    transition: .4s;
}

    .slider:before {
        position: absolute;
        content: "";
        height: 15px;
        width: 15px;
        left: 2px;
        bottom: 2px;
        background-color: white;
        -webkit-transition: .4s;
        transition: .4s;
    }

input:checked + .slider {
    background-color: #0b304b;
}

input:focus + .slider {
    box-shadow: 0 0 1px #0b304b;
}

input:checked + .slider:before {
    -webkit-transform: translateX(40px);
    -ms-transform: translateX(40px);
    transform: translateX(40px);
}

/* Rounded sliders */
.slider.round {
    border-radius: 15px;
    width: 60px;
    height: 18px;
}

    .slider.round.dis {
        background-color: #bebdbd;
    }

    .slider.round:before {
        border-radius: 50%;
    }

.num {
    background: #384D5D;
    color: #fff;
    border-radius: 50%;
    text-align: center;
    font-size: .7em;
    font-weight: 500;
    display: inline-block;
    padding: 1px;
}

.numEjem {
    background: #5c7b93;
    color: #fff;
    border-radius: 50%;
    text-align: center;
    font-size: .75em;
    font-weight: 500;
    display: inline-block;
    padding: 0px 1px 1px 1px;
}

    .numEjem:hover {
        background: #5c7b93;
        color: #efeeee;
        border-radius: 50%;
        text-align: center;
    }

.divPhoto {
    border: 1px solid #0b304b;
    z-index: 2;
    min-width: 130px;
    max-width: 130px;
    height: 150px;
    position: relative;
    cursor: pointer;
}

    .divPhoto .ImageButton {
        top: -0px;
        position: absolute;
        cursor: pointer;
    }

.file {
    position: relative;
    filter: alpha(opacity: 0);
    opacity: 0;
    min-width: 130px;
    max-width: 130px;
    cursor: pointer;
    height: 150px;
    z-index: 5;
    cursor: pointer;
}

.secPhotoSup {
    border: 1px solid #0b304b;
    z-index: 2;
    max-width: 120px;
    height: 142px;
    background-repeat: no-repeat;
    background-size: 99% 99%;
    padding: 1px;
}

.secPhotoTools {
    /*border: 1px solid #0b304b;*/
    z-index: 2;
    max-width: 100%;
    height: 220px;
    background-repeat: no-repeat;
    background-size: 99% 99%;
    padding: 2px;
}

.fileinputsTools {
    position: relative;
    min-width: 50px;
    max-width: 50px;
    width: 50px;
    height: 100%;
}

.fakefileTools {
    position: absolute;
    min-width: 100%;
    max-width: 100%;
    width: 50px;
    height: 100%;
    top: -1px;
    z-index: 1;
}

.fileTools {
    position: relative;
    filter: alpha(opacity: 50);
    opacity: 50;
    border: 1px solid #a31919;
    width: 50px;
    min-width: 50px;
    max-width: 50px;
    cursor: pointer;
    height: 100%;
    z-index: 5;
}

.cellTextRed {
    color: #b20e0e;
}

.cellRed {
    background: #ebabab;
    border: 1px solid #b20e0e;
}

.cellGreen {
    background: #c4e5be;
    border: 1px solid #5ca959;
}

.cellYellow {
    background: #fff7c4;
    border: 1px solid #f1d343;
}

.cellOrange {
    background: #f5c9af;
    border: 1px solid #e67e25;
}

.cellPurple {
    background: #e2d2ee;
    border: 1px solid #7438a3
}

.cellBlue {
    background: rgb(205, 227, 242);
    border: 1px solid #323e75
}

.cellMagenta {
    background: #d1eeec;
    border: 1px solid #58a5a5
}

.cellRose {
    background: #ecd8ea;
    border: 1px solid #8d5287
}

.shake {
    display: inline-block;
    transform-origin: center center;
}

.shake-freeze,
.shake-constant.shake-constant--hover:hover,
.shake-trigger:hover .shake-constant.shake-constant--hover {
    animation-play-state: paused;
}

    .shake-freeze:hover,
    .shake-trigger:hover .shake-freeze, .shake:hover,
    .shake-trigger:hover .shake {
        animation-play-state: running;
    }

@keyframes shake {
    2% {
        transform: translate(0.5px, 0.5px) rotate(-0.5deg);
    }

    4% {
        transform: translate(0.5px, 2.5px) rotate(1.5deg);
    }

    6% {
        transform: translate(-0.5px, 1.5px) rotate(0.5deg);
    }

    8% {
        transform: translate(2.5px, 1.5px) rotate(-0.5deg);
    }

    10% {
        transform: translate(-1.5px, 0.5px) rotate(1.5deg);
    }

    12% {
        transform: translate(2.5px, -1.5px) rotate(-0.5deg);
    }

    14% {
        transform: translate(0.5px, -0.5px) rotate(1.5deg);
    }

    16% {
        transform: translate(1.5px, 1.5px) rotate(-0.5deg);
    }

    18% {
        transform: translate(-0.5px, 0.5px) rotate(0.5deg);
    }

    20% {
        transform: translate(-0.5px, -0.5px) rotate(-0.5deg);
    }

    22% {
        transform: translate(-1.5px, -1.5px) rotate(-0.5deg);
    }

    24% {
        transform: translate(1.5px, -0.5px) rotate(1.5deg);
    }

    26% {
        transform: translate(1.5px, 1.5px) rotate(0.5deg);
    }

    28% {
        transform: translate(2.5px, 1.5px) rotate(0.5deg);
    }

    30% {
        transform: translate(2.5px, 0.5px) rotate(1.5deg);
    }

    32% {
        transform: translate(-0.5px, -0.5px) rotate(0.5deg);
    }

    34% {
        transform: translate(-1.5px, -0.5px) rotate(-0.5deg);
    }

    36% {
        transform: translate(-1.5px, 2.5px) rotate(0.5deg);
    }

    38% {
        transform: translate(2.5px, 2.5px) rotate(0.5deg);
    }

    40% {
        transform: translate(2.5px, 0.5px) rotate(0.5deg);
    }

    42% {
        transform: translate(1.5px, 2.5px) rotate(-0.5deg);
    }

    44% {
        transform: translate(0.5px, -1.5px) rotate(1.5deg);
    }

    46% {
        transform: translate(2.5px, 0.5px) rotate(1.5deg);
    }

    48% {
        transform: translate(-0.5px, -0.5px) rotate(1.5deg);
    }

    50% {
        transform: translate(2.5px, 1.5px) rotate(1.5deg);
    }

    52% {
        transform: translate(0.5px, 0.5px) rotate(0.5deg);
    }

    54% {
        transform: translate(-0.5px, -1.5px) rotate(-0.5deg);
    }

    56% {
        transform: translate(0.5px, 1.5px) rotate(0.5deg);
    }

    58% {
        transform: translate(2.5px, 0.5px) rotate(0.5deg);
    }

    60% {
        transform: translate(-1.5px, 0.5px) rotate(0.5deg);
    }

    62% {
        transform: translate(0.5px, 1.5px) rotate(0.5deg);
    }

    64% {
        transform: translate(-0.5px, 0.5px) rotate(-0.5deg);
    }

    66% {
        transform: translate(0.5px, 0.5px) rotate(0.5deg);
    }

    68% {
        transform: translate(-1.5px, 0.5px) rotate(1.5deg);
    }

    70% {
        transform: translate(-0.5px, 2.5px) rotate(1.5deg);
    }

    72% {
        transform: translate(-0.5px, 0.5px) rotate(0.5deg);
    }

    74% {
        transform: translate(-1.5px, 0.5px) rotate(0.5deg);
    }

    76% {
        transform: translate(-1.5px, 0.5px) rotate(0.5deg);
    }

    78% {
        transform: translate(-0.5px, 2.5px) rotate(1.5deg);
    }

    80% {
        transform: translate(-1.5px, 1.5px) rotate(-0.5deg);
    }

    82% {
        transform: translate(1.5px, 1.5px) rotate(-0.5deg);
    }

    84% {
        transform: translate(0.5px, -0.5px) rotate(1.5deg);
    }

    86% {
        transform: translate(0.5px, -1.5px) rotate(-0.5deg);
    }

    88% {
        transform: translate(1.5px, 1.5px) rotate(0.5deg);
    }

    90% {
        transform: translate(2.5px, 0.5px) rotate(-0.5deg);
    }

    92% {
        transform: translate(2.5px, -0.5px) rotate(-0.5deg);
    }

    94% {
        transform: translate(-1.5px, 1.5px) rotate(0.5deg);
    }

    96% {
        transform: translate(-1.5px, 0.5px) rotate(0.5deg);
    }

    98% {
        transform: translate(-1.5px, 0.5px) rotate(1.5deg);
    }

    0%, 100% {
        transform: translate(0, 0) rotate(0);
    }
}

.shake:hover,
.shake-trigger:hover .shake, .shake.shake-freeze, .shake.shake-constant {
    animation-name: shake;
    animation-duration: 500ms;
    animation-timing-function: ease-in-out;
    animation-iteration-count: 3;
}

/*******Calendar*****/
.calExtender {
    position: absolute;
}

    .calExtender .ajax__calendar_container {
        background-color: #384D5D;
        border: solid 1px #0b304b;
        width: 176px;
    }

    .calExtender .ajax__calendar_header {
        background: #384D5D;
        color: #FFFFFF;
        font-size: 11px;
        font-family: Arial;
    }

    .calExtender .ajax__calendar_body {
        background-color: #FFFFFF;
        border: solid 1px #0b304b;
        width: 167px;
        height: 135px;
        font-size: 10px;
        font-family: Arial;
    }

    .calExtender .ajax__calendar_dayname {
        text-align: center;
        font-weight: bold;
        color: #144A71;
        font-size: 11px;
        font-family: Arial;
        margin-bottom: 8px;
    }

    .calExtender .ajax__calendar_day {
        color: #144A71;
        text-align: center;
        font-size: 10.5px;
        font-family: 'Arial Unicode MS', Arial;
    }

    .calExtender .ajax__calendar_month {
        color: #144A71;
        text-align: center;
        font-size: 11px;
        font-family: 'Arial Unicode MS', Arial;
    }

    .calExtender .ajax__calendar_year {
        color: #144A71;
        text-align: center;
        font-size: 11px;
        font-family: 'Arial Unicode MS', Arial;
    }

    .calExtender .ajax__calendar_hover .ajax__calendar_day,
    .calExtender .ajax__calendar_hover .ajax__calendar_month,
    .calExtender .ajax__calendar_hover .ajax__calendar_year,
    .calExtender .ajax__calendar_active {
        color: #144A71;
        font-weight: bold;
        background-color: #edeeee;
    }

    .calExtender .ajax__calendar_today {
        font-weight: bold;
    }

    .calExtender .ajax__calendar_footer {
        color: #FFFFFF;
        font-size: 11px;
        font-family: Arial;
    }

    .calExtender .ajax__calendar_other,
    .calExtender .ajax__calendar_hover .ajax__calendar_today,
    .calExtender .ajax__calendar_hover .ajax__calendar_title {
        color: #cccccc;
    }

    .calExtender .ajax__calendar_prev {
        background: url(../../Content/img/arrowPrev.png) no-repeat 50% 50%;
    }

    .calExtender .ajax__calendar_next {
        background: url(../../Content/img/arrowNext.png) no-repeat 50% 50%;
    }

.loader,
.loader:before,
.loader:after {
    border-radius: 50%;
    width: 1.5em;
    height: 1.5em;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation: load7 1.8s infinite ease-in-out;
    animation: load7 1.8s infinite ease-in-out;
}

.loader {
    color: #0b304b;
    font-size: 8px;
    margin-left: 25px;
    text-indent: -9999em;
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-animation-delay: -0.8s;
    animation-delay: -0.8s;
}

    .loader:before,
    .loader:after {
        content: '';
        position: absolute;
        top: 0;
    }

    .loader:before {
        left: -2.1em;
        -webkit-animation-delay: -0.32s;
        animation-delay: -0.32s;
    }

    .loader:after {
        left: 2.1em;
    }

@-webkit-keyframes load7 {
    0%, 80%, 100% {
        box-shadow: 0 5em 0 -1em;
    }

    40% {
        box-shadow: 0 2em 0 0;
    }
}

@keyframes load7 {
    0%, 80%, 100% {
        box-shadow: 0 2em 0 -1em;
    }

    40% {
        box-shadow: 0 2em 0 0;
    }
}


.loaderlg {
    color: #0b304b;
    font-size: 20px;
    margin: 100px auto;
    width: 1em;
    height: 1em;
    border-radius: 50%;
    position: relative;
    text-indent: -9999em;
    -webkit-animation: load4 1.3s infinite linear;
    animation: load4 1.3s infinite linear;
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
}


@-webkit-keyframes load4 {
    0%, 100% {
        box-shadow: 0 -3em 0 0.2em, 2em -2em 0 0em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 0;
    }

    12.5% {
        box-shadow: 0 -3em 0 0, 2em -2em 0 0.2em, 3em 0 0 0, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
    }

    25% {
        box-shadow: 0 -3em 0 -0.5em, 2em -2em 0 0, 3em 0 0 0.2em, 2em 2em 0 0, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
    }

    37.5% {
        box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 0, 2em 2em 0 0.2em, 0 3em 0 0em, -2em 2em 0 -1em, -3em 0em 0 -1em, -2em -2em 0 -1em;
    }

    50% {
        box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 0em, 0 3em 0 0.2em, -2em 2em 0 0, -3em 0em 0 -1em, -2em -2em 0 -1em;
    }

    62.5% {
        box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 0, -2em 2em 0 0.2em, -3em 0 0 0, -2em -2em 0 -1em;
    }

    75% {
        box-shadow: 0em -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0.2em, -2em -2em 0 0;
    }

    87.5% {
        box-shadow: 0em -3em 0 0, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0, -2em -2em 0 0.2em;
    }
}

@keyframes load4 {
    0%, 100% {
        box-shadow: 0 -3em 0 0.2em, 2em -2em 0 0em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 0;
    }

    12.5% {
        box-shadow: 0 -3em 0 0, 2em -2em 0 0.2em, 3em 0 0 0, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
    }

    25% {
        box-shadow: 0 -3em 0 -0.5em, 2em -2em 0 0, 3em 0 0 0.2em, 2em 2em 0 0, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
    }

    37.5% {
        box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 0, 2em 2em 0 0.2em, 0 3em 0 0em, -2em 2em 0 -1em, -3em 0em 0 -1em, -2em -2em 0 -1em;
    }

    50% {
        box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 0em, 0 3em 0 0.2em, -2em 2em 0 0, -3em 0em 0 -1em, -2em -2em 0 -1em;
    }

    62.5% {
        box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 0, -2em 2em 0 0.2em, -3em 0 0 0, -2em -2em 0 -1em;
    }

    75% {
        box-shadow: 0em -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0.2em, -2em -2em 0 0;
    }

    87.5% {
        box-shadow: 0em -3em 0 0, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0, -2em -2em 0 0.2em;
    }
}

.FileUploadClass {
    position: relative;
    z-index: 10;
    opacity: 0;
    filter: alpha(opacity = 0);
    z-index: 500;
    width: 99%;
    cursor: pointer;
}

    .FileUploadClass input[type=file] {
        background: transparent;
        opacity: 0;
        filter: alpha(opacity = 0);
        width: 99%;
        cursor: pointer;
    }

.FakeFileUpload {
    position: relative;
    z-index: 1;
    width: 100%;
    cursor: pointer;
}

.FakeFileUploadDiv {
    position: absolute;
    z-index: 5;
    width: 100%;
    cursor: pointer;
}

/*******modal*****/

.modalBackground {
    z-index: 1050;
    position: relative;
    background-color: rgb(158, 170, 180);
    filter: alpha(opacity=50);
    opacity: 0.5;
    transition: -webkit-transform .3s ease-out;
    transition: transform .3s ease-out;
    transition: transform .3s ease-out,-webkit-transform .3s ease-out;
    /*  -webkit-transform: translate(0,-25%);
    transform: translate(0,-25%)*/
}

.cssload-thecube {
    width: 177px;
    height: 177px;
    margin: 0 auto;
    position: relative;
    transform: rotateZ(45deg);
    -o-transform: rotateZ(45deg);
    -ms-transform: rotateZ(45deg);
    -webkit-transform: rotateZ(45deg);
    -moz-transform: rotateZ(45deg);
}

    .cssload-thecube .cssload-cube {
        position: relative;
        transform: rotateZ(45deg);
        -o-transform: rotateZ(45deg);
        -ms-transform: rotateZ(45deg);
        -webkit-transform: rotateZ(45deg);
        -moz-transform: rotateZ(45deg);
    }

    .cssload-thecube .cssload-cube {
        float: left;
        width: 50%;
        height: 50%;
        position: relative;
        transform: scale(1.1);
        -o-transform: scale(1.1);
        -ms-transform: scale(1.1);
        -webkit-transform: scale(1.1);
        -moz-transform: scale(1.1);
    }

        .cssload-thecube .cssload-cube:before {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: #0b304b;
            animation: cssload-fold-thecube 2.76s infinite linear both;
            -o-animation: cssload-fold-thecube 2.76s infinite linear both;
            -ms-animation: cssload-fold-thecube 2.76s infinite linear both;
            -webkit-animation: cssload-fold-thecube 2.76s infinite linear both;
            -moz-animation: cssload-fold-thecube 2.76s infinite linear both;
            transform-origin: 100% 100%;
            -o-transform-origin: 100% 100%;
            -ms-transform-origin: 100% 100%;
            -webkit-transform-origin: 100% 100%;
            -moz-transform-origin: 100% 100%;
        }

    .cssload-thecube .cssload-c2 {
        transform: scale(1.1) rotateZ(90deg);
        -o-transform: scale(1.1) rotateZ(90deg);
        -ms-transform: scale(1.1) rotateZ(90deg);
        -webkit-transform: scale(1.1) rotateZ(90deg);
        -moz-transform: scale(1.1) rotateZ(90deg);
    }

    .cssload-thecube .cssload-c3 {
        transform: scale(1.1) rotateZ(180deg);
        -o-transform: scale(1.1) rotateZ(180deg);
        -ms-transform: scale(1.1) rotateZ(180deg);
        -webkit-transform: scale(1.1) rotateZ(180deg);
        -moz-transform: scale(1.1) rotateZ(180deg);
    }

    .cssload-thecube .cssload-c4 {
        transform: scale(1.1) rotateZ(270deg);
        -o-transform: scale(1.1) rotateZ(270deg);
        -ms-transform: scale(1.1) rotateZ(270deg);
        -webkit-transform: scale(1.1) rotateZ(270deg);
        -moz-transform: scale(1.1) rotateZ(270deg);
    }

    .cssload-thecube .cssload-c2:before {
        animation-delay: 0.35s;
        -o-animation-delay: 0.35s;
        -ms-animation-delay: 0.35s;
        -webkit-animation-delay: 0.35s;
        -moz-animation-delay: 0.35s;
    }

    .cssload-thecube .cssload-c3:before {
        animation-delay: 0.69s;
        -o-animation-delay: 0.69s;
        -ms-animation-delay: 0.69s;
        -webkit-animation-delay: 0.69s;
        -moz-animation-delay: 0.69s;
    }

    .cssload-thecube .cssload-c4:before {
        animation-delay: 1.04s;
        -o-animation-delay: 1.04s;
        -ms-animation-delay: 1.04s;
        -webkit-animation-delay: 1.04s;
        -moz-animation-delay: 1.04s;
    }


/**Calendario***/

.ajax__calendar_day {
    width: 100%;
}

.ajax__calendar_dayname {
    width: 23px !important;
}

@keyframes cssload-fold-thecube {
    0%, 10% {
        transform: perspective(228px) rotateX(-180deg);
        opacity: 0;
    }

    25%, 75% {
        transform: perspective(228px) rotateX(0deg);
        opacity: 1;
    }

    90%, 100% {
        transform: perspective(228px) rotateY(180deg);
        opacity: 0;
    }
}

@-o-keyframes cssload-fold-thecube {
    0%, 10% {
        -o-transform: perspective(228px) rotateX(-180deg);
        opacity: 0;
    }

    25%, 75% {
        -o-transform: perspective(228px) rotateX(0deg);
        opacity: 1;
    }

    90%, 100% {
        -o-transform: perspective(228px) rotateY(180deg);
        opacity: 0;
    }
}

@-ms-keyframes cssload-fold-thecube {
    0%, 10% {
        -ms-transform: perspective(228px) rotateX(-180deg);
        opacity: 0;
    }

    25%, 75% {
        -ms-transform: perspective(228px) rotateX(0deg);
        opacity: 1;
    }

    90%, 100% {
        -ms-transform: perspective(228px) rotateY(180deg);
        opacity: 0;
    }
}

@-webkit-keyframes cssload-fold-thecube {
    0%, 10% {
        -webkit-transform: perspective(228px) rotateX(-180deg);
        opacity: 0;
    }

    25%, 75% {
        -webkit-transform: perspective(228px) rotateX(0deg);
        opacity: 1;
    }

    90%, 100% {
        -webkit-transform: perspective(228px) rotateY(180deg);
        opacity: 0;
    }
}

@-moz-keyframes cssload-fold-thecube {
    0%, 10% {
        -moz-transform: perspective(228px) rotateX(-180deg);
        opacity: 0;
    }

    25%, 75% {
        -moz-transform: perspective(228px) rotateX(0deg);
        opacity: 1;
    }

    90%, 100% {
        -moz-transform: perspective(228px) rotateY(180deg);
        opacity: 0;
    }
}

.modal-open {
    padding-right: 0px !important;
}


/******Login******/



.txtBox {
    outline: none;
    background: rgba(255, 255, 255, 0.00);
    border-top: 0px;
    border-left: 0px;
    border-right: 0px;
    border-bottom: 1px solid #fff;
    color: #efeeee;
    width: 100%;
    font-size: 1.3em !important;
    padding: 0.3rem;
}

    .txtBox :hover {
        background: rgba(255, 255, 255, 0.00);
        outline: none;
        border-top: 0px;
        border-left: 0px;
        border-right: 0px;
        border-bottom: 1px solid #fff;
        color: #efeeee;
        width: 100%;
    }

    .txtBox:focus, input:focus {
        outline: none;
        border-top: 0px;
        border-left: 0px;
        border-right: 0px;
        border-bottom: 1px solid #fff;
        color: #efeeee;
        width: 100%;
        background: rgba(255, 255, 255, 0.00);
    }

.ddlBox {
    background: rgba(255, 255, 255, 0.00);
    margin-top: 5px;
    border-top: 0px;
    border-left: 0px;
    border-right: 0px;
    border-bottom: 1px solid #fff;
    margin-bottom: 15px;
    color: #fff;
    width: 100%;
    font-size: 1.3em !important;
    padding: 0.3rem;
}

    .ddlBox:focus, input:focus {
        outline: none;
        color: #0b304b;
        background: rgba(255, 255, 255, 0.30);
    }

.btnBox {
    background-color: #000;
    border: 0;
    color: #fff;
    padding: 13px 0;
    font-size: 16px;
    text-align: center;
    width: 100%;
}

.forgetBox {
    padding-top: 40px;
    padding-bottom: 20px;
    color: #fff;
    font-size: 12px;
    text-align: center;
    width: 100%;
}

::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #adadad;
    opacity: 1; /* Firefox */
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: #adadad;
}

::-ms-input-placeholder { /* Microsoft Edge */
    color: #adadad;
}

/*LOGIN*/
.bgLogin {
    width: 100%;
    height: 100vh;
}

.bgLoginImg {
    background-repeat: no-repeat;
    /*background-size: 100% 57%;*/
    background-size: cover;
    background-position: left top;
    background-attachment: fixed;
}

.bgOpacity {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100vh;
    background-color: rgba(0,0,0,0.3); /*en caso de que la imagen de fondo sea muy brillante se puede subir o bajar la opacidad*/
}

.tituloLogin {
    padding-top: 25px;
    font-size: 1.5em;
}

.logoLogin {
    height: 270px;
    padding-top: 10px;
}

.logoLoginCompany {
    height: 100px;
}

.logoGeneral {
    height: 45px;
    width: 43px;
}

.divNoty {
    float: right;
    margin: 5px 0;
}

.Den {
    /*border: 1px solid #800000;*/
    background-color: #F0D5D5;
    text-align: center;
}

.Aut {
    /*border: 1px solid #006600;*/
    background-color: #CEEECC;
    text-align: center;
}

.Canel {
    /*border: 1px solid #D95700;*/
    background-color: #FFE1CE;
    text-align: center;
}

.round {
    line-height: 37px;
    color: #ffffff;
    width: 35px;
    height: 35px;
    display: inline-block;
    font-weight: 400;
    text-align: center;
    border-radius: 100%;
}

.chkWhite [type="checkbox"] + label:before,
.chkWhite [type="checkbox"]:not(.filled-in) + label:after {
    content: '';
    position: absolute;
    top: 0;
    left: 4px;
    width: 14px;
    height: 14px;
    z-index: 0;
    border: 2px solid #ddd;
    border-radius: 1px;
    -webkit-transition: .2s;
    -o-transition: .2s;
    transition: .2s;
}

.chkWhite [type="checkbox"]:checked + label:before {
    top: -3px;
    left: -2px;
    width: 9px;
    height: 17px;
    border-top: 2px solid transparent;
    border-left: 2px solid transparent;
    border-right: 2px solid #ddd;
    border-bottom: 2px solid #ddd;
    -webkit-transform: rotate(40deg);
    -ms-transform: rotate(40deg);
    transform: rotate(40deg);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform-origin: 100% 100%;
    -ms-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
}

.divTogether {
    display: inline-flex;
}