body {
}

:root {
    /* ===== Color ===== */
    --color-primario: #f2f2f2;
    --color-blanco: #ffffff;
    --color-blanco-t1: rgba(255,255,255,1);
    --color-negro: #000000;
    --gris-oscuro-principal: #282828;
    --gris-oscuro-secundario: #383838;
    --color-borde: #727272;
    --color-borde-transparencia: rgba(0,0,0,.1);
    --color-dorado: #e1aa12;
    /*--color-dorado-transparencia: rgba(255,170,18,.6);*/
    --color-dorado-transparencia: rgba(222,168,0,.8);
    --color-celeste-agua: #2ab2bd;
    --color-blanco-transparencia: rgba(255,255,255,0.92);
    /**********/
}


.H_txt_GF {
    font-family: BANKGTHD !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    color: #f2f2f2 !important;
}
/******************************************** Animaciones **********************************************/
.H_animacion-05s {
    -webkit-transition: all 0.5s 0s ease;
    -moz-transition: all 0.5s 0s ease;
    -o-transition: all 0.5s 0s ease;
    transition: all 0.5s 0s ease;
}

.H_animacion-03s {
    -webkit-transition: all 0.3s 0s ease;
    -moz-transition: all 0.3s 0s ease;
    -o-transition: all 0.3s 0s ease;
    transition: all 0.3s 0s ease;
}
/********************************************************************************************************/

/*********************************************** Cantidad de Lineas *************************************/
.H_line-clamp_1_1 {
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.H_line-clamp_2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.H_line-clamp_3 {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.H_line-clamp_4 {
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.H_line-clamp_5 {
    display: -webkit-box;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.H_line-clamp_6 {
    display: -webkit-box;
    -webkit-line-clamp: 6;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.H_line-clamp_7 {
    display: -webkit-box;
    -webkit-line-clamp: 7;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.H_line-clamp_8 {
    display: -webkit-box;
    -webkit-line-clamp: 8;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

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

/****************************************** Colores Fondo *****************************************************/

.H_Rojo_1 {
    background-color: #ff0000 !important;
}

.H_Gris_1 {
    background-color: #535353 !important;
}

.H_Amarrillo_1 {
    background-color: #dccf05 !important;
}

.H_Azul_1 {
    background-color: #0b4983 !important;
}

.H_Verde_1 {
    background-color: #049245 !important;
}

.H_Dorado_1 {
    background-color: #e1aa12 !important;
}

.H_Dorado_1_opacidad {
    background-color: rgba(225,170,18,.4) !important;
}

.H_GrisOscuro_1 {
    background-color: #383838 !important;
}

.H_GrisOscuro_2 {
    background-color: #282828 !important;
    background-color: rgba(40,40,40,.4) !important;
}
/********************************************************************************************************/
/******************************************* color de borde *********************************************/
.H_borde_btn_Amarrillo {
    -webkit-transition: all 0.5s 0s ease;
    -moz-transition: all 0.5s 0s ease;
    -o-transition: all 0.5s 0s ease;
    transition: all 0.5s 0s ease;
}

    .H_borde_btn_Amarrillo:hover {
        border-bottom: 1px solid #e1aa12 !important;
    }

    .H_borde_btn_Amarrillo:active {
        border-bottom: 1px solid #e1aa12 !important;
    }

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

/******************************************* Hover de Botones *******************************************/
.H_Color_Dorado_1, .H_Color_Dorado_2, .H_hover_Rojo_1, .H_hover_Amarrillo_1, .H_hover_Verde_1 {
    -webkit-transition: all 0.5s 0s ease;
    -moz-transition: all 0.5s 0s ease;
    -o-transition: all 0.5s 0s ease;
    transition: all 0.5s 0s ease;
}

    .H_Color_Dorado_1:hover {
        background-color: #e1aa12 !important;
        background-color: rgba(225,170,18,1.0) !important;
    }

    .H_Color_Dorado_2:hover {
        background-color: #e1aa12 !important;
        background-color: rgba(225,170,18,1.0) !important;
        opacity: 1 !important;
        border: 1px solid #d9a20a !important;
    }

    .H_hover_Rojo_1:hover {
        background-color: #ff0000 !important;
        opacity: 1 !important;
        border: 1px solid #fe7f7f !important;
    }

    .H_hover_Amarrillo_1:hover {
        background-color: #dccf05 !important;
        opacity: 1 !important;
        border: 1px solid #fff001 !important;
    }

    .H_hover_Verde_1:hover {
        background-color: #049245 !important;
        opacity: 1 !important;
        border: 1px solid #02fc74 !important;
    }
/********************************************************************************************************/


/********************************************** txt Negrita *********************************************/
.H_Font_Weight_1 {
    font-weight: 600 !important;
}

.H_Font_Weight_400 {
    font-weight: 400 !important;
}
/********************************************************************************************************/

/*********************************************** txt Color **********************************************/
.H_txt_color_Turquesa_1 {
    color: #047c86 !important;
}

.H_txt_color_Dorado {
    color: var(--color-dorado-transparencia) !important;
    color: var(--color-dorado-transparencia) !important;
}

.H_txt_color_Azul_1 {
    color: #0c67a3 !important;
}

.H_txt_color_Blanco_1 {
    color: #ffffff !important;
}

/********* Personalizar Scroll CSS *******************/
.Html_Scroll::-webkit-scrollbar {
    -webkit-appearance: none;
}

    .Html_Scroll::-webkit-scrollbar:vertical {
        width: 10px;
    }

.Html_Scroll::-webkit-scrollbar-button:increment, .contenedor::-webkit-scrollbar-button {
    display: none;
}

.Html_Scroll::-webkit-scrollbar:horizontal {
    height: 10px;
}

.Html_Scroll::-webkit-scrollbar-thumb {
    background-color: rgba(242,242,242,.6);
    border-radius: 2px;
    border: 2px solid rgba(30,30,30,.2);
}

.Html_Scroll::-webkit-scrollbar-track {
    border-radius: 2px;
}

.Html_Scroll {
    /*Estilos estándar experimentales (Principalmente Firefox)*/
    scrollbar-color: rgba(242,242,242,.6) rgba(30,30,30,.2);
    scrollbar-width: thin;
}



/********* Personalizar Scroll Fondo Blanco CSS *******************/
.Html_Scroll_B::-webkit-scrollbar {
    -webkit-appearance: none;
}

    .Html_Scroll_B::-webkit-scrollbar:vertical {
        width: 10px;
    }

.Html_Scroll_B::-webkit-scrollbar-button:increment, .contenedor::-webkit-scrollbar-button {
    display: none;
}

.Html_Scroll_B::-webkit-scrollbar:horizontal {
    height: 10px;
}

.Html_Scroll_B::-webkit-scrollbar-thumb {
    background-color: rgba(30,30,30,.6);
    border-radius: 2px;
    border: 2px solid rgba(242,242,242,.2);
}

.Html_Scroll_B::-webkit-scrollbar-track {
    border-radius: 2px;
}

.Html_Scroll_B {
    /*Estilos estándar experimentales (Principalmente Firefox)*/
    scrollbar-color: rgba(30,30,30,.6) rgba(242,242,242,.2);
    scrollbar-width: thin;
}


/************************************* Somras CSS *********************************************/

/************************************* MAYUSCULAS ********************************************/
.Html_Mayuscula {
    text-transform: uppercase !important;
}

/*************************************** OPACIDAD *******************************************/
.Html_Opacidad_1 {
    opacity: 1 !important;
}
/*************************************** ANCHO Width *******************************************/
.Html_100 {
    width: 100% !important;
}
/*************************************** SOMBRAS *******************************************/
.Html_sombra1 {
    -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
}
/*************************************** Ancho y Alto *******************************************/
.Html_100porc {
    width: 100% !important;
    padding: 0 6px 0 6px;
}
/*************************************** Pading *******************************************/
.Html_Pading_6px {
    padding: 0 6px !important;
}
/*************************************** Margin *******************************************/
.Html_MarginBottom_10px {
    margin-bottom: 10px !important;
}
/*************************************** ALINEACION TEXBOX*******************************************/
.Html_AlinTexBox_Derec {
    text-align: right !important;
}

/*********************************************** Bordes Circular *********************************************/
.Html_BorCir {
    border-radius: 30px 30px 30px 30px !important;
    -moz-border-radius: 30px 30px 30px 30px !important;
    -webkit-border-radius: 30px 30px 30px 30px !important;
    border: 0px solid #000000 !important;
    padding: 4px !important;
    font-size: 10px !important;
}

/******************************************************************************************************/
.H_90 img {
    width: 90% !important;
}

.H_height_100{
    height:100% !important;
    display:block !important;
}