/* Medidas Mac 1440x700 */

/* Colores Cryvo */
#prueba_colores_cryvo {
    color: #ffffff;
    color: #212121;
    color: #e6e6e6;
    color: #FF6C0E;
    color: #fd924d;
    color: #0071CE;
    color: #757575;
    color: #363636;
    
    color: lightseagreen; /* #20b2aa */
    color: darkgray; /* , */
    color: orangered; /* #ff4500 */
    color: teal; /* #008080 */
    color: steelblue; /* #4682b4 */
    color: slategray; /* #708090 */
    color: royalblue; /* #4169e1 */
    color: lightslategray; /* #778899 */
    color: turquoise; /* #40e0d0 */
    color: dodgerblue; /* #1e90ff */
    color: darkred; /* #8b0000 */
    color: darkcyan; /* #008b8b */
    color: crimson; /* #dc143c */
    color: cornflowerblue; /* #6495ed */
    color: cadetblue; /* #5f9ea0 */
    color: brown; /* #a52a2a */
}    
            

/**--------------------------------------------------------------**/
/**@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@**/
/**##############################################################**/
/** CONTENEDOR GLOBAL PROYECTO **/
/**--------------------------------------------------------------**/
/**@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@**/
/**##############################################################**/

#conten_global_proy {
    width: 100%;
/*    height: 100vh;*/
    height: 100%;
    overflow: hidden;
/*    border: 1px solid red;*/
}

@media (min-width: 768px) {
    #conten_global_proy {
        width: 100%;
/*        height: 100vh;*/
        height: 100%;
        overflow: hidden;
    }
}
/**--------------------------------------------------------------**/
/**@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@**/
/**##############################################################**/
/** CONTENEDOR SUPERIOR PROYECTO **/
/**--------------------------------------------------------------**/
/**@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@**/
/**##############################################################**/

#conten_sup {
/*
    width: 100%;
    height: 3.5rem;
    position: sticky;
    height: 3.5rem;
    background-color: var(--blanco);
    z-index: 13;
    display: flex;
    justify-content: space-between;
    transition: all .5s;
*/
}

#conten_superior_proy {
    background-color: var(--col_barra);
    display: flex;
/*    position: sticky;*/
    height: 4rem;
    width: 100%;
/*    border: 1px solid green;*/
}

@media (min-width: 768px) {
    #conten_superior_proy {
        flex-wrap: nowrap;
        height: 4rem;
    }
}




/*******************************/
/*******************************/
/** Contenedor Superior Izq   **/
/*******************************/
/*******************************/

#conten_superior_proy_izq {
    width: 100%;
    height: 100%;
    position: relative;
    display: flex;
    background-color: var(--color_fondo_contenedor_superior_izq);
}

@media (min-width: 768px) {
    #conten_superior_proy_izq {
       width: 33.3%;
    }
}

.contenedor_logo_sup {
/*    height: 100%;*/
    margin-left: 1rem;
    display: flex;
    position: relative;
    justify-content: center;
    align-items: center;
    position: relative;
    max-width: 10rem;
    overflow: hidden;
/*    border: 5px solid red;*/
}

@media (min-width:768px) { 
    .contenedor_logo_sup {
        margin-left: 1rem;
        display: flex;
        position: relative;
        justify-content: center;
        align-items: center;
        position: relative;
        max-width: 10rem;
        overflow: hidden;
    }
}

.contenedor_logo_sup img {
    display: flex;
    width: 100%;
/*    height: 90%;*/
    border-radius: .5rem;
}

@media (min-width:768px) {
    .contenedor_logo_sup img {
        
    }
}

#texto_empresa_barra {
    display: none;
}

@media (min-width:768px) {
    #texto_empresa_barra {
        display: flex;
        justify-content: center;
        align-items: center;
        margin-left: 1rem;
        line-height: 100%;
        font-size: 1.4rem;
        font-weight: bold;
        color: red !important;
    /*    border: 1px solid red;*/
        color: white;   
    }
}


/*******************************/
/*******************************/
/** Contenedor Superior Cen   **/
/*******************************/
/*******************************/

#conten_superior_proy_cen {
    width: 100%;
    height: 100%;
    position: relative;
    display: flex;
    background-color: var(--color_fondo_contenedor_superior_izq);
}

@media (min-width: 768px) {
    #conten_superior_proy_cen {
        width: 33.3%;
    }
}


/*******************************/
/*******************************/
/** Contenedor Superior Der   **/
/*******************************/
/*******************************/

#conten_superior_proy_der {
    width: 33.3%;
    height: 100%;
    transition: all 0.5s;
    display: flex;
    flex-direction: column;
    padding-right: 1.5rem;
}

#conten_iconos_notificacion {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
/*    margin-right: 5%;*/
}

.icono_notificacion_barra_sup {
    border: 1px solid #d3d3d3;
    background-color: #f4f4f4;
    height: 3rem;
    width: 3rem;
    border-radius: .4rem;
    margin: 0rem .2rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    color: #000000;
}

.icono_notificacion_barra_sup:hover {
    cursor: pointer;
}

.icono_notificacion {
    transition: all .3s;
    font-size: 2rem;
}

.icono_notificacion:hover {
    cursor: pointer;
    transform: scale(1.1);
    color: #0080ff;
}

.numero_notificacion {
    position: absolute;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    height: 1.5rem;
    width: 1.5rem;
    margin-top: -1.8rem;
    margin-left: 1.8rem;
    font-size: 1rem;
    border-radius: 5rem;
    background-color: #DD0B02;
    color: white;
}


/* ************************************ /
/* *********************************** */
/* Zonza de notificaciones del borwser */
/* *********************************** */
/* *********************************** */
#conten_mensaje_notificaciones_browser {
    border: 1px solid black;
    position: absolute;
    display: none;
}

#conten_mensaje_notificaciones_browser img {
    border: 1px solid black;    
}

#conten_mensaje_notificaciones_browser p {
    border: 1px solid black;    
}
/* ************************************ /
/* *********************************** */





/*******************************/
/*******************************/
/** ICONOS DE NOTIFICACION  **/
/*******************************/
/*******************************/

.contenedor_datos_usuario {
    display: flex;
}

.contenedor_iconos_aviso {
    display: flex;
}

.contenedor_iconos_aviso span {
    font-size: 2rem;
    width: 5.2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color_iconos_barra_superior);
}

.contenedor_iconos_aviso span:hover {
    background: var(--color_hover_iconos_barra_superior);
    cursor: pointer;
}

.contenedor_iconos_usuario {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0px 10px 0px 10px;
}

.contenedor_iconos_usuario:hover {
    background: var(--color_hover_iconos_barra_superior);
    cursor: pointer;   
}

.foto_usuario {
    width: 4rem;
    height: 4rem;
    border: 1px solid var(--color_borde_campo_medio);
    border-radius: 5rem;
    position: relative;
}

.foto_usuario {
    cursor: pointer;
}

.foto_usuario img {
    width: 100%;   
    border-radius: 5rem;
}

.foto_usuario img {
    cursor: pointer;
}

.contenedor_box_float_usuario {
    position: absolute;
    height: 28rem;
    width: 28rem;
    right: -0.2rem;
    margin-top: 0.7rem;
    background: var(--color_fondo_box_float_usuario);
    opacity: 0;
    transition: all 0.3s;
    display: none;
    flex-wrap: wrap;
}

@media (min-width:768px) {
    .contenedor_box_float_usuario {
        right: -2rem;
    }
}

.box_float_superior {
    text-align: center;
    width: 100%;
    height: 18rem; 
}

.box_float_superior div:first-of-type {
    margin: 0 auto;
    width: 9rem;
}

.box_float_superior div img {
    margin-top: 1rem;
    width: 100%;
    border: 1px solid var(--color_borde_campo_medio);
    border-radius: 15rem;
}

.box_float_superior div:last-of-type {
    margin-top: .8rem;
}

.box_float_superior div label {
    color: var(--color_texto_medio);
    font-size: 1.5rem;
    font-weight: 300;
}


.box_float_medio {
    width: 100%;
    height: 5rem;
    background-color: var(--color_iconos_barra_superior);
}

.box_float_inferior {
    width: 100%;
    height: 5rem;
    background-color: var(--color_fondo_iconos_barra_superior);
    display: flex;
    justify-content: space-around;
}

.box_float_inferior input {
    border: none;
    height: 3.2rem;
    width: 8rem;
    align-self: center;
    background-color: var(--color_fondo_boton_claro);
    color: var(--color_texto_boton_claro);
}

.box_float_inferior input:hover {
    cursor: pointer;
    background-color: var(--color_hover_boton_claro);
}

.nombre_usuario {
    height: 100%;
    margin-left: .5rem;
    font-size: 1.4rem; 
    flex-direction: column;
    justify-content: center;
    text-align: center;
    line-height: 4.5rem;
    color: var(--color_iconos_barra_superior);
    display: none;
}

.nombre_usuario label:hover {
    cursor: pointer;
}

@media (min-width:768px) {
    .nombre_usuario {
        display: flex;
    }  
    
    .nombre_usuario label {
        height: 100%;
        width: 100%;
        transition: all .4s;
    }
}


/**--------------------------------------------------------------**/
/**@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@**/
/**##############################################################**/
/** CONTENEDOR CENTRAL PROYECTO **/
/**--------------------------------------------------------------**/
/**@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@**/
/**##############################################################**/

#conten_central_proy {
    display: flex;
/*    height: calc(100% - 6rem);*/
    overflow: hidden;
    height: 100%;
    height: calc(100% - 4rem);
/*    border: 1px solid blue;*/
}

@media (min-width:768px) {
    #conten_central_proy {
        height: calc(100% - 4rem);
        overflow: hidden;
    }   
}

/*******************************/
/*******************************/
/** Contenedor Central izquierda   **/
/*******************************/
/*******************************/
#conten_central_proy_izq {
    position: absolute;
    display: flex;
    /* Para el menu esto se combina con el fn_menu */
/*    width: 16rem;*/
    min-width: 16rem;
/*    width: 22rem;  Original */
    transition: all 0.4s;
    height: calc(100% - 4rem);
/*    overflow-y: scroll;*/
/*    overflow-x: hidden;*/
    width: 100%;
/*    border: 1px solid blue;*/
}

@media (min-width:700px) {
    #conten_central_proy_izq {
        height: 100%;
        width: auto;
        position: relative;
        min-width: 16rem;
    }
}

/*******************************/
/*******************************/
/** Contenedor Central Central   **/
/*******************************/
/*******************************/
#conten_central_proy_cen {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    height: 100%;
    transition: all 0.4s;
    padding: .3rem;
    margin-right: .6rem;
/*    margin-bottom: 500rem;*/
    position: relative;
/*    padding: 0rem .5%;*/
    
    
}

@media (min-width:768px) {
    #conten_central_proy_cen {
        width: calc(100% - 23rem);
        position: relative;
    }
}

#conten_panel_principal {
    width: 100%;
    border: 1px solid #d3d3d3;
    border-radius: 5px;
    padding: .1rem;
    overflow: hidden;
/*    border: 1px solid red;*/
/*    height: calc(100% - 4rem);*/
    height: 100%;
}

@media (min-width:768px) {
    #conten_panel_principal {
        height: 100%;
    }
}

#conten_panel_principal_sup {
    display: flex;
    width: 100%;
}

#conten_navegador_menu {
    cursor: pointer;
    z-index: 1;
}

.opcion_navegador_menu {
    font-size: 1.2rem;
    cursor: pointer;
}

.icono_home_menu_principal {
    cursor: pointer;
    font-size: 1.8rem;
}

.lbl_menu_principal {
    cursor: pointer;
    font-size: 1.2rem;
}

.icono_chevron_menu_principal {
    cursor: pointer;
    font-size: .9rem;
}

#conten_navegador_menu_izq {
/*    line-height: 3rem;*/
    display: flex;
    padding: .1rem;
/*    height: 2.6rem;*/
}

#conten_panel_principal_cen {
    padding: 0rem 0rem;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    background-color: var(--col_pri_tema);
    border-radius: .5rem;
/*    height: 0px;*/
    overflow: hidden;
    height: auto;
}

@media (min-width:768px) {
    #conten_panel_principal_cen {
        padding: 0rem 0rem;
        display: flex;
        flex-wrap: wrap;
        justify-content: space-around;
        align-items: center;
        background-color: var(--col_pri_tema);
        border-radius: .5rem;
/*        height: 0px;*/
        overflow: hidden;
    }
}

/* *********************** */
/* Caja principal busqueda */
/* *********************** */
.conten_caja_buscar {
    display: flex;
    justify-content: flex-end;
    position: relative;
/*    margin: .1rem;*/
/*    border: 1px solid red;*/
    height: 2.7rem;
}

@media (min-width:768px) {
    .conten_caja_buscar {
        display: flex;
        justify-content: flex-end;
        position: relative;
/*        margin: .1rem;*/
    }
}

#varbusqueda {
    display: flex;
    border: 1px solid #bfbfbf;
    border-radius: .5rem;
    padding: .3rem .3rem .3rem .3rem;
    width: 26rem;
/*    height: 3rem;*/
    font-size: 1.1rem;
}

@media (min-width:768px) {
    #varbusqueda {
        display: flex;
        justify-content: center;
        align-items: center;
        border: 1px solid #bfbfbf;
        border-radius: .5rem;
        padding: .5rem .5rem .5rem .5rem;
        width: 26rem;
/*        height: 3rem;*/
        font-size: 1.1rem;
    }
}

.icono_busqueda_superior {
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    height: 100%;
    position: absolute;
    font-size: 1.7rem;
    color: #6c6c6c;
    width: 3.2rem;
    height: 2.5rem;
    margin-top: .1rem;
    background-color: #efefef;
    border-top-right-radius: .5rem;
    border-bottom-right-radius: .5rem;
/*    margin-right: .1rem;*/
}

.icono_limpiar_busqueda_superior {
    visibility: hidden;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    height: 100%;
    position: absolute;
    font-size: 1.5rem;
    color: red;
    width: 2rem;
    height: 3rem;
    margin-right: 4.2rem;
    transition: visible .4s;
    z-index: 1;
    cursor: pointer;
}

.icono_limpiar_busqueda_superior:hover {
    cursor: pointer;
}
/* *********************** */
/* Fin caja busqueda principal */
/* *********************** */



/* ******************** */
/* Caja busqueda por id */
/* ******************** */
.conten_caja_buscar_id {
    display: flex;
    justify-content: center;
    align-items: center;
/*    justify-content: flex-end;*/
/*    margin-right: 5%;*/
    position: relative;
}

#varbusquedaid {
    display: flex;
    border: 1px solid #bfbfbf;
    border-radius: .5rem;
    padding: .5rem .5rem .5rem .5rem;
    width: 7rem;
    height: 3rem;
    font-size: 1.3rem;
}

.icono_busqueda_superior_id {
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    height: 100%;
    position: absolute;
    font-size: 2.1rem;
    color: #6c6c6c;
    width: 4rem;
    height: 3.5rem;
    margin-top: .3rem;
    background-color: #efefef;
    border-top-right-radius: .5rem;
    border-bottom-right-radius: .5rem;
    margin-right: .2rem;
}

.icono_limpiar_busqueda_superior_id {
    visibility: hidden;    
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    height: 100%;
    position: absolute;
    font-size: 1.5rem;
    color: red;
    width: 2rem;
    height: 4rem;
    margin-right: .2rem;
    transition: visible .4s;
    z-index: 1;
    cursor: pointer;
}

.icono_limpiar_busqueda_superior_id:hover {
    cursor: pointer;
}
/* ******************** */
/* Fin caja busqueda por id */
/* ******************** */


#conten_global_iconos_crud {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    position: relative;
/*    margin: .5rem;*/
/*    margin-right: 5%;*/
}

@media (min-width:768px) {
    #conten_global_iconos_crud {
        justify-content: flex-end;
        position: relative;
    }
}
    

.conten_icono_crud {
    height: 3rem;
    width: 3rem;
    margin: .2rem .2rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
}

#conten_panel_principal_inf {
    border-top: 1px solid #bababa;
    position: relative;
/*    height: 88%;*/
}

#conten_panel_principal_inf_ajax {
/*    height: calc(100% - 10rem);*/
/*    overflow: scroll;*/
/*    border: 5px solid red;*/
}

@media (min-width:768px) {
    #conten_panel_principal_inf_ajax {
/*        height: calc(100% - 8rem);*/
    /*    overflow: scroll;*/
    /*    border: 5px solid red;*/
    }
}

/*******************************/
/*******************************/
/** Contenedor Central Proy  **/
/*******************************/
/*******************************/
#conten_ajax_central_cen_proy {
    display: flex;
    width: 100%;
    height: 100%;
}

/*******************************/
/*******************************/
/** Contenedor Barra estado  **/
/*******************************/
/*******************************/
/*
#conten_barra_estado {
    display: flex;
    background-color: #f0f0f0;
    border: 1px solid #ebebeb;
    width: 100%;
    height: 2rem;
}
*/

/*
#lbl_barra_estado {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.2rem;
    margin-left: .5rem;
}
*/

/*******************************/
/*******************************/
/** Contenedor Central Derecho  **/
/*******************************/
/*******************************/
#conten_central_proy_der {
    background-color: var(--color_fondo_contenedor_izq);
    position: fixed;
    height: 50rem;
    width: 25rem;
    transition: all 0.4s;
    margin-left: 100%;
    z-index: 1;
}

@media (min-width:768px) {
    #conten_central_proy_der {
        
    }
}




/**@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@**/
/**##############################################################**/
/** INICIO Estilo campos del filtro multiple **/
/**##############################################################**/
/**@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@**/

/* Contenedor del campo de filtro */
.conten_campo_fil_sel_mul_select_multiple {
    margin-top: 3rem;
}

    #conten_campo_fil_sel_mul_usuario_lead {
        width: 100%;
        margin-top: 0rem;
    }

/* Contenedor del campo sin el select, la parte superior del campo*/
.conten_campo_fil_sel_mul_sup {
    height: 3.5rem;
    position: relative;
    margin-top: 1rem;
}

    #conten_campo_fil_sel_mul_sup_usuario {
        width: 100%;
        margin-top: 0rem;
    }

#titulo_rb_alertas_inventario {
    font-size: 1.3rem;   
    padding: .5rem;
    color: red;
}

#conten_alertas_inventario {
/*    border: 5px solid blue;*/
    display: flex;
}

.rb_alerta_inventario:hover {
    cursor: pointer;
}

.conten_campo_fil_sel_mul_sup_radiobutton label:hover {
    cursor: pointer;
}

.conten_campo_fil_sel_mul_sup_checkbox,
.conten_campo_fil_sel_mul_sup_radiobutton
{
    border: 1px solid #bebebe;
    display: flex;
    width: 100%;
    margin: .2em;
    padding: 1rem .3rem;
/*    margin-bottom: 3rem;*/
    font-size: 1.2rem;
    border-radius: .5rem;
}

.conten_campo_fil_sel_mul_sup_checkbox label {
    margin-left: .5rem;
}

.conten_campo_fil_sel_mul_sup_radiobutton label {
/*    border: 1px solid blue;*/
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: .2rem;
}


.conten_campo_fil_sel_mul_sup_fecha {
    border: 1px solid #a2a2a2;
    border-radius: .5rem;
}



/* Titulo del campo */
.lbl_tit_campo_fil_sel_mul {
    font-size: 1.3rem;
    font-weight: bold;
    position: absolute;
    margin-left: .5rem;
    margin-top: -1.7rem;
    color: black;
}

.chk_campo_fil_sel_mul {
    display: none;
}

/* Parte central del campo de filtro select */
.txt_campo_fil_sel_mul {
    border: none;
    outline: none;
    display: flex;
    width: 100%;
    height: 3.5rem;
    border: 1px solid #b1b1b1;
    border-radius: .2rem;
    padding: .5rem;
    font-size: 1.2rem;
}

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

/* Icono del select del filtro */
.icono_chevron_fil_sel_mul {
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    position: absolute;
    height: 3rem;
    width: 3rem;
    margin-top: -3.3rem;
    right: 0px;
    transition: all 0.3s;
}

.icono_chevron_fil_sel_mul:hover {
    cursor: pointer;
}

/* Contenedor de la parte inferior del campo de filtro select */
.conten_campo_fil_sel_mul_inf {
    position: relative;
    z-index: 1;
}

/* Contenedor de las opciones desplegables del filtro */
.conten_fil_sel_mul_opc_despl {
    border: 1px solid #c4c4c4;   
    width: 100%;
    background-color: white;
    display: flex;
    flex-wrap: wrap;
    position: absolute;
    border-radius: .5rem;
    display: none;
    box-shadow: 1px 1px 5px;
    overflow-y: scroll;
}

/* Contenedor del input de busqueda en el filtro select */
.conten_buscar_fil_sel_mul {
    display: flex;
    width: 100%;
    position: relative;
}

.txt_buscar_en_fil_sel_mul {
    display: flex;
    width: 100%;
    height: 3rem;
    margin: .5rem .5rem;
    padding: 0rem .5rem;
    font-size: 1.2rem;
}

@media (min-width:768px) {
    .txt_buscar_en_fil_sel_mul {
        display: flex;
        width: 100%;
        height: 3rem;
        margin: .5rem .5rem;
    }
}

.icono_aplicar_cambio_fil_sel_mul {
    border: 1px solid black;
    position: absolute;
    right: 1rem;
    margin-top: 1rem;
    border-radius: 1rem;
    padding: 0rem 1rem;
    background-color: var(--col_pri_tema);
    color: white;
    transition: all .3s;
}

.icono_aplicar_cambio_fil_sel_mul:hover {
    cursor: pointer;
    background-color: white;
    color: var(--col_pri_tema);
}



/* Contenedor de todas las opciones del select (los registros) */
.conten_opciones_fil_sel_mul {
    display: flex;
    flex-wrap: wrap;
    max-height: 11rem;
    overflow-y: scroll;
}

/* Contenedor de las opciones del select */
.conten_opc_fil_sel_mul_todos {
    display: flex;
    width: 100%;
    font-size: 1.1rem;
}

.conten_opc_fil_sel_mul_todos:hover {
    background-color: red;
    color: white;
}

/* Contenedor del checkbox de la opcion */
.conten_chk_fil_sel_mul_opc_todos,
.conten_chk_fil_sel_mul_opc_uno {
    width: 3rem;
    height: 3rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    padding-top: 1rem;
}

/* Contenedor del id de la opcion */
.option_select_div_2_opc_todos,
.option_select_div_2_opciones {
    
}

/* Contenedor de la descripcion del campo de la opcion */
.desc_opc_fil_sel_mul_todos,
.desc_opc_fil_sel_mul_uno {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
    width: 100%;
    font-size: 1.1rem;
    
}

.desc_opc_fil_sel_mul_todos:hover,
.conten_chk_fil_sel_mul_opc_uno:hover {
    cursor: pointer;
}


/* ################################################## */
/* ################################################## */
/* Filtro modal de la derecha */
/* ################################################## */
/* ################################################## */
#chk_icono_menu_filtro_der {
    display: none;   
}

/* Contenedor global del filtro derecho */
#conten_filtro_der {
    transition: all 0.4s;
    margin-top: 11.2rem;
    width: 35rem;
    background-color: white;
    box-shadow: 5px 5px 5px #797979;
    border-radius: .2rem;
    padding: 1rem 1rem;
    z-index: 2;
}

@media (min-width:768px) {
    #conten_filtro_der {
        transition: all 0.4s;
        margin-top: 4.6rem;
        width: 30rem;
        background-color: white;
        box-shadow: 5px 5px 5px #797979;
        border-radius: .2rem;
        padding: 1rem 1rem;
        z-index: 2;
    }
}

/* Contenedor del titulo de la ventana del filtro avanzado */
#conten_titulo_filtro_der {
    display: flex;
    position: relative;
/*    justify-content: center;*/
    align-content: center;
/*    height: 3rem;*/
/*    border: 1px solid red;*/
    
}

#titulo_filtro_avanzado {
    display: flex;
    height: 100%;
    width: 100%;
    padding: .5rem;
/*    justify-content: center;*/
/*    align-content: center;*/
    color: #6a6a6a;
    font-weight: bold;
    border-bottom: 1px solid #bcbcbc;
}

#lbl_cerrar_filtro_der {
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    color: #969696;
    font-size: 1.3rem;
/*    font-weight: bold;*/
    right: 1rem;
/*    border: 1px solid red;*/
    height: 100%;
}

#lbl_cerrar_filtro_der:hover {
    cursor: pointer;
    color: #555555;
}

/* Contenedor de los botones del filtro derecho */
#conten_botones_filtro_der {
    display: flex;
    justify-content: space-around;
    flex-wrap: nowrap;
}

#conten_botones_filtro_der .btn_filtro_der {
    margin-top: 1rem;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 12rem;
    height: 3.5rem;
    border-radius: .2rem;
    font-size: 1.1rem;
    background-color: #0089ff;
    color: white;
    transition: all .3s;
}

#conten_botones_filtro_der .btn_filtro_der:hover {
    cursor: pointer;
    background-color: #0068c1;
}

.conten_campo_filtro_der {
    display: flex;
    flex-wrap: wrap;
    border: 1px solid #b4b4b4;
    padding: 1rem .5rem;
    margin: .5rem 0rem;
    border-radius: .2rem;
}

.campo_filtro_der_checkbox {
    display: flex;
    font-size: 1.5rem;
    color: #404040;
}

.lbl_filtro_anio {
    display: flex;
    width: 100%;
/*    border: 1px solid red;   */
}

.input_filtro_anio {
    display: flex;
    text-align: right;
    width: 100%;
    height: 3rem;
}



/**@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@**/
/**##############################################################**/
/** FIN Estilo campos del filtro flotante multiple derecho **/
/**##############################################################**/
/**@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@**/





/**@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@**/
/**##############################################################**/
/** INICIO Estilo campos select simple **/
/**##############################################################**/
/**@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@**/

/* Contenedor del campo de filtro */
.conten_campo_fil_sel_uni_select_unico {
    width: 100%;
}

/* Contenedor del campo sin el select, la parte superior del campo*/
.conten_campo_fil_sel_uni_sup {
    text-align: left !important;
    
}

.chk_campo_fil_sel_uni {
    display: none;
}

.chk_campo_fil_sel_uni_lead {
    display: none;
}

.chk_opc_fil_sel_uni {
    display: none;
}

/* Parte central del campo de filtro select */
.txt_campo_fil_sel_uni {
    
}

/* Icono del select del filtro */
.icono_chevron_fil_sel_uni {
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    position: absolute;
    height: 3rem;
    width: 3rem;
    margin-top: -3.3rem;
    right: calc(5px);
    transition: all 0.3s;
}

.icono_chevron_fil_sel_uni:hover {
    cursor: pointer;
}

/* Icono del select del filtro */
.icono_chevron_fil_sel_uni_versionexistente {
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    position: absolute;
    height: 3rem;
    width: 3rem;
    margin-right: 3rem;
    margin-top: -3.3rem;
    right: calc(5px);
    transition: all 0.3s;
    color: black;
}

.icono_chevron_fil_sel_uni_versionexistente:hover {
    cursor: pointer;
}

/* Contenedor de la parte inferior del campo de filtro select */
.conten_campo_fil_sel_uni_inf {
    position: relative;
    z-index: 10;
/*    border: 1px solid blue;*/
/*    width: 100%;*/
}

/* Contenedor de las opciones desplegables del filtro */
.conten_fil_sel_uni_opc_despl {
    border: 1px solid #c4c4c4;   
    width: 100%;
    background-color: white;
    display: flex;
    flex-wrap: wrap;
    position: absolute;
    border-radius: .5rem;
    display: none;
    box-shadow: 1px 1px 5px;
}

/* Contenedor de las opciones desplegables del filtro de la version existente */
.conten_fil_sel_uni_opc_despl_existente {
    border: 1px solid #c4c4c4;   
    width: 100%;
    background-color: white;
    display: none;
    flex-wrap: wrap;
    position: absolute;
    border-radius: .5rem;
    box-shadow: 1px 1px 5px;
}



/* Contenedor del input de busqueda en el filtro select */
.conten_buscar_fil_sel_uni {
    display: flex;
/*    max-width: 99%;*/
}

.txt_buscar_en_fil_sel_uni {
    display: flex;
    width: 100%;
    height: 3rem;
    margin: .5rem .5rem;
    font-size: 1.2rem;
    padding: .2rem;
    border: 1px solid #c1c1c1;
    border-radius: .4rem
}

/* Contenedor de todas las opciones del select (los registros) */
.conten_opciones_fil_sel_uni {
    display: flex;
    flex-wrap: wrap;
    max-height: 11rem;
    overflow-y: scroll;
}

/* Contenedor de las opciones del select */
.conten_opc_fil_sel_uni_todos {
    display: flex;
    width: 100%;
    font-size: 1.4rem;
}

.conten_opc_fil_sel_uni_todos:hover {
    background-color: red;
    color: white;
}

/* Contenedor del checkbox de la opcion */
.conten_chk_fil_sel_uni_opc_todos,
.conten_chk_fil_sel_uni_opc_uno {
    width: 3rem;
    height: 3rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    padding-top: 1rem;
}

/* Contenedor del id de la opcion */
.option_select_div_2_opc_todos,
.option_select_div_2_opciones {
    
}

/* Contenedor de la descripcion del campo de la opcion */
.desc_opc_fil_sel_uni_todos,
.desc_opc_fil_sel_uni_uno {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
    width: 100%;
    font-size: 1.2rem;
    text-align: left; !important;
}

.desc_opc_fil_sel_uni_todos:hover,
.conten_chk_fil_sel_uni_opc_uno:hover {
    cursor: pointer;
}


.desc_opc_fil_sel_uni_uno_versionexistente {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
    width: 100%;
    font-size: 1.2rem;
    text-align: left; !important;
    color: black;
}

.conten_chk_fil_sel_uni_opc_uno_versionexistente:hover {
    cursor: pointer;
}



/**@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@**/
/**##############################################################**/
/** FIN Estilo campos select simple **/
/**##############################################################**/
/**@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@**/











/**@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@**/
/**##############################################################**/
/** INICIO Estilo campos con busqueda **/
/**##############################################################**/
/**@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@**/

/* Contenedor del campo de filtro */
.conten_campo_fil_sel_bus_select_unico {
    width: 100%;
}

/* Contenedor del campo sin el select, la parte superior del campo*/
.conten_campo_fil_sel_bus_sup {
    text-align: left !important;
}

/* Titulo del campo */
/*
.lbl_tit_campo_fil_sel_bus {
    width: auto;
    margin-left: 1rem;
    margin-right: 1rem;
    margin-top: -.8rem;
    font-size: 1.3rem;
    position: absolute;
    color: var(--color_texto_oscuro);
    transition: .2s ease all;
    background-color: white;
}
*/


.chk_campo_fil_sel_bus {
    display: none;
}

.chk_opc_fil_sel_bus {
    display: none;
}

/* Parte central del campo de filtro select */
.txt_campo_fil_sel_bus {
    
}

/* Icono del select del filtro */
.icono_chevron_fil_sel_bus {
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    position: absolute;
    height: 2.5rem;
    width: 3rem;
    margin-top: -3.3rem;
    right: calc(5px);
    transition: all 0.3s;
}

.icono_chevron_fil_sel_bus:hover {
    cursor: pointer;
}

/* Contenedor de la parte inferior del campo de filtro select */
.conten_campo_fil_sel_bus_inf {
    position: relative;
    z-index: 10;
/*    border: 1px solid blue;*/
/*    width: 100%;*/
}

/* Contenedor de las opciones desplegables del filtro */
.conten_fil_sel_bus_opc_despl {
    border: 1px solid #c4c4c4;   
    width: 98%;
    background-color: white;
    display: flex;
    flex-wrap: wrap;
    position: absolute;
    border-radius: .5rem;
    display: none;
    box-shadow: 1px 1px 5px;
}

/* Contenedor del input de busqueda en el filtro select */
.conten_buscar_fil_sel_bus {
    display: flex;
    max-width: 95%;
}

.txt_buscar_en_fil_sel_bus {
    display: flex;
    width: 100%;
    height: 3rem;
    margin: .5rem .5rem;
}

/* Contenedor de todas las opciones del select (los registros) */
.conten_opciones_fil_sel_bus {
    display: flex;
    flex-wrap: wrap;
    max-height: 11rem;
    overflow-y: scroll;
}

/* Contenedor de las opciones del select */
.conten_opc_fil_sel_bus_todos {
    display: flex;
    width: 100%;
    font-size: 1.4rem;

}

.conten_opc_fil_sel_bus_todos:hover {
    background-color: red;
    color: white;
}

/* Contenedor del checkbox de la opcion */
.conten_chk_fil_sel_bus_opc_todos,
.conten_chk_fil_sel_bus_opc_uno {
    width: 3rem;
    height: 2.5rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    padding-top: 1rem;
}

/* Contenedor del id de la opcion */
.option_select_div_2_opc_todos,
.option_select_div_2_opciones {
    
}

/* Contenedor de la descripcion del campo de la opcion */
.desc_opc_fil_sel_bus_todos,
.desc_opc_fil_sel_bus_uno {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
    width: 100%;
    font-size: 1.1rem;
    text-align: left; !important;
}

.desc_opc_fil_sel_bus_todos:hover,
.conten_chk_fil_sel_bus_opc_uno:hover {
    cursor: pointer;
}

/**@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@**/
/**##############################################################**/
/** FIN Estilo campos select simple **/
/**##############################################################**/
/**@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@**/




/**@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@**/
/**##############################################################**/
/** Estilo campos con detalle simple **/
/**##############################################################**/
/**@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@**/
/* Contenedor de la parte inferior del campo de filtro select */
.conten_campo_ver_detalle {
    position: absolute;
    z-index: 10;
    top: 3.5rem;
/*    border: 1px solid blue;*/
    width: 100%;
}

/* Contenedor de las opciones desplegables del filtro */
.conten_campo_ver_detalle_opc_despleg {
    border: 1px solid #c4c4c4;   
    width: 100%;
    background-color: white;
    display: flex;
/*    flex-wrap: wrap;*/
/*    position: relative;*/
    border-radius: .5rem;
    display: none;
    box-shadow: 1px 1px 5px;
/*    min-height: 10rem;*/
/*    width: 30rem;*/
    margin-left: 0;
/*    transition: all .4s;*/
    padding: .5rem;
    max-height: 15rem;
}

.icono_campo_ver_detalle {
    position: absolute;
/*    border: 1px solid red;*/
    right: 1rem;
    height: 3.5rem;
    top: -2.3rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    font-size: 1.2rem;
    color: green;
    transition: all .4s;
}

.icono_campo_ver_detalle:hover {
    cursor: pointer;
    transform: scale(1.1);
}

.chk_campo_ver_detalle_gastocredito {
}

.conten_item_gasto_credito {
    border: 1px solid #cecece;
    display: flex;
}

.conten_chk_item_gasto_credito {
    width: 10%;
/*    border: 1px solid red;*/
}

.chk_item_gasto_credito {
    height: 2.5rem;
}

.conten_descripcion_item_gasto_credito {
    width: 60%;
}

.lbl_descripcion_item_gasto_credito {
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: left;
    padding-left: 1rem;
    height: 2.5rem;
    font-size: 1.2rem;
}

.conten_valor_item_gasto_credito {
    width: 20%;
}

.lbl_valor_item_gasto_credito {
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: right;
    padding-left: 1rem;
    height: 2.5rem;
    font-size: 1.2rem;
}

#btn_calcular_credito {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
/*    border: 1px solid red;*/
    font-size: 1.2rem;
/*    border-radius: .4rem;*/
    padding: .8rem .8rem;
    background-color: #147bdb;
    color: white;
    transition: all .3s;
}

#btn_calcular_credito:hover {
    cursor: pointer;
    background-color: #76abdd;
}

#btn_guardar_datos_credito_maf {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
/*    border: 1px solid red;*/
    font-size: 1.2rem;
/*    border-radius: .4rem;*/
    padding: .8rem .8rem;
    background-color: #026506;
    color: white;
    transition: all .3s;
}

#btn_guardar_datos_credito_maf:hover {
    cursor: pointer;
    background-color: #3f9342;
}

#indicador_minimo_pie {
    font-size: var(--fuente_normal);
    position: absolute;
    top: -1.1rem;
    left: 4rem;
    color: red;
}

/**@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@**/
/**##############################################################**/
/** FIN Estilo campos con detalle simple **/
/**##############################################################**/
/**@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@**/






/**--------------------------------------------------------------**/
/**@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@**/
/**##############################################################**/
/** CONTENEDOR INFERIOR PROYECTO **/
/**--------------------------------------------------------------**/
/**@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@**/
/**##############################################################**/
#conten_inferior_proy {
/*
    display: flex;
    height: 3rem;
    border: 1px solid green;
*/
}

/*******************************/
/*******************************/
/** Contenedor Inferior Izq   **/
/*******************************/
/*******************************/
/*
#conten_inferior_proy_izq {
    width: 33.3%;
    transition: all 0.4s;
}

@media (min-width:768px) {
    #conten_inferior_proy_izq {
        
    }
}
*/

/*******************************/
/*******************************/
/** Contenedor Inferior Central   **/
/*******************************/
/*******************************/
/*
#conten_inferior_proy_cen {
    width: 33.3%;
    transition: all 0.4s;
}

@media (min-width:768px) {
    #conten_inferior_proy_cen {
        
    }
}
*/

/*******************************/
/*******************************/
/** Contenedor Inferior Derecha   **/
/*******************************/
/*******************************/
/*
#conten_inferior_proy_der {
    width: 33.3%;
    transition: all 0.4s;
}

@media (min-width:768px) {
    #conten_inferior_proy_der {
        
    }
}
*/
/**--------------------------------------------------------------**/
/**@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@**/
/**##############################################################**/
/** FIN CONTENEDOR INFERIOR PROYECTO **/
/**--------------------------------------------------------------**/
/**@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@**/
/**##############################################################**/









/**--------------------------------------------------------------**/
/** INICIO Estilo Ventana de Mensajes al Usuario por una Accion **/
#encabezado_inferior_der_inf {
    height: 5rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    border-bottom: 1px solid var(--color_borde_campo_claro);
    background-color: var(--color_fondo_encabezado_inferior_der_inf);
    display: none;
}

.informacion_estado_accion {
    margin: 0 auto;
    height: 4rem;   
    border-radius: .4rem;
    font-size: 1.4rem;
    display: flex;
    align-items: center;
    transition: all .4s;
    width: 95%;
    margin-top: .4rem;
    opacity: 0;
    display: none;   
}

@media (min-width:768px) {
    .informacion_estado_accion {
        width: 98%;
    }
}
    
#lbl_informacion_estado_accion {
    text-align: center;
    width: 100%;
    line-height: 1.4rem;
}


.informacion_estado_accion span {
    width: 2rem;
    margin-right: 2rem;
    vertical-align: middle;
    text-align: center;
}

.informacion_estado_accion span:hover {
        cursor: pointer;
}
/** FIN Estilo Ventana de Mensajes al Usuario por una Accion **/
/**--------------------------------------------------------------**/



.contenedor_label_listar,
.contenedor_boton_listar {
    display: flex;
    height: var(--alto_boton);
    white-space: nowrap;
}

.contenedor_label_listar label {
    font-size: 1.8rem;
    width: 10rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    color: var(--color_texto_oscuro);
    display: none;
}

@media (min-width:768px) {
    .contenedor_label_listar label {
        display: block;
    }
}

.contenedor_boton_listar label:nth-child(1) {
    border-top: 1px solid var(--color_borde_boton_claro);
    border-right: 1px solid var(--color_borde_boton_claro);
    border-bottom: 1px solid var(--color_borde_boton_claro);
    border-left: 1px solid var(--color_borde_boton_claro);
    border-top-left-radius: .4rem;
    border-bottom-left-radius: .4rem;
    background: var(--color_fondo_boton_claro);
    color: var(--color_texto_boton_claro);
    width: 13rem;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    font-size: var(--fuente_boton);
    transition: all 0.3s;
    display: none;
}

@media (min-width:990px) {
    .contenedor_boton_listar label:nth-child(1) {
        display: flex;
    }
}

.contenedor_boton_listar label:nth-child(2) {
    border-top: 1px solid var(--color_borde_boton_claro);
    border-right: 1px solid var(--color_borde_boton_claro);
    border-bottom: 1px solid var(--color_borde_boton_claro);
    border-top-right-radius: .4rem;
    border-bottom-right-radius: .4rem;
    background: var(--color_fondo_boton_claro);
    color: var(--color_texto_boton_claro);
    width: 13rem;
    font-size: var(--fuente_boton);
    transition: all 0.3s;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    display: none;
}

@media (min-width:990px) {
    .contenedor_boton_listar label:nth-child(2) {
        display: flex;
    }
}


.contenedor_boton_listar label:nth-child(3) {
    margin-left: 1.5rem;
    background: var(--color_fondo_boton_oscuro);
    color: var(--color_texto_boton_oscuro);
    border-radius: .4rem;
    width: 16rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    font-size: 1.3rem;
    transition: all 0.3s;
}

.contenedor_boton_listar label:nth-child(1):hover,
.contenedor_boton_listar label:nth-child(2):hover {
    cursor: pointer;
    background: var(--color_hover_boton_claro);
}

.contenedor_boton_listar label:nth-child(3):hover {
    cursor: pointer;
    background: var(--color_hover_boton_oscuro);
}


.cuerpo_inferior_der {
    margin: 0 auto;
    border: 1px solid var(--color_borde_campo_claro);
    width: 100%;
    margin-top: 11rem;
    background-color: var(--color_fondo_cuerpo_inferior_der);
}

@media (min-width:991px) {
    .cuerpo_inferior_der {
        width: 97%;
        border-radius: 0.4rem;
    }
}

@media (min-width:1024px) {
    .cuerpo_inferior_der {
        width: 98%;
    }
}
/**--------------------------------------------------------------**/
/**@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@**/
/**##############################################################**/
/** FIN Estilo pagina inicio.php **/
/**##############################################################**/
/**@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@**/
/**--------------------------------------------------------------**/



/**>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>**/
/**>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>**/
/**>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>**/



/**--------------------------------------------------------------**/
/**@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@**/
/**##############################################################**/
/** INICIO Estilo Filtro Tablas **/
/**##############################################################**/
/**@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@**/
/**--------------------------------------------------------------**/
.contenedor_filtro {
    padding: 1rem;
    display: flex;
    flex-wrap: wrap;
}

@media (min-width:990px) {
    .contenedor_filtro {   
        flex-wrap: nowrap;
        align-items: flex-end;
        padding-top: 0;
    }
}

.contenedor_filtro input {
    border: none;
    height: 4rem;
    width: 100%;
    margin-top: 2rem;
    border-radius: 0.4rem;
}

.contenedor_filtro input:focus {
    outline: none;
    outline: 2px solid var(--color_borde_focus_campo_filtro);
}

@media (min-width:990px) {
    .contenedor_filtro input {
        border-radius: 0;
        border-top-left-radius: 0.4rem;
        border-bottom-left-radius: 0.4rem;
    }
}

.filtro_tipo_div {
    /*    -webkit-appearance: none;*/
    /*    -moz-appearance: none;*/
    border: 1px solid var(--color_borde_campo_claro);
    height: 4rem;
    width: 100%;
    margin-top: 1rem;
    border-radius: 0.4rem;
    background-color: var(--color_fondo_contenedor_campo_filtro);
    font-size: 1.4rem;
    color: var(--color_texto_medio);
    position: relative;
}


@media (min-width:990px) {
    .filtro_tipo_div:nth-child(1) {
        border-radius: 0;
        border: none;
        border-left: 1px solid var(--color_borde_boton_claro);
        border-top: 1px solid var(--color_borde_boton_claro);
        border-bottom: 1px solid var(--color_borde_boton_claro);
        border-top-left-radius: 0.4rem;
        border-bottom-left-radius: 0.4rem;
    }
    
    .filtro_tipo_div:nth-child(2) {
        border-radius: 0;
        border: none;
        border-left: 1px solid var(--color_borde_boton_claro);
        border-top: 1px solid var(--color_borde_boton_claro);
        border-bottom: 1px solid var(--color_borde_boton_claro);
    }
    
    .filtro_tipo_div:nth-child(3) {
        border-radius: 0;
    }
}

.filtro_tipo_div input {
    border: none;
    padding: .5rem;
    margin: 0;
    height: 100%;
    width: 100%;
    border-radius: 0.4rem;
    text-decoration-skip: none;
}

.select_filtro {
    width: 100%;
    height: 100%;
    padding: .5rem;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    position: relative;
    background-color: var(--color_fondo_campo_filtro);
    font-size: 1.2rem;
}

.select_filtro:hover {
    background-color: var(--color_hover_boton_claro);
}

.select_filtro:hover + .icono_flecha_filtro {
    background-color: var(--color_hover_boton_claro);
}

.icono_flecha_filtro {
    font-size: 2.4rem;
    cursor: pointer;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;    
    transition: all 0.3s;
}

.icono_busqueda {
    display: none;
    height: 4rem;
    min-height: 4rem;
    max-height: 4rem;
    width: 4rem;
    min-width: 4rem;
    max-width: 4rem;
    border: 1px solid var(--color_borde_campo_claro);
    border-top-right-radius: 0.4rem;
    border-bottom-right-radius: 0.4rem;
    color: var(--color_texto_oscuro);
    font-size: 2rem;
}

@media (min-width:990px) {
    .icono_busqueda {
        display: flex;
        flex-direction: column;
        justify-content: center;
        text-align: center;
        border-left: none;
    }
}

.opciones_select_filtro {
    position: absolute;
    top: 38;
    left: 0;
    height: 18.5rem;
    border: 1px solid var(--color_borde_boton_claro);
    width: 100%;
    display: flex;
    flex-direction: column;
    background: white;
    opacity: 0;
    transition: all 0.3s;
    overflow: scroll;
    overflow-x: hidden; 

}

.traer_al_frente {

}

.opciones_select_filtro label {
    min-height: 4rem;
    font-size: 1.2rem;
    padding-left: .5rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.opciones_select_filtro label:hover {
    cursor: pointer;
    background-color: var(--color_hover_boton_claro);
}

.contenedor_info_filtro {
    height: 5rem;
    width: 100%;
    padding: 0rem 1.3rem 0rem 1.3rem;
    border-radius: 0.4rem;
    background: white;
    display: flex;
    justify-content: space-between;
}

.contenedor_info_filtro label:nth-child(2):hover {
    cursor: pointer;
}

@media (min-width:480px) {
    .contenedor_info_filtro {
        height: 2rem;
    }   
}

.contenedor_info_filtro label {
    font-size: 1.5rem;
    color: #5c5c5c;
    align-self: center;
}
/**--------------------------------------------------------------**/
/**@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@**/
/**##############################################################**/
/** FIN Estilo Filtro Tablas **/
/**##############################################################**/
/**@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@**/
/**--------------------------------------------------------------**/









/**--------------------------------------------------------------**/
/**@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@**/
/**##############################################################**/
/** INICIO Estilo Ventana Modal Alerta, Eliminar y Exportar  Cambiar Password**/
/**##############################################################**/
/**@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@**/
/**--------------------------------------------------------------**/
.modalAlerta {
    background-color: rgba(0,0,0,.1);
    position: fixed;
    justify-content: center;
    align-items: center;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    opacity: 0;
    pointer-events:none;
    transition: all .5s;
    visibility: hidden;
    z-index: 200;
}

.modal_contenido_alerta {
    transition: all .5s;
    background-color: #ffffff;
    width: 440px;
    max-width: 90%;
    height: 300px;
    margin: 10% auto;
    position: relative;
/*    border-radius: .4rem;*/
    padding: 
}

.linea_separador_verde {
/*    width: 100%;*/
/*    margin-top: 1rem;*/
    border: 5px solid #0ed40e !important;
}

#modal_icono_alerta {
    height: 80px;    
    margin-top: 30px;
    position: relative;
    display: flex;
    justify-content: center;
/*    border: 5px solid red;*/
/*    padding-top: 2rem;*/
}

.icon-circle-with-cross {
    color: red;
    font-size: 80px;
    position: absolute;
}

.icon-warning {
/*
    color: #d3d300;
    font-size: 80px;
    position: absolute;
*/
}

.icon-circle4 {
    font-size: 70px;
    position: absolute;
    color: green;
}


#modal_icono_alerta #icono_2 {
    font-size: 80px;
    position: absolute;
    margin-top: -20px;
    margin-left: 10px;
    color: green;
}

    
#modal_mensaje_superior_alerta {
    width: 100%;
    display: flex;
/*    border-radius: 2px;*/
}

#mensaje_ventana_modal_alerta_titulo {
    display: flex;
    align-items: center;
    width: 100%;
    color: #464646;
    font-size: 20px;
    font-weight: bold;
    padding: 1.5rem 1rem;
    border-bottom: 1px solid #c9c9c9;
}

#modal_mensaje_central_alerta {
    margin-top: 1rem;
    width: 100%;
    display: flex;
    justify-content: center;
    flex-direction: column;
    text-align: center;
    color: #959595;
    padding: 0px 10px;
}

#mensaje_ventana_modal_alerta_contenido {
    font-size: 1.5rem;
}

#modal_mensaje_inferior_alerta {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    padding-right: 1rem;
    width: 100%;
    margin-top: 30px;
    height: 6rem;
    border-top: 1px solid #c9c9c9;
}

#btn_cerrar_modal_alerta_mantenedor {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 3.5rem;
    width: 12rem;
/*    padding: 7px 35px 7px 35px;*/
    text-decoration: none;   
    background-color: #007200;
    color: white;
/*    border-radius: 2px;*/
    font-size: 1.4rem;
    transition: all .3s;
}

#btn_cerrar_modal_alerta_mantenedor:hover {
    background-color: #014d01;
    cursor: pointer;
}





/**--------------------------------------------------------------**/
/**@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@**/
/**##############################################################**/
/** INICIO Estilo Ventana Modal Procesando **/
/**##############################################################**/
/**@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@**/
/**--------------------------------------------------------------**/
#contenedor_procesando {
    position: fixed;
    height: 100%;
    width: 100%;
    display: flex;
    z-index: 50;
    visibility: hidden;
    background-color: rgba(47, 47, 47,.6);
}

#contenedor_imagen_procesando {
    margin: 0 auto;
    align-self: center;
    position: relative;
}

#contenedor_imagen_procesando img {
    width: 100%;
    max-height: 40rem;
}
/**--------------------------------------------------------------**/
/**@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@**/
/**##############################################################**/
/** FIN Estilo Ventana Modal Procesando **/
/**##############################################################**/
/**@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@**/
/**--------------------------------------------------------------**/



/**--------------------------------------------------------------**/
/**@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@**/
/**##############################################################**/
/** INICIO Estilo Modulo Agregar **/
/**##############################################################**/
/**@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@**/
/**--------------------------------------------------------------**/
.contendor_modulo_agregar {
    width: 100%;
    padding: 1rem;
    display: flex;
    flex-direction: column;
    flex-flow: column-reverse;
}

@media (min-width:1024px) {
    .contendor_modulo_agregar {
        width: 100%;
        padding: 1rem;
        display: flex;
        justify-content: space-around;
        flex-direction: row;
    }
    
}

/********************************************/
/** INICIO Estilo Modulo Agregar Izquierda **/
/********************************************/
.modulo_agregar_izq {
}

@media (min-width:1024px) {
    .modulo_agregar_izq {
        
    }
}

.contenedor_label_guardar {
    
}

.contenedor_label_guardar label:hover {
    
}

.contenedor_boton_guardar label {
    
}

.contenedor_boton_guardar label:hover {

}

.bloque_contenedor_modulo_agregar {
    
}

.cuadro_modulo_agregar {
    
}

@media (min-width:768px) {
    .cuadro_modulo_agregar {
        
    }
}

.contenedor_campo_agregar {
    
}

@media (min-width:768px) {
    .contenedor_campo_agregar {
        
    }   
}

/** Titulo campo agregar **/
.contenedor_campo_agregar label:first-of-type {
    
}


@media (min-width:768px) {
    /** Titulo campo agregar **/
    .contenedor_campo_agregar label:first-of-type {
        
    }
}


/** Input agregar **/
.contenedor_campo_agregar input {
    
}

@media (min-width:780px) {
    .contenedor_campo_agregar input {
        
    }
}

/** Input tipo select agregar **/
.contenedor_campo_agregar select {
}

/** Campo obligatorio agregar **/
.contenedor_campo_agregar label:last-of-type {
    
}

.contenedor_campo_agregar label:last-of-type:hover {

}

@media (min-width:768px) {
    /** Campo obligatorio agregar **/
    .contenedor_campo_agregar label:last-of-type {
        
    }
}
/********************************************/
/** FIN Estilo Modulo Agregar Derecha **/
/********************************************/


/********************************************/
/** INICIO Estilo Modulo Agregar Derecha **/
/********************************************/
.modulo_agregar_der {
    
}

@media (min-width:1024px) {
    .modulo_agregar_der {
        
    }
}

.contenedor_foto_usuario {
    margin: 0 auto;
    margin-top: 1rem;
    border: 1px dotted var(--color_borde_boton_claro);
    background-image: url("../fontawesome/svgs/solid/upload.svg");
    background-position: center;
    background-repeat: no-repeat;
    height: 25rem;
    width: 90%;
    max-width: 25rem;
    border-radius: 4px;
    background: rgb(230,230,230);
    background-repeat: no-repeat;
    background-size: 100%;
    background-size: contain;
    background-position: center;
    overflow: hidden;
    position: relative;
    border: 1px dashed #000;
}

#lbl_subir_foto_usuario {
    position: absolute;
    text-align: center;
    font-size: 1.3rem;
    margin-top: 1rem;
    padding: 1rem;
    color: var(--color_texto_boton_claro);
}


.foto_principal_usuario {
    width: 100%;
    height: 25rem;    
    background-image: url("../fontawesome/svgs/solid/upload.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 64px 64px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    filter: alpha(opacity=50);
    -khtml-opacity: 0.5;
    -moz-opacity: 0.5;
    opacity: 0.5;
    text-align: center;
}

.foto_principal_usuario input {
    width: 100%;
    height: 25rem;
    padding-top: 25rem;
    border: none;
    cursor: pointer;
}

.foto_principal_usuario input:focus {
    outline: none;
}

.foto_principal_usuario .spinner {
    display: none;
    margin-top: 50%;
}

.foto_principal_usuario:hover {
    filter: alpha(opacity=100);
    -khtml-opacity: 1;
    -moz-opacity: 1;
    opacity: 1;
}

.contenedor_adicional_1 {
    margin: 0 auto;
    border: 1px solid var(--color_borde_boton_claro);
    width: 90%;
    margin-top: 1rem;
    padding: .3rem;
    margin-bottom: 1rem;
}

#lbl_titulo_selector_multiple {
    width: 100%;
    display: flex;
    justify-content: center;
    font-size: 1.5rem;
}

.contenedor_buscar_seleccion_campos input {
    display: flex;
    width: 100%;
}

.contenedor_campos_seleccionados {
    display: flex;
}

.contenedor_campos_seleccionados_izq {
    border-top: 1px solid var(--color_borde_boton_claro);
    border-left: 1px solid var(--color_borde_boton_claro);
    border-bottom: 1px solid var(--color_borde_boton_claro);
    width: 100%;
    padding-left: .5rem;
}

.contenedor_campos_seleccionados_izq label {
    background: var(--color_fondo_boton_oscuro);
    border-radius: .5rem;
    color: var(--color_texto_boton_oscuro);
    padding: .3rem .8rem;
    font-size: 1.3rem;
    white-space: nowrap;
}



.contenedor_campos_seleccionados label span {
    margin-left: .3rem;
    font-size: 1.1rem;
}

.contenedor_campos_seleccionados label span:hover {
    cursor: pointer;
}

.contenedor_campos_seleccionados_der {
    width: 1.5rem;
    min-width: 1.5rem;
    max-width: 1.5rem;
}

.contenedor_campos_seleccionados_der span {
    border-top: 1px solid var(--color_borde_boton_claro);
    border-right: 1px solid var(--color_borde_boton_claro);
    border-bottom: 1px solid var(--color_borde_boton_claro);
    font-size: 1.1rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    height: 100%;
    padding-right: .5rem;
}


.contendor_campos_disponibles {
    display: flex;
    flex-wrap: wrap;
    height: 10rem;
    overflow-x: scroll;
}

.contendor_campos_disponibles label {
    width: 100%;
    height: 3rem;
    font-size: 1.4rem;
    border-bottom: 1px solid red;
}

.contendor_campos_disponibles label {
    cursor: pointer;
}

/********************************************/
/** FIN Estilo Modulo Agregar Derecha **/
/********************************************/

/**--------------------------------------------------------------**/
/**@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@**/
/**##############################################################**/
/** FIN Estilo Modulo Agregar **/
/**##############################################################**/
/**@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@**/
/**--------------------------------------------------------------**/



#conten_datos_filtro_ci {
    margin-top: 2rem;
    display: flex;
    justify-content: center;
    width: 100%;
}

.conten_campo_ci {
    display: flex;
    flex-wrap: wrap;
    margin-left: 1rem;
}

.conten_campo_ci select {
    display: flex;
    width: 100%;
    height: 4rem;
    border-radius: .5rem;
}


.conten_campo_ci input {
    border: none;
    border: 1px solid #898989;
    display: flex;
    width: 100%;
    max-width: 30rem;
    height: 4rem;
    border-radius: .5rem;
    padding: .4rem;
    text-align: right;
}

#buscar_emb_ci {
    align-self: flex-end;
    height: 4rem;
    background-color: green;
    color: white;
    width: 20rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    border-radius: .5rem;
    transition: all 0.3s;
}

#buscar_emb_ci:hover {
    background-color: rgb(0, 128, 0, 0.6);
    cursor: pointer;
}

/* ====================================================== */
/*                      TOOLTIP                           */
/* ====================================================== */

/* Tooltip container */
.tooltip {
    position: relative;
    display: inline-block;
    border-bottom: 1px dotted black;  /*  If you want dots under the hoverable text */
    
}

/* Tooltip text */
.tooltiptext {
    visibility: hidden;
    color: white;
    position: absolute;
    margin-top: 8rem;
    text-align: center;
    overflow-wrap: normal;
    white-space: nowrap;
    display: flex;
    padding: .6rem .5rem;
    width: auto;
    align-items: center;
    justify-content: center;
    background-color: black;
    font-size: 1.3rem;
}

/* Show the tooltip text when you mouse over the tooltip container */
.tooltip:hover > .tooltiptext {
    visibility: visible;
    z-index: 1000;
}

.triangulo-equilatero-bottom {
    visibility: hidden;
    position: absolute;
    width: 0;
    height: 0;
    margin-top: 4rem;
    border-right: 10px solid transparent;
    border-top: 10px solid transparent;
    border-left: 10px solid transparent;
    border-bottom: 10px solid black;
}

.tooltip:hover > .triangulo-equilatero-bottom {
    visibility: visible;
    z-index: 1000;
}


/* *************************************** */
/* Fin Contenedor de selector de hora flotante */
/* *************************************** */
/*color_hover_boton_deshabilitado*/

/*Estilo de los botones CRUD*/
.btn_crud_habilitado {
    height: 100%;
    width: 100%;
    padding: .4rem;
    transition: all .3s;
    font-size: 2rem;
    background-color: #f4f4f4;
    border-radius: .4rem;
    color: var(--color_texto_boton_crud);
}

.btn_crud_habilitado:hover {
    cursor: pointer;
    transform: scale(1.1);
    color: var(--color_hover_boton_crud);
}


.btn_crud_deshabilitado {
    height: 100%;
    width: 100%;
    padding: .4rem;
    transition: all .3s;
    font-size: 2rem;
    background-color: var(--color_fondo_boton_deshabillitado);
    color: var(--color_texto_boton_deshabillitado);
    border-radius: .4rem;
}

.btn_crud_deshabilitado:hover {
    cursor: not-allowed;
    transform: scale(1);
}


/*Estilo de los botones del formulario */

#conten_acciones_form_actualizar {
    display: flex;
    justify-content: space-around;
    padding: .5rem;
    flex-wrap: wrap;
    height: auto;
}

.btn_cotizacion{
    margin-top: 1rem;
    width: 100%;
    margin-bottom: 1rem;
}

.btn_nota_pedido{
    width: 100%;
}

#btn_nota_pedido_modal {
    background-color: blue;
}

.btn_nota_pedido input{
    width: 100%;
}

.btn_nota_pedido_cotizacion {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: .3rem;
/*    border: 1px solid red;*/
    font-size: 1.3rem;
    background-color: blue;
    color: white;
    border-radius: .5rem;
}

.btn_nota_pedido_cotizacion:hover {
    cursor: pointer;
}

.btn-deshabilitado {
    pointer-events: none;
    cursor: default;
    filter: brightness(0.7);
}
.btn_formulario_habilitado {
    height: 4rem;
    width: 48%;
    max-width: 18rem;
    border-radius: .5rem;
    background-color: var(--col_botones);
    color: white;
    transition: all.4s;
    border: none;
    padding: .5rem;
    white-space: normal;
    word-wrap: break-word;
    font-size: 1.3rem;
}

.btn_formulario_habilitado:hover {
    background-color: var(--col_hover_botones);
    cursor: pointer;
}


.btn_formulario_deshabilitado {
    height: 4rem;
    width: 48%;
    max-width: 18rem;
    border-radius: .5rem;
    background-color: #c9c9c9;
    color: white;
    transition: all.4s;
    border: none;
    padding: .5rem;
    white-space: normal;
    word-wrap: break-word;
    font-size: 1.3rem;
}

.btn_formulario_deshabilitado:hover {
    cursor: not-allowed;
}


/* *************************************** */
/* *************************************** */
/* Contenedor drag and drop Imagen IMAGEN USUARIO */
/* *************************************** */
/* *************************************** */
#conten_imagen_foto {
    margin: 0 auto;
    border: 2px solid #747474;
    display: flex;
    width: 15rem;
    height: 15rem;
    border-radius: 1rem;
    overflow: hidden;
}

@media (min-width: 1385px) {
    #conten_imagen_foto {
/*        border: 1px solid red;*/
        display: flex;
        width: 15rem;
        height: 15rem;
        border: 5px solid blue;
    }
}

.conten_foto_drop_area {
    margin: 0 auto;
/*    width: 100% !important;*/
/*    height: 100% !important;*/
    width: 15rem;
    height: 15rem;
/*    margin-top: -1rem;*/
/*    margin-left: 1rem*/
/*    max-height: 18rem;*/
/*    padding: .1rem;*/
    display: flex;
/*
    justify-content: center;
    align-items: center;
*/
    cursor: pointer;
    color: #cccccc;
    border: .1rem solid #ddd;
    border-radius: 1rem;
/*    border: 1px solid blue;*/
}

.conten_foto_drop_area:hover > #icono_quitar_imagen_usuario {
    opacity: 1;
    z-index: 1;
}

#icono_quitar_imagen_usuario {
    color: #e20000;
    position: absolute;
    right: 2rem;
    top: 2rem;
    font-size: 3rem;
    opacity: 0;
    transition: all .4s;
    z-index: 1;
}

#icono_quitar_imagen_usuario:hover {
    transform: scale(1.2);
    color: #e20000;
    z-index: 1;
}


.conten_foto_drop_area.active {
    border: .5rem solid #cccccc;
    border-radius: 1rem;
}


.icono_agregar_imagen_usuario {
    font-size: 5rem !important;   
    color: #d6d6d6 !important;
    transition: all .4s !important;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 1rem;
    opacity: 0;
    margin-top: -.5rem;
}

.conten_foto_drop_area:hover > .icono_agregar_imagen_usuario {
    opacity: 1;
    background-color: rgba(0, 0, 0, 0.4);
    border-radius: 20rem;
    width: 15rem;
    height: 15rem;
}

/*
.icono_agregar_imagen_personal {
    font-size: 5rem !important;   
    color: #d6d6d6 !important;
    transition: all .4s !important;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 1rem;
    opacity: 0;
}

.conten_foto_drop_area_personal:hover > .icono_agregar_imagen_personal {
    opacity: 1;
    background-color: rgba(0, 0, 0, 0.4);
}
*/

#conten_txt_arrastre_imagen {
    margin: 0 auto;
    text-align: justify;
    min-width: 16rem;
    max-width: 16rem;
}

#lbl_imagen_foto_1 {
    margin: 0 auto;
    font-size: 1.1rem;
    color: #888888;
    cursor: pointer;
}

#lbl_imagen_foto_2 {
    margin: 0 auto;
    font-size: 1.1rem;
    font-weight: 700;
    color: black;
    cursor: pointer;
}

.conten_foto_drop_area h2 {
    font-size: 2.4rem;
    font-weight: 500;
    color: #000;
}

.conten_foto_drop_area span {
    font-size: 2.5rem;
    color: #000000;
    font-weight: 300;
}


.btn_subir_imagen_foto {
    margin: 0 auto;
    padding: .5rem 1.5rem;
    font-size: 1.3rem;
    border: 0;
    outline: none;
    background-color: #5721d3;
    color: white;
    border-radius: .5rem;
    cursor: pointer;
    margin-top: .5rem;
}

.contendor_archivo {
    display: flex;
    align-items: center;
    padding: 1rem;
    border: 1px solid #ddd;
}

#conten_vista_previa_foto {
    border: none;
    height: 100%;
    width: auto;
    position: absolute;
    border-radius: .5rem;
}

.status-text {
    padding: 0 10px;
}

.success {
    color: green;
}

.failure {
    color: red;
}




/* ################################### */
/* ################################### */
/* The switch - the box around the slider */
/* ################################### */
/* ################################### */
.switch {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 30px;
}

/* Hide default HTML checkbox */
.varchkpersonalizado {
    opacity: 0;
    width: 0;
    height: 0;
}

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

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

.varchkpersonalizado:checked + .slider {
    background-color: var(--color-boton-switch);
}

.varchkpersonalizado:focus + .slider {
    box-shadow: 0 0 1px var(--color-boton-switch);
}

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

/* Rounded sliders */
.slider.round {
    border-radius: 34px;
}

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


/* Estilo paneles con pestañas */
.conten_panel_pestana {
/*    border: 1px solid red;    */
    width: 100%;
    height: 100%;
    margin-top: 1rem;
}

.conten_pestanas {
    border: 1px solid #e5e5e5;    
    height: auto;
    display: flex;
    flex-wrap: wrap;
    border-radius: .4rem;
    padding: .1rem;
}

@media (min-width: 768px) {
    .conten_pestanas {
/*        border: 1px solid blue;    */
/*        height: 4rem;*/
/*        min-height: 4rem;*/
        display: flex;
        flex-wrap: wrap;
    }
}

.conten_crear_nota_pedido,
.conten_crear_cotizacion {
    position: absolute;
    display: flex;
    justify-content: center;
    align-content: center;
    right: 1rem;
}

#btn_crear_nota_pedido,
#btn_ver_nota_pedido,
#btn_ver_cotizacion {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 1rem;
    border: 1px solid limegreen;
    background-color: limegreen;
    color: #fafafa;
    border-radius: .4rem;
    transition: all .4s;
    font-size: 1.3rem;
/*    display: none;*/
}

#btn_crear_nota_pedido:hover,
#btn_ver_nota_pedido:hover,
#btn_ver_cotizacion {
    cursor: pointer;
    background-color: darkcyan;
}

.pestana_panel {
    border: 1px solid var(--col_bordes);
    height: 100%;
    width: auto;
    border-top-left-radius: 1rem;
    border-top-right-radius: 1rem;
    z-index: 1;
}

@media (min-width: 768px) {
    .pestana_panel {
        border: 1px solid var(--col_bordes);
        height: 100%;
        width: auto;
        border-top-left-radius: 1rem;
        border-top-right-radius: 1rem;
    }
}

.lbl_pestana {
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    height: 100%;
    font-size: 1.2rem;
    border-top-left-radius: 1rem;
    border-top-right-radius: 1rem;
    transition: all .4s;
    padding: 1rem 1rem;
}

.lbl_pestana {
    cursor: pointer;
}

/* #pestana_panel_1 {
    background-color: #EE5601;
    color: white;
}

#pestana_panel_2 {
    background-color: white;
    color: black;
}

#pestana_panel_3 {
    background-color: white;
    color: black;
}

#pestana_panel_4 {
    background-color: white;
    color: black;
} */

div.pestana_panel label{
    background-color: white;
    color: black;
}

.conten_panel_detalle {
    border: 1px solid var(--col_bordes);
    min-height: 38rem;
    position: relative;
    border-radius: .5rem;
/*    background-color: #e5e5e5;*/
}

.detalle_panel {
    position: absolute;
    height: 100%;
    width: 100%;
    display: flex;
    justify-content: center;
    text-align: center;
    padding-right: 1rem;
    padding-left: 1rem;
}


#detalle_panel_1 {
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
    opacity: 1;
    transition: all .4s;
    border-radius: .5rem;
    z-index: 1;
    padding-top: .5rem;
}

#detalle_panel_2 {
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
    opacity: 0;
    transition: all .4s;
    border-radius: .5rem;
    z-index: 0;
    padding-top: .5rem;
}

#detalle_panel_3 {
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
    transition: all .4s;
    border-radius: .5rem;
    z-index: 0;
    padding-top: .5rem;
}


#detalle_panel_4 {
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
    transition: all .4s;
    border-radius: .5rem;
    z-index: 0;
    padding-top: .5rem;
}

#detalle_panel_5 {
    display: flex;
    justify-content: center;
    opacity: 0;
    transition: all .4s;
    border-radius: .5rem;
    z-index: 0;
    padding-top: .5rem;
}

#detalle_panel_6 {
    display: flex;
    justify-content: center;
    opacity: 0;
    transition: all .4s;
    border-radius: .5rem;
    padding-top: .5rem;
}

#detalle_panel_7 {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    opacity: 0;
    transition: all .4s;
    border-radius: .5rem;
    padding-top: .5rem;
}

#detalle_panel_8 {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    opacity: 0;
    transition: all .4s;
    border-radius: .5rem;
    padding-top: .5rem;
}


/* ############################################ */
/* # INICIO ESTILO COLORES DISPONIBLES MODELO # */
/* ############################################ */

#conten_img_360_ajax {
    border: 1px solid #d9d9d9;
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    max-height: 30rem;
    height: 100%;
/*    overflow-y: scroll;*/
    border-radius: .4rem;
    position: relative;
    background-color: white;
}

.varurlimgbase_360 {
/*    display: flex;*/
    height: 2rem;
    width: 7rem;
    border: 1px solid blue;
    font-size: 1rem;
}

#conten_color_disponible {
    /* border: 1px solid orange; */
    border: 1px solid var(--color_borde_campo_medio);
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    height: 4.5rem;
    padding: .2rem;
    border-radius: .4rem;
}

#conten_select_color {
/*    border: 1px solid black;*/
    display: flex;
    width: 20rem;
    min-width: 20rem;
/*    height: 4rem;*/
    position: relative;
}

.conten_color_rgb_select {
/*    border: 1px solid blue;*/
    width: 2.5rem;
    display: flex;
    justify-content: center;
    align-items: center;
}

.color_rgb_select {
    display: flex;
/*    justify-content: center;*/
/*    align-items: center;*/
    border: 1px solid #dddddd;
    width: 1.5rem;
    height: 1.5rem;
/*    border-radius: 10px;*/
}

#conten_boton_agregar_color {
/*    border: 1px solid black;   */
    display: flex;
}

#conten_boton_agregar_color input {
    border-style: none;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.2rem;
    height: 3.5rem;
    width: 6rem;
    background-color: #9b9b9b;
    color: white;
    border-radius: .4rem;
    transition: all 0.3s;
    margin-left: .1rem;
}

#conten_boton_agregar_color input:hover {
    background-color: #4d4d4d;
    cursor: pointer;
}

#conten_color_disp_modelo {
/*    border: 5px solid green;*/
    display: flex;
    flex-wrap: wrap;
/*    width: 15rem;*/
    width: 100%
}

.txt_col_disponible {
    display: flex;
    position: absolute;
    visibility: hidden;
    opacity: 0;
    width: 2rem;
}

/*
#conten_color_disp_modelo input[type=checkbox] {
    display: flex;
    width: 100%;
    justify-content: center;
    align-items: center;
    text-align: center;
    width: 2rem;
    border: 1px solid blue;
}
*/

.color_disp_modelo {
/*    border: 5px solid orange;*/
}

.select_color_disponible {
/*    border: 1px solid blue;    */
}

.color_disopnible {
/*    border: 1px solid red;    */
}

.label_color_disponible {
    display: flex;
    justify-content: center;
    align-items: center;
    word-break: break-all;
    width: 8rem;
/*    height: 3rem;*/
    padding: .1rem;
/*    height: 60%;*/
    border: 1px solid #d6d6d6;   
    font-size: .9rem;
    margin: .2rem;
    border-radius: .4rem;
    transition: all 0.3s;
}

.label_color_disponible:hover {
    border: 1px solid #8d8d8d;  
    cursor: pointer;
}

.conten_pestana_color_disp {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    position: absolute;
    height: 100%;
    background-color: white;
}

/* ######################################### */
/* # FIN ESTILO COLORES DISPONIBLES MODELO # */
/* ######################################### */


.conten_doc_pri {
    margin: 0 auto;
    width: 33.33%;
    height: 100%;
    border-radius: .5rem;
}

.conten_doc_pri label {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;   
    border-radius: .5rem;
}

.icono_buscar_cliente {
    position: absolute;
    right: .5rem;
    height: 3rem;
    font-size: 2rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    transition: all .3s;
}

.icono_buscar_cliente:hover {
    cursor: pointer;
    color: red;
    transform: scale(1.2);
}

#fecha_cotizacion {
    position: absolute;
    right: 1rem;
    font-size: 1.3rem;
    border: 1px solid #a5a5a5;
    border-radius: .4rem;
    padding: .5rem;
}

#conten_campo_ver_detalle_opc_despleg_docretoma {
    overflow-y: scroll;
}

.conten_item_doc_retoma {
    display: flex;   
    flex-wrap: wrap;
}

.conten_titulos_det_doc_retoma {
    width: 100%;
    display: flex;
}

.conten_detalle_det_doc_retoma {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
}

.content_linea_det_doc_retoma {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
}

.content_linea_det_doc_retoma:hover {
    cursor: pointer;
    background-color: aqua;
}

.col_1_det_doc_retoma {
    display: flex;
    align-items: center;
    width: 85%;
    border-bottom: 1px solid #EE5601;
    font-size: 1.3rem;
    padding: .3rem;
}

.col_2_det_doc_retoma {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 15%;
    border-bottom: 1px solid #EE5601;
    font-size: 1.3rem;
    padding: .3rem;
}

.chk_item_doc_retoma:hover {
    cursor: pointer;
}

.btn_oculto {
    display: none;
}

#contenedor_impresion {
    display: none;
}


/* Titulo del campo */
.lbl_tit_campo_fecha_fil_sel_mul {
    font-size: 1.3rem;
    font-weight: bold;
    position: absolute;
    margin-left: -1rem;
    margin-top: -3.2rem;
    color: black;
}

.lbl_tit_campo_fecha_fil_sel_mul_fecha {
    position: absolute;
    margin-top: -2rem;
    width: 20rem;
    font-size: 1.3rem;
    font-weight: bold;
}


.conten_campo_fil_fecha {
    border-radius: .4rem;
}

.conten_campo_fecha_fil_mul:nth-child(1) {
    border-bottom: 1px solid #c4c4c4;
    width: 100%;
    display: flex;
    justify-content: space-around;
    padding: .35rem;
}

.conten_campo_fecha_fil_mul:nth-child(2),
.conten_campo_fecha_fil_mul:nth-child(3),
.conten_campo_fecha_fil_mul:nth-child(4) {
    padding: 2rem .5rem .5rem .5rem;
    width: 100%;
    display: flex;
    justify-content: space-around;
}

.conten_campo_fecha_fil_mul:nth-child(3) {
    display: none;
}

.conten_campo_fecha_fil_mul:nth-child(4) {
    display: none;
}

.campo_fecha_fil_mul {
    border-radius: .5rem;
    display: flex;
    height: 3rem;
    min-width: 12rem;
}

.campo_fecha_fil_mul input {
    font-size: 1.2rem;
    display: flex;
    width: 100%;
}

.campo_fecha_fil_mul select {
    width: 100%;
    font-size: 1.3rem;
}

.texto_todos_campo_fecha {
    font-size: 1.3rem;
}

.tabla_manten_prep {
/*    border: 1px solid red;*/
    
}

.tabla_manten_prep thead tr td {
    height: 2rem !important;
}

.tabla_manten_prep tbody tr td {
    height: 1.5rem !important;
    text-align: center;
}

#btn_personal_asignado {
    margin: 0 auto;
    background-color: #1476d8;
    display: flex;
    width: 12rem;
    padding: .3rem;
    color: white;
    border-radius: .5rem;
}

#btn_personal_asignado:hover {
    background-color: #044a90;
    cursor: pointer;
}

#conten_con_financiamiento,
#conten_color_texto {
    position: relative;
}

#lblconfinanciamiento,
#lblcolortexto {
    display: flex;
    position: absolute;
    font-size: 1.2rem;
    margin-left: 1rem;
    left: 0;
    top: -.1rem;
    background-color: transparent;
}

#varidconfinanciamiento,
#varcolortexto {
    border: none;
    border: 1px solid var(--color_borde_campo_medio);
    border-radius: .4rem;
    height: 3.5rem;
    font-size: 1.1rem;
    width: 100%;
}



.circulo_usuario_x_sucursal {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #428bca;
    color: white;
/*    padding: .5rem;*/
    height: 2rem;
    width: 2rem;
    border-radius: 50%;
/*    border: 1px solid red;*/
}

/* ####################################### */
/* ###### Bloque temas ################### */
/* ####################################### */

.conten_bloque_tema {
    margin: 0 auto;
    margin-top: 3rem;
    display: flex;
    height: 80vh;
    overflow: scroll;
    border: 1px solid #e0e0e0;
}


.conten_opcion_color_web {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    justify-content: space-between;
    margin-top: 1rem;
/*    border: 3px solid #c4c4c4;*/
}


    .conten_opcion_color_web h3 {
        display: flex;
        justify-content: center;
        width: 100%;
        border: 1px solid #dedede;
    }

    .conten_opcion_color_web div {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        border: 1px solid #dedede;
        width: 50%;
    }

        .conten_opcion_color_web label {
            display: flex;
            width: 100%;
        }


        .conten_opcion_color_web input {
            display: flex;
            border: none;
            width: 10rem;
        }

        .conten_opcion_color_web input:hover {
            cursor: pointer;
        }


#frmImagenesWeb {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
}

@media (min-width: 700px) {
    #frmImagenesWeb {
        flex-wrap: nowrap;
    }
}

.ancho_color_item_web {
    width: 10rem;   
}

/* ------------------------------- */
.bloque_tema {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    border: 1px solid #acacac;
}

@media (min-width: 700px) {
    .bloque_tema {
        width: 33.33%;
    }
}

/* ------------------------------- */
.conten_tema {
    margin-top: 1rem;
    border: 1px solid #a5a5a5;   
}

/* ------------------------------- */
.t_menu_superior {
/*    border: 1px solid red;*/
    display: flex;
    width: 100%;
    height: 5rem;
/*    overflow: hidden;*/
}

    .t_menu_superior_div_1 {
/*        width: 100%;*/
        display: flex;
        justify-content: left;
        align-items: center;
        margin-left: 1rem;
/*        position: relative;*/
    /*    overflow: hidden;*/
/*        border: 1px solid blue;*/
        
    }

        .t_menu_superior_div_1 img {
            display: flex;
            width: 6rem;
        }

    .t_menu_superior_div_2 {
        display: flex;
        justify-content: center;
        align-items: center;
        margin-left: 2rem;
    }

        .t_menu_superior_div_2 label {
            display: flex;
            padding: .3rem;
            font-size: .8rem;
        }

    .t_menu_superior_div_3 {
        display: flex;
        justify-content: center;
        align-items: center;
        margin-left: 1rem;
    }

        .t_menu_superior_div_3 img {
            display: flex;
            width: 1.5rem;
            margin-left: 1em;
        }

        
        
/* ------------------------------- */
.t_banner {
    display: flex;
/*    border: 1px solid blue;*/
    width: 100%;
    height: auto;
/*    overflow: hidden;*/
}

.t_banner_div_1 {
    width: 100%;
    display: flex;
    height: auto;
    position: relative;
/*    overflow: hidden;*/
/*    border: 1px solid red;*/
}

.t_banner_div_1 img {
    display: flex;
    width: 100%;
    height: auto;
}

.input_urlweb {
    display: flex;
    position: absolute;
/*    border: 4px solid red;*/
    z-index: 1000;
/*    margin-top: -2.5rem;*/
    font-size: 1.1rem;
/*    padding: 2px;*/
    width: 100%;
}

/* ------------------------------- */
.t_menu_marcas {
/*    border: 1px solid green;*/
    width: 100%;
/*    height: 2.3rem;*/
    position: relative;
/*    overflow: hidden;*/
}

.t_menu_marcas_div_1 {
    width: 100%;
/*    height: 50px;*/
/*    display: flex;*/
    position: relative;
/*    overflow: hidden;*/
}

.t_menu_marcas_div_1 img {
    width: 100%;
}

/* ------------------------------- */
.t_form_cotizar {
    width: 100%;
/*    height: 4.7rem;*/
    position: relative;
}

.t_form_cotizar_div_1 {
    width: 100%;
    display: flex;
    position: relative;
/*    overflow: hidden;*/
}

.t_form_cotizar_div_1 img {
    width: 100%;
}

/* ------------------------------- */
.t_fila_1 {
    width: 100%;
/*    height: 6.9rem;*/
    min-height: 5rem;
    display: flex;
    position: relative;
/*    overflow: hidden;*/
/*    border: 5px solid red;*/
}

.t_fila_1_div_1,
.t_fila_1_div_2 {
    width: 100%;
/*    overflow: hidden;*/
}

.t_fila_1_div_1 img,
.t_fila_1_div_2 img {
    width: 100%;
}

/* ------------------------------- */
.t_fila_2 {
/*    border: 1px solid gray;*/
    width: 100%;
    min-height: 5rem;
    display: flex;
    position: relative;
/*    overflow: hidden;*/
}

.t_fila_2_div_1 {
/*    border: 3px solid blue;*/
    width: 100%;
    
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
/*    overflow: hidden;*/
    
}


.t_fila_2_div_1 img {
    display: flex;
    
    width: 100%;

}

.t_fila_2_div_2 {
    width: 100%;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    
}


.t_fila_2_div_2 img {
/*    height: 85%;*/
/*    position: absolute;*/
/*    left: -3rem;*/
}

/* ------------------------------- */
.t_fila_3 {
    width: 100%;
    min-height: 5rem;
    display: flex;
    position: relative;
/*    overflow: hidden;*/
}

.t_fila_3_div_1 {
    width: 100%;
/*    overflow: hidden;*/
}

.t_fila_3_div_1 img {
    width: 100%;
}

.t_fila_3_div_2 {
    width: 100%;
/*    overflow: hidden;*/
}

.t_fila_3_div_2 img {
    width: 100%;
}

/* ------------------------------- */
.t_fila_4 {
    width: 100%;
    min-height: 5rem;
    display: flex;
    position: relative;
/*    overflow: hidden;*/
}

.t_fila_4_div_1 {
    width: 100%;
/*    overflow: hidden;*/
}

.t_fila_4_div_1 img {
    width: 100%;
}

.t_fila_4_div_2 {
    width: 100%;
/*    overflow: hidden;*/
}

.t_fila_4_div_2 img {
    width: 100%;
}

/* ------------------------------- */
.t_pie {
    width: 100%;
/*    height: 4rem;*/
    position: relative;
/*    overflow: hidden;*/
    
}

.t_pie_div_1 {
    display: flex;
    width: 100%;
/*    overflow: hidden;*/
}

.t_pie_div_1 img {
    width: 100%;
}

/* ####################################### */
/* ###### Bloque Parametros Web ########## */
/* ####################################### */
.conten_param_web {
    margin: 0 auto;
    margin-top: 2rem;
    max-width: 60rem;
    border: 1px solid #a5a5a5;
    border-radius: .5rem;
    padding: 2rem;
}



.conten_sup_param_web_tit {

}

.conten_sup_param_web_tit label {
    display: flex;
    justify-content: center;
    font-weight: bold;
    padding: 1rem;
    font-size: 3rem;
    border-bottom: 3px solid var(--col_pri_tema);
}

.conten_sup_param_web_btn {
    margin-top: 1rem;
/*    border: 1px solid red;*/
    display: flex;
    justify-content: flex-end;
    padding: 1rem;
}

.conten_sup_param_web_btn label {
    display: flex;
    justify-content: center;
    font-weight: bold;
    padding: .5rem;
    width: 14rem;
    background-color: #20a720;
    color: white;
    border-radius: .5rem;
    font-size: 1.3rem;
}

.conten_sup_param_web_btn label:hover {
    background-color: #037603;
    cursor: pointer;
}

.conten_parametros_web {

}

.conten_parametro_web {
    display: flex;
    justify-content: space-between;
    padding: 1rem .5rem;
}

.conten_parametro_web label {
    display: flex;
    width: 22rem;
    font-size: 1.2rem;
    padding: .5rem;
    font-weight: bold;
}

.conten_parametro_web input {
/*    border: 5px solid black;*/
    display: flex;
    width: 22rem;
    font-size: 1.2rem;
    padding: .5rem;
    border: none;
    border: 1px solid #cccccc;
    border-radius: .5rem;
}

.conten_parametro_web select {
/*    border: 5px solid black;*/
    display: flex;
    width: 22rem;
    font-size: 1.2rem;
    padding: .5rem;
    border: none;
    border: 1px solid #cccccc;
    border-radius: .5rem;
}

/* ################################### */
/* ###### imagenes slider ########## */
/* ################################### */
.conten_slider_tema {
/*    margin: 0 auto;*/
/*    margin-left: 3rem;*/
    padding: 15px;
    margin-top: 2rem;
    width: 100%;
    position: relative;
    border: 1px solid #b1b1b1;
}

@media (min-width: 700px) {
    .conten_slider_tema {
        margin-top: 0rem;
        width: 33.33%;
        margin-left: 3rem;
    }
}

.conten_slider_tema label {
    font-size: 1.5rem;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: .5rem;
/*    border: 1px solid blue;*/
}

.slider_tema {
    margin-top: 1rem;
    border: 1px solid #c8ccc8;
/*    width: 40rem;*/
/*    height: 94%;*/
}

.conten_img_slider {
    border: 1px solid #c8ccc8;
    min-height: 6rem;
    position: relative;
}



/* ################################### */
/* ###### imagenes usados ########## */
/* ################################### */
.conten_usado_tema {
/*    margin: 0 auto;*/
/*    margin-left: 3rem;*/
    padding: 15px;
    margin-top: 2rem;
    width: 100%;
    position: relative;
    border: 1px solid #b1b1b1;
    align-self: flex-start;
}

@media (min-width: 700px) {
    .conten_usado_tema {
        margin-top: 0rem;
        width: 33.33%;
        margin-left: 3rem;
    }
}

.usado_tema {
/*    display: flex;*/
    position: relative;
}


/* ################################### */
/* ###### Carga de archivo excel ########## */
/* ################################### */
.tabla_update {
/*    margin-top: 3rem;*/
    border: 1px solid #959595;
    border-spacing: 0px;
    padding: 0;
    width: 100%;
}

.tabla_update thead tr td {
    padding: .5rem;
    border: 1px solid #d0d0d0;
    font-size: 1.3rem;
    font-weight: bold;
    text-align: center;
    justify-content: center;
}

.tabla_update tbody tr td {
    padding: .5rem;
    border: 1px solid #d0d0d0;
    font-size: 1.2rem;
}

#conten_tabla_precios {
    display: flex;
/*    height: calc(100% - 20rem);*/
    overflow-y: scroll;
    border: 1px solid #cecece;
    border-radius: .5em;
    max-height: 50rem;
}

#conten_tabla_takata {
    display: flex;
/*    height: calc(100% - 20rem);*/
    overflow-y: scroll;
    border: 1px solid #cecece;
    border-radius: .5em;
}

#conten_titulos_precio {
    margin: 2rem;
/*    border: 1px solid red;*/
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    font-weight: lighter;
}

#conten_titulos_precio label,
#conten_titulos_takata label {
    display: flex;
    justify-content: center;
    width: 100%;
}

.conten_encabezado_importar_precios,
.conten_encabezado_importar_takata {
    margin: 0 auto;
/*    margin-top: 1rem;*/
/*    width: 50rem;*/
/*    border: 1px solid blue;*/
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}

#conten_lbl_cargar_excel_precio,
#conten_lbl_cargar_excel_takata {
    width: 100%;
}

#conten_lbl_cargar_excel_precio label,
#conten_lbl_cargar_excel_takata label {
    display: flex;
    
    justify-content: center;
    color: #7c7c7c;
    font-size: 1.2rem;
}

.conten_btn_cargar_archivo_excel_precio,
.conten_btn_cargar_archivo_excel_takata {
    margin: 0 auto;
    width: 100%;;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px dashed gray;
    margin-bottom: 3rem;
}

#btnImportarPreciosExcel,
#btnImportarTakataExcel {
    display: flex;
    background-color: #0fbc00;
    color: white;
    padding: .2rem 1rem;
    border-radius: .5rem;
    transition: all .3s;
}

#btnImportarPreciosExcel:hover,
#btnImportarTakataExcel:hover {
    cursor: pointer;
    background-color: green;
}

#btnImportarPreciosExcel {
    visibility: hidden;
}

/* ################################ */
/* Estilo celdas formulario color */
/* ################################ */
.conten_celda_color {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    width: 100%;
}

.conten_celda_color div {
    margin: 0 auto;
    height: 1.2rem; 
    width: 3rem; 
    border-radius: .3rem;
    border: 1px solid black;
}

.conten_celda_color label {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
}

.icono_entrada {
    color: red;
}

.icono_salida {
    color: green;
}

.icono_traspaso {
    color: orange;    
}

.icono_actualizar_combo {
    color: #9d9d9d;
    font-size: 1.4rem;
    width: 1.5rem;
    margin-left: .5rem;
    margin-right: .5rem;
    transition: all 0.4s;
}

.icono_actualizar_combo:hover {
    cursor: pointer;
    color: black;
}

.estado_inventario {
/*    border: 5px solid red;*/
    display: flex;
    justify-content: center;
    align-items: center;
}

.icono_stock_x_vencer_inactivo {
    display: none;
}

.icono_stock_x_vencer {
    display: flex;
/*    color: red;*/
    font-size: 2rem;
    transition: all .2s;
}

.icono_stock_x_vencer:hover {
    cursor: pointer;
    color: blue;
    font-size: 2.5rem;
}


@-webkit-keyframes blink {
    0% { color: rgba(255,0,0,0.0.8); }
    50% { color: rgba(255,0,0,0); }
    100% { color: rgba(255,0,0,0.8); }
}

@keyframes blink {
    0% { color: rgba(255,0,0,0.8); }
    50% { color: rgba(255,0,0,0); }
    100% { color: rgba(255,0,0,0.8); }
}

.animate { 
    /* height: 100px;  */
    /* width: 100px; */
    color: rgba(255,0,0,1);
}

.animate {
    -webkit-animation-direction: normal;
    -webkit-animation-duration: 1s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-name: blink;
    -webkit-animation-timing-function: ease;   
    animation-direction: normal;
    animation-duration: 1s;
    animation-iteration-count: infinite;
    animation-name: blink;
    animation-timing-function: ease;       
}

.ver_detalle_vencido {
    font-size: 2rem;
    color: orange;
    transition: all .2s;
}

.ver_detalle_vencido:hover {
    cursor: pointer;
    color: blue;
}

.icono_warning_stock_minimo {
    color: red;
    font-size: 1rem;
    margin-left: .5rem;
}

/* ################################## */
/* ################################## */
/* Seccion la seccion contacto        */
/* ################################## */
/* ################################## */
#conten_contacto_cotiza {
    width: 100%;
/*    background-color: #0080ff;*/
/*    padding: 1rem;*/
}

@media (min-width: 700px) {
    #conten_contacto_cotiza {
        width: 100%;
        display: flex;
/*        background-color: #0080ff;*/
/*        padding: 1rem;*/
    }
}

#conten_contacto_cotiza_izq {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

@media (min-width: 700px) {
    #conten_contacto_cotiza_izq {
        width: 25%;
        display: flex;
        justify-content: center;
        align-items: center;
    }
}

#conten_texto_cotizacion {
/*    padding: 1.5rem;*/
}

@media (min-width: 700px) {
    #conten_texto_cotizacion {
/*        padding: 3rem;*/
    }
}

#conten_texto_cotizacion h2 {
    font-weight: 300;
    color: white;
    font-size: .5rem;
    text-align: center;
}

@media (min-width: 700px) {
    #conten_texto_cotizacion h2 {
        font-weight: 300;
        color: white;
        font-size: 1.4rem;
    }
}

#conten_texto_cotizacion p {
    color: white;
    font-weight: 300;
    margin-top: 2rem;
    font-size: .5rem;
    padding: .2rem;
}

@media (min-width: 700px) {
    #conten_texto_cotizacion p {
        color: white;
        font-weight: 300;
        margin-top: 2rem;
        font-size: .7rem;
    }
}


#conten_contacto_cotiza_der {
    width: 100%;    
}


@media (min-width: 700px) {
    #conten_contacto_cotiza_der {
    /*    border: 1px solid green;*/
        width: 75%;
    }
}

#conten_contacto_cotiza_der form {
    
}

#conten_contacto_cotiza_der form div {
    display: flex;
    width: 100%;
}

/* ************************* */
/* Seccion linea 1 */
#conten_form_contacto_l1 {
    display: flex;
    width: 100%;
    flex-wrap: wrap;
    padding: 0rem 0rem;
}

@media (min-width: 700px) {
    #conten_form_contacto_l1 {
        display: flex;
        width: 100%;
        flex-wrap: nowrap;
        padding: 0rem 0rem;
    }
}

#conten_form_contacto_l1 div {
    display: flex;
    padding: .5rem;
    width: 100%;
    position: relative;
}

@media (min-width: 700px) {
    #conten_form_contacto_l1 div {
        display: flex;
        width: 100%;
        padding: .5rem;
        position: relative;
    }
}

#conten_form_contacto_l1 div input {
    padding: .2rem .2rem;
    border: none;
    display: flex;
    width: 100%;
    border-radius: .4rem;
    font-size: .5rem;
    text-transform: uppercase;
    height: 1.5rem;
}

#conten_form_contacto_l1 div label {
    padding: .5rem;
    display: flex;
    width: 100%;
    position: absolute;
    border-radius: .4rem;
}

/* Seccion linea 2 */
#conten_form_contacto_l2 {
    display: flex;
    width: 100%;
    flex-wrap: wrap;
    padding: 0rem 0rem;
}

@media (min-width: 700px) {
    #conten_form_contacto_l2 {
        display: flex;
        width: 100%;
        flex-wrap: nowrap;
        padding: 0rem 0rem;
    }
}

#conten_form_contacto_l2 div {
    display: flex;
    width: 100%;
    padding: .2rem .5rem;
    position: relative;
}

#conten_form_contacto_l2 div input {
    padding: .2rem;
    border: none;
    display: flex;
    width: 100%;
    border-radius: .4rem;
    font-size: .5rem;
    text-transform: uppercase;
    height: 1.5rem;
}

#conten_form_contacto_l2 div select {
    padding: .2rem;
    border: none;
    display: flex;
    width: 100%;
    border-radius: .4rem;
    font-size: .5rem;
    color: gray;
    text-transform: uppercase;
    height: 1.5rem;
}

#conten_form_contacto_l2 div label {
    
    padding: .2rem;
    display: flex;
    width: 100%;
    position: absolute;
    border-radius: .4rem;
}


/* Seccion linea 3 */
#conten_form_contacto_l3 {
    display: flex;
    width: 100%;
    padding: 0rem 0rem;
}

@media (min-width: 700px) {
    #conten_form_contacto_l3 {
        display: flex;
        width: 100%;
        flex-wrap: nowrap;
        padding: 0rem 0rem;
    }
}

#conten_form_contacto_l3 div {
    display: flex;
    width: 100%;
    padding: .5rem .5rem;
    position: relative;
}

#conten_form_contacto_l3 div textarea {
    padding: .2rem;
    border: none;
    display: flex;
    width: 100%;
    max-height: 3rem;
    border-radius: .4rem;
    font-size: .5rem;
    text-transform: uppercase;
}

#conten_form_contacto_l3 div label {
    padding: .2rem;
    display: flex;
    width: 100%;
    position: absolute;
    border-radius: .4rem;
}

#conten_boton_contacto {
    padding: .2rem;
    width: 100%;   
    display: flex;
    justify-content: center;
    align-items: center;
}


#conten_boton_contacto label {
    color: white;
    padding: .4rem;
    display: flex;
    justify-content: center;
    width: 10rem;
    border: 1px solid white;
    font-size: 1.2rem;
    border-radius: .4rem;
}


.icono_campo_requerido {
/*    border: 1px solid red;*/
    position: absolute;
    top: 1rem;
    right: .8rem;
    color: red;
    font-size: .5rem;
/*    visibility: hidden;*/
    display: none;
/*    border: 1px solid red;*/
}

.icono_campo_requerido_frm {
    /*    border: 1px solid red;*/
    position: absolute;
    top: 3rem;
    right: .8rem;
    color: red;
    font-size: .5rem;
/*    visibility: hidden;*/
    display: none;
/*    border: 1px solid red;*/
}

/*
.lbl_campo_requerido {
    border: 1px solid red;
    position: absolute;
    margin-top: 2.5rem;
    color: red;
    font-size: 1.2rem;
}
*/

#identificador_campo {
    color: red;
    font-size: .5rem;
    margin-left: .5rem;
}

#identificador_campo label {
    font-size: .5rem;
    color: white;
    margin-left: .5rem;
}

/* ################################## */
/* ################################## */
/* Seccion de la seccion pie pagina   */
/* ################################## */
/* ################################## */
#conten_pie_pagina_principal {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
/*    background-color: #0080ff;*/
    font-size: .5rem;
}

@media (min-width: 700px) {
    #conten_pie_pagina_principal {
        display: flex;
        flex-wrap: nowrap;
        width: 100%;
/*        background-color: #0080ff;*/
        font-size: .5rem;
    }
}

#conten_pie_pagina_principal nav ul li {
    list-style: none;
    padding: .3rem;
    color: white;
}

#conten_col1_pie {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 3rem;
}

@media (min-width: 700px) {
    #conten_col1_pie {
        margin-top: 0rem;
        min-width: 31%;
        display: flex;
        justify-content: center;
        align-items: center;
    }
}

#conten_col1_pie img {
    max-width: 40%;
}

@media (min-width: 700px) {
    #conten_col1_pie img {
        max-width: 70%;
    }
}

#conten_col2_pie a,
#conten_col3_pie a, 
#conten_col4_pie a {
    text-decoration: none;
/*    color: white;*/
}

#conten_col2_pie {
    font-size: .8rem;
    padding: .5rem;
    width: 33.33%;
}

@media (min-width: 700px) {
    #conten_col2_pie {
        font-size: .8rem;
        padding: .5rem;
        min-width: 23%;
    }
}

#conten_col3_pie {
    font-size: .8rem;
    padding: .5rem;
    width: 33.33%;
}

@media (min-width: 700px) {
    #conten_col3_pie {
        font-size: .8rem;
        padding: .5rem;
        min-width: 23%;
    }
}

@media (min-width: 700px) {
    #conten_col3_pie {
        font-size: .8rem;
        padding: .5rem;
        min-width: 23%;
    }
}

#conten_col4_pie {
    font-size: .8rem;
    padding: .5rem;
    width: 33.33%;
}

@media (min-width: 700px) {
    #conten_col4_pie {
        font-size: .8rem;
        padding: .5rem;
        min-width: 23%;
    }
}

/* ########################### */
/* Configuracion de colores    */
/* ########################### */
.conten_color_item_web {
    display: flex;
    position: absolute;
    margin-left: -1.6rem;
}

.conten_color_item_web input {
    width: 1.5rem;
    max-height: 1.5rem;
    padding: 0;
    border: 1px solid #e8e8e8;
    border-radius: 5px;
}

.conten_color_item_web input:hover {
    cursor: pointer;
}

input[type="color"]::-moz-color-swatch {
    border: none;
    border-radius: 5px; 
    max-height: 1rem;
}

input[type="color"]::-webkit-color-swatch-wrapper {
    padding: 0;
    border-radius: 5px;
    max-height: 1.5rem;
}

input[type="color"]::-webkit-color-swatch {
    border: none;
    border-radius: 5px;
    max-height: 1.5rem;
}


/*
input[type="color"] {
  border-radius: 5px;
  padding: 0;
  border: 1px solid #DDD;
}
*/

/* **************************** */
/* **************************** */
/* Estilo modulo copiar version */
/* **************************** */
/* **************************** */
#conten_mensaje_info_global {
    position: absolute;
    right: 2rem;
    z-index: 100;
    width: 40rem;
    max-width: 90%;
}

#conten_global_copiar_version {
    margin: 0 auto;
    margin-top: 20px;
    display: flex;
}

.conten_copiar_version {
    display: flex;
    flex-wrap: wrap;
    width: 25%;
}

.conten_sel_copiar_version {
    display: flex;
    width: 100%;
    
}

.select_copiar_version {
    display: flex;
    width: 100%;
}

.conten_img_copiar_version {
    border: 1px solid #dbdbdb;
    display: flex;
    width: 100%;
    height: 130px;
    border-radius: 4px;
    padding: 5px;
}

.img_copiar_version {
    margin: 0 auto;
    display: flex;
    height: auto;
    max-width: 100%;
}

#conten_nueva_version {
    margin-top: 1rem;
    border: 1px solid #e6e6e6;
    display: flex;
    flex-wrap: wrap;
    border-radius: .5rem;
    padding: .5rem;
}

#conten_datos_version_actual {
/*    border: 1px solid blue;*/
    display: flex;
    width: 100%;
}

#conten_caracteristicas_version {
    border: 1px solid #808080;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    width: 100%;
    padding: .5rem;
    margin-top: 1rem;
    border-radius: .5rem;
    max-height: 20rem;
    overflow-y: scroll;
}

.titulo_car_version {
    display: flex;
    justify-content: center;
    width: 100%;
    font-size: 1rem;
    font-weight: bold;
}

.fila_caracteristicas_version_actual {
    display: flex;
    height: 2.5rem;
    width: 100%;
}

.col_conten_tipo_caracteristica {
    display: flex;
/*    justify-content: center;*/
    align-items: center;
    width: 30%;
    border-bottom: 1px solid #d3d3d3;
    font-size: 1rem;
    padding: .3rem;
}

.col_conten_caracteristica {
    display: flex;
    align-items: center;
    width: 50%;
    border-bottom: 1px solid #d3d3d3;
    font-size: 1rem;
    padding: .3rem;
}

.col_conten_valor {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    width: 20%;
    border-bottom: 1px solid #d3d3d3;
    font-size: 1rem;
    padding: .3rem;
}

.col_conten_valor input {
    display: flex;
    text-align: center;
    width: 100%;
    height: 100%;
    padding: .2rem .5em;
    border: 1px solid #d9d9d9;
}

#conten_datos_version_nueva {
    display: flex;
    justify-content: space-between;
    align-content: center;
    align-items: center;
    width: 100%;
    margin-top: 1rem;
    border: 1px solid #808080;
    padding: 1rem;
    border-radius: .5rem;
    
}

    .datos_version_nueva {
        display: flex;
        flex-wrap: wrap;
        width: 49%;
/*        background-color: #0259be;*/
        padding: 1rem;
        border: 1px solid #bababa;
        color: #c4c4c4;
    }

    .datos_version_nueva {
        background-color: #0259be;
        color: white;
    }

    .datos_version_nueva:nth-child(2) {
        background-color: #9b9b9b;
        color: white;
    }

        .conten_datos_version_nueva_sup {
            display: flex;
            width: 100%;
/*            height: 3rem;*/
            padding: .3rem;
        }

            .rb_tipo_version {
                display: flex;
                border: 1px solid red;
            }

            .lbl_titulo_tipo_version {
                display: flex;
                margin-left: .5rem;
    /*            border: 1px solid orange;*/
            }



        

/*
            .datos_version_nueva input {
                display: flex;
                border: 1px solid red;
                width: 100%;
                margin-left: .5rem;
                padding: .5rem;
                font-size: 1.1rem;
                text-transform: uppercase;
            }
*/

        
        .conten_datos_version_nueva_inf {
            display: flex;
            flex-wrap: wrap;
            width: 100%;
            padding: .3rem;
        }
        
        /*
            .datos_version_nueva label:nth-child(1) {
                display: flex;
                width: 100%;
                color: #bebebe;
                font-size: 1.2rem;
            }
        */

        .conten_texto_version {
            display: flex;
            width: 100%;
/*            border: 5px solid red;*/
        }

            .input_texto_version {
                display: flex;
                width: 100%;
                padding: .6rem;
/*                font-size: 2.4rem;*/
            }


        .btn_crear_nueva_version {
            display: flex;
            margin-top: .5rem;
/*            margin-left: .5rem;*/
        /*    border: 1px solid black;*/
            padding: .5rem 2rem;
            background-color: #ff1b1b;
            border-radius: .5rem;
            transition: all .4s;
        }

        .btn_crear_nueva_version:hover {
            background-color: #a50303;
            cursor: pointer;
        }

        .btn_crear_nueva_version_bloqueado {
            display: flex;
            margin-top: .5rem;
/*            margin-left: .5rem;*/
        /*    border: 1px solid black;*/
            padding: .5rem 2rem;
            background-color: #a8a8a8;
            border-radius: .5rem;
            transition: all .4s;
        }






.conten_celda_color_pilot {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    width: 100%;
}

.conten_celda_color_pilot div {
    display: flex;
/*    border: 1px solid red;*/
    height: 1.2rem;
    width: 1.2rem;
    margin-right: .5rem;
    border-radius: 20rem;
}

.conten_frm_bloque_100_usados {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 100%;
    height: 20rem;
    border: 1px solid #d1d1d1;
    margin-top: 3rem;
    border-radius: .4rem;
}

.conten_frm_bloque_100_usados label {
    display: flex;
    position: absolute;
    margin-top: -2rem;
    font-size: 1.4rem;
    width: 100%;
}

.conte_campo_img_usados {
    display: flex;
    position: relative;
    width: 25%;
    max-width: 30rem;
    height: 100%;
    max-height: 20rem;
    padding: 1rem;
/*    border: 1px solid blue;*/
}

.conte_campo_img_usados .conten_img_int {
    display: flex;
    position: relative;
    width: 100%;
    height: 100%;
/*    margin-top: 2rem;*/
/*    border: 5px solid red;*/
}

.conte_campo_img_usados .conten_img_ext {
    display: flex;
    position: relative;
    width: 100%;
    height: 100%;
    max-height: 20rem;
/*    margin-top: 4rem;*/
/*    border: 5px solid red;*/
}









/* ###################################################################### */
/* ###################################################################### */
/* ###################################################################### */
/* Estilo de la ventana del operador takata */
/* ###################################################################### */
/* ###################################################################### */
/* ###################################################################### */

#btn_vista_operador_sup_1_2_2_cerrar_takata {
    display: flex;
    align-self: flex-end;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 3rem;
    right: 2rem;
    width: 100%;
    height: 3rem;
    max-width: 19rem;
    background-color: #e26a6a;
    color: white;
    font-size: 1.4rem;
    display: none;
}

#btn_vista_operador_sup_1_2_2_cerrar_takata:hover {
    cursor: pointer;
    background-color: #c91e1e;
}

#btn_vista_operador_sup_1_2_2_cerrar_takata_deshabilitado {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 3rem;
    max-width: 19rem;
    background-color: #e26a6a;
    color: white;
    font-size: 1.4rem;
}

#btn_vista_operador_sup_1_2_2_cerrar_takata_deshabilitado:hover {
    background-color: #e26a6a;
    cursor: not-allowed;
}

#conten_global_pilot_cen_info_operador {
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    width: 100%;
    margin-top: 2rem;
    background-color: #f1f3fa;
/*    border: 5px solid green;*/
}

    #conten_filtros_takata {
        display: flex;
        justify-content: space-between;
/*        align-items: baseline;*/
        align-items: center;
/*        height: 4rem;*/
        width: 100%;
/*        border: 1px solid red;*/
        padding: .5rem;
    }

        #conten_filtros_takata_1 {
            display: flex;
            height: 3.5rem;
            position: relative;
    /*        align-items: baseline;*/
            
/*            border: 5px solid blue;*/
        }

            #conten_filtros_takata_1 #varbusqueda {
                display: flex;
                border: 1px solid #bcbcbc;
                font-size: 1.4rem;
            }

            #conten_filtros_takata_1 .lbl_btn_cerrar_busqueda_takata {
                display: flex;
                align-items: center;
                position: absolute;
/*                border: 1px solid red;*/
                height: 100%;
                font-size: 1.3rem;
                right: .5rem;
                color: #a0a0a0;
            }

            #conten_filtros_takata_1 .lbl_btn_cerrar_busqueda_takata:hover {
                cursor: pointer;
                color: #333333;
            }

        #conten_filtros_takata_2 {
            display: flex;
            align-items: center;
    /*        align-items: baseline;*/
/*            height: 4rem;*/
/*            width: 100%;*/
/*            border: 1px solid green;*/
        }

            #conten_filtros_takata_2 .icono_filtro_takata {
                display: flex;
/*                position: absolute;*/
                right: 10px;
                font-size: 2.7rem;
                margin-top: -0.4rem;
                color: #0087ea;
                transition: .2s;
/*                border: 1px solid red;*/
            }

            #conten_filtros_takata_2 .icono_filtro_takata:hover {
                cursor: pointer;
                color: #00497e;
            }

        
/*
        #tit_informe_takata {
            display: flex;
            width: 100%;
            border: 5px solid blue;
            padding: 1rem;
        }
*/

/*
        #conten_filtros_takata select {
            display: flex;
            margin-left: 1rem;
        }
*/

#conten_menu_carga_takata {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    border: 1px solid #d1d1d1;
    border-radius: 3px;
    display: none;
}

#conten_titulos_takata {
    margin: 2rem;
    width: 100%;
    border: 1px solid #d1d1d1;
    border-radius: 3px;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    font-weight: lighter;
    padding: 1rem;
    background-color: #efefef;
    font-weight: 600;
}

#content_btn_importar_takata_excel {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 25rem;
    height: 4rem;
}

#btnImportarTakata {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    width: 100%;
    background-color: #9b0b0b;
    color: white;
}

#btnImportarTakata:hover {
    cursor: pointer;
    background-color: #d61111;
}

#conten_registros_x_pagina {
    display: flex;
}

    .conten_caja_buscar_id input {
        display: flex;
        width: 0rem !important;
        padding: 0;
        margin: 0;
        display: none !important;
/*        visibility: hidden !important;*/
    }

    #varcantidadregistrosxpagina {
        display: flex;
/*        margin-left: 2rem;*/
        border: 1px solid #d9d9d9 !important;
        border-radius: .3rem;
        display: none !important;
    }

    #conten_caja_buscar {
        display: flex;
        position: relative;
/*        margin-left: 2rem;*/
/*        width: 40rem;*/
/*        border: 5px solid red;*/
        display: none;
    }

        .icono_busqueda_superior {
            display: flex;
            position: relative;
            right: 0rem;
            background-color: transparent !important;
        }

#conten_trabajar_informe_takata {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    width: 100%;
    height: calc(100vh - 200px);
/*    overflow: hidden;*/
/*    border: 5px solid orange;*/
}


#conten_trabajar_informe_takata_sup {
    display: flex;
    width: 100%;
    height: 100%;
    border: 1px solid #d0d0d0;
    border-radius: .2rem;
}


    #conten_lista_inf_takata {
        display: flex;
        flex-wrap: wrap;
        width: 100%;
        height: calc(100% - 50px);
/*        border: 5px solid blue;*/
    }

    #conten_info_takata {
        display: flex;
        flex-wrap: wrap;
        width: 100%;
        height: 100%;
/*        border: 5px solid green;*/
    }


    #conten_lista_inf_takata .contenedor_tabla::-webkit-scrollbar {
        width: 0px;
        height: 10px;
        display: none;
    
    }

    ::-webkit-scrollbar-track-piece:decrement {
        /*  background-clip: content-box;*/
        /*    border: solid 1px red;*/
    }

    ::-webkit-scrollbar-thumb {
    /*
        background-color: #d6d6d6;
        border-radius: 10px;
        cursor: pointer;
    */
    }

    .tabla_takata thead tr td {
        background-color: white;
    }

    .tabla_takata thead tr td:hover {
        color: black;
/*        background-color: white;*/
    }

    .tabla_takata tbody tr td {
        background-color: white;
    }

    .tabla_takata tbody tr td:hover {
        color: black;
/*        background-color: white;*/
    }

    #conten_lista_inf_takata .contenedor_tabla {
        border-right: 1px solid #d0d0d0;
        border-bottom: 1px solid #d0d0d0;
        width: 20%;
/*        height: calc(100% - 30px);*/
        height: 100%;
    }

        #conten_lista_inf_takata .contenedor_tabla thead {
/*            position: sticky;*/
        }

        #conten_lista_inf_takata .contenedor_tabla thead tr td {
            
            z-index: 1;
        }

        #conten_lista_inf_takata .contenedor_tabla tbody tr td {
            padding: 0;
            margin: 0;
            display: flex;
/*            justify-content: center;*/
            align-items: center;
            height: 100%;
            width: 100%;
/*            background-color: red;*/
        }

            .celda_takata_abierta {
                display: flex !important;
                align-items: center;
                padding: 1rem .3rem 1rem .5rem;
/*                height: 100% !important;*/
                height: 4rem;
                width: 100% !important;
/*                max-width: 20rem;*/
                font-size: 1.2rem;
                white-space: normal;
                color: #a8a8a8;
/*                background-color: white;*/
            }

            .celda_takata_abierta:hover {
                cursor: pointer;
                color: black;
                background-color: #eaeaea !important;
            }

            .celda_takata_en_gestion {
                display: flex !important;
                align-items: center;
                padding: 1rem .3rem 1rem .5rem;
/*                height: 100% !important;*/
                height: 4rem;
                width: 100% !important;
/*                max-width: 20rem;*/
                color: #1d1d1d !important;
                font-size: 1.2rem;
                white-space: normal;
/*                background-color: white;*/
            }

            .celda_takata_en_gestion:hover {
                cursor: pointer;
                color: black;
                background-color: #eaeaea !important;
            }

            .celda_takata_cerrada {
                display: flex !important;
                align-items: center;
                padding: 1rem .3rem 1rem .5rem;
/*                height: 100% !important;*/
                height: 4rem;
                width: 100% !important;
/*                max-width: 20rem;*/
                color: #acacac;
                font-size: 1.2rem;
                white-space: normal;
                color: #a8a8a8;
/*                background-color: white;*/
            }

            .celda_takata_cerrada:hover {
                cursor: pointer;
                color: black;
                background-color: #eaeaea !important;
            }

            .icono_tomar_takata_disponible {
                display: flex;
                justify-content: center;
/*                align-items: center;*/
                height: 1.5rem;
                width: 1.5em;
                font-size: 1.2rem;
                transition: all .3s;
                color: #0f740f;
/*                border: 1px solid red;*/
            }

            .icono_tomar_takata_disponible:hover {
                cursor: pointer;
                color: #025202;
                transform: scale(1.4);
            }

            .icono_tomar_takata_en_gestion {
                display: flex;
                justify-content: center;
/*                align-items: center;*/
                height: 1.5rem;
                width: 1.5em;
                font-size: 1.2rem;
                transition: all .3s;
                color: #969efd;
/*                border: 1px solid red;*/
            }

            .icono_tomar_takata_en_gestion:hover {
                cursor: pointer;
                color: #000b86;
                transform: scale(1.4);
            }

            .icono_tomar_takata_cerrado {
                display: flex;
                justify-content: center;
/*                align-items: center;*/
                height: 1.5rem;
                width: 1.5em;
                font-size: 1.2rem;
                transition: all .3s;
                color: #d8d5d5;
/*                border: 1px solid red;*/
            }

            .icono_tomar_takata_cerrado:hover {
                cursor: not-allowed;
            }

            .lbl_asignar_a_mi {
                display: flex;
                justify-content: center;
                align-items: center;
                position: absolute;
                right: 0;
                height: 2.5rem;
                padding: 0rem .5rem;
                margin-right: .2rem;
                background-color: #0098ac;
                color: white;
            }

            .lbl_asignar_a_mi:hover {
                cursor: pointer;
            }

            .lbl_yo {
                display: flex;
                justify-content: center;
                align-items: center;
                position: absolute;
                right: 0;
                height: 2.5rem;
                padding: 0rem .5rem;
                margin-right: .2rem;
                background-color: #bfbfbf;
                color: white;
            }

            .lbl_yo:hover {
/*                cursor: pointer;*/
            }

/*
            #conten_lista_inf_takata .contenedor_tabla tbody tr .celda_takata {
                display: flex;
                padding: 0;
                justify-content: center;
                align-items: center;
                height: 100%;
                width: 100%;
                background-color: red;
            }
*/

/* *********************************************** */
/* *********************************************** */
/* *********************************************** */
/* *********************************************** */
.contenido_bloqueado {
    display: flex;
    position: absolute;
    width: 100%;
    height: 300%;
    margin-left: 1.1rem;
    background-color: rgba(200, 200, 200, .3) !important;
    z-index: 1;
}

.contenido_desbloqueado {
    display: flex;
    position: absolute;
    width: 100%;
    height: 300%;
    margin-left: 1.1rem;
    background-color: rgba(200, 200, 200, .3) !important;
    opacity: 0;
    z-index: 0;
}

#lbl_desbloquear_contenido {
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    background-color: rgba(78, 78, 78, 1);
    width: 100%;
    height: 3rem;
    opacity: 1;
    color: #eaeaea;
}

#lbl_desbloquear_contenido:hover {
    cursor: pointer;
    background-color: rgb(42, 42, 42);
}

#conten_datos_cliente_takata {
    display: flex;
    justify-content: space-around;
    align-content: flex-start;
    flex-wrap: wrap;
/*    height: calc(100% - 30px);*/
    height: 100%;
    width: 80%;
    border: 1px solid #cccccc;
    overflow-y: scroll;
    padding-bottom: 3rem;
    position: relative;
}

    #conten_dato_takata_sup {
        display: flex;
        flex-wrap: wrap;
        width: 100%;
        padding: 0rem 0rem 1rem 0rem;
        border: 1px solid #d1d1d1;
        margin: .5rem;
        background-color: #f2f2f2;
    }

        #conten_estado_takata {
            display: flex;
            justify-content: flex-end;
            flex-wrap: wrap;
            width: 50%;
/*            border: 1px solid green;*/
        }

            #estado_takata {
                display: flex;
                justify-content: flex-end;
                width: 100%;
/*                border: 1px solid blue;*/
            }

                /* Titulo estado takata */
                #tit_estado_takata {
                    display: flex;
                    justify-content: flex-end;
                    align-items: flex-end;
                    width: 10rem;
                    font-size: 1.3rem;
                    padding-right: 1rem;
/*                    border: 1px solid red;*/
                }

                /* Nombre estado takata */
                #lbl_estado_takata {
                    display: flex;
                    align-items: flex-end;
/*                    border: 1px solid red;*/
                    width: 20rem;
                    font-size: 1.3rem;
                }

            /* Contenedor usuario asignado */
            #usuario_asignado_takata {
                display: flex;
                justify-content: flex-end;
                width: 100%;
            }

                /* Titulo usuario asignado */
                #tit_usuario_asignado_takata {
                    display: flex;
                    justify-content: flex-end;
                    align-items: flex-start;
                    width: 10rem;
                    font-size: 1.3rem;
                    padding-right: 1rem;
                }

                /* Nombre usuario asignado */
                #lbl_usuario_asignado_takata {
                    display: flex;
                    align-items: flex-start;
                    width: 20rem;
                    font-size: 1.3rem;
                }


        #conten_dato_takata_sup_1 {
            display: flex;
            justify-content: space-between;
            width: 50%;
        }

        #conten_dato_takata_sup_2 {
            display: flex;
            justify-content: space-between;
            width: 100%;
        }

    #conten_dato_takata_inf {
        display: flex;
        align-content: flex-start;
        width: 100%;
        height: auto;
    }

        #conten_dato_takata_inf_izq {
            display: flex;
            justify-content: space-around;
            align-content: flex-start;
            flex-wrap: wrap;
            width: 70%;
        }

            
/* ***************************** */
/* Estilo de los eventos TAKATA */
/* ***************************** */
        #conten_dato_takata_inf_der {
            display: flex;
            flex-wrap: wrap;
            align-content: flex-start;
            width: 29%;
            border: 1px solid #dbdbdb;
            margin-top: 1rem;
            padding: 1rem;
        }
        
            #dato_takata_inf_der {
                display: flex;
                flex-wrap: wrap;
                width: 100%;
            }

                #titulo_enventos_takata {
                    display: flex;
                    align-items: center;
                    padding: 1rem 1rem;
                    width: 100%;
                    font-size: 1.7rem;
                    font-weight: bold;
                    color: #0058bf;
                    border-bottom: 1px solid #d3d3d3;
                }
                    
                #iconos_estado_takata {
                    display: flex;
                }

                    .conten_icono_estado {
                        display: flex;
                        width: 3rem;
                        position: relative;
                    }

                    .contador_eventos_takata {
                        display: flex;
                        justify-content: center;
                        align-items: center;
                        position: absolute;
                        height: 1.3rem;
                        width: 1.3rem;
                        font-size: .8rem;
                        right: 1.2rem;
                        margin-top: -.5rem;
                        border-radius: 1rem;
                        background-color: #ff2727;
                        color: white;
                        opacity: .7
                    }

                #conten_eventos_takata {
                    display: flex;
                    flex-wrap: wrap;
                    width: 100%;
                    margin-top: 1rem;
                    padding: 1rem 0rem;
                    
                }

                    .conten_detalle_tarea_takata {
                        display: flex;
                        flex-wrap: wrap;
                        width: 100%;
                        border-left: 3px solid #4800d1;
                        background-color: #f6fbfc;
                        padding: .5rem .3rem;
                        margin-top: 1rem;
                    }

                        .conten_detalle_tarea_takata_sup {
                            display: flex;
                            justify-content: space-between;
                            width: 100%;
                        }

                            .conten_detalle_tarea_takata_sup_1 {
                                display: flex;
                                width: 50%;
                                font-size: 1.2rem;
                            }

                                .conten_detalle_tarea_takata_sup_1 span {
                                    display: flex;
                                    margin-right: .5rem;
                                    font-size: 1.5rem;
                                }

                            
                            .conten_detalle_tarea_takata_sup_2 {
                                display: flex;
                                justify-content: flex-end;
                                width: 50%;
                                font-size: 1.2rem;
                            }

                        .conten_detalle_tarea_takata_cen {
                            display: flex;
                            flex-wrap: wrap;
                            width: 100%;
                            margin-top: 1rem;
                        }

                            .lbl_detalle_tarea_takata_cen_1 {
                                display: flex;
                                width: 100%;
                                font-size: 1.2rem;
                                color: #808080;
                                margin-top: .2rem;
                            }

                            .lbl_detalle_tarea_takata_cen_2 {
                                display: flex;
                                width: 100%;
                                font-size: 1.2rem;
                                color: #808080;
                                margin-top: .2rem;
                            }

                            .lbl_detalle_tarea_takata_cen_3 {
                                display: flex;
                                width: 100%;
                                font-size: 1.2rem;
                                color: #808080;
                                margin-top: .2rem;
                            }

                        .conten_detalle_tarea_takata_inf {
                            display: flex;
                            justify-content: space-between;
                            width: 100%;
                            margin-top: 1rem;
                        }
                            
                            .conten_detalle_tarea_takata_inf_1 {
                                display: flex;
                                align-items: center;
                                width: 50%;
                                font-size: 1rem;
                            }

                            .conten_detalle_tarea_takata_inf_2 {
                                display: flex;
                                justify-content: flex-end;
                                width: 50%;
                                font-size: 1.2rem;
                            }
/* ********************************* */
/* FIN Estilo de los eventos TAKATA */
/* ******************************** */


    .conten_dato_takata {
        display: flex;
        flex-wrap: wrap;
        position: relative;
        width: 48%;
        margin: 1rem .5rem 0rem .5rem;
    }

        .conten_dato_takata label:nth-child(1) {
            display: flex;
            width: 100%;
            font-size: 1.3rem;
            font-weight: bold;
            padding: 0rem 0rem 0rem .5rem;
        }

        .conten_dato_takata label:nth-child(2) {
            display: flex;
            align-items: center;
            position: relative;
            padding: 0px 3px 0px 3px;
            width: 100%;
            border: 1px solid #dddddd;
            font-size: 1.2rem;
            height: 2.5rem;
            color: #505050;
            background-color: #fffcfc;
        }

        #conten_dato_takata_patente_final {
/*
                display: flex;
                position: relative;
                width: 100%;
*/
            }
    
                .span_copiar_dato_takata {
                    display: flex;
                    position: absolute;
/*                    border: 1px solid red;*/
                    right: .5rem;
                    top: 2rem;
                }

                .span_copiar_dato_takata:hover {
                    cursor: pointer;
                    transform: scale(1.1);
                }

        .icono_whatsapp_takata {
            display: flex;
            position: absolute;
            color: green;
/*            border: 1px solid red;*/
            right: 5px;
            font-size: 1.8rem;
        }

        .icono_whatsapp_takata:hover{
            cursor: pointer;
        }

        .icono_mail_takata {
            display: flex;
            position: absolute;
            color: #ff9857;
/*            border: 1px solid red;*/
            right: 5px;
            font-size: 1.8rem;
        }

        .icono_mail_takata:hover{
            cursor: pointer;
        }


/* *********************************************** */
/* *********************************************** */
/* *********************************************** */
/* *********************************************** */
/* *********************************************** */
#div_paginador_mantenedor {
    display: flex;
    height: auto !important;
    width: 100% !important;
/*    border: 1px solid red;*/
}


    

    #div_contenedor_pie_tabla_mantenedor {
        display: flex;
        width: 100%;
        background-color: transparent !important;
/*        height: 5rem;*/
/*        border: 1px solid black;*/
/*        background-color: red !important;*/
    }

        .div_pie_tabla_mantenedor {
            display: flex;
            width: 100%;
/*            background-color: blue !important;*/
/*            border: 1px solid blue;*/
        }

        #lbl_pie_tabla_der_mantenedor {
            display: flex;
            width: 100%;
/*            background-color: red !important;*/
/*            border: 1px solid orange;*/
            
        }

        .datos_paginados_dinamico {
            display: flex;
/*            justify-content: center;*/
            align-items: center;
            height: 100%;
            width: 100%;
/*            background-color: black !important;*/
/*            border: 1px solid green;*/
            color: #2c2c2c !important;
        }

            
            






#conten_trabajar_informe_takata_inf {
    display: flex;
    width: 100%;
/*    border: 5px solid red;*/
}



.contenedor_paginador_general_takata {
    display: flex;
    margin-top: -3rem;
/*    height: calc(100% - 130px);*/
/*    border: 5px solid red;*/
    visibility: visible !important;
}





    /*
        #conten_lista_inf_takata {
            display: flex;
            flex-wrap: wrap;
            border: 1px solid red;
        }

            .nombre_cliente_takata {
                display: flex;
                width: 100%;
                font-size: 1.2rem;
                padding: .2rem;
            }
    */

/* ################################################################################## */
/* ################################################################################## */
/* ################################################################################## */
/* Estilo Agenda Tareas */
/* ################################################################################## */
/* ################################################################################## */
/* ################################################################################## */
/*
#conten_agenda_tareas {
    display: flex;
    width: 100%;
    border: 5px solid red;
}

#conten_agenda {
    margin: 0 auto;
    max-width: 210px;
    height: 218px;
    overflow: hidden;
    background-color: white;
    border: 5px solid blue;
}

#conten_agenda_general {
    
}

.cmb_agenda {
    display: flex;
    border: none;
    padding: .3rem;
    font-size: 10px;
    height: 100%;
}
*/

#conten_agenda_responsivo {
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
    width: 100%;
    height: 100%;
    border: 1px solid #e0e0e0;
}

#conten_agenda_superior {
    display: flex;
    width: 100%;
    background-color: #4b8df8;
    color: white;
    border-radius: .5rem .5rem 0 0;
    padding: 3px;
    font-size: 1.3rem;
/*    border: 5px solid black;*/
}

    #conten_agenda_superior_izq {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 10%;
        height: 3rem;
        font-size: 1.2rem;
    /*    display: none;*/
/*        border: 5px solid blue;*/
    }

    #conten_agenda_superior_cen {
        display: flex;
        justify-content: space-around;
        align-items: center;
        width: 70%;
        height: 3rem;
    /*    display: none;*/
/*        border: 5px solid green;*/
    }

        #conten_agenda_sel_tipo_cen_sup {
            display: flex;
            justify-content: center;
            align-items: center;
            width: 40%;
            height: 100%;
/*            border: 1px solid red;*/
        }

            #conten_agenda_sel_tipo_cen_sup select {
                display: flex;
                width: 200px;
                border: none;
                height: 25px;
            }

        #conten_agenda_sel_colaborador_cen_sup {
            display: flex;
            justify-content: center;
            align-items: center;
            position: relative;
            width: 60%;
            height: 100%;
/*            border: 1px solid orange;*/
        }

            #conten_agenda_sel_colaborador_cen_sup select {
                display: flex;
                width: 200px;
                border: none;
                height: 25px;
            }

    /* ***************************** */
    /* Contenedor superior controles */
    /* ***************************** */
    #conten_agenda_superior_der {
        display: flex;
        width: 20%;
/*        height: 20px;*/
/*        border: 5px solid black;*/
    }

        #div_agenda_arriba_izq {
            display: flex;
            justify-content: center;
            align-items: center;
            width: 25%;
/*            border: 5px solid blue;*/
        }

            .doble_flecha_izq_agenda {
                display: flex;
                justify-content: center;
                align-items: center;
                width: 25px;
                height: 25px;
                color: white;
/*                padding: 1px 4px 1px 3px;*/
                border-radius: 50px;
                font-weight: bold;
                cursor: pointer;
                transition: all 0.2s;
                display: flex;
                align-items: center;
                font-size: 15px;
            }

            .flecha_izq_agenda {
                display: flex;
                justify-content: center;
                align-items: center;
                width: 25px;
                height: 25px;
                color: white;
/*                padding: 1px 4px 1px 4px;*/
                border-radius: 50px;
                margin-left: 5px;
                font-weight: bold;
                cursor: pointer;
                transition: all 0.2s;
                display: flex;
                font-size: 15px;
            }

        #div_agenda_arriba_cen {
            width: 50%;
            display: flex;
            justify-content: center;
            align-items: center;
            text-align: center;
            text-transform: capitalize;
            color: white !important;
            font-size: 14px;
/*            border: 5px solid yellow;*/
        }

        #div_agenda_arriba_der {
            width: 25%;
            display: flex;
            justify-content: center;
            align-items: center;
/*            border: 5px solid purple;*/
        }

            .doble_flecha_der_agenda {
                display: flex;
                justify-content: center;
                align-items: center;
                width: 25px;
                height: 25px;
/*                background-color: black;*/
                color: white;
/*                padding: 1px 3px 1px 3px;*/
                border-radius: 50px;
                margin-left: 5px;
                font-weight: bold;
                cursor: pointer;
                transition: all 0.2s;
                font-size: 15px;
            }

            .flecha_der_agenda {
                display: flex;
                justify-content: center;
                align-items: center;
                width: 25px;
                height: 25px;
                color: white;
/*                padding: 1px 4px 1px 4px;*/
                border-radius: 50px;
                font-weight: bold;
                cursor: pointer;
                transition: all 0.2as;
                font-size: 15px;
            }

            .doble_flecha_izq_agenda:hover,
            .flecha_izq_agenda:hover,
            .doble_flecha_der_agenda:hover,
            .flecha_der_agenda:hover {
                background-color: #969ea5;
                color: black;
            }
/* ***************************** */
/* ***************************** */
/* ***************************** */



#conten_agenda_central {
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
    width: 100%;
    height: calc(100% - 30px);
/*    border: 5px solid gray;*/
}

.fila_agenda {
    display: flex;
    width: 100%;
    min-height: 80px;
    height: 15%;
    /*    border: 1px solid red;*/
}

@media (min-height: 700px) {
    .fila_agenda {
/*        min-height: 90px;*/
    }
}

@media (min-height: 750px) {
    .fila_agenda {
/*        min-height: 100px;*/
    }
}

@media (min-height: 850px) {
    .fila_agenda {
/*        min-height: 110px;*/
    }
}



/* Titulos de columna nombre de dia */
#fila_agenda_1 {
    display: flex;
    width: 100%;
    height: 35px;
    min-height: 35px;
    max-height: 35px;
/*    border: 5px solid gray;*/
}

/* Ancho y alto de los titulos de los dias del calendario */
.div_enca_col_agenda {
    width: 100%;
    height: 35px;
    background-color: #faf5f5;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.3rem;
/*    font-weight: bold;*/
    border: 1px solid gray;
}

.div_enca_col_agenda:nth-child(1) {
    min-width: 30px;
    max-width: 30px;
}

#div_enca_col_agenda_1 {
    min-width: 30px;
    max-width: 30px;
/*    display: none;*/
}


#div_enca_fil_agenda_1 {
    min-width: 30px;
    max-width: 30px;
/*    display: none;*/
}

/* Encabezado de columnas semana del calendario */
.div_enca_fil_agenda {
    display: flex;
    width: 28px;
    color: white;
    justify-content: center;
    align-items: center;
    font-size: 9px;
    font-weight: normal;
    border: 1px solid #a7a7a7;
/*
    color: #008000;
    color: #800080;
    color: #0000ff;
    color: #eb6d00;
    color: #ff0000;
    color: #ffc0cb;
*/
    background-color: rgba(0, 8, 103, 0.74);
/*    border: 5px solid orange;*/
}

/* Todas las celdas de los dias del caledario */
.div_celda_agenda {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
/*    height: 40px;*/
    transition: all 0.3s;
    position: relative;
    border: 1px solid #bababa;
    overflow: hidden;
}

.modal_celda_agenda {
    position: absolute;
    height: 100%;
    width: 100%;
    background-color: #7b0098;
    top: -100%;
    overflow-y: scroll;
/*    display: none;*/
    z-index: 2;
}

.lbl_agenda_evento_nuevo_cortina {
    display: flex;
    width: 100%;
    padding: .1rem;
    color: white;
    font-weight: bold;
}

.divevento_conten_modal_cortina {
    text-indent: 1rem;
    letter-spacing: .1rem;
    color: white;
}

.modal_celda_agenda_sup {
    display: flex;
    justify-content: center;
    text-align: center;
/*    display: none;*/
}

.modal_celda_agenda_cen {
/*    display: none;*/
}

.modal_celda_agenda_inf {
    display: flex;
    justify-content: center;
    text-align: center;
/*    display: none;*/
}

/* ******************** */
/* Estilo dia anterior */
/* ******************** */
.conten_agenda_celda_dia_anterior {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    width: 100%;
    height: 100%;
}

.conten_agenda_celda_dia_anterior::-webkit-scrollbar {
/*    display: none;*/
}

.dias_agenda_mes_anterior {
    display: flex;
/*    justify-content: center;*/
/*    align-items: center;*/
    color: #9f9e9e;
    background-color: #ededed;
/*    border: 3px solid blue;*/
}

.dias_agenda_mes_anterior::-webkit-scrollbar {
/*    display: none;*/
}

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


/* ******************** */
/* Estilo dia actual */
/* ******************** */

.conten_agenda_celda_dia_actual {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    font-weight: bold;
}

.dias_agenda_mes_actual {
    color: #0b0b0b;
    background-color: white;
    
}
/* ******************** */
/* ******************** */


/* ******************** */
/* Estilo dia siguiente */
/* ******************** */
.conten_agenda_celda_dia_siguiente {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
}

.dias_agenda_mes_siguiente {
    color: #9f9e9e;
    background-color: #ededed;
    
}
/* ******************** */
/* ******************** */

/* ******************** */
.celda_agenda_numero_dia {
    display: flex;
    width: 100%;
    justify-content: flex-end;
    font-size: 12px;
    padding: 3px;
    transition: all 0.2s;
    font-weight: lighter;
}

.celda_agenda_numero_dia:hover {
    cursor: pointer;
}

/* Estilo dia seleccionado */
.dia_agenda_seleccionado {
    color: black;
    background-color: #6eb8ff;
    font-weight: bold;
}
/* ******************** */


.celda_agenda_sup {
    position: absolute;
    display: flex;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

    .margen_celda_agenda_sup {
        display: flex;
        width: 100%;
        height: 100%;
    }

        .celda_calendario_sup_izq {
            display: flex;
            width: 50%;
            display: none;
        }

        .celda_agenda_sup_der {
            display: flex;
            position: absolute;
            width: 100%;
            height: 100%;
        }

.celda_agenda_inf {
    width: 100%;
    height: 100%;
    padding: 20px 5px 5px 5px;
    overflow-y: scroll;
    z-index: 1;
}

    .div_evento_nuevo_agenda {
        display: flex;
        width: 100%;
    }

    .lbl_evento_nuevo_agenda {
        display: flex;
        width: 100%;
        color: black;
        padding: 2px;
        font-size: 1.2rem;
        font-weight: lighter;
        border-radius: 2px;
        margin-top: .1rem;
    }

    .lbl_evento_nuevo_agenda:hover {
        cursor: pointer;
    }

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


/*
@media (min-height:550px) {
    .celda_agenda_inf {
        height: 3rem;
        padding: 0px 15px 0px 5px;
    }
}

@media (min-height:700px) {
    .celda_agenda_inf {
        height: 4.5rem;
        padding: 0px 15px 0px 5px;
    }
}

@media (min-height:800px) {
    .celda_agenda_inf {
        height: 6rem;
        padding: 0px 15px 0px 5px;
    }
}
*/

#conten_agenda_inferior {
/*    display: none;*/
}

#lbl_agenda_hoy {
    color: #fff !important;
    text-decoration: none;
    width: 12rem;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    border: none;
    border-radius: .3rem;
    background-color: var(--main-color);
    transition: all .6s ease;
    cursor: pointer;
    height: 3rem;
    margin-top: 1rem;
    font-size: 1.4rem;
}

#lbl_agenda_hoy:hover {
    transition: all .5s;
    background: #45736a;
    cursor: pointer;
}

.div_agenda_evento_nuevo {
    border: 1px solid #d6d6d6;
    display: flex;
    justify-content: space-between;
    margin-top: .1rem;
    border-radius: 1rem;
    cursor: pointer;
}

.lbl_agenda_evento_nuevo {

    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: left;
    font-size: .9rem;
    color: #606060;
    border-radius: .5rem;
    padding-left: .3rem;
    padding-top: .1rem;
    padding-bottom: .1rem;
    cursor: pointer;
}

.span_agenda_close_evento {
    display: flex;
    flex-direction: column;
    justify-content: center;
    font-size: 1rem;
    color: #606060;
    width: 5%;
    border-radius: .7rem;
    margin-top: .1rem;
    margin-right: .5rem;
    cursor: pointer;
}


#conten_agenda_dia {
    width: 100%;
    display: flex;
    flex-wrap: nowrap;
}




/* ################################################################################## */
/* ################################################################################## */
/* ################################################################################## */
/* FIN Estilo Agenda Mensual */
/* ################################################################################## */
/* ################################################################################## */
/* ################################################################################## */

#conten_agenda_semanal {
    display: flex;
    flex-wrap: wrap;
    position: relative;
    width: 100%;
    height: 100%;
    
}

    #conten_enca_agenda_semanal {
        display: flex;
        width: 100%;
    }

        .fila_enca_agenda_semanal {
            display: flex;
            width: 100%;
            height: 40px;
        }

            .lbl_nombre_dia_semana {
                display: flex;
                justify-content: center;
                align-items: center;
                text-align: center;
                width: 14.2857%;
                height: 4rem;
                font-size: 1.3rem;
                border-top: 1px solid #989898;
                border-right: 1px solid #989898;
                padding: 3px;
            }

            .lbl_nombre_dia_semana:first-child {
                border-left: 1px solid #989898;
            }

    #conten_deta_agenda_semanal {
        display: flex;
        position: relative;
        width: 100%;
        height: 100%;
        overflow: hidden;
    }

        .fila_deta_agenda_semanal {
            display: flex;
            flex-wrap: wrap;
            align-content: flex-start;
            position: relative;
            width: 14.2857%;
            height: calc(100% - 40px);
            border-top: 1px solid #989898;
            border-right: 1px solid #989898;
            border-bottom: 1px solid #989898;
            padding: .1rem;
        }

        .fila_deta_agenda_semanal:first-child {
            border-left: 1px solid #989898;
        }

            .fila_deta_agenda_semanal label {
                display: flex;
                width: 100%;
                padding: 3px;
                font-size: 1.2rem;
            }

/* Ancho y alto de los titulos de los dias del calendario */
/*
.conten_tit_col_agenda_semanal {
    display: flex;
    background-color: #faf5f5;
    font-size: 10px;
    font-weight: bold;
    border: 5px solid gray;
}
*/

/* ################################################################################## */
/* ################################################################################## */
/* ################################################################################## */
/* FIN Estilo Agenda Semanal */
/* ################################################################################## */
/* ################################################################################## */
/* ################################################################################## */

#conten_agenda_diaria {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
/*    height: calc(100% - 50px);*/
    height: 100%;
    font-size: 1.3rem;
/*    border: 5px solid red;*/
}

    #conten_enca_agenda_diaria {
        display: flex;
        width: 100%;
        border-bottom: 1px solid #e0e0e0;
/*        border: 1px solid blue;*/
    }

        .fila_enca_agenda_diaria {
            width: 100%;
            display: flex;
/*            border: 5px solid green;*/
        }

            .fila_enca_agenda_diaria .conten_hora_0 {
                display: flex;
                justify-content: center;
                align-items: center;
                width: 5%;
                border-right: 1px solid #e0e0e0;
                padding: .3rem;
/*                border: 1px solid orange;*/
            }

            .fila_enca_agenda_diaria .conten_hora_1 {
                display: flex;
                justify-content: center;
                align-items: center;
                width: 95%;
                padding: .3rem;
/*                border: 1px solid purple;*/
            }


    #conten_deta_agenda_diaria {
        display: flex;
        flex-wrap: wrap;
        width: 100%;
        height: calc(100% - 30px);
/*        border: 1px solid purple;s*/
        overflow-y: scroll;
    }

        .fila_deta_agenda_diaria {
            display: flex;
            flex-wrap: wrap;
            width: 100%;
/*            border: 1px solid brown;*/
        }

/*
            #conten_tarea_agenda_diaria {
                display: flex;
                flex-wrap: wrap;
                width: 100%;
            }
*/

            .conten_deta_hora_00 {
                display: flex;
                width: 100%;
                border-bottom: 1px solid #fafafa;
/*                border: 1px solid orange;*/
            }

                .conten_deta_hora_00_izq {
                    display: flex;
                    justify-content: flex-end;
                    align-items: center;
                    width: 5%;
                    border-right: 1px solid #e0e0e0;
                    padding: .3rem;
                }

                .conten_deta_hora_00_der {
                    display: flex;
                    width: 95%;
                    flex-wrap: wrap;
                    padding: .3rem;
                }

            .conten_deta_hora_30 {
                display: flex;
                width: 100%;
                border-bottom: 1px solid #c4c4c4;
/*                border: 1px solid purple;*/
            }

                .conten_deta_hora_30_izq {
                    display: flex;
                    justify-content: flex-end;
                    align-items: center;
                    width: 5%;
                    border-right: 1px solid #e0e0e0;
                    padding: .3rem;
/*                    border: 1px solid orange;*/
                }

                .conten_deta_hora_30_der {
                    display: flex;
                flex-wrap: wrap;
                    width: 95%;
                    padding: .3rem;
/*                    border: 1px solid purple;*/
                }


/* ################################################################################## */
/* ################################################################################## */
/* ################################################################################## */
/* FIN Estilo Agenda Diaria */
/* ################################################################################## */
/* ################################################################################## */
/* ################################################################################## */


/* ################################################### */
/* ################################################### */
/* ################################################### */
/* ################################################### */
#conten_formulario_venta {
    display: flex;
    flex-wrap: wrap;
    margin-top: 5rem;
    padding: 2rem;
/*    border: 1px solid red;*/
}

    #conten_titulo_form_venta {
        display: flex;
        flex-wrap: wrap;
/*        height: 10rem;*/
        width: 100%;
/*        border: 1px solid blue;*/
    }

        #titulo_form_venta {
            margin: 0 auto;
            display: flex;
            align-items: center;
/*            margin-top: 1rem;*/
            font-size: 1.4rem;
            font-weight: 800;
            color: #a7a7a7;
            height: 5rem;
            width: 98%;
            border-bottom: 1px solid #aaaaaa;
        }

            #titulo_form_venta span {
/*                display: flex;*/
                font-size: 1.3rem;
                margin-right: .5rem;
            }

        #titulo_form_venta_vehiculo {
            display: flex;
            align-items: center;
            margin-top: 1.5rem;
            height: 4rem;
            font-size: 1.2rem;
            padding-left: 1rem;
            width: 100%;
            color: #363636;
            border-left: 4px solid #80d5f7;
            background-color: #e1f5fd;
        }

    #content_datos_venta {
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        width: 100%;
        margin-top: 2rem;
/*        border: 1px solid black;*/
    }

    .conten_campos_formulario_venta {
        display: flex;
    }

        .tit_campo_form_venta {
            display: flex;
            white-space: nowrap;
        }

        .conten_campo_venta {
            display: flex;
            flex-wrap: wrap;
            widows: 100%;
            max-width: 45rem;
            margin-top: 2rem;
/*            border: 1px solid red;*/
        }

            .conten_campo_venta_sup {
                display: flex;
                position: relative;
                width: 100%;
            }

            .btn_imprimir_nota_venta {
                display: flex;
                justify-content: center;
                align-items: center;
                color: black;
/*                border: 1px solid #d0d0d0;*/
                background-color: #008300;
                color: white;
                border-radius: .4rem;
                height: 3rem;
                width: 10rem;
                transition: all .3s;
                font-size: 1.3rem;
            }

            .btn_imprimir_nota_venta:hover {
                cursor: pointer;
                background-color: #005000;
            }

            .btn_facturar_nota_venta {
                display: flex;
                justify-content: center;
                align-items: center;
                color: black;
/*                border: 1px solid #d0d0d0;*/
                background-color: #008300;
                color: white;
                border-radius: .4rem;
                height: 3rem;
                width: 10rem;
                transition: all .3s;
                font-size: 1.3rem;
            }

            .btn_facturar_nota_venta:hover {
                cursor: pointer;
                background-color: #005000;
            }
                

                .conten_campo_venta_sup label {
                    display: flex;
                    justify-content: flex-end;
                    align-items: center;
                    width: 30%;
                    font-size: 1.3rem;
                    padding: .5rem;
                    color: #4d4d4d;
/*                    border: 1px solid blue;*/
                }

                #lbl_comentario_interno_venta {
                    align-items: flex-start;
                }

                .conten_campo_venta_sup input,
                .conten_campo_venta_sup select,
                .conten_campo_venta_sup textarea {
                    display: flex;
                    width: 70%;
                    font-size: 1.3rem;
                    height: 3rem;
                    padding: .5rem;
                    border: 1px solid #eaeaea;
                    color: #363636;
/*                    border: 1px solid blue;*/
                }

                .conten_campo_venta_sup textarea  {
                    height: 15rem;
                }

            
            .conten_campo_venta_sup_wrap {
                display: flex;
                flex-wrap: wrap;
/*                position: relative;*/
                width: 100%;
/*                border: 1px solid red;*/
                margin: .1rem;
            }

                

                .conten_campo_venta_sup_wrap label {
                    display: flex;
/*                    justify-content: flex-end;*/
                    align-items: center;
                    width: 100%;
                    font-size: 1.3rem;
                    padding: .5rem;
                    color: #4d4d4d;
/*                    border: 1px solid blue;*/
                }

                #lbl_comentario_interno_venta {
                    align-items: flex-start;
                }

                .conten_campo_venta_sup_wrap input,
                .conten_campo_venta_sup_wrap select,
                .conten_campo_venta_sup_wrap textarea {
                    display: flex;
                    width: 100%;
                    font-size: 1.3rem;
                    height: 3rem;
                    padding: .5rem;
                    border: 1px solid #eaeaea;
                    color: #363636;
/*                    border: 1px solid blue;*/
                }

                .conten_campo_venta_sup_wrap textarea  {
                    height: 15rem;
                }

/*
                #varrut {
                    width: calc(70% - 30px);
                }
*/

                    .icono_lupa_campo_venta{
                        display: flex;
                        justify-content: center;
                        align-items: center;
                        font-size: 1.3rem;
                        color: #a8a8a8;
                        background-color: #e3e3e3;
                        width: 30px;
                        border-top: 1px solid #c3c3c3;
                        border-right: 1px solid #c3c3c3;
                        border-bottom: 1px solid #c3c3c3;
                    }

                .asterisco_rojo {
                    display: flex;
                    justify-content: center;
                    height: 100%;
                    color: red;
                    margin-left: .5rem;
                    font-size: 1.6rem;
                }

            .conten_campo_venta_inf {
                display: flex;
                margin-top: .5rem;
                width: 100%;
            }

                .conten_campo_venta_inf span {
                    display: flex;
                    min-width: 30%;
/*                    border: 1px solid blue;*/
                }

                .conten_campo_venta_inf label {
                    display: flex;
                    width: 70%;
                    font-size: 1.1rem;
                    color: #656565;
/*                    border: 1px solid green;*/
                }

#conten_btn_frm_venta {
    margin: 0 auto;
    display: flex;
    margin-top: 3rem;
    width: 100%;
    max-width: 30rem;
    margin-left: 30%;
/*    border: 1px solid red;   */
    height: 2.8rem;
    padding-left: 1rem
}

#conten_btn_frm_venta label:nth-child(1){
    display: flex;
    justify-content: center;
    align-items: center;
    width: 8rem;
    font-size: 1.2rem;
    background-color: #35aa47;
    color: #f5f5f5;  
}

#conten_btn_frm_venta label:nth-child(1):hover{
    cursor: pointer;
    background-color: #076f17;
    color: #f5f5f5;  
}

#conten_btn_frm_venta label:nth-child(2){
    display: flex;
    justify-content: center;
    align-items: center;
    width: 8rem;
    margin-left: 1em;
    font-size: 1.2rem;
    background-color: #ebebeb;
    color: #0a0a0a;
}


/* ################################################### */
/* ################################################### */
/* ################################################### */
/* ################################################### */

/* Estilo integracion hino */


#conten_general_integracion_hino {
/*    border: 5px solid black;*/
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    position: relative;
    height: 100%;
/*    padding-top: 5rem;*/
    overflow-y: scroll;
}

#conten_botones_integracion_hino {
/*    border: 1px solid blue;*/
    display: flex;
    justify-content: center;
    align-items: center;
    position: fixed;
    width: 100%;
    padding: 10px;
/*    height: 40px;*/
/*    margin-top: 20px;*/
    background-color: #478cc7;
    z-index: 1;
    box-shadow: 3px 3px 10px #7c7c7c;
}

.btn_integracion_hino {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #e6e6e6;
    border: 1px solid  #9b9bc7;
    width: 150px;
    padding: 10px 10px;
    margin: 10px;
    border-radius: 4px;
    transition: all .4s;
    font-size: 14px;
}

.btn_integracion_hino:hover {
    background-color: #0a0aaa;
    color: white;
    cursor: pointer;
}

.btn_integracion_hino:hover:disabled {
    background-color: #e6e6e6;
    cursor: auto;
    color: none;
}

.btn_integracion_hino:disabled {
    color:  gray;
    border: 1px solid   gray;
}

#conten_registro_integracion_toyota {
    display: flex;
    width: 100%;
    border: 5px solid red;
    margin-top: 5rem;   
}

#conten_registro_sms {
    margin-top: 100px;
    border-top: 1px solid red;
/*    max-height: 70%;*/
    padding: 10px;
    position: relative;
/*    overflow-y: scroll;*/
}


#tabla_registro_integracion_hino {
    margin: 0 auto;
/*    position: absolute;*/
/*    padding-top: 100px;*/
/*    border: 1px solid green;*/
    border-spacing: 0px;
    border-collapse: separate;
    max-height: 300px;
    font-size: 14px;
}

#tabla_registro_integracion_hino tr {
    border: 1px solid orange;
}

#tabla_registro_integracion_hino thead tr td {
    border-bottom: 1px solid green;
    padding: 5px 10px;
    font-weight: bold;
    text-align: center;
}

#tabla_registro_integracion_hino tbody tr td {
    border-bottom: 1px solid green;
    padding: 5px 10px;
}

.monto_validar_integracion_hino {
    display: flex;
    justify-content: flex-end;
    text-align: right;   
}

#lbl_actualiza_tabla_integracion_hino {
    margin-left: 5px;
}

.conten_tabla_exportacion_excel_precios {
    display: flex;
    width: 100%;
    height: 0rem !important;
    overflow: scroll !important;
}

#tabla_exportacion_lista_precios {
    width: 100%;
    font-size: 1.2rem !important;
}

#tabla_exportacion_lista_precios thead {

}

#tabla_exportacion_lista_precios thead tr {
    
}

#tabla_exportacion_lista_precios thead tr td {
    border-bottom: 1px solid black;    
    width: auto !important;
    font-weight: bold;
    text-align: center;
    padding: .3rem;
}

#tabla_exportacion_lista_precios {
        
}

#tabla_exportacion_lista_precios tbody {
        
}

#tabla_exportacion_lista_precios tbody tr {
    
}

#tabla_exportacion_lista_precios tbody tr td {
    border-bottom: 1px solid black;    
    width: auto !important;
    font-size: 1.1rem !important;
    padding: .3rem;
}

#conten_sec_carga_precio_tit_3 {
    display: flex;    
    justify-content: space-between;
    margin-top: 1rem;
}


#lbl_sec_carga_precio_tit_3 {
    display: flex;   
    align-items: baseline;
}

#sec_carga_precio_tit_3 {
    display: flex;
    font-size: 2rem;
    margin-right: .5rem;
}


#lbl_sec_carga_precio_tit_3:hover,
#sec_carga_precio_tit_3:hover {
    cursor: pointer;
}

.conten_tit_grupo_captura {
    display: flex;
    justify-content: center;
    width: 100%;
}

    .conten_tit_grupo_captura div {
        display: flex;
        justify-content: space-between;
        width: 49%;
        padding: .3rem;
    }

.conten_dat_grupo_captura {
    display: flex;
    justify-content: center;
    width: 100%;
}

    .conten_usuarios_grupo_captura {
        display: flex;
        flex-wrap: wrap;
        align-content: flex-start;
        width: 49%;
        padding: .5rem;
        border: 1px solid #d1d1d1;
        max-height: 40rem;
        overflow-y: scroll;
    }

    .conten_usuario_fuera_grupo_linea {
        display: flex;
        width: 100%;
        padding: .2rem;
    }

        .conten_usuario_fuera_grupo_linea label {
            display: flex;
            width: 100%;
            padding: .3rem;
        }

            .agregar_usuario_grupo_captura {
                display: flex;
                margin-left: .5rem;
            }

            .agregar_usuario_grupo_captura:hover {
                color: red;
            }

            .quitar_usuario_grupo_captura {
                display: flex;
                margin-left: .5rem;
            }

            .quitar_usuario_grupo_captura:hover {
                color: red;
            }

        .conten_usuarios_grupo_captura div label:hover {
            cursor: pointer;
            background-color: #c9c9c9;
        }

    .conten_usuario_dentro_grupo_linea {
        display: flex;
        width: 100%;
        padding: .2rem;
    }

        .conten_usuario_dentro_grupo_linea label {
            display: flex;
            width: 100%;
            padding: .3rem;
        }

    .conten_usuario_dentro_grupo_izq {
        display: flex;
        width: 85%;
/*        border: 5px solid red;*/
    }

    .conten_usuario_dentro_grupo_der {
        display: flex;
        width: 4.5rem;
        padding: 0;
    }

        .conten_usuario_dentro_grupo_der input {
            display: flex;
            font-size: 1.3rem;
            width: 100%;
            text-align: right;
            padding: .2rem;
        }

        .conten_usuario_dentro_grupo_der input::-webkit-inner-spin-button,
        .conten_usuario_dentro_grupo_der input::-webkit-inner-spin-button {
            -webkit-appearance: none; 
            margin: 0;
            -moz-appearance:textfield;
        }

        .conten_usuario_dentro_grupo_der label {
            display: flex;
            justify-content: center;
            align-items: center;
/*            border: 1px solid red;*/
            font-size: 1.3rem;
            width: 1.3rem;
        }

.input_porcentaje_marca_bloqueado {
    background-color: #c9c9c9;
}

.input_porcentaje_marca_bloqueado:focus {
    background-color: white;
}

/*
input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
  -webkit-appearance: none; 
  margin: 0; 
}

input[type=number] { -moz-appearance:textfield; }
*/

.conten_usuario_cantidad_grupo {
    display: flex;   
    align-items: center;
/*    border: 5px solid red;*/
}

.circulo_cantidad_usuarios_grupo {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: .3rem;
    background-color: #6868bc;
    color: white;
    height: 1.5rem;
    width: 1.5rem;
    border-radius: 1rem;
}



#conten_facturacion {
    display: flex;
    margin: 0 auto;
    max-height: 50rem;
    width: 80% !important;
    flex-wrap: wrap;
/*    border: 5px solid red;*/
    overflow-y: scroll;
    padding: 1rem;
}

    .conten_datos_facturacion {
        display: flex;
/*        flex-wrap: wrap;*/
/*        border: 5px solid blue;*/
        padding: .1rem;
        width: 100%;
    }

        .conten_datos_facturacion label {
/*            border: 1px solid red;*/
            display: flex;
            width: 30%;
            font-size: 1.2rem;
        }

        .conten_datos_facturacion input {
/*            border: 1px solid red;*/
            display: flex;
            border: none;
            border: 1px solid #e8e8e8;
            width: 70%;
            font-size: 1.2rem;
            height: 2.8rem;
            padding: .2rem;
        }

        .conten_datos_facturacion select {
/*            border: 1px solid red;*/
            display: flex;
            width: 70%;
            font-size: 1.2rem;
            height: 2.8rem;
            padding: .2rem;
        }

    .conten_datos_facturacion_oculto {
        display: none !important;
/*        flex-wrap: wrap;*/
/*        border: 5px solid blue;*/
        padding: .1rem;
        width: 50%;
    }

.conten_botones_facturacion {
    display: flex;
    width: 100%;
/*    border: 1px solid red;*/
}

.conten_datos_facturacion_bloque {
    display: flex;
    flex-wrap: wrap;
/*    border: 5px solid blue;*/
    padding: .5rem .5rem .5rem .5rem;
    margin: .5rem;
    border: 1px solid #bfbfbf;
}


    .conten_botones_facturacion label {
        margin: 0 auto;
        margin-top: 1rem;
        display: flex;
        justify-content: center;
        align-items: center;
        height: 3.5rem;
        background-color: #074dd1;
        color: #d3d3d3;
        font-size: 1.3rem;
        padding: .5rem 1rem;
        transition: all .3s;
    }


.conten_botones_facturacion label:hover {
    cursor: pointer;
    background-color: #033695;
}