:root {
    --GeneralSystem_TimeLine: #4d3595;
    --GeneralSystem_TimeLine_secondary: #4762E6;

    --GeneralSystem_btn_primary: #001f3f;
    --GeneralSystem_btn_primary_hover: #042c54;

    --GeneralSystem_btn_secondary: #0a7a7b;
    --GeneralSystem_btn_secondary_hover: #069494;

    --GeneralSystem_btn_tertiary: #2b2f84;
    --GeneralSystem_btn_tertiary_hover: #2a2da3;

    --GeneralSystem_bg_orange: #fd7e14;
    --GeneralSystem_bg_orange_dark: #ff5a0a;
    --GeneralSystem_bg_orange_200: #ffdba9;
    --GeneralSystem_bg_orange_100: #ffefd4;
    --GeneralSystem_bg_orange_50: #fff8ed;

    --GeneralSystem_bg_info: #33b5e5;
    --GeneralSystem_bg_info_dark: #1385b6;
    --GeneralSystem_bg_info_200: #c0e6f7;
    --GeneralSystem_bg_info_100: #e3f2fb;
    --GeneralSystem_bg_info_50: #f1f9fe;

    --GeneralSystem_bg_primary: #4285f4;
    --GeneralSystem_bg_primary_dark: #2763e9;
    --GeneralSystem_bg_primary_200: #c0dbfd;
    --GeneralSystem_bg_primary_100: #dbeafe;
    --GeneralSystem_bg_primary_50: #eff6ff;

    --GeneralSystem_bg_success: #00c851;
    --GeneralSystem_bg_success_dark: #04911b;
    --GeneralSystem_bg_success_200: #b2ffd0;
    --GeneralSystem_bg_success_100: #d7ffe6;
    --GeneralSystem_bg_success_50: #eefff4;

    --GeneralSystem_bg_warning: #fb3;
    --GeneralSystem_bg_warning_dark: #ffa600;
    --GeneralSystem_bg_warning_200: #fff585;
    --GeneralSystem_bg_warning_100: #fffac5;
    --GeneralSystem_bg_warning_50: #fffdea;

    --GeneralSystem_bg_danger: #ff3547;
    --GeneralSystem_bg_danger_dark: #d61c2f;
    --GeneralSystem_bg_danger_200: #ffc5ca;
    --GeneralSystem_bg_danger_100: #ffdfe2;
    --GeneralSystem_bg_danger_50: #fff1f2;

    --GeneralSystem_bg_purple: #4762E6;
    --GeneralSystem_bg_purple_dark: #5000c8;
    --GeneralSystem_bg_purple_200: #c4d0f9;
    --GeneralSystem_bg_purple_100: #dee4fb;
    --GeneralSystem_bg_purple_50: #f0f3fe;

    --GeneralSystem_bg_plomo: #9bbdcb;
    --GeneralSystem_bg_plomo_dark: #578ca0;
    --GeneralSystem_bg_plomo_200: #d4dee9;
    --GeneralSystem_bg_plomo_100: #ecf0f5;
    --GeneralSystem_bg_plomo_50: #f4f7fa;

    --bs-white: #fff;
}

body {
    min-height: 100%;
    background-color: #fff;
}

nav#navPrincipal:not(.nav-scrolled) {
    box-shadow: none !important;
}

#navPrincipal {
    transition: background-color 0.3s ease, color 0.3s ease;
}

#navPrincipal.nav-scrolled {
    background-color: #ffffff;
    -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
}

.btn[class*="btn-outline-"].btn-sm {
    border: 1px solid currentColor !important;
}

.pointer{
    cursor: pointer;
}

/* COMPONENTES PRINCIPALES */

    /* PRIMARY */
        .btn-new-primary {
            background-color: var(--GeneralSystem_btn_primary);
            color: var(--bs-white);
        }

        .btn-new-primary:hover {
            background-color: var(--GeneralSystem_btn_primary_hover);
            color: var(--bs-white);
        }

        .bg-new-primary {
            background-color: var(--GeneralSystem_btn_primary);
        }

        .text-new-primary {
            color: var(--GeneralSystem_btn_primary);
        }

    /* SECONDARY */
    
        .btn-new-secondary {
            background-color: var(--GeneralSystem_btn_secondary);
            color: var(--bs-white);
        }

        .btn-new-secondary:hover {
            background-color: var(--GeneralSystem_btn_secondary_hover);
            color: var(--bs-white);
        }

        .bg-new-secondary {
            background-color: var(--GeneralSystem_btn_secondary);
        }

        .text-new-secondary {
            color: var(--GeneralSystem_btn_secondary) !important;
        }

    /* TERTIARY */

        .btn-new-tertiary {
            background-color: var(--GeneralSystem_btn_tertiary);
            color: var(--bs-white);
        }

        .btn-new-tertiary:hover {
            background-color: var(--GeneralSystem_btn_tertiary_hover);
            color: var(--bs-white);
        }

        .bg-new-tertiary {
            background-color: var(--GeneralSystem_btn_tertiary);
        }

        .text-new-tertiary {
            color: var(--GeneralSystem_btn_tertiary) !important;
        }

/* COMPONENTES PRINCIPALES */



/* COLORES */

    /* ANARANJADO */
        .bg-orange{
            background-color: var(--GeneralSystem_bg_orange);
        }

        .bg-orange-dark{
            background-color: var(--GeneralSystem_bg_orange_dark);
        }

        .bg-orange-200{
            background-color: var(--GeneralSystem_bg_orange_200);
        }

        .bg-orange-100{
            background-color: var(--GeneralSystem_bg_orange_100);
        }

        .badge-orange{
            background-color: var(--GeneralSystem_bg_orange_50) !important;
            color: var(--GeneralSystem_bg_orange) !important;
            padding: 8px !important;
        }

        .btn-outline-orange:hover, .btn-outline-orange:focus {
            background-color: var(--GeneralSystem_bg_orange_100) !important;
        }

    /* CELESTE */

        .bg-info-dark{
            background-color: var(--GeneralSystem_bg_info_dark);
        }

        .bg-info-200{
            background-color: var(--GeneralSystem_bg_info_200);
        }

        .bg-info-100{
            background-color: var(--GeneralSystem_bg_info_100);
        }

        .badge-info{
            background-color: var(--GeneralSystem_bg_info_50) !important;
            color: var(--GeneralSystem_bg_info) !important;
            padding: 8px !important;
        }

        .btn-outline-info:hover, .btn-outline-info:focus {
            background-color: var(--GeneralSystem_bg_info_100) !important;
        }

    /* AZUL  */

        .bg-primary-dark{
            background-color: var(--GeneralSystem_bg_primary_dark);
        }

        .bg-primary-200{
            background-color: var(--GeneralSystem_bg_primary_200);
        }

        .bg-primary-100{
            background-color: var(--GeneralSystem_bg_primary_100);
        }

        .badge-primary{
            background-color: var(--GeneralSystem_bg_primary_50) !important;
            color: var(--GeneralSystem_bg_primary) !important;
            padding: 8px !important;
        }

        .btn-outline-primary:hover, .btn-outline-primary:focus {
            background-color: var(--GeneralSystem_bg_primary_100) !important;
        }


    /* VERDE  */

        .bg-success-dark{
            background-color: var(--GeneralSystem_bg_success_dark);
        }

        .bg-success-200{
            background-color: var(--GeneralSystem_bg_success_200);
        }

        .bg-success-100{
            background-color: var(--GeneralSystem_bg_success_100);
        }

        .badge-success{
            background-color: var(--GeneralSystem_bg_success_50) !important;
            color: var(--GeneralSystem_bg_success) !important;
            padding: 8px !important;
        }

        .btn-outline-success:hover, .btn-outline-success:focus {
            background-color: var(--GeneralSystem_bg_success_100) !important;
        }

    /* AMARILLO  */

        .bg-warning-dark{
            background-color: var(--GeneralSystem_bg_warning_dark);
        }

        .bg-warning-200{
            background-color: var(--GeneralSystem_bg_warning_200);
        }

        .bg-warning-100{
            background-color: var(--GeneralSystem_bg_warning_100);
        }

        .badge-warning{
            background-color: var(--GeneralSystem_bg_warning_50) !important;
            color: var(--GeneralSystem_bg_warning) !important;
            padding: 8px !important;
        }

        .btn-outline-warning:hover, .btn-outline-warning:focus {
            background-color: var(--GeneralSystem_bg_warning_100) !important;
        }

    /* ROJO  */

        .bg-danger-dark{
            background-color: var(--GeneralSystem_bg_danger_dark);
        }

        .bg-danger-200{
            background-color: var(--GeneralSystem_bg_danger_200);
        }

        .bg-danger-100{
            background-color: var(--GeneralSystem_bg_danger_100);
        }

        .badge-danger{
            background-color: var(--GeneralSystem_bg_danger_50) !important;
            color: var(--GeneralSystem_bg_danger) !important;
            padding: 8px !important;
        }

        .btn-outline-danger:hover, .btn-outline-danger:focus {
            background-color: var(--GeneralSystem_bg_danger_100) !important;
        }

    /* MORADO  */

        .bg-purple{
            background-color: var(--GeneralSystem_bg_purple);
        }

        .bg-purple-dark{
            background-color: var(--GeneralSystem_bg_purple_dark);
        }

        .bg-purple-200{
            background-color: var(--GeneralSystem_bg_purple_200);
        }

        .bg-purple-100{
            background-color: var(--GeneralSystem_bg_purple_100);
        }

        .badge-purple{
            background-color: var(--GeneralSystem_bg_purple_50) !important;
            color: var(--GeneralSystem_bg_purple) !important;
            padding: 8px !important;
        }

        .btn-purple{
            background-color: var(--GeneralSystem_bg_purple) !important;
        }

        .btn-outline-purple {
            color: var(--GeneralSystem_bg_purple) !important;
            border: 2px solid var(--GeneralSystem_bg_purple) !important;
        }

        .btn-outline-purple:hover, .btn-outline-purple:focus {
            background-color: var(--GeneralSystem_bg_purple_100) !important;
            border: 2px solid var(--GeneralSystem_bg_purple) !important;
            color: var(--GeneralSystem_bg_purple) !important;
        }

    /* PLOMO  */

        .bg-gray{
            background-color: var(--GeneralSystem_bg_plomo);
        }

        .bg-gray-dark{
            background-color: var(--GeneralSystem_bg_plomo_dark);
        }

        .bg-gray-200{
            background-color: var(--GeneralSystem_bg_plomo_200);
        }

        .bg-gray-100{
            background-color: var(--GeneralSystem_bg_plomo_100);
        }

        .badge-gray{
            background-color: var(--GeneralSystem_bg_plomo_50) !important;
            color: var(--GeneralSystem_bg_plomo) !important;
            padding: 8px !important;
        }

        .btn-outline-gray:hover, .btn-outline-gray:focus {
            background-color: var(--GeneralSystem_bg_gray_100) !important;
        }

/* COLORES */

/* BORDES REDONDOS */

    .rounded-12 {
        border-radius: 12px;
    }

    .rounded-8 {
        border-radius: 8px;
    }

    /* .rounded */

    /* .rounded-top */

    /* .rounded-right */

    /* .rounded-bottom */

    /* .rounded-left */

    .rounded-new-lef {
        border-top-left-radius: 12px;
        border-bottom-left-radius: 12px;
    }

    .rounded-new-right {
        border-top-right-radius: 12px;
        border-bottom-right-radius: 12px;
    }

    .rounded-new-top {
        border-top-left-radius: 12px;
        border-top-right-radius: 12px;
    }

    .rounded-new-bottom {
        border-bottom-left-radius: 12px;
        border-bottom-right-radius: 12px;
    }

/* BORDES REDONDOS */

.fw-bold{
    font-weight: 700;
}

.text-justificado {
    text-align: justify !important;
    text-justify: inter-word !important;
}

.btn.btn-xs{
    padding:.2rem 1.1rem;
    font-size:.64rem
}

.img-carousel {
    width: 100%;
    /* height: 100vh; */
}

.parent-box {
    /* background-color: var(--GeneralSystem_btn_secondary); */
    display: flex;
}

.box {
    background-color: #fff;
    margin: 10px;
    height: auto;
}

.desc {
    padding: 15px;
    text-align: center;
}

.btn-circle {
    position: absolute;
    top: -22px;
    right: -22px;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: #5b9bff;
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 10px 20px rgba(91, 155, 255, 0.4);
    z-index: 2;
}

.btn-circle i {
    color: #fff;
    font-size: 22px;
}

.dropdown {
    position: relative;
    display: inline-block;
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px #00000033;
    z-index: 1;
}

.dropdown:hover .dropdown-content {
    display: block;
}

/* MOVIMIENTOS */

    .movim {
        cursor: pointer;
        transition: 0.7s;
    }

    .movim:hover {
        -webkit-transform: scale(0.9);
        -moz-transform: scale(0.9);
        -ms-transform: scale(0.9);
        -o-transform: scale(0.9);
        transform: scale(0.9);
        transition: 0.7s;
    }

    .movzoom {
        cursor: pointer;
        transition: 0.7s;
    }

    .movzoom:hover {
        -webkit-transform: scale(1.1);
        -moz-transform: scale(1.1);
        -ms-transform: scale(1.1);
        -o-transform: scale(1.1);
        transform: scale(1.1);
        transition: 0.7s;
    }

/* MOVIMIENTOS */

/* RESPONSIVO */

    /* CELULARES */

    @media (min-width: 0px) and (max-width: 575.98px) {

        .img-carousel {
            height: 250px;
        }

        .hidden-xs {
            display: none !important;
        }

    }

    /* TABLET */

    @media (min-width: 576px) and (max-width: 767.98px) and (orientation: landscape) {

        .hidden-sm {
            display: none !important;
        }

    }

    /* TABLET */

    @media (min-width: 576px) and (max-width: 767.98px) and (orientation: portrait) {

        .hidden-sm {
            display: none !important;
        }

    }

    /* PC */

    @media (min-width: 768px) and (max-width: 991.98px) {}

    /* PC */

    @media (min-width: 992px) and (max-width: 1199.98px) {}

    /* PC */

    @media (min-width: 1200px) and (max-width: 1399.98px) {}

    /* PC */

    @media (min-width: 1400px) {}

/* RESPONSIVO */