/* Minification failed. Returning unminified contents.
(354,51): run-time error CSS1034: Expected closing parenthesis, found ','
(354,51): run-time error CSS1042: Expected function, found ','
(354,57): run-time error CSS1062: Expected semicolon or closing curly-brace, found ')'
(1127,55): run-time error CSS1046: Expect comma, found '0'
(1127,59): run-time error CSS1046: Expect comma, found '/'
(1129,47): run-time error CSS1046: Expect comma, found '0'
(1129,51): run-time error CSS1046: Expect comma, found '/'
(1279,55): run-time error CSS1046: Expect comma, found '0'
(1279,59): run-time error CSS1046: Expect comma, found '/'
(1281,47): run-time error CSS1046: Expect comma, found '0'
(1281,51): run-time error CSS1046: Expect comma, found '/'
(1822,21): run-time error CSS1039: Token not allowed after unary operator: '-dark'
(1828,21): run-time error CSS1039: Token not allowed after unary operator: '-gray-dark'
(1833,21): run-time error CSS1039: Token not allowed after unary operator: '-white'
(1834,32): run-time error CSS1039: Token not allowed after unary operator: '-blue'
(1872,17): run-time error CSS1039: Token not allowed after unary operator: '-white'
(1978,32): run-time error CSS1039: Token not allowed after unary operator: '-gray-dark'
(2013,12): run-time error CSS1030: Expected identifier, found '.'
(2013,38): run-time error CSS1031: Expected selector, found ')'
(2013,38): run-time error CSS1025: Expected comma or open brace, found ')'
(2043,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(2044,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(2045,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(2046,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(2047,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(2048,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(2049,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(2096,32): run-time error CSS1039: Token not allowed after unary operator: '-semaforo-verde'
(2100,32): run-time error CSS1039: Token not allowed after unary operator: '-semaforo-amarillo'
(2104,32): run-time error CSS1039: Token not allowed after unary operator: '-semaforo-naranja'
(2108,32): run-time error CSS1039: Token not allowed after unary operator: '-semaforo-rojo'
(2112,32): run-time error CSS1039: Token not allowed after unary operator: '-semaforo-blanco'
(2191,32): run-time error CSS1039: Token not allowed after unary operator: '-icon-color'
(2209,32): run-time error CSS1039: Token not allowed after unary operator: '-icon-color'
(2227,32): run-time error CSS1039: Token not allowed after unary operator: '-icon-info-color'
(2233,32): run-time error CSS1039: Token not allowed after unary operator: '-dark'
(2239,32): run-time error CSS1039: Token not allowed after unary operator: '-danger'
(2245,32): run-time error CSS1039: Token not allowed after unary operator: '-warning'
(2250,32): run-time error CSS1039: Token not allowed after unary operator: '-info'
(2256,32): run-time error CSS1039: Token not allowed after unary operator: '-success'
(2262,32): run-time error CSS1039: Token not allowed after unary operator: '-secondary'
(2268,32): run-time error CSS1039: Token not allowed after unary operator: '-primary'
(2272,32): run-time error CSS1039: Token not allowed after unary operator: '-light'
(2292,32): run-time error CSS1039: Token not allowed after unary operator: '-danger'
(2310,32): run-time error CSS1039: Token not allowed after unary operator: '-icon-color'
(2314,32): run-time error CSS1039: Token not allowed after unary operator: '-primary'
(2585,29): run-time error CSS1039: Token not allowed after unary operator: '-info'
(2589,29): run-time error CSS1039: Token not allowed after unary operator: '-warning'
(2593,29): run-time error CSS1039: Token not allowed after unary operator: '-warning'
(2865,28): run-time error CSS1039: Token not allowed after unary operator: '-danger'
(2866,17): run-time error CSS1039: Token not allowed after unary operator: '-light'
(2873,21): run-time error CSS1039: Token not allowed after unary operator: '-light'
(2878,31): run-time error CSS1030: Expected identifier, found '~'
(2878,63): run-time error CSS1031: Expected selector, found ')'
(2878,63): run-time error CSS1025: Expected comma or open brace, found ')'
(2885,35): run-time error CSS1030: Expected identifier, found '~'
(2885,67): run-time error CSS1031: Expected selector, found ')'
(2885,67): run-time error CSS1025: Expected comma or open brace, found ')'
(2894,31): run-time error CSS1030: Expected identifier, found '~'
(2894,63): run-time error CSS1031: Expected selector, found ')'
(2894,63): run-time error CSS1025: Expected comma or open brace, found ')'
(2916,17): run-time error CSS1039: Token not allowed after unary operator: '-primary'
(2917,28): run-time error CSS1039: Token not allowed after unary operator: '-white'
(2918,28): run-time error CSS1039: Token not allowed after unary operator: '-primary'
(2927,33): run-time error CSS1030: Expected identifier, found '['
(2927,38): run-time error CSS1031: Expected selector, found '='
(2927,38): run-time error CSS1025: Expected comma or open brace, found '='
(2951,36): run-time error CSS1039: Token not allowed after unary operator: '-primary'
(2955,33): run-time error CSS1030: Expected identifier, found '['
(2955,38): run-time error CSS1031: Expected selector, found '='
(2955,38): run-time error CSS1025: Expected comma or open brace, found '='
(2974,33): run-time error CSS1030: Expected identifier, found '['
(2974,38): run-time error CSS1031: Expected selector, found '='
(2974,38): run-time error CSS1025: Expected comma or open brace, found '='
(3001,28): run-time error CSS1039: Token not allowed after unary operator: '-gray'
(3022,36): run-time error CSS1039: Token not allowed after unary operator: '-gray-dark'
(3083,39): run-time error CSS1046: Expect comma, found '117'
(3083,47): run-time error CSS1046: Expect comma, found '/'
(3112,21): run-time error CSS1039: Token not allowed after unary operator: '-primary'
(3113,28): run-time error CSS1039: Token not allowed after unary operator: '-primary'
(3116,29): run-time error CSS1030: Expected identifier, found '['
(3116,34): run-time error CSS1031: Expected selector, found '='
(3116,34): run-time error CSS1025: Expected comma or open brace, found '='
(3156,36): run-time error CSS1039: Token not allowed after unary operator: '-primary'
(3213,33): run-time error CSS1039: Token not allowed after unary operator: '-white'
(3237,29): run-time error CSS1039: Token not allowed after unary operator: '-primary'
(3251,44): run-time error CSS1039: Token not allowed after unary operator: '-primary'
(3286,21): run-time error CSS1039: Token not allowed after unary operator: '-primary'
(3291,32): run-time error CSS1039: Token not allowed after unary operator: '-white'
(3295,21): run-time error CSS1039: Token not allowed after unary operator: '-success'
(3300,32): run-time error CSS1039: Token not allowed after unary operator: '-white'
(3324,32): run-time error CSS1039: Token not allowed after unary operator: '-success'
(3344,32): run-time error CSS1039: Token not allowed after unary operator: '-primary'
(3349,28): run-time error CSS1039: Token not allowed after unary operator: '-white'
(3354,28): run-time error CSS1039: Token not allowed after unary operator: '-gray'
(3400,17): run-time error CSS1039: Token not allowed after unary operator: '-white'
(3427,21): run-time error CSS1039: Token not allowed after unary operator: '-gray'
(3463,17): run-time error CSS1039: Token not allowed after unary operator: '-info'
(3505,28): run-time error CSS1039: Token not allowed after unary operator: '-gray'
(3536,37): run-time error CSS1030: Expected identifier, found '['
(3536,51): run-time error CSS1031: Expected selector, found '='
(3536,51): run-time error CSS1025: Expected comma or open brace, found '='
(3541,31): run-time error CSS1030: Expected identifier, found '['
(3541,45): run-time error CSS1031: Expected selector, found '='
(3541,45): run-time error CSS1025: Expected comma or open brace, found '='
(4112,42): run-time error CSS1030: Expected identifier, found '~'
(4112,74): run-time error CSS1031: Expected selector, found ')'
(4112,74): run-time error CSS1025: Expected comma or open brace, found ')'
(4119,46): run-time error CSS1030: Expected identifier, found '~'
(4119,78): run-time error CSS1031: Expected selector, found ')'
(4119,78): run-time error CSS1025: Expected comma or open brace, found ')'
(4476,61): run-time error CSS1030: Expected identifier, found '~'
(4476,81): run-time error CSS1031: Expected selector, found ')'
(4476,81): run-time error CSS1025: Expected comma or open brace, found ')'
(4507,26): run-time error CSS1030: Expected identifier, found '.'
(4507,45): run-time error CSS1031: Expected selector, found ')'
(4507,45): run-time error CSS1025: Expected comma or open brace, found ')'
(4516,26): run-time error CSS1030: Expected identifier, found '~'
(4516,68): run-time error CSS1031: Expected selector, found ')'
(4516,68): run-time error CSS1025: Expected comma or open brace, found ')'
(4530,60): run-time error CSS1030: Expected identifier, found ':'
(4530,66): run-time error CSS1031: Expected selector, found ')'
(4530,66): run-time error CSS1025: Expected comma or open brace, found ')'
(4583,27): run-time error CSS1030: Expected identifier, found '['
(4583,32): run-time error CSS1031: Expected selector, found '='
(4583,32): run-time error CSS1025: Expected comma or open brace, found '='
(4591,22): run-time error CSS1030: Expected identifier, found '.'
(4591,42): run-time error CSS1031: Expected selector, found ')'
(4591,42): run-time error CSS1025: Expected comma or open brace, found ')'
(4608,27): run-time error CSS1030: Expected identifier, found '['
(4608,32): run-time error CSS1031: Expected selector, found '='
(4608,32): run-time error CSS1025: Expected comma or open brace, found '='
(4616,22): run-time error CSS1030: Expected identifier, found '.'
(4616,42): run-time error CSS1031: Expected selector, found ')'
(4616,42): run-time error CSS1025: Expected comma or open brace, found ')'
 */
@charset "UTF-8";
/* CSS Document */

@font-face {
    font-family: 'gothambold';
    src: url('fonts/gothambold-webfont.eot');
    src: url('fonts/gothambold-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/gothambold-webfont.woff2') format('woff2'), url('fonts/gothambold-webfont.woff') format('woff'), url('fonts/gothambold-webfont.ttf') format('truetype'), url('fonts/gothambold-webfont.svg#gothambold') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'gothamlight';
    src: url('fonts/gothamlight-webfont.eot');
    src: url('fonts/gothamlight-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/gothamlight-webfont.woff2') format('woff2'), url('fonts/gothamlight-webfont.woff') format('woff'), url('fonts/gothamlight-webfont.ttf') format('truetype'), url('fonts/gothamlight-webfont.svg#gothamlight') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'gothammedium';
    src: url('fonts/gothammedium_1-webfont.eot');
    src: url('fonts/gothammedium_1-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/gothammedium_1-webfont.woff2') format('woff2'), url('fonts/gothammedium_1-webfont.woff') format('woff'), url('fonts/gothammedium_1-webfont.ttf') format('truetype'), url('fonts/gothammedium_1-webfont.svg#gothammedium') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Affogato-Bold';
    src: url('fonts/Affogato-Bold.eot');
    src: url('fonts/Affogato-Bold.eot?#iefix') format('embedded-opentype'), url('fonts/Affogato-Bold.woff') format('woff'), url('fonts/Affogato-Bold.woff2') format('woff2'), url('fonts/Affogato-Bold.ttf') format('truetype'), url('fonts/Affogato-Bold.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Affogato-Regular';
    src: url('fonts/Affogato-Regular.eot');
    src: url('fonts/Affogato-Regular.eot?#iefix') format('embedded-opentype'), url('fonts/Affogato-Regular.woff') format('woff'), url('fonts/Affogato-Regular.woff2') format('woff2'), url('fonts/Affogato-Regular.ttf') format('truetype'), url('fonts/Affogato-Regular.svg') format('svg');
}

@font-face {
    font-family: 'Affogato-Light';
    src: url('fonts/Affogato-Light.eot');
    src: url('fonts/Affogato-Light.eot?#iefix') format('embedded-opentype'), url('fonts/Affogato-Light.woff') format('woff'), url('fonts/Affogato-Light.woff2') format('woff2'), url('fonts/Affogato-Light.ttf') format('truetype'), url('fonts/Affogato-Light.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}

html,
body {
    height: 100%;
    width: 100%;
    padding: 0;
    margin: 0;
}

.container-login {
    background-image: url(img/bg-login.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    display: flex;
    align-items: center;
    height: 100vh;
    flex-wrap: nowrap;
    flex-direction: row;
    justify-content: center;
    justify-content: flex-start;
}

.container-inicio {
    background-image: url(img/bg-jac.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    height: 90vh;
}

.container-full {
    padding: 0;
    width: 100%;
    overflow: auto;
}

.sidebar-menu {
    border-right: 1px solid #eee;
    width: 300px;
    /*position:fixed;*/
    left: 0;
    top: 0;
    height: 95vh;
    padding-top: 70px;
    overflow-y: auto;
    /*margin:0 0 0 -100%;*/
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
    z-index: 10
}

    .sidebar-menu ul {
        width: auto;
        height: 100%;
        margin: 0;
        list-style: none;
        background-color: #fff;
        overflow-x: hidden;
        padding: 8px 4px 4px 4px;
    }

        .sidebar-menu ul li {
            margin: 0;
        }

            .sidebar-menu ul li ul {
                margin-left: 16px;
            }

    .sidebar-menu a {
        color: #555;
        font-size: 0.9em;
        font-family: 'gothammedium';
        text-decoration: none;
        display: block;
        padding: 5px;
        border-radius: 4px;
        cursor: pointer;
    }

        .sidebar-menu a:hover {
            background-color: #eee;
            color: #DE0000;
            text-decoration: none;
        }

.navbar-toggler {
    padding: 0;
    font-size: 1.25rem;
    line-height: 1;
    background-color: transparent;
    border: 1px solid transparent;
    border-radius: 8px;
    width: 38px;
}

#sidebarMenu {
    border-right: 1px solid #eee;
    min-width: 300px;
    max-width: 300px;
}

.menu-lateral label {
    position: fixed;
    top: 18px;
    left: 28px;
}

.menu-lateral input[type="checkbox"] {
    display: none;
}

    .menu-lateral input[type="checkbox"]:checked ~ .sidebar-menu {
        margin: 0;
    }

    .menu-lateral input[type="checkbox"]:checked ~ label {
        left: 260px;
    }

    .menu-lateral input[type="checkbox"]:checked ~ section {
        -webkit-transform: translate3d(260px, 0, 0);
        -moz-transform: translate3d(260px, 0, 0);
        -o-transform: translate3d(260px, 0, 0);
        transform: translate3d(260px, 0, 0);
    }

header {
    background: linear-gradient(90deg, #141D2B 62.87%, #483F41 88.54%);
    height: 72px;
    padding: 16px 0 !important;
    color: #fff;
    display: flex;
    align-items: center;
    line-height: 24px;
    z-index: 1000;
    position: fixed;
    top: 0;
}

.logo {
    width: auto;
    max-height: 40px;
}

#mainWrapper {
    display: flex;
    width: 100%;
}

#mainContent {
    width: 100%;
}

.navmenu {
    border: 1px solid #fff;
    border-radius: 8px;
    padding: 4px 8px 6px 8px;
    display: inline-block;
    cursor: pointer;
}

    .navmenu img {
        width: 18px;
        height: 18px;
    }

    .navmenu:hover {
        background-color: #888;
        border: 1px solid #888;
    }

.preguntale-jac {
    background-color: rgba(255, 255, 255, 0.30);
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.30);
    border-radius: 4px;
    height: 35px;
    line-height: 35px;
    padding-left: 12px;
    padding-right: 42px;
    width: auto;
    display: inline-block;
    position: relative;
    text-decoration: none;
    margin-right: 24px;
}

    .preguntale-jac:hover {
        background-color: #666;
        color: white;
    }

    .preguntale-jac::after {
        content: '';
        width: 20px;
        height: 20px;
        position: absolute;
        right: 10px;
        top: 6px;
        background-image: url("img/search.svg");
        background-repeat: no-repeat;
        background-size: 20px 20px;
    }

.container-inicio {
    display: flex;
    align-items: center;
    height: 90vh;
    transition-timing-function: ease;
    overflow: hidden !important;
}

.menu-container {
    width: 400px;
    height: 400px;
    border-radius: 50%;
    display: block;
    border: 2px dotted #141D2B;
    padding: 50px;
    margin-left: auto;
    margin-right: auto;
    position: relative;
}

    .menu-container * {
        -webkit-transition: all 0.4s ease;
        -moz-transition: all 0.4s ease;
        -o-transition: all 0.4s ease;
        transition: all 0.4s ease;
    }

.menu-center {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    padding: 8px;
    -webkit-box-shadow: 35px 35px 11px 10px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 35px 35px 11px 10px rgba(0, 0, 0, 0.2);
    box-shadow: 35px 35px 11px 10px rgba(0, 0, 0, 0.2);
    background: linear-gradient(135deg, #c9c9c9, #fff, #fff);
    display: inline-flex;
    justify-content: center;
    align-items: center;
}

.menu-logo {
    width: 92%;
    height: 92%;
    background: linear-gradient(135deg, #fff, #fff, #fff,#c9c9c9);
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}

    .menu-logo img {
        max-width: 90%;
        height: auto;
    }

.account-info {
    padding-left: 4px;
    line-height: 26px;
}

    .account-info a {
        color: #fff;
        text-decoration: none;
    }

#account img {
    width: 24px;
    height: 24px;
    display: inline-block;
    margin-right: 4px;
}

.preguntale-jac, #account {
    display: inline;
}

.menu-opcion {
    position: absolute;
    width: 75px;
    height: 75px;
    border-radius: 50%;
    background-color: #fff;
    text-align: center;
    border: 8px solid rgba(21,29,43,1);
    -webkit-box-shadow: 15px 15px 6px 1px rgba(0, 0, 0, 0.18);
    -moz-box-shadow: 15px 15px 6px 1px rgba(0, 0, 0, 0.18);
    box-shadow: 15px 15px 6px 1px rgba(0, 0, 0, 0.18);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'gothammedium', sans-serif;
    font-size: 1.3em;
}

    .menu-opcion:hover, .menu-opcion:focus {
        -webkit-box-shadow: 10px 12px 10px 6px rgba(0, 0, 0, 0.10);
        -moz-box-shadow: 10px 12px 10px 6px rgba(0, 0, 0, 0.10);
        box-shadow: 10px 12px 10px 6px rgb(0, 0, 0, 0.10);
        cursor: pointer;
        border-radius: 50% !important;
        border: 8px dashed rgba(21,29,43,1);
        background: linear-gradient(323deg, rgba(204,204,204,0.8239889705882353) 0%, rgba(255,255,255,1) 41%);
        transform: scale(1.3) translate(-2px, 0);
        -webkit-transition: all 0.4s ease;
        -moz-transition: all 0.4s ease;
        -o-transition: all 0.4s ease;
        transition: all 0.4s ease;
    }

.opcion-1::before:hover {
    background-size: 18px 27px !important;
}

.menu-opcion img {
    width: 40px;
    height: 40px;
}

.opcion-1 {
    top: -99px;
    left: 41%;
}

    .opcion-1::before {
        position: absolute;
        width: 24px;
        height: 31px;
        bottom: -34px;
        left: 17px;
        background-image: url("img/trg.svg");
        background-repeat: no-repeat;
        background-size: 22px 31px;
        content: '';
    }

    .opcion-1::after {
        position: absolute;
        width: auto;
        height: 24px;
        top: -8px;
        left: -12px;
        line-height: 1em;
        content: 'Finanzas';
    }

.opcion-2 {
    top: 20px;
    right: -58px;
}

    .opcion-2::before {
        position: absolute;
        width: 80px;
        height: 56px;
        bottom: -52px;
        left: -51px;
        background-image: url("img/trg.svg");
        background-repeat: no-repeat;
        background-size: 22px 31px;
        content: '';
        transform: rotate(63deg);
    }

    .opcion-2::after {
        position: absolute;
        width: 150px;
        height: 24px;
        top: 16px;
        right: -172px;
        line-height: 1em;
        text-align: left;
        content: 'Logística y Operaciones';
    }

.opcion-3 {
    top: 188px;
    right: -98px;
}

    .opcion-3::before {
        position: absolute;
        width: 24px;
        height: 63px;
        bottom: -2px;
        left: -46px;
        background-image: url("img/trg.svg");
        background-repeat: no-repeat;
        background-size: 22px 31px;
        content: '';
        transform: rotate(90deg);
    }

    .opcion-3::after {
        position: absolute;
        width: auto;
        height: 24px;
        top: 16px;
        right: -116px;
        content: 'Postventa';
    }

.opcion-4 {
    top: 33%;
    right: -77px;
}

    .opcion-4::before {
        position: absolute;
        width: 24px;
        height: 31px;
        bottom: 10px;
        left: -30px;
        background-image: url("img/trg.svg");
        background-repeat: no-repeat;
        background-size: 22px 31px;
        content: '';
        transform: rotate(90deg);
    }

    .opcion-4::after {
        position: absolute;
        width: auto;
        height: 24px;
        top: 16px;
        right: -115px;
        content: '';
    }

.opcion-5 {
    bottom: -22px;
    right: -20px;
}

    .opcion-5::before {
        position: absolute;
        width: 24px;
        height: 31px;
        top: -9px;
        left: -25px;
        background-image: url(img/trg.svg);
        background-repeat: no-repeat;
        background-size: 22px 31px;
        content: '';
        transform: rotate(120deg);
    }

    .opcion-5::after {
        position: absolute;
        width: auto;
        height: 24px;
        top: 16px;
        right: -190px;
        content: 'Ventas Digitales';
    }

.opcion-6 {
    bottom: -97px;
    right: 157px;
}

    .opcion-6::before {
        position: absolute;
        width: 25px;
        height: 36px;
        top: -38px;
        left: 11px;
        background-image: url(img/trg.svg);
        background-repeat: no-repeat;
        background-size: 22px 31px;
        content: '';
        transform: rotate(179deg);
    }

    .opcion-6::after {
        position: absolute;
        width: auto;
        height: 24px;
        top: 16px;
        right: -118px;
        content: 'Producto';
    }

.opcion-7 {
    bottom: -99px;
    left: 41%;
}

    .opcion-7::before {
        position: absolute;
        width: 24px;
        height: 31px;
        top: -34px;
        left: 16px;
        background-image: url("img/trg.svg");
        background-repeat: no-repeat;
        background-size: 22px 31px;
        content: '';
        transform: rotate(180deg);
    }

    .opcion-7::after {
        position: absolute;
        width: auto;
        height: 24px;
        bottom: -40px;
        left: 0;
        content: 'Legal';
    }

.opcion-8 {
    bottom: -27px;
    left: -18px;
}

    .opcion-8::before {
        position: absolute;
        width: 24px;
        height: 31px;
        top: -28px;
        right: -5px;
        background-image: url(img/trg.svg);
        background-repeat: no-repeat;
        background-size: 22px 31px;
        content: '';
        transform: rotate(210deg);
    }

    .opcion-8::after {
        position: absolute;
        width: 132px;
        top: 16px;
        left: -146px;
        content: 'Comercial';
    }

.opcion-9 {
    bottom: 125px;
    left: -90px;
}

    .opcion-9::before {
        position: absolute;
        width: 24px;
        height: 31px;
        top: -11px;
        right: -23px;
        background-image: url(img/trg.svg);
        background-repeat: no-repeat;
        background-size: 22px 31px;
        content: '';
        transform: rotate(240deg);
    }

    .opcion-9::after {
        position: absolute;
        width: auto;
        height: auto;
        top: 16px;
        left: -156px;
        content: 'Capacitación';
    }

.opcion-10 {
    top: 33%;
    left: -77px;
}

    .opcion-10::before {
        position: absolute;
        width: 24px;
        height: 31px;
        bottom: 12px;
        right: -30px;
        background-image: url("img/trg.svg");
        background-repeat: no-repeat;
        background-size: 22px 31px;
        content: '';
        transform: rotate(-90deg);
    }

    .opcion-10::after {
        position: absolute;
        width: auto;
        height: 24px;
        top: 16px;
        left: -122px;
        content: 'Dirección';
    }

.opcion-11 {
    top: 40px;
    left: -70px;
}

    .opcion-11::before {
        position: absolute;
        width: 24px;
        height: 31px;
        bottom: -9px;
        right: -25px;
        background-image: url("img/trg.svg");
        background-repeat: no-repeat;
        background-size: 22px 31px;
        content: '';
        transform: rotate(300deg);
    }

    .opcion-11::after {
        position: absolute;
        width: auto;
        height: 24px;
        top: 16px;
        left: -114px;
        content: 'Dirección';
    }

.opcion-12 {
    top: -77px;
    left: 56px;
}

    .opcion-12::before {
        position: absolute;
        width: 24px;
        height: 31px;
        bottom: -28px;
        right: -6px;
        background-image: url("img/trg.svg");
        background-repeat: no-repeat;
        background-size: 22px 31px;
        content: '';
        transform: rotate(330deg);
    }

    .opcion-12::after {
        position: absolute;
        width: 150px;
        height: 24px;
        top: 8px;
        left: -172px;
        line-height: 1em;
        text-align: right;
        content: 'Business Intelligence';
    }

.opcion-13 {
    top: -81px;
    left: 253px;
}

    .opcion-13::before {
        position: absolute;
        width: 24px;
        height: 31px;
        bottom: -28px;
        left: -6px;
        background-image: url("img/trg.svg");
        background-repeat: no-repeat;
        background-size: 22px 31px;
        content: '';
        transform: rotate(30deg);
    }

    .opcion-13::after {
        position: absolute;
        width: 150px;
        height: 24px;
        top: 16px;
        right: -172px;
        line-height: 1em;
        text-align: left;
        content: 'Intranet GML';
        color: #212529;
    }

.transition {
    transform: scale(100);
}

.seccion {
    height: 100vh;
    display: flex;
    align-items: center;
    font-family: 'gothamlight';
    background-image: url(img/bg-jac.jpg);
    background-repeat: no-repeat;
    background-size: cover;
}

.subseccion {
    text-align: center;
    font-size: 3.5em;
    text-transform: uppercase;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    margin-bottom: 48px;
    line-height: 1.2em;
}

    .subseccion img {
        width: 120px;
        height: 120px;
        margin-bottom: 16px;
    }

.back {
    display: inline-block;
    width: 64px;
    height: 64px;
    border-right: 1px solid #141D2B;
    padding: 8px 0 8px 8px;
    cursor: pointer;
}

    .back img {
        width: 48px;
        height: 48px;
    }

    .back:hover img {
        width: 40px;
        height: auto;
        -webkit-transition: all 0.4s ease;
        -moz-transition: all 0.4s ease;
        -o-transition: all 0.4s ease;
        transition: all 0.4s ease;
    }

.rowsecc {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    flex-direction: row;
    justify-content: space-between;
    width: 100%;
}

.hasub {
    background-image: url(img/arrw.svg);
    background-repeat: no-repeat;
    background-position: right;
    background-size: 24px;
}

.subcollapse {
    background-image: url(img/arrw-up.svg);
    background-repeat: no-repeat;
    background-position: right;
    background-size: 24px;
}

.hasub-n {
    padding-top: 12px;
    padding-bottom: 12px;
    font-family: 'gothammedium', sans-serif;
    border-bottom: 1px solid #ccc;
    border-radius: 0;
}

    .hasub-n img {
        margin-right: 12px;
        height: 24px;
        width: 24px;
    }

.hasub-nn {
    /*background-image: url(img/arrw-sub.svg);
  background-repeat: no-repeat;
  background-position: right;
  background-size: 20px;*/
}
/*#submenuFunciones a::after{
  display: none;
}*/
.hasub-n.dropdown-toggle::after {
    display: none;
}

a.hasbull {
    position: relative;
    padding-left: 20px;
}

    a.hasbull::after {
        display: inline-block;
        margin-left: 0.255em;
        vertical-align: 0.255em;
        content: "";
        border-top: 0.3em solid;
        border-right: 0.3em solid transparent;
        border-bottom: 0;
        border-left: 0.3em solid transparent;
        position: absolute;
        right: 8px;
        top: 14px;
    }

    a.hasbull::before {
        position: absolute;
        width: 4px;
        height: 4px;
        background-color: #ccc;
        border-radius: 50%;
        content: '';
        left: 8px;
        top: 13px;
    }

.subcollapse-nn {
    background-image: url(img/arrw-sub-up.svg);
    background-repeat: no-repeat;
    background-position: right;
    background-size: 20px;
    background-color: #eee;
}

#sidebarMenu a.active, #sidebarMenu ul li.active > a, #sidebarMenu a[aria-expanded="true"] {
    color: #DE0000 !important;
}

.nav-n2 {
    margin-right: 24px;
    overflow-y: scroll;
    height: auto;
    max-height: 640px;
    padding-bottom: 50px;
    margin-top: 140px;
}

    .nav-n2 ul {
    }

        .nav-n2 ul li {
            list-style: none
        }

            .nav-n2 ul li a {
                display: block;
                padding: 8px 32px 8px 16px;
                margin-bottom: 8px;
                text-decoration: none;
                background-color: rgba(0, 0, 0, 0.10);
                border-radius: 4px;
                color: #111;
                font-size: 1.2em;
                border: 1px solid rgba(0,0,0,0);
                cursor: pointer;
            }

                .nav-n2 ul li a:hover {
                    display: block;
                    padding: 8px 32px 8px 16px;
                    margin-bottom: 8px;
                    text-decoration: none;
                    background-color: rgba(255, 255, 255, 0.3);
                    border-radius: 4px;
                    color: #111;
                    font-size: 1.2em;
                    border: 1px solid rgba(0,0,0,1);
                }

            .nav-n2 ul li ul {
                margin-bottom: 12px;
            }

                .nav-n2 ul li ul li a {
                    display: block;
                    padding: 8px 16px;
                    margin-bottom: 8px;
                    text-decoration: none;
                    background: rgba(0, 0, 0, 0);
                    border: 1px solid #111;
                    ;
                    border-radius: 4px;
                    color: #111;
                    font-size: 1.2em;
                    cursor: pointer;
                }

                    .nav-n2 ul li ul li a:hover {
                        background-color: rgba(0, 0, 0, 0.5);
                        border: 1px solid rgba(0,0,0,0.5);
                        color: #fff;
                    }

                .nav-n2 ul li ul li ul {
                    margin-left: 32px;
                }

    .nav-n2 .dropdown-toggle::after {
        display: none;
    }

.login img {
    width: 320px;
    height: auto;
}

.login-form {
}

    .login-form img {
        height: 70px;
        width: auto;
    }

    .login-form h1 {
        font-size: 1.8em;
        font-family: 'gothamlight', sans-serif;
        text-transform: uppercase;
        color: #fff;
        text-align: center;
        margin-top: 24px;
        margin-bottom: 40px;
    }

.form-check-input {
    position: relative;
    margin-top: 0.3rem;
    margin-left: 0;
}

.login-form input[type=text], .login-form input[type=password] {
    height: 56px;
    padding: 16px;
    font-size: 1.3em;
    margin-bottom: 16px;
}

.login-form input[type=button], .login-form input[type=submit], .login-form input[type=reset] {
    background-color: #093478;
    border: 1px solid #093478;
    color: white;
    text-decoration: none;
    cursor: pointer;
    padding: 16px;
    font-size: 1.3em;
    display: block;
    width: 100%;
    margin-top: 24px;
}

    .login-form input[type=submit]:hover {
        background-color: #081c3d;
        color: #fff;
        border: 1px solid #fff;
    }

.login-form a {
    font-size: 0.9em !important;
    color: #fff !important;
    text-decoration: underline !important;
}

    .login-form a:hover {
        color: #999 !important;
        text-decoration: none !important;
    }

.login-form label {
    font-size: 0.9em !important;
    color: #fff !important;
    padding-left: 4px;
}

.login-form input[type=button], .login-form input[type=submit], .login-form input[type=reset] {
    background-color: #093478;
    border: 1px solid #093478;
    color: white;
    text-decoration: none;
    cursor: pointer;
    padding: 16px;
    font-size: 1.3em;
    display: block;
    width: 100%;
    margin-top: 24px;
}

.account-icon, .search-icon, .search-icon-xs {
    display: none;
    width: 28px;
    height: 28px;
    position: absolute;
}

    .account-icon img, .search-icon img, .search-icon-xs img {
        width: 28px;
        height: 28px;
    }

#search, #account {
    display: inline;
}

a:hover {
    text-decoration: inherit;
}

.sidebar-menu a.active {
    background-color: #eee;
    color: #DE0000;
}

.container-login {
    color: #fff;
}

.login-form label, .login-form a {
    font-size: 1em !important;
}

.btn-ingresar-365 {
    padding: 16px;
    font-size: 1.3em;
    display: block;
    width: 100%;
}

.form-textplain { display: inline-block; padding-top:calc(.375rem + 1px);padding-bottom:calc(.375rem + 1px);margin-bottom:0;font-size:inherit;line-height:1.5; }

@media only screen and (min-width: 1025px) and (max-width: 1370px) {
    .container-login {
        display: flex;
        align-items: center;
        height: 100vh;
        flex-direction: row;
        padding: 16px !important;
        justify-content: center;
        flex-wrap: nowrap;
    }

    .login img {
        width: 220px;
        height: auto;
        margin-bottom: 40px;
    }

    .login-form img {
        height: 55px;
        width: auto;
    }

    .login-form h1 {
        margin-top: 16px;
    }

    #search, #account {
        display: inline;
    }

    .menu-container {
        width: 300px;
        height: 300px;
        border-radius: 50%;
        display: block;
        border: 2px dotted #141D2B;
        padding: 25px;
        margin-left: auto;
        margin-right: auto;
        /*margin-top: 70px;*/
        position: relative;
    }

    .menu-center {
        width: 100%;
        height: 100%;
        border-radius: 50%;
        padding: 8px;
        -webkit-box-shadow: 35px 35px 11px 10px rgb(0 0 0 / 20%);
        -moz-box-shadow: 35px 35px 11px 10px rgba(0, 0, 0, 0.2);
        box-shadow: 35px 35px 11px 10px rgb(0 0 0 / 20%);
        background: linear-gradient(135deg, #c9c9c9, #fff, #fff);
        display: inline-flex;
        justify-content: center;
        align-items: center;
    }

    .menu-logo {
        width: 92%;
        height: 92%;
        background: linear-gradient(135deg, #fff, #fff, #fff,#c9c9c9);
        border-radius: 50%;
        display: flex;
        justify-content: center;
        align-items: center;
    }

        .menu-logo img {
            max-width: 90%;
            height: auto;
        }

    .menu-opcion {
        width: 70px;
        height: 70px;
        border-radius: 50%;
        border: 8px solid rgba(21,29,43,1);
        font-size: 1.3em;
    }

        .menu-opcion img {
            width: 32px;
            height: 32px;
        }

    .opcion-1 {
        top: -94px;
        left: 39%;
    }

    .opcion-2 {
        top: -3px;
        right: -59px;
    }

    .opcion-3 {
        top: 135px;
        right: -93px;
    }

    .opcion-4 {
        top: 40%;
        right: -94px;
    }

    .opcion-5 {
        bottom: -28px;
        right: -36px;
    }

    .opcion-6 {
        bottom: -93px;
        right: 110px;
    }

    .opcion-7 {
        bottom: -94px;
        left: 39%;
    }

    .opcion-8 {
        bottom: -43px;
        left: -20px;
    }

    .opcion-9 {
        bottom: 80px;
        left: -85px;
    }

    .opcion-10 {
        top: 33%;
        left: -77px;
    }

    .opcion-11 {
        top: 10px;
        left: -67px;
    }

    .opcion-12 {
        top: -77px;
        left: 33px;
    }

    .opcion-13 {
        top: -82px;
        left: 175px;
    }
}



@media only screen and (min-width: 769px) and (max-width: 1023px) {
    .container-login {
        display: flex;
        align-items: center;
        height: 100%;
        flex-direction: row;
        padding: 16px !important;
        flex-wrap: nowrap;
    }

    .login img {
        width: 220px;
        height: auto;
        margin-bottom: 40px;
    }

    .login-form img {
        height: 55px;
        width: auto;
    }

    .login-form h1 {
        margin-top: 16px;
    }

    #search, #account {
        display: inline;
    }

    .menu-container {
        width: 250px;
        height: 250px;
        border-radius: 50%;
        display: block;
        border: 2px dotted #141D2B;
        padding: 25px;
        margin-left: auto;
        margin-right: auto;
        margin-top: 75px;
        position: relative;
    }

    .menu-center {
        width: 100%;
        height: 100%;
        border-radius: 50%;
        padding: 8px;
        -webkit-box-shadow: 35px 35px 11px 10px rgb(0 0 0 / 20%);
        -moz-box-shadow: 35px 35px 11px 10px rgba(0, 0, 0, 0.2);
        box-shadow: 35px 35px 11px 10px rgb(0 0 0 / 20%);
        background: linear-gradient(135deg, #c9c9c9, #fff, #fff);
        display: inline-flex;
        justify-content: center;
        align-items: center;
    }

    .menu-logo {
        width: 92%;
        height: 92%;
        background: linear-gradient(135deg, #fff, #fff, #fff,#c9c9c9);
        border-radius: 50%;
        display: flex;
        justify-content: center;
        align-items: center;
    }

        .menu-logo img {
            max-width: 90%;
            height: auto;
        }

    .opcion-1 {
        top: -99px;
        left: 33%;
    }

    .opcion-2 {
        top: -25px;
        right: -55px;
    }

    .opcion-3 {
        top: 85px;
        right: -87px;
    }

    .opcion-4 {
        top: 36%;
        right: -98px;
    }

    .opcion-5 {
        bottom: -25px;
        right: -62px;
    }

    .opcion-6 {
        bottom: -90px;
        right: 50px;
    }

    .opcion-7 {
        bottom: -86px;
        left: 33%;
    }

    .opcion-8 {
        bottom: -67px;
        left: -18px;
    }

    .opcion-9 {
        bottom: 32px;
        left: -88px;
    }

    .opcion-10 {
        top: 36%;
        left: -98px;
    }

    .opcion-11 {
        top: 5px;
        left: -80px;
    }

    .opcion-12 {
        top: -80px;
        left: 5px;
    }

    .opcion-13 {
        top: -90px;
        left: 130px;
    }

    .preguntale-jac, #account {
        display: inline;
    }
}



@media only screen and (min-width:320px) and (max-width:768px) {
    .container-login {
        display: flex;
        align-items: center;
        height: 100%;
        flex-direction: column;
        padding: 16px !important;
        flex-wrap: nowrap;
        justify-content: center;
    }

    header {
        height: auto;
        overflow: visible !important;
    }

    .login img {
        width: 220px;
        height: auto;
        margin-bottom: 40px;
    }

    .login-form img {
        height: 55px;
        width: auto;
    }

    .login-form h1 {
        margin-top: 16px;
    }

    .search-icon {
        position: relative;
        display: inline-block;
        z-index: 10000;
    }

    .account-icon {
        position: absolute;
        right: 16px;
        top: 18px;
        display: inline !important;
        z-index: 10000;
    }

    .search-icon {
        display: none;
    }

    .search-icon-xs {
        position: absolute;
        right: 58px;
        top: 18px;
        display: inline;
        z-index: 10000;
    }

    .seccion {
        height: 100%;
        display: block;
        align-items: center;
    }

    .preguntale-jac, .ico-session, #account {
        display: none;
    }

    .rowsecc {
        display: flex;
        align-items: center;
        flex-wrap: nowrap;
        flex-direction: column;
        justify-content: flex-start;
        width: 100%;
        height: auto !important;
    }

    .nav-n2 {
        overflow-y: visible;
        height: auto;
        max-height: 100%;
        padding-bottom: 50px;
        margin-top: 0;
    }

        .nav-n2 ul {
            padding-left: 0;
        }

    #account {
        position: absolute;
        right: 0px;
        top: 64px;
        z-index: 1000;
        background-color: #141d2b;
        background-color: #141d2b;
        -webkit-border-bottom-right-radius: 8px;
        -webkit-border-bottom-left-radius: 8px;
        -moz-border-radius-bottomright: 8px;
        -moz-border-radius-bottomleft: 8px;
        border-bottom-right-radius: 8px;
        border-bottom-left-radius: 8px;
    }
}



@media only screen and (min-width: 70px) and (max-width: 599px) {
    header {
        height: auto;
        position: fixed;
        top: 0;
    }

    .logo {
        width: auto;
        max-height: 32px;
    }

    .btn-preg, .ico-session {
        display: none;
    }

    .container-login {
        display: flex;
        align-items: center;
        height: 100%;
        flex-direction: column;
        padding: 16px !important;
    }

    .login img {
        width: 220px;
        height: auto;
        margin-bottom: 40px;
    }

    .login-form img {
        height: 55px;
        width: auto;
    }

    .login-form h1 {
        margin-top: 16px;
    }

    #mainWrapper {
        height: 100%;
    }

    .seccion {
        height: 100%;
        display: grid;
        align-items: flex-start;
        font-family: 'gothamlight';
        background-image: url(img/bg-jac.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        background-attachment: fixed;
        overflow-y: scroll;
        justify-content: center;
    }

    .subseccion {
        font-size: 2.2em;
        text-transform: uppercase;
        display: flex;
        align-items: center;
        flex-direction: column;
        justify-content: center;
        margin-bottom: 32px;
        line-height: 1.2em;
    }

        .subseccion img {
            width: 75px;
            height: 75px;
            margin-bottom: 16px;
        }

    .nav-n2 {
        margin-right: 0;
        overflow-y: scroll;
        height: auto;
    }

        .nav-n2 ul {
            padding-left: 16px;
            padding-right: 16px;
        }

    .container-inicio {
        display: flex;
        height: 100%;
        /* transition-timing-function: ease; */
        /* overflow: hidden !important; */
        align-items: flex-start;
        justify-content: flex-start;
        flex-direction: column;
        flex-wrap: nowrap;
    }

    .menu-container {
        width: 100%;
        height: 85%;
        border: 0;
        border-radius: unset;
        display: flex;
        position: relative;
        padding: 0 8px 40px 8px;
        overflow-y: auto;
        flex-wrap: wrap;
        justify-content: space-around;
        align-content: stretch;
    }

    .menu-center {
        display: none;
    }

    .menu-opcion {
        position: relative;
        margin: 32px;
        font-size: 1.2em;
    }

    .opcion-2::after {
        bottom: -40px;
        left: -32px;
        top: auto;
        right: auto;
        text-align: center;
        width: 120px;
    }

    .opcion-3::after {
        bottom: -40px;
        left: -16px;
        top: auto;
        right: auto;
    }

    .opcion-5::after {
        bottom: -40px;
        left: auto;
        top: auto;
        right: auto;
        line-height: 1.2em;
    }

    .opcion-6::after {
        bottom: -40px;
        left: -4px;
        top: auto;
        right: auto;
    }

    .opcion-7::after {
        bottom: -40px;
        left: auto;
        top: auto;
        right: auto;
    }

    .opcion-12::after {
        bottom: -40px;
        left: -46px;
        top: auto;
        right: auto;
        text-align: center;
    }

    .opcion-1::after, .opcion-4::after, .opcion-10::after {
        bottom: -40px;
        left: -17px;
        top: auto;
        right: auto;
        text-align: center;
    }

    .opcion-9::after {
        bottom: -40px;
        left: -30px;
        top: auto;
        right: auto;
    }

    .opcion-8::after {
        width: auto;
        bottom: -40px;
        left: -20px;
        top: auto;
        right: auto;
    }

    .opcion-11::after {
        bottom: -40px;
        left: -16px;
        top: auto;
        right: auto;
        text-align: center;
    }

    .opcion-1::before, .opcion-2::before, .opcion-3::before, .opcion-4::before, .opcion-5::before, .opcion-6::before, .opcion-7::before, .opcion-8::before, .opcion-9::before, .opcion-10::before, .opcion-11::before, .opcion-12::before, .opcion-13::before {
        display: none;
    }

    .opcion-1, .opcion-2, .opcion-3, .opcion-4, .opcion-5, .opcion-6, .opcion-7, .opcion-8, .opcion-9, .opcion-10, .opcion-11, .opcion-12, .opcion-13 {
        top: auto;
        bottom: auto;
        right: auto;
        left: auto;
    }

    .account-icon {
        position: fixed;
        right: 16px;
        top: 18px;
        display: inline !important;
        z-index: 10000;
    }

    .search-icon {
        display: none;
    }

    .search-icon-xs {
        position: fixed;
        right: 58px;
        top: 18px;
        display: inline;
        z-index: 10000;
    }

    .account-icon img, .search-icon img {
        width: 28px;
        height: 28px;
    }

    header input[type="button"] {
        right: 2px;
    }

    .sidebar-menu {
        width: 100%;
    }

    .sidebar-menu {
        color: #666;
        font-size: 1.2em;
        font-family: 'gothammedium', sans-serif;
    }

    #account {
        display: none;
    }

    #sidebarMenu {
        border-right: 0;
        min-width: 100%;
        max-width: 100%;
        height: 90vh;
        position: fixed;
        top: 70px;
    }

    .rowsecc {
        display: flex;
        align-items: center;
        flex-wrap: nowrap;
        flex-direction: column;
        justify-content: flex-start;
        width: 100%;
        height: auto !important;
    }

    .container-fluid {
        padding-left: 0;
        padding-right: 0;
    }
}
/** Bootstrap fixes **/
.dropdown-menu[role=combobox] {
    z-index: 1060 !important;
}

    .dropdown-menu[role=combobox] ul.dropdown-menu li.selected {
        background-color: #ddd;
    }

    .dropdown-menu[role=combobox] ul.dropdown-menu li a.dropdown-item:focus,
    .dropdown-menu[role=combobox] ul.dropdown-menu li a.dropdown-item:hover {
        color: #fff;
        background-color: #495057;
    }

.btn-warning {
    color: #4b2b09;
}

    .btn-warning:hover {
        color: #4b2b09;
    }

.bootstrap-select > .dropdown-toggle {
    background-color: #fff;
    color: #495057 !important;
    border: 1px solid #ced4da;
}

    .bootstrap-select > .dropdown-toggle:after {
        content: '\f107';
        font-family: 'FontAwesome';
        font-weight: bold;
        width: 30px;
        height: 30px;
        position: absolute;
        right: 4px;
        top: 7px;
        font-size: 1rem;
        border: none;
    }

.modal {
    z-index: 99995;
}

.modal-backdrop {
    z-index: 99990;
}

.button-order {
    position: relative;
    float: right;
    margin-left: 6px;
}
/******/
/************* Bootstrap Datepicker fixes **************/
.datepicker {
    cursor: pointer;
}

.datepicker-dropdown {
    box-shadow: 5px 5px 10px rgba(0,0,0,0.25);
}

    .datepicker table tr td.day:not(.disabled) {
        color: var(--dark);
        font-weight: 500;
    }

    .datepicker table tr td.day.new:not(.disabled),
    .datepicker table tr td.day.old:not(.disabled) {
        color: var(--gray-dark);
        font-weight: 400;
    }

    .datepicker table tr td.day:not(.disabled):hover {
        color: var(--white);
        background-color: var(--blue);
    }

    .datepicker table tr td.day.disabled {
        color: #bebebe
    }

    .datepicker table tr td.day.active,
    .datepicker table tr td.day.active:hover {
        color: #fff;
        background-color: #286090;
        border-color: #204d74;
    }

/************* Bootstrap Datepicker fixes **************/

/************* Bootstrap Radio Buttons fixes **************/

.custom-control-input:checked ~ .custom-control-label::before {
    color: #fff;
    border-color: #696969;
    background-color: #696969;
    outline: none;
    -webkit-appearance: none;
}

.custom-control-input:focus ~ .custom-control-label::before {
    box-shadow: none;
}

/************* Bootstrap Radio Buttons fixes **************/


/************* Bootstrap Buttons fixes **************/

.btn.btn-orange {
    background-color: #fe601e;
    border-color: #fe601e;
    color: var(--white);
}

.btn-orange:hover {
    background-color: #e74c05;
}

/************* Bootstrap Buttons fixes **************/

/************* Bootstrap Carousel Slider fixes **************/

.carousel-control-next, .carousel-control-prev {
    background-color: transparent;
    border: 0;
}

.carousel-inner {
    background-color: #4a4a4a;
    overflow: hidden;
}

.carousel-control-next-icon,
.carousel-control-prev-icon {
    background-image: none;
    width: 60px;
    height: 60px;
    display: flex;
    justify-content: center;
    align-items: center;
}

    .carousel-control-prev-icon:before {
        content: '\f053';
        font-family: 'FontAwesome';
        font-weight: bold;
        font-size: 2.5rem;
        border: none;
        text-shadow: 1px 1px 2px #444;
    }

    .carousel-control-next-icon:before {
        content: '\f054';
        font-family: 'FontAwesome';
        font-weight: bold;
        font-size: 2.5rem;
        border: none;
        text-shadow: 1px 1px 2px #444;
    }

.carousel-indicators li:before {
    content: '';
    display: block;
    box-sizing: content-box;
    flex: 0 1 auto;
    width: 30px;
    height: 3px;
    margin-right: 0;
    margin-left: 0;
    text-indent: -999px;
    cursor: pointer;
    background-color: #fff;
    background-clip: padding-box;
    border-top: 0px solid transparent;
    border-bottom: 0px solid transparent;
    box-shadow: 1px 1px 1px #444;
    opacity: .5;
    transition: opacity .6s ease;
}

/************* Bootstrap Carousel Slider fixes **************/

/************* Bootstrap Navs **************/
.nav-tabs .nav-link:focus {
    outline: none !important;
}

.nav-tabs .nav-link.detail:not(.active) {
    font-weight: 400;
    border-bottom-color: rgb(222, 226, 230);
}

.nav-tabs .nav-link.active.link-bold {
    font-weight: 700;
}

.nav.nav-pills {
    border-radius: 0.3rem;
}

.nav-pills .nav-link {
    border-radius: 0;
    font-weight: 600;
}

    .nav-pills .nav-link:first-child {
        border-top-left-radius: .25rem;
        border-top-right-radius: .25rem;
    }

    .nav-pills .nav-link:last-child {
        border-bottom-left-radius: .25rem;
        border-bottom-right-radius: .25rem;
    }

    .nav-pills .nav-link.active,
    .nav-pills .show > .nav-link {
        background-color: var(--gray-dark);
        border-radius: .25rem;
        font-weight: 400;
    }

    .nav-pills .nav-link.disabled {
        color: #a1a1a1;
        font-weight: 500;
    }

    .nav-pills .nav-link,
    .nav-pills .nav-link.active,
    .nav-pills .nav-link.focus {
        border: none;
        outline: none !important;
    }

        .nav-pills .nav-link:not(.active):hover {
            background-color: #b2d7ff;
            color: #003d7f;
            border-radius: 0.25rem;
        }
/************* Bootstrap Navs **************/

/************* Material Icons Google Fonts **************/

.material-symbols-outlined {
    font-variation-settings: 'FILL' 1, 'wght' 600, 'GRAD' 200, 'opsz' 24;
    font-size: 22px;
}

.btn-sm > .material-symbols-outlined {
    font-size: 20px;
}

button:has(.material-symbols-outlined) {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
}

/************* Material Icons Google Fonts **************/

@media only screen and (min-width: 992px) and (max-width: 1370px) {
}




@media only screen and (min-width: 768px) and (max-width: 991px) {
}




@media only screen and (min-width:320px) and (max-width:767px) {
}




@media only screen and (min-width: 70px) and (max-width: 599px) {
}
:root {
    --semaforo-verde: #008000;
    --semaforo-amarillo: #ffc107;
    --semaforo-naranja: #fd7e14;
    --semaforo-rojo: #dc3545;
    --semaforo-blanco: #fff;
    --icon-color: var(--light);
    --icon-info-color: var(--info);
}

body {
    padding-top: 0;
}

    body.no-header {
        padding-top: 0 !important;
    }

#mainContent {
    padding-top: 70px !important;
}

    #mainContent.not-header {
        padding-top: 0px !important;
    }

.text-sm {
    font-size: 0.8rem;
}

.custom-file-label {
    overflow: hidden;
}

.col-form-label {
    font-weight: bold;
}

.text-success {
    color: #008542 !important;
}

.bg-lightgray {
    background-color: #f8f9fa !important;
}

.semaforo {
    height: 15px;
    width: 15px;
    border-radius: 50px;
    margin: auto;
}

    .semaforo.verde {
        background-color: var(--semaforo-verde);
    }

    .semaforo.amarillo {
        background-color: var(--semaforo-amarillo);
    }

    .semaforo.naranja {
        background-color: var(--semaforo-naranja);
    }

    .semaforo.rojo {
        background-color: var(--semaforo-rojo);
    }

    .semaforo.blanco {
        background-color: var(--semaforo-blanco);
        border: 1px solid #eee;
    }

.no-display {
    display: none !important;
}

.minw-15 {
    min-width: 15%
}

.form-labels-right .form-group .col-form-label {
    text-align: right;
}

    .form-labels-right .form-group .col-form-label small {
        position: absolute;
        left: 0;
        bottom: -15px;
        width: 100%;
        font-weight: bold;
        color: #17a2b8;
        padding-right: 26px;
    }

.form-labels-right .form-row {
    margin-right: -15px;
    margin-left: -15px;
}

    .form-labels-right .form-row .col-form-label {
        text-align: right;
        padding-right: 15px;
    }

.form-control-plaintext {
    padding: 0 0.5rem;
    margin-top: calc(.375rem + 1px);
}

.form-label-small {
    font-size: 0.9rem;
    font-weight: 400;
    margin-bottom: 0.35rem;
    color: #4a4a4a;
}

.form-labels-right .form-group .col-form-label {
    text-align: right;
}

.form-labels-right .form-row {
    margin-right: -15px;
    margin-left: -15px;
}

    .form-labels-right .form-row .col-form-label {
        text-align: right;
        padding-right: 15px;
    }

/** Iconos **/

.icon-exclamation-circle {
    display: inline-block;
    width: 22px;
    height: 22px;
}

    .icon-exclamation-circle:before {
        content: '';
        display: block;
        width: 100%;
        height: 100%;
        -webkit-mask-image: url(img/alert-circle-icon.svg);
        mask-image: url(img/alert-circle-icon.svg);
        -webkit-mask-size: cover;
        mask-size: contain;
        background-color: var(--icon-color);
    }

.icon-exclamation-triangle {
    display: inline-block;
    width: 22px;
    height: 22px;
}

    .icon-exclamation-triangle:before {
        content: '';
        display: block;
        width: 100%;
        height: 100%;
        -webkit-mask-image: url(img/alert-triangle-icon.svg);
        mask-image: url(img/alert-triangle-icon.svg);
        -webkit-mask-size: cover;
        mask-size: contain;
        background-color: var(--icon-color);
    }

.icon-info {
    display: inline-block;
    width: 22px;
    height: 22px;
}

    .icon-info:before {
        content: '';
        display: block;
        width: 100%;
        height: 100%;
        -webkit-mask-image: url(img/info-icon.svg);
        mask-image: url(img/info-icon.svg);
        -webkit-mask-size: cover;
        mask-size: contain;
        background-color: var(--icon-info-color);
    }

    .icon-exclamation-circle.icon-dark:before,
    .icon-exclamation-triangle.icon-dark:before,
    .icon-info.icon-dark:before {
        background-color: var(--dark);
    }

    .icon-exclamation-circle.icon-danger:before,
    .icon-exclamation-triangle.icon-danger:before,
    .icon-info.icon-danger:before {
        background-color: var(--danger);
    }

    .icon-exclamation-circle.icon-warning:before,
    .icon-exclamation-triangle.icon-warning:before,
    .icon-info.icon-warning:before {
        background-color: var(--warning);
    }

    .icon-exclamation-circle.icon-info:before,
    .icon-exclamation-triangle.icon-info:before {
        background-color: var(--info);
    }

    .icon-exclamation-circle.icon-success:before,
    .icon-exclamation-triangle.icon-success:before,
    .icon-info.icon-success:before {
        background-color: var(--success);
    }

    .icon-exclamation-circle.icon-secondary:before,
    .icon-exclamation-triangle.icon-secondary:before,
    .icon-info.icon-secondary:before {
        background-color: var(--secondary);
    }

    .icon-exclamation-circle.icon-primary:before,
    .icon-exclamation-triangle.icon-primary:before,
    .icon-info.icon-primary:before {
        background-color: var(--primary);
    }

    .icon-info.icon-light:before {
        background-color: var(--light);
    }

.menu-alert {
    display: inline-block;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    margin-left: 0.25rem;
}

    .menu-alert:before {
        content: '';
        display: block;
        width: 100%;
        height: 100%;
        -webkit-mask-image: url(img/alert-circle-icon.svg);
        mask-image: url(img/alert-circle-icon.svg);
        -webkit-mask-size: cover;
        mask-size: contain;
        background-color: var(--danger)
    }

.icon-add-foto {
    display: inline-block;
    width: 22px;
    height: 22px;
}

    .icon-add-foto:before {
        content: '';
        display: block;
        width: 100%;
        height: 100%;
        -webkit-mask-image: url(img/add_photo.svg);
        mask-image: url(img/add_photo.svg);
        -webkit-mask-size: cover;
        mask-size: contain;
        background-color: var(--icon-color);
    }

    .icon-add-foto.icon-primary:before {
        background-color: var(--primary);
    }
/*****/

/** Componentes (AppCode) **/
.estrellas-rating {
    color: #fad709 !important;
    width: 75px !important;
}

.opacity-half {
    opacity: 0.5 !important;
}

/******/

/** Rating **/
.rate-control {
    display: block;
}

    .rate-control > .rate-icons {
        color: #ffc107 !important;
    }
    .rate-control.black > .rate-icons {
        color: #2F2F2E !important;
    }

    .rate-control.center > .rate-icons{
        margin: 0 auto;
    }
/* star lite (utf8) */
[class^='rate-control rate-'] > .rate-icons {
    height: auto !important;
}

.rate-control.rate-1x > .rate-icons {
    font-size: 1.8em;
    line-height: 1.85rem;
    min-height: 2rem;
}
    .rate-control.rate-1x > .rate-icons div {
        max-height: 32px;
    }
.rate-control.rate-2x > .rate-icons {
    font-size: 2.5em;
    line-height: 2rem;
    min-height: 2.5rem;
}
    .rate-control.rate-2x > .rate-icons div {
        max-height: 40px;
    }
.rate-control.rate-3x > .rate-icons {
    font-size: 3.5em;
    line-height: 2.5rem;
    min-height: 3rem;
}
    .rate-control.rate-3x > .rate-icons div {
        max-height: 48px;
    }
.rate-control.rate-4x > .rate-icons {
    font-size: 4.5em;
    line-height: 3rem;
    min-height: 3.6rem;
}
    .rate-control.rate-4x > .rate-icons div {
        max-height: 58px;
    }
.rate-control.rate-5x > .rate-icons {
    font-size: 5.5em;
    line-height: 4rem;
    min-height: 4.8rem;
}
    .rate-control.rate-5x > .rate-icons div {
        max-height: 77px;
    }
/* star fontawesome */
[class^='rate-control star-'] > .rate-icons {
    height: auto !important;
}

.rate-control.star-1x {
    height: 2rem;
}
    .rate-control.star-1x > .rate-icons {
        font-size: 1.5em;
        line-height: 1.9rem;
    }
        .rate-control.star-1x > .rate-icons div {
            max-height: 32px;
        }
.rate-control.star-2x{
    height: 2.2rem;
}
    .rate-control.star-2x > .rate-icons {
        font-size: 2em;
        line-height: 2.15rem;
    }
        .rate-control.star-2x > .rate-icons div {
            max-height: 35px;
        }
.rate-control.star-3x{
    height: 3.15rem;
}
    .rate-control.star-3x > .rate-icons {
        font-size: 3em;
        line-height: 3.15rem;
    }
        .rate-control.star-3x > .rate-icons div {
            max-height: 50px;
        }
.rate-control.star-4x{
    height: 4rem;
}
    .rate-control.star-4x > .rate-icons {
        font-size: 4em;
        line-height: 3.85rem;
    }
        .rate-control.star-4x > .rate-icons div {
            max-height: 64px;
        }
.rate-control.star-5x{
    height: 5.2rem;
}
    .rate-control.star-5x > .rate-icons {
        font-size: 5em;
        line-height: 5.15rem;
    }
        .rate-control.star-5x > .rate-icons div {
            max-height: 83px;
        }
/******/
/* Validacion */
.input-validation-error {
    border-color: #ff4000;
}

.requerido::after {
    content: '*';
    margin-left: 5px;
}

.validation-summary-valid {
    display: none;
}

.validation-summary-errors {
    color: #842029;
    background-color: #f8d7da;
    position: relative;
    padding: 0.75rem 1.25rem;
    margin-bottom: 1rem;
    border: 1px solid #f5c2c7;
    border-radius: 0.25rem;
}

    .validation-summary-errors ul {
        list-style: none;
        margin: 0;
        padding: 0;
    }

input[type='radio'].input-validation-error {
    -webkit-appearance: none;
    width: 13px;
    height: 13px;
    border-radius: 50%;
    outline: none;
    border: 1px solid #ff4000;
}

    input[type='radio'].input-validation-error:before {
        content: '';
        display: block;
        width: 60%;
        height: 60%;
        margin: 20% auto;
        border-radius: 50%;
    }

    input[type='radio']:checked.input-validation-error:before {
        -webkit-appearance: none;
        width: 7px;
        height: 7px;
        border-radius: 50%;
        outline: none;
        background-color: #6E6E6E;
        border: 2px solid #6E6E6E;
        margin: 18% auto;
    }

    input[type='radio'].input-validation-error + label {
        color: #ff4000;
    }

.custom-control-input.input-validation-error:not(:disabled) ~ .custom-control-label::before {
    color: #fff;
    background-color: initial;
    border-color: #ff916c;
}

.custom-control-input:checked.input-validation-error ~ .custom-control-label::before {
    color: #fff;
    border-color: #696969;
    background-color: #696969;
}

.field-validation-error + .bootstrap-select > button,
.field-validation-error + .custom-file > .custom-file-label,
.field-validation-error + .help-info_container > .custom-file > .custom-file-label {
    border-color: #ff4000;
}

.field-validation-error ~ .note-editor {
    border-color: #ff4000 !important;
}

/******/
.modelo-img {
    height: 300px;
}

/** PowerBI **/
.pbi-report {
    /*min-width: 900px;*/
    width: 100%;
    height: 720px;
    border: 1px solid #c8c8c8;
}

    .pbi-report iframe {
        border: none;
    }

/*@media (max-width: 767px) {
    .pbi-report {
        min-width: inherit !important;
        height: 550px;
    }
}*/
/******/

/** Contador de texto **/
.counter-text {
    font-weight: 600
}

    .counter-text.exceeded {
        color: #dc3545;
    }
/** Contador de texto **/

/** Bootstrap Callout **/
.callout {
    padding: 1.25rem;
    margin-top: 1.25rem;
    margin-bottom: 1.25rem;
    border: 1px solid #e9ecef;
    border-left-width: 0.35rem;
    border-radius: 0.35rem;
}

    .callout:first-child {
        margin-top: 0;
    }

    .callout:last-child {
        margin-bottom: 0;
    }

.callout-info {
    border-left-color: var(--info);
}

.callout-warning {
    border-left-color: var(--warning);
}

.callout-danger {
    border-left-color: var(--warning);
}
/******/

/** Redimensionador Vertical **/
.resizable-v {
    position: relative;
}

    .resizable-v .resizable-area {
        position: relative;
        border: none;
        border-radius: 0;
        margin-top: 2px;
        margin-bottom: 2px;
        overflow-y: auto;
    }

.resize-bar {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 16px;
    width: 100%;
    background-color: #F7F7F7;
    border-radius: 0 0 calc(.25rem - 1px) calc(.25rem - 1px);
    border-top: 1px solid rgba(0, 0, 0, .15);
    cursor: ns-resize;
}

    .resize-bar .icon-bar {
        width: 51px;
        border-top: 1px solid rgba(0, 0, 0, .15);
    }

    .resize-bar .icon-bar:nth-child(2) {
        margin-top: 2px;
        margin-bottom: 2px;
    }

/******/

/** Listado Flex Inline **/

.list-flex-inline {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    column-gap: 30px;
    row-gap: 0.65rem;
}

.list-flex-inline__item {
    flex: 0 0 auto;
    width: auto;
    max-width: 100%;
    display: flex;
    flex-direction: column;
}

/******/

/** Posventa Inmovilizados **/

.td-edita-estatus__actual,
.td-edita-estatus__editar {
    display: flex;
}

/******/

/** Info domicilio **/

.info-domicilio {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    padding: 0.5rem 0.75rem;
    column-gap: 20px;
    font-size: 0.8rem;
}

    .info-domicilio div {
        flex-basis: calc(33.33% - 20px);
        display: flex;
        flex-wrap: nowrap;
        flex-direction: row;
    }

        .info-domicilio div:last-child {
            margin-right: 0;
        }

    .info-domicilio label {
        font-weight: bold;
        padding-right: 8px;
        margin: 0;
    }

    .info-domicilio span {
        /*color: #666;*/
    }

/****/

/** Mensaje Tabla Vacía **/
.table-empty-msg {
    display: flex;
    width: 100%;
    min-height: 20vh;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border: 1px solid rgba(0,0,0,.125);
    color: #898989;
    border-radius: .25rem;
    gap: 10px;
    padding: 15px;
}

    .table-empty-msg i.fa {
        color: #6c757d;
        font-size: 8rem;
        margin-bottom: 15px;
    }

    .table-empty-msg span.table-empty-msg__texto {
        text-align: center;
        color: #6F6F6F;
        max-width: 90%;
        line-height: 1.2
    }
/****/


/** Correo Masivo **/

.correos-lista-dist {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    margin-bottom: 1rem;
    max-height: 200px;
    overflow-y: auto;
    gap: 5px;
    padding: 5px;
}

    .correos-lista-dist .list-item {
        position: relative;
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        align-items: center;
        background-color: #D7EAF2;
        border-radius: 16px;
        padding: 2px 25px 3px 10px;
        width: auto;
        height: 22px;
        overflow: hidden;
        border: 1px solid #bedfed;
        color: #446573;
    }

        .correos-lista-dist .list-item .list-item__correo {
            font-size: 0.8rem;
            text-overflow: ellipsis;
            max-width: 100%;
            display: block;
            text-wrap: nowrap;
            overflow: hidden;
        }

        .correos-lista-dist .list-item .close.list-item__close {
            position: absolute;
            right: 3px;
            top: -5px;
            color: #446573;
        }

/****/

/** Marketing Planes **/
.mkt-descripcion {
    max-width: 85%;
}

.mkt-descripcion-rechazos {
    max-width: 100%;
}

.mk-p-rechazos {
    padding-right: 110px;
}

.mkt-monto {
    display: flex;
    align-items: center;
    padding: 0 0.75rem;
    flex-direction: row;
}

    .mkt-monto label {
        width: 40%;
    }

    .mkt-monto span {
        position: relative;
        font-size: 1.25rem;
        font-weight: 400;
        text-align: end;
        vertical-align: middle;
        display: block;
        line-height: 1.5;
        padding-top: calc(.375rem + 1px);
        padding-bottom: calc(.375rem + 1px);
        width: 60%;
        white-space: nowrap;
        padding-left: 12px;
    }

    .mkt-monto h4 {
        position: relative;
        display: block;
        text-align: end;
        width: 60%;
        font-weight: bold;
        margin: 0;
        white-space: nowrap;
        padding-left: 15px;
    }

        .mkt-monto span:before,
        .mkt-monto h4:before {
            content: '$';
            position: absolute;
            left: 0;
        }

.btn-mkt-borrar-elemento {
    position: absolute;
    top: 0.25rem;
    right: 0.75rem;
}

.btn-mkt-editar-elemento {
    position: absolute;
    top: 0.25rem;
    right: 2.75rem;
}

.mkt-rechazar > input.chk-rechazar {
    height: 2em;
    display: none;
    appearance: none;
}

.mkt-rechazar > .form-group {
    display: none;
}

.mkt-rechazar > input[type='checkbox']:checked ~ .form-group {
    display: inline;
}

.mkt-rechazar > label {
    position: relative;
    display: block;
    padding: 0 0.75rem;
    background-color: var(--danger);
    color: var(--light);
    cursor: pointer;
    font-size: 0.85rem;
    font-weight: normal;
}

    .mkt-rechazar > label:hover {
        color: var(--light);
        background-color: #c82333;
        border-color: #bd2130;
    }

    .mkt-rechazar > label:has(~ input[type='checkbox']:checked) {
        background-color: var(--light);
        color: var(--danger);
        border: 1px solid var(--danger);
        margin-top: 32px;
    }

        .mkt-rechazar > label:has(~ input[type='checkbox']:checked):hover {
            background-color: var(--danger);
            color: var(--light)
        }

    .mkt-rechazar > label::before {
        content: 'Rechazar';
    }

    .mkt-rechazar > label:has(~ input[type='checkbox']:checked)::before {
        content: 'Cancelar';
    }

/****/

/** Soporte técnico **/
.spt-tipo-vehiculo {
    display: flex;
    position: relative;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 100%;
    padding: 30px 15px;
    margin: 0;
    font-weight: 400;
    color: #212529;
    font-size: 1rem;
    line-height: 1.5;
    border-radius: .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;
    color: var(--primary);
    background-color: var(--white);
    border: 1px solid var(--primary);
    box-shadow: 0 .5rem 1rem rgba(0,0,0,.15);
}

    .spt-tipo-vehiculo > input[type=radio] {
        display: none;
    }

    .spt-tipo-vehiculo:hover,
    .spt-tipo-vehiculo:has(input[type=radio]:checked) {
        color: var(--white);
        background-color: var(--primary);
        cursor: pointer;
    }

    .spt-tipo-vehiculo > span {
        display: flex;
        width: 100%;
        text-align: center;
        flex-direction: column;
        align-items: center;
        font-weight: 600;
        letter-spacing: 0.4rem;
        text-transform: uppercase;
    }

        .spt-tipo-vehiculo > span:before {
            content: '';
            display: block;
            width: 150px;
            height: 150px;
            -webkit-mask-size: cover;
            mask-size: contain;
            background-color: var(--primary);
        }

    .spt-tipo-vehiculo:hover > span:before,
    .spt-tipo-vehiculo:has(input[type=radio]:checked) > span:before {
        background-color: var(--white);
    }

    .spt-tipo-vehiculo.gasolina > span:before {
        -webkit-mask-image: url(img/gas_station.svg);
        mask-image: url(img/gas_station.svg);
    }

    .spt-tipo-vehiculo.electrico > span:before {
        -webkit-mask-image: url(img/ev_station.svg);
        mask-image: url(img/ev_station.svg);
    }

    .spt-tipo-vehiculo.diesel > span:before {
        -webkit-mask-image: url(img/oil_barrel.svg);
        mask-image: url(img/oil_barrel.svg);
    }

    .spt-tipo-vehiculo:has(input[type=radio]:checked):before {
        content: '\f058';
        font-family: "FontAwesome";
        font-size: 1.2rem;
        position: absolute;
        top: 5px;
        right: 10px;
        color: var(--white);
    }
/****/


/** Sistemas tickets **/
.st-notas-ul {
    padding-inline-start: 1.5rem;
    margin-bottom: 0
}

/****/

/** 
    EV Flotillas 
    Control Flotilla Calidad Central
**/
.evf-steps.nav,
.cfcc-steps.nav {
    min-height: 50px;
    background-color: var(--gray);
    color: #FFF;
    border-radius: 0 !important;
    text-transform: uppercase;
    font-weight: 700;
    font-size: 0.8rem;
}

    .evf-steps.nav .nav-link,
    .evf-steps.nav .nav-link.disabled,
    .cfcc-steps.nav .nav-link,
    .cfcc-steps.nav .nav-link.disabled {
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 0;
        color: #FFF;
    }

        .evf-steps.nav .nav-link.active,
        .cfcc-steps.nav .nav-link.active {
            background-color: var(--gray-dark);
            border-radius: 0;
        }

.evf-documentacion,
.cfcc-documentacion {
    display: flex;
    flex-direction: row;
    gap: 15px;
    flex-wrap: wrap;
}

    .evf-documentacion div,
    .cfcc-documentacion div {
        flex: 1 0 auto;
        display: flex;
        flex-direction: column;
    }

.evf-elementos-container,
.cfcc-elementos-container {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    row-gap: 15px;
    margin: 0 -15px;
}

.evf-elementos-col,
.cfcc-elementos-col {
    display: flex;
    flex-direction: column;
    padding: 0 15px;
    gap: 8px;
}

    .evf-elementos-col.elemento-col-3,
    .cfcc-elementos-col.elemento-col-3 {
        flex: 0 0 33.33333%;
        max-width: 33.33333%;
    }

    .evf-elementos-col.elemento-col-6,
    .cfcc-elementos-col.elemento-col-6 {
        flex: 0 0 50%;
        max-width: 50%;
    }

    .evf-elementos-col > span,
    .cfcc-elementos-col > span {
        position: relative;
        font-size: 0.9rem;
        font-weight: 600;
        overflow: hidden
    }

        .evf-elementos-col > span:after,
        .cfcc-elementos-col > span:after {
            content: "";
            position: absolute;
            height: 2px;
            background-color: rgb(108 117 125 / 48%);
            top: 10px;
            width: 100%;
            margin-left: 15px;
        }

.evf-opciones,
.cfcc-opciones {
    display: flex;
    flex-wrap: nowrap;
    column-gap: 5px;
    width: 100%;
}

.evf-rdb-label,
.cfcc-rdb-label {
    flex: 1 0 auto;
    color: #898989;
    border: 3px solid #CCC;
    margin: 0
}

    .evf-rdb-label > input[type=radio],
    .cfcc-rdb-label > input[type=radio] {
        display: none;
    }

    .evf-rdb-label:hover,
    .cfcc-rdb-label:hover {
        color: var(--primary);
        border-color: var(--primary);
    }

    .evf-rdb-label:has(input[type=radio]:checked),
    .cfcc-rdb-label:has(input[type=radio]:checked) {
        position: relative;
        color: var(--white);
        background-color: var(--primary);
        border-color: var(--primary);
    }

    .evf-rdb-label > span,
    .cfcc-rdb-label > span {
        display: flex;
        width: 100%;
        text-align: center;
        flex-direction: column;
        align-items: center;
        font-weight: 600;
    }

.evf-galeria,
.cfcc-galeria {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    margin-left: -15px;
    margin-right: -15px;
    margin-top: 1rem;
}

    .evf-galeria .evf-foto-evidencia,
    .cfcc-galeria .cfcc-foto-evidencia {
        flex: 0 0 33.33334%;
        max-width: 33.33334%;
        padding: 0 15px;
        margin-bottom: 1rem;
    }

        .evf-galeria .evf-foto-evidencia .evf-marco,
        .cfcc-galeria .cfcc-foto-evidencia .cfcc-marco {
            position: relative;
            display: block;
            border: 2px solid var(--primary);
            border-radius: 4px;
            overflow: hidden;
        }

        .cfcc-galeria .cfcc-foto-evidencia .cfcc-marco {
            height: inherit;
            aspect-ratio: 16 / 9;
        }

            .evf-galeria .evf-foto-evidencia .evf-marco:has(button) {
                height: 100%;
            }

            .evf-galeria .evf-foto-evidencia .evf-marco img,
            .cfcc-galeria .cfcc-foto-evidencia .cfcc-marco img {
                width: 100%;
                transition: all .3s ease-in-out;
                -webkit-transition: all .3s ease-in-out;
            }

            .cfcc-galeria .cfcc-foto-evidencia .cfcc-marco img {
                width: 100%;
                height: 100%;
                object-fit: cover;
            }

                .evf-galeria .evf-foto-evidencia .evf-marco img:hover,
                .cfcc-galeria .cfcc-foto-evidencia .cfcc-marco img:hover {
                    -webkit-transform: scale(1.2);
                    transform: scale(1.2);
                    transition: all .5s ease-in-out;
                    -webkit-transition: all .5s ease-in-out;
                }

            .evf-galeria .evf-foto-evidencia .evf-marco .evf-btn-foto-borrar,
            .cfcc-galeria .cfcc-foto-evidencia .cfcc-marco .cfcc-btn-foto-borrar {
                position: absolute;
                bottom: 10px;
                right: 10px;
                border-radius: 50%;
                border: none;
                background-color: #111;
                filter: opacity(50%);
                width: 30px;
                height: 30px;
                padding: 0;
            }

                .evf-galeria .evf-foto-evidencia .evf-marco .evf-btn-foto-borrar:before,
                .cfcc-galeria .cfcc-foto-evidencia .cfcc-marco .cfcc-btn-foto-borrar:before {
                    content: '\f1f8';
                    font-family: "FontAwesome";
                    font-size: 1.2rem;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    color: var(--white);
                    filter: opacity(1);
                    padding: 0;
                    margin: 0;
                    line-height: 1;
                    font-weight: 300;
                    z-index: 1;
                }

                .evf-galeria .evf-foto-evidencia .evf-marco .evf-btn-foto-borrar:hover,
                .cfcc-galeria .cfcc-foto-evidencia .cfcc-marco .cfcc-btn-foto-borrar:hover {
                    background-color: #111;
                    filter: opacity(0.8);
                }

            .evf-galeria .evf-foto-evidencia .evf-marco button,
            .cfcc-galeria .cfcc-foto-evidencia .cfcc-marco button {
                display: flex;
                flex-direction: column;
                justify-content: center;
                align-items: center;
                gap: 15px;
                width: 100%;
                height: 193px;
                color: var(--primary);
                background-color: #FFF;
                border: none;
                box-shadow: rgb(0, 0, 0) 0px 0px 0px 0px;
                border-radius: 0px;
                cursor: pointer;
                text-transform: uppercase;
                outline: none !important;
                font-weight: 600;
                font-size: 1.2rem;
            }

                .evf-galeria .evf-foto-evidencia .evf-marco button:hover,
                .cfcc-galeria .cfcc-foto-evidencia .cfcc-marco button:hover {
                    background-color: var(--primary);
                    color: #FFF;
                }

                .evf-galeria .evf-foto-evidencia .evf-marco button i,
                .cfcc-galeria .cfcc-foto-evidencia .cfcc-marco button i {
                    font-weight: 300;
                    font-size: 3.5rem;
                }

/*.evf-btn-foto,*/
.cfcc-btn-evidencia {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 15px;
    width: 100%;
    height: 180px;
    border-width: 2px;
    border-radius: 4px;
    box-shadow: rgb(0, 0, 0) 0px 0px 0px 0px;
    cursor: pointer;
    text-transform: uppercase;
    outline: none !important;
    font-weight: 600;
    font-size: 1.2rem;
}

    .cfcc-btn-evidencia:focus {
        box-shadow: none;
    }

    .cfcc-btn-evidencia .cfcc-btn-foto {
        color: var(--primary);
        background-color: #FFF;
    }

    .cfcc-btn-evidencia:hover .cfcc-icon-add-foto:before {
        background-color: var(--white);
    }

    .cfcc-btn-evidencia .cfcc-btn-img {
        color: var(--success);
        background-color: #FFF;
    }

    .cfcc-btn-evidencia:hover .cfcc-icon-add-img:before {
        background-color: var(--white);
    }

    .cfcc-btn-evidencia .cfcc-icon-add-img {
        display: inline-block;
        width: 50px;
        height: 50px;
    }

    .cfcc-btn-evidencia .cfcc-icon-add-img {
        display: inline-block;
        width: 50px;
        height: 50px;
    }

    .cfcc-btn-evidencia .cfcc-icon-add-img:before {
        content: '';
        display: block;
        width: 100%;
        height: 100%;
        -webkit-mask-image: url(img/add_img.svg);
        mask-image: url(img/add_img.svg);
        -webkit-mask-size: cover;
        mask-size: contain;
        background-color: var(--success);
    }

.evf-icon-add-foto,
.cfcc-icon-add-foto {
    display: inline-block;
    width: 50px;
    height: 50px;
}

    .evf-icon-add-foto:before,
    .cfcc-icon-add-foto:before {
        content: '';
        display: block;
        width: 100%;
        height: 100%;
        -webkit-mask-image: url(img/add_photo.svg);
        mask-image: url(img/add_photo.svg);
        -webkit-mask-size: cover;
        mask-size: contain;
        background-color: var(--primary);
    }

.evf-galeria .evf-foto-evidencia .evf-marco button:hover .evf-icon-add-foto:before,
.cfcc-galeria .cfcc-foto-evidencia .cfcc-marco button:hover .cfcc-icon-add-foto:before {
    background-color: var(--white);
}

.evf-calendario-prestamos .card-header,
.cfcc-calendario-prestamos .card-header {
    background-color: var(--gray);
    padding: 0;
}

    .evf-calendario-prestamos .card-header .btn,
    .cfcc-calendario-prestamos .card-header .btn {
        color: #FFF;
        font-size: 1.2rem;
        font-weight: 600;
        padding: .75rem 1.25rem;
    }

        .evf-calendario-prestamos .card-header .btn::before,
        .cfcc-calendario-prestamos .card-header .btn::before {
            content: "\f077";
            font-family: "FontAwesome";
            position: absolute;
            top: 12px;
            right: 15px;
            font-weight: normal;
            transition-duration: 0.5s;
        }

        .evf-calendario-prestamos .card-header .btn.collapsed::before,
        .cfcc-calendario-prestamos .card-header .btn.collapsed::before {
            transform: rotate(180deg);
            transition-duration: 0.5s;
        }

.evf-custom-header-controls,
.cfcc-custom-header-controls {
    display: flex;
    flex: 1 0 auto;
    justify-content: center;
    align-items: center;
}

.evf-custom-header-nav,
.evf-custom-header-view,
.cfcc-custom-header-nav,
.cfcc-custom-header-view {
    width: 200px;
}

.mbsc-ios .evf-custom-header-view a,
.mbsc-ios .cfcc-custom-header-view a {
    color: var(--white);
}

/****/

/** Local ChangeRequest **/

.lcr-newuser-form {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}
    .lcr-newuser-form div {
        flex: 1 1 auto;
    }
.lcr-table-empty {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 75px;
    background-color: #EBEBEB;
    margin-bottom: 1rem;
    border-radius: 4px;
}
    .lcr-table-empty span {
        color: var(--gray);
        font-weight: 500;
    }
/****/
/* Tickets Atención al Cliente */
#act-recordatorios {
    list-style: none;
    padding: 0;
    margin: 0;
    max-height: 40vh;
    overflow-y: auto;
}

    #act-recordatorios.full {
        max-height: 65vh;
    }

    #act-recordatorios li {
        display: flex;
        flex-direction: column;
        padding: 0.6rem 1.25rem;
        margin: 0;
        margin-bottom: 0.5rem;
        gap: 5px;
    }

        #act-recordatorios li:last-child {
            margin-bottom: 0px;
        }

        #act-recordatorios li:hover {
            background-color: #eefdff;
        }

.act-recordatorio-fecha {
    font-weight: bold;
    color: var(--info);
    margin-right: 10px;
    font-size: 0.8rem;
    text-align: right;
}

.act-recordatorio-descripcion {
    color: #333;
    font-size: 0.95rem;
    -ms-word-break: break-word;
    word-break: break-word;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
}
/****/

/** Evidencias Incentivos **/

.evin-combo-estatus {
    max-width: 165px;
}

.evin-switch-container {
    display: flex;
    margin-left: auto;
    padding: 0.25rem 0;
    flex-wrap: wrap;
}

    .evin-switch-container form:not(:first-child) {
        padding-left: 1rem;
        margin-left: 1rem;
        border-left: 1px solid #dee2e6;
    }

/****/

/** Tickets PROFECO **/

.pfct-calendario-horarios .card-header {
    background-color: var(--gray);
    padding: 0;
}

    .pfct-calendario-horarios .card-header .btn {
        color: #FFF;
        font-size: 1.2rem;
        font-weight: 600;
        padding: .75rem 1.25rem;
    }

        .pfct-calendario-horarios .card-header .btn::before {
            content: "\f077";
            font-family: "FontAwesome";
            position: absolute;
            top: 12px;
            right: 15px;
            font-weight: normal;
            transition-duration: 0.5s;
        }

        .pfct-calendario-horarios .card-header .btn.collapsed::before {
            transform: rotate(180deg);
            transition-duration: 0.5s;
        }

.pfct-add-comentarios {
    position: relative;
    z-index: 2
}

    .pfct-add-comentarios:has(button[aria-expanded="false"]) {
        -webkit-animation: fade-in-bottom 0.5s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
        animation: fade-in-bottom 0.5s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
    }

    .pfct-add-comentarios:has([aria-expanded="true"]) {
        -webkit-animation: fade-out-bottom 0.3s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
        animation: fade-out-bottom 0.3s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
    }

.pfct-item-audiencia-txt > .card-header h5 {
    font-size: 1rem;
    margin: 0;
}

.pfct-audiencias-menu {
    position: sticky;
    top: 97px;
}
/****/

/** Reclamo previa entrega tickets **/

.rpet-auto-datos {
    padding: 0 0.75rem;
    column-gap: 50px;
}

.rpet-contenedor-botones {
    display: flex;
    justify-content: space-around;
    gap: 10px;
}

    .rpet-contenedor-botones .btn {
        flex: 0 0 calc(25% - 11px);
        max-width: calc(25% - 11px);
    }

    .rpet-contenedor-botones.col5 .btn {
        flex: 0 0 calc(20% - 11px);
        max-width: calc(20% - 11px);
    }

/****/

@media only screen and (min-width: 1520px) {
    /** Legal tickets **/
    .legal-col-xl-4 {
        flex: 0 0 33.33333%;
        max-width: 33.33333%;
    }

    /****/
    /** Marketing Planes **/
    .mkt-descripcion {
        max-width: 30%;
    }

    .mkt-descripcion-rechazos {
        max-width: 85%;
    }

    .mk-p-rechazos {
        padding-right: 0;
    }

    /****/
}


@media only screen and (min-width: 992px) and (max-width: 1200px) {
    /** Marketing Planes **/
    .mkt-descripcion {
        max-width: 85%;
    }

    /****/

    /** 
        EV Flotillas
        Control Flotilla Calidad Central
    **/
    .evf-elementos-col.elemento-col-3,
    .cfcc-elementos-col.elemento-col-3 {
        flex: 0 0 50%;
        max-width: 50%;
    }

    .evf-galeria .evf-foto-evidencia,
    .cfcc-galeria .cfcc-foto-evidencia {
        flex: 0 0 50%;
        max-width: 50%;
        padding: 0 15px;
        margin-bottom: 1rem;
    }

        .evf-galeria .evf-foto-evidencia .evf-marco button:not(.evf-btn-foto-borrar),
        .cfcc-galeria .cfcc-foto-evidencia .cfcc-marco button:not(.cfcc-btn-foto-borrar) {
            height: inherit;
            min-height: 235.5px;
        }
    /****/
    /** Reclamo previa entrega tickets **/
    .rpet-contenedor-botones {
        flex-wrap: wrap;
    }

        .rpet-contenedor-botones .btn,
        .rpet-contenedor-botones.col5 .btn {
            flex: 0 0 calc(50% - 11px);
            max-width: calc(50% - 11px);
        }

    /****/
}


@media only screen and (min-width: 992px) and (max-width: 1370px) {
}


@media only screen and (min-width: 768px) and (max-width: 991px) {
    .form-labels-right .form-group .col-form-label {
        text-align: left;
    }

    .form-labels-right .form-row .col-form-label {
        text-align: left;
        padding-left: 15px;
    }

    .form-labels-right .form-group .col-form-label small {
        padding-right: 0;
        padding-left: 15px;
    }

    .no-display-md {
        display: none !important;
    }

    /** Marketing Planes **/
    .mkt-descripcion {
        max-width: 95%;
    }

    /****/
    /** Soporte técnico **/
    .spt-tipo-vehiculo > span:before {
        width: 80px;
        height: 80px;
    }

    .spt-tipo-vehiculo {
        font-size: 0.8rem;
    }

        .spt-tipo-vehiculo > span {
            letter-spacing: 0.15rem;
        }

    /****/
    /** 
        EV Flotillas
        Control Flotilla Calidad Central
    **/
    .evf-elementos-col.elemento-col-3,
    .cfcc-elementos-col.elemento-col-3 {
        flex: 0 0 50%;
        max-width: 50%;
    }

    .evf-galeria .evf-foto-evidencia,
    .cfcc-galeria .cfcc-foto-evidencia {
        flex: 0 0 50%;
        max-width: 50%;
        padding: 0 15px;
        margin-bottom: 1rem;
    }

        .evf-galeria .evf-foto-evidencia .evf-marco button:not(.evf-btn-foto-borrar),
        .cfcc-galeria .cfcc-foto-evidencia .cfcc-marco button:not(.cfcc-btn-foto-borrar) {
            height: inherit;
            min-height: 172.5px;
            font-size: 1rem;
        }

        .evf-galeria .evf-foto-evidencia .evf-marco button i,
        .cfcc-galeria .cfcc-foto-evidencia .cfcc-marco button i {
            font-size: 2.5rem;
        }

    /****/
    /** Reclamo previa entrega tickets **/
    .rpet-contenedor-botones {
        flex-wrap: wrap;
    }

        .rpet-contenedor-botones .btn,
        .rpet-contenedor-botones.col5 .btn {
            flex: 0 0 calc(50% - 11px);
            max-width: calc(50% - 11px);
        }

    /****/
}


@media only screen and (min-width:320px) and (max-width:767px) {
    .minw-sm-100 {
        min-width: 100%
    }

    hr {
        margin-top: 0.5rem;
        margin-bottom: 0.5rem;
    }

    .form-group {
        margin-bottom: 0;
    }

    .form-labels-right .form-group .col-form-label {
        text-align: left;
    }

    .form-labels-right .form-row .col-form-label {
        text-align: left;
        padding-left: 15px !important;
    }

    .form-control-plaintext {
        margin-top: 0;
    }

    .info-domicilio {
        margin-bottom: 10px;
    }

    .form-labels-right .form-group .col-form-label small {
        padding-right: 0;
        padding-left: 15px;
    }

    .no-display-xs {
        display: none !important;
    }

    /** Marketing Planes **/
    .mkt-descripcion {
        max-width: 100%;
    }

    /****/
    /** Soporte técnico **/
    .spt-tipo-vehiculo > span:before {
        width: 80px;
        height: 80px;
    }

    .spt-tipo-vehiculo {
        font-size: 0.8rem;
        padding: 8px 25px;
        margin-bottom: 1rem;
    }

        .spt-tipo-vehiculo > span {
            text-align: center;
            align-items: center;
            font-weight: 600;
            letter-spacing: 0.15rem;
            text-transform: uppercase;
            flex-direction: row;
            justify-content: flex-start;
            gap: 15%;
        }

    /****/
    /** 
        EV Flotillas
        Control Flotilla Calidad Central
    **/
    .evf-elementos-col.elemento-col-3,
    .cfcc-elementos-col.elemento-col-3 {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .evf-elementos-col.elemento-col-6,
    .cfcc-elementos-col.elemento-col-6 {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .evf-galeria .evf-foto-evidencia,
    .cfcc-galeria .cfcc-foto-evidencia {
        flex: 0 0 100%;
        max-width: 100%;
        padding: 0 15px;
        margin-bottom: 1rem;
    }

    .cfcc-btn-evidencia {
        flex-direction: row;
        height: 100px;
    }

        .cfcc-galeria .cfcc-foto-evidencia .cfcc-marco {
            height: auto;
            aspect-ratio: inherit;
        }

        .evf-galeria .evf-foto-evidencia .evf-marco button:not(.evf-btn-foto-borrar),
        .cfcc-galeria .cfcc-foto-evidencia .cfcc-marco button:not(.cfcc-btn-foto-borrar) {
            height: auto;
            min-height: 200px;
            font-size: 1.2rem;
        }

        .evf-galeria .evf-foto-evidencia .evf-marco button i,
        .cfcc-galeria .cfcc-foto-evidencia .cfcc-marco button i {
            font-size: 3.5rem;
        }

        .cfcc-btn-evidencia .cfcc-icon-add-foto,
        .cfcc-btn-evidencia .cfcc-icon-add-img {
            display: inline-block;
            width: 38px;
            height: 38px;
        }

    /****/
    /** Evidencias Incentivos **/

    .evin-switch-container {
        flex-direction: column;
        margin: 0;
        width: 100%;
    }

        .evin-switch-container form:not(:first-child) {
            padding-left: 0;
            margin-left: 0;
            border-left: none;
        }

    /****/
    /** Reclamo previa entrega tickets **/

    .rpet-auto-datos .list-flex-inline__item {
        flex: 0 0 calc(50% - 25px);
        width: calc(50% - 25px);
        max-width: calc(50% - 25px);
    }

    .rpet-contenedor-botones {
        flex-wrap: wrap;
    }

        .rpet-contenedor-botones .btn,
        .rpet-contenedor-botones.col5 .btn {
            flex: 0 0 100%;
            max-width: 100%;
        }
    /****/
}


@media only screen and (min-width: 70px) and (max-width: 599px) {
    .minw-sm-100 {
        min-width: 100%
    }

    hr {
        margin-top: 0.5rem;
        margin-bottom: 0.5rem;
    }

    .form-group {
        margin-bottom: 0;
    }

    .form-labels-right .form-group .col-form-label {
        text-align: left;
    }

    .form-labels-right .form-row .col-form-label {
        text-align: left;
    }

    .form-control-plaintext {
        margin-top: 0;
    }

    .info-domicilio {
        margin-bottom: 10px;
    }

    .no-display-xs {
        display: none !important;
    }
    /** Marketing Planes **/
    .mkt-descripcion {
        max-width: 100%;
    }

    .mkt-monto {
        flex-direction: column;
    }

        .mkt-monto label {
            width: 100%;
            padding-bottom: 0;
        }

        .mkt-monto span {
            width: 100%;
            padding-top: 0;
        }

        .mkt-monto h4 {
            width: 100%;
        }
    /****/
    /** Soporte técnico **/
    .spt-tipo-vehiculo > span:before {
        width: 80px;
        height: 80px;
    }

    .spt-tipo-vehiculo {
        font-size: 0.8rem;
        padding: 8px 25px;
        margin-bottom: 1rem;
    }

        .spt-tipo-vehiculo > span {
            text-align: center;
            align-items: center;
            font-weight: 600;
            letter-spacing: 0.15rem;
            text-transform: uppercase;
            flex-direction: row;
            justify-content: flex-start;
            gap: 15%;
        }

    /****/
    /** 
        EV Flotillas 
        Control Flotilla Calidad Central
    **/
    .evf-elementos-col.elemento-col-3,
    .cfcc-elementos-col.elemento-col-3 {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .evf-elementos-col.elemento-col-6,
    .cfcc-elementos-col.elemento-col-6 {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .cfcc-btn-evidencia {
        flex-direction: row;
        height: 100px;
    }

    .cfcc-galeria .cfcc-foto-evidencia .cfcc-marco {
        height: auto;
        aspect-ratio: inherit;
    }

    .evf-galeria .evf-foto-evidencia,
    .cfcc-galeria .cfcc-foto-evidencia {
        flex: 0 0 100%;
        max-width: 100%;
        padding: 0 15px;
        margin-bottom: 1rem;
    }

        .cfcc-galeria .cfcc-foto-evidencia .cfcc-marco {
            height: auto;
            aspect-ratio: inherit;
        }

        .evf-galeria .evf-foto-evidencia .evf-marco button,
        .cfcc-galeria .cfcc-foto-evidencia .cfcc-marco button {
            height: 120px;
            font-size: 1rem;
        }

            .evf-galeria .evf-foto-evidencia .evf-marco button i,
            .cfcc-galeria .cfcc-foto-evidencia .cfcc-marco button i {
                font-size: 2.5rem;
            }

    .cfcc-btn-evidencia .cfcc-icon-add-foto,
    .cfcc-btn-evidencia .cfcc-icon-add-img {
        display: inline-block;
        width: 38px;
        height: 38px;
    }

    /****/
    /** Evidencias Incentivos **/

    .evin-combo-estatus {
        max-width: 100%;
    }

    .evin-switch-container {
        flex-direction: column;
        margin: 0;
        width: 100%;
    }

        .evin-switch-container form:not(:first-child) {
            padding-left: 0;
            margin-left: 0;
            border-left:  none;
        }

    /****/
    /** Reclamo previa entrega tickets **/

    .rpet-auto-datos .list-flex-inline__item {
        flex: 0 0 100%;
        width: 100%;
        max-width: 100%;
    }

    .rpet-contenedor-botones {
        flex-wrap: wrap;
    }

        .rpet-contenedor-botones .btn,
        .rpet-contenedor-botones.col5 .btn {
            flex: 0 0 100%;
            max-width: 100%;
        }

    /****/
}

@media (min-width: 576px) {
    .w-sm-auto {
        width: auto !important;
    }
}
/** Texto Ver Más **/

.txt-ver-mas {
    position: relative;
    display: flex;
    width: 100%;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: flex-end;
}

    .txt-ver-mas > .txt-original {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 1;
        overflow: hidden;
        flex: 1 1 auto;
        width: auto;
        max-width: 100%;
        line-height: 1.25;
        padding: 0 0.25rem;
        border-radius: 4px;
        white-space: break-spaces;
    }

        .txt-ver-mas > .txt-original:has(~ input[type='checkbox']:checked) {
            display: inline;
            overflow: unset;
            white-space: break-spaces;
            text-overflow: unset;
        }

            .txt-ver-mas > .txt-original:has(~ input[type='checkbox']:checked):hover {
                background-color: #ebebeb;
                cursor: pointer;
            }

    .txt-ver-mas > input[type='checkbox'] {
        height: 2em;
        display: none;
        appearance: none;
    }

    .txt-ver-mas > .lbl-vermas {
        position: relative;
        display: inline;
        padding: 0;
        cursor: pointer;
        font-size: 0.85rem;
        font-weight: normal;
        text-decoration: underline;
        color: #007FFF;
        white-space: nowrap;
        margin: 0;
        margin-top: -2px;
        margin-bottom: 0.63rem;
    }

    .txt-ver-mas > input[type='checkbox']:checked ~ .lbl-vermas {
        display: none;
    }

    .txt-ver-mas.btn-vermas > .lbl-vermas {
        display: inline-block;
        font-weight: 400;
        color: #212529;
        text-align: center;
        vertical-align: middle;
        user-select: none;
        background-color: transparent;
        border: 1px solid transparent;
        padding: .375rem .75rem;
        margin: 0;
        margin-left: 1rem;
        font-size: 1rem;
        line-height: 1.5;
        border-radius: .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;
        text-decoration: none;
    }

    .txt-ver-mas.btn-vermas.btn__small > .lbl-vermas {
        padding: .25rem .5rem;
        font-size: .875rem;
        line-height: 1.5;
        border-radius: .2rem;
    }

    .txt-ver-mas.btn-vermas.btn__align-center {
        align-items: center;
    }

    .txt-ver-mas.btn-vermas.btn__secondary > .lbl-vermas {
        color: #fff;
        background-color: #6c757d;
        border-color: #6c757d;
    }

        .txt-ver-mas.btn-vermas.btn__secondary > .lbl-vermas:hover,
        .txt-ver-mas.btn-vermas.btn__secondary > .lbl-vermas:active {
            color: #fff;
            background-color: #5a6268;
            border-color: #545b62;
        }

    .txt-ver-mas.btn-vermas.btn__outline-secondary > .lbl-vermas {
        color: #6c757d;
        border-color: #6c757d;
    }

        .txt-ver-mas.btn-vermas.btn__outline-secondary > .lbl-vermas:hover,
        .txt-ver-mas.btn-vermas.btn__outline-secondary > .lbl-vermas:active {
            color: #fff;
            background-color: #6c757d;
            border-color: #6c757d;
        }

    .txt-ver-mas.btn-vermas.btn__dark > .lbl-vermas {
        color: #fff;
        background-color: #2F2F2E;
        border-color: #2F2F2E;
    }

        .txt-ver-mas.btn-vermas.btn__dark > .lbl-vermas:hover,
        .txt-ver-mas.btn-vermas.btn__dark > .lbl-vermas:active {
            color: #fff;
            background-color: #23272b;
            border-color: #1d2124;
        }

    .txt-ver-mas.btn-vermas.btn__outline-dark > .lbl-vermas {
        color: #2F2F2E;
        border-color: #2F2F2E;
    }

        .txt-ver-mas.btn-vermas.btn__outline-dark > .lbl-vermas:hover,
        .txt-ver-mas.btn-vermas.btn__outline-dark > .lbl-vermas:active {
            color: #fff;
            background-color: #2F2F2E;
            border-color: #2F2F2E;
        }

/****/
/** Checkbox Switch **/

.checkbox-switch {
    display: block;
    position: relative;
    height: 28px;
    width: 54px;
    margin-bottom: 0;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: pointer;
}

    .checkbox-switch.activa-inactiva {
        width: 84px;
    }

    .checkbox-switch input {
        position: absolute;
        opacity: 0;
        cursor: pointer;
        height: 0;
        width: 0;
    }

    .checkbox-switch .slider {
        background-color: #989898;
        bottom: 0;
        cursor: pointer;
        left: 0;
        position: absolute;
        right: 0;
        top: 0;
        transition: .4s;
    }

        .checkbox-switch .slider:before {
            content: "";
            background-color: #fff;
            bottom: 4px;
            width: 20px;
            height: 20px;
            left: 4px;
            position: absolute;
            transition: .4s;
        }

    .checkbox-switch.activa-inactiva .slider:before {
        left: 4px;
    }

    .checkbox-switch.si-no .slider::after {
        content: "No";
        position: absolute;
        width: 20px;
        height: 20px;
        right: 6px;
        top: 3px;
        color: #FFF;
        font-size: 0.88rem;
        font-weight: 600;
        transition: .4s;
        text-align: center;
    }

    .checkbox-switch.activa-inactiva .slider::after {
        content: "Inactiva";
        position: absolute;
        width: 20px;
        height: 20px;
        right: 36px;
        top: 3px;
        color: #FFF;
        font-size: 0.80rem;
        font-weight: 600;
        transition: .4s;
        text-align: center;
    }

    .checkbox-switch input:checked ~ .slider {
        background-color: #66bb6a;
    }

        .checkbox-switch input:checked ~ .slider:before {
            -webkit-transform: translateX(26px);
            transform: translateX(26px);
        }

    .checkbox-switch.activa-inactiva input:checked ~ .slider:before {
        -webkit-transform: translateX(56px);
        transform: translateX(56px);
    }

    .checkbox-switch.si-no input:checked ~ .slider::after {
        content: "Sí";
        position: absolute;
        width: 20px;
        height: 20px;
        left: 7px;
        top: 3px;
        color: #FFF;
        font-size: 0.9rem;
        font-weight: 600;
        transition: .4s;
        text-align: center;
    }

    .checkbox-switch.activa-inactiva input:checked ~ .slider::after {
        content: "Activa";
        position: absolute;
        width: 20px;
        height: 20px;
        left: 12px;
        top: 3px;
        color: #FFF;
        font-size: 0.85rem;
        font-weight: 600;
        transition: .4s;
        text-align: center;
    }

    .checkbox-switch .slider.round {
        border-radius: 34px;
    }

        .checkbox-switch .slider.round:before {
            border-radius: 50%;
        }
/****/

/** Help Info **/
.help-info_container {
    display: block;
    position: relative;
    width: 100%;
    height: auto;
    margin-bottom: -0.3rem;
}

    .help-info_container.input-group {
        display: flex;
    }

        .help-info_container.input-group > .alert-info {
            flex: 1 1 100%;
        }

    .help-info_container > i.icon-info {
        position: absolute;
        display: block;
        top: 9px;
        left: -26px;
        width: 22px;
        height: 22px;
        z-index: 1;
    }

        .help-info_container > i.icon-info:before {
            content: '';
            display: block;
            width: 100%;
            height: 100%;
            -webkit-mask-image: url(img/info-icon.svg);
            mask-image: url(img/info-icon.svg);
            -webkit-mask-size: cover;
            mask-size: contain;
            background-color: #17a2b8;
        }

    .help-info_container > .alert-info {
        display: block;
        padding: 0;
        height: 0;
        opacity: 0;
        visibility: hidden;
        margin: 0;
        transition: all 0.1s ease-out;
        font-size: 0.9rem;
        line-height: 1.15rem;
    }

        .help-info_container > .alert-info > span {
            display: block;
            margin: .75rem 2.75rem .75rem 1.25rem;
        }

    .help-info_container.input-group input[type="text"]:focus ~ .alert-info,
    .help-info_container.input-group input[type="text"]:active ~ .alert-info,
    .help-info_container > i.icon-info:hover ~ .alert-info,
    .help-info_container > i.icon-info:focus ~ .alert-info,
    .help-info-icon:hover + .help-info_container .alert-info,
    .help-info:focus ~ .alert-info,
    .help-info:active ~ .alert-info {
        height: auto;
        opacity: 1;
        visibility: visible;
        transition: all 0.3s ease-in;
        margin-top: 0.35rem;
    }

    .help-info_container > i.icon-info ~ .alert-info:before,
    .help-info_container .alert-info:before {
        content: '';
        position: absolute;
        display: inline-block;
        top: 8px;
        right: 12px;
        width: 1.5rem;
        height: 1.5rem;
        -webkit-mask-image: url('img/info-icon.svg');
        mask-image: url('img/info-icon.svg');
        -webkit-mask-size: cover;
        mask-size: cover;
        background-color: #0c5460;
    }

    .help-info_container > i.icon-info ~ .alert-info ol,
    .help-info_container .alert-info ol,
    .help-info_container > i.icon-info ~ .alert-info ul,
    .help-info_container .alert-info ul {
        margin-bottom: 0;
        padding-inline-start: 25px;
    }

    .help-info_container .alert-info ul,
    .help-info_container .alert-info ol {
        margin-top: 0.5rem;
    }

        .help-info_container > i.icon-info ~ .alert-info ol li,
        .help-info_container .alert-info ol li,
        .help-info_container > i.icon-info ~ .alert-info ul li {
            margin-bottom: 0.25rem;
        }

    .help-info_container.input-group input[type="text"] {
        border-radius: .25rem;
    }

    .help-info_container.input-group .input-group-prepend ~ input[type="text"] {
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
    }

    .help-info_container.input-group input[type="text"]:has(~.input-group-append) {
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
    }

    .help-info_container.input-group .input-group-append > *:last-child {
        border-top-right-radius: 0.25rem;
        border-bottom-right-radius: 0.25rem;
    }

.help-info-icon {
    position: absolute;
    display: block;
    top: 9px;
    left: -12px;
    width: 22px;
    height: 22px;
}

    .help-info-icon:before {
        content: '';
        display: block;
        width: 100%;
        height: 100%;
        -webkit-mask-image: url(img/info-icon.svg);
        mask-image: url(img/info-icon.svg);
        -webkit-mask-size: cover;
        mask-size: contain;
        background-color: #17a2b8;
    }

.help-info_container:has(.help-info.info-top) {
    padding-left: 0;
}

.help-info_container .help-info.info-top ~ .icon-info {
    top: -29px;
    left: 0;
}

label.col-form-label:has(~ .help-info_container .help-info.info-top) {
    padding-left: 29px;
}

/*Textarea*/
.help-info_container > .textarea-container {
    display: flex;
    flex-direction: column;
}

    .help-info_container > .textarea-container .counter-text {
        margin-left: auto;
    }

    .help-info_container > .textarea-container:has(textarea:focus) ~ .alert-info,
    .help-info_container > .textarea-container:has(textarea:active) ~ .alert-info {
        height: auto;
        opacity: 1;
        visibility: visible;
        transition: all 0.3s ease-in;
        margin-top: 0.35rem;
    }
/******/
/* Header Tags */
.help-info_container.header-tag {
    display: flex;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 5px;
}

    .help-info_container.header-tag > i.icon-info {
        position: relative;
        display: inline-block;
        left: auto;
        top: auto;
    }

    .help-info_container.header-tag > .alert-info {
        flex: 0 0 100%;
        max-width: 100%;
    }
/******/
@media only screen and (min-width: 1520px) {
}

@media only screen and (min-width: 992px) and (max-width: 1200px) {
}

@media only screen and (min-width: 992px) and (max-width: 1370px) {
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
}

@media only screen and (min-width:320px) and (max-width:767px) {
    /** Help Info **/
    .help-info_container {
        padding-left: 2rem;
    }

    .input-group .input-group-prepend ~ input[type='text'].help-info {
        margin-left: 0;
        width: auto;
    }

    .input-group:has(input[type='text'].help-info) .input-group-prepend {
        padding-left: 2rem;
    }

    .help-info_container > i.icon-info {
        left: 3px;
    }

    .input-group:has(.help-info_container) > i.icon-info {
        left: 3px;
    }
    /****/
}

@media only screen and (min-width: 70px) and (max-width: 599px) {
    /** Help Info **/
    .help-info_container {
        padding-left: 2rem;
    }

    .input-group .input-group-prepend ~ input[type='text'].help-info {
        margin-left: 0;
        width: auto;
    }

    .input-group:has(input[type='text'].help-info) .input-group-prepend {
        padding-left: 2rem;
    }

    .help-info_container > i.icon-info {
        left: 3px;
    }

    .input-group:has(.help-info_container) > i.icon-info {
        left: 3px;
    }
    /****/
}

/** Slider **/

.slider-galeria .carousel-inner {
    height: auto;
    aspect-ratio: 16 / 9;
}

    .slider-galeria .carousel-inner .carousel-item {
        width: 100%;
        height: 100%;
        margin-top: auto;
    }

        .slider-galeria .carousel-inner .carousel-item.active {
            width: 100%;
            height: 100%;
        }

        .slider-galeria .carousel-inner .carousel-item img {
            display: block;
            margin: 0 auto;
            height: 100%;
            object-fit: contain;
        }

        .slider-galeria .carousel-inner .carousel-item .carousel-caption p {
            background-color: rgba(0, 0, 0, 0.5);
            padding: 5px;
            margin-bottom: 0.5rem;
        }

/** Modal Galeria **/
.modal-galeria {
}

    .modal-galeria.show ~ .modal-backdrop.show {
        opacity: .8;
    }

    .modal-galeria .modal-content {
        background-color: transparent;
        border: 0;
        padding: 0;
    }

        .modal-galeria .modal-content button.close {
            position: absolute;
            right: -22px;
            top: -40px;
            display: flex;
            justify-content: center;
            align-items: center;
            width: 38px;
            height: 38px;
            color: #FFF;
            font-size: 3.5rem;
            font-weight: 100;
            outline: none;
        }

            .modal-galeria .modal-content button.close span {
                display: block;
                width: 100%;
                height: 100%;
                line-height: 0.4;
            }

    .modal-galeria .slider-galeria {
    }

        .modal-galeria .slider-galeria .carousel-inner {
            background-color: transparent;
        }


@media only screen and (min-width: 992px) and (max-width: 1200px) {
    /** Modal Galeria **/
    .modal-galeria.show {
        padding-right: 0 !important;
    }

        .modal-galeria.show .modal-dialog {
            max-width: 90vw;
            margin: 0 auto;
        }
    .modal-galeria .modal-content button.close {
        right: -40px;
    }
    .modal-galeria .modal-content .col-carousel {
        padding: 0;
    }
}


@media only screen and (min-width: 992px) and (max-width: 1370px) {
}



@media only screen and (min-width: 768px) and (max-width: 991px) {
    /** Slider **/
    .slider-galeria .carousel-indicators {
        display: none;
    }
    /** Modal Galeria **/
    .modal-galeria.show {
        padding-right: 0 !important;
    }
        .modal-galeria.show .modal-dialog {
            max-width: 90vw;
            margin: 0 auto;
        }
    .modal-galeria .modal-content button.close {
        right: -8px;
    }
    .modal-galeria .modal-content .col-carousel {
        padding: 0;
    }
}




@media only screen and (min-width:320px) and (max-width:767px) {
    /** Slider **/
    .slider-galeria .carousel-indicators {
        display: none;
    }
    .carousel-control-next-icon,
    .carousel-control-prev-icon {
        width: 30px;
        height: 30px;
    }
        .carousel-control-next-icon:before,
        .carousel-control-prev-icon:before {
            font-size: 1.5rem;
        }
    /** Modal Galeria **/
    .modal-galeria.show {
        padding-right: 0 !important;
    }
        .modal-galeria.show .modal-dialog {
            max-width: 90vw;
            margin: 0 auto;
        }
    .modal-galeria .modal-content button.close {
        right: -6px;
    }
    .modal-galeria .modal-content .col-carousel {
        padding: 0;
    }
}




@media only screen and (min-width: 70px) and (max-width: 599px) {
    /** Slider **/
    .slider-galeria .carousel-indicators {
        display: none;
    }
    .carousel-control-next-icon,
    .carousel-control-prev-icon {
        width: 30px;
        height: 30px;
    }
        .carousel-control-next-icon:before,
        .carousel-control-prev-icon:before {
            font-size: 1.5rem;
        }
    /** Modal Galeria **/
    .modal-galeria.show {
        padding-right: 0 !important;
    }
        .modal-galeria.show .modal-dialog {
            max-width: 90vw;
            margin: 0 auto;
        }
    .modal-galeria .modal-content button.close {
        right: -16px;
    }
    .modal-galeria .modal-content .col-carousel {
        padding: 0 0.25rem;
    }
}
.long-rich-textbox {
    border: 1px solid rgba(0, 0, 0, .15);
}

.long-rich-textbox .card-body {
    position: relative;
    height: auto;
    padding: 0;
}

    .long-rich-textbox .card-body > .resizable-v .resizable-area .contenedor {
        padding: 1.25rem;
    }
/** Animaciones **/
/**
 * ----------------------------------------
 * animation fade-in-bottom
 * ----------------------------------------
 */
@-webkit-keyframes fade-in-bottom {
    0% {
        -webkit-transform: translateY(50px);
        transform: translateY(50px);
        opacity: 0;
    }

    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
    }
}

@keyframes fade-in-bottom {
    0% {
        -webkit-transform: translateY(50px);
        transform: translateY(50px);
        opacity: 0;
    }

    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
    }
}

/**
 * ----------------------------------------
 * animation fade-out-bottom
 * ----------------------------------------
 */
@-webkit-keyframes fade-out-bottom {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
        visibility: visible;
    }

    100% {
        -webkit-transform: translateY(50px);
        transform: translateY(50px);
        opacity: 0;
        visibility: hidden;
    }
}

@keyframes fade-out-bottom {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
        visibility: visible;
    }

    100% {
        -webkit-transform: translateY(50px);
        transform: translateY(50px);
        opacity: 0;
        visibility: hidden;
    }
}


/****/

.toast-title {
    font-weight: bold;
}

.toast-message {
    -ms-word-wrap: break-word;
    word-wrap: break-word;
}

    .toast-message a,
    .toast-message label {
        color: #ffffff;
    }

        .toast-message a:hover {
            color: #cccccc;
            text-decoration: none;
        }

.toast-close-button {
    position: relative;
    right: -0.3em;
    top: -0.3em;
    float: right;
    font-size: 20px;
    font-weight: bold;
    color: #ffffff;
    -webkit-text-shadow: 0 1px 0 #ffffff;
    text-shadow: 0 1px 0 #ffffff;
    opacity: 0.8;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
    filter: alpha(opacity=80);
}

    .toast-close-button:hover,
    .toast-close-button:focus {
        color: #000000;
        text-decoration: none;
        cursor: pointer;
        opacity: 0.4;
        -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
        filter: alpha(opacity=40);
    }
/*Additional properties for button version
 iOS requires the button element instead of an anchor tag.
 If you want the anchor version, it requires `href="#"`.*/
button.toast-close-button {
    padding: 0;
    cursor: pointer;
    background: transparent;
    border: 0;
    -webkit-appearance: none;
}

.toast-top-center {
    top: 0;
    right: 0;
    width: 100%;
}

.toast-bottom-center {
    bottom: 0;
    right: 0;
    width: 100%;
}

.toast-top-full-width {
    top: 0;
    right: 0;
    width: 100%;
}

.toast-bottom-full-width {
    bottom: 0;
    right: 0;
    width: 100%;
}

.toast-top-left {
    top: 12px;
    left: 12px;
}

.toast-top-right {
    top: 12px;
    right: 12px;
}

.toast-bottom-right {
    right: 12px;
    bottom: 12px;
}

.toast-bottom-left {
    bottom: 12px;
    left: 12px;
}

#toast-container {
    position: fixed;
    z-index: 999999;
    /*overrides*/
}

    #toast-container * {
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }

    #toast-container > div {
        position: relative;
        overflow: hidden;
        margin: 0 0 6px;
        padding: 15px 15px 15px 50px;
        width: 300px;
        -moz-border-radius: 3px 3px 3px 3px;
        -webkit-border-radius: 3px 3px 3px 3px;
        border-radius: 3px 3px 3px 3px;
        background-position: 15px center;
        background-repeat: no-repeat;
        -moz-box-shadow: 0 0 12px #999999;
        -webkit-box-shadow: 0 0 12px #999999;
        box-shadow: 0 0 12px #999999;
        color: #ffffff;
        opacity: 1;
        -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
        filter: alpha(opacity=80);
    }

    #toast-container > :hover {
        -moz-box-shadow: 0 0 12px #000000;
        -webkit-box-shadow: 0 0 12px #000000;
        box-shadow: 0 0 12px #000000;
        opacity: 1;
        -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
        filter: alpha(opacity=100);
        cursor: pointer;
    }

    #toast-container > .toast-info {
        background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGwSURBVEhLtZa9SgNBEMc9sUxxRcoUKSzSWIhXpFMhhYWFhaBg4yPYiWCXZxBLERsLRS3EQkEfwCKdjWJAwSKCgoKCcudv4O5YLrt7EzgXhiU3/4+b2ckmwVjJSpKkQ6wAi4gwhT+z3wRBcEz0yjSseUTrcRyfsHsXmD0AmbHOC9Ii8VImnuXBPglHpQ5wwSVM7sNnTG7Za4JwDdCjxyAiH3nyA2mtaTJufiDZ5dCaqlItILh1NHatfN5skvjx9Z38m69CgzuXmZgVrPIGE763Jx9qKsRozWYw6xOHdER+nn2KkO+Bb+UV5CBN6WC6QtBgbRVozrahAbmm6HtUsgtPC19tFdxXZYBOfkbmFJ1VaHA1VAHjd0pp70oTZzvR+EVrx2Ygfdsq6eu55BHYR8hlcki+n+kERUFG8BrA0BwjeAv2M8WLQBtcy+SD6fNsmnB3AlBLrgTtVW1c2QN4bVWLATaIS60J2Du5y1TiJgjSBvFVZgTmwCU+dAZFoPxGEEs8nyHC9Bwe2GvEJv2WXZb0vjdyFT4Cxk3e/kIqlOGoVLwwPevpYHT+00T+hWwXDf4AJAOUqWcDhbwAAAAASUVORK5CYII=") !important;
    }

    #toast-container > .toast-error {
        background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAHOSURBVEhLrZa/SgNBEMZzh0WKCClSCKaIYOED+AAKeQQLG8HWztLCImBrYadgIdY+gIKNYkBFSwu7CAoqCgkkoGBI/E28PdbLZmeDLgzZzcx83/zZ2SSXC1j9fr+I1Hq93g2yxH4iwM1vkoBWAdxCmpzTxfkN2RcyZNaHFIkSo10+8kgxkXIURV5HGxTmFuc75B2RfQkpxHG8aAgaAFa0tAHqYFfQ7Iwe2yhODk8+J4C7yAoRTWI3w/4klGRgR4lO7Rpn9+gvMyWp+uxFh8+H+ARlgN1nJuJuQAYvNkEnwGFck18Er4q3egEc/oO+mhLdKgRyhdNFiacC0rlOCbhNVz4H9FnAYgDBvU3QIioZlJFLJtsoHYRDfiZoUyIxqCtRpVlANq0EU4dApjrtgezPFad5S19Wgjkc0hNVnuF4HjVA6C7QrSIbylB+oZe3aHgBsqlNqKYH48jXyJKMuAbiyVJ8KzaB3eRc0pg9VwQ4niFryI68qiOi3AbjwdsfnAtk0bCjTLJKr6mrD9g8iq/S/B81hguOMlQTnVyG40wAcjnmgsCNESDrjme7wfftP4P7SP4N3CJZdvzoNyGq2c/HWOXJGsvVg+RA/k2MC/wN6I2YA2Pt8GkAAAAASUVORK5CYII=") !important;
    }

    #toast-container > .toast-success {
        background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAADsSURBVEhLY2AYBfQMgf///3P8+/evAIgvA/FsIF+BavYDDWMBGroaSMMBiE8VC7AZDrIFaMFnii3AZTjUgsUUWUDA8OdAH6iQbQEhw4HyGsPEcKBXBIC4ARhex4G4BsjmweU1soIFaGg/WtoFZRIZdEvIMhxkCCjXIVsATV6gFGACs4Rsw0EGgIIH3QJYJgHSARQZDrWAB+jawzgs+Q2UO49D7jnRSRGoEFRILcdmEMWGI0cm0JJ2QpYA1RDvcmzJEWhABhD/pqrL0S0CWuABKgnRki9lLseS7g2AlqwHWQSKH4oKLrILpRGhEQCw2LiRUIa4lwAAAABJRU5ErkJggg==") !important;
    }

    #toast-container > .toast-warning {
        background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGYSURBVEhL5ZSvTsNQFMbXZGICMYGYmJhAQIJAICYQPAACiSDB8AiICQQJT4CqQEwgJvYASAQCiZiYmJhAIBATCARJy+9rTsldd8sKu1M0+dLb057v6/lbq/2rK0mS/TRNj9cWNAKPYIJII7gIxCcQ51cvqID+GIEX8ASG4B1bK5gIZFeQfoJdEXOfgX4QAQg7kH2A65yQ87lyxb27sggkAzAuFhbbg1K2kgCkB1bVwyIR9m2L7PRPIhDUIXgGtyKw575yz3lTNs6X4JXnjV+LKM/m3MydnTbtOKIjtz6VhCBq4vSm3ncdrD2lk0VgUXSVKjVDJXJzijW1RQdsU7F77He8u68koNZTz8Oz5yGa6J3H3lZ0xYgXBK2QymlWWA+RWnYhskLBv2vmE+hBMCtbA7KX5drWyRT/2JsqZ2IvfB9Y4bWDNMFbJRFmC9E74SoS0CqulwjkC0+5bpcV1CZ8NMej4pjy0U+doDQsGyo1hzVJttIjhQ7GnBtRFN1UarUlH8F3xict+HY07rEzoUGPlWcjRFRr4/gChZgc3ZL2d8oAAAAASUVORK5CYII=") !important;
    }

    #toast-container.toast-top-center > div,
    #toast-container.toast-bottom-center > div {
        width: 300px;
        margin: auto;
    }

    #toast-container.toast-top-full-width > div,
    #toast-container.toast-bottom-full-width > div {
        width: 96%;
        margin: auto;
    }

.toast {
    background-color: #030303;
}

.toast-success {
    background-color: #51a351;
}

.toast-error {
    background-color: #bd362f;
}

.toast-info {
    background-color: #2f96b4;
}

.toast-warning {
    background-color: #f89406;
}

.toast-progress {
    position: absolute;
    left: 0;
    bottom: 0;
    height: 4px;
    background-color: #000000;
    opacity: 0.4;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
    filter: alpha(opacity=40);
}
/*Responsive Design*/
@media all and (max-width: 240px) {
    #toast-container > div {
        padding: 8px 8px 8px 50px;
        width: 11em;
    }

    #toast-container .toast-close-button {
        right: -0.2em;
        top: -0.2em;
    }
}

@media all and (min-width: 241px) and (max-width: 480px) {
    #toast-container > div {
        padding: 8px 8px 8px 50px;
        width: 18em;
    }

    #toast-container .toast-close-button {
        right: -0.2em;
        top: -0.2em;
    }
}

@media all and (min-width: 481px) and (max-width: 768px) {
    #toast-container > div {
        padding: 15px 15px 15px 50px;
        width: 25em;
    }
}

#toast-container > .toast {
    background-image: none !important;
}

    #toast-container > .toast:before {
        position: fixed;
        font-family: FontAwesome;
        font-size: 24px;
        line-height: 18px;
        float: left;
        color: #FFF;
        padding-right: 0.5em;
        margin: auto 0.5em auto -1.5em;
    }

#toast-container > div {
    -moz-box-shadow: 5px 5px 10px rgba(0,0,0,0.6);
    -webkit-box-shadow: 5px 5px 10px rgba(0,0,0,0.6);
    box-shadow: 5px 5px 10px rgba(0,0,0,0.6);
}

    #toast-container > div:hover {
        -moz-box-shadow: 5px 5px 10px rgba(0,0,0,0.7);
        -webkit-box-shadow: 5px 5px 10px rgba(0,0,0,0.7);
        box-shadow: 5px 5px 10px rgba(0,0,0,0.7);
    }

#toast-container > .toast-warning:before {
    content: "\f071";
}

#toast-container > .toast-error:before {
    content: "\f00d";
}

#toast-container > .toast-info:before {
    content: "\f05a";
}

#toast-container > .toast-success:before {
    content: "\f00c";
}


@charset "UTF-8";
/* CSS Document */

.container-top {
    padding-top: 100px;
    background-image: url('img/bg-jac.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    min-height: 100vh;
    background-color: #EFEFEF;
}
.container-top h1{
  font-size: 2em;
}
.org-parent{
  position: relative;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-content: center;
  align-items: center;
}
.org-subnivel {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-content: flex-start;
    margin: -51px 0px 0px 0px;
    position: relative;
    padding-top: 56px;
    background-image: url('img/org-top-L.svg');
    background-repeat: no-repeat;
    background-size: 100% auto;
    background-position: top center;
}
.org-subnivelPrincipal {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-content: flex-start;
    margin: -17px 40px -40px 39px;
    position: relative;
    padding-top: 56px;
    background-image: url('img/branch.svg');
    background-repeat: no-repeat;
    background-position: top center;
}
.subnivel-btm {
    width: 100%;
    height: 80px;
    display: block;
    background-image: url('img/org-btm.svg');
    background-repeat: no-repeat;
    background-size: 100% auto;
    background-position: top center;
}
.org{
  width: 216px;
  height: 112px;
  margin:16px 23px 16px 23px;
  background-color: #161C29;
  position: relative;
  color: #fff;
  border: 1px solid #ABABAB;
  border-radius: 12px;
  -webkit-box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.25);
  -moz-box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.25);
  box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.25);
}
.org1{
  position: relative;
  margin-bottom: 0;
}
    .org1::before {
        width: 16px;
        height: 32px;
        display: inline-block;
        content: '';
        position: absolute;
        left: 100px;
        top: -33px;
        background-image: url('img/branch.svg');
        background-repeat: no-repeat;
        background-size: 16px 32px;
        background-position: center;
    }
.org-pic{
  width: 72px;
  height: 110px;
  float: left;
  border-right: 1px solid #474041;
  border-top-left-radius: 12px;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 12px;
}
.mgb{
  margin-bottom: 0;
}
.has-sub{
  width: 24px;
  height: 24px;
  display: inline-block;
  position: absolute;
  bottom: 8px;
  left: 6px;
  border-radius: 50%;
  -webkit-box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.25);
  -moz-box-shadow: 12px 2px 2px 1px rgba(0, 0, 0, 0.25);
  box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.25);
  text-align: center;
  cursor: pointer;
  z-index: 10;
}
.has-sub:hover{
  filter: brightness(50%);
}
.has-sub img{
  width: 24px;
  height: 24px;
}
.org-txt{
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: space-between;
  height: 112px;
}
.org-name {
    font-size: 0.80em;
    font-family: 'gothammedium', sans-serif;
    display: block;
    line-height: 1em;
    padding: 22px 12px 8px 12px;
    color: #fff;
}
.org-role {
    font-size: 0.75em;
    font-family: 'gothamlight', sans-serif;
    display: block;
    line-height: 1.2em;
    padding: 0 12px 16px 12px;
    color: #fff;
}
.org-nav{
  display: inline-block;
  margin-top: 32px;
  position: absolute;
  z-index: 10;
}
.back-btn{
  position: relative;
  display: inline-block;
  cursor: pointer;
  margin-right: 16px;
}
.start-btn{
  position: relative;
  display: inline-block;
  cursor: pointer;
  margin-right: 16px;
}

@media only screen and (min-width: 1025px) and (max-width: 1370px) {
 


}



@media only screen and (min-width: 768px) and (max-width: 1024px) {

    .org-subnivel {
        margin: 0px 0px 0px 0px;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        align-content: flex-start;
        position: relative;
        padding-top: 56px;
        background-image: url('img/org-top-L.svg');
        background-repeat: no-repeat;
        background-size: 100% auto;
        background-position: top center;
    }
}

@media only screen and (min-width:320px) and (max-width:768px){



}



@media only screen and (min-width: 70px) and (max-width: 668px) {
 
.container-top h1 {
  text-align: center;
  margin-bottom: 24px;
}
.org-nav {
  margin-top: 0;
  margin-bottom: 24px;
  margin-right: auto;
  position: relative;
  display: block;
  text-align: center;
}
    .org-subnivel {
        margin: 9px 16px 40px 16px;
        padding-top: 40px;
        background-image: url('img/org-top-L.svg');
        background-repeat: no-repeat;
        background-size: 100% auto;
        background-position: top center;
    }
    .subnivel-btm {
        background-image: url('img/org-btm-sm.svg');
        background-repeat: no-repeat;
        background-size: 100% auto;
        background-position: top center;
    }
.org{
  width: 272px;
}
.org1::before{
  left: 45%;
}
.container-top {
  padding-top: 90px;
}
    .container-top {
        padding-top: 100px;
        background-image: url('img/bg-jac.jpg');
        background-repeat: repeat;
        background-size: auto;
        background-position: center;
        min-height: 100vh;
        height: auto !important;
        background-color: #EFEFEF;
        display: inline-table;
        overflow-x: hidden;
    }

}

