/* ------
SOMMAIRE
---------*/
/*

00 - COULEURS

*/



/* ----------
00 - COULEURS
-------------*/



:root{

    /*Blanc*/
	--white: #fff; 
    
    /*Noir*/
	--black: #000 !important;    

    /* Gris */
    --gray-100: #F2F2F2 ;
    --gray-200: #D9DCE3 ;
    --gray-300: #C3C7D0 ;
    --gray-400: #7A869A ;
    --gray-500: #7A869A ;
    --gray-600: #46546E ;
    --gray-700: #212A3A ;
    --gray-800: #2D3748 ;
    --gray-900: #191E27 ;


    /* Couleurs */
    
    --blue:    #007bff ;
    --indigo:  #6610f2 ;
    --purple:  #9790a5 ;
    --pink:    #e83e8c ;
    --red:     #E73434 ;
    --orange:  #fd7e14 ;
    --yellow:  #FFC93E ;
    --green:   #067503 ;
    --teal:    #20c997 ;
    --cyan:    #2F97ED ;


    --color-primary:          #00A8C3;
    --color-primary-hover:    #0099B0;
    --color-primary-active:   #007A8D;
    --color-primary-light:    #B1E9F1;
    --color-primary-x-light:  #EBF8FA;
    --color-primary-dark:     #003139;

    --color-degrad-primary: linear-gradient(65deg, #00A8C3 17.96%, #B1E01B 84.19%);
    --color-degrad-secondary: linear-gradient(245deg, #00A8C3 15.81%, #B1E01B 84.19%);

    --color-success:       #10B981 ;
    --color-success-hover: #047857 ;
    --color-success-light: #ECFDF5 ;
    --color-info:          #0052CC ;
    --color-warning:       #F97316 ;
    --color-warning-hover: #EA580C ;
    --color-warning-light: #FFF7ED ;
    --color-danger:        #EF4444 ;
    --color-danger-hover:  #DC2626 ;
    --color-danger-light:  #FEF2F2 ;
    --color-light:         #F1F3F7 ;
    --color-dark:          #343a40 ;

    /* Font weight */
    --thin       : 100;
    --extralight : 200; --extraLight : 200;
    --light      : 300;
    --regular    : 400;
    --medium     : 500;
    --semibold   : 600; --semiBold : 600;
    --bold       : 700;
    --extrabold  : 800; --extraBold : 800;
    --black      : 900;  

    
}


.white{
    color: #fff !important;
    color: var(--white) !important;
}
.bg-white{
    background-color: #fff !important;
    background-color: var(--white) !important;
}
.black{
    color: #000 !important;
    color: var(--black) !important;
}
.bg-black{
    background-color: #000 !important;
    background-color: var(--black) !important;
}
.bg-gray {
    background-color: #191E27;
    background-color: var(--gray-900);
}
/*color primary*/
.color-primary{
    color: #00A8C3  !important;
    color: var(--color-primary) !important;
}
.bg-color-primary{
    background-color: #00A8C3 !important;
    background-color: var(--color-primary) !important;
}
/*color-primary-hover*/
.color-primary-hover{
    color: #0099B0  !important;
    color: var(--color-primary-hover) !important;
}
.bg-color-primary-hover{
    background-color: #0099B0 !important;
    background-color: var(--color-primary-hover) !important;
}
/*color-primary-active*/
.color-primary-active{
    color: #007A8D  !important;
    color: var(--color-primary-active) !important;
}
.bg-color-primary-active{
    background-color: #007A8D !important;
    background-color: var(--color-primary-active) !important;
}
/*color-primary-light*/
.color-primary-light{
    color: #B1E9F1  !important;
    color: var(--color-primary-light) !important;
}
.bg-color-primary-light{
    background-color: #B1E9F1 !important;
    background-color: var(--color-primary-light) !important;
}
/*color-primary-extra-light*/
.color-primary-x-light{
    color: #EBF8FA  !important;
    color: var(--color-primary-x-light) !important;
}
.bg-color-primary-x-light{
    background-color: #EBF8FA !important;
    background-color: var(--color-primary-x-light) !important;
}
/*color-primary-dark*/
.color-primary-dark{
    color: #003139 !important;
    color: var(--color-primary-dark) !important;
}
.bg-color-primary-dark{
    background-color: #003139!important;
    background-color: var(--color-primary-dark) !important;
}
/*color-neutral*/
.color-neutral-100 {
    color: var(--gray-100);
}
.color-neutral-200 {
    color: var(--gray-200);
}
.color-neutral-300 {
    color: var(--gray-300);
}
.color-neutral-400 {
    color: var(--gray-400);
}
.color-neutral-500 {
    color: var(--gray-500);
}
.color-neutral-600 {
    color: var(--gray-600);
}
.color-neutral-700 {
    color: var(--gray-700);
}
.color-neutral-800 {
    color: var(--gray-800);
}
.color-neutral-900 {
    color: var(--gray-900);
}

/*PADDING ET MARGIN*/

/*margin*/
.margin-page {
    margin: 64px 0;
}
.margin-right-medium {
    margin-right: 80px;
}
.my-large {
    margin:0 120px;
}

/*padding*/
.py-medium {
    padding-left: 40px;
    padding-right: 40px;
}
.padding-large {
    padding: 110px 0;
}
.padding-medium {
    padding: 40px 0;
}
.padding-right-little {
    padding-right: 48px;
}
.padding-left-little {
    padding-left: 48px;
}
.padding-page {
    padding:56px 0;
}
.pb-large {
    padding-bottom: 88px;
}
.pt-large {
    padding-top: 88px;
}
.padding-page-bloc {
    padding:80px 0 136px 0;
}

/*gap*/ 
.my-10{
    gap: 10px;
}
.my-16 {
    gap:16px;
}
.my-24{
    gap: 24px;
}
.my-32{
    gap: 32px;
}
.my-40 {
    gap: 40px;
}
.my-48 {
    gap: 48px;
}
.my-52 {
    gap:52px;
}
.my-56 {
    gap: 56px;
}
.my-64 {
    gap: 64px;
}


/*------------------------------
---------- RESPONSIVE ----------
--------------------------------*/

@media (max-width:1199px) {
    .sectionHasSidebar .padding-page-bloc {
        padding-bottom: 0;
    }
}
@media (max-width: 1000px) {
    .padding-left-little {
        padding-left: 0px;
    }
    .padding-large {
        padding: 70px 0;
    }
    .pb-large {
        padding-bottom: 10px;
    }
    .pt-large {
        padding-top: 10px;
    }
}

@media (max-width:780px) {
    .padding-page {
        padding: 40px 0;
    }
}