/* Error de minimización. Devolviendo el contenido no minimizado.
: run-time error CSS1036: Expected expression, found ''
: run-time error CSS1036: Expected expression, found ''
(3438,32): run-time error CSS1062: Expected semicolon or closing curly-brace, found ')'
(6261,63): run-time error CSS1062: Expected semicolon or closing curly-brace, found ')'
(6622,36): run-time error CSS1019: Unexpected token, found ' '
(6622,36): run-time error CSS1019: Unexpected token, found ' '
(6622,36): run-time error CSS1042: Expected function, found ' '
(6622,36): run-time error CSS1062: Expected semicolon or closing curly-brace, found ' '
(6623,39): run-time error CSS1019: Unexpected token, found ' '
(6623,39): run-time error CSS1019: Unexpected token, found ' '
(6623,39): run-time error CSS1042: Expected function, found ' '
(6623,39): run-time error CSS1062: Expected semicolon or closing curly-brace, found ' '
(7485,32): run-time error CSS1019: Unexpected token, found ' '
(7485,32): run-time error CSS1019: Unexpected token, found ' '
(7485,32): run-time error CSS1042: Expected function, found ' '
(7485,32): run-time error CSS1062: Expected semicolon or closing curly-brace, found ' '
(7486,35): run-time error CSS1019: Unexpected token, found ' '
(7486,35): run-time error CSS1019: Unexpected token, found ' '
(7486,35): run-time error CSS1042: Expected function, found ' '
(7486,35): run-time error CSS1062: Expected semicolon or closing curly-brace, found ' '
(7487,30): run-time error CSS1019: Unexpected token, found ' '
(7487,30): run-time error CSS1019: Unexpected token, found ' '
(7487,30): run-time error CSS1042: Expected function, found ' '
(7487,30): run-time error CSS1062: Expected semicolon or closing curly-brace, found ' '
(7565,33): run-time error CSS1019: Unexpected token, found ' '
(7565,33): run-time error CSS1019: Unexpected token, found ' '
(7565,33): run-time error CSS1042: Expected function, found ' '
(7565,33): run-time error CSS1062: Expected semicolon or closing curly-brace, found ' '
(7566,36): run-time error CSS1019: Unexpected token, found ' '
(7566,36): run-time error CSS1019: Unexpected token, found ' '
(7566,36): run-time error CSS1042: Expected function, found ' '
(7566,36): run-time error CSS1062: Expected semicolon or closing curly-brace, found ' '
(7585,37): run-time error CSS1019: Unexpected token, found ' '
(7585,37): run-time error CSS1019: Unexpected token, found ' '
(7585,37): run-time error CSS1042: Expected function, found ' '
(7585,37): run-time error CSS1062: Expected semicolon or closing curly-brace, found ' '
(7586,40): run-time error CSS1019: Unexpected token, found ' '
(7586,40): run-time error CSS1019: Unexpected token, found ' '
(7586,40): run-time error CSS1042: Expected function, found ' '
(7586,40): run-time error CSS1062: Expected semicolon or closing curly-brace, found ' '
(7619,33): run-time error CSS1019: Unexpected token, found ' '
(7619,33): run-time error CSS1019: Unexpected token, found ' '
(7619,33): run-time error CSS1042: Expected function, found ' '
(7619,33): run-time error CSS1062: Expected semicolon or closing curly-brace, found ' '
(7620,36): run-time error CSS1019: Unexpected token, found ' '
(7620,36): run-time error CSS1019: Unexpected token, found ' '
(7620,36): run-time error CSS1042: Expected function, found ' '
(7620,36): run-time error CSS1062: Expected semicolon or closing curly-brace, found ' '
(7626,37): run-time error CSS1019: Unexpected token, found ' '
(7626,37): run-time error CSS1019: Unexpected token, found ' '
(7626,37): run-time error CSS1042: Expected function, found ' '
(7626,37): run-time error CSS1062: Expected semicolon or closing curly-brace, found ' '
(7627,40): run-time error CSS1019: Unexpected token, found ' '
(7627,40): run-time error CSS1019: Unexpected token, found ' '
(7627,40): run-time error CSS1042: Expected function, found ' '
(7627,40): run-time error CSS1062: Expected semicolon or closing curly-brace, found ' '
(7909,32): run-time error CSS1019: Unexpected token, found ' '
(7909,32): run-time error CSS1019: Unexpected token, found ' '
(7909,32): run-time error CSS1042: Expected function, found ' '
(7909,32): run-time error CSS1062: Expected semicolon or closing curly-brace, found ' '
(7910,35): run-time error CSS1019: Unexpected token, found ' '
(7910,35): run-time error CSS1019: Unexpected token, found ' '
(7910,35): run-time error CSS1042: Expected function, found ' '
(7910,35): run-time error CSS1062: Expected semicolon or closing curly-brace, found ' '
(7911,30): run-time error CSS1019: Unexpected token, found ' '
(7911,30): run-time error CSS1019: Unexpected token, found ' '
(7911,30): run-time error CSS1042: Expected function, found ' '
(7911,30): run-time error CSS1062: Expected semicolon or closing curly-brace, found ' '
(8259,32): run-time error CSS1019: Unexpected token, found ' '
(8259,32): run-time error CSS1019: Unexpected token, found ' '
(8259,32): run-time error CSS1042: Expected function, found ' '
(8259,32): run-time error CSS1062: Expected semicolon or closing curly-brace, found ' '
(8260,35): run-time error CSS1019: Unexpected token, found ' '
(8260,35): run-time error CSS1019: Unexpected token, found ' '
(8260,35): run-time error CSS1042: Expected function, found ' '
(8260,35): run-time error CSS1062: Expected semicolon or closing curly-brace, found ' '
(8261,30): run-time error CSS1019: Unexpected token, found ' '
(8261,30): run-time error CSS1019: Unexpected token, found ' '
(8261,30): run-time error CSS1042: Expected function, found ' '
(8261,30): run-time error CSS1062: Expected semicolon or closing curly-brace, found ' '
(10012,42): run-time error CSS1062: Expected semicolon or closing curly-brace, found ':'
(10156,37): run-time error CSS1019: Unexpected token, found ' '
(10156,37): run-time error CSS1019: Unexpected token, found ' '
(10156,37): run-time error CSS1042: Expected function, found ' '
(10156,37): run-time error CSS1062: Expected semicolon or closing curly-brace, found ' '
(10157,40): run-time error CSS1019: Unexpected token, found ' '
(10157,40): run-time error CSS1019: Unexpected token, found ' '
(10157,40): run-time error CSS1042: Expected function, found ' '
(10157,40): run-time error CSS1062: Expected semicolon or closing curly-brace, found ' '
(10158,35): run-time error CSS1019: Unexpected token, found ' '
(10158,35): run-time error CSS1019: Unexpected token, found ' '
(10158,35): run-time error CSS1042: Expected function, found ' '
(10158,35): run-time error CSS1062: Expected semicolon or closing curly-brace, found ' '
(10456,55): run-time error CSS1062: Expected semicolon or closing curly-brace, found ')'
(10689,36): run-time error CSS1019: Unexpected token, found ' '
(10689,36): run-time error CSS1019: Unexpected token, found ' '
(10689,36): run-time error CSS1042: Expected function, found ' '
(10689,36): run-time error CSS1062: Expected semicolon or closing curly-brace, found ' '
(10690,39): run-time error CSS1019: Unexpected token, found ' '
(10690,39): run-time error CSS1019: Unexpected token, found ' '
(10690,39): run-time error CSS1042: Expected function, found ' '
(10690,39): run-time error CSS1062: Expected semicolon or closing curly-brace, found ' '
(11288,36): run-time error CSS1019: Unexpected token, found ' '
(11288,36): run-time error CSS1019: Unexpected token, found ' '
(11288,36): run-time error CSS1042: Expected function, found ' '
(11288,36): run-time error CSS1062: Expected semicolon or closing curly-brace, found ' '
(11289,39): run-time error CSS1019: Unexpected token, found ' '
(11289,39): run-time error CSS1019: Unexpected token, found ' '
(11289,39): run-time error CSS1042: Expected function, found ' '
(11289,39): run-time error CSS1062: Expected semicolon or closing curly-brace, found ' '
(12028,26): run-time error CSS1019: Unexpected token, found ' '
(12028,26): run-time error CSS1019: Unexpected token, found ' '
(12028,26): run-time error CSS1042: Expected function, found ' '
(12028,26): run-time error CSS1062: Expected semicolon or closing curly-brace, found ' '
(12029,29): run-time error CSS1019: Unexpected token, found ' '
(12029,29): run-time error CSS1019: Unexpected token, found ' '
(12029,29): run-time error CSS1042: Expected function, found ' '
(12029,29): run-time error CSS1062: Expected semicolon or closing curly-brace, found ' '
(13590,29): run-time error CSS1019: Unexpected token, found ' '
(13590,29): run-time error CSS1019: Unexpected token, found ' '
(13590,29): run-time error CSS1042: Expected function, found ' '
(13590,29): run-time error CSS1062: Expected semicolon or closing curly-brace, found ' '
(13591,32): run-time error CSS1019: Unexpected token, found ' '
(13591,32): run-time error CSS1019: Unexpected token, found ' '
(13591,32): run-time error CSS1042: Expected function, found ' '
(13591,32): run-time error CSS1062: Expected semicolon or closing curly-brace, found ' '
(13664,40): run-time error CSS1019: Unexpected token, found ' '
(13664,40): run-time error CSS1019: Unexpected token, found ' '
(13664,40): run-time error CSS1042: Expected function, found ' '
(13664,40): run-time error CSS1062: Expected semicolon or closing curly-brace, found ' '
(13665,43): run-time error CSS1019: Unexpected token, found ' '
(13665,43): run-time error CSS1019: Unexpected token, found ' '
(13665,43): run-time error CSS1042: Expected function, found ' '
(13665,43): run-time error CSS1062: Expected semicolon or closing curly-brace, found ' '
 */
font-face {
    font-family: Lato-Light;
    src: url(../fonts/Lato-Light.ttf);
}

@font-face {
    font-family: Lato-Regular;
    src: url(../fonts/Lato-Regular.woff);
}

@font-face {
    font-family: Lato-Medium;
    src: url(../fonts/Lato-Medium.woff);
}

body, html {
    background-color: #FFF;
    margin: 0px;
    color: #666;
    font-family: "Lato-Regular", sans-serif, Arial;
    font-size: 13px;
    width: 100%;
}

@-ms-viewport {
    width: device-width;
}

.oculto {
    display: none !important;
}

.ui-widget-content {
    background: none;
    border: none;
    color: inherit;
}

.ui-widget {
    font-size: inherit;
    font-family: inherit;
}

.cabeceraSuperior {
    width: 100%;
    min-height: 50px;
    float: left;
    padding: 5px;
    box-sizing: border-box;
    margin-bottom: 10px;
    background-color: #404F59;
    -webkit-box-shadow: 0px 2px 2px 0px rgba(50, 50, 50, 0.3);
    -moz-box-shadow: 0px 2px 2px 0px rgba(50, 50, 50, 0.3);
    box-shadow: 0px 2px 2px 0px rgba(50, 50, 50, 0.3);
    z-index: 10;
    position: relative;
}

.infoUser {
    width: auto;
    height: 40px;
    float: right;
    margin-left: 20px;
    cursor: pointer;
}

    .infoUser > div {
        float: right;
        height: 100%;
        color: #FFF;
        line-height: 40px;
    }

    .infoUser + .opcionesUsuario {
        width: 150px;
        min-height: 35px;
        background-color: #4A5963;
        position: absolute;
        top: 50px;
        right: 0px;
        border-radius: 0px 0px 5px 5px;
        box-sizing: border-box;
        -webkit-box-shadow: 0px 2px 5px -1px rgba(50, 50, 50, 0.7);
        -moz-box-shadow: 0px 2px 5px -1px rgba(50, 50, 50, 0.7);
        box-shadow: 0px 2px 5px -1px rgba(50, 50, 50, 0.7);
        display: none;
        border-width: 0px 1px 1px 1px;
        border-style: solid;
        border-color: #5E6B73;
        padding-top: 5px;
        padding-bottom: 5px;
    }

        .infoUser + .opcionesUsuario a {
            width: 100%;
            position: relative;
            display: block;
            color: #FFFFFF;
            text-decoration: none;
            text-align: center;
            padding: 5px;
            box-sizing: border-box;
            margin-top: 1px;
            margin-top: 1px;
            background-color: #505F69;
        }

            .infoUser + .opcionesUsuario a:hover {
                background-color: rgb(64, 79, 89);
            }


    .infoUser > .perfil {
        width: 30px;
        height: 30px;
        border-radius: 20px;
        margin-top: 5px;
        margin-right: 10px;
        float: right;
        background-position: center;
        background-size: cover;
    }

.logo {
    display: inline-block;
    height: 25px;
    float: left;
    margin-top: 7.5px;
    margin-left: 7.5px;
    border: none;
    outline: none;
}

    .logo > img {
        height: 100%;
        width: auto;
        border: none;
        outline: none;
    }


.notificacion {
    float: right;
    margin-left: 20px;
    font-size: 20px;
    margin-top: 10px;
    position: relative;
    cursor: pointer;
    display: none;
}

    .notificacion i {
        color: #FFF !Important;
    }

    .notificacion div > .badge {
        position: absolute;
        top: -7px;
        right: -7px;
    }

.panelNotificacion {
    position: absolute;
    width: 250px;
    height: 150px;
    background-color: #FFF;
    border: 1px solid #60737D;
    z-index: 1;
    left: -115px;
    top: 40px;
    cursor: default;
    -webkit-box-shadow: 0px 0px 10px 0px rgba(50, 50, 50, 0.3);
    -moz-box-shadow: 0px 0px 10px 0px rgba(50, 50, 50, 0.3);
    box-shadow: 0px 0px 10px 0px rgba(50, 50, 50, 0.3);
    display: none;
    -webkit-box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.21), 0 16px 28px 0 rgba(0, 0, 0, 0.22);
    -moz-box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.21), 0 16px 28px 0 rgba(0, 0, 0, 0.22);
    box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.21), 0 16px 28px 0 rgba(0, 0, 0, 0.22);
}

    .panelNotificacion:before {
        content: '';
        display: block;
        position: absolute;
        left: -10px;
        width: 0;
        height: 0;
        color: transparent;
        border: 10px solid black;
        border-color: transparent transparent #404F59;
        margin-top: -20px;
        margin-left: 50%;
    }

    .panelNotificacion > div:first-child {
        height: 25px;
        width: 100%;
        background-color: #404F59;
        text-align: right;
        padding-right: 10px;
        box-sizing: border-box;
        line-height: 25px;
        color: #EEE;
        font-size: 20px;
    }

        .panelNotificacion > div:first-child > i {
            cursor: pointer;
        }

.badge {
    border-radius: 50%;
    min-width: 10px;
    min-height: 10px;
    background-color: #F00;
    font-size: 11px;
    text-align: center;
    line-height: 10px;
    padding: 3px;
    color: #FFF;
    float: left;
}

.badge-rect {
    border-radius: 20%;
    min-width: 25px;
    display: block;
    position: absolute;
}

.CHK {
    top: 0px;
    right: 0px;
}

.INF {
    right: 0px;
    top: 23px;
    background-color: #3F51B5;
}

.controlPequeño, .controlMedio1, .controlMedio2, .controlGrande {
    min-height: 40px;
    height: 40px;
    min-width: 120px;
    border-radius: 3px;
    border-color: #DDD;
    color: #777;
    font-size: 15px;
    margin-right: 2px;
    border-width: 1px;
    border-style: solid;
    box-sizing: border-box;
}

.panelPequeño, .panelMedio, .panelMedio2, .panelGrande {
    float: left;
}

.contenedor {
    display: table;
    table-layout: fixed;
    /*min-height:500px;
    min-height:90vh;
    */
    width: 100%;
    float: left;
    position: absolute;
    top: 0px;
    padding-top: 60px;
    height: 100%;
    box-sizing: border-box;
}

.contenedorIzq, .contenedorDer {
    display: inline-block;
    vertical-align: top;
    top: 0px;
}

.contenedorIzq {
    width: 185px;
    padding-left: 5px;
    padding-right: 5px;
    padding-top: 30px;
    overflow: auto;
    max-height: 100%;
    box-sizing: border-box;
    padding-bottom: 40px;
    background-color: #FFF;
}

.contenedorDer {
    position: absolute;
    height: 100%;
    padding-top: 115px;
    box-sizing: border-box;
}

.bloqueoPasos {
    width: 100%;
    min-height: 100%;
    z-index: 3;
    position: absolute;
    display: none;
    box-sizing: border-box;
    border-left: 190px solid transparent;
    border-top: 60px solid transparent;
    left: 0px;
    top: 0px;
}

    .bloqueoPasos > div {
        BACKGROUND-COLOR: rgba(0, 0, 0, 0.7);
        width: 100%;
        min-height: 100%;
        position: absolute;
    }

.cerrarBloqueoPasos {
    background-color: #F44336;
    width: 30px;
    height: 30px;
    line-height: 20px;
    cursor: pointer;
    display: inline-block;
    position: absolute;
    right: 0px;
    top: 0px;
    box-sizing: border-box;
    margin-top: -30px;
    border-radius: 5px 5px 0px 0px;
    font-size: 20px;
    padding: 5px;
    color: #FFF;
}

.botoneraContinuar {
    margin: 0 auto;
    width: 250px;
    min-height: 110px;
    background-color: #FFF;
    top: 50%;
    position: absolute;
    margin-top: -50px;
    left: 0px;
    right: 0px;
    color: inherit;
    text-align: center;
    padding: 10px;
    box-sizing: border-box;
}

    .botoneraContinuar.sinPresupuesto, .botoneraContinuar.bloqueoEtapa {
        background-color: #EF5350 !important;
        color: #FFF !important;
        text-transform: uppercase;
    }

.actividad {
    width: 180px;
    height: 50px;
    padding: 5px;
    text-align: left;
    display: table;
    float: left;
    background-color: #FFF;
    border: 1px solid #DDD;
    box-sizing: border-box;
    font-size: 10px;
    cursor: pointer;
    text-decoration: none;
    color: inherit;
    position: relative;
    overflow: hidden;
}

    .actividad > span {
        display: table-cell;
        vertical-align: middle;
    }

.actividadActual {
    width: 3px;
    height: 100%;
    position: absolute;
    right: 0px;
    top: 0px;
}

.pasoActual {
    width: 100%;
    height: 3px;
    position: absolute;
    right: 0px;
    bottom: 0px;
    background-color: #AAA;
}

.terminado {
    background-color: #30A3E6 !Important;
    color: #FFF;
    text-shadow: 0px 0px 3px rgba(0, 0, 0,0.5);
}

    .terminado .actividadActual {
        background-color: #00649E;
    }

.pasoTerminado .pasoActual {
    background-color: #00649E;
}

.ejecucion {
    background-color: #04AD84 !Important;
    color: #FFF;
    text-shadow: 0px 0px 3px rgba(0, 0, 0,0.5);
}

    .ejecucion .actividadActual {
        background-color: #006B51;
    }

.pasoEjecucion .pasoActual {
    background-color: #006B51;
}

.pausado {
    background-color: #D89E00 !Important;
    color: #FFF;
}

    .pausado .actividadActual {
        background-color: #9E7607;
    }

.actividadNormal .actividadActual {
    background-color: #AAA;
}

.panelContador {
    width: 100%;
    min-height: 50px;
    float: left;
    padding: 5px;
    box-sizing: border-box;
    background-color: #FFF;
    border: 1px solid #DDD;
}

.contador {
    background-color: #EAEAEA;
    color: #777;
    height: 40px;
    width: 40px;
    padding: 1px 5px 1px 5px;
    font-weight: bold;
    line-height: 40px;
    font-size: 20px;
    margin-right: 10px;
    box-sizing: border-box;
    border-radius: 2.5px;
    text-shadow: none;
    position: relative;
    display: inline-block;
    border: 1px solid #DDD;
}

#tituloActividad {
    display: table;
    min-height: 40px;
    width: 100%;
}

    #tituloActividad > span {
        display: table-cell;
        vertical-align: middle;
    }

.panelPasoPaso {
    float: left;
    width: 100%;
    height: 50px;
    overflow: hidden;
    position: absolute;
    top: 60px;
    left: 0px;
    border-left: 190px solid #FFF;
    box-sizing: border-box;
}

    nav::-webkit-scrollbar, .contenedorIzq::-webkit-scrollbar, .panelPasoPaso::-webkit-scrollbar {
        display: none;
    }

    .contenedorIzq::-webkit-scrollbar-track, .panelPasoPaso::-webkit-scrollbar-track {
        -webkit-box-shadow: -1px 0px 2px 0px rgba(50, 50, 50, 0.4);
        -moz-box-shadow: -1px 0px 2px 0px rgba(50, 50, 50, 0.4);
        box-shadow: -1px 0px 2px 0px rgba(50, 50, 50, 0.4);
    }

    .contenedorIzq::-webkit-scrollbar-thumb, .panelPasoPaso::-webkit-scrollbar-thumb {
        background-color: #9E9E9E;
        border: 1px solid #777;
        border-radius: 3px;
    }

    .panelPasoPaso > .panelPaso {
        min-width: 100%;
        display: -webkit-flex;
        display: inline-flex;
        border-left: 40px solid transparent;
        background-color: #EEE;
        box-sizing: border-box;
    }

.panelPaso .paso:last-child {
    margin-right: 40px;
}

.panelPasoPaso .navegador:last-child {
    display: block;
    right: 0px;
}

.panelPasoPaso .navegador:first-child {
    display: block;
    left: 0px;
}

.paso {
    width: 180px;
    height: 50px;
    float: left;
    border: 1px solid #DDD;
    background-color: #FFF;
    color: #777;
    font-size: 10px;
    display: table;
    padding: 5px;
    box-sizing: border-box;
    cursor: pointer;
    text-decoration: none;
    text-transform: uppercase;
    position: relative;
    overflow: hidden;
}

    .paso:hover {
        background-color: #F0F3F5;
    }

    .paso > span:first-child, .paso > div {
        display: table-cell;
        vertical-align: middle;
        font-size: 9px;
        position: relative;
    }

    .paso > div {
        min-width: 30px;
        padding-left: 5px;
        height: 100%;
    }

.pasoTerminado {
    background-color: #30A3E6;
    color: #FFF;
}

.pasoEjecucion {
    background-color: #04AD84;
    color: #FFF;
}

.pasoTerminado:hover {
    background-color: #0086D4;
    border-bottom: 1px solid #DDD;
}

.pasoEjecucion:hover {
    background-color: #008C6A;
    border-bottom: 1px solid #DDD;
}

.panelContenidoPaso {
    width: 100%;
    float: left;
    margin: 0px;
    /*min-height:400px;
    min-height: 75vh;*/
    height: 100%;
    position: relative;
}

.tabsPaso {
    display: block;
    height: 99%;
    width: 100%;
    max-width: 100%;
    background: #FFF !important;
    color: #777 !important;
    border: none !important;
    font-family: "Lato-Regular", sans-serif, Arial !important;
    padding: 0px !Important;
    border-radius: 0px !important;
    float: left;
}

    .tabsPaso > div {
        width: 100%;
        box-sizing: border-box;
        float: left;
        position: relative;
        min-height: 100%;
        border: 1px solid #DDD !Important;
        max-height: 400px !IMPORTANT;
        padding: 5px !Important;
        color: #777;
        height: 100%;
    }

.ui-tabs.tabsPaso > .ui-tabs-panel {
    display: table;
}

.linkPaso.ui-tabs-nav {
    display: table-cell;
    background: none;
    border: none;
    padding: 0px !Important;
    position: relative;
    width: 40px;
    float: right;
    border-radius: 0px;
    z-index: 1;
}

    .linkPaso.ui-tabs-nav > li {
        border-radius: 0px 5px 5px 0px;
        border-bottom-width: 1px !important;
        width: 40px;
        height: 40px;
        box-sizing: border-box;
        background: #E3E3E3;
        border-color: #BBB;
    }

        .linkPaso.ui-tabs-nav > li > a {
            font-size: 23px;
            padding: 6px 5px 6px 7px !important;
            color: #777;
            width: 100%;
            box-sizing: border-box;
            text-align: center;
        }

        .linkPaso.ui-tabs-nav > li.ui-tabs-active {
            border-color: #CCC;
            margin-bottom: 0px !important;
            background: #FFF;
            z-index: 1;
        }

            .linkPaso.ui-tabs-nav > li.ui-tabs-active > a {
                color: #04AD84;
            }

.navegador {
    height: 50px;
    width: 40px;
    float: left;
    background-color: rgba(96, 112, 125, 0.85);
    position: absolute;
    display: none;
    padding: 5px;
    text-align: center;
    box-sizing: border-box;
    color: rgba(235, 238, 247, 0.7);
    cursor: pointer;
    z-index: 5;
}

.PaddingNavegador {
    width: 40px;
    height: 50px;
    display: table;
}

.overflowContenedorIzq {
    width: 185px;
    overflow: auto;
    height: 100%;
    box-sizing: border-box;
    background-color: #FFF;
    position: relative;
    z-index: 4;
}

.navegadorVertical {
    width: 180px;
    height: 30px;
    background-color: #0094ff;
    position: absolute;
    z-index: 2;
    cursor: pointer;
    margin-left: 5px;
    background-color: rgba(96, 112, 125, 0.85);
    text-align: center;
    color: rgba(235, 238, 247, 0.7);
    font-size: 25px;
    box-sizing: border-box;
    display: block;
}

.contenedor > .navegadorVertical:first-child, .overflowContenedorIzq + .navegadorVertical {
    z-index: 5;
}

.contenedorIzq .navegador:last-child {
    right: 0px;
    top: 0px;
}

.contenedorIzq .navegador:first-child {
    left: 0px;
    top: 0px;
}

.navegador > i {
    margin-top: 10px;
}

.btnMenuMovil > div {
    width: 30px;
    height: 30px;
    color: #FFF;
    float: left;
    padding: 4px 3px 3px 7px;
    box-sizing: border-box;
    font-size: 30px;
    margin-right: 5px;
}

.btnMenuMovilMaster {
    float: left;
    padding: 5px;
}

    .btnMenuMovilMaster > div {
        width: 30px;
        height: 30px;
        color: #FFF;
        float: right;
        box-sizing: border-box;
        font-size: 30px;
        cursor: pointer;
        text-align: center;
    }

        .btnMenuMovilMaster > div:hover {
            color: #009688;
        }

.rotated {
    -webkit-transform: rotate(90deg) translate3d(0, 0, 0);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    -o-transition: 1s;
    -ms-transition: 1s;
    -moz-transition: 1s;
    -webkit-transition: 1s;
    transition: 1s;
}

.rotated2 {
    -webkit-transform: rotate(0deg) translate3d(0, 0, 0);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
    -o-transition: 1s;
    -ms-transition: 1s;
    -moz-transition: 1s;
    -webkit-transition: 1s;
    transition: 1s;
}

/*************Menu izquierdo****************/
nav {
    position: fixed;
    left: 0px;
    top: 0px;
    padding-top: 50px;
    background-color: #009688;
    width: 260px;
    height: 100% !Important;
    box-sizing: border-box;
    text-decoration: none;
    display: none;
    overflow: auto;
    z-index: 9;
    -webkit-box-shadow: 3px 0px 10px 0px rgba(0, 0, 0, 0.4);
    -moz-box-shadow: 3px 0px 10px 0px rgba(0, 0, 0, 0.4);
    box-shadow: 3px 0px 10px 0px rgba(0, 0, 0, 0.4);
}

    nav > ul > li {
        padding-top: 10px;
        font-size: 16px;
    }

        nav > ul > li > a {
            padding-bottom: 10px;
        }

            nav > ul > li > a > span:first-child {
                position: relative;
            }

                nav > ul > li > a > span:first-child > i {
                    position: absolute;
                    font-size: 10px;
                    width: 13px;
                    height: 13px;
                    border-radius: 50%;
                    background-color: #009688;
                    right: -7px;
                    top: 2px;
                    text-align: center;
                    line-height: 13px;
                }

        nav > ul > li:hover > a > span:first-child > i {
            background-color: #006B61;
        }

        nav > ul > li:hover {
            background-color: #006B61;
            border-right: 3px solid #00403A;
            box-sizing: border-box;
        }

        nav > ul > li > ul > li:hover {
            background-color: #005D54;
        }

        nav > ul > li > ul > li {
            padding-top: 10px;
            padding-bottom: 10px;
            font-size: 15px;
        }

    nav li span {
        margin-right: 10px;
    }

    nav > ul, nav > ul > li, nav > ul > li > nav {
        width: 100%;
    }

        nav > ul, nav > ul > li > ul {
            padding: 0px;
        }

    nav li > a {
        padding-left: 15px;
        box-sizing: border-box;
        width: 100%;
        display: block;
        position: relative;
    }

    nav li.liSubMenu > a:after {
        display: inline-block;
        position: absolute;
        content: "";
        right: 5px;
        top: 5px;
        border-top: 8px solid #befff9;
        border-left: 4px solid transparent;
        border-right: 4px solid transparent;
    }

    nav li.liSubMenu.open > a:after {
        border-top: none;
        border-bottom: 8px solid #befff9;
    }

    nav > ul > li > ul > li > a {
        padding-left: 50px;
    }

    nav > ul > li > ul {
        background-color: #057B70;
    }

    nav * {
        color: #BEFFF9;
        text-decoration: none;
        list-style-type: none;
    }

    nav > ul > li > ul {
        display: none;
    }
/*********************************/

/*Modificación estilos para el modal*/
.ui-dialog {
    padding: 0px !Important;
    font-family: "Lato-Regular", sans-serif, Arial !Important;
    font-size: 12px !important;
    -webkit-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.7);
    -moz-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.7);
    box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.7);
}

.blur {
    -webkit-filter: blur(3px);
    -moz-filter: blur(3px);
    -o-filter: blur(3px);
    -ms-filter: blur(3px);
    filter: blur(3px);
}

.ui-dialog.ui-corner-all {
    border-radius: 0px;
}

.ui-dialog.ui-widget-content {
    border: 0px;
}

.ui-dialog > .ui-dialog-titlebar {
    background: #D0263D;
    border: none;
    border-radius: 0px;
    font-size: 14px !important;
    height: 25px;
    line-height: 25px;
    font-weight: normal;
}

.ui-dialog-titlebar-close {
    display: none !important;
}

body .ui-widget-overlay {
    background: #000;
    opacity: .8;
    filter: Alpha(Opacity=80);
    support: IE8;
}

.ui-dialog .ui-dialog-content {
    padding: 0px !Important;
    background-color: #FFF !Important;
    clear:both;
}

#contenidoModal {
    width: 100%;
    min-height: 100px;
    padding: 10px;
    box-sizing: border-box;
}

.dialog-footer {
    border-top: 1px solid #DDD;
    height: 40px;
    width: 100%;
}

.cerrarModal {
    width: 100px;
    height: 25px;
    margin: 0 auto;
    background: #E2E2E2;
    margin-top: 8px;
    text-align: center;
    line-height: 25px;
    color: #555;
    font-size: 13px;
    cursor: pointer;
    border: 1px solid #AAA;
}

    .cerrarModal:hover {
        background: #D0263D;
        color: #FFF;
    }

.cerrarModal, .actividad, .paso, .panelContador, .navegador, .cabeceraSuperior {
    box-sizing: border-box;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.ui-effects-wrapper + .ui-widget-overlay {
    background: #000;
    opacity: .8;
    filter: Alpha(Opacity=80);
    support: IE8;
}

/*******Galeria JSSOR*********/
.descripcion {
    width: 90%;
    margin-left: 5%;
    min-height: 50px;
    padding: 10px;
    box-sizing: border-box;
    position: absolute;
    z-index: 1;
    color: #FFF;
    text-align: center;
    background: rgba(0, 0, 0, 0.6);
    border-radius: 5px;
}

.jssora05l, .jssora05r {
    display: block;
    position: absolute;
    cursor: pointer;
    overflow: hidden;
    background-color: rgba(0, 0, 0, 0.7);
    border-radius: 3px;
    padding: 5px;
    text-align: center;
    box-sizing: border-box;
    color: rgba(255, 255, 255, 0.7);
    font-size: 30px;
    line-height: 30px;
}

.Slider {
    position: relative;
    top: 0px;
    left: 0px;
    width: 800px;
    height: 370px;
    margin: 0 auto;
    background-color: transparent;
}

    .Slider > .SliderContenedor {
        cursor: move;
        position: relative;
        overflow: hidden;
        left: 0px;
        top: 0px;
        width: 800px;
        height: 370px;
    }

.btnFullScreen {
    position: absolute;
    top: auto;
    width: 40px;
    height: 40px;
    background-color: rgba(0, 0, 0, 0.7);
    z-index: 1;
    left: auto;
    right: 10px;
    color: rgba(255, 255, 255, 0.8);
    border-radius: 3px;
    padding: 5px 7px;
    box-sizing: border-box;
    font-size: 30px;
    line-height: 30px;
}

.btnFullScreen {
    width: 40px;
    height: auto;
    z-index: 1;
    position: absolute;
    background-color: rgba(255,255,255,0.7);
    border-radius: 5px;
    padding: 5px;
    display: none;
    cursor: pointer;
    left: 0px;
    right: 0px;
    margin: 0 auto;
}

.FullScreen {
    background-color: #000;
}

    .FullScreen .descripcion {
        bottom: 0px !Important;
        position: absolute;
    }

    .FullScreen .btnFullScreen {
        margin-top: -30px;
    }


/******************************/
/*******Galeria Video********/
.descripcionVideo {
    padding: 10px;
    box-sizing: border-box;
    width: 100%;
    min-height: 70px;
    position: relative;
    float: left;
}

.reproductorVideo {
    width: 96%;
    margin-left: 2%;
    padding: 10px;
    box-sizing: border-box;
    display: table;
    float: left;
    position: relative;
}

    .reproductorVideo > .video {
        width: 100%;
        height: auto;
        float: left;
        box-sizing: border-box;
        margin-bottom: 10px;
    }

    .reproductorVideo > div {
        height: 100%;
        box-sizing: border-box;
    }

.galeriaVideo {
    list-style: none;
    width: 100%;
    padding-left: 0px;
    box-sizing: border-box;
    margin-top: 0px;
    max-height: 100%;
    overflow: auto;
    text-align: center;
    padding-bottom: 10px;
    margin-bottom: 0px;
}

    .galeriaVideo li {
        float: left;
        margin-bottom: 10px;
        cursor: pointer;
        width: 100%;
        min-width: 150px;
        height: auto;
        padding: 5px;
        box-sizing: border-box;
        color: #949B9E;
        background-color: #283238;
        font-size: 10px;
        text-align: left;
        -webkit-box-shadow: 0px 3px 7px 0px rgba(50, 50, 50, 1);
        -moz-box-shadow: 0px 3px 7px 0px rgba(50, 50, 50, 1);
        box-shadow: 0px 3px 7px 0px rgba(50, 50, 50, 1);
        border: 1px solid #212A2F;
    }

        .galeriaVideo li:hover {
            background-color: #566C79;
            color: #070D10;
            border: 1px solid #30373C;
        }

        .galeriaVideo li > div {
            position: relative;
            display: table;
        }

            .galeriaVideo li > div > span {
                position: absolute;
                top: 7.5px;
                left: 22.5px;
                width: 25px;
                height: 25px;
                line-height: 25px;
                font-size: 25px;
                color: #03A9F4;
                background: #FFF;
                border-radius: 50%;
                display: none;
            }

    .galeriaVideo .videoActive > div > span {
        display: block;
        text-align: center;
    }

    .galeriaVideo li.videoActive {
        background-color: #04AD84;
        border: 1px solid #073A37;
        color: #FFF;
    }

    .galeriaVideo li > div > img {
        width: 70px;
        border: 1px solid rgba(0,0,0,0.7);
        box-sizing: border-box;
        display: table-cell;
        -webkit-box-shadow: 0px 2px 3px 0px rgba(50, 50, 50, 0.4);
        -moz-box-shadow: 0px 2px 3px 0px rgba(50, 50, 50, 0.4);
        box-shadow: 0px 2px 3px 0px rgba(50, 50, 50, 0.4);
    }

    .galeriaVideo li > div > div {
        padding-left: 10px;
        display: table-cell;
        vertical-align: middle;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .galeriaVideo::-webkit-scrollbar {
        width: 7px;
    }

    .galeriaVideo::-webkit-scrollbar-track {
        -webkit-box-shadow: -1px 0px 2px 0px rgba(50, 50, 50, 0.4);
        -moz-box-shadow: -1px 0px 2px 0px rgba(50, 50, 50, 0.4);
        box-shadow: -1px 0px 2px 0px rgba(50, 50, 50, 0.4);
    }

    .galeriaVideo::-webkit-scrollbar-thumb {
        background-color: #9E9E9E;
        border: 1px solid #777;
        border-radius: 3px;
    }


/*************************************/
.overlay {
    position: fixed;
    display: table;
    z-index: 98;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    height: 100%;
    width: 100%;
    border-top: 60px solid transparent;
    border-left: 190px solid transparent;
    box-sizing: border-box;
}

.overlayContent {
    z-index: 99;
    width: 90px;
    height: 40px;
    display: table-cell;
    vertical-align: middle;
    text-align: center;
}

    .overlayContent > img {
        background: rgba(255, 255, 255, 0.8);
        padding: 30px 0px;
        -webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.3);
        -moz-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.3);
        box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.3);
        width: 100px;
        border-radius: 3px;
    }

.contentMaster {
    width: 100%;
    min-height: 100%;
    position: absolute;
    border-top: 60px solid transparent;
    box-sizing: border-box;
    top: 0px;
    overflow-y: auto;
    overflow-x: hidden;
    max-height: 100%;
    margin-top: -10px;
}

.accesos {
    width: 80%;
    margin: 0 auto;
}

    .accesos > a, .accesos > div {
        display: table;
        width: 150px;
        height: 160px;
        float: left;
        color: #FFF;
        text-align: center;
        font-size: 16px;
        padding: 15px;
        box-sizing: border-box;
        margin: 10px;
        -webkit-box-shadow: 0px 1px 2px 0px rgba(50, 50, 50, 0.4);
        -moz-box-shadow: 0px 1px 2px 0px rgba(50, 50, 50, 0.4);
        box-shadow: 0px 1px 2px 0px rgba(50, 50, 50, 0.4);
        text-decoration: none;
        filter: alpha(opacity=90);
        filter: progid: DXImageTransform.Microsoft.Alpha(opacity=90);
        -moz-opacity: 0.90;
        opacity: 0.9;
        cursor: pointer;
    }

        .accesos > a:not(.open), .accesos > div:not(.open) {
            -webkit-transition: all 0.2s ease-in-out;
            -moz-transition: all 0.2s ease-in-out;
            -o-transition: all 0.2s ease-in-out;
            -ms-transition: all 0.2s ease-in-out;
            transition: all 0.2s ease-in-out;
        }

        .accesos > a:hover:not(.open):not(:active),
        .accesos > div:hover:not(.open):not(:active) {
            -ms-transform: scale(1.07,1.07); /* IE 9 */
            -webkit-transform: scale(1.07,1.07); /* Chrome, Safari, Opera */
            transform: scale(1.07,1.07);
            -webkit-box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.21), 0 16px 28px 0 rgba(0, 0, 0, 0.22);
            -moz-box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.21), 0 16px 28px 0 rgba(0, 0, 0, 0.22);
            box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.21), 0 16px 28px 0 rgba(0, 0, 0, 0.22);
            -webkit-filter: brightness(1.3);
            filter: brightness(1.3);
            filter: alpha(opacity=100);
            filter: progid: DXImageTransform.Microsoft.Alpha(opacity=100);
            -moz-opacity: 1;
            opacity: 1;
            position: relative;
            overflow: hidden;
            z-index: 8;
        }

        .accesos > a:active:not(.open),
        .accesos > div:active:not(.open) {
            -webkit-transition: none;
            -moz-transition: none;
            -o-transition: none;
            -ms-transition: none;
            transition: none;
        }

        /*.accesos > a:hover::after {
            content: "";
            width: 0px;
            height: 0px;
            position: absolute;
            top: 0px;
            left: 0px;
            border-bottom: 150px solid transparent;
            border-left: 150px solid rgba(255, 255, 255, 0.5);
            -webkit-filter: blur(40px);
            -moz-filter: blur(40px);
            -o-filter: blur(40px);
            -ms-filter: blur(40px);
            filter: blur(40px);
        }*/

        .accesos > a > span:nth-child(1), .accesos > div > span:nth-child(1) {
            font-size: 70px;
            position: relative;
        }

        .accesos > a > span:nth-child(2), .accesos > div > span:nth-child(2) {
            display: table-row;
            vertical-align: middle;
            width: 100%;
        }

        .accesos > a > span:nth-child(1), .accesos > div > span:nth-child(1),
        .accesos > a > span:nth-child(2), .accesos > div > span:nth-child(2) {
            -webkit-transition: opacity 0.4s ease-in-out;
            -moz-transition: opacity 0.4s ease-in-out;
            -o-transition: opacity 0.4s ease-in-out;
            -ms-transition: opacity 0.4s ease-in-out;
            transition: opacity 0.4s ease-in-out;
        }


        .accesos > a.submenu.open, .accesos > div.submenu.open {
            opacity: 1;
            z-index: 12;
            cursor: default;
            border-radius: 4px;
            -webkit-box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.21), 0 16px 28px 0 rgba(0, 0, 0, 0.22);
            -moz-box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.21), 0 16px 28px 0 rgba(0, 0, 0, 0.22);
            box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.21), 0 16px 28px 0 rgba(0, 0, 0, 0.22);
        }

        .accesos > a.submenu > div, .accesos > div.submenu > div {
            display: block;
            width: 100%;
            height: 100%;
            display: none;
            overflow: auto;
            border-top: 45px solid transparent;
        }

            .accesos > a.submenu > div > h2, .accesos > div.submenu > div > h2 {
                margin: 10px 0px;
                color: #FFF;
                position: absolute;
                left: 0;
                top: 10px;
                right: 0;
            }

            .accesos > a.submenu > div > a,
            .accesos > div.submenu > div > a {
                width: 90px;
                height: 90px;
                display: inline-block;
                padding: 5px 3px;
                color: #777;
                text-decoration: none;
                font-size: 16px;
                box-sizing: border-box;
                text-align: left;
                border-radius: 3px;
                position: relative;
                margin: 2px 1px;
            }

                /*.accesos > a.submenu > div > a > i,
                .accesos > div.submenu > div > a > i {*/
                .accesos > a.submenu > div > a > span:nth-child(1),
                .accesos > div.submenu > div > a > span:nth-child(1) {
                    color: #FFF;
                    font-size: 30px;
                    text-align: center;
                    width: 100%;
                    height: 50px;
                    padding-top: 9px;
                    box-sizing: border-box;
                }

                /*.accesos > a.submenu > div > a > span,
                .accesos > div.submenu > div > a > span {*/
                .accesos > a.submenu > div > a > span:nth-child(2),
                .accesos > div.submenu > div > a > span:nth-child(2) {
                    position: absolute;
                    bottom: 0;
                    left: 0;
                    height: 35px;
                    font-size: 12px;
                    padding: 2px;
                    color: #FFF;
                    text-align: center;
                    width: 100%;
                }


/***Estilos de los dropdownlist de la cabecera****/
.dropCabecera {
    background-color: #4D5E6B !Important;
    border: none !Important;
    color: #FFF !Important;
    outline: none !important;
}

    .dropCabecera option {
        color: #FFF;
        background-color: #404F59;
        padding: 5px !Important;
    }

    .dropCabecera::-ms-expand {
        background-color: transparent;
        color: #FFF;
        border: none;
    }

.panel30 {
    width: 30%;
    background-color: #FFF;
    display: inline-block;
    background-color: #FFF;
    border: 1px solid #DDD;
    border-radius: 5px;
    padding: 5px;
    box-sizing: border-box;
    -webkit-box-shadow: 0px 1px 1px 0px rgba(50, 50, 50, 0.5);
    -moz-box-shadow: 0px 1px 1px 0px rgba(50, 50, 50, 0.5);
    box-shadow: 0px 1px 1px 0px rgba(50, 50, 50, 0.5);
}

    .panel30 > div:first-child {
        width: 100%;
        height: 35px;
        line-height: 35px;
        background-color: #404F59;
        color: #FFF;
        border: 1px solid #B8C1C5;
        box-sizing: border-box;
        font-weight: bold;
        position: relative;
    }

        .panel30 > div:first-child > i {
            float: right;
            font-size: 20px;
            margin-top: 7px;
            margin-right: 7px;
            cursor: pointer;
            display: none;
        }

    .panel30 > div:last-child {
        height: 400px;
        width: 100%;
        overflow: auto;
    }

.ElementoFiltro {
    width: 100%;
    height: 40px;
    display: table;
    text-align: left;
    background-color: #eee;
    text-decoration: none;
    color: inherit;
    border: 1px solid rgb(184, 193, 197);
    box-sizing: border-box;
    padding: 5px;
}

    .ElementoFiltro span {
        display: table-cell;
        vertical-align: middle;
    }

    .ElementoFiltro:hover {
        background-color: #404F59;
        color: #FFF;
    }

.ElementoSeleccionado {
    background-color: #009688;
    color: #FFF;
}

.btn {
   /* min-width: 120px;
    min-height: 30px;*/
    padding: 5px;
    text-align: center;
    display: inline-block;
    line-height: 20px;
    cursor: pointer;
    box-sizing: border-box;
    -webkit-box-shadow: 0px 1px 1px 0px rgba(50, 50, 50, 0.5);
    -moz-box-shadow: 0px 1px 1px 0px rgba(50, 50, 50, 0.5);
    box-shadow: 0px 1px 1px 0px rgba(50, 50, 50, 0.5);
    text-decoration: none;
}

.btnAzul {
    background-color: #4C95FF !important;
    color: #FFF !Important;
    border: 1px solid #247DFF;
}

    .btnAzul:hover {
        background-color: #70ABFF !important;
    }

.btnVerde {
    background-color: #009688 !important;
    color: #FFF !important;
    border: 1px solid #006359;
}

    .btnVerde:hover {
        background-color: #006B61 !important;
    }

.btnGris {
    background-color: #FFF !important;
    color: #777 !important;
    border: 1px solid #BBB;
}

    .btnGris:hover {
        background-color: #EEE !important;
        color: #777 !important;
        border: 1px solid #CCC;
    }

.btnRojo {
    background-color: #FF5353 !important;
    color: #FFF !important;
    border: 1px solid #FF4343;
}

    .btnRojo:hover {
        background-color: #FF6D6D !important;
    }

    .izquierdaCierreOs {
        position: absolute;
        right: 0;
    }

.btnAmarillo {
    background-color: #FFC107 !important;
    color: #FFF !important;
    border: 1px solid #F8F32B;
}

    .btnAmarillo:hover {
        background-color: #E0A800 !important;
    }

.btnNaranja {
    background-color: #FFA726 !important;
    border: 1px solid #FF9800;
    color: #FFF !important;
}

    .btnNaranja:hover {
        background-color: #FB8C00 !important;
    }

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

    .panelInsumos::-webkit-scrollbar {
        display: none;
    }

    .panelInsumos > div {
        width: 100%;
        position: absolute;
    }

.FichaHorizontal {
    min-height: 200px;
    width: 100%;
    background-color: #FFF;
    border-width: 1px 1px 0.5px 1px;
    border-color: #DDD;
    border-style: solid;
    display: table;
    box-sizing: border-box;
    -webkit-box-shadow: 0px 1.5px 1px rgba(50, 50, 50, 0.3);
    -moz-box-shadow: 0px 1.5px 1px rgba(50, 50, 50, 0.3);
    box-shadow: 0px 1.5px 1px rgba(50, 50, 50, 0.3);
    margin-bottom: 5px;
    position: relative;
}

    .FichaHorizontal div:first-child {
        display: table-cell;
        height: 200px;
        width: 200px;
        border-right: 1px solid #EEE;
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
    }

    .FichaHorizontal div:last-child {
        display: table-cell;
        padding: 5px;
        color: #777;
        vertical-align: middle;
        line-height: 20px;
    }

.esquinaInsumo {
    width: 0px;
    height: 0px;
    position: absolute;
    top: 0px;
    right: 0px;
    border-bottom: 60px solid transparent;
}

.texEsquinaInsumo {
    position: absolute;
    right: 0px;
    top: 0px;
    z-index: 1;
    color: #FFF;
    padding-right: 10px;
    padding-top: 10px;
    font-weight: bold;
    font-size: 15px;
}

.insumoHerramienta {
    border-right: 60px solid #404F59;
}

.insumoEquipo {
    border-right: 60px solid #2196F3;
}

.insumo {
    border-right: 60px solid #4CAF50;
}

.insumoHerramientaEspecial {
    border-right: 60px solid #FF5722;
}

.insumoEPP {
    border-right: 60px solid #B222FF;
}

.sinInsumo, #noVideo {
    width: 100%;
    height: 100%;
    overflow: auto;
    position: relative !Important;
    text-align: center;
}

    .sinInsumo > img, #noVideo > img {
        max-height: 100%;
        width: 90%;
        margin: 0 auto;
    }

    .sinInsumo > div, #noVideo > div {
        text-align: center;
        color: #AAA;
        font-size: 35px;
        position: absolute;
        margin-top: -10%;
        width: 100%;
    }

.timer {
    display: none !important;
    position: absolute;
    /*width: 200px;
    height: 80px;*/
    width: 120px;
    height: 50px;
    background-color: rgba(255,93,0,0.8);
    z-index: 5;
    color: #FFF;
    /*padding: 5px;*/
    padding: 10px;
    box-sizing: border-box;
    line-height: 30px;
    text-align: center;
    border-radius: 10px;
    right: 2px;
    bottom: 2px;
    top: auto;
    border: 1px solid #D04C00;
    -webkit-box-shadow: 0px 5px 10px -1px rgba(50,50,50,0.7);
    -moz-box-shadow: 0px 5px 10px -1px rgba(50,50,50,0.7);
    box-shadow: 0px 5px 10px -1px rgba(50,50,50,0.7);
    cursor: pointer;
}

    .timer > .btnVolverActividadCurso {
        font-size: 11px;
        font-weight: normal;
    }

    .timer i {
        margin-right: 5px;
    }

    .timer > span:last-child {
        font-weight: bold;
    }

.panelCheckList, .panelGaleria {
    height: 98%;
    overflow-y: auto;
    position: absolute;
    overflow-x: hidden;
    border-right: 10px solid transparent;
    width: 100%;
    box-sizing: border-box;
    left: 0px;
}

    .panelCheckList > #panelCheckList {
        padding: 15px;
    }

    .panelCheckList > div:last-child {
        border-right: 10px solid transparent;
    }

.panelCheckOpciones {
    text-align: right;
    padding: 5px 10px;
    box-sizing: border-box;
    position: relative;
    display: inline-block;
    float: right;
    width: 240px;
    line-height: 45px;
}

.panelCheckList > h2 {
    display: inline-block;
}

.panelCheck, .grupoInforme {
    width: 100%;
    border: 1px solid #DDD;
    -webkit-box-shadow: 0px 1.5px 1px rgba(50, 50, 50, 0.3);
    -moz-box-shadow: 0px 1.5px 1px rgba(50, 50, 50, 0.3);
    box-shadow: 0px 1.5px 1px rgba(50, 50, 50, 0.3);
    margin-bottom: 10px;
    box-sizing: border-box;
    float: left;
}

    .panelCheck.me, .grupoInforme.actual {
        -ms-transform: scale(1.015,1); /* IE 9 */
        -webkit-transform: scale(1.015,1); /* Chrome, Safari, Opera */
        transform: scale(1.015,1);
        -webkit-box-shadow: 0px 2px 3px rgba(50, 50, 50, 0.7);
        -moz-box-shadow: 0px 2px 3px rgba(50, 50, 50, 0.7);
        box-shadow: 0px 2px 3px rgba(50, 50, 50, 0.7);
    }

        .panelCheck.me > div:first-child {
            background-color: #687384;
            color: #FFF;
        }

    .panelCheck > div {
        padding: 10px;
        box-sizing: border-box;
    }

        .panelCheck > div:first-child {
            padding-top: 25px;
            padding-right: 25px;
            position: relative;
            background-color: #EEE;
        }

        .panelCheck > div:nth-child(2), .panelCheck > div:nth-child(3) {
            border-top: 1px solid #EEE;
            display: table;
            width: 100%;
        }

            .panelCheck > div:nth-child(2) > div, .panelCheck > div:nth-child(3) > div {
                display: table-cell;
                vertical-align: middle;
            }

                .panelCheck > div:nth-child(2) > div:nth-child(2), .panelCheck > div:nth-child(3) > div:nth-child(2) {
                    width: 30px;
                    font-size: 30px;
                    text-align: center;
                }

                    .panelCheck > div:nth-child(2) > div:nth-child(2) > i, .panelCheck > div:nth-child(3) > div:nth-child(2) > i {
                        opacity: 0.4;
                    }

                    .panelCheck > div:nth-child(2) > div:nth-child(2) > .checkOk, .panelCheck > div:nth-child(3) > div:nth-child(2) > .checkOk {
                        opacity: 1;
                        color: #04AD84;
                    }

.esquinaCheck {
    width: 0px;
    height: 0px;
    position: absolute;
    top: 0px;
    right: 0px;
    border-bottom: 40px solid transparent;
    border-right: 40px solid #5C66AD;
}

.esquinaImgRT {
    width: 0px;
    height: 0px;
    position: absolute;
    top: 0px;
    left: 0px;
    border-bottom: 40px solid transparent;
    border-left: 40px solid #FF5722;
}

.textEsquinaImgRT {
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 1;
    color: #FFF;
    padding-left: 5px;
    padding-top: 5px;
    font-weight: bold;
    font-size: 15px;
}

.esquinaCheckOtroUsuario {
    border-right: 40px solid #999;
}

.esquinaTarea {
    width: 0px;
    height: 0px;
    position: absolute;
    top: 0px;
    right: 0px;
    border-bottom: 30px solid transparent;
    border-right: 30px solid #066CA7;
}

.texEsquinaCheck, .texEsquina {
    position: absolute;
    right: 0px;
    top: 0px;
    z-index: 1;
    color: #FFF;
    padding-right: 5px;
    padding-top: 5px;
    font-weight: bold;
    font-size: 15px;
}

.btnCircular {
    width: 50px;
    height: 50px;
    margin-left: 5px;
    color: #FFF !Important;
    text-decoration: none;
    border-radius: 50%;
    font-size: 30px;
    line-height: 50px;
    text-align: center;
    cursor: pointer;
    float: right;
    padding: 3px;
    box-sizing: border-box;
}

.btnGenerar {
    background-color: #FF8E4E;
}

    .btnGenerar:hover {
        background-color: #FFA673;
    }

.bntGenerarInformeTecnico, .bntCirAzul {
    background-color: #4C95FF;
}

    .bntGenerarInformeTecnico:hover, .bntCirAzul:hover {
        background-color: #70ABFF;
    }

.bntCirVerde {
    background-color: #4EC356;
}

    .bntCirVerde:hover {
        background-color: #6AD271;
    }

.btnCircular:hover {
    -webkit-box-shadow: 0px 4px 10px -2px rgba(50, 50, 50, 0.5);
    -moz-box-shadow: 0px 4px 10px -2px rgba(50, 50, 50, 0.5);
    box-shadow: 0px 4px 10px -2px rgba(50, 50, 50, 0.5);
}

.panelInforme {
    width: 99%;
    height: 99%;
    position: absolute;
}

.loadingBar {
    text-align: center;
    width: 95%;
    position: absolute;
    padding: 10px;
    box-sizing: border-box;
    margin: 0 auto;
    left: 0;
    right: 0;
    margin-top: 20px;
    z-index: 1;
}

    .loadingBar > img {
        width: 150px;
        height: auto;
        margin: 0 auto;
    }

.botoneraInforme {
    width: 100%;
    min-height: 60px;
    background: #FFF;
    position: absolute;
    z-index: 1;
    padding: 5px;
    box-sizing: border-box;
}

    .botoneraInforme h2 {
        display: inline-block;
        float: left;
    }

    .botoneraInforme div {
        float: right;
        line-height: 45px;
    }

#contenidoInforme {
    padding: 10px;
    overflow-y: auto;
    overflow-x: hidden;
    width: 100%;
    height: 100%;
    position: relative;
    box-sizing: border-box;
}

.tituloGrupo {
    background: #5195cc;
    border: 1px solid #DDD;
    color: #FFF;
    padding: 10px;
    box-sizing: border-box;
    display: table;
    width: 100%;
}

    .tituloGrupo > span, .tituloGrupo > div {
        display: table-cell;
        vertical-align: middle;
        text-align: left;
    }

.grupoInforme.actual .tituloGrupo {
    background: #4C6A80;
    color: #FFF;
}

.grupoInforme .tablaInforme {
    display: table;
    width: 100%;
    table-layout: fixed;
}

.grupoInforme .filaInforme {
    display: table-row;
    width: 100%;
}

.grupoInforme .celdaInforme {
    display: table-cell;
    vertical-align: middle;
    border: 1px solid #DDD;
    padding: 3px;
    box-sizing: border-box;
}

    .grupoInforme .celdaInforme > div, .grupoInforme .celdaInforme > span {
        min-height: 30px;
        height: 100%;
        line-height: 100%;
        position: relative;
    }

        .grupoInforme .celdaInforme > div:first-child {
            display: none;
        }

        .grupoInforme .celdaInforme > div:last-child > input, .grupoInforme .celdaInforme > div:last-child > select,
        .grupoInforme .celdaInforme > div:last-child > textarea {
            width: 100%;
            height: 100%;
            border: none;
            margin: 0px;
            font-family: "Lato-Regular", sans-serif, Arial;
            font-size: inherit;
            letter-spacing: -0.5px;
            position: absolute;
            left: 0px;
        }

        .grupoInforme .celdaInforme > div:last-child > textarea {
            height: 200px;
            width: 100%;
            resize: none;
            position: relative;
        }

.grupoInforme .variableInforme {
    width: 25%;
}

.grupoInforme .variableInforme, .grupoInforme .medicionInforme {
    background-color: #F5F5F5;
}

.checkMedicion > div:nth-child(2) {
    text-align: center;
}

input[type="text"]:disabled, textarea:disabled, select:disabled {
    background-color: #F5F5F5 !important;
}

.informeEditar {
    float: right;
    color: #30A3E6;
    font-size: 20px;
    background-color: #FFF;
    border: 1px solid #CCC;
    padding: 4px 4px 0px 4px;
    border-radius: 5px;
    cursor: pointer;
}

    .informeEditar:hover {
        background-color: #30A3E6;
        color: #FFF;
    }

.panelCargarImagenes {
    width: 60px;
    height: 60px;
    padding: 0px;
    box-sizing: border-box;
    position: relative;
    float: right;
    right: 120px;
}

.panelGaleria > h2 {
    float: left;
    margin-left: 10px;
}

.galeriaReso {
    padding: 10px;
    float: left;
    clear: both;
    width: 100%;
    box-sizing: border-box;
    text-align: left;
    min-height: 50px;
    overflow: hidden;
}

    .galeriaReso > a,
    .panelCargarImagenesValidador > div > div > a {
        -webkit-box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.5);
        -moz-box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.5);
        box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.5);
        margin: 10px;
        display: inline-table;
        -webkit-transition: all 0.3s ease-in-out;
        -moz-transition: all 0.3s ease-in-out;
        -o-transition: all 0.3s ease-in-out;
        -ms-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
        text-decoration: none;
        width: 160px;
        height: 200px;
        position: relative;
        background-color: #FFF;
        overflow: hidden;
    }

        .galeriaReso > a.anima {
            -webkit-animation: animarfotoGaleria 1s ease-in-out; /* Safari 4.0 - 8.0 */
            animation: animarfotoGaleria 1s ease-in-out;
        }

        .galeriaReso > a[data-reso="r2"]:after {
            content: "R2";
            display: inline-block;
            background-color: #666;
            border: 1px solid #FFF;
            color: #FFF;
            width: 25px;
            height: 25px;
            line-height: 25px;
            text-align: center;
            border-radius: 50%;
            box-sizing: border-box;
            position: absolute;
            left: 5px;
            top: 5px;
            -webkit-box-shadow: 0px 3px 5px -2px rgba(0, 0, 0, 0.4);
            -moz-box-shadow: 0px 3px 5px -2px rgba(0, 0, 0, 0.4);
            box-shadow: 0px 3px 5px -2px rgba(0, 0, 0, 0.4);
        }


/* Safari 4.0 - 8.0 */
@-webkit-keyframes animarfotoGaleria {
    from {
        top: -15px;
        left: -15px;
        opacity: 0;
    }

    to {
        top: 0px;
        left: 0px;
        opacity: 1;
    }
}

/* Standard syntax */
@keyframes animarfotoGaleria {
    from {
        top: -15px;
        left: -15px;
        opacity: 0;
    }

    to {
        top: 0px;
        left: 0px;
        opacity: 1;
    }
}

.galeriaReso.seleccionEliminar > a > div:nth-child(3),
.panelCargarImagenesValidador > div > div.seleccionEliminar > a > div:nth-child(3) {
    display: block;
}

.galeriaReso.seleccionRT > a > div:nth-child(4),
.panelCargarImagenesValidador > div > div.seleccionRT > a > div:nth-child(4) {
    display: block;
}

.galeriaReso.seleccionRT > a.selectedRT > .selectRT,
.panelCargarImagenesValidador > div > div.seleccionRT > a.selectedRT > .selectRT {
    color: #FF9800;
}

.galeriaReso.seleccionEliminar > a.selectedDEL > div:nth-child(3),
.panelCargarImagenesValidador > div > div.seleccionEliminar > a.selectedDEL > div:nth-child(3) {
    color: #FF4848;
}

.galeriaReso.seleccionRT > a.selectedRT > .selectRT,
.panelCargarImagenesValidador > div > div.seleccionRT > a.selectedRT > .selectRT {
    color: #FF9800;
}

.galeriaReso.seleccionEliminar > a:hover, .galeriaReso.seleccionRT > a:hover, .galeriaReso.seleccionEditar > a:hover,
.panelCargarImagenesValidador > div > div.seleccionEliminar > a:hover, .panelCargarImagenesValidador > div > div.seleccionRT > a:hover, .panelCargarImagenesValidador > div > div.seleccionEditar > a:hover {
    -ms-transform: scale(1,1); /* IE 9 */
    -webkit-transform: scale(1,1); /* Chrome, Safari, Opera */
    transform: scale(1,1);
}

.galeriaReso > a > div:first-child,
.panelCargarImagenesValidador > div > div > a > div:first-child {
    width: 160px;
    height: 100%;
    background-position: bottom;
    background-repeat: no-repeat;
    background-size: cover;
    position: absolute;
    left: 0;
    top: 0;
}

    .galeriaReso > a > div:first-child:after, .panelCargarImagenesValidador > div > div > a > div:first-child:after {
        content: "";
        width: 100%;
        height: 50px;
        position: absolute;
        left: 0;
        bottom: 0;
        background-image: inherit;
        background-position: bottom;
        background-size: cover;
        -webkit-filter: blur(5px);
        -moz-filter: blur(5px);
        -o-filter: blur(5px);
        -ms-filter: blur(5px);
        filter: blur(5px);
    }

.galeriaReso > a > div:nth-child(3),
.panelCargarImagenesValidador > div > div > a > div:nth-child(3) {
    display: none;
    background-color: #FFF;
    width: 35px;
    height: 35px;
    color: #777;
    position: absolute;
    right: 0px;
    top: 0px;
    text-align: center;
    line-height: 35px;
    font-size: 25px;
    border-radius: 0px 0px 0px 5px;
    border-width: 0px 0px 1px 1px;
    box-sizing: border-box;
    border-color: #DDD;
    border-style: solid;
    box-shadow: -3px 3px 15px -5px rgba(0, 0, 0, 0.6);
}

.galeriaReso > a > div:nth-child(4),
.panelCargarImagenesValidador > div > div > a > div:nth-child(4) {
    display: none;
    background-color: #FFFFFF;
    width: 35px;
    height: 35px;
    color: #AAA;
    position: absolute;
    right: 0px;
    top: 0px;
    text-align: center;
    line-height: 35px;
    font-size: 25px;
    border-radius: 0px 0px 0px 5px;
    border-width: 0px 0px 1px 1px;
    box-sizing: border-box;
    border-color: #DDD;
    border-style: solid;
    box-shadow: -3px 3px 15px -5px rgba(0, 0, 0, 0.6);
}

.galeriaReso > a > div:nth-child(2),
.panelCargarImagenesValidador > div > div > a > div:nth-child(2) {
    padding: 3px;
    font-size: 12px;
    box-sizing: border-box;
    font-weight: bold;
    color: #555;
    position: absolute;
    text-align: left;
    left: 0;
    bottom: 0;
    height: 50px;
    background-color: rgba(255,255,255,0.8);
    width: 100%;
    -webkit-box-shadow: 0px -2px 10px 0px rgba(0, 0, 0, 0.4);
    -moz-box-shadow: 0px -2px 10px 0px rgba(0, 0, 0, 0.4);
    box-shadow: 0px -2px 10px 0px rgba(0, 0, 0, 0.4);
    text-transform: uppercase;
    color: #444;
}

    .galeriaReso > a > div:nth-child(2) > span,
    .panelCargarImagenesValidador > div > div > a > div:nth-child(2) > span {
        display: none;
    }

.galeriaReso.seleccionEditar > a > div:nth-child(2) > span,
.panelCargarImagenesValidador > div > div.seleccionEditar > a > div:nth-child(2) > span {
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 40px;
    height: 40px;
    top: -50px;
    background-color: #FFF;
    border-radius: 50%;
    text-align: center;
    line-height: 40px;
    font-size: 20px;
    color: #546E7A;
    display: block;
}

    .galeriaReso.seleccionEditar > a > div:nth-child(2) > span:after,
    .panelCargarImagenesValidador > div > div.seleccionEditar > a > div:nth-child(2) > span:after {
        position: absolute;
        width: 0;
        height: 0;
        content: '';
        border-left: 15px solid transparent;
        border-right: 15px solid transparent;
        border-top: 20px solid #FFF;
        bottom: -12px;
        left: 0;
        right: 0;
        margin: 0 auto;
    }

.galeriaReso.seleccionEditar > a:hover > div:nth-child(2) > span,
.panelCargarImagenesValidador > div > div.seleccionEditar > a:hover > div:nth-child(2) > span {
    background-color: #2196F3;
    color: #FFF;
}

    .galeriaReso.seleccionEditar > a:hover > div:nth-child(2) > span:after,
    .panelCargarImagenesValidador > div > div.seleccionEditar > a:hover > div:nth-child(2) > span:after {
        border-top-color: #2196F3;
    }

.galeriaReso > a > div:nth-child(2) > div:first-child,
.panelCargarImagenesValidador > div > div > a > div:nth-child(2) > div:first-child {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    font-weight: normal;
    width: 90%;
    position: absolute;
    text-transform: capitalize;
    color: #666;
}

.opcionesGaleria {
    min-height: 60px;
    width: 180px;
    display: inline-block;
    float: right;
    position: relative;
}

.preview {
    display: inline-block;
    width: 100%;
}

    .preview > div,
    .panelCargarImagenesValidador > div > div > div {
        display: table;
        width: 49%;
        float: left;
        margin-right: 1%;
        border: 1px solid #EEE;
        box-sizing: border-box;
        padding: 2px;
        margin-bottom: 2px;
        background-color: #FFF;
        position: relative;
    }

        .preview > div .deletePreview, .panelCargarImagenesValidador > div > div > div .deletePreview {
            width: 40px;
            height: 100%;
            position: absolute;
            right: 0px;
            top: 0px;
            background-color: #FF4848;
            color: #FFF;
            line-height: 45px;
            text-align: center;
            font-size: 20px;
            cursor: pointer;
        }

            .preview > div .deletePreview:hover, .panelCargarImagenesValidador > div > div > div .deletePreview:hover {
                background-color: #FF0000;
            }

        .preview > div > div:first-child,
        .panelCargarImagenesValidador > div > div > div > div:first-child {
            width: 40px;
            height: 40px;
            display: table-cell;
            background-position: center;
            background-repeat: no-repeat;
            background-size: cover;
            display: table-cell;
            vertical-align: middle;
            overflow: hidden;
        }

        .preview > div > div:nth-child(2),
        .panelCargarImagenesValidador > div > div > div > div:nth-child(2) {
            padding: 1px 40px 1px 5px;
            font-size: 12px;
            box-sizing: border-box;
            display: table-cell;
            vertical-align: middle;
        }

            .preview > div > div:nth-child(2) > input,
            .panelCargarImagenesValidador > div > div > div > div:nth-child(2) > input {
                width: 100%;
                height: 38px;
                border: none;
                padding: 2px;
                box-sizing: border-box;
            }

.panelCargarImagenesValidador > div > div {
    padding-top: 10px;
    margin-bottom: 20px;
    float: left;
    width: 100%;
    text-align: left;
}

.mfp-close {
    opacity: 0.8 !IMPORTANT;
    filter: alpha(opacity=85) !IMPORTANT;
    font-size: 60px !IMPORTANT;
    font-family: inherit;
    margin-right: -20px;
    margin-top: 20px;
    cursor: pointer !Important;
}

.closePCI {
    background-color: #404F59;
    color: #FFF;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    display: none;
    background-image: url(../images/Util/close.png);
    background-position: center;
    background-size: 60%;
    background-repeat: no-repeat;
    position: absolute;
    top: 10px;
    right: 10px;
    font-size: 20px;
    padding: 3px 0px;
    text-align: center;
    box-sizing: border-box;
    cursor: pointer;
}

.closeTitle {
    font-size: 22px;
    cursor: pointer;
    text-decoration: none;
    display: block;
    right: 0px;
    top: 0px;
    bottom: 0;
    margin: auto;
}

.backPCI {
    margin-right: 15px;
}

/*.backPCI:before {
        vertical-align: -50%;
    }*/

.btnAddImg {
    width: 50px;
    height: 50px;
    border-radius: 5px;
    box-sizing: border-box;
    position: relative;
    color: #FFF;
    background-position: center;
    background-size: cover;
    cursor: pointer;
    margin: 5px;
}

    .btnAddImg > div {
        background-color: #686EFF;
        width: 100%;
        height: 100%;
        border-radius: 50%;
        text-align: center;
        line-height: 100%;
        font-size: 30px;
        box-sizing: border-box;
        position: relative;
        color: #FFFFFF;
        cursor: pointer;
        overflow: hidden;
    }

        .btnAddImg > div:before {
            position: absolute;
            left: 0px;
            right: 0px;
            top: 10px;
        }

        .btnAddImg > div > div {
            position: absolute;
            width: 18px;
            height: 18px;
            font-size: 18px;
            color: #FFFFFF;
            right: 5px;
            top: 5px;
            background-color: inherit;
            border-radius: 50%;
        }


        .btnAddImg > div:hover {
            background-color: #868BFF;
            -webkit-box-shadow: 0px 4px 10px -2px rgba(50, 50, 50, 0.5);
            -moz-box-shadow: 0px 4px 10px -2px rgba(50, 50, 50, 0.5);
            box-shadow: 0px 4px 10px -2px rgba(50, 50, 50, 0.5);
        }

        .btnAddImg > div #imagenes {
            opacity: 0;
            filter: alpha(opacity=0); /* For IE8 and earlier */
            width: 100%;
            max-width: 100%;
            height: 100%;
            position: relative;
            cursor: pointer;
            top: 0px;
            left: 0px;
        }

::-webkit-file-upload-button {
    cursor: pointer;
}

.opcionesGaleria .btnCirRojo, .panelCargarImagenesValidador > div > .btnCirRojo {
    width: 50px;
    height: 50px;
    margin: 5px;
    background-color: #FF5353;
    color: #FFF;
    border-radius: 50%;
    font-size: 30px;
    line-height: 50px;
    text-align: center;
    cursor: pointer;
    position: absolute;
    right: 0px;
}

    .opcionesGaleria .btnCirRojo:hover, .panelCargarImagenesValidador > div > .btnCirRojo:hover {
        background-color: #FF7E7E;
        -webkit-box-shadow: 0px 4px 10px -2px rgba(50, 50, 50, 0.5);
        -moz-box-shadow: 0px 4px 10px -2px rgba(50, 50, 50, 0.5);
        box-shadow: 0px 4px 10px -2px rgba(50, 50, 50, 0.5);
    }

.opcionesGaleria .btnSelectRT, .panelCargarImagenesValidador > div > .btnSelectRT {
    width: 50px;
    height: 50px;
    margin: 5px;
    background-color: #FF9800;
    color: #FFF;
    border-radius: 50%;
    font-size: 30px;
    line-height: 50px;
    text-align: center;
    cursor: pointer;
    position: absolute;
    right: 60px;
}

.opcionesGaleria .btnEditFoto {
    width: 50px;
    height: 50px;
    background-color: #607d8b;
    color: #FFF;
    border-radius: 50%;
    font-size: 30px;
    line-height: 50px;
    text-align: center;
    cursor: pointer;
    position: absolute;
    right: 110px;
}

    .opcionesGaleria .btnEditFoto:hover {
        background-color: #809ba9;
        -webkit-box-shadow: 0px 4px 10px -2px rgba(50, 50, 50, 0.5);
        -moz-box-shadow: 0px 4px 10px -2px rgba(50, 50, 50, 0.5);
        box-shadow: 0px 4px 10px -2px rgba(50, 50, 50, 0.5);
    }

.fa.btnPrint {
    width: 50px;
    height: 50px;
    background-color: #666;
    color: #FFF;
    border-radius: 50%;
    font-size: 30px;
    line-height: 50px;
    text-align: center;
    cursor: pointer;
    position: relative;
}

    .fa.btnPrint:hover {
        background-color: #888;
        -webkit-box-shadow: 0px 4px 10px -2px rgba(50, 50, 50, 0.5);
        -moz-box-shadow: 0px 4px 10px -2px rgba(50, 50, 50, 0.5);
        box-shadow: 0px 4px 10px -2px rgba(50, 50, 50, 0.5);
    }

.opcionesGaleria .btnAddFoto {
    width: 50px;
    height: 50px;
    color: #FFF;
    border-radius: 50%;
    font-size: 30px;
    line-height: 50px;
    text-align: center;
    cursor: pointer;
    position: absolute;
    right: 110px;
}

.opcionesGaleria .btnSelectRT > div, .panelCargarImagenesValidador > div > .btnSelectRT > div {
    position: absolute;
    left: 15px;
    top: 15px;
    font-size: smaller;
    color: #999;
}

.opcionesGaleria .btnSelectRT:hover, .panelCargarImagenesValidador > div > .btnSelectRT:hover {
    background-color: #FFB74D;
    -webkit-box-shadow: 0px 4px 10px -2px rgba(50, 50, 50, 0.5);
    -moz-box-shadow: 0px 4px 10px -2px rgba(50, 50, 50, 0.5);
    box-shadow: 0px 4px 10px -2px rgba(50, 50, 50, 0.5);
}

#panelEtapasImagen > select {
    width: 220px;
    height: 40px;
    border: 1px solid #EEE;
}

.panelCheckList::-webkit-scrollbar, .panelGaleria::-webkit-scrollbar, #contenidoInforme::-webkit-scrollbar, .panelInforme::-webkit-scrollbar, html::-webkit-scrollbar, .contentMaster::-webkit-scrollbar {
    width: 5px;
    height: 5px;
}

.panelCheckList::-webkit-scrollbar-track, .panelGaleria::-webkit-scrollbar-track, #contenidoInforme::-webkit-scrollbar-track, .panelInforme::-webkit-scrollbar-track, html::-webkit-scrollbar-track, .contentMaster::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    border-radius: 10px;
}

.panelCheckList::-webkit-scrollbar-thumb, .panelGaleria::-webkit-scrollbar-thumb, #contenidoInforme::-webkit-scrollbar-thumb, .panelInforme::-webkit-scrollbar-thumb, html::-webkit-scrollbar-thumb, .contentMaster::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
}

/****Editar fotografias informe técnico****/
.galeriaReso > a > .panelEditarFotografia,
.panelCargarImagenesValidador > div > div > a > .panelEditarFotografia {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background-color: rgba(255,255,255,0.85);
    display: none;
    padding: 7px;
    padding-top: 25px;
    box-sizing: border-box;
}

.galeriaReso > a.selectedEDI > .panelEditarFotografia,
.panelCargarImagenesValidador > div > div > a.selectedEDI > .panelEditarFotografia {
    display: block;
}

.galeriaReso > a.selectedEDI > *:not(.panelEditarFotografia),
.panelCargarImagenesValidador > div > div > a.selectedEDI > *:not(.panelEditarFotografia) {
    -webkit-filter: blur(3px);
    -moz-filter: blur(3px);
    -o-filter: blur(3px);
    -ms-filter: blur(3px);
    filter: blur(3px);
}

.galeriaReso > a > .panelEditarFotografia > .close,
.panelCargarImagenesValidador > div > div > a > .panelEditarFotografia > .close {
    width: 40px;
    height: 25px;
    border-radius: 0px 0px 0px 5px;
    position: absolute;
    right: 0;
    top: 0;
    background-color: #ff5f53;
    color: #FFF;
    line-height: 25px;
    text-align: center;
    font-size: 15px;
}

    .galeriaReso > a > .panelEditarFotografia > .close:hover,
    .panelCargarImagenesValidador > div > div > a > .panelEditarFotografia > .close:hover {
        background-color: #F44336;
        cursor: pointer;
    }

.galeriaReso > a > .panelEditarFotografia > select,
.panelCargarImagenesValidador > div > div > a > .panelEditarFotografia > select {
    margin-bottom: 15px;
}

.galeriaReso > a > .panelEditarFotografia > i,
.panelCargarImagenesValidador > div > div > a > .panelEditarFotografia > i {
    font-style: normal;
    padding-left: 5px;
    color: #555;
}

.galeriaReso > a.selectedEDI,
.panelCargarImagenesValidador > div > div > a.selectedEDI {
    cursor: default;
}

.panelCargarImagenesValidador {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    overflow: auto;
    display: none;
    z-index: 10;
}

    .panelCargarImagenesValidador > div {
        position: absolute;
        width: 95%;
        height: 95%;
        border-radius: 3px;
        background-color: #FFF;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 10;
        padding: 3%;
        box-sizing: border-box;
        margin: auto;
        -webkit-box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.21), 0 16px 28px 0 rgba(0, 0, 0, 0.22);
        -moz-box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.21), 0 16px 28px 0 rgba(0, 0, 0, 0.22);
        box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.21), 0 16px 28px 0 rgba(0, 0, 0, 0.22);
    }

    .panelCargarImagenesValidador > div {
        overflow: auto;
        max-height: 100%;
    }

    .panelCargarImagenesValidador:before {
        content: '';
        position: fixed;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0,0,0,0.7);
    }

.cerrar {
    width: 60px;
    height: 30px;
    background-color: #FF5353;
    display: block;
    border-radius: 0px 0px 0px 5px;
    position: absolute;
    top: 2.5%;
    right: 2.5%;
    z-index: 11;
    line-height: 30px !important;
    text-align: center;
    color: #FFF;
    font-size: 20px !important;
}

    .cerrar:hover {
        background-color: #FF7E7E;
        cursor: pointer;
    }
/*******************************************/


.ui-tooltip {
    padding: 0px !Important;
    border: none !Important;
    webkit-box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.21), 0 16px 28px 0 rgba(0, 0, 0, 0.22) !Important;
    -moz-box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.21), 0 16px 28px 0 rgba(0, 0, 0, 0.22) !Important;
    box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.21), 0 16px 28px 0 rgba(0, 0, 0, 0.22) !Important;
}

    .ui-tooltip::before {
        content: " ";
        width: 0px;
        height: 0px;
        position: absolute;
        border-bottom: 10px solid #000;
        border-left: 8px solid transparent;
        border-right: 8px solid transparent;
        right: 0px;
        top: -9px;
        left: 0px;
        margin: 0 auto;
    }

    .ui-tooltip > div {
        padding: 5px;
        color: #F9F9F9;
        border-radius: 0px;
        background-color: #000 !Important;
        border: 1px solid #333;
    }

.checkGrupo {
    position: absolute;
    visibility: hidden;
    opacity: 0;
}

.toolTipValidacion {
    position: absolute;
    padding: 3px;
    box-sizing: border-box;
    background-color: rgba(255,82,82,0.9);
    border-radius: 3px;
    border: 1px solid #FF5252;
    color: #FFF;
    text-align: center;
    font-size: 12px;
    display: none;
    width: 150px;
    left: -160PX;
    top: 0px;
}

    .toolTipValidacion::after {
        content: " ";
        width: 0px;
        height: 0px;
        position: absolute;
        border-left: 10px solid #FF5252;
        border-top: 8px solid transparent;
        border-bottom: 8px solid transparent;
        right: -10px;
        top: 10px;
    }

.validacionError:hover > .toolTipValidacion {
    display: block;
}

.tarjetaReso, .tarjetaFondoDifuminado {
    height: 200px;
    border: 1px solid #EEE;
    background-color: #DDD;
    background-position: center;
    background-size: cover;
    position: relative;
    overflow: hidden;
    box-sizing: border-box;
    float: left;
    -webkit-animation-name: tarjetaResoAnim; /* Chrome, Safari, Opera */
    -webkit-animation-duration: 3s; /* Chrome, Safari, Opera */
    animation-name: tarjetaResoAnim;
    animation-duration: 3s;
    -webkit-transition: -webkit-transform 0.3s ease-in-out;
    -moz-transition: -moz-transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out;
    display: table;
    cursor: pointer;
}

    .tarjetaReso > span:nth-child(2) {
        width: 40px;
        height: 40px;
        background: rgba(4,173,132,0.7);
        position: absolute;
        right: 0px;
        top: 0px;
        color: #FFF;
        line-height: 40px;
        text-align: center;
        font-size: 30px;
        z-index: 1;
    }

    .tarjetaReso > span:nth-child(3) {
        content: " ";
        width: 35px;
        height: 35px;
        top: 0px;
        right: 0px;
        position: absolute;
        box-sizing: border-box;
        background-image: inherit;
        background-position: top;
        background-size: cover;
        -webkit-filter: blur(5px);
        -moz-filter: blur(5px);
        -o-filter: blur(5px);
        -ms-filter: blur(5px);
        filter: blur(5px);
    }

    .tarjetaReso > div {
        position: absolute;
        bottom: 0px;
        background-color: rgba(255,255,255,0.7);
        padding: 5px;
        box-sizing: border-box;
        height: 65px;
        color: #555;
        font-size: 12px;
        width: 100%;
        display: table;
    }

        .tarjetaReso > div > span {
            display: table-cell;
            vertical-align: middle;
        }

    .tarjetaReso::before {
        content: " ";
        width: 100%;
        height: 60px;
        bottom: 0px;
        position: absolute;
        left: 0;
        padding: 5px;
        box-sizing: border-box;
        background-image: inherit;
        background-position: bottom;
        background-size: cover;
        -webkit-filter: blur(5px);
        -moz-filter: blur(5px);
        -o-filter: blur(5px);
        -ms-filter: blur(5px);
        filter: blur(5px);
    }

    .tarjetaReso.responsable::before {
        height: 80px;
    }


.dropDown {
    border: 1px solid #DDD;
    -webkit-appearance: none;
    -moz-appearance: none;
    -o-appearance: none;
    appearance: none;
    background-image: url('../../images/Util/arrow-down.png');
    background-position: 95% 50%;
    background-repeat: no-repeat;
    background-size: 15px;
    width: 100px;
    text-indent: 0.01px;
    text-overflow: '';
    padding-right: 20px;
    font-family: inherit;
    padding-left: 5px;
    background-color: #FFF;
    font-size: inherit;
    color: inherit;
}

    .dropDown::-ms-expand {
        display: none;
    }

.contenedorCheckAprobar {
    width: 70%;
    margin: 0 auto;
}

.AsigCheck {
    width: 98%;
    margin: 10px 1%;
    border: 1px solid #EEE;
    background-image: url('../../images/Util/text1.jpg');
    background-repeat: repeat;
    box-sizing: border-box;
    position: relative;
    overflow: hidden;
    -webkit-box-shadow: 0px 2px 3px 0px rgba(50, 50, 50, 0.3);
    -moz-box-shadow: 0px 2px 3px 0px rgba(50, 50, 50, 0.3);
    box-shadow: 0px 2px 3px 0px rgba(50, 50, 50, 0.3);
    -webkit-animation-name: tarjetaResoAnim;
    -webkit-animation-duration: 3s;
    animation-name: tarjetaResoAnim;
    animation-duration: 3s;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

    .AsigCheck.locktec {
        -webkit-animation-name: tarjetaResoAnim2;
        animation-name: tarjetaResoAnim2;
    }

    .AsigCheck::before {
        content: " ";
        width: 100%;
        height: 60px;
        top: 0px;
        left: 0px;
        position: absolute;
        box-sizing: border-box;
        background-image: inherit;
        -webkit-filter: blur(3px);
        -moz-filter: blur(3px);
        -o-filter: blur(3px);
        -ms-filter: blur(3px);
        filter: blur(3px);
        z-index: 1;
    }

    .AsigCheck::after {
        content: " ";
        width: 100%;
        height: 100%;
        top: 0px;
        left: 0px;
        position: absolute;
        box-sizing: border-box;
        background-color: #FFF;
        z-index: 0;
    }

    .AsigCheck > div {
        width: 100%;
        height: 100%;
        background: rgba(255, 255, 255, 0.8);
        position: relative;
        top: 0px;
        left: 0px;
        z-index: 2;
    }

        .AsigCheck > div > div:first-child {
            width: 100%;
            min-height: 50px;
            padding: 10px;
            box-sizing: border-box;
            background: rgba(255, 255, 255, 0.7);
            position: relative;
            text-align: left;
        }

            .AsigCheck > div > div:first-child b {
                width: 120px;
                display: inline-block;
            }

        .AsigCheck > div > div:nth-child(n+2) {
            width: 100%;
            background: #FFF;
            border-top: 1px solid #EEE;
            display: table;
            position: relative;
        }

            .AsigCheck > div > div:nth-child(n+2) > div:first-child {
                width: 60px;
                height: 60px;
                background-position: center;
                background-size: cover;
                border-right: 1px solid #EEE;
            }

            .AsigCheck > div > div:nth-child(n+2) > div {
                display: table-cell;
                vertical-align: middle;
            }

                .AsigCheck > div > div:nth-child(n+2) > div:nth-child(n+2) {
                    padding-left: 10px;
                    padding-right: 65px;
                    text-align: left;
                }

                    .AsigCheck > div > div:nth-child(n+2) > div:nth-child(n+2) > span {
                        width: 60px;
                        height: 60px;
                        position: absolute;
                        right: 0px;
                        top: 0px;
                        border-left: 1px solid #EEE;
                        line-height: 60px;
                        text-align: center;
                        font-size: 30px;
                        opacity: 0.6;
                        cursor: pointer;
                    }

.pCheckAprobOK .pCheck {
    opacity: 1 !Important;
    color: #04AD84;
}

.AsigCheckAprob > div > div:first-child {
    background: #04AD84;
    color: #FFF;
}

.destacar {
    opacity: 0.3;
}



.alertWarning .ui-dialog-titlebar, .alertWarning .cerrarModal:hover {
    background-color: #D09D26;
    color: #fff;
}

.alertError .ui-dialog-titlebar, .alertError .cerrarModal:hover {
    background-color: #D0263D;
}

.alertSuccess .ui-dialog-titlebar, .alertSuccess .cerrarModal:hover {
    background-color: #04AD84;
}

.alertNotice .ui-dialog-titlebar, .alertNotice .cerrarModal:hover {
    background-color: #2671D0;
}

/* Chrome, Safari, Opera */
@-webkit-keyframes tarjetaResoAnim {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* Standard syntax */
@keyframes tarjetaResoAnim {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* Chrome, Safari, Opera */
@-webkit-keyframes tarjetaResoAnim2 {
    from {
        opacity: 0;
    }

    to {
        opacity: 0.7;
    }
}

/* Standard syntax */
@keyframes tarjetaResoAnim2 {
    from {
        opacity: 0;
    }

    to {
        opacity: 0.7;
    }
}

#tabsRT .contenedorRTAprobar, #tabsOS .contenedorInfoOS {
    border-top: 1px solid #DDD;
    padding: 10px 0px;
    top: -2px;
    position: relative;
}

.panelCentral {
    width: 90%;
    margin: 0 auto;
    float: none;
}

.control {
    font-family: inherit;
    padding-left: 5px !Important;
    box-sizing: border-box;
    font-size: inherit;
    color: inherit;
}

    .control:focus, .dropDown:focus, .chosen-container.chosen-container-active > .chosen-single {
        border-bottom: 1px solid #009688 !important;
    }

.panelComentarioRechazo {
    display: block;
    border: 1px solid #FF7474;
    background-color: #FF8F8F;
    color: #FFF;
    padding: 5px;
    border-radius: 5px;
    margin: 10px auto;
    text-align: left;
    padding-left: 20px;
    text-transform: uppercase;
    box-sizing: border-box;
}

.ui-widget {
    font-family: "Lato-Regular", sans-serif, Arial;
    font-size: inherit;
}

.tboxGroup {
    margin: 0 auto;
    display: table;
}

    .tboxGroup > span, .tboxGroup > a {
        width: 40px;
        height: 100%;
        color: inherit;
        text-align: center;
        box-sizing: border-box;
        border-left: 1px solid #DDD;
        text-decoration: none;
        padding: 10px;
        background-color: #F5F5F5;
        border-radius: 0px 2px 2px 0px;
    }

        .tboxGroup > span:hover, .tboxGroup > a:hover {
            background-color: #009688;
            color: #FFF !Important;
            -webkit-transition: background-color 300ms linear;
            -moz-transition: background-color 300ms linear;
            -o-transition: background-color 300ms linear;
            -ms-transition: background-color 300ms linear;
            transition: background-color 300ms linear;
            cursor: pointer;
            border-radius: 0px 2px 2px 0px;
        }

    .tboxGroup > .control {
        border: none;
        margin: 0px;
        box-sizing: border-box;
        width: 100%;
        font-size: inherit;
        color: inherit;
        padding: 0px !important;
    }

    .tboxGroup > span, .tboxGroup > .control, .tboxGroup > a {
        display: table-cell;
        vertical-align: middle;
        height: 100%;
    }

        .tboxGroup > .control > input, .tboxGroup > .control > textarea {
            width: 100%;
            height: 100%;
            display: block;
            border: none;
            resize: none;
            color: inherit;
            padding-left: 5px;
        }

.control::-webkit-input-placeholder {
    padding-left: 10px;
    font-style: italic;
    font-size: 16px !Important;
}

.control:-moz-placeholder {
    padding-left: 10px;
    font-style: italic;
    font-size: 16px;
}

.control::-moz-placeholder {
    padding-left: 10px;
    font-style: italic;
    font-size: 16px;
}

.control:-ms-input-placeholder {
    padding-left: 10px;
    font-style: italic;
    font-size: 16px;
}

.tarjetaFondoDifuminado {
    background-color: #FFF;
    height: 300px;
    position: relative;
    overflow: hidden;
    display: block;
}

    .tarjetaFondoDifuminado > div:first-child::before {
        content: '';
        background-image: url('../Util/fondoDifuminado.gif');
        position: absolute;
        width: 100%;
        height: 100%;
        background-position: center;
        background-size: cover;
        background-repeat: no-repeat;
        -webkit-filter: blur(35px);
        -moz-filter: blur(35)px);
        -o-filter: blur(35px);
        -ms-filter: blur(35px);
        filter: blur(35px);
        -ms-transform: scale(1.5,1.5); /* IE 9 */
        -webkit-transform: scale(1.5,1.5); /* Chrome, Safari, Opera */
        transform: scale(1.5,1.5);
    }

    .tarjetaFondoDifuminado > div:first-child {
        overflow: hidden;
        position: absolute;
        width: 100%;
        height: 100%;
    }

    .tarjetaFondoDifuminado > div:last-child {
        position: absolute;
        background-color: rgba(255,255,255,0.9);
        width: 100%;
        height: 100%;
    }

.panelInformacion {
    width: 100%;
    border: 1px solid #DDD;
    box-sizing: border-box;
    margin-bottom: 20px;
}

    .panelInformacion div {
        display: table;
        width: 100%;
        box-sizing: border-box;
        position: relative;
    }

    .panelInformacion h2 {
        border-bottom: 1px solid #DDD;
        padding: 10px;
        margin: 0px;
        background-color: #888;
        color: #FFF;
    }

    .panelInformacion span {
        width: 25%;
        display: table-cell;
        vertical-align: middle;
        float: left;
        padding: 6px;
        box-sizing: border-box;
    }

        .panelInformacion span:nth-child(2n-1) {
            font-weight: bold;
            text-transform: uppercase;
        }

            .panelInformacion span:nth-child(2n-1) > i {
                float: right;
                margin-right: 5px;
                font-style: normal;
            }

    .panelInformacion > div > i {
        position: absolute;
        left: 50%;
        width: 1px;
        height: 100%;
        background-color: #DDD;
        box-sizing: border-box;
    }

ol.barraProgreso {
    list-style-type: disc;
    display: table;
    width: 100%;
    box-sizing: border-box;
    padding: 0px;
    position: relative;
}

    ol.barraProgreso li {
        display: table-cell;
        text-align: center;
        position: relative;
        padding-bottom: 10px;
        width: 14.29%;
        text-transform: uppercase;
    }

        ol.barraProgreso li::after {
            content: "";
            width: 20px;
            height: 20px;
            background-color: #BBB;
            border-radius: 50%;
            display: block;
            position: absolute;
            left: 0px;
            right: 0px;
            margin: 0 auto;
            bottom: -15px;
            z-index: 1;
            -webkit-box-shadow: 0px 0px 5px 0px rgba(50, 50, 50, 0.4);
            -moz-box-shadow: 0px 0px 5px 0px rgba(50, 50, 50, 0.4);
            box-shadow: 0px 0px 5px 0px rgba(50, 50, 50, 0.4);
        }

        ol.barraProgreso li.active::after {
            background-color: #60C394;
        }

    ol.barraProgreso > span {
        position: absolute;
        height: 10px;
        /*width: 85.71%;*/
        background-color: #99DABB;
        left: 0px;
        right: 0px;
        margin: 0 auto;
        bottom: -10px;
        z-index: 0;
    }

        ol.barraProgreso > span.active {
            background-color: #99DABB;
            left: 7.145%;
            margin: 0px;
            width: 0%;
        }

    ol.barraProgreso > li > span:first-child {
        display: block;
    }

    ol.barraProgreso > li > span:last-child {
        display: none;
    }

.ui-dialog.modalFiltros, .ui-dialog.modalForm {
    width: 80% !Important;
    position: absolute;
    -webkit-box-shadow: 0px 4px 10px 0px rgba(50, 50, 50, 0.5);
    -moz-box-shadow: 0px 4px 10px 0px rgba(50, 50, 50, 0.5);
    box-shadow: 0px 4px 10px 0px rgba(50, 50, 50, 0.5);
    box-sizing: border-box;
    margin: 0 auto;
    left: 0;
    right: 0;
    background-color: #FFF;
    font-size: inherit !Important;
    overflow: visible;
    z-index: 99999;
}

    .ui-dialog.modalFiltros .ui-dialog-titlebar {
        background-color: #009688;
    }

    .ui-dialog.modalFiltros .ui-dialog-titlebar, .ui-dialog.modalForm .ui-dialog-titlebar {
        padding: 20px !Important;
        font-size: 20px !Important;
        text-align: center;
    }

    .ui-dialog.modalFiltros div.ui-dialog-titlebar span.ui-dialog-title,
    .ui-dialog.modalForm div.ui-dialog-titlebar span.ui-dialog-title {
        position: absolute;
        left: 0;
        width: 100%;
    }

    .ui-dialog.modalFiltros .ui-dialog-content, .ui-dialog.modalForm .ui-dialog-content {
        padding: 5% !Important;
        overflow: visible;
    }

    .ui-dialog.modalFiltros .ui-dialog-titlebar .ui-dialog-titlebar-close, .ui-dialog.modalForm .ui-dialog-titlebar .ui-dialog-titlebar-close,
    .ui-dialog.modal .ui-dialog-titlebar .ui-dialog-titlebar-close {
        display: block !Important;
        background: none;
        border: none;
        right: 0px;
        /*top: 20px;*/
        width: 25px;
        height: 25px;
        position: relative;
        float: right;
    }

        .ui-dialog.modalFiltros .ui-dialog-titlebar .ui-dialog-titlebar-close span.ui-button-icon-primary.ui-icon.ui-icon-closethick,
        .ui-dialog.modalFiltros .ui-dialog-titlebar .ui-dialog-titlebar-close span.ui-button-icon.ui-icon.ui-icon-closethick,
        .ui-dialog.modalForm .ui-dialog-titlebar .ui-dialog-titlebar-close span.ui-button-icon-primary.ui-icon.ui-icon-closethick,
        .ui-dialog.modalForm .ui-dialog-titlebar .ui-dialog-titlebar-close span.ui-button-icon.ui-icon.ui-icon-closethick,
        .ui-dialog.modal .ui-dialog-titlebar .ui-dialog-titlebar-close span.ui-button-icon-primary.ui-icon.ui-icon-closethick,
        .ui-dialog.modal .ui-dialog-titlebar .ui-dialog-titlebar-close span.ui-button-icon.ui-icon.ui-icon-closethick {
            background-image: url("../images/Util/close.png");
            background-position: 0px;
            background-size: 100%;
            width: 100%;
            height: 100%;
            position: absolute;
            left: 0px;
            top: 0px;
        }

button.ui-button.ui-corner-all.ui-widget.ui-button-icon-only.ui-dialog-titlebar-close {
    outline: -webkit-focus-ring-color auto 0px;
}

/*#modalFiltros> div {*/
#modalFiltros > div > div, .ui-dialog.modalForm > .ui-dialog-content > div > div {
    display: table;
    width: 100%;
    box-sizing: border-box;
}

    /*#modalFiltros > div:nth-child(2) {*/
    #modalFiltros > div > div:nth-child(2), .ui-dialog.modalForm > .ui-dialog-content > div > .graybox-container {
        border: 1px solid #EEE;
        margin-top: 10px;
        padding-bottom: 10px;
        border-radius: 3px;
        background-color: #F5F5F5;
    }

    #modalFiltros > div > div > div {
        width: 33%;
    }
    /*#modalFiltros > div > div {*/
    #modalFiltros > div > div > div, .ui-dialog.modalForm > .ui-dialog-content > div > div > div {
        display: table-cell;
        vertical-align: middle;
        /*width: 33%;*/
        position: relative;
        padding-top: 25px;
        padding-left: 10px;
        padding-right: 10px;
        float: left;
        box-sizing: border-box;
    }

        #modalFiltros > div > div > div > .controlGrande:focus ~ span, .ui-dialog.modalForm > .ui-dialog-content > div > div > div > .controlGrande:focus ~ span {
            /*#modalFiltros > div > div > .controlGrande:focus ~ span {*/
            color: #009688;
        }

#modalFiltros .chosen-container-active ~ span, .ui-dialog.modalForm > .ui-dialog-content .chosen.chosen-container-active ~ span {
    color: #009688 !Important;
}

/*#modalFiltros > div > div > span:last-child {*/
#modalFiltros > div > div > div > span:last-child, .ui-dialog.modalForm > .ui-dialog-content > div > div > div > span:last-child {
    color: #AAA;
    text-transform: uppercase;
    position: absolute;
    left: 10px;
    top: 10px;
}

.ui-dialog.modalForm .radioGrupo > span label {
    color: #adafaf;
    text-transform: uppercase;
}

.circliful > .timer {
    display: block !important;
}

/*Modificación estilo datepicker jquery*/

body .ui-widget {
    font-family: "Lato-Regular", sans-serif, Arial;
    font-size: 13px;
    background: none;
    border: none;
}

.ui-widget.ui-datepicker {
    border: 1px solid #DDD;
    border-radius: 0px;
    border-top: 3px solid #009688;
    box-sizing: border-box;
    background: rgba(255,255,255,0.9);
}

    .ui-widget.ui-datepicker .ui-widget-header {
        border: none;
        background: none;
        color: inherit;
    }

    .ui-widget.ui-datepicker .ui-datepicker-prev-hover, .ui-widget.ui-datepicker .ui-datepicker-next-hover {
        border: none;
        background: none;
        font-weight: inherit;
        color: inherit;
        padding: 0px;
        top: 2px;
        border-radius: 50%;
        box-sizing: border-box;
        background-color: #EEE;
    }

    .ui-widget.ui-datepicker .ui-datepicker-prev-hover {
        left: 2px;
    }

    .ui-widget.ui-datepicker .ui-datepicker-next-hover {
        right: 2px;
    }

    .ui-widget.ui-datepicker .ui-datepicker-prev .ui-icon, .ui-widget.ui-datepicker .ui-datepicker-next .ui-icon {
        background-image: none;
    }

    .ui-widget.ui-datepicker .ui-datepicker-prev .ui-icon {
        background-image: url('../../images/Util/calendar-left.png');
        background-position: 0px;
        background-size: 100%;
    }

    .ui-widget.ui-datepicker .ui-datepicker-next .ui-icon {
        background-image: url('../../images/Util/calendar-right.png');
        background-position: 0px;
        background-size: 100%;
    }

    .ui-widget.ui-datepicker .ui-datepicker-calendar thead {
        color: #53B3AA;
        font-weight: normal;
        font-size: inherit;
        font-family: inherit;
    }

        .ui-widget.ui-datepicker .ui-datepicker-calendar thead th {
            padding: 0.5em .3em;
        }

    .ui-widget.ui-datepicker .ui-datepicker-calendar td a {
        background: none;
        border: none;
        text-align: center;
        color: inherit;
        font-weight: normal;
    }

        .ui-widget.ui-datepicker .ui-datepicker-calendar td a.ui-state-highlight {
            background-color: #C7EAE5;
            color: inherit;
        }

        .ui-widget.ui-datepicker .ui-datepicker-calendar td a.ui-state-active {
            background-color: #78B3AA;
            color: #FFF;
        }

/*cambio de algunos estilos para el filtro de dropdownlist*/
.chosen-container {
    text-transform: uppercase;
    width: 100% !Important;
    font-size: inherit !important;
    font-family: inherit;
    color: inherit;
}

    .chosen-container .chosen-results {
        max-height: 120px !Important;
        color: inherit !Important;
    }

.chosen-container-single .chosen-search input[type="text"] {
    font-family: inherit !Important;
    color: inherit !Important;
    font-size: inherit !Important;
    border: 1px solid #DDD !Important;
}

.chosen-container-single .chosen-single {
    border-radius: 3px !Important;
    border: 1px solid #DDD !Important;
    background: #FFF !Important;
    font-family: inherit !Important;
    color: inherit !Important;
    height: 40px !Important;
    padding: 0 0 0 5px !Important;
    display: table !Important;
    width: 100% !Important;
    box-shadow: none !Important;
    font-size: inherit;
    font-family: inherit;
    color: inherit;
}


    .chosen-container-single .chosen-single > span {
        display: table-cell !Important;
        vertical-align: middle;
        position: absolute !Important;
        width: 99% !Important;
        padding-top: 8px !Important;
        padding-right: 30px !Important;
        background-image: url('../../images/Util/arrow-down.png');
        background-position: 95% 60%;
        background-repeat: no-repeat;
        background-size: 15px;
        font-size: inherit;
        font-family: inherit;
        color: inherit;
    }
/*.chosen-container-single .chosen-single div {
    position:relative !Important;
    width:25px !Important;
    text-align:center !Important;
    display:table-cell !Important;
    vertical-align:middle;
    }
    .chosen-container-single .chosen-single div b {
    background-image: url('../Img/arrow-down.png') !Important;
    background-position: 0% 50% !Important;
    background-repeat: no-repeat !Important;
    background-size: 15px !Important;
    }*/

.chosen-container-active .chosen-single {
    box-shadow: none !Important;
}

.chosen-container .chosen-drop {
    border: 1px solid #DDD !Important;
    box-shadow: none !Important;
}

.chosen-container-single .chosen-drop {
    margin-top: 0px !important;
}

.chosen-drop .chosen-results::-webkit-scrollbar {
    width: 5px;
    height: 5px;
}

.chosen-drop .chosen-results::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    border-radius: 10px;
}

.chosen-drop .chosen-results::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
}

.PanelRTR2 {
    width: 130px;
    height: 170px;
    display: block;
    border: 1px solid #EEE;
    float: left;
    margin: 5px;
    text-decoration: none;
    background-color: #F9F9F9;
}

    .PanelRTR2:hover {
        background-color: #EEE;
        border: 1px solid #CCC;
        -ms-transform: scale(1.01,1.01); /* IE 9 */
        -webkit-transform: scale(1.01,1.01); /* Chrome, Safari, Opera */
        transform: scale(1.01,1.01);
        -webkit-box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.21), 0 16px 28px 0 rgba(0, 0, 0, 0.22);
        -moz-box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.21), 0 16px 28px 0 rgba(0, 0, 0, 0.22);
        box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.21), 0 16px 28px 0 rgba(0, 0, 0, 0.22);
    }

    .PanelRTR2 span:first-child {
        width: 100%;
        height: 120px;
        font-size: 100px;
        text-align: center;
        padding: 10px;
        box-sizing: border-box;
    }

    .PanelRTR2 span:last-child {
        text-align: center;
        padding: 5px;
        width: 100%;
        display: block;
        box-sizing: border-box;
        color: #777;
        font-size: 12px;
    }

/*Estilos página de asignaciones*/
.panelEstructuraActividades > i {
    margin: auto;
    left: 0;
    right: 0;
    position: absolute;
    width: 100px;
    height: 100px;
    top: 0;
    bottom: 0;
    font-size: 100px;
    color: #DDD;
}

.panelAsignacion {
    width: 100%;
    height: 100%;
    position: absolute;
    background-color: #FFF;
}

    .panelAsignacion > .panelOSLeft, .panelLeft {
        width: 180px;
        height: 100%;
        background-color: #ECEFF1;
        border-right: 1px solid #CFD8DC;
        display: inline-block;
        position: absolute;
        left: 0px;
        top: 0px;
        padding: 5px;
        box-sizing: border-box;
    }

        .panelAsignacion > .panelOSLeft > .panelOS, .panelAsignacion > .panelTecnicoRight .panelTecnico, .panelLeft > .panelContentAside {
            width: 100%;
            height: 100%;
            position: absolute;
            left: 0px;
            top: 0px;
            border-top: 120px solid transparent;
            z-index: 0;
            box-sizing: border-box;
            overflow: auto;
            padding: 2px;
        }

    .panelAsignacion > .panelTecnicoRight .panelTecnico {
        border-top: 70px solid transparent;
    }

    .panelAsignacion > .panelOSLeft > .panelOS::-webkit-scrollbar, .panelLeft > .panelContentAside::-webkit-scrollbar {
        width: 5px;
        height: 5px;
    }

    .panelAsignacion > .panelOSLeft > .panelOS::-webkit-scrollbar-track, .panelLeft > .panelContentAside::-webkit-scrollbar-track {
        -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
        border-radius: 10px;
    }

    .panelAsignacion > .panelOSLeft > .panelOS::-webkit-scrollbar-thumb, .panelLeft > .panelContentAside::-webkit-scrollbar-thumb {
        border-radius: 10px;
        -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
    }

    .panelAsignacion > .panelOSLeft > .panelOS > div, .panelAsignacion > .panelOSLeft > .panelOS > span,
    .panelLeft > .panelContentAside > div.item, .panelLeft > .panelContentAside > span {
        width: 100%;
        height: 40px;
        display: block;
        border: 1px solid #D5D5D5;
        box-sizing: border-box;
        line-height: 40px;
        text-align: center;
        background-color: #F5FAFD;
        border-radius: 1px;
    }

    .panelAsignacion > .panelOSLeft > .panelOS > span, .panelLeft > .panelContentAside > span {
        line-height: 15px;
        padding: 5px;
    }

    .panelAsignacion > .panelOSLeft > .panelOS > div:hover, .panelLeft > .panelContentAside > div.item:hover {
        background-color: #FFF8E1;
        cursor: pointer;
        border-color: #FFE590;
    }

    .panelAsignacion > .panelOSLeft > .panelOS > div.active, .panelLeft > .panelContentAside > div.item.active {
        background-color: #FFF1C4;
        color: #666;
        border-color: #FFD54F;
    }


    .panelAsignacion > .panelTecnicoRight {
        width: 200px;
        height: 100%;
        background-color: #ECEFF1;
        border-left: 1px solid #CFD8DC;
        display: inline-block;
        position: absolute;
        right: 0px;
        top: 0px;
        padding: 5px;
        box-sizing: border-box;
        z-index: 5;
    }

.tarjetaTecnico {
    display: table;
    width: 100%;
    height: 50px;
    border: 1px solid #D5D5D5;
    background-color: #F5FAFD;
    border-radius: 2px;
    box-sizing: border-box;
    position: relative;
    overflow: hidden;
    margin-bottom: 2px;
}

.panelAsignacion > .tarjetaTecnico {
    width: 200px;
    z-index: 1000;
}

    .panelAsignacion > .tarjetaTecnico > div:last-child {
        display: none;
    }

.tarjetaTecnico > div:last-child > span {
    width: 25px;
    height: 25px;
    color: #FFF;
    font-size: 16px;
    padding: 4.5px;
    box-sizing: border-box;
    position: absolute;
    text-align: center;
}

    .tarjetaTecnico > div:last-child > span.btnElimTecnico {
        background-color: #EF9A9A;
        top: 0px;
        right: 0px;
        border-radius: 0px 2px 0px 0px;
    }

        .tarjetaTecnico > div:last-child > span.btnElimTecnico:hover {
            background-color: #F44336;
        }

    .tarjetaTecnico > div:last-child > span.btnEditarPorcTecnico {
        background-color: #888;
        bottom: 0px;
        right: 0px;
        border-radius: 0px 0px 2px 0px;
    }

        .tarjetaTecnico > div:last-child > span.btnEditarPorcTecnico:hover {
            background-color: #555;
            cursor: pointer;
        }

    .tarjetaTecnico > div:last-child > span.btnRevertirAnulacionAsignacion {
        background-color: #4DB6AC;
        color: #FFF;
        top: 0px;
        right: 0px;
        border-radius: 0px 2px 0px 0px;
    }

        .tarjetaTecnico > div:last-child > span.btnRevertirAnulacionAsignacion:hover {
            background-color: #26A69A;
            cursor: pointer;
        }

.panelTecnicoRight .tarjetaTecnico > div:last-child {
    display: none;
}

.panelTecnicoRight .tarjetaTecnico:hover > div:first-child, .panelTecnicoRight .tarjetaTecnico:hover > div:nth-child(2) {
    background-color: #FFF8E1;
    cursor: pointer;
    border-color: #FFE590;
}

.tarjetaTecnico > div {
    display: table-cell;
    vertical-align: middle;
}

    .tarjetaTecnico > div:first-child {
        width: 50px;
        position: relative;
        padding: 5px;
        box-sizing: border-box;
    }

        .tarjetaTecnico > div:first-child div {
            width: 40px;
            height: 40px;
            position: relative;
            background-position: center;
            background-size: cover;
            border-radius: 50%;
            border: 1px solid #DDD;
            box-sizing: border-box;
        }

    .tarjetaTecnico > div:last-child {
        position: relative;
        z-index: 2;
        width: 25px;
        cursor: pointer;
    }

    .tarjetaTecnico > div:nth-child(2) > i {
        font-size: 12px;
        font-style: normal;
        float: left;
    }

.panelAsignacion > .panelTecnicoRight .panelTecnico::-webkit-scrollbar {
    width: 5px;
    height: 5px;
}

.panelAsignacion > .panelTecnicoRight .panelTecnico::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    border-radius: 10px;
}

.panelAsignacion > .panelTecnicoRight .panelTecnico::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
}

.panelAsignacionCentral, .panelContentSection.panelCenter {
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    padding-left: 180px;
    padding-right: 200px;
    z-index: 0;
}

    .panelAsignacionCentral > div:first-child {
        width: 100%;
        height: 120px;
        background-color: #ECEFF1;
        border-bottom: 1px solid #CFD8DC;
        padding: 5px;
        box-sizing: border-box;
        z-index: 2;
        position: relative;
    }

    .panelAsignacionCentral > div:last-child {
        overflow-y: auto;
        position: relative;
        height: 100%;
        width: 100%;
        top: -120px;
        border-top: 120px solid transparent;
        box-sizing: border-box;
        overflow-x: hidden;
        z-index: 1;
    }

        .panelAsignacionCentral > div:last-child::-webkit-scrollbar {
            width: 5px;
            height: 5px;
        }

        .panelAsignacionCentral > div:last-child::-webkit-scrollbar-track {
            -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
            border-radius: 10px;
        }

        .panelAsignacionCentral > div:last-child::-webkit-scrollbar-thumb {
            border-radius: 10px;
            -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
        }


    .panelAsignacionCentral > div:first-child > h1,
    .panelAsignacionCentral > div:first-child > h2 {
        margin: 0px;
        text-align: center;
        padding: 10px;
    }

.tablaAsignacion {
    display: table;
    width: 100%;
    border-style: solid;
    border-color: #BBB;
    border-width: 1px 1px 0px 1px;
}

    .tablaAsignacion:last-child {
        border-width: 1px;
    }

    .tablaAsignacion > div {
        display: table-cell;
        vertical-align: middle;
        min-height: 170px;
        box-sizing: border-box;
    }

        .tablaAsignacion > div:first-child {
            border-right: 1px solid #BBB;
            width: 60px;
            text-align: center;
            padding: 5px;
            box-sizing: border-box;
            text-transform: uppercase;
            background-color: #EBF0F3;
            font-size: 12px;
        }

    .tablaAsignacion .tablaAsignacion {
        border: none;
    }

        .tablaAsignacion .tablaAsignacion > div {
            border-bottom: 1px solid #BBB;
        }

            .tablaAsignacion .tablaAsignacion > div:first-child {
                background-color: #F5FAFD;
            }

        .tablaAsignacion .tablaAsignacion:last-child > div {
            border-bottom: none;
        }

        .tablaAsignacion .tablaAsignacion > div:last-child > div {
            display: table;
            width: 100%;
        }

            .tablaAsignacion .tablaAsignacion > div:last-child > div > div > span:first-child {
                color: #FFF;
                background-color: #E5E5E5;
                width: 52px;
                height: 52px;
                font-size: 30px;
                box-sizing: border-box;
                padding: 10px;
                border-radius: 5px;
                border: 1.5px dashed #BBB;
                text-shadow: 5px 5px 15px #CCC;
            }

            .tablaAsignacion .tablaAsignacion > div:last-child > div > div > span:first-child,
            .tablaAsignacion .tablaAsignacion > div:last-child > div > div > .tarjetaTecnico {
                float: left;
                margin-right: 5px;
                margin-bottom: 5px;
            }

            .tablaAsignacion .tablaAsignacion > div:last-child > div > div > .tarjetaTecnico {
                width: 230px;
            }

            .tablaAsignacion .tablaAsignacion > div:last-child > div > span {
                padding: 5px;
                box-sizing: border-box;
                height: 40px;
                border-bottom: 1px solid #BBB;
                position: relative;
            }

            .tablaAsignacion .tablaAsignacion > div:last-child > div > div {
                min-height: 135px;
                border-bottom: 1px solid #BBB;
                padding: 5px;
                box-sizing: border-box;
            }

            .tablaAsignacion .tablaAsignacion > div:last-child > div:last-child > div {
                border-bottom: none;
            }

            .tablaAsignacion .tablaAsignacion > div:last-child > div > div, .tablaAsignacion .tablaAsignacion > div:last-child > div > span {
                display: table-cell;
                vertical-align: middle;
                float: left;
                width: 100%;
                padding-right: 30px;
            }

                .tablaAsignacion .tablaAsignacion > div:last-child > div > div > .tarjetaTecnico.tecnicoAsignado {
                    width: 200px;
                }

        .tablaAsignacion .tablaAsignacion > div:first-child > span {
            min-height: 160px;
            max-height: 160px;
        }

.dragAndCloneAsignacion > .tarjetaTecnico > div:nth-child(3):hover {
    cursor: pointer;
}

.panelTecnico > span {
    height: 50px;
    width: 100%;
    border: 1px solid #DDD;
    display: block;
    background-color: #f5fafd;
    padding: 5px;
    box-sizing: border-box;
}

/*dependiendo de si esta asignada, terminada, o por iniciar, las actividades internas se muestran de la siguiente forma*/
.dragAndCloneAsignacion > .tarjetaTecnico.tecnicoAsignado > div:last-child {
    display: none;
    cursor: pointer;
}

.asignada + .dragAndCloneAsignacion > .tarjetaTecnico > div:last-child,
.porAsignar + .dragAndCloneAsignacion > .tarjetaTecnico > div:last-child {
    display: table-cell;
    width: 25px;
    z-index: 2;
    cursor: pointer;
}

.asignada + .dragAndCloneAsignacion > .tarjetaTecnico,
.porAsignar + .dragAndCloneAsignacion > .tarjetaTecnico {
    width: 230px !important;
}

.tarjetaTecnico > span {
    position: absolute;
    left: 1px;
    top: 1px;
    width: 230px;
    height: 50px;
    display: none;
    border-right: 27px solid transparent;
    box-sizing: border-box;
    z-index: 1;
    padding: 5px;
    background-color: #FFF;
}

    .tarjetaTecnico > span > select {
        width: 150px;
    }

    .tarjetaTecnico > span > input {
        width: 150px;
    }

    .tarjetaTecnico > span > .btnAceptarPorcentaje {
        width: 35px;
        height: 100%;
        float: right;
        background-color: #63C1AA;
        border-radius: 3px;
        color: #FFF;
        font-size: 20px;
        padding: 10px 8px;
        box-sizing: border-box;
    }

        .tarjetaTecnico > span > .btnAceptarPorcentaje:hover {
            background-color: #04AD84;
            cursor: pointer;
        }

.dragAndCloneAsignacion > .tarjetaTecnico > div:nth-child(2) > i:nth-child(2) {
    display: none;
}

.dragAndCloneAsignacion > .tarjetaTecnico.tecnicoAsignado > div:nth-child(2) > i:nth-child(2) {
    display: block;
}

.dragAndCloneAsignacion > .tarjetaTecnico > div:nth-child(2) > i:nth-child(3) {
    display: block;
    margin-left: 5px;
}

.sinResultados {
    width: 100%;
    height: 45px;
    text-align: left;
    padding: 15px;
    box-sizing: border-box;
    background-color: #90A4AE;
    color: #FFF;
    font-size: 15px;
    position: absolute;
    top: -45px;
    display: block;
}

.multiseleccion {
    background-color: #FFF1C4 !important;
    color: #666 !important;
}

    .multiseleccion > span {
        background-color: #FFF1C4 !important;
        color: #666 !important;
        text-shadow: none;
    }

.tablaAsignacion .tablaAsignacion > div:last-child > div > span > span {
    width: 100%;
    height: 40px;
    display: none;
    background-color: #E57373;
    position: absolute;
    top: 100%;
    left: 0px;
    z-index: 1000;
    color: #FFF;
    padding: 10px;
    box-sizing: border-box;
}

    .tablaAsignacion .tablaAsignacion > div:last-child > div > span > span > i {
        display: table-cell;
        vertical-align: middle;
    }

        .tablaAsignacion .tablaAsignacion > div:last-child > div > span > span > i:last-child {
            width: 30px;
            font-size: 20px;
            text-align: center;
            cursor: pointer;
        }

.activarPanelesLaterales {
    width: 30px;
    height: 100%;
    display: table;
    position: fixed;
    top: 50px;
    background-color: #EBF0F3;
    cursor: pointer;
}

    .activarPanelesLaterales > div {
        display: table-cell;
        vertical-align: middle;
        padding: 2.5px;
    }

        .activarPanelesLaterales > div > span {
            width: 25px;
            height: 100px;
            font-size: 25px;
            text-align: center;
            padding: 38px 0px;
            box-sizing: border-box;
            display: block;
            background-color: #CFD8DC;
            border-radius: 5px;
        }

.btnCirRojo {
    background-color: #FF5353;
}

    .btnCirRojo:hover {
        background-color: #FF7E7E;
    }

.panelOSLeft > .btnCirRojo, .panelLeft > .btnCirRojo {
    position: absolute;
    top: 20px;
    left: 270px;
    display: none;
}

.panelTecnicoRight > .btnCirRojo, .panelTecnicoRight > .bntCirVerde {
    position: absolute;
    right: 270px;
    display: none;
}

.panelTecnicoRight > .btnCirRojo {
    top: 20px;
}

.panelTecnicoRight > .bntCirVerde {
    top: 90px;
}

.panelOSLeft > div:first-child, .panelLeft > .panelHeaderAside {
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 1;
    width: 100%;
    height: 120px;
    padding: 5px;
    box-sizing: border-box;
}

.rotate {
    -ms-writing-mode: tb-rl;
    -webkit-writing-mode: vertical-rl;
    -moz-writing-mode: vertical-rl;
    -ms-writing-mode: vertical-rl;
    writing-mode: vertical-rl;
    -ms-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
}

/*estados asignada y porasiganar, complementan a ejecucion y terminada(utilizadas para las asignaciones) para las tareas*/
.asignada {
    background-color: #90A4AE;
    color: #FFF;
}

.porAsignar {
    background-color: #F5FAFD;
}

.eliminadoRedo, .anulado {
    background-color: #E57373;
    color: #FFF;
    /*transición de el fondo de color*/
    -webkit-transition: background-color 1500ms linear;
    -moz-transition: background-color 1500ms linear;
    -o-transition: background-color 1500ms linear;
    -ms-transition: background-color 1500ms linear;
    transition: background-color 1500ms linear;
}

    .eliminadoRedo > div:nth-child(2) > i:nth-child(2), .anulado > div:nth-child(2) > i:nth-child(2) {
        color: #FFF !important;
    }

    .anulado .btnEditarPorcTecnico {
        cursor: no-drop !important;
    }

.tablaAsignacion .tablaAsignacion > div:last-child > div > span > i:last-child {
    display: none;
}

.ejecucion + .dragAndCloneAsignacion > .tarjetaTecnico.suspendida {
    width: 230px !important;
}

    .ejecucion + .dragAndCloneAsignacion > .tarjetaTecnico.suspendida > div:last-child {
        display: table-cell;
    }

        .ejecucion + .dragAndCloneAsignacion > .tarjetaTecnico.suspendida > div:last-child > .btnElimTecnico {
            cursor: no-drop;
        }

.ejecucion + .dragAndCloneAsignacion > .tarjetaTecnico.aPorIniciar {
    width: 230px !important;
}

    .ejecucion + .dragAndCloneAsignacion > .tarjetaTecnico.aPorIniciar > div:last-child {
        display: table-cell;
    }

.tablaAsignacion .tablaAsignacion > div:last-child > div > .terminado.redo {
    background-color: #90A4AE !important;
    color: #FFF !important;
}

.redo > i:last-child {
    display: block !important;
    font-size: 20px;
    position: absolute;
    right: 5px;
    height: 100%;
    top: 0px;
    padding: 10px 0px;
    box-sizing: border-box;
}


/*control de tecnico*/
.tarjetaControlTecnico {
    height: 270px;
    border: 1px solid #CFD8DC;
    background-color: #FFF;
    position: relative;
    overflow: hidden;
    box-sizing: border-box;
    float: left;
    -webkit-animation-name: tarjetaResoAnim; /* Chrome, Safari, Opera */
    -webkit-animation-duration: 3s; /* Chrome, Safari, Opera */
    animation-name: tarjetaResoAnim;
    animation-duration: 3s;
    -webkit-transition: -webkit-transform 0.3s ease-in-out;
    -moz-transition: -moz-transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out;
    display: block;
    padding: 10px;
}

    .tarjetaControlTecnico > div:nth-child(1) {
        display: table;
        width: 100%;
        height: 60px;
    }

    .tarjetaControlTecnico > div:nth-child(2) {
        display: table;
        width: 100%;
        height: 140px;
        max-height: 140px;
    }

    .tarjetaControlTecnico > div:nth-child(3) {
        display: block;
        border-top: 1px solid #EEE;
        position: absolute;
        bottom: 0px;
        left: 0px;
        width: 100%;
        height: 60px;
        padding: 4px 10px;
        text-align: left;
        box-sizing: border-box;
        text-shadow: none;
        padding-right: 30px;
        text-transform: uppercase;
        overflow-y: auto;
        font-size: 11px;
        color: #FFF;
    }

.scroll {
    overflow-x: hidden;
    overflow-y: auto;
}

    .scroll::-webkit-scrollbar {
        width: 5px;
        height: 5px;
    }

    .scroll::-webkit-scrollbar-track {
        -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
        border-radius: 10px;
    }

    .scroll::-webkit-scrollbar-thumb {
        border-radius: 10px;
        -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
    }

.tarjetaControlTecnico > div.asignada:nth-child(3) {
    background-color: #78909C;
    color: #FFF;
}

.tarjetaControlTecnico > div:nth-child(1) > div:first-child {
    display: table-cell;
    width: 60px;
    background-position: center;
    background-size: cover;
    border-radius: 50%;
}

.tarjetaControlTecnico > div:nth-child(1) > div:last-child {
    display: table-cell;
    width: auto;
    padding-left: 15px;
    vertical-align: middle;
}

.tarjetaControlTecnico > div:nth-child(2) {
    margin-top: 5px;
    padding-top: 5px;
    border-top: 1px solid #EEE;
}

    .tarjetaControlTecnico > div:nth-child(2) > div:nth-child(1) {
        display: table-cell;
        vertical-align: middle;
        width: auto;
        font-size: 11px;
        text-transform: uppercase;
    }

    .tarjetaControlTecnico > div:nth-child(2) > div:nth-child(2) {
        display: table-cell;
        width: 100px;
        vertical-align: middle;
        text-align: center;
    }

    .tarjetaControlTecnico > div:nth-child(2) > div:last-child > .contador {
        padding: 1px 10px;
        cursor: pointer;
        margin: 3px;
    }

.tarjetaControlTecnico > div:nth-child(3) > .badge {
    float: none;
    position: relative;
    font-size: 12px;
    padding: 5px;
    margin: 2px;
    border-radius: 10px;
    cursor: pointer;
    background-color: rgba(255, 255, 255, 0.3);
    color: #FFF;
    display: inline-block;
}

    .tarjetaControlTecnico > div:nth-child(3) > .badge:hover {
        background-color: #FFF;
        color: #777;
    }

.tarjetaControlTecnico > div:nth-child(3) > .closePCI {
    top: 5px;
    right: 5px;
    background-color: rgba(255,255,255,0.3);
    padding: 6px;
    font-size: 17px;
    display: none;
}

.contador:hover {
    background-color: #777;
    color: #EAEAEA;
    border-color: #777;
}

.tarjetaControlTecnico > div.disponible:nth-child(3) {
    background-color: rgba(244, 67, 54, 0.9) !Important;
}

.tarjetaControlTecnico > div.ejecucion:nth-child(3) {
    background-color: rgba(4,173,132,0.9) !important;
}

.tarjetaControlTecnico > div.pausado:nth-child(3) {
    background-color: rgba(216,158,0,0.9) !Important;
}

.tarjetaControlTecnico > div.panelTareasOS {
    position: absolute;
    left: 0;
    top: 100%;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.8);
    z-index: 5;
}

    .tarjetaControlTecnico > div.panelTareasOS > div {
        padding: 10px;
        width: 100%;
        height: 100%;
        box-sizing: border-box;
    }

        .tarjetaControlTecnico > div.panelTareasOS > div > h2 {
            text-align: center;
        }

    .tarjetaControlTecnico > div.panelTareasOS > .closePCI {
        background-color: #BDBDBD;
        color: #FFF;
        font-size: 17px;
        padding: 5px;
        right: 5px;
        top: 5px;
        display: none;
        z-index: 5;
    }

    .tarjetaControlTecnico > div.panelTareasOS > div > div {
        display: table;
        width: 100%;
        background-color: #FFF;
        margin-bottom: 5px;
        border-bottom: 1px solid #EEE;
        min-height: 50px;
    }

        .tarjetaControlTecnico > div.panelTareasOS > div > div:last-child {
            border-width: 1px;
        }

        .tarjetaControlTecnico > div.panelTareasOS > div > div > div {
            display: table-cell;
            vertical-align: middle;
            padding: 5px;
            font-size: 11px;
        }

            .tarjetaControlTecnico > div.panelTareasOS > div > div > div > span {
                font-weight: bold;
            }

            .tarjetaControlTecnico > div.panelTareasOS > div > div > div:last-child {
                width: 85px;
                /*border-left:1px solid #EEE;*/
                text-align: center;
            }

                .tarjetaControlTecnico > div.panelTareasOS > div > div > div:last-child > .contador {
                    padding: 0px 10px;
                    cursor: pointer;
                    margin: 0px;
                }

                    .tarjetaControlTecnico > div.panelTareasOS > div > div > div:last-child > .contador:nth-child(2) {
                        margin-left: 5px;
                    }

        .tarjetaControlTecnico > div.panelTareasOS > div > div:hover {
            background-color: #FFF8E1;
        }

.tarjetaControlTecnico > div:nth-child(1) > div:last-child > i {
    font-style: normal;
}

    .tarjetaControlTecnico > div:nth-child(1) > div:last-child > i > i {
        color: rgba(119, 119, 119, 0.5);
        margin-left: 10px;
    }

.checkMultiple {
    width: 170px;
    border-collapse: collapse;
    position: absolute;
    left: 0px;
    top: 40px;
    z-index: 5;
    background-color: #FFF;
    text-align: left;
    border: 1px solid #DDD;
}

    .checkMultiple > tbody > tr {
        border-bottom: 1px solid #EEE;
        height: 30px;
        text-transform: uppercase;
        font-size: 11px;
        cursor: pointer;
    }

    .checkMultiple > tbody td {
        height: 30px;
    }

    .checkMultiple input::-ms-check {
        /* IE 8 */
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
        /* IE 5-7 */
        filter: alpha(opacity=0);
        /* Good browsers :) */
        opacity: 0;
    }

    .checkMultiple input {
        display: none;
    }

    .checkMultiple label {
        display: block;
        width: 100%;
        height: 100%;
        cursor: pointer;
        line-height: 30px;
        padding-left: 10px;
        box-sizing: border-box;
        padding-right: 5px;
    }

    .checkMultiple input + label:after {
        content: "\f046";
        display: inline-block;
        font: normal normal normal 14px/1 FontAwesome;
        text-rendering: auto;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        float: right;
        color: #E0E0E0;
        line-height: 30px;
        font-size: 17px;
    }

    .checkMultiple input:checked + label:after {
        color: #009688;
    }

    .checkMultiple > tbody > tr:hover {
        background-color: #FFF8E1;
    }

/*******************************/


/*Documentos*/
.panelComponenteDocumentos {
    width: 100%;
    border-width: 1px;
    border-style: solid;
    border-color: #EEE;
    margin-top: 5px;
    margin-bottom: 5px;
    border-radius: 3px;
}

    .panelComponenteDocumentos > span {
        width: 100%;
        min-height: 25px;
        padding: 10px;
        background-color: #EEE;
        display: block;
        color: inherit;
        box-sizing: border-box;
        text-transform: uppercase;
        position: relative;
    }

        .panelComponenteDocumentos > span i {
            font-style: normal;
        }

        .panelComponenteDocumentos > span > span {
            display: inline-block;
            float: right;
        }

            .panelComponenteDocumentos > span > span > i {
                display: inline-block;
                padding: 3px 3px 1px 3px;
                background-color: #999;
                border-radius: 5px;
                color: #FFF;
                box-sizing: border-box;
                min-width: 70px;
                text-align: center;
                font-style: normal;
                margin-right: 5px;
                text-transform: capitalize;
                -webkit-transition: all 0.3s linear;
                -moz-transition: all 0.3s linear;
                -o-transition: all 0.3s linear;
                -ms-transition: all 0.3s linear;
                transition: all 0.3s linear;
            }

                .panelComponenteDocumentos > span > span > i > i:nth-child(3) {
                    display: none;
                }

                .panelComponenteDocumentos > span > span > i.addDoc {
                    background-color: #4C95FF;
                }

                .panelComponenteDocumentos > span > span > i.delDoc {
                    background-color: #EF5350;
                }

                .panelComponenteDocumentos > span > span > i.pubDoc {
                    background-color: #FF9800;
                }

                .panelComponenteDocumentos > span > span > i > i {
                    margin-right: 3px;
                }

                .panelComponenteDocumentos > span > span > i:hover {
                    -webkit-box-shadow: 0px 3px 5px 0px rgba(50, 50, 50, 0.4);
                    -moz-box-shadow: 0px 3px 5px 0px rgba(50, 50, 50, 0.4);
                    box-shadow: 0px 3px 5px 0px rgba(50, 50, 50, 0.4);
                    cursor: pointer;
                }

                .panelComponenteDocumentos > span > span > i.addDoc:hover {
                    background-color: #70ABFF;
                }

                .panelComponenteDocumentos > span > span > i.delDoc:hover {
                    background-color: #FF7E7E;
                }

                .panelComponenteDocumentos > span > span > i.pubDoc:hover {
                    background-color: #FFB74D;
                }

    .panelComponenteDocumentos > div {
        padding: 5px;
        overflow: hidden;
        position: relative;
        min-height: 90px;
    }

.documento {
    width: 110px;
    height: 165px;
    margin: 2px;
    border-radius: 5px;
    overflow: hidden;
    border: 1px solid transparent;
    box-sizing: border-box;
    padding: 5px;
    position: relative;
    display: inline-table;
    text-decoration: none;
    color: inherit !important;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    -ms-transition: all 0.3s linear;
    transition: all 0.3s linear;
    left: -30px;
    top: -20px;
    opacity: 0;
}

    .documento.anima {
        left: 0;
        top: 0;
        opacity: 1;
    }

    .documento:hover {
        -webkit-box-shadow: 3px 4px 5px -2px rgba(50, 50, 50, 0.1);
        -moz-box-shadow: 3px 4px 5px -2px rgba(50, 50, 50, 0.1);
        box-shadow: 3px 4px 5px -2px rgba(50, 50, 50, 0.1);
        border: 1px solid #E5E5E5;
        cursor: pointer;
    }

    .documento > div:first-child {
        width: 100%;
        height: 110px;
        background-position: center;
        background-size: cover;
        background-repeat: no-repeat;
        position: relative;
    }

    .documento > div:last-child {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(255, 255, 255, 0.8);
        display: table;
        table-layout: fixed;
        opacity: 0;
        visibility: hidden;
        transition: opacity 0.2s linear;
    }

        .documento > div:last-child > span {
            text-align: center;
            color: inherit !important;
            font-size: 12px;
            padding: 5px;
            box-sizing: border-box;
            display: table-cell;
            vertical-align: middle;
        }

            .documento > div:last-child > span > i {
                font-size: 20px;
                margin-top: 5px;
                color: #52ad84;
            }

    .documento:hover > div:last-child {
        visibility: visible;
        opacity: 1;
    }

    .documento:hover > div:first-child,
    .documento:hover > span {
        -webkit-filter: blur(3px);
        -moz-filter: blur(3px);
        -o-filter: blur(3px);
        -ms-filter: blur(3px);
        filter: blur(3px);
    }

    .documento > div > i {
        position: absolute;
        right: 0px;
        top: 0px;
        color: #009688;
        font-size: 25px;
    }

    .documento > span {
        width: 100%;
        padding: 2px;
        box-sizing: border-box;
        display: block;
        font-size: 12px;
        text-align: center;
        word-break: break-word;
    }

/**************/
.linkPaso.ui-tabs-nav > li > a {
    outline: none;
}

/***/
.locktec {
    opacity: 0.7;
}

    .locktec > span {
        z-index: 5;
        width: 100%;
        height: 100%;
        position: absolute;
        left: 0;
        top: 0;
        display: block;
        background-color: rgba(255, 255, 255, 0.5);
    }

        .locktec > span > i {
            color: #000;
            text-transform: uppercase;
            margin: auto;
            left: 0;
            top: 30px;
            right: 0;
            bottom: 0;
            position: absolute;
            height: 20px;
            width: auto;
            font-style: normal;
            -webkit-user-select: none;
            -moz-user-select: none;
            -ms-user-select: none;
            user-select: none;
        }

            .locktec > span > i:before {
                content: "\f05e";
                display: inline-block;
                font: normal normal normal 14px/1 FontAwesome;
                font-size: inherit;
                text-rendering: auto;
                -webkit-font-smoothing: antialiased;
                -moz-osx-font-smoothing: grayscale;
                left: 0;
                right: 0;
                margin: 0 auto;
                top: -30px;
                position: absolute;
                font-size: 25px;
                color: #F44336;
            }

    .locktec > div {
        -webkit-filter: blur(3px);
        -moz-filter: blur(3px);
        -o-filter: blur(3px);
        -ms-filter: blur(3px);
        filter: blur(3px);
    }

        .locktec > div > div:nth-child(n+2) > div:nth-child(n+2) > span {
            cursor: no-drop;
        }

/*Aprobar Documento Maestro*/
#infoMasterDoc > div {
    margin: 0 auto;
    width: 80%;
    position: absolute;
    background-color: #FFF;
    min-height: 300px;
    left: 0;
    right: 0;
    border-radius: 0px 0px 10px 10px;
    display: none;
}

    #infoMasterDoc > div > div {
        width: 100%;
        min-height: 100%;
        max-height: 450px;
        overflow: auto;
        padding: 0px 25px 0 25px;
        box-sizing: border-box;
        margin-bottom: 10px;
    }

#infoMasterDoc.open > div {
    border: 1px solid #DDD;
    -webkit-box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.4);
    -moz-box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.4);
    box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.4);
}

.rep-mapping .viewer > div > span.pestana-vertical {
    top: 235px;
    z-index: 99;
    -webkit-box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.4) !important;
    -moz-box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.4) !important;
    box-shadow: 3px 4px 5px 3px rgba(0, 0, 0, 0.4) !important;
    position: absolute;
    left: 0;
    right: 0;
    margin: 0;
    background-color: #fff;
    height: 100px;
    width: 30px;
    border-radius: 0px 5px 5px 0px;
    bottom: -98px;
    -webkit-box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.4);
    -moz-box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.4);
    box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.4);
    border-bottom: 2px solid #777;
    text-align: center;
    font-size: 20px;
}

    .rep-mapping .viewer > div > span.pestana-vertical i {
        line-height: 100px;
    }

#infoMasterDoc > div > span.pestaña, .marco-plantilla div > span.pestaña {
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    background-color: #fff;
    height: 30px;
    width: 100px;
    border-radius: 0px 0px 5px 5px;
    bottom: -32px;
    -webkit-box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.4);
    -moz-box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.4);
    box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.4);
    border-bottom: 2px solid #777;
    line-height: 35px;
    text-align: center;
    font-size: 20px;
}

    #infoMasterDoc > div > span.pestaña:hover, .marco-plantilla div > span.pestaña:hover, .rep-mapping .viewer > div > span.pestana-vertical:hover {
        cursor: pointer;
        border-color: #009688;
        color: #009688;
    }

#infoMasterDoc.open:before {
    content: '';
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.7);
}

.panelDetalleEventos > div {
    width: 100%;
    min-height: 80px;
    border: 1px solid #DDD;
    border-radius: 3px;
    margin-bottom: 20px;
    position: relative;
}

    .panelDetalleEventos > div > span:first-child {
        width: 100%;
        display: block;
        min-height: 25px;
        line-height: 25px;
        text-transform: uppercase;
        background-color: #888;
        color: #FFF;
        padding: 0px 10px;
        box-sizing: border-box;
    }

    .panelDetalleEventos > div > div:nth-child(2) {
        display: table;
        width: 100%;
        padding: 5px;
        box-sizing: border-box;
    }

        .panelDetalleEventos > div > div:nth-child(2) > span {
            display: table-cell;
            vertical-align: middle;
        }

            .panelDetalleEventos > div > div:nth-child(2) > span:nth-child(1) {
                width: 50px;
                height: 50px;
                background-image: url('../images/Perfil/perfil.png');
                background-position: center;
                background-size: cover;
                background-repeat: no-repeat;
                border-radius: 50%;
            }

            .panelDetalleEventos > div > div:nth-child(2) > span:nth-child(2) {
                padding: 0px 15px;
            }

            .panelDetalleEventos > div > div:nth-child(2) > span:nth-child(3) {
                text-align: center;
                font-size: 25px;
                width: 50px;
                color: #BBB;
                border-radius: 3px;
            }

    .panelDetalleEventos > div.aprobado > div:nth-child(2) > span:nth-child(3) {
        color: #04AD84;
    }

    .panelDetalleEventos > div.rechazo > div:nth-child(2) > span:nth-child(3) {
        color: #EF5350;
    }

    .panelDetalleEventos > div.aprobado > span:nth-child(1) {
        background-color: #04AD84;
    }

    .panelDetalleEventos > div.rechazo > span:nth-child(1) {
        background-color: #EF5350;
    }

    .panelDetalleEventos > div:not(.aprobado):not(.rechazo) > div:nth-child(2) > span:nth-child(3):hover {
        background-color: #04AD84;
        color: #FFF;
        cursor: pointer;
        animation-name: aprobarMD;
        animation-duration: 0.5s;
    }

    .panelDetalleEventos > div > div:nth-child(2) > span:nth-child(4) {
        text-align: center;
        font-size: 25px;
        width: 50px;
        color: #BBB;
        border-radius: 3px;
        border-color: #DDD;
        border-style: solid;
        border-width: 0px 0px 0px 1px;
    }

        .panelDetalleEventos > div > div:nth-child(2) > span:nth-child(4):hover {
            background-color: #EF5350;
            color: #FFF;
            cursor: pointer;
            animation-name: rechazarMD;
            animation-duration: 0.5s;
        }

@keyframes aprobarMD {
    from {
        background-color: #FFF;
        color: #BBB;
    }

    to {
        background-color: #04AD84;
        color: #FFF;
    }
}

@keyframes rechazarMD {
    from {
        background-color: #FFF;
        color: #BBB;
    }

    to {
        background-color: #EF5350;
        color: #FFF;
    }
}

.panelDetalleEventos > div > div:nth-child(3) {
    display: none;
    width: 100%;
    box-sizing: border-box;
    background-color: #EEE;
}

    .panelDetalleEventos > div > div:nth-child(3) > span {
        width: 100%;
        display: block;
        border-top: 1px solid #EEE;
        padding-top: 5px;
        padding-left: 1%;
        box-sizing: border-box;
        text-transform: uppercase;
        padding-bottom: 5px;
    }

    .panelDetalleEventos > div > div:nth-child(3) > textarea {
        width: 98%;
        margin-left: 1%;
        height: 40px;
        border: 1px solid #EEE;
        box-sizing: border-box;
        resize: none;
        outline: none;
    }

    .panelDetalleEventos > div > div:nth-child(3) > div {
        text-align: center;
        padding-bottom: 10px;
        padding-top: 5px;
    }

        .panelDetalleEventos > div > div:nth-child(3) > div > span:first-child {
            margin-right: 5px;
        }

.panelDetalleEventos > div.lock > span:nth-child(4) {
    /*Bloqueo*/
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 10;
    top: 0;
    left: 0;
    background-color: #000;
    opacity: 0.3;
    text-align: center;
    color: #FFF;
    font-size: 40px;
    line-height: 90px;
    border-radius: 2px;
}

.panelDetalleEventos > div:not(.lock) > span:nth-child(4) {
    display: none;
}

.panelDetalleEventos > div:not(.siguiente):before {
    content: '';
    position: absolute;
    left: -39px;
    top: 0;
    bottom: 0;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    margin: auto;
    z-index: 11;
    background-color: #DDD;
    border: 2px solid #999;
}

.siguiente:before {
    content: '';
    position: absolute;
    left: -39px;
    top: 0;
    bottom: 0;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    margin: auto;
    z-index: 11;
    background-color: #2196F3;
    border: 2px solid #999;
}

.panelDetalleEventos > div:after {
    content: '';
    position: absolute;
    left: -15px;
    width: 0px;
    height: 0px;
    top: 0;
    bottom: 0;
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent;
    border-right: 15px solid #DDD;
    margin: auto;
    z-index: 10;
}

.panelDetalleEventos {
    position: relative;
    padding-left: 15px;
    padding-bottom: 5px;
}

    .panelDetalleEventos:after {
        content: '';
        position: absolute;
        left: -15px;
        top: 0;
        width: 3px;
        height: 100%;
        background-color: #999;
    }

    .panelDetalleEventos > div > span > i.fecha {
        position: absolute;
        left: -110px;
        color: #999;
        top: 0;
        bottom: 0;
        margin: auto;
        display: block;
        width: auto;
        height: 25px;
        font-size: 12px;
        font-style: normal;
        line-height: 12px;
        text-align: center;
    }

.panelDetallesMD {
    position: relative;
    padding-top: 20px;
    padding-left: 80px;
    float: right;
    width: 100%;
    box-sizing: border-box;
}

.switch {
    width: 120px;
    height: 20px;
    border: 1px solid #DDD;
    display: inline-block;
    border-radius: 15px;
    text-decoration: none;
    color: #777;
    position: relative;
    background-color: #FFF;
}

    .switch > span:nth-child(1) {
        display: block;
        height: 20px;
        width: 100px;
        background-color: #EEE;
        text-align: center;
        line-height: 22px;
        border-radius: 10px;
        position: absolute;
        left: 0;
        top: 0;
        -webkit-box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.4);
        -moz-box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.4);
        box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.4);
        z-index: 1;
    }

    .switch > span:nth-child(2) {
        display: none;
        height: 20px;
        width: 100px;
        background-color: #EEE;
        text-align: center;
        line-height: 22px;
        border-radius: 10px;
        position: absolute;
        right: 0;
        top: 0;
        -webkit-box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.4);
        -moz-box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.4);
        box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.4);
        z-index: 1;
    }

    .switch > i {
        z-index: 0;
        display: block;
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        margin: auto;
        background-color: #2196F3;
        width: 1px;
        height: 1px;
        border-radius: 20px;
        box-sizing: border-box;
    }

.panelRegistroCambios {
    width: 100%;
}

    .panelRegistroCambios > div > div {
        width: 100%;
        border: 1px solid #E5E5E5;
        padding: 15px;
        box-sizing: border-box;
        border-radius: 3px;
        float: left;
        background-color: #F5F5F5;
        -webkit-box-shadow: 0px 5px 10px -4px rgba(0, 0, 0, 0.4);
        -moz-box-shadow: 0px 5px 10px -4px rgba(0, 0, 0, 0.4);
        box-shadow: 0px 5px 10px -4px rgba(0, 0, 0, 0.4);
        margin-bottom: 10px;
        position: relative;
    }

        .panelRegistroCambios > div > div.template {
            display: none;
        }

        .panelRegistroCambios > div > div > span.close {
            position: absolute;
            right: -1px;
            top: -1px;
            width: 45px;
            height: 25px;
            text-align: center;
            line-height: 25px;
            background-color: #EF5350;
            color: #FFF;
            font-size: 15px;
            border-radius: 0px 2px 0px 5px;
        }

            .panelRegistroCambios > div > div > span.close:hover {
                cursor: pointer;
                background-color: #E53935;
            }

        .panelRegistroCambios > div > div > div {
            padding-right: 10px;
            box-sizing: border-box;
            margin-bottom: 10px;
        }

            .panelRegistroCambios > div > div > div > textarea {
                min-height: 50px;
                resize: none;
            }

            .panelRegistroCambios > div > div > div > span {
                text-transform: uppercase;
            }

        .panelRegistroCambios > div > div:active > span {
            color: #DDD;
        }

.btnOvalado {
    min-width: 100px;
    height: 30px;
    line-height: 32px;
    padding: 0px 7px;
    box-sizing: border-box;
    border-radius: 10px;
    background-color: #FF7043;
    color: #FFF;
    text-align: center;
    float: right;
    text-transform: uppercase;
    font-size: 12px;
    text-decoration: none;
}

    .btnOvalado:hover {
        cursor: pointer;
        background-color: #FF5722;
        -webkit-box-shadow: 2px 4px 7px -2px rgba(0, 0, 0, 0.4);
        -moz-box-shadow: 2px 4px 7px -2px rgba(0, 0, 0, 0.4);
        box-shadow: 2px 4px 7px -2px rgba(0, 0, 0, 0.4);
    }


#panelDetalleRegistroCambios > div {
    width: 100%;
    border: 1px solid #DDD;
    border-radius: 3px;
    margin-bottom: 15px;
    float: right;
    position: relative;
    padding-left: 25px;
    padding-top: 31px;
    box-sizing: border-box;
    overflow: hidden;
}

    #panelDetalleRegistroCambios > div.actual {
        border-color: #607D8B;
        -webkit-box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
        -moz-box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
        box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
    }

    #panelDetalleRegistroCambios > div:not(.actual) {
        -ms-transform: scale(0.99); /* IE 9 */
        -webkit-transform: scale(0.99); /* Chrome, Safari, Opera */
        transform: scale(0.99);
    }

    #panelDetalleRegistroCambios > div > span {
        width: 100%;
        display: block;
        background-color: #F0F0F0;
        border-bottom: 1px solid #DDD;
        padding: 7px;
        text-transform: uppercase;
        padding-left: 10px;
        box-sizing: border-box;
        position: absolute;
        top: 0px;
        left: 0;
        font-weight: bold;
    }

    #panelDetalleRegistroCambios > div.actual > span {
        background-color: #607D8B;
        color: #FFF;
    }

    #panelDetalleRegistroCambios > div.actual > div {
        background-color: #ECEFF1;
    }

    #panelDetalleRegistroCambios > div > div {
        border-left: 1px solid #EEE;
        float: left;
        width: 100%;
        position: relative;
        background-color: #F7F7F7;
    }

        #panelDetalleRegistroCambios > div > div:not(:last-child) {
            border-bottom: 1px solid #EEE;
        }

        #panelDetalleRegistroCambios > div > div:not(:nth-child(2)) {
            margin-top: 7px;
            border-top: 1px solid #EEE;
        }

        #panelDetalleRegistroCambios > div > div:before {
            width: 8px;
            height: 8px;
            display: block;
            content: '';
            position: absolute;
            top: 0px;
            bottom: 0;
            margin: auto;
            left: -18px;
            background-color: #999;
            border-radius: 50%;
        }

        #panelDetalleRegistroCambios > div > div > span {
            padding: 5px;
            box-sizing: border-box;
            border-bottom: 1px solid #EEE;
        }

            #panelDetalleRegistroCambios > div > div > span:last-child {
                margin-top: 5px;
                border-bottom: none;
            }

            #panelDetalleRegistroCambios > div > div > span:nth-child(2n+2) {
                border-left: 1px solid #EEE;
            }

.btn1, .btn2 {
    display: inline-block;
    padding: 4px;
    box-sizing: border-box;
    border-radius: 3px;
    text-decoration: none;
    color: #FFF;
    background-color: #999999;
    text-align: center;
}

    .btn1:hover {
        background-color: #777777;
    }

.btn2 {
    background-color: #607D8B;
}

    .btn2:hover {
        background-color: #455A64;
    }

.shadowHover:hover {
    -webkit-box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
    -moz-box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
    box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
}

/**********************************/
.DetalleRT {
    float: left;
    width: 100%;
    background-color: #F5F5F5;
    border: 1px solid #DDD;
    margin-bottom: 10px;
    border-radius: 3px;
    overflow: hidden;
    text-transform: uppercase;
}

    .DetalleRT > span {
        background-color: #5195cc;
        color: #FFF;
        display: block;
        width: 100%;
        height: 35px;
        line-height: 35px;
        font-weight: bold;
        padding-left: 10px;
    }

    .DetalleRT > div {
        float: left;
        width: 100%;
        text-align: left;
    }

        .DetalleRT > div > span {
            padding: 5px;
            box-sizing: border-box;
        }

            .DetalleRT > div > span:nth-child(2n+1) {
                font-weight: bold;
                background-color: #EEE;
            }
/***************************/


/***************ESTILOS PLUGIN DOCUMENTOS****************/
.documento.puedeEliminar > i.EliDoc {
    position: absolute;
    left: 0;
    top: 0;
    color: #EF5350;
    border: 1px solid #EF5350;
    border-radius: 50%;
    width: 25px;
    height: 25px;
    line-height: 25px;
    text-align: center;
    font-size: 20px;
    background-color: #FFF;
    z-index: 2;
    -webkit-box-shadow: 0px 3px 5px 0px rgba(50, 50, 50, 0.4);
    -moz-box-shadow: 0px 3px 5px 0px rgba(50, 50, 50, 0.4);
    box-shadow: 0px 3px 5px 0px rgba(50, 50, 50, 0.4);
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    -ms-transition: all 0.3s linear;
    transition: all 0.3s linear;
}

.documento.puedePublicar > i.PubDoc {
    position: absolute;
    right: 0px;
    top: 0px;
    color: #888;
    width: 25px;
    height: 25px;
    line-height: 25px;
    border: 1px solid #888;
    border-radius: 50%;
    text-align: center;
    background-color: #FFF;
    font-size: 20px;
    z-index: 2;
    -webkit-box-shadow: 0px 3px 5px 0px rgba(50, 50, 50, 0.4);
    -moz-box-shadow: 0px 3px 5px 0px rgba(50, 50, 50, 0.4);
    box-shadow: 0px 3px 5px 0px rgba(50, 50, 50, 0.4);
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    -ms-transition: all 0.3s linear;
    transition: all 0.3s linear;
}

    .documento.puedePublicar > i.PubDoc.publicado {
        background-color: #009688;
        color: #FFF;
        border-color: #00776c;
    }

.panelComponenteDocumentos.accionEliminar .documento:not(.puedeEliminar),
.panelComponenteDocumentos.accionPublicar .documento:not(.puedePublicar) {
    opacity: 0.3;
    pointer-events: none;
    cursor: default;
}

.panelComponenteDocumentos.accionEliminar .documento.puedeEliminar > i.EliDoc,
.panelComponenteDocumentos.accionPublicar .documento.puedePublicar > i.PubDoc {
    opacity: 1;
    visibility: visible;
}

.panelComponenteDocumentos.accionEliminar .addDoc, .panelComponenteDocumentos.accionEliminar .pubDoc,
.panelComponenteDocumentos.accionPublicar .addDoc, .panelComponenteDocumentos.accionPublicar .delDoc {
    opacity: 0.3;
    pointer-events: none;
    cursor: default;
}

.panelComponenteDocumentos.accionEliminar > span > span > i.delDoc > i:nth-child(3),
.panelComponenteDocumentos.accionPublicar > span > span > i.pubDoc > i:nth-child(3) {
    display: inline;
}

.panelComponenteDocumentos.accionEliminar > span > span > i.delDoc > i:nth-child(2),
.panelComponenteDocumentos.accionPublicar > span > span > i.pubDoc > i:nth-child(2) {
    display: none;
}

/*************************Cargar nuevo documento*****************************/
.fileUpload {
    position: relative;
    display: table;
    overflow: hidden;
}

    .fileUpload > input:nth-child(1) {
        visibility: hidden;
        opacity: 0;
        position: absolute;
        left: 0;
        top: 0;
    }

    .fileUpload > input:nth-child(2), .fileUpload > span:nth-child(3) {
        display: table-cell;
        vertical-align: middle;
    }

    .fileUpload > input:nth-child(2) {
        width: 100%;
        border: none;
        height: 40px;
        padding: 3px;
        box-sizing: border-box;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        font-family: inherit;
        color: inherit;
        font-size: inherit;
    }

    .fileUpload > span:nth-child(3) {
        width: 90px;
        color: #FFF;
        background-color: #FF7043;
        text-align: center;
    }

    .fileUpload:hover {
        cursor: pointer;
    }

        .fileUpload:hover > span:nth-child(3) {
            background-color: #F4511E;
        }

.modalCargarDocumento, .modalCargarPresupuesto, .modalCerrarSesionAzure {
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.6s ease-in-out;
    -moz-transition: all 0.6s ease-in-out;
    -o-transition: all 0.6s ease-in-out;
    transition: all 0.6s ease-in-out;
    width: 100%;
    height: 100%;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 11;
}

    .modalCargarDocumento.open, .modalCargarPresupuesto.open, .modalCerrarSesionAzure.open {
        opacity: 1;
        visibility: visible;
    }

    .modalCargarDocumento > div, .modalCargarPresupuesto > div, .modalCerrarSesionAzure > div {
        width: 320px;
        height: 370px;
        position: fixed;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        margin: auto;
        background-color: #FFF;
        padding: 30px 20px 20px 20px;
        box-sizing: border-box;
        z-index: 1;
        border-radius: 3px;
        overflow: hidden;
        -webkit-box-shadow: 0px 5px 15px 0px rgba(50, 50, 50, 0.7);
        -moz-box-shadow: 0px 5px 15px 0px rgba(50, 50, 50, 0.7);
        box-shadow: 0px 5px 15px 0px rgba(50, 50, 50, 0.7);
        transform: scale(0.7);
        -webkit-transform: scale(0.7);
        -moz-transform: scale(0.7);
        -o-transform: scale(0.7);
        -ms-transform: scale(0.7);
        opacity: 0;
        visibility: hidden;
        -webkit-transition: all 0.6s ease-in-out;
        -moz-transition: all 0.6s ease-in-out;
        -o-transition: all 0.6s ease-in-out;
        transition: all 0.6s ease-in-out;
    }

    .modalCargarDocumentoGrande > div {
        width: 700px;
        height: 700px;
        position: fixed;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        margin: auto;
        background-color: #FFF;
        padding: 30px 20px 20px 20px;
        box-sizing: border-box;
        z-index: 1;
        border-radius: 3px;
        overflow: hidden;
        -webkit-box-shadow: 0px 5px 15px 0px rgba(50, 50, 50, 0.7);
        -moz-box-shadow: 0px 5px 15px 0px rgba(50, 50, 50, 0.7);
        box-shadow: 0px 5px 15px 0px rgba(50, 50, 50, 0.7);
        transform: scale(0.7);
        -webkit-transform: scale(0.7);
        -moz-transform: scale(0.7);
        -o-transform: scale(0.7);
        -ms-transform: scale(0.7);
        opacity: 0;
        visibility: hidden;
        -webkit-transition: all 0.6s ease-in-out;
        -moz-transition: all 0.6s ease-in-out;
        -o-transition: all 0.6s ease-in-out;
        transition: all 0.6s ease-in-out;
    }

    .modalCargarPresupuesto > div {
        height: 445px;
    }

    .modalCargarDocumento.open > div, .modalCargarPresupuesto.open > div, .modalCerrarSesionAzure.open > div {
        transform: scale(1);
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -o-transform: scale(1);
        -ms-transform: scale(1);
        opacity: 1;
        visibility: visible;
    }

    .modalCargarDocumento:before, .modalCargarPresupuesto:before, .modalCerrarSesionAzure:before {
        content: '';
        width: 100%;
        height: 100%;
        position: fixed;
        background-color: rgba(0, 0, 0, 0.7);
        z-index: 0;
        left: 0;
        top: 0;
    }

    .modalCargarDocumento > div > span.CerrarNuevoDocumento, .modalCargarPresupuesto > div > span.CerrarNuevoDocumento,
    .modalCerrarSesionAzure > div > span.CerrarNuevoDocumento {
        position: absolute;
        right: 0;
        top: 0;
        box-sizing: border-box;
        background-color: #E57373;
        border-radius: 0px 0px 0px 5px;
        background-image: url(../images/Util/close.png);
        background-position: center;
        background-size: 20px;
        background-repeat: no-repeat;
        width: 45px;
        height: 30px;
    }

        .modalCargarDocumento > div > span.CerrarNuevoDocumento:hover, .modalCargarPresupuesto > div > span.CerrarNuevoDocumento:hover,
        .modalCerrarSesionAzure > div > span.CerrarNuevoDocumento:hover {
            background-color: #F44336;
            cursor: pointer;
        }

    .modalCargarDocumento > div > div.detalleOS, .modalCerrarSesionAzure > div > div.detalleOS,
    .modalCerrarSesionAzure > div > div.detalleOS {
        background-color: #F2F2F2;
        padding: 7px;
        box-sizing: border-box;
        margin-bottom: 15px;
        text-transform: uppercase;
    }

    .modalCargarDocumento .validador, .modalCargarPresupuesto .validador, .formulario .validador,
    .modalCerrarSesionAzure .validador {
        float: right;
        color: #F44336;
        font-style: normal;
        position: relative;
        display: none;
    }

        .modalCargarDocumento .validador:before, .modalCargarPresupuesto .validador:before, .formulario .validador:before,
        .modalCerrarSesionAzure .validador:before {
            content: "\f069";
            width: 10px;
            height: 10px;
            display: inline-block;
            font: normal normal normal 14px/1 FontAwesome;
            font-size: inherit;
            text-rendering: auto;
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
            position: absolute;
            left: -10px;
            font-size: 10px;
        }

/***************************************************************************/
/**********************TimeLine Eventos OS**********************************/
.panelEventosOS > div {
    text-align: center;
}

    .panelEventosOS > div > div {
        text-align: left;
        display: inline-table;
        width: auto;
        -webkit-transition: all 0.6s ease-in-out;
        -moz-transition: all 0.6s ease-in-out;
        -o-transition: all 0.6s ease-in-out;
        -ms-transition: all 0.6s ease-in-out;
        transition: all 0.6s ease-in-out;
        left: -30px;
        position: relative;
        opacity: 0;
        visibility: hidden;
    }

    .panelEventosOS > div.anima > div {
        left: 0px;
        opacity: 1;
        visibility: visible;
    }

    .panelEventosOS > div > div > div {
        display: table-cell;
        vertical-align: middle;
        position: relative;
        box-sizing: border-box;
    }

        .panelEventosOS > div > div > div:last-child {
            padding: 15px;
        }

        .panelEventosOS > div > div > div:first-child {
            padding-right: 20px;
            padding-left: 10px;
            text-align: right;
        }

            .panelEventosOS > div > div > div:first-child > span {
                width: 50px;
                height: 50px;
                display: inline-block;
                border-radius: 50%;
                background-position: center;
                background-size: cover;
                background-repeat: no-repeat;
                position: relative;
                z-index: 1;
                border: 1.5px solid #d5d5d5;
                box-sizing: border-box;
            }

        .panelEventosOS > div > div > div:last-child > div {
            width: 450px;
            height: 140px;
            border: 1px solid #E5E5E5;
            padding: 10px;
            box-sizing: border-box;
            padding-top: 60px;
            position: relative;
            -webkit-box-shadow: 3px 4px 5px -2px rgba(50, 50, 50, 0.1);
            -moz-box-shadow: 3px 4px 5px -2px rgba(50, 50, 50, 0.1);
            box-shadow: 3px 4px 5px -2px rgba(50, 50, 50, 0.1));
            border-left: 3px solid #666;
            -webkit-transition: all 0.6s ease-in-out;
            -moz-transition: all 0.6s ease-in-out;
            -o-transition: all 0.6s ease-in-out;
            -ms-transition: all 0.6s ease-in-out;
            transition: all 0.6s ease-in-out;
            left: 100px;
        }

    .panelEventosOS > div.anima > div > div:last-child > div {
        left: 0px;
    }

    .panelEventosOS > div > div > div:last-child > div > i:first-child {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 45px;
        display: table;
        padding-left: 10px;
        padding-top: 10px;
        padding-right: 10px;
        box-sizing: border-box;
        font-style: normal;
        border-bottom: 1px solid #DDD;
    }

        .panelEventosOS > div > div > div:last-child > div > i:first-child > i {
            float: right;
            color: #FFA000;
            font-size: 15px;
        }

        .panelEventosOS > div > div > div:last-child > div > i:first-child > dia,
        .panelEventosOS > div > div > div:last-child > div > i:first-child > fecha {
            display: table-cell;
            vertical-align: middle;
        }

            .panelEventosOS > div > div > div:last-child > div > i:first-child > fecha > mes,
            .panelEventosOS > div > div > div:last-child > div > i:first-child > fecha > año {
                width: 100%;
                float: left;
            }

            .panelEventosOS > div > div > div:last-child > div > i:first-child > fecha > mes {
                font-weight: bold;
                font-size: 17px;
            }

        .panelEventosOS > div > div > div:last-child > div > i:first-child > dia {
            font-size: 30px;
            width: 50px;
            text-align: center;
            font-weight: bold;
        }

    .panelEventosOS > div:not(:first-child) > div > div:first-child:before {
        content: "";
        position: absolute;
        width: 2px;
        height: 50%;
        top: 0;
        right: 45px;
        background: #d5d5d5;
        z-index: 0;
    }

    .panelEventosOS > div:not(:last-child) > div > div:first-child:after {
        content: "";
        position: absolute;
        width: 2px;
        height: 50%;
        bottom: 0;
        right: 45px;
        background: #d5d5d5;
        z-index: 0;
    }

    .panelEventosOS > div > div > div:last-child > div:before {
        content: "";
        position: absolute;
        top: 0px;
        bottom: 0;
        left: -17px;
        margin: auto;
        z-index: 0;
        width: 0px;
        height: 0px;
        border-right: 15px solid #666;
        border-top: 8px solid transparent;
        border-bottom: 8px solid transparent;
    }

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

    .panelContactosOS > table {
        width: 100%;
        max-width: 1280px;
        left: 0;
        right: 0;
        margin: 0 auto;
    }

        .panelContactosOS > table tr td:last-child > i {
            width: 100%;
            display: inline-block;
            font-style: normal;
        }

            .panelContactosOS > table tr td:last-child > i:not(:first-child) {
                margin-top: 3px;
            }

        .panelContactosOS > table tr {
            cursor: default;
        }

            .panelContactosOS > table tr.trResumen .verMas {
                display: none;
            }

            .panelContactosOS > table tr.trResumen span > i {
                display: inline-block;
                width: 100%;
                position: relative;
                height: 20px;
            }

                .panelContactosOS > table tr.trResumen span > i:before {
                    content: "\f111";
                    display: inline-block;
                    font: normal normal normal 14px/1 FontAwesome;
                    font-size: inherit;
                    text-rendering: auto;
                    -webkit-font-smoothing: antialiased;
                    -moz-osx-font-smoothing: grayscale;
                    font-size: 7px;
                    position: relative;
                    bottom: 3px;
                }

.control:focus, .dropDown:focus, .chosen-container-active, .btn:focus {
    outline: 1px solid #999;
}

.formulario > .panelPequeño, .formulario > .panelMedio > .panelGrande, .formulario > .panelMedio, .formulario > .panelGrande > .panelPequeño,
.formulario > .panel-control > .panelPequeño {
    padding: 5px;
    box-sizing: border-box;
    position: relative;
    padding-bottom: 25px;
    height: 65px;
}

.formulario .control, .formulario .dropDown, .formulario .chosen-container > .chosen-single {
    -webkit-transition: background-color 0.2s ease-in-out;
    -moz-transition: background-color 0.2s ease-in-out;
    -o-transition: background-color 0.2s ease-in-out;
    -ms-transition: background-color 0.2s ease-in-out;
    transition: background-color 0.2s ease-in-out;
    background-color: #FFF;
}

.formulario .control, .formulario .dropDown, .formulario .chosen-container {
    color: #888;
}

    .formulario .control + span:not(.fa), .formulario .dropDown + span:not(.fa), .formulario .chosen-container + span:not(.fa), .tboxGroup + span {
        position: absolute;
        left: 5px;
        top: -12px;
        color: #333;
        text-transform: uppercase;
        -webkit-transition: all 0.2s ease-in-out;
        -moz-transition: all 0.2s ease-in-out;
        -o-transition: all 0.2s ease-in-out;
        -ms-transition: all 0.2s ease-in-out;
        transition: all 0.2s ease-in-out;
    }

    .labelForm {
        position: absolute;
        left: 5px;
        top: -12px;
        color: #333;
        text-transform: uppercase;
        -webkit-transition: all 0.2s ease-in-out;
        -moz-transition: all 0.2s ease-in-out;
        -o-transition: all 0.2s ease-in-out;
        -ms-transition: all 0.2s ease-in-out;
        transition: all 0.2s ease-in-out;
    }

    .formulario .control:focus + span, .formulario .dropDown:focus + span, .formulario .chosen-container.chosen-container-active + span, .tboxGroup:focus + span {
        color: #009688;
    }

    .formulario .control:focus, .formulario .dropDown:focus, .formulario .chosen-container.chosen-container-active > .chosen-single {
        /*background-color: #f5f6f9 !important;*/
    }

.formulario .importante {
    position: absolute;
    right: 15px;
    top: 0px;
    color: #f99;
    font-size: 10px;
    margin-top: 10px;
}
/**************************************************************************/
.panelOS > .ui-tabs-nav {
    background: none;
    border: none;
    border-bottom: 1px solid #DDD;
    margin-bottom: 20px !Important;
}

    .panelOS > .ui-tabs-nav > li {
        border-radius: 5px 5px 0px 0px;
        background: #E3E3E3;
    }

    .panelOS > .ui-tabs-nav > .ui-state-active, panelOS > .ui-tabs-nav > .ui-widget-content .ui-state-active, panelOS > .ui-tabs-nav > .ui-widget-header .ui-state-active {
        border-color: #DDD;
        background: #FFF;
        font-weight: normal;
        color: #777;
        -webkit-box-shadow: 2px -1px 1px 0px rgba(50, 50, 50, 0.2);
        -moz-box-shadow: 2px -1px 1px 0px rgba(50, 50, 50, 0.2);
        box-shadow: 2px -1px 1px 0px rgba(50, 50, 50, 0.2);
    }

    .panelOS > .ui-tabs-nav .ui-state-default a, .panelOS > .ui-tabs-nav .ui-state-default a:link, .panelOS > .ui-tabs-nav .ui-state-default a:visited {
        color: #555;
        font-weight: normal;
        outline: none;
    }

    .panelOS > .ui-tabs-nav .ui-state-active a, .panelOS > .ui-tabs-nav .ui-state-active a:link, .panelOS > .ui-tabs-nav .ui-state-active a:visited {
        color: #04AD84;
    }

    .panelOS > .ui-tabs-nav > li:first-child {
        margin-left: 15px;
    }

.panelGaleriaReso {
    width: 100%;
    border-width: 1px;
    border-style: solid;
    border-color: #DDD;
    margin-top: 5px;
    margin-bottom: 15px;
    border-radius: 3px;
    min-height: 140px;
    float: left;
}

    .panelGaleriaReso > span:first-child {
        width: 100%;
        min-height: 25px;
        padding: 10px;
        background-color: #DDD;
        display: block;
        color: #555;
        box-sizing: border-box;
        text-transform: uppercase;
        position: relative;
    }
/**************************************************************************/
.panelComponente {
    width: 48%;
    margin: 1%;
    display: block;
    float: left;
    border: 1px solid #DDD;
    box-sizing: border-box;
    border-radius: 3px;
    min-height: 300px;
    text-decoration: none;
    position: relative;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}

    .panelComponente:hover {
        -webkit-box-shadow: 0px 5px 15px -2px rgba(50, 50, 50, 0.1);
        -moz-box-shadow: 0px 5px 15px -2px rgba(50, 50, 50, 0.1);
        box-shadow: 0px 5px 15px -2px rgba(50, 50, 50, 0.1);
    }

    .panelComponente > span:first-child {
        width: 100%;
        display: inline-block;
        font-size: 20px;
        padding: 10px 80px 10px 10px;
        box-sizing: border-box;
        font-family: "Lato-Light", sans-serif, Arial;
        background-color: #F5F5F5;
        border-bottom: 1px solid #009688;
        position: relative;
    }

h1, h2, h3, h4, h5 {
    font-weight: normal;
    font-family: "Lato-Light", sans-serif, Arial;
}

.panelComponente > span:first-child > i {
    position: absolute;
    right: 0px;
    top: 0px;
    bottom: 0px;
    margin: auto 0;
    height: 22px;
    font-size: 22px;
    display: inline-block;
    padding: 6px;
}

    .panelComponente > span:first-child > i:hover {
        color: #1976D2;
        cursor: pointer;
    }

.panelComponente > div {
    padding: 10px;
}

    .panelComponente > div > span {
        width: 100%;
        display: table;
        padding: 4px;
    }

        .panelComponente > div > span > i {
            width: 150px;
            display: table-cell;
            font-style: normal;
            vertical-align: top;
            position: relative;
            padding-right: 15px;
        }

            .panelComponente > div > span > i > i {
                padding-right: 5px;
                position: absolute;
                top: 0px;
                right: 0px;
            }

        .panelComponente > div > span > span {
            width: -moz-calc(100% - 150px);
            width: -webkit-calc(100% - 150px);
            width: calc(100% -150px);
            display: table-cell;
            vertical-align: top;
        }


/**************************************************************************/
.formFlotante {
    width: 100%;
    height: 100%;
    position: fixed;
    left: 0px;
    top: 0px;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
    z-index: 20;
}

    .formFlotante.sinAnimacion {
        -webkit-transition: none;
        -moz-transition: none;
        -o-transition: none;
        -ms-transition: none;
        transition: none;
    }

    .formFlotante.open {
        visibility: visible;
        opacity: 1;
    }

        .formFlotante.open > div {
            top: 0px;
        }

    .formFlotante > div {
        width: 700px;
        height: 620px;
        box-sizing: border-box;
        background-color: #FFF;
        position: absolute;
        left: 0;
        right: 0;
        margin: auto;
        top: 300px;
        bottom: 0;
        z-index: 21;
        border-radius: 3px;
        -webkit-box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.4);
        -moz-box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.4);
        box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.4);
        padding: 15px;
        padding-top: 45px;
        -webkit-transition: all 0.4s ease-in-out;
        -moz-transition: all 0.4s ease-in-out;
        -o-transition: all 0.4s ease-in-out;
        -ms-transition: all 0.4s ease-in-out;
        transition: all 0.4s ease-in-out;
    }

    .formFlotante.sinAnimacion > div {
        -webkit-transition: none;
        -moz-transition: none;
        -o-transition: none;
        -ms-transition: none;
        transition: none;
    }

    .formFlotante:before {
        width: 100%;
        height: 100%;
        position: absolute;
        background-color: rgba(0, 0, 0, 0.8);
        z-index: 0;
        content: "";
    }

    .formFlotante > div > i.Cerrar {
        width: 50px;
        height: 30px;
        background-color: #EF5350;
        display: inline-block;
        position: absolute;
        right: 0;
        top: 0;
        border-radius: 0px 3px 0px 5px;
        color: #FFF;
        background-image: url(../../images/Util/close.png);
        background-size: 20px;
        background-position: center;
        background-repeat: no-repeat;
        cursor: pointer;
        z-index: 2;
    }

        .formFlotante > div > i.Cerrar:hover {
            background-color: #D32F2F;
        }

/****************************************************************************/

@media (min-width:1600px) {
    html, body {
        font-size: 16px;
    }

    .ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button {
        font-size: 16px !important;
    }

    .controlPequeño, .controlMedio1, .controlMedio2, .controlGrande, .chosen-container {
        height: 50px;
    }

    .chosen-container-single .chosen-single {
        height: 50px !important;
    }

    .chosen-container-single .chosen-single {
        line-height: 35px !important;
        font-size: inherit !important;
    }

    .controlPequeño {
        width: 25%;
        font-size: 16px;
        font-family: "Lato-Regular", sans-serif, Arial;
    }

    .controlMedio1 {
        width: 40%;
        font-size: 16px;
        font-family: "Lato-Regular", sans-serif, Arial;
    }

    .controlMedio2 {
        width: 60%;
        font-size: 16px;
        font-family: "Lato-Regular", sans-serif, Arial;
    }

    .controlGrande {
        width: 100%;
        font-size: 16px;
        font-family: "Lato-Regular", sans-serif, Arial;
    }

    .panelPequeño {
        width: 25%;
    }

    .panelMedio {
        width: 50%;
    }

    .panelMedio2 {
        width: 70%;
    }

    .panelMG {
        width: 75%;
    }

    .panelGrande {
        width: 100%;
    }

    .contenedor {
        padding-top: 80px;
    }

    .overflowContenedorIzq {
        width: 310px;
    }

    .contenedorIzq {
        width: 310px;
        position: relative;
        z-index: 4;
        padding-top: 40px;
    }

    .contenedorDer {
        position: absolute;
        width: 100%;
        left: 0px;
        padding-left: 310px;
        padding-top: 165px;
        box-sizing: border-box;
    }

    .actividad {
        width: 300px;
        height: 80px;
        padding: 10px;
        font-size: 14px;
    }

    .cabeceraSuperior {
        min-height: 70px;
        padding: 10px;
    }

    .contentMaster {
        border-top: 90px solid transparent;
        margin-top: -20px;
    }

    .notificacion {
        font-size: 25px;
    }

        .notificacion > .badge {
            top: -10px;
            right: -10px;
        }

    .contenedorIzq > div {
        left: 0px !Important;
    }

    .panelPasoPaso .navegador:first-child {
        display: block;
        left: 310px;
    }

    .actividad:hover:before {
        width: 3px;
        height: 100%;
        background-color: #AAA;
        position: absolute;
        right: 0;
        top: 0;
    }

    .actividad.terminado:hover {
        border-right: 1px solid #DDD;
        background-color: #0086D4 !Important;
    }

    .actividad.pausado:hover {
        border-right: 1px solid #DDD;
        background-color: #C79200 !Important;
    }

    .actividad.ejecucion:hover {
        border-right: 1px solid #DDD;
        background-color: #008C6A !Important;
    }

    .btnMenuMovil > div {
        display: none;
    }

    .menuMovil {
        display: block !important;
    }

    .panelContador {
        min-height: 70px;
    }

    .contador {
        height: 60px;
        min-width: 60px;
        padding: 3px 18px 0px 18px;
        line-height: 60px;
        font-size: 25px;
    }

    .panelPasoPaso {
        height: 70px;
        margin-top: 20px;
        border-left: 310px solid #FFF;
    }

    .paso {
        width: 300px;
        height: 70px;
    }

        .paso > span {
            font-size: 14px !Important;
        }

    .panelPasoPaso > .panelPaso {
        border-left: 70px solid transparent;
    }

    .navegador {
        width: 70px;
        height: 70px;
        padding: 10px;
    }

    .contenedorDer #izquierdo {
        left: 310px;
        top: 80px;
        z-index: 2;
        display: block;
    }

    .contenedorDer #derecho {
        right: 0px;
        top: 80px;
        z-index: 2;
        display: block;
    }

    .PaddingNavegador {
        width: 70px;
        height: 70px;
        display: table;
    }

    .badge {
        min-width: 17px;
        min-height: 17px;
        line-height: 17px;
    }

    .tabsPaso {
        border-right: 70px solid #FFF !important;
        box-sizing: border-box;
    }

        .tabsPaso > div {
            width: 100%;
        }

    .linkPaso.ui-tabs-nav {
        margin-right: -70px !important;
        width: 70px;
        top: -1px;
    }

        .linkPaso.ui-tabs-nav > li {
            width: 70px;
            height: 70px;
            margin: 0px !Important;
        }

            .linkPaso.ui-tabs-nav > li > a {
                font-size: 35px;
                padding: 15px 15px 15px 15px !important;
            }

            .linkPaso.ui-tabs-nav > li.ui-tabs-active {
                border-left: none;
                -webkit-box-shadow: 2px 0px 1px 0px rgba(50, 50, 50, 0.2);
                -moz-box-shadow: 2px 0px 1px 0px rgba(50, 50, 50, 0.2);
                box-shadow: 2px 0px 1px 0px rgba(50, 50, 50, 0.2);
                left: -1px;
            }

                .linkPaso.ui-tabs-nav > li:nth-child(5), .linkPaso.ui-tabs-nav > li.ui-tabs-active:nth-child(5) {
                    margin-bottom: 60px !important;
                }

    .ui-dialog {
        width: 450px !Important;
        font-size: 16px !Important;
    }

        .ui-dialog > .ui-dialog-titlebar {
            font-size: 16px !important;
            height: 35px;
            line-height: 35px;
        }

    #contenidoModal {
        min-height: 150px;
    }

    .dialog-footer {
        height: 60px;
    }

    .cerrarModal {
        height: 35px;
        line-height: 35px;
        font-size: 16px;
        margin-top: 12px;
    }

    .descripcion {
        font-size: 25px;
    }

    /****************Reproductor video*****************/
    .reproductorVideo > video {
        display: table-cell;
        border-right: 180px solid transparent;
    }

    .reproductorVideo > div {
        display: block;
        width: 180px;
        float: left;
        position: absolute;
        right: 0px;
        top: 10px;
        padding-bottom: 20px;
    }

    .galeriaVideo {
        padding-left: 10px;
        padding-right: 10px;
    }

        .galeriaVideo li {
            height: 130px;
        }

            .galeriaVideo li > div {
                display: block;
            }

                .galeriaVideo li > div > img {
                    width: 100%;
                    display: block;
                    margin-bottom: 5px;
                }

                .galeriaVideo li > div > div {
                    padding-left: 0px;
                    display: block;
                    white-space: nowrap;
                }

                .galeriaVideo li > div > span {
                    top: 22px;
                    left: auto;
                    right: 55px;
                    width: 35px;
                    height: 35px;
                    line-height: 35px;
                    font-size: 35px;
                }

    /*****************************************/
    .logo {
        height: 35px;
        width: 292.5px;
    }

    .btnMenuMovilMaster > div {
        height: 40px;
        width: 40px;
        font-size: 40px;
    }

    .panel30 > div:last-child {
        display: block !Important;
    }

    .navegadorVertical {
        width: 300px;
        height: 40px;
        font-size: 30px;
    }

    .bloqueoPasos {
        border-left: 310px solid transparent;
        border-top: 80px solid transparent;
    }

    .botoneraContinuar {
        width: 400px;
        min-height: 170px;
        min-height: -85px;
    }

    .cerrarBloqueoPasos {
        width: 60px;
        height: 40px;
        margin-top: -40px;
        font-size: 30px;
    }

    #tituloActividad {
        min-height: 70px;
    }

    .overlay {
        border-top: 80px solid transparent;
        border-left: 310px solid transparent;
    }

    .badge-rect {
        min-width: 30px;
    }

    .INF {
        top: 35px;
    }

    .infoUser {
        height: 50px;
        line-height: 35px;
    }

        .infoUser > div {
            line-height: 50px;
        }

        .infoUser + .opcionesUsuario {
            top: 70px;
            width: 180px;
        }

        .infoUser > .perfil {
            width: 45px;
            height: 45px;
        }

    .timer {
        width: 130px;
        height: 60px;
        line-height: 40px;
    }

    .esquinaCheck {
        border-bottom: 45px solid transparent;
        border-right: 45px solid #5C66AD;
    }

    .esquinaCheckOtroUsuario {
        border-right: 45px solid #777;
    }

    .esquinaTarea {
        border-bottom: 40px solid transparent;
        border-right: 40px solid #066CA7;
    }

    @-moz-document url-prefix() {
        .overflowContenedorIzq {
            height: 90vh;
            overflow-x: hidden;
        }

        .contenedorIzq {
            width: 310px;
            overflow-x: hidden;
        }
    }

    .galeriaReso > a > div:first-child {
        width: 100%;
        height: 250px;
    }

    .galeriaReso > a, .tarjetaReso, .tarjetaFondoDifuminado {
        width: 18%;
        margin: 1%;
        height: 250px;
    }

    .osAprobacionInterna {
        width: 14.66%;
        margin: 1%;
    }

    .esquinaImgRT {
        border-bottom: 60px solid transparent;
        border-left: 60px solid #FF5722;
    }

    .textEsquinaImgRT {
        padding-left: 7px;
        padding-top: 10px;
        font-size: 20px;
    }

    #panelEtapasImagen > select {
        width: 250px;
        height: 60px;
    }

    .preview > div > div:first-child {
        width: 80px;
        height: 80px;
    }

    .preview > div > div:nth-child(2) {
        padding: 1px 70px 1px 5px;
        font-size: inherit;
    }

        .preview > div > div:nth-child(2) > input {
            height: 80px;
        }

    .preview > div .deletePreview {
        line-height: 80px;
        width: 70px;
        font-size: 30px;
    }

    .btn {
        min-width: 150px;
        min-height: 50px;
        line-height: 35px;
    }

    .galeriaReso > a > div:nth-child(4), .galeriaReso > a > div:nth-child(3) {
        width: 50px;
        height: 50px;
        line-height: 50px;
        font-size: 40px;
    }

    .closePCI {
        width: 50px;
        height: 50px;
    }

    .opcionesGaleria .btnCirRojo, .opcionesGaleria .btnSelectRT,
    .opcionesGaleria .bntCirVerde, .opcionesGaleria .bntGenerarInformeTecnico,
    opcionesGaleria .btnGenerar, .opcionesGaleria > .btnEditFoto, .opcionesGaleria .btnAddFoto,
    .fa.btnPrint {
        width: 60px;
        height: 60px;
        font-size: 30px;
        line-height: 60px;
    }

    .opcionesGaleria .btnSelectRT {
        right: 70px;
    }

    .btnAddImg {
        width: 60px;
        height: 60px;
    }

        .btnAddImg > div:before {
            line-height: 63px;
            font-size: 30px;
            top: auto;
        }

    .opcionesGaleria {
        min-height: 80px;
        width: 210px;
    }

    .panelCargarImagenes {
        width: 80px;
        height: 80px;
        right: 130px;
    }

    .btnAddImg > div > div {
        width: 30px;
        height: 30px;
        font-size: 30px;
    }

    .galeriaReso > a:hover, .panelCargarImagenesValidador > div > div > a:hover {
        -ms-transform: scale(1.1,1.1); /* IE 9 */
        -webkit-transform: scale(1.1,1.1); /* Chrome, Safari, Opera */
        transform: scale(1.1,1.1);
        -webkit-box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.21), 0 16px 28px 0 rgba(0, 0, 0, 0.22);
        -moz-box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.21), 0 16px 28px 0 rgba(0, 0, 0, 0.22);
        box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.21), 0 16px 28px 0 rgba(0, 0, 0, 0.22);
        z-index: 1;
    }

    .galeriaReso > a:not(.selectedEDI):hover > div:first-child,
    .panelCargarImagenesValidador > div > div > a:not(.selectedEDI):hover > div:first-child {
        filter: brightness(1.3);
        -webkit-filter: brightness(1.3);
    }

    .tarjetaReso:hover {
        -ms-transform: scale(1.1,1.1); /* IE 9 */
        -webkit-transform: scale(1.1,1.1); /* Chrome, Safari, Opera */
        transform: scale(1.1,1.1);
        -webkit-box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.21), 0 16px 28px 0 rgba(0, 0, 0, 0.22);
        -moz-box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.21), 0 16px 28px 0 rgba(0, 0, 0, 0.22);
        box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.21), 0 16px 28px 0 rgba(0, 0, 0, 0.22);
        z-index: 1;
    }

    .tarjetaControlTecnico:hover {
        -webkit-box-shadow: 0 20px 30px 0 rgba(0, 0, 0, 0.1), 0 10px 20px 0 rgba(0, 0, 0, 0.1);
        -moz-box-shadow: 0 20px 30px 0 rgba(0, 0, 0, 0.1), 0 10px 20px 0 rgba(0, 0, 0, 0.1);
        box-shadow: 0 20px 30px 0 rgba(0, 0, 0, 0.1), 0 10px 20px 0 rgba(0, 0, 0, 0.1);
    }

    .btnCircular {
        line-height: 60px;
        width: 60px;
        height: 60px;
    }

    .panelCheckOpciones, .botoneraInforme div {
        line-height: 60px;
    }

    nav {
        padding-top: 70px;
    }

    .panelCentral.opcionesGaleria {
        width: 90%;
    }

    .tboxGroup > span {
        width: 50px;
        font-size: 30px;
    }

    .panelInformacion span:nth-child(4n+1) {
        clear: both;
    }

    .activarPanelesLaterales {
        display: none;
    }

    .panelAsignacionCentral > div:first-child {
        height: 150px;
    }

    .panelAsignacionCentral > div:last-child {
        top: -150px;
        border-top: 150px solid transparent;
    }

    .panelOSLeft > div:first-child {
        height: 135px;
    }

    .panelAsignacion > .panelOSLeft > .panelOS, .panelLeft > .panelContentAside {
        border-top: 135px solid transparent;
    }

    .panelAsignacion > .panelTecnicoRight .panelTecnico {
        border-top: 75px solid transparent;
    }

    .panelAsignacion > .panelTecnicoRight, .panelAsignacion > .panelOSLeft, .panelLeft {
        width: 240px;
    }

    .panelAsignacionCentral, .panelContentSection.panelCenter {
        padding-left: 240px;
        padding-right: 240px;
    }

    .tarjetaTecnico {
        height: 70px;
    }

        .tarjetaTecnico > div:first-child {
            width: 60px;
        }

            .tarjetaTecnico > div:first-child div {
                width: 50px;
                height: 50px;
            }

    .tablaAsignacion .tablaAsignacion > div:last-child > div > div > span:first-child {
        width: 70px;
        height: 70px;
        font-size: 45px;
    }

    .asignada + .dragAndCloneAsignacion > .tarjetaTecnico, .porAsignar + .dragAndCloneAsignacion > .tarjetaTecnico,
    .tablaAsignacion .tablaAsignacion > div:last-child > div > div > .tarjetaTecnico.tecnicoAsignado {
        width: 270px !important;
    }

    .tarjetaTecnico > div:last-child {
        width: 40px !important;
    }

        .tarjetaTecnico > div:last-child > span {
            width: 35px;
            height: 35px;
            font-size: 22px;
            padding: 6px;
        }

    .tarjetaTecnico > span {
        height: 70px;
        width: 260px;
    }

        .tarjetaTecnico > span > select {
            width: 170px;
            margin-top: 5px;
        }

        .tarjetaTecnico > span > .btnAceptarPorcentaje {
            height: 50px;
            margin-top: 5px;
            width: 40px;
            font-size: 30px;
            padding: 10px 5px;
        }

    .tarjetaTecnico > div:nth-child(2) > i {
        font-size: 15px;
    }

    .tablaAsignacion .tablaAsignacion > div:last-child > div > span {
        height: 50px;
        padding: 10px;
    }

    .tablaAsignacion .tablaAsignacion > div:last-child > div > div {
        min-height: 170px;
    }

    .tablaAsignacion > div:first-child {
        font-size: 15px;
    }

    .redo > i:last-child {
        right: 30px;
    }

    .tarjetaControlTecnico {
        width: 23%;
        margin: 1%;
        height: 300px;
    }

        .tarjetaControlTecnico > div:nth-child(3) {
            height: 75px;
        }

    .formulario > .panelPequeño, .formulario > .panelMedio > .panelGrande, .formulario > .panelMedio {
        height: 80px;
    }

    
    .panelComponenteDocumentos > span {
        min-height: 45px;
    }

        .panelComponenteDocumentos > span > span > i {
            font-size: 16px;
            padding: 5px 5px 1px 5px;
        }

    .fileUpload > span:nth-child(3) {
        font-size: 17px;
    }

    .actividad > .panelEditActividad > textarea, .paso > .panelEditPaso > textarea {
        width: -moz-calc(100% - 50px);
        width: -webkit-calc(100% - 50px);
        width: -o-calc(100% - 50px);
        width: calc(100% - 50px);
    }

    .actividad > .panelEditActividad > span, .paso > .panelEditPaso > span {
        width: 50px;
    }

    .formFlotante > div {
        width: 850px;
        height: 745px;
    }

    .modalCargarDocumento > div, .modalCerrarSesionAzure > div {
        width: 400px;
    }

        .modalCargarDocumento > div > span.CerrarNuevoDocumento, .modalCerrarSesionAzure > div > span.CerrarNuevoDocumento {
            width: 70px;
            height: 40px;
        }

    .ui-tabs .ui-tabs-nav li {
        font-size: 15px;
    }

    .panelGaleriaReso > span:first-child {
        font-size: 15px;
    }

    .panelComponenteDocumentos > span {
        font-size: 15px;
    }

    .galeriaReso > a > div:first-child:after, .panelCargarImagenesValidador > div > div > a > div:first-child:after {
        height: 70px;
    }

    .galeriaReso > a > div:nth-child(2), .panelCargarImagenesValidador > div > div > a > div:nth-child(2) {
        height: 70px;
        font-size: 15px;
    }

    .documento {
        width: 120px !important;
        height: 175px !important;
    }

    .documento, .maestroDocumentosTecnicos > a {
        width: 140px !important;
        height: 170px !important;
    }

        .documento > div:first-child {
            height: 125px;
        }

    .nombreMD {
        height: 50px !important;
        width: 300px !important;
        left: -305px !important;
        font-size: 15px !important;
        line-height: 15px !important;
    }

    .listadoGruposOS {
        height: 160px !important;
    }

    .listadoGrupos {
        height: 230px !important;
    }

    .formularioAgrupador #paso1 {
        height: 350px;
    }

    .formularioAgrupador #paso2 {
        height: -moz-calc(100% - 350px);
        height: -webkit-calc(100% - 350px);
        height: calc(100% -350px);
    }

    .formFlotante.formPequeño > div {
        width: 550px;
        height: 400px;
    }

    #buscadorAgregarOsGrupo .listadoGruposOS {
        height: 230px !important;
    }

    .modalCargarPresupuesto > div {
        height: 490px;
    }

    #panelInicioProcesoDespacho > div > div:nth-child(2),
    #panelDetalleComponentes > div.panelDetalleRecepcion > div:nth-child(2) {
        min-height: -moz-calc(100% - 240px);
        min-height: -webkit-calc(100% - 240px);
        min-height: calc(100% -240px);
    }

        #panelInicioProcesoDespacho > div > div:nth-child(2) > div {
            font-size: 13px;
        }

    .fileUpload > input:nth-child(2) {
        height: 50px;
        padding: 0px;
    }

    .presupuestor3 > div > div > div:last-child > span .panelEditarOC {
        width: 340px !important;
        height: 170px !important;
    }
}

@media (max-width:1599px) {
    .listadoGruposOS {
        height: 140px !important;
    }

    .listadoGrupos {
        height: 225px !important;
    }

    .formularioAgrupador #paso1 {
        height: 280px;
    }

    .formularioAgrupador #paso2 {
        height: -moz-calc(100% - 280px);
        height: -webkit-calc(100% - 280px);
        height: calc(100% -280px);
    }

    #panelInicioProcesoDespacho > div > div:nth-child(2),
    #panelDetalleComponentes > div.panelDetalleRecepcion > div:nth-child(2) {
        min-height: -moz-calc(100% - 210px);
        min-height: -webkit-calc(100% - 210px);
        min-height: calc(100% -210px);
    }
}

@media (min-width: 1024px) and (max-width:1599px) {
    .controlPequeño {
        width: 25%;
    }

    .controlMedio1 {
        width: 40%;
    }

    .controlMedio2 {
        width: 60%;
    }

    .controlGrande {
        width: 100%;
    }

    .panelPequeño {
        width: 25%;
    }

    .panelMedio {
        width: 50%;
    }

    .panelMedio2 {
        width: 70%;
    }

    .panelMG {
        width: 75%;
    }

    .panelGrande {
        width: 100%;
    }

    .contenedorIzq {
        position: absolute;
        z-index: 4;
    }

        .contenedorIzq > div {
            left: 0px !Important;
        }


    .contenedorDer {
        width: 100%;
        left: 0px;
        padding-left: 190px;
        box-sizing: border-box;
        height: 100%;
        margin: 0px;
    }

        .contenedorDer #izquierdo {
            left: 190px;
            top: 60px;
            z-index: 2;
            display: block;
        }

        .contenedorDer #derecho {
            right: 0px;
            top: 60px;
            z-index: 2;
            display: block;
        }

    .actividad:hover:before {
        width: 3px;
        height: 100%;
        background-color: #AAA;
        position: absolute;
        right: 0;
        top: 0;
    }

    .actividad.terminado:hover {
        border-right: 1px solid #DDD;
        background-color: #0086D4 !Important;
    }

    .actividad.pausado:hover {
        border-right: 1px solid #DDD;
        background-color: #C79200 !Important;
    }

    .actividad.ejecucion:hover {
        border-right: 1px solid #DDD;
        background-color: #008C6A !Important;
    }

    .btnMenuMovil > div {
        display: none;
    }

    .menuMovil {
        display: block !important;
    }

    .panelPasoPaso {
        border-left: 190px solid #FFF;
    }

    .tabsPaso {
        border-right: 40px solid #FFF !important;
        box-sizing: border-box;
    }

        .tabsPaso > div {
            width: 100%;
        }

    .linkPaso.ui-tabs-nav {
        margin-right: -40px !important;
        top: -1px;
    }

        .linkPaso.ui-tabs-nav > li.ui-tabs-active {
            border-left: none;
            -webkit-box-shadow: 2px 0px 1px 0px rgba(50, 50, 50, 0.2);
            -moz-box-shadow: 2px 0px 1px 0px rgba(50, 50, 50, 0.2);
            box-shadow: 2px 0px 1px 0px rgba(50, 50, 50, 0.2);
            left: -1px;
        }

            .linkPaso.ui-tabs-nav > li:nth-child(5), .linkPaso.ui-tabs-nav > li.ui-tabs-active:nth-child(5) {
                margin-bottom: 50px !important;
            }

    .ui-dialog {
        width: 350px !Important;
    }

    .descripcion {
        font-size: 18px;
    }
    /****************Reproductor video*****************/
    .reproductorVideo > video {
        display: block;
        border-right: 180px solid transparent;
    }

    .reproductorVideo > div {
        display: block;
        width: 180px;
        float: left;
        position: absolute;
        right: 0px;
        top: 10px;
        padding-bottom: 20px;
    }

    .galeriaVideo {
        top: 0px;
        padding-left: 10px;
        padding-right: 10px;
    }

        .galeriaVideo li {
            height: 120px;
        }

            .galeriaVideo li > div {
                display: block;
            }

                .galeriaVideo li > div > img {
                    width: 100%;
                    display: block;
                    margin-bottom: 5px;
                }

                .galeriaVideo li > div > div {
                    padding-left: 0px;
                    display: block;
                    white-space: nowrap;
                }

                .galeriaVideo li > div > span {
                    top: 22px;
                    width: 35px;
                    height: 35px;
                    line-height: 35px;
                    font-size: 35px;
                    left: auto;
                    right: 55px;
                }
    /*****************************************/
    .panel30 > div:last-child {
        display: block !Important;
    }

    .logo {
        width: 177.5px;
    }

    .galeriaReso > a, .panelCargarImagenesValidador > div > div > a, .tarjetaReso, .tarjetaFondoDifuminado {
        width: 23%;
        margin: 1%;
    }

    .osAprobacionInterna {
        width: 18%;
        margin: 1%;
    }

    .galeriaReso > a > div:first-child,
    .panelCargarImagenesValidador > div > div > a > div:first-child {
        width: 100%;
    }

    @-moz-document url-prefix() {
        .overflowContenedorIzq {
            height: 90vh;
            overflow-x: hidden;
        }

        .contenedorIzq {
            width: 205px;
            overflow-x: hidden;
        }
    }

    .galeriaReso > a:hover,
    .panelCargarImagenesValidador > div > div > a:hover {
        -ms-transform: scale(1.1,1.1); /* IE 9 */
        -webkit-transform: scale(1.1,1.1); /* Chrome, Safari, Opera */
        transform: scale(1.1,1.1);
        -webkit-box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.21), 0 16px 28px 0 rgba(0, 0, 0, 0.22);
        -moz-box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.21), 0 16px 28px 0 rgba(0, 0, 0, 0.22);
        box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.21), 0 16px 28px 0 rgba(0, 0, 0, 0.22);
        z-index: 1;
    }

    .galeriaReso > a:not(.selectedEDI):hover > div:first-child,
    .panelCargarImagenesValidador > div > div > a:not(.selectedEDI):hover > div:first-child {
        filter: brightness(1.3);
        -webkit-filter: brightness(1.3);
    }

    .tarjetaReso:hover {
        -ms-transform: scale(1.1,1.1); /* IE 9 */
        -webkit-transform: scale(1.1,1.1); /* Chrome, Safari, Opera */
        transform: scale(1.1,1.1);
        -webkit-box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.21), 0 16px 28px 0 rgba(0, 0, 0, 0.22);
        -moz-box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.21), 0 16px 28px 0 rgba(0, 0, 0, 0.22);
        box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.21), 0 16px 28px 0 rgba(0, 0, 0, 0.22);
        z-index: 1;
    }

    .tarjetaControlTecnico:hover {
        -webkit-box-shadow: 0 20px 30px 0 rgba(0, 0, 0, 0.1), 0 10px 20px 0 rgba(0, 0, 0, 0.1);
        -moz-box-shadow: 0 20px 30px 0 rgba(0, 0, 0, 0.1), 0 10px 20px 0 rgba(0, 0, 0, 0.1);
        box-shadow: 0 20px 30px 0 rgba(0, 0, 0, 0.1), 0 10px 20px 0 rgba(0, 0, 0, 0.1);
    }

    .panelInformacion span:nth-child(4n+1) {
        clear: both;
    }

    .activarPanelesLaterales {
        display: none;
    }

    .redo > i:last-child {
        right: 20px;
    }

    .tarjetaControlTecnico {
        width: 31%;
        margin: 1%;
    }

    .actividad > .panelEditActividad > textarea, .paso > .panelEditPaso > textarea {
        width: -moz-calc(100% - 35px);
        width: -webkit-calc(100% - 35px);
        width: -o-calc(100% - 35px);
        width: calc(100% - 35px);
    }

    .actividad > .panelEditActividad > span, .paso > .panelEditPaso > span {
        width: 35px;
    }

    .formFlotante.formPequeño > div {
        width: 550px;
        height: 400px;
    }

    #buscadorAgregarOsGrupo .listadoGruposOS {
        height: 230px !important;
    }
}

@media (min-width: 800px) and (max-width: 1023px) {
    .controlPequeño {
        width: 30%;
    }

    .controlMedio1 {
        width: 40%;
    }

    .controlMedio2 {
        width: 60%;
    }

    .controlGrande {
        width: 100%;
    }


    .panelPequeño {
        width: 50%;
    }

    .panelMedio {
        width: 50%;
    }

    .panelMedio2 {
        width: 70%;
    }

    .panelGrande {
        width: 100%;
    }

    .contenedorIzq {
        position: relative;
        z-index: 4;
    }

        .contenedorIzq > div {
            left: 0px !Important;
        }

    .contenedorDer {
        position: absolute;
        width: 100%;
        left: 0px;
        padding-left: 190px;
    }

        .contenedorDer #izquierdo {
            left: 190px;
            top: 60px;
            z-index: 2;
            display: block;
        }

        .contenedorDer #derecho {
            right: 0px;
            top: 60px;
            z-index: 2;
            display: block;
        }

    .panelPasoPaso {
        border-left: 190px solid #FFF;
    }

    .actividad:hover:before {
        width: 3px;
        height: 100%;
        background-color: #AAA;
        position: absolute;
        right: 0;
        top: 0;
    }

    .actividad + .terminado:hover {
        border-right: 2px solid #DDD;
        background-color: #0086D4;
    }

    .actividad.terminado:hover {
        border-right: 1px solid #DDD;
        background-color: #0086D4 !Important;
    }

    .actividad.pausado:hover {
        border-right: 1px solid #DDD;
        background-color: #C79200 !Important;
    }

    .actividad.ejecucion:hover {
        border-right: 1px solid #DDD;
        background-color: #008C6A !Important;
    }

    .btnMenuMovil > div {
        display: none;
    }

    .menuMovil {
        display: block !important;
    }

    .contador {
        padding: 0px 10px 0px 12px;
        font-size: 15px;
        margin-right: 5px;
    }

    .tabsPaso {
        border-right: 40px solid #FFF !important;
        box-sizing: border-box;
    }

    .linkPaso.ui-tabs-nav {
        margin-right: -40px !important;
        top: -1px;
    }

        .linkPaso.ui-tabs-nav > li.ui-tabs-active {
            border-left: none;
            -webkit-box-shadow: 2px 0px 1px 0px rgba(50, 50, 50, 0.2);
            -moz-box-shadow: 2px 0px 1px 0px rgba(50, 50, 50, 0.2);
            box-shadow: 2px 0px 1px 0px rgba(50, 50, 50, 0.2);
            left: -1px;
        }

            .linkPaso.ui-tabs-nav > li:nth-child(5), .linkPaso.ui-tabs-nav > li.ui-tabs-active:nth-child(5) {
                margin-bottom: 50px !important;
            }

    .ui-dialog {
        width: 350px !Important;
    }

    .descripcion {
        font-size: 15px;
    }

    .reproductorVideo {
        position: relative;
    }

    .panel30 > div:last-child {
        display: block !Important;
    }

    .galeriaVideo li > div > div {
        white-space: nowrap;
        max-width: 390px;
    }

    .logo {
        width: 172.5px;
    }

    /************Estilos para las tablas del informe************/
    .tablaInforme .filaInforme:first-child {
        display: none;
    }

    .tablaInforme .celdaInforme {
        display: table;
        width: 100%;
        height: 40px;
        padding: 0px;
    }

    .grupoInforme .variableInforme {
        width: 100%;
        background-color: #EEE;
    }

    .grupoInforme .celdaInforme > div, .grupoInforme .celdaInforme > span {
        display: table-cell;
        vertical-align: middle;
        padding: 3px;
    }

        .grupoInforme .celdaInforme > div:first-child {
            display: table-cell;
            width: 50%;
            background-color: #F7F7F7;
            border-right: 1px solid #AAA;
        }

        .grupoInforme .celdaInforme > div:last-child > input, .grupoInforme .celdaInforme > div:last-child > select {
            position: relative;
        }

    .checkMedicion {
        width: 100%;
    }

        .checkMedicion > div:first-child {
            display: none !Important;
        }

    .galeriaReso > a, .panelCargarImagenesValidador > div > div > a, .tarjetaReso, .tarjetaFondoDifuminado, .osAprobacionInterna {
        width: 29%;
        margin: 2%;
    }

        .galeriaReso > a > div:first-child, .panelCargarImagenesValidador > div > div > a > div:first-child {
            width: 100%;
        }

        .galeriaReso > a:hover,
        .panelCargarImagenesValidador > div > div > a:hover {
            -ms-transform: scale(1.1,1.1); /* IE 9 */
            -webkit-transform: scale(1.1,1.1); /* Chrome, Safari, Opera */
            transform: scale(1.1,1.1);
            -webkit-box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.21), 0 16px 28px 0 rgba(0, 0, 0, 0.22);
            -moz-box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.21), 0 16px 28px 0 rgba(0, 0, 0, 0.22);
            box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.21), 0 16px 28px 0 rgba(0, 0, 0, 0.22);
            z-index: 1;
        }

        .galeriaReso > a:not(.selectedEDI):hover > div:first-child, .panelCargarImagenesValidador > div > div > a:not(.selectedEDI):hover > div:first-child {
            filter: brightness(1.3);
            -webkit-filter: brightness(1.3);
        }

        .tarjetaReso:hover {
            -ms-transform: scale(1.1,1.1); /* IE 9 */
            -webkit-transform: scale(1.1,1.1); /* Chrome, Safari, Opera */
            transform: scale(1.1,1.1);
            -webkit-box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.21), 0 16px 28px 0 rgba(0, 0, 0, 0.22);
            -moz-box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.21), 0 16px 28px 0 rgba(0, 0, 0, 0.22);
            box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.21), 0 16px 28px 0 rgba(0, 0, 0, 0.22);
            z-index: 1;
        }

    .tarjetaControlTecnico:hover {
        -webkit-box-shadow: 0 20px 30px 0 rgba(0, 0, 0, 0.1), 0 10px 20px 0 rgba(0, 0, 0, 0.1);
        -moz-box-shadow: 0 20px 30px 0 rgba(0, 0, 0, 0.1), 0 10px 20px 0 rgba(0, 0, 0, 0.1);
        box-shadow: 0 20px 30px 0 rgba(0, 0, 0, 0.1), 0 10px 20px 0 rgba(0, 0, 0, 0.1);
    }
    /**********************************************/

    @-moz-document url-prefix() {
        .overflowContenedorIzq {
            height: 90vh;
            overflow-x: hidden;
        }

        .contenedorIzq {
            width: 205px;
            overflow-x: hidden;
        }
    }

    /*#modalFiltros > div > div {*/
    #modalFiltros > div > div > div {
        width: 50%;
    }

    .panelInformacion span:nth-child(4n+1) {
        clear: both;
    }

    .tablaAsignacion > div:first-child {
        width: 35px;
    }

    .panelAsignacionCentral > div > .panelPequeño {
        margin: 0px 0px 5px 0px !important;
        padding-right: 5px;
        box-sizing: border-box;
    }

        .panelAsignacionCentral > div > .panelPequeño:nth-child(5) {
            width: 25% !important;
            text-align: center;
        }

    .panelAsignacionCentral > div:first-child {
        height: 180px;
    }

    .panelAsignacionCentral > div:last-child {
        top: -180px;
        border-top: 180px solid transparent;
    }

    .tablaAsignacion .tablaAsignacion > div:last-child > div > span, .tablaAsignacion > div:first-child {
        font-size: 11px;
    }

    .tablaAsignacion .tablaAsignacion > div:last-child > div > span {
        min-height: 40px;
        height: auto;
    }

    .panelEstructuraActividades .dragAndCloneAsignacion > .tarjetaTecnico {
        width: 48% !important;
        margin: 1% !Important;
        float: left;
        font-size: 11px;
    }

        .panelEstructuraActividades .dragAndCloneAsignacion > .tarjetaTecnico > div > i {
            font-size: 11px;
        }

    .tarjetaTecnico > div:first-child {
        width: 40px;
        padding: 4px;
    }

    .activarPanelesLaterales {
        display: none;
    }

    .redo > i:last-child {
        right: 20px;
    }

    .panelAsignacionCentral h1 {
        font-size: 20px;
    }

    .tarjetaControlTecnico {
        width: 48%;
        margin: 1%;
    }

    .actividad > .panelEditActividad > textarea, .paso > .panelEditPaso > textarea {
        width: -moz-calc(100% - 35px);
        width: -webkit-calc(100% - 35px);
        width: -o-calc(100% - 35px);
        width: calc(100% - 35px);
    }

    .actividad > .panelEditActividad > span, .paso > .panelEditPaso > span {
        width: 35px;
    }

    .nombreMD {
        width: 220px !important;
        left: -225px !important;
        font-size: 12px !important;
        line-height: 11px !important;
    }

    .panelComponente > span:first-child {
        min-height: 70px;
    }

    .formFlotante.formPequeño > div {
        width: 500px;
        height: 400px;
    }

    .presupuestor3, .presupuestor2, .panelDetallePresupuesto h1, .panelDetallePresupuesto .panelCarpeta {
        width: 98% !important;
        margin-left: 1% !important;
    }
}

@media (min-width: 400px) and (max-width: 799px) {
    .controlPequeño {
        width: 100%;
        margin-bottom: 5px;
    }

    .controlMedio1 {
        width: 100%;
        margin-bottom: 5px;
    }

    .controlMedio2 {
        width: 100%;
        margin-bottom: 5px;
    }

    .controlGrande {
        width: 100%;
        margin-bottom: 5px;
    }

    .panelPequeño {
        width: 50%;
    }

    .panelMedio {
        width: 100%;
    }

    .panelMedio2 {
        width: 100%;
    }

    .panelGrande {
        width: 100%;
    }


    .contenedor {
        display: block;
    }

    .contenedorIzq, .contenedorDer {
        display: block;
    }

    .overflowContenedorIzq {
        width: auto;
        height: auto;
        z-index: 4;
    }

    .contenedorIzq {
        width: 100%;
        height: 50px;
        float: left;
        padding: 0px;
        border: none;
        background-color: #EEE;
    }

        .contenedorIzq > div {
            height: 50px;
            margin-left: 40px;
            min-width: 100%;
            display: -webkit-flex; /* Safari */
            display: inline-flex;
        }

    .navegadorVertical {
        display: none !Important;
    }


    .cabeceraSuperior {
        min-height: 40px;
    }

    .contenedorDer {
        float: left;
        min-height: 450px;
        width: 100%;
        padding-top: 170px;
    }

        .contenedorDer #izquierdo {
            top: 115px;
            left: 0px;
            z-index: 2;
        }

        .contenedorDer #derecho {
            top: 115px;
            right: 0px;
            z-index: 2;
        }

    .panelPasoPaso {
        border: 0px;
        top: 115px;
    }

    .actividad {
        font-size: 8px;
        width: 150px;
    }

    .paso > span:first-child, .paso > div {
        font-size: 8px;
    }

    .paso {
        width: 150px;
    }

    .navegador {
        display: block;
    }

    .panelContador {
        margin-top: 3px;
    }

    .contador {
        margin-left: 15px;
        margin-right: 0px;
    }

    .menuMovil {
        display: none;
    }

    .tabsPaso {
        display: block;
    }

        .tabsPaso > div {
            float: left;
            min-height: 90%;
        }

    .linkPaso.ui-tabs-nav {
        display: block;
        width: 100%;
        height: 36px;
        float: left;
    }

        .linkPaso.ui-tabs-nav > li {
            border-radius: 5px 5px 0px 0px;
            border-right-width: 1px !important;
            width: 10%;
            height: 35px;
        }

            .linkPaso.ui-tabs-nav > li > a {
                font-size: 20px;
                padding: 5px 5px 6px 5px !important;
                width: 100%;
                box-sizing: border-box;
                text-align: center;
            }

            .linkPaso.ui-tabs-nav > li:nth-child(5), .linkPaso.ui-tabs-nav > li.ui-tabs-active:nth-child(5) {
                margin-right: 50px !important;
            }

            .linkPaso.ui-tabs-nav > li.ui-tabs-active {
                border-bottom: none;
                -webkit-box-shadow: 0px -2px 1px 1px rgba(50, 50, 50, 0.2);
                -moz-box-shadow: 0px -2px 1px 1px rgba(50, 50, 50, 0.2);
                box-shadow: 0px -2px 1px 1px rgba(50, 50, 50, 0.2);
                height: 36px;
            }

    .ui-dialog {
        width: 350px !Important;
    }

    .descripcion {
        font-size: 13px;
        position: relative;
        bottom: auto !Important;
        margin-top: 10px;
        width: 100%;
        margin-left: 0px;
    }

    .reproductorVideo {
        position: relative;
    }

    .panel30 {
        width: 100%;
    }

        .panel30 > div:last-child {
            height: auto;
            overflow: hidden;
            display: none;
        }

        .panel30 > div:first-child > i {
            display: block;
        }

    .galeriaVideo li > div > div {
        white-space: nowrap;
        max-width: 220px;
    }

    .FichaHorizontal {
        display: block;
    }

        .FichaHorizontal div:first-child {
            display: block;
            height: 200px;
            width: 100%;
            border-bottom: 1px solid #EEE;
            border-right: none;
        }

        .FichaHorizontal div:last-child {
            display: block;
        }

    .sinInsumo > div, #noVideo > div {
        position: relative;
        margin-top: -1%;
        font-size: 25px;
    }

    .bloqueoPasos {
        border-left: none;
        border-top: 115px solid transparent;
    }

    .overlay {
        border-top: none;
        border-left: none;
    }

    .actividadActual {
        width: 100%;
        height: 3px;
        bottom: 0px;
        top: auto;
    }

    .panelCheckList, .panelGaleria {
        border-right: none;
        width: 100%;
    }

    /************Estilos para las tablas del informe************/
    .tablaInforme .filaInforme:first-child {
        display: none;
    }

    .tablaInforme .celdaInforme {
        display: table;
        width: 100%;
        height: 40px;
        padding: 0px;
    }

    .grupoInforme .variableInforme {
        width: 100%;
        background-color: #EEE;
    }

    .grupoInforme .celdaInforme > div, .grupoInforme .celdaInforme > span {
        display: table-cell;
        vertical-align: middle;
        padding: 3px;
    }

        .grupoInforme .celdaInforme > div:first-child {
            display: table-cell;
            width: 50%;
            background-color: #F7F7F7;
            border-right: 1px solid #AAA;
        }

        .grupoInforme .celdaInforme > div:last-child > input, .grupoInforme .celdaInforme > div:last-child > select {
            position: relative;
        }

    .checkMedicion {
        width: 100%;
    }

        .checkMedicion > div:first-child {
            display: none !Important;
        }

    /**********************************************/

    .mfp-close {
        margin-right: auto;
    }

    .preview > div, .panelCargarImagenesValidador > div > div > div {
        width: 100%;
    }

    .galeriaReso > a, .panelCargarImagenesValidador > div > div > a, .tarjetaReso, .tarjetaFondoDifuminado, .osAprobacionInterna {
        width: 46%;
        margin: 2%;
    }

        .galeriaReso > a > div:first-child, .panelCargarImagenesValidador > div > div > a > div:first-child {
            width: 100%;
        }

    .contenedorCheckAprobar {
        width: 100%;
    }

    .panelInforme {
        overflow-y: auto;
        overflow-x: hidden;
    }

    #contenidoInforme {
        height: auto;
    }

    .accesos {
        width: 100%;
    }

        .accesos > a, .accesos > div {
            width: 30%;
            margin: 1%;
            height: 150px;
            font-size: 14px;
        }

            .accesos > a > span:first-child {
                font-size: 60px;
            }

    .panelCentral {
        width: 99%;
    }

    .panelInformacion span {
        width: 50%;
    }

    .panelInformacion > div > i {
        display: none;
    }

    ol.barraProgreso > li > span:first-child {
        display: none;
    }

    ol.barraProgreso > li > span:last-child {
        display: block;
    }

    /*#modalFiltros > div > div {*/
    #modalFiltros > div > div > div {
        width: 100%;
    }

    .panelInformacion span:nth-child(2n+1) {
        clear: both;
    }

    .tablaAsignacion > div:first-child {
        width: 40px;
    }

    .panelAsignacion .panelOSLeft, .panelAsignacion .panelTecnicoRight, .panelOSLeft {
        display: none;
    }

    .panelAsignacion .panelAsignacionCentral, .panelContentSection.panelCenter {
        padding-left: 30px;
        padding-right: 0px;
    }

    .panelAsignacionCentral > div > .panelPequeño {
        margin: 0px 0px 5px 0px !important;
        padding-right: 5px;
        box-sizing: border-box;
    }

        .panelAsignacionCentral > div > .panelPequeño:nth-child(5) {
            width: 25% !important;
            text-align: center;
        }

    .panelAsignacionCentral > div:first-child {
        height: 190px;
    }

    .panelAsignacionCentral > div:last-child {
        top: -190px;
        border-top: 190px solid transparent;
    }

    .panelAsignacionCentral > div:last-child {
        overflow: hidden;
        height: auto;
    }

    .panelAsignacion > .panelOSLeft, .panelLeft {
        position: fixed;
        z-index: 5;
        width: 250px;
        left: -250px;
        border-top: 50px solid transparent;
    }

    .panelAsignacion > .panelTecnicoRight {
        position: fixed;
        z-index: 5;
        width: 250px;
        right: -250px;
        border-top: 50px solid transparent;
    }

    .selectMultiple {
        display: none;
    }

    .panelAsignacionCentral > div:last-child > div {
        min-height: 50px;
    }

    .tablaAsignacion .tablaAsignacion > div:last-child > div > div > span:first-child {
        display: block !important;
        opacity: 1 !important;
        float: right;
    }

    .panelAsignacionCentral h1 {
        font-size: 16px;
    }

    .panelTecnicoRight .tarjetaTecnico:not(.multiseleccion):hover > div:first-child, .panelTecnicoRight .tarjetaTecnico:not(.multiseleccion):hover > div:nth-child(2),
    .panelAsignacion > .panelOSLeft > .panelOS > div:not(.active):hover, .panelLeft > .panelContentAside > .item:not(.active):hover {
        background-color: #F5FAFD;
        border-color: #DDD;
    }

    .asignada + .dragAndCloneAsignacion > .tarjetaTecnico, .porAsignar + .dragAndCloneAsignacion > .tarjetaTecnico,
    .ejecucion + .dragAndCloneAsignacion > .tarjetaTecnico.suspendida, .tablaAsignacion .tablaAsignacion > div:last-child > div > div > .tarjetaTecnico.tecnicoAsignado {
        width: 220px !important;
    }

    .tarjetaControlTecnico {
        width: 90%;
        margin: 2% 5%;
    }

    #infoMasterDoc > div {
        width: 95%;
    }

    .panelDetalleEventos > div {
        margin-bottom: 40px;
    }

        .panelDetalleEventos > div > span > i.fecha {
            left: 0;
            margin: 0;
            top: -27px;
            text-align: left;
        }

    .panelDetallesMD {
        padding-left: 10px;
    }

    .panelComponenteDocumentos > span > span {
        display: block;
        width: 100%;
        float: none;
        padding-top: 5px;
        border-top: 1px solid #E5E5E5;
    }

    .panelEventosOS > div > div > div:last-child > div {
        width: 100%;
        min-height: 155px;
        height: auto;
    }

    .panelEventosOS > div > div > div:first-child {
        width: 100px;
    }

    .panelEventosOS > div > div {
        width: 100%;
    }

    .formFlotante > div {
        width: 80%;
        min-width: 380px;
        height: auto;
        overflow: hidden;
        position: relative;
    }

    .formFlotante {
        overflow: auto;
    }

    .nombreMD {
        display: none !important;
    }

    .formulario > .aviso {
        display: inline-block !important;
        padding-top: 200px;
    }

    .cambioEventoOS > div {
        height: 420px !important;
    }

    .panelComponente {
        width: 98%;
    }

    .listadoGruposOS > a > h3 {
        margin-top: 5px !important;
        margin-bottom: 5px !important;
    }

    .listadoGruposOS > a > div > span {
        padding: 0 !important;
    }

    .listadoGruposOS > a {
        padding-left: 25px !important;
    }

        .listadoGruposOS > a:before {
            left: 5px !important;
        }

    .presupuestor3, .presupuestor2, .panelDetallePresupuesto h1, .panelDetallePresupuesto .panelCarpeta {
        width: 98% !important;
        margin-left: 1% !important;
    }

        .presupuestor3 > div > div > div, .presupuestor3 > div > div > a {
            display: block !important;
            width: 100% !important;
        }

            .presupuestor3 > div > div > a:first-child {
                height: 30px;
                line-height: 30px;
                text-align: center;
                border-bottom: 1px solid #eee;
                text-decoration: none;
            }

                .presupuestor3 > div > div > a:first-child > img {
                    display: none;
                }

                .presupuestor3 > div > div > a:first-child > span {
                    position: relative !important;
                    opacity: 1 !important;
                    visibility: visible !important;
                    display: inline !important;
                }

                    .presupuestor3 > div > div > a:first-child > span > i {
                        position: relative !important;
                        width: auto !important;
                        font-size: 15px !important;
                        margin: 0px 5px 0px 0px !important;
                        display: inline !IMPORTANT;
                        padding: 0px !important;
                        top: auto !important;
                    }

            .presupuestor3 > div > div > div:last-child > span {
                height: auto !important;
            }

                .presupuestor3 > div > div > div:last-child > span > i:nth-child(1) {
                    width: 100% !important;
                    text-align: left !important;
                    position: relative !important;
                    left: auto !important;
                    top: auto !important;
                    display: inline-block !important;
                    height: 30px !important;
                    line-height: 30px !important;
                    padding-left: 10px !important;
                }

                .presupuestor3 > div > div > div:last-child > span > i:nth-child(2),
                .presupuestor3 > div > div > div:last-child > span > i:nth-child(3),
                .presupuestor3 > div > div > div:last-child > span > i:nth-child(6) {
                    width: 50% !important;
                    text-align: center !important;
                    padding: 5px !important;
                    box-sizing: border-box !important;
                    height: 30px !important;
                }

                    .presupuestor3 > div > div > div:last-child > span > i:nth-child(2) > i,
                    .presupuestor3 > div > div > div:last-child > span > i:nth-child(3) > i,
                    .presupuestor3 > div > div > div:last-child > span > i:nth-child(6) > i {
                        opacity: 1 !important;
                    }

                    .presupuestor3 > div > div > div:last-child > span > i:nth-child(2):before,
                    .presupuestor3 > div > div > div:last-child > span > i:nth-child(3):before,
                    .presupuestor3 > div > div > div:last-child > span > i:nth-child(6):before {
                        padding: 0px !important;
                    }


    .formPublicarPresupuesto, .formAprobarPresupuesto, .formValidarPresupuesto {
        right: auto !important;
        left: 0 !important;
    }

        .formPublicarPresupuesto:before, .formAprobarPresupuesto:before, .formValidarPresupuesto:before {
            right: auto !important;
            left: 50px !important;
        }

    .panelDetallePresupuesto .panelCarpeta a {
        padding: 0px 5px 0px 5px !important;
        font-size: 12px !important;
    }

    .presupuestor2 > div {
        display: block !important;
        width: 100% !important;
    }

        .presupuestor2 > div:nth-child(1) {
            height: 30px !important;
            border-bottom: 1px solid #EEE;
        }

            .presupuestor2 > div:nth-child(1) > a > img {
                display: none !important;
            }

            .presupuestor2 > div:nth-child(1) > a > span {
                visibility: visible !important;
                opacity: 1 !important;
                line-height: 30px;
            }

                .presupuestor2 > div:nth-child(1) > a > span > i {
                    position: relative !important;
                    width: auto !important;
                    top: auto !important;
                    bottom: auto !important;
                }

                    .presupuestor2 > div:nth-child(1) > a > span > i:nth-child(1) {
                        font-size: 15px !important;
                        margin-right: 5px !important;
                        height: auto !important;
                    }

        .presupuestor2 > div:nth-child(2) > h2 {
            margin-top: 0px;
        }
}

@media (min-width: 400px) and (max-width: 799px) and (orientation: portrait) {
    .FullScreen .descripcion {
        top: 100%;
    }
}

@media (max-width: 399px) {
    .controlPequeño {
        width: 100%;
        margin-bottom: 5px;
    }

    .controlMedio1 {
        width: 100%;
        margin-bottom: 5px;
    }

    .controlMedio2 {
        width: 100%;
        margin-bottom: 5px;
    }

    .controlGrande {
        width: 100%;
        margin-bottom: 5px;
    }

    .panelPequeño {
        width: 100%;
    }

    .panelMedio {
        width: 100%;
    }

    .panelMedio2 {
        width: 100%;
    }

    .panelGrande {
        width: 100%;
    }

    .contenedor {
        display: block;
    }

    .contenedorIzq, .contenedorDer {
        display: block;
    }

    .overflowContenedorIzq {
        width: auto;
        height: auto;
        z-index: 4;
    }

    .contenedorIzq {
        width: 100%;
        height: 50px;
        float: left;
        padding: 0px;
        border: none;
        background-color: #EEE;
    }

        .contenedorIzq > div {
            height: 50px;
            margin-left: 40px;
            min-width: 100%;
            display: -webkit-flex; /* Safari */
            display: inline-flex;
        }

    .navegadorVertical {
        display: none !Important;
    }

    .cabeceraSuperior {
        min-height: 40px;
    }

    .contenedorDer {
        float: left;
        min-height: 450px;
        width: 100%;
        padding-top: 170px;
    }

        .contenedorDer #izquierdo {
            top: 115px;
            left: 0px;
            z-index: 2;
        }

        .contenedorDer #derecho {
            top: 115px;
            right: 0px;
            z-index: 2;
        }

    .panelPasoPaso {
        border: 0px;
        top: 115px;
    }

    .actividad {
        font-size: 8px;
        width: 150px;
    }

    .paso > span:first-child, .paso > div {
        font-size: 8px;
    }

    .paso {
        width: 150px;
    }

    .navegador {
        display: block;
    }

    .panelContador {
        margin-top: 3px;
    }

    .contador {
        margin-left: 15px;
        margin-right: 0px;
    }

    .menuMovil {
        display: none;
    }

    .tabsPaso {
        display: block;
    }

        .tabsPaso > div {
            float: left;
            min-height: 90%;
        }

    .linkPaso.ui-tabs-nav {
        display: block;
        width: 100%;
        height: 36px;
        float: left;
    }

        .linkPaso.ui-tabs-nav > li {
            border-radius: 5px 5px 0px 0px;
            border-right-width: 1px !important;
            width: 10%;
            height: 35px;
        }

            .linkPaso.ui-tabs-nav > li > a {
                font-size: 18px;
                padding: 5px 0px 5px 0px !important;
                width: 100%;
                box-sizing: border-box;
                text-align: center;
            }

            .linkPaso.ui-tabs-nav > li:nth-child(5), .linkPaso.ui-tabs-nav > li.ui-tabs-active:nth-child(5) {
                margin-right: 6% !important;
            }

            .linkPaso.ui-tabs-nav > li.ui-tabs-active {
                border-bottom: none;
                -webkit-box-shadow: 0px -2px 1px 1px rgba(50, 50, 50, 0.2);
                -moz-box-shadow: 0px -2px 1px 1px rgba(50, 50, 50, 0.2);
                box-shadow: 0px -2px 1px 1px rgba(50, 50, 50, 0.2);
                height: 36px;
            }

    .ui-dialog {
        width: 300px !Important;
    }

    .descripcion {
        font-size: 13px;
        position: relative;
        bottom: auto !Important;
        margin-top: 10px;
        width: 100%;
        margin-left: 0px;
    }

    .reproductorVideo {
        position: relative;
    }

    .infoUser > div:first-child {
        display: none;
    }

    .panelNotificacion {
        left: -180px;
    }

        .panelNotificacion:before {
            left: 55px;
        }

    .panel30 {
        width: 100%;
    }

        .panel30 > div:last-child {
            height: auto;
            overflow: hidden;
            display: none;
        }

        .panel30 > div:first-child > i {
            display: block;
        }

    .galeriaVideo li > div > div {
        white-space: nowrap;
        max-width: 160px;
    }

    .FichaHorizontal {
        display: block;
    }

        .FichaHorizontal div:first-child {
            display: block;
            height: 200px;
            width: 100%;
            border-bottom: 1px solid #EEE;
            border-right: none;
        }

        .FichaHorizontal div:last-child {
            display: block;
        }

    .sinInsumo > div, #noVideo > div {
        position: relative;
        margin-top: -1%;
        font-size: 20px;
    }

    .FullScreen .descripcion {
        top: 100%;
    }

    .bloqueoPasos {
        border-left: none;
        border-top: 115px solid transparent;
    }

    .overlay {
        border-top: none;
        border-left: none;
    }

    .actividadActual {
        width: 100%;
        height: 3px;
        bottom: 0px;
        top: auto;
    }

    .panelCheckList, .panelGaleria {
        border-right: none;
        width: 100%;
    }

    .panelCheckOpciones {
        float: none;
        width: 100%;
        text-align: left;
    }

    /************Estilos para las tablas del informe************/
    .tablaInforme .filaInforme:first-child {
        display: none;
    }

    .tablaInforme .celdaInforme {
        display: table;
        width: 100%;
        height: 40px;
        padding: 0px;
    }

    .grupoInforme .variableInforme {
        width: 100%;
        background-color: #EEE;
    }

    .grupoInforme .celdaInforme > div, .grupoInforme .celdaInforme > span {
        display: table-cell;
        vertical-align: middle;
        padding: 3px;
    }

        .grupoInforme .celdaInforme > div:first-child {
            display: table-cell;
            width: 50%;
            background-color: #F7F7F7;
            border-right: 1px solid #AAA;
        }

        .grupoInforme .celdaInforme > div:last-child > input, .grupoInforme .celdaInforme > div:last-child > select {
            position: relative;
        }

    .checkMedicion {
        width: 100%;
    }

        .checkMedicion > div:first-child {
            display: none !Important;
        }

    /**********************************************/

    .mfp-close {
        margin-right: auto;
    }

    .preview > div, .panelCargarImagenesValidador > div > div > div {
        width: 100%;
    }

    .galeriaReso > a,
    .panelCargarImagenesValidador > div > div > a {
        width: 96%;
        margin: 2%;
    }

    .tarjetaReso, .tarjetaFondoDifuminado, .osAprobacionInterna {
        width: 100%;
        margin-bottom: 5px;
    }

    .galeriaReso > a > div:first-child,
    .panelCargarImagenesValidador > div > div > a > div:first-child {
        width: 100%;
    }

    .galeriaReso {
        padding: 0px;
    }

    .contenedorCheckAprobar {
        width: 100%;
    }

    .panelInforme {
        overflow-y: auto;
        overflow-x: hidden;
    }

    #contenidoInforme {
        height: auto;
    }

    .accesos {
        width: 100%;
    }

        .accesos > a, .accesos > div {
            width: 48%;
            height: 130px;
            margin: 1%;
            font-size: 12px;
        }

            .accesos > a > span:first-child {
                font-size: 60px;
            }

    .panelCentral {
        width: 99%;
    }

    .panelInformacion span {
        width: 100%;
    }

        .panelInformacion span:nth-child(2n-1) > i {
            display: none;
        }

        .panelInformacion span:nth-child(2n-1) {
            background-color: #EEE;
        }

    ol.barraProgreso > li > span:first-child {
        display: none;
    }

    ol.barraProgreso > li > span:last-child {
        display: block;
    }

    /*#modalFiltros > div > div {*/
    #modalFiltros > div > div > div {
        width: 100%;
    }

    .ui-dialog.modalFiltros, .ui-dialog.modalForm {
        width: 95% !Important;
    }

        /*#modalFiltros > div > div {*/
        #modalFiltros > div > div > div, .ui-dialog.modalForm > .ui-dialog-content > div > div > div {
            padding-left: 0px;
            padding-right: 0px;
        }

    .panelInformacion > div > i {
        display: none;
    }

    .panelInformacion span:nth-child(2n+1) {
        clear: both;
    }

    .tablaAsignacion > div:first-child {
        width: 40px;
    }

    .panelAsignacion .panelOSLeft, .panelAsignacion .panelTecnicoRight, .panelLeft {
        display: none;
    }

    .panelAsignacion .panelAsignacionCentral, .panelContentSection.panelCenter {
        padding-left: 30px;
        padding-right: 0px;
    }

    .panelAsignacionCentral > div > .panelPequeño {
        margin: 0px 0px 5px 0px !important;
        padding-right: 5px;
        box-sizing: border-box;
    }

        .panelAsignacionCentral > div > .panelPequeño:nth-child(5) {
            width: 25% !important;
            text-align: center;
        }

    .panelAsignacionCentral > div:first-child {
        height: 315px;
    }

    .panelAsignacionCentral > div:last-child {
        top: -315px;
        border-top: 315px solid transparent;
    }

    .panelAsignacionCentral > div:last-child {
        overflow: hidden;
        height: auto;
    }

    .panelAsignacion > .panelOSLeft, .panelLeft {
        position: fixed;
        z-index: 5;
        width: 210px;
        left: -250px;
        border-top: 50px solid transparent;
    }

    .panelAsignacion > .panelTecnicoRight {
        position: fixed;
        z-index: 5;
        width: 210px;
        right: -250px;
        border-top: 50px solid transparent;
    }

    .tablaAsignacion .dragAndCloneAsignacion > .tarjetaTecnico, .tablaAsignacion .dragAndCloneAsignacion > .tarjetaTecnico.suspendida,
    .tablaAsignacion .dragAndCloneAsignacion > .tarjetaTecnico.aPorIniciar {
        width: 180px !important;
    }

    .tablaAsignacion .tablaAsignacion > div:last-child > div > span {
        min-height: 50px;
        height: auto;
    }

    .panelOSLeft > .btnCirRojo, panelLeft .btnCirRojo {
        left: 230px;
    }

    .panelTecnicoRight > .btnCirRojo, .panelTecnicoRight > .bntCirVerde {
        right: 230px;
    }

    .tablaAsignacion > div:first-child, .tablaAsignacion .tablaAsignacion > div:last-child > div > span, .tarjetaTecnico, .tarjetaTecnico > div > i {
        font-size: 11px !important;
    }

    .selectMultiple {
        display: none;
    }

    .tablaAsignacion .tablaAsignacion > div:last-child > div > span > span {
        min-height: 40px;
        height: auto;
    }

    .panelAsignacionCentral > div:last-child > div {
        min-height: 50px;
    }

    .tablaAsignacion .tablaAsignacion > div:last-child > div > div > span:first-child {
        display: block !important;
        opacity: 1 !important;
        float: right;
        width: 40px;
        font-size: 25px;
        padding: 10px 5px;
    }

    .tarjetaTecnico > span > select {
        width: 95px;
        min-width: 95px;
    }

    .tarjetaTecnico > span {
        width: 180px;
    }

    .panelAsignacionCentral h1 {
        font-size: 16px;
    }

    .panelTecnicoRight .tarjetaTecnico:not(.multiseleccion):hover > div:first-child, .panelTecnicoRight .tarjetaTecnico:not(.multiseleccion):hover > div:nth-child(2),
    .panelAsignacion > .panelOSLeft > .panelOS > div:not(.active):hover, .panelLeft > .panelContentAside > div:not(.active):hover {
        background-color: #F5FAFD;
        border-color: #DDD;
    }

    .tablaAsignacion .tablaAsignacion > div:last-child > div > div {
        padding: 2px;
    }

    .tarjetaControlTecnico {
        width: 98%;
        margin: 1%;
    }

    #infoMasterDoc > div {
        width: 95%;
    }

        #infoMasterDoc > div > span.pestaña {
            left: 90px;
        }

    .panelDetalleEventos > div {
        margin-bottom: 40px;
    }

        .panelDetalleEventos > div > span > i.fecha {
            left: 0;
            margin: 0;
            top: -27px;
            text-align: left;
        }

    .panelDetallesMD {
        padding-left: 10px;
    }

    .panelComponenteDocumentos > span > span {
        display: block;
        width: 100%;
        float: none;
        padding-top: 5px;
        border-top: 1px solid #E5E5E5;
    }

    .panelEventosOS > div > div > div:last-child > div {
        width: 100%;
        min-height: 155px;
        height: auto;
    }

    .panelEventosOS > div > div > div:first-child {
        width: 70px;
    }

    .panelEventosOS > div > div > div:first-child {
        padding-left: 10px;
        padding-right: 10px;
    }

        .panelEventosOS > div > div > div:first-child:after,
        .panelEventosOS > div > div > div:first-child:before {
            right: 33px !important;
        }

    .panelEventosOS > div > div {
        width: 100%;
    }

    .formFlotante > div {
        width: 100%;
        height: auto;
        overflow: hidden;
        position: relative;
    }

    .formFlotante {
        overflow: auto;
    }

    .nombreMD {
        display: none !important;
    }

    .formulario > .aviso {
        display: inline-block !important;
        padding-top: 200px;
    }

    .cambioEventoOS > div {
        height: 420px !important;
    }

    .panelComponente {
        width: 98%;
    }

    .listadoGruposOS > a > h3 {
        margin-top: 5px !important;
        margin-bottom: 5px !important;
    }

    .listadoGruposOS > a > div > span {
        padding: 0 !important;
    }

    .listadoGruposOS > a {
        padding-left: 25px !important;
    }

        .listadoGruposOS > a:before {
            left: 5px !important;
        }

    .presupuestor3, .presupuestor2, .panelDetallePresupuesto h1, .panelDetallePresupuesto .panelCarpeta {
        width: 98% !important;
        margin-left: 1% !important;
    }

        .panelDetallePresupuesto .panelCarpeta a {
            padding: 0px 3px 0px 3px !important;
            font-size: 10px !important;
        }

        .presupuestor3 > div > div > div, .presupuestor3 > div > div > a {
            display: block !important;
            width: 100% !important;
        }

            .presupuestor3 > div > div > a:first-child {
                height: 30px;
                line-height: 30px;
                text-align: center;
                border-bottom: 1px solid #eee;
                text-decoration: none;
            }

                .presupuestor3 > div > div > a:first-child > img {
                    display: none;
                }

                .presupuestor3 > div > div > a:first-child > span {
                    position: relative !important;
                    opacity: 1 !important;
                    visibility: visible !important;
                    display: inline !important;
                }

                    .presupuestor3 > div > div > a:first-child > span > i {
                        position: relative !important;
                        width: auto !important;
                        font-size: 15px !important;
                        margin: 0px 5px 0px 0px !important;
                        display: inline !IMPORTANT;
                        padding: 0px !important;
                        top: auto !important;
                    }

            .presupuestor3 > div > div > div:last-child > span > i:nth-child(1) {
                font-size: 15px !important;
            }

            .presupuestor3 > div > div > div:last-child > span {
                height: auto !important;
            }

                .presupuestor3 > div > div > div:last-child > span > i:nth-child(1) {
                    width: 100% !important;
                    text-align: left !important;
                    position: relative !important;
                    left: auto !important;
                    top: auto !important;
                    display: inline-block !important;
                    height: 30px !important;
                    line-height: 30px !important;
                    padding-left: 10px !important;
                }

                .presupuestor3 > div > div > div:last-child > span > i:nth-child(2),
                .presupuestor3 > div > div > div:last-child > span > i:nth-child(3),
                .presupuestor3 > div > div > div:last-child > span > i:nth-child(6) {
                    width: 50% !important;
                    text-align: center !important;
                    padding: 5px !important;
                    box-sizing: border-box !important;
                    height: 30px !important;
                }

                    .presupuestor3 > div > div > div:last-child > span > i:nth-child(2) > i,
                    .presupuestor3 > div > div > div:last-child > span > i:nth-child(3) > i,
                    .presupuestor3 > div > div > div:last-child > span > i:nth-child(6) > i {
                        opacity: 1 !important;
                    }

                    .presupuestor3 > div > div > div:last-child > span > i:nth-child(2):before,
                    .presupuestor3 > div > div > div:last-child > span > i:nth-child(3):before,
                    .presupuestor3 > div > div > div:last-child > span > i:nth-child(6):before {
                        padding: 0px !important;
                    }

    .formPublicarPresupuesto, .formAprobarPresupuesto, .formValidarPresupuesto {
        right: auto !important;
        left: 0 !important;
    }

        .formPublicarPresupuesto:before, .formAprobarPresupuesto:before, .formValidarPresupuesto:before {
            right: auto !important;
            left: 50px !important;
        }

    .presupuestor2 > div {
        display: block !important;
        width: 100% !important;
    }

        .presupuestor2 > div:nth-child(1) {
            height: 30px !important;
            border-bottom: 1px solid #EEE;
        }

            .presupuestor2 > div:nth-child(1) > a > img {
                display: none !important;
            }

            .presupuestor2 > div:nth-child(1) > a > span {
                visibility: visible !important;
                opacity: 1 !important;
                line-height: 30px;
            }

                .presupuestor2 > div:nth-child(1) > a > span > i {
                    position: relative !important;
                    width: auto !important;
                    top: auto !important;
                    bottom: auto !important;
                }

                    .presupuestor2 > div:nth-child(1) > a > span > i:nth-child(1) {
                        font-size: 15px !important;
                        margin-right: 5px !important;
                        height: auto !important;
                    }

        .presupuestor2 > div:nth-child(2) > h2 {
            margin-top: 0px;
        }
}

@media screen\0 {
    /**Solo IE**/
    .galeriaVideo {
        max-height: 500px;
    }

        .galeriaVideo li {
            min-width: 140px;
        }

    .panelPasoPaso {
        height: 70px;
        margin-bottom: -20px;
    }

    nav {
        overflow: hidden;
    }

        nav > ul {
            overflow-x: hidden;
            overflow-y: auto;
            width: 280px;
            margin-bottom: -20px;
            height: 100%;
        }

    .panelInsumos {
        width: 99%;
        position: absolute;
    }

    .tarjetaReso > div {
        background-color: #FFF;
    }

    .tarjetaFondoDifuminado > div:last-child {
        background-color: #FFF;
    }

    .tarjetaControlTecnico > div.panelTareasOS {
        background-color: rgba(255, 255, 255, 0.95);
    }

    .documento > div:last-child {
        background-color: #FFF;
    }

    #panelDetalleEventos > div:not(.aprobado):not(.rechazo) > div:nth-child(2) > span:nth-child(3):hover {
        background-color: #04AD84;
        color: #FFF;
        cursor: pointer;
    }

    #panelDetalleEventos > div > div:nth-child(2) > span:nth-child(4):hover {
        background-color: #EF5350;
        color: #FFF;
        cursor: pointer;
    }
}

@media (min-width:800px\0) and (max-width:1599px\0) {
    .overflowContenedorIzq {
        position: absolute;
        top: 0px;
        border-color: #FFF;
        border-style: solid;
        border-top-width: 60px;
        border-bottom-width: 35px;
        overflow: hidden;
        width: 190px;
        margin-left: 1px;
    }

    .contenedorIzq {
        width: 200px;
        padding-left: 0px;
        overflow-x: hidden;
    }
}

@media (min-width:1600px\0) {
    /**Solo IE**/
    .panelPasoPaso {
        height: 90px;
        margin-bottom: -20px;
    }

    .contenedorIzq {
        width: 320px;
        padding-left: 0px;
        overflow-x: hidden;
    }

    .overflowContenedorIzq {
        overflow: hidden;
        width: 300px;
        margin-left: 5px;
        position: absolute;
        top: 0px;
        border-color: #FFF;
        border-style: solid;
        border-top-width: 80px;
        border-bottom-width: 35px;
    }
}

@media (max-width: 799px\0) {
    /**Solo IE**/
    .contenedorIzq {
        height: 70px;
        margin-bottom: -20px;
        max-height: 70px;
        overflow-y: hidden;
    }

    .overflowContenedorIzq {
        overflow-x: auto;
        overflow-y: hidden;
        height: 50px;
        max-height: 50px;
    }

    .contenedorIzq > div {
        padding-left: 40px;
        margin-left: 0px;
        box-sizing: border-box;
    }
}

@-moz-document url-prefix() {
    .panelInsumos {
        width: 99%;
        position: absolute;
    }
}



.actividad > .editActividad, .paso > .editPaso {
    display: table;
    visibility: hidden;
    opacity: 0;
    width: 50px;
    height: 100%;
    position: absolute;
    right: -50px;
    top: 0;
    background-color: #666;
    border-radius: 10px 0px 0px 10px;
    color: #FFF;
    text-align: center;
    box-sizing: border-box;
    font-size: 18px;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    z-index: 1;
}

    .actividad > .editActividad:before, .paso > .editPaso:before {
        display: table-cell;
        vertical-align: middle;
    }


/*YQUINTEROS | Mantenedor MD
    .actividad:hover > .editActividad, .paso:hover > .editPaso {
    visibility: visible;
    opacity: 1;
    right: 0px;
}*/

.actividad:hover > .editActividad:hover, .paso:hover > .editPaso:hover {
    background-color: #FF5722;
}

.actividad > .panelEditActividad, .paso > .panelEditPaso {
    width: 100%;
    height: 100%;
    background-color: inherit;
    position: absolute;
    z-index: 1;
    display: block;
    left: 100%;
    top: 0;
    box-sizing: border-box;
    padding: 5px;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

    .actividad > .panelEditActividad.open, .paso > .panelEditPaso.open {
        left: 0px;
        visibility: visible;
        opacity: 1;
    }

    .actividad > .panelEditActividad > textarea, .paso > .panelEditPaso > textarea {
        border: none;
        border-radius: 4px;
        height: 100%;
        box-sizing: border-box;
        resize: none;
        color: #666;
        text-transform: uppercase;
    }

    .actividad > .panelEditActividad > span, .paso > .panelEditPaso > span {
        display: block;
        position: absolute;
        right: 0;
        top: 0;
        height: 100%;
    }

        .actividad > .panelEditActividad > span > i, .paso > .panelEditPaso > span > i {
            width: 100%;
            height: 50%;
            display: table;
            font-size: 15px;
            text-align: center;
            color: #FFF;
        }

            .actividad > .panelEditActividad > span > i:first-child, .paso > .panelEditPaso > span > i:first-child {
                background-color: #43A047;
            }

            .actividad > .panelEditActividad > span > i:last-child, .paso > .panelEditPaso > span > i:last-child {
                background-color: #EF5350;
            }

            .actividad > .panelEditActividad > span > i:first-child:hover, .paso > .panelEditPaso > span > i:first-child:hover {
                background-color: #388E3C;
            }

            .actividad > .panelEditActividad > span > i:last-child:hover, .paso > .panelEditPaso > span > i:last-child:hover {
                background-color: #E53935;
            }

            .actividad > .panelEditActividad > span > i:before, .paso > .panelEditPaso > span > i:before {
                display: table-cell;
                vertical-align: middle;
            }

    .actividad > .panelEditActividad.open > textarea.vacio, .paso > .panelEditPaso.open > textarea.vacio {
        -webkit-animation: -moz-animation:shake 0.82s cubic-bezier(.36,.07,.19,.97) both;
        -o-animation: shake 0.82s cubic-bezier(.36,.07,.19,.97) both;
        animation: shake 0.82s cubic-bezier(.36,.07,.19,.97) both;
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        backface-visibility: hidden;
        perspective: 1000px;
    }

@keyframes shake {
    10%, 90% {
        -webkit-transform: translate3d(-1px, 0, 0);
        -moz-transform: translate3d(-1px, 0, 0);
        -ms-transform: translate3d(-1px, 0, 0);
        -o-transform: translate3d(-1px, 0, 0);
        transform: translate3d(-1px, 0, 0);
    }

    20%, 80% {
        -webkit-transform: translate3d(2px, 0, 0);
        -moz-transform: translate3d(2px, 0, 0);
        -ms-transform: translate3d(2px, 0, 0);
        -o-transform: translate3d(2px, 0, 0);
        transform: translate3d(2px, 0, 0);
    }

    30%, 50%, 70% {
        -webkit-transform: translate3d(-4px, 0, 0);
        -moz-transform: translate3d(-4px, 0, 0);
        -ms-transform: translate3d(-4px, 0, 0);
        -o-transform: translate3d(-4px, 0, 0);
        transform: translate3d(-4px, 0, 0);
    }

    40%, 60% {
        -webkit-transform: translate3d(4px, 0, 0);
        -moz-transform: translate3d(4px, 0, 0);
        -ms-transform: translate3d(4px, 0, 0);
        -o-transform: translate3d(4px, 0, 0);
        transform: translate3d(4px, 0, 0);
    }
}


.imgSlide .editMedia {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: #FFA726;
    display: table;
    text-align: center;
    position: absolute;
    right: 50px; /*YQUINTEROS | Mantenedor MD*/
    top: 10px;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    -ms-transform: scale(1,1); /* IE 9 */
    -webkit-transform: scale(1,1); /* Chrome, Safari, Opera */
    transform: scale(1,1);
    color: #FFF;
}

.FullScreen .imgSlide .editMedia {
    display: none;
}

.imgSlide .editMedia:before {
    display: table-cell;
    vertical-align: middle;
    font-size: 20px;
}

.imgSlide .editMedia:hover {
    cursor: pointer;
    -webkit-box-shadow: 0 5px 20px -3px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 0 5px 20px -3px rgba(0, 0, 0, 0.3);
    box-shadow: 0 5px 20px -3px rgba(0, 0, 0, 0.3);
    background-color: #FB8C00;
    -ms-transform: scale(1.07,1.07); /* IE 9 */
    -webkit-transform: scale(1.07,1.07); /* Chrome, Safari, Opera */
    transform: scale(1.07,1.07);
}

#tabImagen .panelEditMedia {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    background-color: rgba(255, 255, 255, 0.9);
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    visibility: hidden;
    opacity: 0;
}

    #tabImagen .panelEditMedia.open {
        visibility: visible;
        opacity: 1;
    }

    #tabImagen .panelEditMedia > div {
        width: 90%;
        height: 90%;
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        margin: auto;
        background-color: #FFF;
        border-style: solid;
        box-sizing: border-box;
        border-color: #DDD;
        border-width: 1px;
        -webkit-box-shadow: 0 0px 55px -10px rgba(0, 0, 0, 0.15), 0 0px 28px -15px rgba(0, 0, 0, 0.1);
        -moz-box-shadow: 0 0px 55px -10px rgba(0, 0, 0, 0.15), 0 0px 28px -15px rgba(0, 0, 0, 0.1);
        box-shadow: 0 0px 55px -10px rgba(0, 0, 0, 0.15), 0 0px 28px -15px rgba(0, 0, 0, 0.1);
        padding: 10px;
        box-sizing: border-box;
    }

        #tabImagen .panelEditMedia > div > h1 {
            text-align: center;
            height: 30px;
            margin: 10px 0px;
        }

        #tabImagen .panelEditMedia > div > div:nth-child(2) {
            text-align: center;
            width: 100%;
            height: -moz-calc(100% - 200px);
            height: -webkit-calc(100% - 200px);
            height: -o-calc(100% - 200px);
            height: calc(100% - 200px);
            background-position: center;
            background-repeat: no-repeat;
            background-size: contain;
            border: 2px dashed #CCC;
            position: relative;
        }

            #tabImagen .panelEditMedia > div > div:nth-child(2) > input {
                opacity: 0;
                position: absolute;
                left: 0;
                top: 0;
                z-index: 1;
                width: 100%;
                height: 100%;
                cursor: pointer !important;
            }

            #tabImagen .panelEditMedia > div > div:nth-child(2) > i {
                color: #FFF;
                left: 0;
                right: 0;
                top: 0;
                bottom: 0;
                margin: auto;
                position: absolute;
                width: 60px;
                height: 60px;
                font-size: 60px;
                opacity: 0;
                visibility: hidden;
                -webkit-transition: all 0.4s ease-in-out;
                -moz-transition: all 0.4s ease-in-out;
                -o-transition: all 0.4s ease-in-out;
                -ms-transition: all 0.4s ease-in-out;
                transition: all 0.4s ease-in-out;
            }

            #tabImagen .panelEditMedia > div > div:nth-child(2):hover > i {
                opacity: 1;
                visibility: visible;
                cursor: pointer;
            }

            #tabImagen .panelEditMedia > div > div:nth-child(2):before {
                content: "";
                position: absolute;
                left: 0;
                top: 0;
                width: 100%;
                height: 100%;
                background-color: rgba(0,0,0,0.4);
                visibility: hidden;
                opacity: 0;
                -webkit-transition: all 0.4s ease-in-out;
                -moz-transition: all 0.4s ease-in-out;
                -o-transition: all 0.4s ease-in-out;
                -ms-transition: all 0.4s ease-in-out;
                transition: all 0.4s ease-in-out;
            }

            #tabImagen .panelEditMedia > div > div:nth-child(2):hover:before {
                opacity: 1;
                visibility: visible;
                cursor: pointer;
            }

            #tabImagen .panelEditMedia > div > div:nth-child(2):hover {
                border-color: #555;
            }

        #tabImagen .panelEditMedia > div > textarea:nth-child(3) {
            width: 100%;
            height: 80px;
            margin-top: 10px;
            box-sizing: border-box;
            border: 1px solid #DDD;
            border-radius: 3px;
            padding: 5px;
            resize: none;
        }

.imgSlide > img {
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.imgSlide.open > img {
    -webkit-filter: blur(3px);
    -moz-filter: blur(3px);
    -o-filter: blur(3px);
    -ms-filter: blur(3px);
    filter: blur(3px);
}

.nombreMD {
    display: table;
    position: absolute;
    width: 250px;
    height: 40px;
    left: -255px;
    font-size: 13px;
    line-height: 12px;
    color: #FFF;
    background-color: rgba(255, 255, 255, 0.1);
    border-radius: 4px;
    padding: 5px;
    box-sizing: border-box;
    text-align: center;
}

    .nombreMD > span {
        display: table-cell;
        vertical-align: middle;
    }

.ui-tabs .ui-tabs-panel {
    padding: 0px !important;
}

.chosen-container.requerido > .chosen-single, input.control.requerido, select.requerido, textarea.control.requerido,
.multibox.requerido, .fileUpload.requerido, .tboxGroup.requerido {
    background-color: #ffe0e0 !important;
    border-color: #ffb8b8 !important;
}

    .fileUpload.requerido > input:nth-child(2), .tboxGroup.requerido > input {
        background-color: #ffe0e0 !important;
    }

.chosen-disabled .chosen-single {
    background-color: #f5f5f5 !important;
    border-color: #ddd;
}

body .chosen-disabled {
    opacity: 1 !important;
}

.chosen-disabled.requerido .chosen-single {
    background-color: #f5f5f5 !important;
    border-color: #ffb8b8 !important;
}

.chosen-disabled .chosen-single, input[type="text"]:disabled, textarea:disabled, select:disabled {
    cursor: no-drop !important;
}

.formulario > .aviso {
    position: absolute;
    width: 100%;
    height: 100%;
    display: table;
    left: 0;
    top: 0;
    background-color: rgba(247, 247, 247, 0.8);
    z-index: 1;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}

.formulario.editlock:hover > .aviso {
    opacity: 1;
    visibility: visible;
}

.formulario.editlock > *:not(.aviso):not(.Cerrar) {
    -webkit-filter: blur(0px);
    -moz-filter: blur(0px);
    -o-filter: blur(0px);
    -ms-filter: blur(0px);
    filter: blur(0px);
    -webkit-transition: -webkit-filter 0.4s ease-in-out;
    -moz-transition: -moz-filter 0.4s ease-in-out;
    -o-transition: -o-filter 0.4s ease-in-out;
    -ms-transition: -ms-filter 0.4s ease-in-out;
    transition: filter 0.4s ease-in-out;
}

.formulario.editlock:hover > *:not(.aviso):not(.Cerrar) {
    -webkit-filter: blur(3px);
    -moz-filter: blur(3px);
    -o-filter: blur(3px);
    -ms-filter: blur(3px);
    filter: blur(3px);
}


.formulario > .aviso > span {
    display: table-cell;
    vertical-align: middle;
    padding: 5%;
    font-size: 20px;
    text-align: center;
}

.cambioEventoOS {
    position: fixed;
    display: inline-block;
    opacity: 0;
    visibility: hidden;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 10;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}

    .cambioEventoOS.open {
        visibility: visible;
        opacity: 1;
    }

    .cambioEventoOS:before {
        content: "";
        position: absolute;
        display: inline-block;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0,0,0,0.4);
        z-index: 0;
    }

    .cambioEventoOS > div {
        width: 95%;
        max-width: 800px;
        height: 400px;
        background-color: #FDFDFD;
        z-index: 1;
        display: inline-block;
        position: absolute;
        left: 0;
        top: 0;
        right: 0;
        bottom: 0;
        margin: auto;
        padding: 15px;
        padding-top: 32px;
        padding-right: 0;
        box-sizing: border-box;
        -webkit-box-shadow: 0px 4px 10px 0px rgba(50, 50, 50, 0.5);
        -moz-box-shadow: 0px 4px 10px 0px rgba(50, 50, 50, 0.5);
        box-shadow: 0px 4px 10px 0px rgba(50, 50, 50, 0.5);
        -webkit-transition: all 0.4s ease-in-out;
        -moz-transition: all 0.4s ease-in-out;
        -o-transition: all 0.4s ease-in-out;
        -ms-transition: all 0.4s ease-in-out;
        transition: all 0.4s ease-in-out;
        -ms-transform: scale(0.8);
        -webkit-transform: scale(0.8);
        transform: scale(0.8);
    }

    .cambioEventoOS.open > div {
        -ms-transform: scale(1);
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    .cambioEventoOS > div > div > div {
        width: 100%;
        overflow-x: auto;
    }

    .cambioEventoOS > div > div {
        overflow-y: auto;
        height: 100%;
        padding-right: 15px;
    }



.contactoOS {
    width: 80%;
    border-radius: 3px;
    box-sizing: border-box;
    display: inline-block;
    text-align: left;
    margin-bottom: 15px;
    -webkit-box-shadow: 0px 4px 7px -2px rgba(50, 50, 50, 0.1);
    -moz-box-shadow: 0px 4px 7px -2px rgba(50, 50, 50, 0.1);
    box-shadow: 0px 4px 7px -2px rgba(50, 50, 50, 0.1));
    position: relative;
    opacity: 0;
    visibility: hidden;
    left: 100px;
    -webkit-transition: all 0.6s ease-in-out;
    -moz-transition: all 0.6s ease-in-out;
    -o-transition: all 0.6s ease-in-out;
    -ms-transition: all 0.6s ease-in-out;
    transition: all 0.6s ease-in-out;
}

    .contactoOS > i {
        width: 50px;
        height: 50px;
        position: absolute;
        top: 15px;
        left: -100px;
        border-radius: 50%;
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        -webkit-box-shadow: 0px 2px 9px -2px rgba(50, 50, 50, 0.5);
        -moz-box-shadow: 0px 2px 9px -2px rgba(50, 50, 50, 0.5);
        box-shadow: 0px 2px 9px -2px rgba(50, 50, 50, 0.5);
        border: 1px solid #42b28b;
        opacity: 0;
        visibility: hidden;
        -webkit-transition: all 0.6s ease-in-out;
        -moz-transition: all 0.6s ease-in-out;
        -o-transition: all 0.6s ease-in-out;
        -ms-transition: all 0.6s ease-in-out;
        transition: all 0.6s ease-in-out;
    }

    .contactoOS.anima {
        left: 0;
        visibility: visible;
        opacity: 1;
    }

        .contactoOS.anima > i {
            left: 10px;
            visibility: visible;
            opacity: 1;
        }

    .contactoOS > span:nth-child(2) {
        width: 100%;
        height: 40px;
        line-height: 30px;
        display: inline-block;
        padding: 5px;
        box-sizing: border-box;
        background-color: #888;
        color: #FFF;
        border-radius: 3px 3px 0px 0px;
        padding-left: 70px;
    }

    .contactoOS > span:nth-child(3) {
        width: 100%;
        height: 40px;
        line-height: 30px;
        display: inline-block;
        padding: 5px;
        box-sizing: border-box;
        background-color: #9C9C9C;
        color: #FFF;
        padding-left: 70px;
    }

    .contactoOS > div {
        border-color: #BCBCBC;
        border-style: solid;
        border-width: 0px 1px 1px 1px;
        box-sizing: border-box;
        border-radius: 0px 0px 3px 3px;
    }

        .contactoOS > div > span {
            width: 100%;
            min-height: 30px;
            line-height: 20px;
            padding: 5px;
            display: inline-block;
            box-sizing: border-box;
            padding-left: 25px;
            position: relative;
        }

            .contactoOS > div > span:before {
                content: "";
                display: inline-block;
                position: absolute;
                background-color: #42b28b;
                width: 7px;
                height: 7px;
                border-radius: 50%;
                left: 10px;
                top: -4px;
                bottom: 0;
                margin: auto;
            }

.panelComponente .btnEditComponente {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 30px;
    height: 25px;
    background-color: #F5F5F5;
    line-height: 25px;
    text-align: center;
    border-radius: 5px;
    border: 1px solid #AAA;
    box-sizing: border-box;
}

    .panelComponente .btnEditComponente:hover {
        background-color: #FFF;
        color: #4c95ff;
    }

.panelComponente .btnElimComponente {
    position: absolute;
    top: 10px;
    right: 50px;
    width: 30px;
    height: 25px;
    background-color: #F5F5F5;
    line-height: 25px;
    text-align: center;
    border-radius: 5px;
    border: 1px solid #AAA;
    box-sizing: border-box;
}

    .panelComponente .btnElimComponente:hover {
        background-color: #FFF;
        color: #EF5350;
    }

.error {
    width: 100%;
    height: 50px;
    display: table;
    background-color: #E57373;
    color: #FFF;
    font-size: 15px;
    position: absolute;
    top: 0px;
    left: 0;
    z-index: 5;
    text-align: left;
}

    .error > i {
        display: table-cell;
        vertical-align: middle;
        padding-left: 10px;
        font-style: normal;
        text-transform: none;
    }

        .error > i:first-child {
            text-align: right;
        }


.soloVista input[type="text"]:disabled, .soloVista textarea:disabled, .soloVista select:disabled, .soloVista .chosen-disabled .chosen-single {
    background-color: #F9F9F9 !important;
    border: none !important;
    cursor: default !important;
}

    .soloVista .chosen-disabled .chosen-single > span {
        background-image: none;
    }

.formularioAgrupador #paso1 {
    background-color: #F5F5F5;
    width: 100%;
    border-left: 3px solid #FF9800;
    display: table;
    position: relative;
    box-sizing: border-box;
}

.formularioAgrupador #paso2 {
    background-color: #F1F1F1;
    width: 100%;
    border-left: 3px solid #03A9F4;
    display: table;
    position: relative;
    box-sizing: border-box;
}

    .formularioAgrupador #paso2.lock:before {
        content: "";
        position: absolute;
        width: 100%;
        height: 100%;
        left: 0;
        top: 0;
        background-color: rgba(255,255,255,0.4);
        z-index: 10;
    }

    .formularioAgrupador #paso2.lock {
        opacity: 0.8;
    }

    .formularioAgrupador #paso1 > div, .formularioAgrupador #paso2 > div {
        display: table-cell;
        vertical-align: middle;
        text-align: center;
        padding-bottom: 10px;
    }

        .formularioAgrupador #paso1 > div:first-child, .formularioAgrupador #paso2 > div:first-child {
            width: 70px;
        }

        .formularioAgrupador #paso1 > div:first-child {
            background-color: #e8e8e8;
        }

        .formularioAgrupador #paso2 > div:first-child {
            background-color: #e0e0e0;
        }

        .formularioAgrupador #paso1 > div:last-child, .formularioAgrupador #paso2 > div:last-child {
            width: -moz-calc(100% - 70px);
            width: -webkit-calc(100% - 70px);
            width: calc(100% -70px);
        }

.formularioAgrupador i.numero {
    width: 50px;
    height: 50px;
    display: inline-block;
    border-radius: 50%;
    line-height: 50px;
    text-align: center;
    color: #FFF;
    font-size: 25px;
    font-style: normal;
    background-color: #999;
}

.formularioAgrupador #paso1 i.numero {
    background-color: #FF9800;
}

.formularioAgrupador #paso2 i.numero {
    background-color: #03A9F4;
}

.btnOpciones {
    display: inline-block;
}

    .btnOpciones > a {
        padding: 5px 10px;
        border-style: solid;
        border-color: #999;
        background-color: #FFF;
        float: left;
        cursor: pointer;
        color: inherit;
        text-decoration: none;
        text-transform: uppercase;
        font-size: 12px;
    }

        .btnOpciones > a.selected {
            color: #FFF;
            background-color: #999;
        }

        .btnOpciones > a:first-child {
            border-width: 1px;
            border-radius: 15px 0px 0px 15px;
        }

        .btnOpciones > a:last-child {
            border-radius: 0px 15px 15px 0px;
        }

        .btnOpciones > a:not(:first-child) {
            border-width: 1px 1px 1px 0px;
        }

.listadoGrupos {
    width: 100%;
    overflow: auto;
    padding: 5px;
    box-sizing: border-box;
    margin-top: 10px;
    position: relative;
}

.listadoGruposOS {
    width: 100%;
    overflow: auto;
    padding: 5px;
    box-sizing: border-box;
    margin-top: 10px;
    position: relative;
}

.listadoGrupos a {
    display: inline-block;
    width: 100%;
    height: 40px;
    line-height: 40px;
    background-color: #FFF;
    border-radius: 2px;
    text-align: left;
    padding-left: 40px;
    box-sizing: border-box;
    margin-bottom: 4px;
    text-decoration: none;
    text-transform: uppercase;
    position: relative;
    border: 1px solid #DDD;
}

    .listadoGrupos a.selected {
        background-color: #999;
        color: #FFF;
    }

    .listadoGrupos a:before {
        content: "\f096";
        position: absolute;
        display: inline-block;
        font: normal normal normal 14px/1 FontAwesome;
        font-size: inherit;
        text-rendering: auto;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        left: 15px;
        top: 0;
        bottom: 0;
        margin: auto;
        width: 15px;
        height: 15px;
        font-size: 15px;
        text-align: center;
        color: #EEE;
        z-index: 1;
    }

    .listadoGrupos a.selected:before {
        content: "\f0c8";
    }

    .listadoGrupos a.selected:after {
        content: "\f00c";
        position: absolute;
        display: inline-block;
        font: normal normal normal 14px/1 FontAwesome;
        font-size: inherit;
        text-rendering: auto;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        left: 15px;
        top: 0;
        bottom: 0;
        margin: auto;
        width: 15px;
        height: 15px;
        font-size: 15px;
        text-align: center;
        color: #03a9f4;
        z-index: 2;
    }



.buscador {
    display: table;
    background-color: #FFF;
    border-radius: 20px;
    max-width: 350px;
    width: 100%;
    text-decoration: none;
    -webkit-transition: all 0.6s ease-in-out;
    -moz-transition: all 0.6s ease-in-out;
    -o-transition: all 0.6s ease-in-out;
    -ms-transition: all 0.6s ease-in-out;
    transition: all 0.6s ease-in-out;
    overflow: hidden;
}

    .buscador > i {
        display: table-cell;
        vertical-align: middle;
        width: 40px;
        text-align: center;
    }

    .buscador > input {
        display: table-cell;
        vertical-align: middle;
        border: none;
        border-radius: 0px 20px 20px 0px;
        height: 30px;
        line-height: 30px;
        width: 100%;
    }

    .buscador > a {
        width: 70px;
        display: table-cell;
        vertical-align: middle;
        text-decoration: none;
        background-color: #999;
        color: #FFF !important;
        text-align: center;
        -webkit-transition: all 0.4s ease-in-out;
        -moz-transition: all 0.4s ease-in-out;
        -o-transition: all 0.4s ease-in-out;
        -ms-transition: all 0.4s ease-in-out;
        transition: all 0.4s ease-in-out;
    }

        .buscador > a:hover {
            background-color: #2196F3;
        }

    .buscador > input:focus {
        border: none;
        outline: none;
    }

    .buscador.focus {
        -webkit-box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
        -moz-box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
        box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
    }

.panelConfiguracionAgrupador {
    width: 100%;
}

    .panelConfiguracionAgrupador > span {
        display: inline-block;
        width: 100%;
        padding: 5px 10px;
        text-align: left;
        box-sizing: border-box;
        font-size: inherit;
        text-transform: uppercase;
    }

        .panelConfiguracionAgrupador > span > i {
            color: #388E3C;
            font-style: normal;
            padding-left: 5px;
        }

.listadoGruposOS > a {
    width: 100%;
    min-height: 120px;
    border: 1px solid #DDD;
    box-sizing: border-box;
    border-radius: 3px;
    background-color: #FFF;
    border-left: 3px solid #BDBDBD;
    padding-left: 50px;
    position: relative;
    cursor: pointer;
    padding-bottom: 10px;
    text-decoration: none;
    display: block;
}

    .listadoGruposOS > a.selected {
        border-left-color: #999;
    }

    .listadoGruposOS > a:before {
        content: "\f096";
        position: absolute;
        display: inline-block;
        font: normal normal normal 14px/1 FontAwesome;
        font-size: inherit;
        text-rendering: auto;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        left: 15px;
        top: 0;
        bottom: 0;
        margin: auto;
        height: 17px;
        font-size: 18px;
        color: #DDD;
        cursor: pointer;
    }

    .listadoGruposOS > a:after {
        content: "\f00c";
        position: absolute;
        display: inline-block;
        font: normal normal normal 14px/1 FontAwesome;
        font-size: inherit;
        text-rendering: auto;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        left: 15px;
        top: 0;
        bottom: 0;
        margin: auto;
        height: 20px;
        font-size: 18px;
        color: #2196F3;
        cursor: pointer;
        opacity: 0;
        visibility: hidden;
    }

    .listadoGruposOS > a.selected:after {
        visibility: visible;
        opacity: 1;
    }

    .listadoGruposOS > a > h3 {
        border-bottom: 1px solid #EEE;
        text-align: left;
        text-transform: uppercase;
    }

    .listadoGruposOS > a > div {
        width: 100%;
    }

        .listadoGruposOS > a > div > span {
            display: inline-block;
            width: 100%;
            padding: 3px;
            box-sizing: border-box;
            text-align: left;
        }

            .listadoGruposOS > a > div > span > i {
                width: 150px;
                display: inline-block;
                font-style: normal;
                font-weight: bold;
            }

.btn3 {
    width: 100px;
    height: 30px;
    line-height: 30px;
    background-color: #FFF;
    border: 1px solid #888;
    border-radius: 15px;
    box-sizing: border-box;
    display: inline-block;
    text-decoration: none;
    color: #888 !important;
    text-align: center;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
    text-transform: capitalize;
}

    .btn3 > i {
        margin-right: 5px;
    }

    .btn3.btnVerde3 {
        border: 1px solid #4caf50;
        color: #4caf50 !important;
    }

    .btn3:hover, .btn3:focus {
        -webkit-box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
        -moz-box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
        box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
    }

    .btn3.btnVerde3:hover, .btn3.btnVerde3:focus {
        background-color: #4caf50;
        color: #FFF !important;
    }

    .btn3:hover, .btn3:focus {
        background-color: #888;
        color: #FFF !important;
    }

.sinResultados2 {
    width: 100%;
    height: 40px;
    line-height: 40px;
    display: inline-block;
    border: 1px solid #DDD;
    border-radius: 3px;
    background-color: #EEE;
    border-left-width: 3px;
    border-left-color: #AAA;
    text-align: left;
    padding-left: 15px;
    box-sizing: border-box;
}

    .sinResultados2 > i {
        margin-right: 10px;
    }

.panelDetalleGrupoOS, .panelDetalleGrupo {
    border-radius: 0px 5px 5px 0px;
    background-color: #F5F5F5;
    margin-bottom: 10px;
    padding: 10px;
    box-sizing: border-box;
    text-transform: uppercase;
    border-left: 3px solid #2196F3;
}

    .panelDetalleGrupoOS > div, .panelDetalleGrupo > div {
        width: 100%;
        display: block;
    }

        .panelDetalleGrupoOS > div > span, .panelDetalleGrupo > div > span {
            display: inline-block;
            border-bottom: 1px solid #DDD;
            width: 100%;
            padding-top: 5px;
            margin-bottom: 10px;
        }

            .panelDetalleGrupoOS > div > span > i, .panelDetalleGrupo > div > span > i {
                font-style: normal;
                font-weight: bold;
            }

        .panelDetalleGrupoOS > div > div, .panelDetalleGrupo > div > div {
            background-color: #FFF;
            border-left: 2px solid #FF9800;
            padding: 10px;
            margin-bottom: 5px;
            width: 100%;
            box-sizing: border-box;
        }

            .panelDetalleGrupoOS > div > div > span, .panelDetalleGrupo > div > div > span {
                width: 100%;
                display: inline-block;
                font-weight: bold;
                margin-bottom: 5px;
            }

            .panelDetalleGrupoOS > div > div > i, .panelDetalleGrupo > div > div > i {
                width: 100%;
                display: inline-block;
                margin-bottom: 2px;
                font-style: normal;
            }

                .panelDetalleGrupoOS > div > div > i > i, .panelDetalleGrupo > div > div > i > i {
                    margin-right: 5px;
                }
        /*27-03-2020 | YQuinteros*/
        .panelDetalleGrupo > div > span > i.btn {
            margin-top: -10px;
            float: right;
            margin-bottom: 10px;
            min-width: auto;
        }

        .panelDetalleGrupo > div > div {
            display: none;
        }

.panelAdministrarGrupo > div {
    text-transform: uppercase;
    padding: 3px;
    box-sizing: border-box;
}

.panelListadoOSGrupo {
    width: 100%;
    height: 200px;
    overflow: auto;
}

    .panelListadoOSGrupo > a {
        display: block;
        width: 100%;
        height: 80px;
        border: 1px solid #DDD;
        box-sizing: border-box;
        border-radius: 0px 5px 5px 0px;
        border-left-width: 4px;
        border-left-color: #999;
        margin-bottom: 10px;
        background-color: #F5F5F5;
        text-transform: uppercase;
        overflow: hidden;
        position: relative;
    }

        .panelListadoOSGrupo > a > span:not(.quitarOSGrupo) {
            width: 100%;
            display: inline-block;
            padding: 2px 2px 2px 10px;
            box-sizing: border-box;
            padding-right: 30px;
        }

        .panelListadoOSGrupo > a > span:first-child {
            font-size: 15px;
            margin-bottom: 5px;
            background-color: #FFF;
            border-bottom: 1px solid #DDD;
            padding: 5px 5px 5px 10px;
            padding-right: 30px;
        }

        .panelListadoOSGrupo > a > span > i {
            font-style: normal;
        }

        .panelListadoOSGrupo > a:hover {
            border-left-color: #2196F3;
        }

        .panelListadoOSGrupo > a > span.quitarOSGrupo {
            width: 30px;
            display: inline-block;
            height: 100%;
            position: absolute;
            right: 0;
            top: 0;
            background-color: #DDD;
            background-image: url(../../images/Util/close.png);
            background-size: 17px;
            background-position: center;
            background-repeat: no-repeat;
            -webkit-transition: all 0.4s ease-in-out;
            -moz-transition: all 0.4s ease-in-out;
            -o-transition: all 0.4s ease-in-out;
            -ms-transition: all 0.4s ease-in-out;
            transition: all 0.4s ease-in-out;
        }

        .panelListadoOSGrupo > a:hover > span.quitarOSGrupo {
            background-color: #AAA;
        }

            .panelListadoOSGrupo > a:hover > span.quitarOSGrupo:hover {
                background-color: #F44336;
                cursor: pointer;
            }

.panelAdministrarGrupo #buscadorGrupo, .panelAdministrarGrupo #buscadorAgregarOsGrupo {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background-color: #F5F5F5;
    z-index: 1;
    padding-top: 60px;
    transform: scale(0.7);
    -webkit-transform: scale(0.7);
    -moz-transform: scale(0.7);
    -o-transform: scale(0.7);
    -ms-transform: scale(0.7);
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

    .panelAdministrarGrupo #buscadorGrupo.open, .panelAdministrarGrupo #buscadorAgregarOsGrupo.open {
        transform: scale(1);
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -o-transform: scale(1);
        -ms-transform: scale(1);
        opacity: 1;
        visibility: visible;
    }

/*Estilos para los presupuestos*/
.presupuestor2 {
    position: relative;
    display: table;
    width: 80%;
    margin-left: 10%;
    min-height: 200px;
    border: 1px solid #EEE;
    border-radius: 3px;
    background-color: #fdfdfd;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}

    .presupuestor2:hover {
        -webkit-box-shadow: 0px 5px 15px -2px rgba(50, 50, 50, 0.1);
        -moz-box-shadow: 0px 5px 15px -2px rgba(50, 50, 50, 0.1);
        box-shadow: 0px 5px 15px -2px rgba(50, 50, 50, 0.1);
    }

    .presupuestor2 > div {
        display: table-cell;
    }

        .presupuestor2 > div:nth-child(1) {
            vertical-align: middle;
            width: 150px;
            height: 100%;
        }

        .presupuestor2 > div:nth-child(2) {
            width: -moz-calc(100% - 150px);
            width: -webkit-calc(100% - 150px);
            width: calc(100% -150px);
            border-left: 1px solid #EEE;
        }

        .presupuestor2 > div:nth-child(1) > a {
            width: 100%;
            height: 100%;
            display: block;
            position: relative;
        }

            .presupuestor2 > div:nth-child(1) > a > img {
                width: 100%;
                top: 0;
                bottom: 0;
                margin: auto;
                position: absolute;
                z-index: 1;
                -webkit-transition: all 0.4s ease-in-out;
                -moz-transition: all 0.4s ease-in-out;
                -o-transition: all 0.4s ease-in-out;
                -ms-transition: all 0.4s ease-in-out;
                transition: all 0.4s ease-in-out;
            }

            .presupuestor2 > div:nth-child(1) > a:hover > img {
                -webkit-filter: blur(3px);
                -moz-filter: blur(3px);
                -o-filter: blur(3px);
                -ms-filter: blur(3px);
                filter: blur(3px);
            }

            .presupuestor2 > div:nth-child(1) > a > span {
                width: 100%;
                height: 100%;
                position: absolute;
                z-index: 2;
                background-color: rgba(255,255,255,0.85);
                text-align: center;
                opacity: 0;
                visibility: hidden;
                -webkit-transition: all 0.4s ease-in-out;
                -moz-transition: all 0.4s ease-in-out;
                -o-transition: all 0.4s ease-in-out;
                -ms-transition: all 0.4s ease-in-out;
                transition: all 0.4s ease-in-out;
            }

            .presupuestor2 > div:nth-child(1) > a:hover > span {
                visibility: visible;
                opacity: 1;
            }

            .presupuestor2 > div:nth-child(1) > a > span > i {
                width: 100%;
                text-align: center;
                position: absolute;
                left: 0;
                margin: auto;
            }

                .presupuestor2 > div:nth-child(1) > a > span > i:nth-child(1) {
                    top: -25px;
                    bottom: 0;
                    height: 30px;
                    font-size: 30px;
                    color: #009688;
                }

                .presupuestor2 > div:nth-child(1) > a > span > i:nth-child(2) {
                    top: 0px;
                    bottom: -25px;
                    height: 15px;
                    font-size: 13px;
                    color: #777;
                    text-transform: uppercase;
                    font-style: normal;
                }

        .presupuestor2 > div:nth-child(2) > h2, .presupuestor2 > div:nth-child(2) > span {
            width: 100%;
            padding-left: 10px;
            display: block;
        }

        .presupuestor2 > div:nth-child(2) > span {
            padding: 2px 2px 2px 10px;
            box-sizing: border-box;
        }

            .presupuestor2 > div:nth-child(2) > span > i:first-child {
                width: 120px;
                font-style: normal;
                display: inline-block;
                font-weight: bold;
            }

            .presupuestor2 > div:nth-child(2) > span > i:last-child {
                font-style: normal;
                display: inline-block;
                margin-left: 5px;
            }

        .presupuestor2 > div:nth-child(2) > h2 {
            text-transform: uppercase;
            box-sizing: border-box;
        }

    .presupuestor2.aprobado {
        border-left: 3px solid #388e3c;
    }

    .presupuestor2.rechazado {
        border-left: 3px solid #F44336;
    }

    .presupuestor2.publicado {
        border-left: 3px solid #2196F3;
    }

    .presupuestor2.pendiente {
        border-left: 3px solid #757575;
    }

.presupuestor3 {
    width: 80%;
    margin-left: 10%;
}

    .presupuestor3 > h1 {
        text-transform: uppercase;
    }

    .presupuestor3 > div > div {
        border: 1px solid #EEE;
        border-left: 3px solid #EEE;
        min-height: 140px;
        display: table;
        width: 100%;
        border-radius: 3px;
        margin-bottom: 10px;
    }

        .presupuestor3 > div > div:first-child {
            opacity: 1;
        }

        .presupuestor3 > div > div:not(:first-child) {
            display: none;
            opacity: 0.85;
        }

            .presupuestor3 > div > div:not(:first-child):hover {
                opacity: 1;
            }

        .presupuestor3 > div > div.aprobado {
            border-left-color: #388e3c;
        }

        .presupuestor3 > div > div.rechazado {
            border-left-color: #F44336;
        }

        .presupuestor3 > div > div.publicado {
            border-left-color: #2196F3;
        }

        .presupuestor3 > div > div.aprobado > div:last-child > span {
            color: #388e3c;
        }

        .presupuestor3 > div > div.rechazado > div:last-child > span {
            color: #F44336;
        }

        .presupuestor3 > div > div.publicado > div:last-child > span > i {
            color: #2196F3;
        }

        .presupuestor3 > div > div > div,
        .presupuestor3 > div > div > a {
            display: table-cell;
        }

            .presupuestor3 > div > div > a:first-child {
                vertical-align: middle;
                width: 130px;
                border-right: 1px solid #EEE;
                position: relative;
            }

                .presupuestor3 > div > div > a:first-child > img {
                    vertical-align: middle;
                    width: 100%;
                    height: auto;
                    -webkit-transition: all 0.4s ease-in-out;
                    -moz-transition: all 0.4s ease-in-out;
                    -o-transition: all 0.4s ease-in-out;
                    -ms-transition: all 0.4s ease-in-out;
                    transition: all 0.4s ease-in-out;
                }

                .presupuestor3 > div > div > a:first-child:hover > img {
                    -webkit-filter: blur(3px);
                    -moz-filter: blur(3px);
                    -o-filter: blur(3px);
                    -ms-filter: blur(3px);
                    filter: blur(3px);
                }

                .presupuestor3 > div > div > a:first-child > span {
                    position: absolute;
                    z-index: 1;
                    width: 100%;
                    height: 100%;
                    display: block;
                    top: 0;
                    left: 0;
                    background-color: rgba(255, 255, 255, 0.85);
                    opacity: 0;
                    visibility: hidden;
                    -webkit-transition: all 0.4s ease-in-out;
                    -moz-transition: all 0.4s ease-in-out;
                    -o-transition: all 0.4s ease-in-out;
                    -ms-transition: all 0.4s ease-in-out;
                    transition: all 0.4s ease-in-out;
                    color: #666;
                }

                    .presupuestor3 > div > div > a:first-child > span > i:first-child {
                        text-align: center;
                        width: 100%;
                        font-size: 30px;
                        position: absolute;
                        top: 50%;
                        margin-top: -30px;
                    }

                    .presupuestor3 > div > div > a:first-child > span > i:last-child {
                        text-align: center;
                        width: 100%;
                        display: inline-block;
                        text-transform: uppercase;
                        font-style: normal;
                        position: absolute;
                        top: 50%;
                        padding-top: 5px;
                    }

                .presupuestor3 > div > div > a:first-child:hover > span {
                    opacity: 1;
                    visibility: visible;
                }

            .presupuestor3 > div > div > div:last-child > span {
                width: 100%;
                height: 50px;
                display: block;
                border-bottom: 1px solid #EEE;
                margin-bottom: 10px;
                box-sizing: border-box;
                position: relative;
                text-align: right;
            }

                .presupuestor3 > div > div > div:last-child > span a {
                    -webkit-user-select: none;
                    -moz-user-select: none;
                    -ms-user-select: none;
                    user-select: none;
                    box-sizing: border-box;
                    color: #666;
                }

                    .presupuestor3 > div > div > div:last-child > span a > i {
                        font-style: normal;
                    }

                .presupuestor3 > div > div > div:last-child > span .panelEditarOC {
                    position: absolute;
                    width: 300px;
                    height: 150px;
                    background-color: #F5F5F5;
                    z-index: 1;
                    border: 1px solid #ddd;
                    border-radius: 5px;
                    padding: 10px;
                    box-sizing: border-box;
                    text-decoration: none;
                    cursor: default;
                    -webkit-box-shadow: 0px 4px 10px -1px rgba(0,0,0,0.2);
                    -moz-box-shadow: 0px 4px 10px -1px rgba(0,0,0,0.2);
                    box-shadow: 0px 4px 10px -1px rgba(0,0,0,0.2);
                    left: 0;
                    right: 0;
                    top: 50px;
                    opacity: 0;
                    visibility: hidden;
                    -webkit-transition: all 0.4s ease-in-out;
                    -moz-transition: all 0.4s ease-in-out;
                    -o-transition: all 0.4s ease-in-out;
                    -ms-transition: all 0.4s ease-in-out;
                    transition: all 0.4s ease-in-out;
                }

                    .presupuestor3 > div > div > div:last-child > span .panelEditarOC.open {
                        opacity: 1;
                        visibility: visible;
                    }

                    .presupuestor3 > div > div > div:last-child > span .panelEditarOC:before {
                        content: "";
                        border-bottom: 15px solid #DDD;
                        border-left: 10px solid transparent;
                        border-right: 10px solid transparent;
                        position: absolute;
                        left: 0;
                        right: 0;
                        margin: 0 auto;
                        top: -15px;
                        width: 0px;
                        height: 0px;
                    }

                    .presupuestor3 > div > div > div:last-child > span .panelEditarOC > span {
                        font-size: 17px;
                        text-align: center;
                        width: 100%;
                        display: inline-block;
                        margin-bottom: 10px;
                    }

                    .presupuestor3 > div > div > div:last-child > span .panelEditarOC > div {
                        margin-top: 10px;
                        text-align: center;
                    }

                        .presupuestor3 > div > div > div:last-child > span .panelEditarOC > div > .btn:first-child {
                            margin-right: 10px;
                        }

                .presupuestor3 > div > div > div:last-child > span > i:nth-child(1) {
                    font-size: 18px;
                    font-weight: bold;
                    position: absolute;
                    left: 15px;
                    top: 10px;
                    font-style: normal;
                }

                .presupuestor3 > div > div > div:last-child > span > i > i:first-child {
                    margin-left: 5px;
                    font-style: normal;
                }

                .presupuestor3 > div > div > div:last-child > span > i > i:nth-child(2) {
                    display: block;
                    font-size: 14px;
                    font-style: normal;
                    font-weight: normal;
                    text-align: left;
                    color: #666;
                }

                .presupuestor3 > div > div > div:last-child > span > i:nth-child(6) {
                    position: relative;
                    width: 50px;
                    display: inline-block;
                    background-color: #FF9800;
                    height: 100%;
                    color: #FFF;
                    cursor: pointer;
                    overflow: hidden;
                    text-align: left;
                    -webkit-transition: all 0.2s ease-in-out;
                    -moz-transition: all 0.2s ease-in-out;
                    -o-transition: all 0.2s ease-in-out;
                    -ms-transition: all 0.2s ease-in-out;
                    transition: all 0.2s ease-in-out;
                }

                .presupuestor3 > div > div > div:last-child > span > i:nth-child(3) {
                    position: relative;
                    width: 50px;
                    display: inline-block;
                    background-color: #F44336;
                    height: 100%;
                    color: #FFF;
                    cursor: pointer;
                    overflow: hidden;
                    text-align: left;
                    -webkit-transition: all 0.2s ease-in-out;
                    -moz-transition: all 0.2s ease-in-out;
                    -o-transition: all 0.2s ease-in-out;
                    -ms-transition: all 0.2s ease-in-out;
                    transition: all 0.2s ease-in-out;
                }

                .presupuestor3 > div > div > div:last-child > span > i:nth-child(2) {
                    position: relative;
                    width: 50px;
                    display: inline-block;
                    background-color: #4caf50;
                    height: 100%;
                    color: #FFF;
                    cursor: pointer;
                    overflow: hidden;
                    text-align: left;
                    -webkit-transition: all 0.2s ease-in-out;
                    -moz-transition: all 0.2s ease-in-out;
                    -o-transition: all 0.2s ease-in-out;
                    -ms-transition: all 0.2s ease-in-out;
                    transition: all 0.2s ease-in-out;
                }

                    .presupuestor3 > div > div > div:last-child > span > i:nth-child(2):hover,
                    .presupuestor3 > div > div > div:last-child > span > i:nth-child(3):hover,
                    .presupuestor3 > div > div > div:last-child > span > i:nth-child(6):hover,
                    .presupuestor3 > div > div > div:last-child > span > i:nth-child(2).open,
                    .presupuestor3 > div > div > div:last-child > span > i:nth-child(3).open,
                    .presupuestor3 > div > div > div:last-child > span > i:nth-child(6).open {
                        width: 150px;
                    }

                        .presupuestor3 > div > div > div:last-child > span > i:nth-child(2).largo:hover,
                        .presupuestor3 > div > div > div:last-child > span > i:nth-child(2).open.largo {
                            width: 180px;
                        }

                        .presupuestor3 > div > div > div:last-child > span > i:nth-child(2):hover > i,
                        .presupuestor3 > div > div > div:last-child > span > i:nth-child(3):hover > i,
                        .presupuestor3 > div > div > div:last-child > span > i:nth-child(6):hover > i,
                        .presupuestor3 > div > div > div:last-child > span > i:nth-child(2).open > i,
                        .presupuestor3 > div > div > div:last-child > span > i:nth-child(3).open > i,
                        .presupuestor3 > div > div > div:last-child > span > i:nth-child(6).open > i {
                            opacity: 1;
                        }

                    .presupuestor3 > div > div > div:last-child > span > i:nth-child(2):before,
                    .presupuestor3 > div > div > div:last-child > span > i:nth-child(3):before,
                    .presupuestor3 > div > div > div:last-child > span > i:nth-child(6):before {
                        position: relative;
                        width: 50px;
                        height: 100%;
                        display: inline-block;
                        text-align: center;
                        padding-top: 15px;
                        box-sizing: border-box;
                        font-size: 18px;
                    }

                    .presupuestor3 > div > div > div:last-child > span > i:nth-child(2):hover {
                        background-color: #82c785;
                    }

                .presupuestor3 > div > div > div:last-child > span > i:nth-child(3):hover {
                    background-color: #E57373;
                }

                .presupuestor3 > div > div > div:last-child > span > i:nth-child(6):hover {
                    background-color: #FFB74D;
                }

                .presupuestor3 > div > div > div:last-child > span > i:nth-child(2) > i,
                .presupuestor3 > div > div > div:last-child > span > i:nth-child(3) > i,
                .presupuestor3 > div > div > div:last-child > span > i:nth-child(6) > i {
                    opacity: 0;
                    font-family: "Lato-Regular", sans-serif, Arial;
                    font-style: normal;
                    font-size: 15px;
                    -webkit-transition: all 0.2s ease-in-out;
                    -moz-transition: all 0.2s ease-in-out;
                    -o-transition: all 0.2s ease-in-out;
                    -ms-transition: all 0.2s ease-in-out;
                    transition: all 0.2s ease-in-out;
                }

            .presupuestor3 > div > div > div:last-child > div {
                width: 100%;
            }

                .presupuestor3 > div > div > div:last-child > div > div {
                    width: 100%;
                    display: table;
                }

                    .presupuestor3 > div > div > div:last-child > div > div:not(:first-child) {
                        border-top-width: 1px;
                        border-top-color: #EEE;
                        border-top-style: dashed;
                        margin-top: 5px;
                        padding-top: 5px;
                    }

                    .presupuestor3 > div > div > div:last-child > div > div:first-child {
                        opacity: 1;
                    }

                    .presupuestor3 > div > div > div:last-child > div > div:not(:first-child) {
                        opacity: 0.7;
                    }

                        .presupuestor3 > div > div > div:last-child > div > div:not(:first-child):hover {
                            opacity: 1;
                        }

                    .presupuestor3 > div > div > div:last-child > div > div:last-child {
                        margin-bottom: 5px;
                    }

                    .presupuestor3 > div > div > div:last-child > div > div > span,
                    .presupuestor3 > div > div > div:last-child > div > div > div {
                        display: table-cell;
                        position: relative;
                    }

                    .presupuestor3 > div > div > div:last-child > div > div > div {
                        border-left: 2px solid #DDD;
                        padding-left: 10px;
                        box-sizing: border-box;
                    }

                        .presupuestor3 > div > div > div:last-child > div > div > div:before {
                            content: "";
                            position: absolute;
                            left: -12px;
                            top: 0;
                            bottom: 0;
                            margin: auto;
                            border-right: 10px solid #DDD;
                            border-top: 5px solid transparent;
                            border-bottom: 5px solid transparent;
                            width: 0;
                            height: 0;
                        }

                    .presupuestor3 > div > div > div:last-child > div > div > span {
                        vertical-align: middle;
                        width: 80px;
                        text-align: center;
                    }

                        .presupuestor3 > div > div > div:last-child > div > div > span > i {
                            width: 40px;
                            height: 40px;
                            display: inline-block;
                            background-position: center;
                            background-size: cover;
                            border-radius: 50%;
                        }

                    .presupuestor3 > div > div > div:last-child > div > div > div > span {
                        width: 100%;
                        display: block;
                        padding-left: 3px;
                        box-sizing: border-box;
                    }

                        .presupuestor3 > div > div > div:last-child > div > div > div > span:not(:last-child) {
                            padding-bottom: 2px;
                        }

                        .presupuestor3 > div > div > div:last-child > div > div > div > span:first-child {
                            font-size: 15px;
                            font-weight: bold;
                        }

                        .presupuestor3 > div > div > div:last-child > div > div > div > span > i.fecha {
                            font-style: normal;
                            /*display: table;*/
                        }
                            /*.presupuestor3 > div > div > div:last-child > div > div > div > span > i.fecha> dia,
                    .presupuestor3 > div > div > div:last-child > div > div > div > span > i.fecha> fecha {
                        display:table-cell;
                        vertical-align:middle;
                    }
                        .presupuestor3 > div > div > div:last-child > div > div > div > span > i.fecha > dia {
                            font-size: 23px;
                            font-weight: bold;
                            padding-right:5px;
                            box-sizing:border-box;
                        }
                        .presupuestor3 > div > div > div:last-child > div > div > div > span > i.fecha > fecha> mes,
                        .presupuestor3 > div > div > div:last-child > div > div > div > span > i.fecha > fecha> año {
                            display:block;
                            width:100%;
                        }
                        .presupuestor3 > div > div > div:last-child > div > div > div > span > i.fecha > fecha > mes {
                            font-size: 13px;
                            font-weight: bold;
                            line-height: 13px;
                        }
                        .presupuestor3 > div > div > div:last-child > div > div > div > span > i.fecha > fecha > año {
                            font-size: 11px;
                            line-height: 11px;
                        }*/

                            .presupuestor3 > div > div > div:last-child > div > div > div > span > i.fecha > dia,
                            .presupuestor3 > div > div > div:last-child > div > div > div > span > i.fecha > fecha > mes {
                                margin-right: 3px;
                            }

                        .presupuestor3 > div > div > div:last-child > div > div > div > span > i:not(.fecha) {
                            font-weight: bold;
                            font-style: normal;
                            margin-right: 3px;
                        }

    .presupuestor3 > div > .hitorialVersion {
        text-decoration: none;
        display: block;
        background-color: #2196F3;
        width: 130px;
        text-align: center;
        border-radius: 10px;
        box-sizing: border-box;
        line-height: 20px;
        padding-top: 2px;
        color: #FFF !important;
        margin-bottom: 10px;
    }

        .presupuestor3 > div > .hitorialVersion.verMas {
            background-color: #777;
        }

.hitorialVersion > i {
    font-style: normal;
}

    .hitorialVersion > i:last-child {
        display: none;
    }

.hitorialVersion.verMas > i:last-child {
    display: block;
}

.hitorialVersion.verMas > i:first-child {
    display: none;
}

.hitorialVersion.verMas ~ div {
    display: table !important;
}

.panelDetallePresupuesto .panelCarpeta {
    width: 80%;
    margin-left: 10%;
    margin-bottom: 15px;
    float: left;
    box-sizing: border-box;
    border-bottom: 1px solid #a9a9a9;
    padding-left: 5px;
}

.panelDetallePresupuesto h1 {
    width: 80%;
    margin-left: 10%;
}

.panelDetallePresupuesto .panelCarpeta a {
    height: 27px;
    display: block;
    float: left;
    padding: 0px 10px 0px 10px;
    line-height: 27px;
    border-top: 3px solid #FFF;
    text-align: center;
    background-color: #a9a9a9;
    color: #FFF;
    margin-right: 2px;
    font-size: 14px;
    text-transform: uppercase;
    cursor: pointer;
}

    .panelDetallePresupuesto .panelCarpeta a.active {
        height: 30px;
        line-height: 30px;
        border: none;
        background-color: #ffffff;
        color: inherit;
        border-style: solid;
        border-color: #A9A9A9;
        border-width: 1px 1px 0px 1px;
        box-sizing: border-box;
        position: relative;
        bottom: -1px;
        -webkit-box-shadow: 0px -4px 10px -1px rgba(50, 50, 50, 0.1);
        -moz-box-shadow: 0px -4px 10px -1px rgba(50, 50, 50, 0.1);
        box-shadow: 0px -4px 10px -1px rgba(50, 50, 50, 0.1);
    }

.btnPequeño {
    min-width: 100px;
    display: inline-block;
    text-align: center;
    line-height: 27px;
    height: 27px;
    cursor: pointer;
    border-radius: 5px;
    text-decoration: none;
    padding-left: 5px;
    padding-right: 5px;
    box-sizing: border-box;
    font-size: 14px;
    font-weight: normal;
}

    .btnPequeño:hover {
        -webkit-box-shadow: 0px 4px 10px -1px rgba(0,0,0,0.4);
        -moz-box-shadow: 0px 4px 10px -1px rgba(0,0,0,0.4);
        box-shadow: 0px 4px 10px -1px rgba(0,0,0,0.4);
    }

.formEliminarPresupuesto, .formPublicarPresupuesto, .formAprobarPresupuesto, .formValidarPresupuesto, .formInvalidarPresupuesto, .formRechazarPresupuesto, .formRechazarGF {
    position: absolute;
    width: 240px;
    right: 0;
    background-color: #FFEBEE;
    padding: 10px;
    box-sizing: border-box;
    border-radius: 5px;
    text-align: center;
    z-index: 1;
    -webkit-box-shadow: 0px 4px 10px -1px rgba(0,0,0,0.2);
    -moz-box-shadow: 0px 4px 10px -1px rgba(0,0,0,0.2);
    box-shadow: 0px 4px 10px -1px rgba(0,0,0,0.2);
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
    top: -moz-calc(100% + 15px);
    top: -webkit-calc(100% + 15px);
    top: calc(100% + 15px);
}

.formPublicarPresupuesto {
    background-color: #ffecdc !important;
}

.formAprobarPresupuesto {
    background-color: #caead1 !important;
}

.formValidarPresupuesto {
    background-color: #caeaff !important;
}


    .formEliminarPresupuesto > i:first-child, .formPublicarPresupuesto > i:first-child, .formRechazarPresupuesto > i:first-child, .formAprobarPresupuesto > i:first-child, .formValidarPresupuesto > i:first-child, .formInvalidarPresupuesto > i:first-child, .formRechazarGF > i:first-child {
        font-size: 14px;
        text-align: left;
        width: 100%;
        display: inline-block;
        font-style: normal;
        font-weight: normal;
    }

    .formEliminarPresupuesto.open, .formPublicarPresupuesto.open, .formAprobarPresupuesto.open, .formValidarPresupuesto.open, .formRechazarPresupuesto.open, .formInvalidarPresupuesto.open, .formRechazarGF.open {
        opacity: 1;
        visibility: visible;
    }

    .formEliminarPresupuesto:before, .formPublicarPresupuesto:before, .formAprobarPresupuesto:before, .formValidarPresupuesto:before, .formRechazarPresupuesto:before, .formInvalidarPresupuesto:before, .formRechazarGF:before {
        content: "";
        position: absolute;
        right: 50px;
        top: -15px;
        border-bottom: 15px solid #ffebee;
        border-left: 10px solid transparent;
        border-right: 10px solid transparent;
    }

.formPublicarPresupuesto:before {
    border-bottom-color: #ffecdc !important;
    right: 90px;
}

.formValidarPresupuesto:before {
    border-bottom-color: #caeaff !important;
    right: 90px;
}

.formAprobarPresupuesto:before {
    border-bottom-color: #caead1 !important;
    right: 90px;
}

.formEliminarPresupuesto .control, .formPublicarPresupuesto .control, .formAprobarPresupuesto .control, .formValidarPresupuesto .control, .formRechazarPresupuesto .control, .formInvalidarPresupuesto .control, .formRechazarGF .control {
    background-color: rgba(255, 255, 255, 0.8);
    border-color: #ffcece;
    resize: none;
    height: 100px;
}

.formPublicarPresupuesto .control {
    border-color: #f1c9a8;
}

.formValidarPresupuesto .control {
    border-color: #caeaff;
}

.formAprobarPresupuesto .control {
    border-color: #b0d6b8;
}

.formEliminarPresupuesto .btnPequeño, .formPublicarPresupuesto .btnPequeño, .formAprobarPresupuesto .btnPequeño, .formValidarPresupuesto, .formRechazarPresupuesto .btnPequeño, .formInvalidarPresupuesto .btnPequeño, .formRechazarGF .btnPequeño {
    font-size: 14px;
    font-style: normal;
    margin-top: 5px;
    margin: 2px;
}

.formRechazarPresupuesto {
    color: #F44336;
}

.formAprobarPresupuesto {
    color: #388e3c;
}

.formValidarPresupuesto {
    color: #385a8e;
}


.presupuestor3 > div > div > div:last-child > span > i.AprobarPresupuesto {
    background-color: #4CAF50;
}

    .presupuestor3 > div > div > div:last-child > span > i.AprobarPresupuesto:hover {
        background-color: #6fb772;
    }

/*Check tipo swich*/
.checkControl {
    width: 70px;
    height: 35px;
    display: inline-block;
    border: 1px solid #DDD;
    border-radius: 20px;
    overflow: hidden;
    padding: 0 !important;
    box-sizing: border-box;
    cursor: pointer;
}

    .checkControl > input {
        opacity: 0;
        position: absolute;
        width: 70px;
        height: 35px;
        margin: 0;
        z-index: 3;
        cursor: pointer;
    }

    .checkControl > labeL {
        display: inline-block;
        width: 100%;
        height: 100%;
        position: relative;
        box-sizing: border-box;
        background-color: #F5F5F5;
    }

        .checkControl > label:before {
            content: "";
            position: absolute;
            z-index: 0;
            width: 10px;
            height: 10px;
            left: 30px;
            top: 12.5px;
            background-color: #2196f3;
            border-radius: 50%;
            opacity: 0;
            -webkit-transition: all 0.2s ease-in-out;
            -moz-transition: all 0.2s ease-in-out;
            -o-transition: all 0.2s ease-in-out;
            -ms-transition: all 0.2s ease-in-out;
            transition: all 0.2s ease-in-out;
        }

        .checkControl > label:after {
            content: "";
            display: inline-block;
            position: relative;
            z-index: 1;
            width: 33px;
            height: 33px;
            left: 0;
            border-radius: 50%;
            background-color: #FFF;
            box-sizing: border-box;
            -webkit-transition: all 0.2s ease-in-out;
            -moz-transition: all 0.2s ease-in-out;
            -o-transition: all 0.2s ease-in-out;
            -ms-transition: all 0.2s ease-in-out;
            transition: all 0.2s ease-in-out;
            -webkit-box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.3);
            -moz-box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.3);
            box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.3);
        }

    .checkControl > input:checked ~ label:after {
        left: 36px;
    }

    .checkControl > input:checked ~ label:before {
        opacity: 1;
        -ms-transform: scale(10); /* IE 9 */
        -webkit-transform: scale(10); /* Chrome, Safari, Opera */
        transform: scale(10);
    }

.maestroDocumentosTecnicos > a {
    display: inline-table;
    width: 130px;
    height: 155px;
    text-decoration: none;
    color: inherit;
    margin: 5px;
    border-radius: 5px;
    box-sizing: border-box;
    position: relative;
    border: 1px solid transparent;
}

    .maestroDocumentosTecnicos > a > span:first-child {
        height: 100px;
        width: 100%;
        display: inline-block;
        background-image: url('../../images/Util/folder.png');
        background-position: center;
        background-size: 100px;
        background-repeat: no-repeat;
        box-sizing: border-box;
    }

    .maestroDocumentosTecnicos > a > span:last-child {
        height: 30px;
        font-size: 12px;
        color: #777;
        display: inline-block;
        padding: 0px 5px 5px 5px;
        box-sizing: border-box;
    }

#panelDocumentosTecnicos > .maestroDocumentosTecnicos {
    display: block;
}

#panelDocumentosTecnicos > .detalleDocumentosTecnicos {
    display: none;
}

.maestroDocumentosTecnicos > a:hover {
    border: 1px solid #EEE;
    -webkit-box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.1), 0 16px 28px 0 rgba(0, 0, 0, 0.15);
    -moz-box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.1), 0 16px 28px 0 rgba(0, 0, 0, 0.15);
    box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.1), 0 16px 28px 0 rgba(0, 0, 0, 0.15);
}

.detalleDocumentosTecnicos .documento > span {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}

/*Check Normal, pero con otro diseño que el por defecto*/
.checkControl2 {
    width: 20px;
    height: 20px;
    position: relative;
    display: inline-block;
    cursor: pointer;
}

    .checkControl2 > input[type=checkbox] {
        width: 100%;
        height: 100%;
        position: absolute;
        display: inline-block;
        z-index: 2;
        opacity: 0;
        cursor: pointer;
        left: 0;
        top: 0;
    }

    .checkControl2 > label:before, .checkControl2 > label:after {
        position: absolute;
        display: inline-block;
        font: normal normal normal 14px/1 FontAwesome;
        text-rendering: auto;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        left: 0;
        top: 0;
        right: 0;
        bottom: 0;
        margin: auto;
        font-size: 17px;
        width: 17px;
        height: 17px;
        text-align: center;
    }

    .checkControl2 > label:before {
        content: "\f096";
        color: #AAA;
        z-index: 0;
    }

    .checkControl2 > label:after {
        content: "\f00c";
        color: #AAA;
        font-size: 13px;
        padding-top: 2px;
        box-sizing: border-box;
        z-index: 1;
    }

    .checkControl2 > input[type=checkbox]:checked + label:before,
    .checkControl2 > input[type=checkbox]:checked + label:after {
        color: #009688;
    }

/*06-03-2020 | YQuinteros | Se modifica tipo de check por daltónicos xD*/

.table-items:not(.table-asignacion) tr.to-cart .checkControl2 > input[type=checkbox] + label::after, .table-items:not(.table-asignacion) tr.to-cart .checkControl2 > input[type=checkbox] + label::before {
    color: #AAA;
}

.table-items:not(.table-asignacion) tr:not(.on-cart):not(.to-cart) .checkControl2 > input[type=checkbox] + label::after {
    content: "";
}
/*06-03-2020 | END*/

/************Paginador Fmena*******************/
#paginas {
    display: block;
    text-align: center;
    width: 100%;
    padding-top: 5px;
}

    #paginas > div {
        display: inline-block;
        width: auto;
    }

.paginas > div > .numeroPagina,
.paginas > div > .irIzquierda,
.paginas > div > .irDerecha {
    text-decoration: none;
    width: 25px;
    height: 25px;
    border-radius: 50%;
    background-color: #FFF;
    color: #999;
    border: 1px solid #DDD;
    display: inline-block;
    box-sizing: border-box;
    padding: 5px 0px;
    text-align: center;
    margin: 1px;
    cursor: pointer;
}

    .paginas > div > .numeroPagina:hover,
    .paginas > div > .irIzquierda:hover,
    .paginas > div > .irDerecha:hover {
        background-color: #4DB6AC;
        border-color: #4DB6AC;
        color: #FFF;
    }

    .paginas > div > .numeroPagina.active,
    .paginas > div > .irIzquierda.active,
    .paginas > div > .irDerecha.active {
        background-color: #AAA;
        border-color: #AAA;
        color: #FFF;
    }

#pagTareasApoyo {
    display: block;
    text-align: center;
    width: 100%;
    padding-top: 5px;
}

    #pagTareasApoyo > div {
        display: inline-block;
        width: auto;
    }

.paginasTa > div > .numeroPaginaTa,
.paginasTa > div > .irIzquierdaTa,
.paginasTa > div > .irDerechaTa {
    text-decoration: none;
    width: 25px;
    height: 25px;
    border-radius: 50%;
    background-color: #FFF;
    color: #999;
    border: 1px solid #DDD;
    display: inline-block;
    box-sizing: border-box;
    padding: 5px 0px;
    text-align: center;
    margin: 1px;
    cursor: pointer;
}

    .paginasTa > div > .numeroPaginaTa:hover,
    .paginasTa > div > .irIzquierdaTa:hover,
    .paginasTa > div > .irDerechaTa:hover {
        background-color: #4DB6AC;
        border-color: #4DB6AC;
        color: #FFF;
    }

    .paginasTa > div > .numeroPaginaTa.active,
    .paginasTa > div > .irIzquierdaTa.active,
    .paginasTa > div > .irDerechaTa.active {
        background-color: #AAA;
        border-color: #AAA;
        color: #FFF;
    }

/*********************************************/

/*******************DESPACHO******************/
#panelInicioProcesoDespacho, #panelDetalleComponentes {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.8);
    z-index: 10;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}

    #panelInicioProcesoDespacho.open, #panelDetalleComponentes.open {
        opacity: 1;
        visibility: visible;
    }

    #panelInicioProcesoDespacho > div, #panelDetalleComponentes > div {
        min-width: 300px;
        width: 80%;
        height: 90%;
        position: absolute;
        left: 0;
        top: 0;
        right: 0;
        bottom: 0;
        margin: auto;
        background-color: #FFF;
        padding: 10px;
        box-sizing: border-box;
        border-radius: 5px;
        -webkit-box-shadow: 1px 10px 30px -10px rgba(0, 0, 0, 0.8);
        -moz-box-shadow: 1px 10px 30px -10px rgba(0, 0, 0, 0.8);
        box-shadow: 1px 10px 30px -10px rgba(0, 0, 0, 0.8);
        -webkit-transition: all 0.4s ease-in-out;
        -moz-transition: all 0.4s ease-in-out;
        -o-transition: all 0.4s ease-in-out;
        -ms-transition: all 0.4s ease-in-out;
        transition: all 0.4s ease-in-out;
        -ms-transform: scale(0.7); /* IE 9 */
        -webkit-transform: scale(0.7); /* Chrome, Safari, Opera */
        transform: scale(0.7);
        opacity: 0;
        visibility: hidden;
        overflow: auto;
    }

    #panelInicioProcesoDespacho.open > div, #panelDetalleComponentes.open > div {
        -ms-transform: scale(1); /* IE 9 */
        -webkit-transform: scale(1); /* Chrome, Safari, Opera */
        transform: scale(1);
        opacity: 1;
        visibility: visible;
    }

    #panelInicioProcesoDespacho > div > h2, #panelDetalleComponentes > div > h2 {
        text-align: center;
    }

    #panelInicioProcesoDespacho > div > div:nth-child(4), #panelDetalleComponentes > div.panelDetalleRecepcion > div:nth-child(4) {
        text-align: center;
    }

    #panelInicioProcesoDespacho > div > div:nth-child(2), #panelDetalleComponentes > div.panelDetalleRecepcion > div:nth-child(2) {
        width: 100%;
        text-align: center;
        overflow: auto;
    }

        #panelInicioProcesoDespacho > div > div:nth-child(2) > div {
            display: inline-block;
            min-height: 50px;
            height: auto;
            width: 85%;
            min-width: 260px;
            border: 1px solid #EEE;
            background-color: #F5F5F5;
            border-left: 4px solid #42A5F5;
            box-sizing: border-box;
            margin-bottom: 5px;
            text-align: left;
            border-radius: 7px 3px 3px 7px;
            padding: 5px 5px 5px 10px;
            position: relative;
            overflow: hidden;
        }

            #panelInicioProcesoDespacho > div > div:nth-child(2) > div > span {
                display: inline-block;
                width: 100%;
                box-sizing: border-box;
            }

        #panelInicioProcesoDespacho > div > div:nth-child(2) > span {
            width: 100%;
            padding: 10px;
            box-sizing: border-box;
            display: inline-block;
            background-color: #E57373;
            color: #FFF;
            margin-bottom: 10px;
            -webkit-box-shadow: 0px 3px 10px 0px rgba(0, 0, 0, 0.3);
            -moz-box-shadow: 0px 3px 10px 0px rgba(0, 0, 0, 0.3);
            box-shadow: 0px 3px 10px 0px rgba(0, 0, 0, 0.3);
        }

        #panelInicioProcesoDespacho > div > div:nth-child(2) > div > span:nth-child(1) {
            font-weight: bold;
        }

        #panelInicioProcesoDespacho > div > div:nth-child(2) > div > .quitarComponenteAcople {
            width: 35px;
            height: 35px;
            background-color: #EF5350;
            position: absolute;
            right: -60px;
            top: 5px;
            border-radius: 50%;
            background-image: url(../../images/Util/close.png);
            background-repeat: no-repeat;
            background-position: center;
            background-size: 17px;
            -webkit-transition: all 0.4s ease-in-out;
            -moz-transition: all 0.4s ease-in-out;
            -o-transition: all 0.4s ease-in-out;
            -ms-transition: all 0.4s ease-in-out;
            transition: all 0.4s ease-in-out;
        }

        #panelInicioProcesoDespacho > div > div:nth-child(2) > div:hover > .quitarComponenteAcople {
            right: 5px;
        }

            #panelInicioProcesoDespacho > div > div:nth-child(2) > div:hover > .quitarComponenteAcople:hover {
                cursor: pointer;
                background-color: #E53935;
                -webkit-box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.5);
                -moz-box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.5);
                box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.5);
            }

.seleccionAcople > div {
    width: 300px;
    height: 300px;
    position: absolute;
    left: -90px;
    top: 70px;
    background-color: rgba(185, 185, 185, 0.8);
    z-index: 1;
    border: 1px solid #a5a5a5;
    border-radius: 5px;
    -webkit-box-shadow: 0px 5px 15px -3px rgba(0, 0, 0, 0.4);
    -moz-box-shadow: 0px 5px 15px -3px rgba(0, 0, 0, 0.4);
    box-shadow: 0px 5px 15px -3px rgba(0, 0, 0, 0.4);
    font-size: 13px;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}

    .seleccionAcople > div > div:nth-child(1) {
        width: 100%;
        height: 260px;
        position: absolute;
        left: 0;
        top: 0;
        overflow: auto;
        border: 10px solid transparent;
        box-sizing: border-box;
        text-align: center;
    }

        .seleccionAcople > div > div:nth-child(1) > seleccion {
            height: auto;
            background: #FFF;
            display: inline-block;
            box-sizing: border-box;
            padding: 3px;
            border-radius: 3px;
            border-left: 3px solid #009688;
            width: 98%;
            margin-bottom: 5px;
            text-align: left;
            position: relative;
            overflow: hidden;
        }

            .seleccionAcople > div > div:nth-child(1) > seleccion > span {
                width: 100%;
                display: inline-block;
            }

                .seleccionAcople > div > div:nth-child(1) > seleccion > span:first-child {
                    font-weight: bold;
                }

    .seleccionAcople > div:before {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        top: -20px;
        width: 0px;
        height: 0px;
        border-bottom: 20px solid #a5a5a5;
        border-left: 10px solid transparent;
        border-right: 10px solid transparent;
        margin: 0 auto;
    }

    .seleccionAcople > div:after {
        content: "";
        width: 100%;
        background-color: transparent;
        display: inline-block;
        height: 20px;
        top: -21px;
        position: absolute;
    }

.seleccionAcople > span {
    width: 100px;
    height: 50px;
    display: table;
    background-color: #FF5722;
    border-radius: 5px;
    padding: 5px;
    box-sizing: border-box;
}

    .seleccionAcople > span > span:nth-child(1) {
        min-width: 25px;
        display: table-cell;
        vertical-align: middle;
        font-size: 30px;
        color: #FFF;
        text-align: center;
    }

    .seleccionAcople > span > span:nth-child(2) {
        font-size: 13px;
        color: #FFF;
        display: table-cell;
        vertical-align: middle;
        width: auto;
        padding-left: 5px;
    }

.seleccionAcople {
    opacity: 0;
    visibility: hidden;
    position: relative;
    display: inline-block;
    margin-left: 10px;
    z-index: 2;
}

    .seleccionAcople > span:hover + div, .seleccionAcople > div:hover {
        opacity: 1;
        visibility: visible;
    }

    .seleccionAcople > div > div:nth-child(1) > seleccion > i.quitarComp {
        height: 100%;
        width: 40px;
        position: absolute;
        right: -40px;
        top: 0;
        background-color: #EF5350;
        box-sizing: border-box;
        background-image: url(../../images/Util/close.png);
        background-position: center;
        background-repeat: no-repeat;
        background-size: 20px;
        cursor: pointer;
        -webkit-transition: all 0.4s ease-in-out;
        -moz-transition: all 0.4s ease-in-out;
        -o-transition: all 0.4s ease-in-out;
        -ms-transition: all 0.4s ease-in-out;
        transition: all 0.4s ease-in-out;
    }

    .seleccionAcople > div > div:nth-child(1) > seleccion:hover > i.quitarComp {
        right: 0;
    }

    .seleccionAcople > div > div:nth-child(2) {
        height: 40px;
        width: 100%;
        display: inline-block;
        text-align: center;
        position: absolute;
        left: 0;
        bottom: 0;
    }

        .seleccionAcople > div > div:nth-child(2) > a {
            width: 101px;
            display: inline-block;
            height: 25px;
            line-height: 25px;
            box-sizing: border-box;
            text-decoration: none;
        }

.checkControl:hover + .seleccionAcople > div {
    opacity: 1;
    visibility: visible;
}

#panelDetalleComponentes > div.panelDetalleRecepcion > div:nth-child(2) > div {
    width: 100%;
    background-color: #EEE;
    box-sizing: border-box;
    border-radius: 0px 3px 3px 0px;
    margin-bottom: 10px;
    border-left: 3px solid #999;
    padding: 5px;
    text-align: left;
}

    #panelDetalleComponentes > div.panelDetalleRecepcion > div:nth-child(2) > div > span:nth-child(1) {
        width: 100%;
        display: inline-block;
        font-weight: bold;
        font-size: 13px;
    }

    #panelDetalleComponentes > div.panelDetalleRecepcion > div:nth-child(2) > div > span {
        padding-right: 10px;
        width: 100%;
        display: inline-block;
        box-sizing: border-box;
        font-size: 12px;
    }

        #panelDetalleComponentes > div.panelDetalleRecepcion > div:nth-child(2) > div > span:nth-child(2),
        #panelDetalleComponentes > div.panelDetalleRecepcion > div:nth-child(2) > div > span:nth-child(3) {
            padding-right: 20px;
            width: auto;
        }


#panelDetalleComponentes > div.panelDetalleRecepcion > div:nth-child(2) > span.observacionEnvio {
    text-align: left;
    width: 100%;
    display: inline-block;
    padding: 10px;
    box-sizing: border-box;
    background-color: #d6e6f3;
    color: #134065;
    border-left: 3px solid #134065;
    border-radius: 0px 3px 3px 0px;
}

/*********************************************/

.osAprobacionInterna {
    /*width: 180px;*/
    height: 230px;
    display: block;
    background-color: #DDD;
    border-radius: 0px 0px 15px 15px;
    float: left;
    margin: 1%;
    overflow: hidden;
    position: relative;
    -webkit-box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.3);
    box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.3);
    -ms-transform: scale(1);
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}

    .osAprobacionInterna:hover {
        -webkit-box-shadow: 0px 3px 6px -2px rgba(0, 0, 0, 0.4), 0px 10px 23px -5px rgba(0, 0, 0, 0.6);
        -moz-box-shadow: 0px 3px 6px -2px rgba(0, 0, 0, 0.4), 0px 10px 23px -5px rgba(0, 0, 0, 0.6);
        box-shadow: 0px 3px 6px -2px rgba(0, 0, 0, 0.4), 0px 10px 23px -5px rgba(0, 0, 0, 0.6);
        cursor: pointer;
        z-index: 1;
        -ms-transform: scale(1.03);
        -webkit-transform: scale(1.03);
        transform: scale(1.03);
    }

    .osAprobacionInterna > span:nth-child(3) {
        width: 100%;
        height: 100%;
        position: absolute;
        left: 0;
        bottom: 0;
        display: inline-block;
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        z-index: 0;
    }

        .osAprobacionInterna > span:nth-child(3):before {
            content: "";
            width: 100%;
            height: 70px;
            z-index: 1;
            background-image: inherit;
            display: inline-block;
            background-size: 100%;
            background-position-x: center;
            background-position-y: top;
            -webkit-filter: blur(5px);
            -moz-filter: blur(5px);
            -o-filter: blur(5px);
            -ms-filter: blur(5px);
            filter: blur(5px);
        }

    .osAprobacionInterna:hover > span:nth-child(3) {
        -webkit-filter: blur(5px);
        -moz-filter: blur(5px);
        -o-filter: blur(5px);
        -ms-filter: blur(5px);
        filter: blur(5px);
    }

    .osAprobacionInterna > span:nth-child(1) {
        width: 100%;
        height: 70px;
        display: inline-block;
        background-color: rgba(255,255,255,0.8);
        line-height: 70px;
        text-align: center;
        color: #757575;
        font-size: 15px;
        font-weight: bold;
        position: relative;
        z-index: 1;
        -webkit-box-shadow: 0px 3px 15px 0px rgba(0, 0, 0, 0.4);
        -moz-box-shadow: 0px 3px 15px 0px rgba(0, 0, 0, 0.4);
        box-shadow: 0px 3px 15px 0px rgba(0, 0, 0, 0.4);
    }

    .osAprobacionInterna > i:nth-child(2) {
        position: absolute;
        z-index: 4;
        display: inline-block;
        top: 50px;
        right: 4px;
        width: 40px;
        height: 40px;
        background-color: #FF5722;
        color: #ffffff;
        text-align: center;
        border-radius: 50%;
        line-height: 40px;
        font-size: 17px;
        -webkit-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.3), 0px 1px 7px 0px rgba(0, 0, 0, 0.4);
        -moz-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.3), 0px 1px 7px 0px rgba(0, 0, 0, 0.4);
        box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.3), 0px 1px 7px 0px rgba(0, 0, 0, 0.4);
        -webkit-transition: all 0.4s ease-in-out;
        -moz-transition: all 0.4s ease-in-out;
        -o-transition: all 0.4s ease-in-out;
        -ms-transition: all 0.4s ease-in-out;
        transition: all 0.4s ease-in-out;
    }

    .osAprobacionInterna > i.aprobacionInternaOkTaller {
        background-color: #03A9F4;
        color: #ffffff;
    }

    .osAprobacionInterna > i.aprobacionInternaOkCliente {
        background-color: #4CAF50;
        color: #ffffff;
    }

    .osAprobacionInterna > span:nth-child(4) {
        position: absolute;
        z-index: 3;
        display: table;
        width: 100%;
        height: 160px;
        background-color: rgba(0, 0, 0, 0.6);
        left: 0;
        bottom: 0;
        color: #FFF;
        opacity: 0;
        visibility: hidden;
        -webkit-transition: all 0.4s ease-in-out;
        -moz-transition: all 0.4s ease-in-out;
        -o-transition: all 0.4s ease-in-out;
        -ms-transition: all 0.4s ease-in-out;
        transition: all 0.4s ease-in-out;
    }

    .osAprobacionInterna:hover > span:nth-child(4) {
        visibility: visible;
        opacity: 1;
    }

    .osAprobacionInterna > span:nth-child(4) > ul {
        font-size: 11px;
        padding: 22px 10px 22px 10px;
        box-sizing: border-box;
        margin: auto;
        width: 100%;
        list-style-position: inside;
        text-transform: uppercase;
        display: table-cell;
        vertical-align: middle;
    }

    .osAprobacionInterna:hover > i:nth-child(2) {
        right: -50px;
    }

    .osAprobacionInterna > i:nth-child(5) {
        position: absolute;
        display: inline-block;
        width: 40px;
        height: 40px;
        background-color: #9C27B0;
        color: #ffffff;
        left: -50px;
        top: 50px;
        z-index: 4;
        border-radius: 50%;
        text-align: center;
        line-height: 40px;
        opacity: 0;
        visibility: visible;
        -webkit-box-shadow: 0px -2px 15px -2px rgba(50, 50, 50, 0.5);
        -moz-box-shadow: 0px -2px 15px -2px rgba(50, 50, 50, 0.5);
        box-shadow: 0px -2px 15px -2px rgba(50, 50, 50, 0.5);
        -webkit-transition: all 0.4s ease-in-out;
        -moz-transition: all 0.4s ease-in-out;
        -o-transition: all 0.4s ease-in-out;
        -ms-transition: all 0.4s ease-in-out;
        transition: all 0.4s ease-in-out;
    }

    .osAprobacionInterna:hover > i:nth-child(5) {
        opacity: 1;
        visibility: visible;
        left: 15px;
    }

.panelAprobacionInOS {
    display: inline-block;
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 50;
    background-color: rgba(0,0,0,0.6);
    left: 0;
    top: 0;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

    .panelAprobacionInOS.open {
        opacity: 1;
        visibility: visible;
    }

    .panelAprobacionInOS > div {
        background-color: #FFF;
        display: inline-block;
        -webkit-box-shadow: 0 6px 10px 0 rgba(0,0,0,0.14), 0 1px 18px 0 rgba(0,0,0,0.12), 0 3px 5px -1px rgba(0,0,0,0.2);
        -moz-box-shadow: 0 6px 10px 0 rgba(0,0,0,0.14), 0 1px 18px 0 rgba(0,0,0,0.12), 0 3px 5px -1px rgba(0,0,0,0.2);
        box-shadow: 0 6px 10px 0 rgba(0,0,0,0.14), 0 1px 18px 0 rgba(0,0,0,0.12), 0 3px 5px -1px rgba(0,0,0,0.2);
    }

.cerrar2 {
    background-image: url('../../images/Util/close.png');
    display: inline-block;
    position: absolute;
    right: 10px;
    top: 10px;
    width: 40px;
    height: 40px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 20px;
    border-radius: 50%;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
    z-index: 100;
}

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

.panelAprobacionInOS > div > div:nth-child(1) {
    width: 100%;
    position: relative;
    overflow: hidden;
}

    .panelAprobacionInOS > div > div:nth-child(1):before {
        content: "";
        display: inline-block;
        background-color: #673AB7;
        position: absolute;
        right: 0;
        top: 0;
        width: 0px;
        height: 0px;
        border-radius: 0px 0px 0px 100%;
        -webkit-transition: all 0.6s ease-in-out 0.2s;
        -moz-transition: all 0.6s ease-in-out 0.2s;
        -o-transition: all 0.6s ease-in-out 0.2s;
        -ms-transition: all 0.6s ease-in-out 0.2s;
        transition: all 0.6s ease-in-out 0.2s;
    }

.panelAprobacionInOS.open > div > div:nth-child(1):before {
    width: 5000px;
    height: 5000px;
}

.panelAprobacionInOS > div > div:nth-child(1) > * {
    -webkit-transition: opacity 0.3s ease-in-out 0.5s;
    -moz-transition: opacity 0.3s ease-in-out 0.5s;
    -o-transition: opacity 0.3s ease-in-out 0.5s;
    -ms-transition: opacity 0.3s ease-in-out 0.5s;
    transition: opacity 0.3s ease-in-out 0.5s;
    opacity: 0;
    visibility: hidden;
}

.panelAprobacionInOS.open > div > div:nth-child(1) > * {
    visibility: visible;
    opacity: 1;
}

.panelAprobacionInOS > div > span#btnAprobacionInterna {
    display: none;
}

.panelAprobacionInOS > div > a#btnCheckAprobacionInterna {
    position: absolute;
    right: 20px;
    display: inline-block;
    width: 70px;
    height: 70px;
    background-color: #834fde;
    color: #FFF;
    border-radius: 50%;
    text-align: center;
    line-height: 70px;
    margin-top: -25px;
    font-size: 35px;
    cursor: pointer;
    -webkit-box-shadow: 0 6px 10px 0 rgba(0,0,0,0.14), 0 1px 18px 0 rgba(0,0,0,0.12), 0 3px 5px -1px rgba(0,0,0,0.2);
    -moz-box-shadow: 0 6px 10px 0 rgba(0,0,0,0.14), 0 1px 18px 0 rgba(0,0,0,0.12), 0 3px 5px -1px rgba(0,0,0,0.2);
    box-shadow: 0 6px 10px 0 rgba(0,0,0,0.14), 0 1px 18px 0 rgba(0,0,0,0.12), 0 3px 5px -1px rgba(0,0,0,0.2);
    -webkit-transition: opacity 0.3s ease-in-out 0.8s, background-color 0.3s ease-in-out;
    -moz-transition: opacity 0.3s ease-in-out 0.8s, background-color 0.3s ease-in-out;
    -o-transition: opacity 0.3s ease-in-out 0.8s, background-color 0.3s ease-in-out;
    -ms-transition: opacity 0.3s ease-in-out 0.8s, background-color 0.3s ease-in-out;
    transition: opacity 0.3s ease-in-out 0.8s, background-color 0.3s ease-in-out;
    opacity: 0;
    visibility: hidden;
    z-index: 100;
    text-decoration: none;
}

.panelAprobacionInOS.open > div > a#btnCheckAprobacionInterna {
    opacity: 1;
    visibility: visible;
}

.panelAprobacionInOS > div > a#btnCheckAprobacionInterna:hover {
    background-color: #4CAF50;
}

.panelAprobacionInOS > div > div:nth-child(1) > h1 {
    z-index: 1;
    position: relative;
    color: #FFF;
    text-align: center;
    margin: 30px 0px 0px 0px;
}

.detalleOSAI {
    z-index: 1;
    position: relative;
    color: #FFF;
    padding: 25px 10px 10px 10px;
    box-sizing: border-box;
    display: table;
}

    .detalleOSAI > span, .detalleOSAI > div {
        display: table-cell;
        vertical-align: middle;
    }

    .detalleOSAI > span {
        width: 130px;
        text-align: center;
    }

        .detalleOSAI > span > span {
            top: -15px;
            position: relative;
            display: inline-block;
            width: 100px;
            height: 100px;
            background-position: center;
            background-repeat: no-repeat;
            background-size: cover;
            border-radius: 50%;
        }

    .detalleOSAI > div .panelMedio, .detalleOSAI > div .panelGrande {
        padding: 3px;
        box-sizing: border-box;
        font-size: 12px;
    }

        .detalleOSAI > div .panelMedio > i, .detalleOSAI > div .panelGrande > i {
            text-transform: uppercase;
            font-style: normal;
            padding-right: 15px;
            color: #ffe500;
        }


    .detalleOSAI > div {
        padding-left: 20px;
        box-sizing: border-box;
    }

.detalleComponentesAI {
    text-align: center;
    -webkit-transition: opacity 0.3s ease-in-out 0.6s;
    -moz-transition: opacity 0.3s ease-in-out 0.6s;
    -o-transition: opacity 0.3s ease-in-out 0.6s;
    -ms-transition: opacity 0.3s ease-in-out 0.6s;
    transition: opacity 0.3s ease-in-out 0.6s;
    opacity: 0;
    visibility: hidden;
    padding-top: 15px;
}

.panelAprobacionInOS.open .detalleComponentesAI {
    visibility: visible;
    opacity: 1;
}

.detalleComponentesAI > div {
    border-left: 3px solid #FF5722;
    background-color: #f7f7f7;
    margin-top: 10px;
    width: 95%;
    display: inline-block;
    text-align: left;
    padding: 5px;
    box-sizing: border-box;
}

    .detalleComponentesAI > div > h3 {
        margin: 0px 0px 0px 0px;
    }

    .detalleComponentesAI > div > div {
        padding-top: 10px;
    }

        .detalleComponentesAI > div > div > span {
            width: 120px;
            display: inline-block;
            height: 25px;
            line-height: 25px;
            text-align: center;
            background-color: #999;
            color: #FFF;
            margin-left: 25px;
            margin-bottom: 5px;
            font-size: 11px;
            text-transform: uppercase;
            position: relative;
        }

            .detalleComponentesAI > div > div > span:not(:first-child):before {
                content: "";
                width: 10px;
                height: 4px;
                background-color: #777;
                position: absolute;
                left: -21px;
                top: 0;
                bottom: 0;
                margin: auto;
            }

            .detalleComponentesAI > div > div > span:not(:first-child):after {
                content: "";
                border-left: 10px solid #777;
                border-top: 5px solid transparent;
                border-bottom: 5px solid transparent;
                width: 0px;
                height: 0px;
                position: absolute;
                left: -13px;
                top: 0px;
                bottom: 0px;
                margin: auto;
            }

.detalleComponentesAI {
    overflow: auto;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    box-sizing: border-box;
}

.panelConfirmarAprobacion {
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.5);
    z-index: 50;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

    .panelConfirmarAprobacion > div {
        width: 320px;
        height: 200px;
        background-color: #fff;
        position: absolute;
        left: 0;
        top: -2000px;
        bottom: 0;
        right: 0;
        margin: auto;
        -webkit-box-shadow: 0 6px 10px 0 rgba(0,0,0,0.14), 0 1px 18px 0 rgba(0,0,0,0.12), 0 3px 5px -1px rgba(0,0,0,0.2);
        -moz-box-shadow: 0 6px 10px 0 rgba(0,0,0,0.14), 0 1px 18px 0 rgba(0,0,0,0.12), 0 3px 5px -1px rgba(0,0,0,0.2);
        box-shadow: 0 6px 10px 0 rgba(0,0,0,0.14), 0 1px 18px 0 rgba(0,0,0,0.12), 0 3px 5px -1px rgba(0,0,0,0.2);
        color: inherit;
        padding: 15px;
        box-sizing: border-box;
        border: 1px solid #666;
        -webkit-transition: all 0.4s ease-in-out;
        -moz-transition: all 0.4s ease-in-out;
        -o-transition: all 0.4s ease-in-out;
        -ms-transition: all 0.4s ease-in-out;
        transition: all 0.4s ease-in-out;
    }

    .panelConfirmarAprobacion.open {
        opacity: 1;
        visibility: visible;
    }

        .panelConfirmarAprobacion.open > div {
            top: 0px;
        }

    .panelConfirmarAprobacion > div > span:nth-child(1) {
        display: inline-block;
        width: 100%;
        padding-top: 10px;
    }

    .panelConfirmarAprobacion > div > textarea:nth-child(2) {
        width: 100%;
        resize: none;
        border: none;
        box-sizing: border-box;
        border-radius: 3px;
        background-color: rgba(0, 0, 0, 0.1);
        color: inherit;
        margin-top: 13px;
        height: 60px;
    }

    .panelConfirmarAprobacion > div > div:nth-child(3) {
        display: inline-block;
        padding-top: 13px;
        text-align: center;
        width: 100%;
    }

        .panelConfirmarAprobacion > div > div:nth-child(3) > a {
            text-decoration: none;
            width: 100px;
            height: 25px;
            display: inline-block;
            background-color: #3f9255;
            text-align: center;
            line-height: 25px;
            text-transform: uppercase;
            font-size: 12px;
            color: #FFF;
            margin-right: 5px;
            cursor: pointer;
            -webkit-user-select: none;
            -moz-user-select: none;
            -ms-user-select: none;
            user-select: none;
        }

            .panelConfirmarAprobacion > div > div:nth-child(3) > a:hover {
                background-color: #237137;
            }

        .panelConfirmarAprobacion > div > div:nth-child(3) > span {
            text-decoration: none;
            width: 100px;
            height: 25px;
            display: inline-block;
            background-color: #EF5350;
            text-align: center;
            line-height: 25px;
            text-transform: uppercase;
            font-size: 12px;
            color: #FFF;
            cursor: pointer;
        }

            .panelConfirmarAprobacion > div > div:nth-child(3) > span:hover {
                background-color: #E53935;
            }

    .panelConfirmarAprobacion > div > textarea.sinObservacion {
        background-color: #ffd1d1;
    }

        .panelConfirmarAprobacion > div > textarea.sinObservacion::-webkit-input-placeholder {
            color: #b90d00;
        }

        .panelConfirmarAprobacion > div > textarea.sinObservacion:-moz-placeholder {
            color: #b90d00;
        }

        .panelConfirmarAprobacion > div > textarea.sinObservacion::-moz-placeholder {
            color: #b90d00;
        }

        .panelConfirmarAprobacion > div > textarea.sinObservacion:-ms-input-placeholder {
            color: #b90d00;
        }



/*Media querys para el panel de aprobación interna de OS*/
@media (min-width:1600px) {
    .panelAprobacionInOS > div {
        width: 1200px;
        height: 750px;
        left: 0;
        top: 0;
        bottom: 0;
        right: 0;
        margin: auto;
        position: absolute;
    }

        .panelAprobacionInOS > div > div:nth-child(1) {
            height: 270px;
        }

        .panelAprobacionInOS > div > span#btnAprobacionInterna {
            top: 230px;
        }

    .detalleComponentesAI {
        height: 480px;
    }
}

@media (min-width:1024px) and (max-width:1599px) {
    .panelAprobacionInOS > div {
        width: 980px;
        height: 550px;
        left: 0;
        top: 0;
        bottom: 0;
        right: 0;
        margin: auto;
        position: absolute;
    }

        .panelAprobacionInOS > div > div:nth-child(1) {
            height: 220px;
        }

        .panelAprobacionInOS > div > span#btnAprobacionInterna {
            top: 180px;
        }

    .detalleComponentesAI {
        height: 330px;
    }

        .detalleComponentesAI > div > div > span {
            width: 100px;
            font-size: 10px;
        }
}

@media (min-width:800px) and (max-width:1023px) {
    .panelAprobacionInOS > div {
        width: 650px;
        height: 500px;
        left: 0;
        top: 0;
        bottom: 0;
        right: 0;
        margin: auto;
        position: absolute;
    }

        .panelAprobacionInOS > div > div:nth-child(1) {
            height: 190px;
        }

        .panelAprobacionInOS > div > span#btnAprobacionInterna {
            top: 155px;
        }

    .detalleComponentesAI {
        height: 310px;
    }

    .detalleOSAI {
        padding: 10px 10px 10px 10px;
    }

        .detalleOSAI > div .panelMedio {
            text-transform: uppercase;
        }

        .detalleOSAI > div .panelMedio, .detalleOSAI > div .panelGrande {
            padding: 1px;
        }

        .detalleOSAI > span {
            width: 80px;
        }

            .detalleOSAI > span > span {
                height: 70px;
                width: 70px;
            }

    .panelAprobacionInOS > div > div:nth-child(1) > h1 {
        margin-top: 15px;
    }
}

@media (max-width:799px) {
    .panelAprobacionInOS > div {
        width: 100%;
        min-height: 100%;
        position: relative;
    }

        .panelAprobacionInOS > div > div:nth-child(1) {
            height: auto;
            padding-bottom: 30px;
        }

        .panelAprobacionInOS > div > span#btnAprobacionInterna {
            position: relative;
            float: right;
            top: -35px;
        }

    .panelAprobacionInOS {
        overflow: auto;
    }

    .detalleComponentesAI {
        width: 100%;
        position: relative;
        top: -45px;
    }

    .osAprobacionInterna > span:nth-child(3) {
        -webkit-filter: blur(5px);
        -moz-filter: blur(5px);
        -o-filter: blur(5px);
        -ms-filter: blur(5px);
        filter: blur(5px);
    }

    .osAprobacionInterna > span:nth-child(4) {
        visibility: visible;
        opacity: 1;
    }

    .detalleOSAI > span {
        width: 80px;
    }

        .detalleOSAI > span > span {
            width: 75px;
            height: 75px;
        }

    .detalleOSAI > div .panelMedio {
        padding: 1px;
    }

    .detalleComponentesAI > div > div > span {
        width: 100px;
        font-size: 10px;
    }
}



/*Estilos DPR*/
.listadoTareaDPR {
    height: -moz-calc(100% - 100px);
    height: -webkit-calc(100% - 100px);
    height: calc(100% -100px);
    display: inline-block;
    width: 100%;
    overflow: auto;
    border-radius: 5px;
}

    .listadoTareaDPR > div {
        display: table;
        width: 100%;
        border-collapse: collapse;
    }

        .listadoTareaDPR > div > div {
            display: table-row;
        }

            .listadoTareaDPR > div > div > div {
                display: table-cell;
                vertical-align: middle;
                padding: 5px;
                box-sizing: border-box;
            }

                .listadoTareaDPR > div > div > div:nth-child(1) {
                    height: 100px;
                    text-align: center;
                    width: 50px;
                    color: #FFF;
                }

            .listadoTareaDPR > div > div:nth-child(1) > div:nth-child(1) {
                background-color: #777;
            }

            .listadoTareaDPR > div > div:nth-child(2) > div:nth-child(1) {
                background-color: #7F7F7F;
            }

            .listadoTareaDPR > div > div:nth-child(3) > div:nth-child(1) {
                background-color: #888;
            }

            .listadoTareaDPR > div > div:nth-child(4) > div:nth-child(1) {
                background-color: #8F8F8F;
            }

            .listadoTareaDPR > div > div:nth-child(5) > div:nth-child(1) {
                background-color: #999;
            }

            .listadoTareaDPR > div > div:nth-child(6) > div:nth-child(1) {
                background-color: #9F9F9F;
            }

            .listadoTareaDPR > div > div > div:nth-child(2) {
                background-color: #F5F5F5;
            }

            .listadoTareaDPR > div > div > div:nth-child(1) > span {
                -webkit-transform: rotate(270deg) translate3d(0, 0, 0);
                -moz-transform: rotate(270deg);
                -o-transform: rotate(270deg);
                -ms-transform: rotate(270deg);
                transform: rotate(270deg);
                display: inline-block;
                text-transform: uppercase;
            }

            .listadoTareaDPR > div > div > div:nth-child(2) > span {
                position: relative;
                display: table;
                width: -moz-calc(100% - 30px);
                width: -webkit-calc(100% - 30px);
                width: calc(100% -30px);
                float: right;
                background-color: #FFF;
                border-radius: 0px 3px 3px 0px;
                border-left: 3px solid #FF9800;
                margin-bottom: 7px;
                cursor: pointer;
                -webkit-transition: all 0.3s ease-in-out;
                -moz-transition: all 0.3s ease-in-out;
                -o-transition: all 0.3s ease-in-out;
                -ms-transition: all 0.3s ease-in-out;
                transition: all 0.3s ease-in-out;
            }

                .listadoTareaDPR > div > div > div:nth-child(2) > span > i:nth-child(1) {
                    font-style: normal;
                    display: table-cell;
                    vertical-align: middle;
                    height: 40px;
                    padding-left: 15px;
                }

                .listadoTareaDPR > div > div > div:nth-child(2) > span:hover {
                    -webkit-box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.2);
                    -moz-box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.2);
                    box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.2);
                }

                .listadoTareaDPR > div > div > div:nth-child(2) > span.ejecucion {
                    border-left-color: #096750;
                }

                .listadoTareaDPR > div > div > div:nth-child(2) > span.asignada {
                    border-left-color: #305669;
                    background-color: #90A4AE;
                }

                .listadoTareaDPR > div > div > div:nth-child(2) > span.terminado {
                    border-left-color: #05507b;
                }

                .listadoTareaDPR > div > div > div:nth-child(2) > span i.fa {
                    opacity: 0;
                    visibility: hidden;
                    position: absolute;
                    left: -20px;
                    top: 0;
                    bottom: 0;
                    margin: auto;
                    height: 20px;
                    width: 15px;
                    font-size: 20px;
                    color: #2196F3;
                }

                .listadoTareaDPR > div > div > div:nth-child(2) > span.selected i.fa {
                    opacity: 1;
                    visibility: visible;
                }

.tarjetaDPR {
    display: inline-block;
    width: 100%;
    -webkit-box-shadow: 0px 4px 5px -1px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0px 4px 5px -1px rgba(0, 0, 0, 0.2);
    box-shadow: 0px 4px 5px -1px rgba(0, 0, 0, 0.2);
    margin-bottom: 20px;
    position: relative;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
    float: left;
}

    .tarjetaDPR > div:nth-child(1) {
        position: relative;
        background-color: #607D8B;
        color: #FFF;
        z-index: 2;
        float: left;
        width: 100%;
    }

        .tarjetaDPR > div:nth-child(1) > span {
            background-color: rgba(255,255,255,0.3);
            display: inline-block;
            width: 100%;
            padding: 8px 15px 5px 15px;
            box-sizing: border-box;
            height: 30px;
            float: left;
        }

            .tarjetaDPR > div:nth-child(1) > span > i {
                text-transform: uppercase;
                font-style: normal;
            }

                .tarjetaDPR > div:nth-child(1) > span > i:nth-child(1) {
                    float: left;
                }

                .tarjetaDPR > div:nth-child(1) > span > i:nth-child(2) {
                    float: right;
                }

        .tarjetaDPR > div:nth-child(1) > div {
            padding: 10px;
            display: inline-block;
            width: 100%;
            height: 80px;
            box-sizing: border-box;
            float: left;
        }

            .tarjetaDPR > div:nth-child(1) > div > span {
                display: inline-block;
                width: 100%;
                padding: 5px;
                box-sizing: border-box;
                text-transform: uppercase;
            }

    .tarjetaDPR > div:nth-child(2) {
        position: relative;
        display: inline-block;
        width: 100%;
        min-height: 100px;
        box-sizing: border-box;
        background-color: #FFF;
        padding: 10px;
        z-index: 2;
        float: left;
    }

        .tarjetaDPR > div:nth-child(2) > span {
            display: inline-block;
            padding: 3px 5px;
            box-sizing: border-box;
            width: 100%;
        }

            .tarjetaDPR > div:nth-child(2) > span > i {
                font-style: normal;
                font-weight: bold;
            }

    .tarjetaDPR > i.fa {
        position: absolute;
        left: 0px;
        width: 50px;
        height: 40px;
        display: inline-block;
        text-align: center;
        line-height: 40px;
        font-size: 17px;
        color: #FFF;
        border-radius: 25px 0px 0px 25px;
        opacity: 0;
        visibility: hidden;
        -webkit-transition: all 0.4s ease-in-out;
        -moz-transition: all 0.4s ease-in-out;
        -o-transition: all 0.4s ease-in-out;
        -ms-transition: all 0.4s ease-in-out;
        transition: all 0.4s ease-in-out;
        z-index: 1;
    }

    .tarjetaDPR > i.fa-pencil {
        top: 30px;
        background-color: #607d8b;
    }

    .tarjetaDPR > i.fa-close {
        top: 70px;
        background-color: #F44336;
    }

    .tarjetaDPR:hover > i.fa {
        left: -50px;
        opacity: 1;
        visibility: visible;
        cursor: pointer;
    }

    .tarjetaDPR:hover > i.fa-pencil:hover {
        background-color: #90a4ae;
    }

    .tarjetaDPR:hover > i.fa-close:hover {
        background-color: #ff6a5f;
    }

    .tarjetaDPR:hover {
        -webkit-box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.1), 0 16px 28px 0 rgba(0, 0, 0, 0.1);
        -moz-box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.1), 0 16px 28px 0 rgba(0, 0, 0, 0.1);
        box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.1), 0 16px 28px 0 rgba(0, 0, 0, 0.1);
    }

    .tarjetaDPR > div:nth-child(1) > span > i:nth-child(2):before {
        display: inline-block;
        font: normal normal normal 14px/1 FontAwesome;
        font-size: inherit;
        text-rendering: auto;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        content: "\f017";
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        left: -6px;
        position: relative;
    }

    .tarjetaDPR > div:nth-child(1) > span > i:nth-child(1):before {
        display: inline-block;
        font: normal normal normal 14px/1 FontAwesome;
        font-size: inherit;
        text-rendering: auto;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        content: "\f007";
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        left: -6px;
        position: relative;
    }

.multiBoton {
    display: inline-block;
    width: 100px;
    height: 40px;
    background-color: #EEE;
    border-radius: 5px;
    -webkit-box-shadow: inset 0px 1px 5px 0px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: inset 0px 1px 5px 0px rgba(0, 0, 0, 0.3);
    box-shadow: inset 0px 1px 5px 0px rgba(0, 0, 0, 0.3);
    padding: 2px;
    box-sizing: border-box;
}

    .multiBoton > * {
        display: inline-block;
        width: 46px;
        height: 36px;
        text-align: center;
        line-height: 36px !important;
        font-size: 17px !important;
        color: inherit;
        text-decoration: none;
        cursor: pointer;
        border-radius: 5px;
    }

        .multiBoton > *.active {
            background-color: #FEFEFE;
        }

        .multiBoton > *:not(.active):hover {
            background-color: rgba(255,255,255,0.3);
        }

.btnDescargar {
    display: inline-block;
    height: 40px;
    line-height: 40px !important;
    width: 60px;
    font-size: 17px !important;
    text-align: center;
    background-color: #03A9F4;
    color: #FFF;
    border-radius: 5px;
    cursor: pointer;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}

    .btnDescargar:hover {
        background-color: #4FC3F7;
    }

.tabla-responsive th {
    word-break: break-word;
}

/***********************/
/*PZuniga | 06-03-2020*/
.parpadea {
    animation-name: parpadeo;
    animation-duration: 1s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    /*background: #EF5350;
 background-color: #EF5350;*/
    -webkit-animation-name: parpadeo;
    -webkit-animation-duration: 1s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
}

@-moz-keyframes parpadeo {

    0% {
        background-color: #ffd800;
        opacity: 1.0;
    }

    50% {
        opacity: 0.0;
    }

    100% {
        background-color: #ffd800;
        opacity: 1.0;
    }
}

@-webkit-keyframes parpadeo {
    0% {
        background-color: #ffd800;
        opacity: 1.0;
    }

    50% {
        opacity: 0.0;
    }

    100% {
        background-color: #ffd800;
        opacity: 1.0;
    }
}


@keyframes parpadeo {
    0% {
        background-color: #ffd800;
        opacity: 1.0;
    }

    50% {
        opacity: 0.0;
    }

    100% {
        background-color: #ffd800;
        opacity: 1.0;
    }
}

.parpadea {
    animation-name: parpadeo;
    animation-duration: 1s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    /*background: #EF5350;
  background-color: #EF5350;*/
    -webkit-animation-name: parpadeo;
    -webkit-animation-duration: 1s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
}

@-moz-keyframes parpadeo {

    0% {
        background-color: #ffd800;
        opacity: 1.0;
    }

    50% {
        opacity: 0.0;
    }

    100% {
        background-color: #ffd800;
        opacity: 1.0;
    }
}

@-webkit-keyframes parpadeo {
    0% {
        background-color: #ffd800;
        opacity: 1.0;
    }

    50% {
        opacity: 0.0;
    }

    100% {
        background-color: #ffd800;
        opacity: 1.0;
    }
}

@keyframes parpadeo {
    0% {
        background-color: #ffd800;
        opacity: 1.0;
    }

    50% {
        opacity: 0.0;
    }

    100% {
        background-color: #ffd800;
        opacity: 1.0;
    }
}

.container-tabs {
    display: flex;
}
/*25-03-2020 | YQuinteros | Se configura la visualización de tabs verticales para RESO3*/
.vertical-tabs.ui-tabs-nav {
    display: table-cell;
    background: none;
    border: none;
    padding: 0px !Important;
    position: relative;
    width: 200px;
    float: left;
    border-radius: 0px;
    z-index: 1;
}

    .vertical-tabs.ui-tabs-nav > li {
        border-radius: 0px 5px 5px 0px;
        border-bottom-width: 1px !important;
        width: 200px;
        height: 40px;
        box-sizing: border-box;
        background: #E3E3E3;
        border-color: #BBB;
        line-height: 25px;
    }

        .vertical-tabs.ui-tabs-nav > li.ui-tabs-active {
            border-color: #CCC;
            margin-bottom: 0px !important;
            background: #FFF;
            z-index: 1;
        }

        .vertical-tabs.ui-tabs-nav > li > a {
            font-size: 15px;
            padding: 6px 5px 6px 7px !important;
            color: #777;
            width: 100%;
            box-sizing: border-box;
        }

        .vertical-tabs.ui-tabs-nav > li.ui-tabs-active > a {
            color: #04AD84;
        }

.container-tabs > div {
    margin-top: 20px;
    width: 100%;
}




.form-control {
    display: block;
    height: calc(1.5em + 0.75rem + 2px);
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

    .form-control::-ms-expand {
        background-color: transparent;
        border: 0;
    }

    .form-control:-moz-focusring {
        color: transparent;
        text-shadow: 0 0 0 #495057;
    }

    .form-control:focus {
        color: #495057;
        background-color: #fff;
        border-color: #80bdff;
        outline: 0;
        box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
    }

    .form-control::-webkit-input-placeholder {
        color: #6c757d;
        opacity: 1;
    }

    .form-control::placeholder {
        color: #6c757d;
        opacity: 1;
    }

    .form-control:disabled, .form-control[readonly] {
        background-color: #e9ecef;
        opacity: 1;
    }

.is-invalid {
    border-color: #dc3545;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23dc3545' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right calc(0.375em + 0.1875rem) center;
    background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
}

.is-valid {
    border-color: #28a745;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath fill='%2328a745' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right calc(0.375em + 0.1875rem) center;
    background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
}
.btnPillRed {
    color: #ffffff;
    background-color: #F64E60;
    border-radius: 2rem;
    cursor: pointer;
    outline: none !important;
    vertical-align: middle;
    padding: 0.35rem 0.40rem;
}

.invalid-feedback {
    display: none;
    width: 100%;
    margin-top: 0.25rem;
    font-size: 100%;
    color: #dc3545;
}

.d-none {
    display: none;
}

.controlMayus {
    text-transform: uppercase;
}

.alert {
    position: relative;
    border: 1px solid transparent;
    border-radius: 0.25rem;
}

.alert-success {
    color: #155724;
    background-color: #d4edda;
    border-color: #c3e6cb;
}

.alert-warning {
    color: #856404;
    background-color: #fff3cd;
    border-color: #ffeeba;
}

.alert-info {
    color: #0c5460;
    background-color: #d1ecf1;
    border-color: #bee5eb;
}

.mini-text {
    margin-top: 0.8em;
    font-size: 10px;
}

/*@media (max-width: 1599px) and (min-width: 1024px)
.linkPaso.ui-tabs-nav {
    /* margin-right: -40px !important; */
/*top: -1px;
}*/
.blink {
    margin-right: 0.5rem;
    animation: blink 2s steps(5, start) infinite;
    -webkit-animation: blink 1s steps(5, start) infinite;
}

@keyframes blink {
    to {
        visibility: hidden;
    }
}

@-webkit-keyframes blink {
    to {
        visibility: hidden;
    }
}

.mybadge {
    display: inline-block;
    padding: 0.25em 0.4em;
    font-size: 75%;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: 0.25rem;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.list-bullets {
    list-style: none;
}

    .list-bullets li {
        display: flex;
        align-items: center;
    }

        .list-bullets li::before {
            content: '';
            width: 12px;
            height: 12px;
            border-radius: 50%;
            background: #5784d7;
            border: 2px solid #8fb3f5;
            display: block;
            margin-right: 1rem;
        }

ol.custom-numbers {
    list-style: none;
}

    ol.custom-numbers li {
        counter-increment: my-awesome-counter;
    }

        ol.custom-numbers li::before {
            content: counter(my-awesome-counter) ". ";
            color: #2b90d9;
            font-weight: bold;
        }

.loadCheck {
    pointer-events: none;
    opacity: 0.6;
}

.popup-btn {
    top: 315px;
    position: fixed;
    right: -40px;
    z-index: 1000;
    transform: rotate(-90deg);
}

.modalDigitacion {
    height: 60vh !important;
    overflow-y: auto !important;
}

.modal-lg-digit {
    max-width: 1200px;
}

.modal-header.primary {
    background-color: #253fc8;
}

.modalMessage {
    display: block;
    width: auto;
    min-height: 103px;
    max-height: none;
    height: auto;
}

.messageExterior {
    height: auto;
    width: 300px;
    top: 262px;
    left: 629px;
}

.display-4 {
    font-size: 2rem !important;
    display:block;
}

.inputRep {
    border: 1px solid #aaa !important;
    height: 48px;
    background-image: none !important;
}

.popup-btn-icon {
    top: 485px;
    position: fixed;
    right: -32px;
    z-index: 1000;
    transform: rotate(-90deg);
}