:root {
    --primary_tc: #f1f2f2;
    --secondary_tc: #ecbe71;
    --primary_font_color_tc: #414042;
    /* --secondary_font_color_tc: #76755A; */
    --icon_color:#85826d;
    --white_tc: #FFFFFF;
    --black_tc: #000000;
    --red_tc: #D1171A;
    --green_tc:#77CB11;
    --light_grey_tc:#DEDDDD;
    
    --color_calendar_not_selected:#b3b3b3;
    --background_color_calendar_not_selected:#f0f0f0;
    --border_color_calendar_not_selected:#ececec;
    --border_color_table_td:#C4B39C;
}

*{
    /* margin: 0 !important;
    padding: 0 !important; */
    list-style: none !important;
}

.white-space-break-spaces {
    white-space: break-spaces;
}

.flex-1{
    flex: 1;
}
.flex-10{
    flex: 10%;
}
.flex-20{
    flex: 20%;
}
.flex-30{
    flex: 30%;
}
.flex-40{
    flex: 40%;
}
.flex-50{
    flex: 50%;
}
.flex-60{
    flex: 60%;
}
.flex-70{
    flex: 70%;
}
.flex-80{
    flex: 80%;
}
.flex-90{
    flex: 90%;
}
.flex-100{
    flex: 100%;
}


.bg-primary-tc{
    background-color: var( --primary_tc);
}
.bg-secondary-tc{
    background-color: var( --secondary_tc);
}
.bg-red-tc{
    background-color: var( --red_tc);
}
.bg-white-tc{
    background-color: var( --white_tc);
}
.bg-icon-color{
    background-color: var(--icon_color);
}
.bg-light-grey-tc{
    background-color: var(--light_grey_tc);
}
.bg-black-tc{
    background-color: var( --black_tc);
}
.bg-green-tc{
    background-color: var( --green_tc);
}
.font-primary-tc{
    color: var(--primary_font_color_tc);
}
.font-secondary-tc{
    color: var(--secondary_font_color_tc);
}
.font-red-tc{
    color: var(--red_tc) !important;
}
.font-0_5{
    font-size: 0.5rem;
}
.font-0_6{
    font-size: 0.6rem;
}
.font-0_7{
    font-size: 0.7rem;
}
.font-0_8{
    font-size: 0.8rem;
}
.font-0_9{
    font-size: 0.9rem;
}
.font-1_5{
    font-size: 1.5rem;
}
.font-1_75{
    font-size: 1.75rem;
}
.font-2{
    font-size: 2rem;
}
.icon-color{
    color: var(-icon_color);
}
.description{
    color: var(--primary_font_color_tc) !important;
}
.italic{
    font-style: italic;
}
.underline{
    text-decoration: underline;
}
.underline-red{
    text-decoration: underline;
    text-decoration-color: var(--red_tc);
}
.bold{
    font-weight: bold;
}
.uppercase{
    text-transform: uppercase;
}
.capitalize{
    text-transform: capitalize;
}
.lowercase{
    text-transform: lowercase;
}
.justify{
    text-align: justify;
}
.btn-radius{
    border-radius: 16.5px !important;
}
.input-radius{
    border-radius: 16.5px !important;
}
.box-radius{
    border-radius: 10px !important;
}
.box-radius-left{
    border-top-left-radius: 10px !important;
    border-bottom-left-radius: 10px !important;
}
.box-radius-right{
    border-top-right-radius: 10px !important;
    border-bottom-right-radius: 10px !important;
}
.pointer{
    cursor: pointer;
}
.cursor_not_allowed{
    cursor: not-allowed;
}
.row_blur{
    background-color: rgba(0,0,0,0.8);
}
.opacity-0{
    opacity: 0;
}
.opacity-0-5{
    opacity: 0.5 !important;
}
.opacity-1{
    opacity: 1 !important;
}
.disabled{
    background-color: rgba(0,0,0,0.7) !important;
}
.border-red{
    border-color: var(--red_tc) !important;
}
.border-color-table{
    border-color: var(--border_color_table_td) !important;
}
.overflow-x-hidden{
    overflow-x: hidden;
}
.overflow-y-hidden{
    overflow-y: hidden;
}
.overflow-hidden{
    overflow: hidden;
}
.text-ellipsis{
    text-overflow: ellipsis;
}
.white-space-wrap{
    white-space: nowrap;
}
.top-0{
    top: 0;
}
.top-10{
    top: 10px;
}
.line-height-10{
    line-height: 10px;
}
.line-height-15{
    line-height: 15px;
}
.hide{
    display: none !important;
}
.text-decoration-none{
    text-decoration: none !important;
}
.text-underline-tc{
    text-decoration: underline;
    text-decoration-color: var(--secondary_tc);
}
.border-bottom-tc{
    border-bottom: 2px solid var(--secondary_tc) !important;
}
.border-color-tc{
    border-color: var(--secondary_tc);
}
.text-justify{
    text-align: justify;
}



/*----------------- CSS pour tablettes ----------------------------------*/
@media all and (max-device-width:1024px) and (orientation: portrait){
    
}
@media all and (max-device-width:1024px) and (orientation: landscape){

}

/*----------------- CSS pour Smartphones et tablette---------------------*/
@media all and (max-device-width:768px) and (orientation: portrait){

}

/*----------------- CSS pour Smartphones --------------------------------*/
@media all and (max-device-width:480px) and (orientation: portrait){
    .hide-on-mobile{
        display: none;
    }
    .hide-on-mobile-portrait{
        display: none !important;
    }
    
    
}
@media all and (max-device-width:750px) and (orientation: landscape){

}
@media all and (max-device-width:920px) and (orientation: landscape){
    .hide-on-mobile{
        display: none;
    }
    .hide-on-mobile-landscape{
        display: none;
    }

}