:root {

    /* Colors */
    --primary-dark: #000;
    /*--primary-base : #929ea2;*/
    --primary-base: #6399ae;
    --primary-light: #888888;

    --secondary-dark: #e9e9e9;
    --secondary-base: #f4f6f7;
    /*--secondary-base: #F9FFF9;*/
    --secondary-base-rgb: 244, 246, 247;
    --secondary-light: #FFF;
    --secondary-light-rgb: 255, 255, 255;

    --bg-bloc-text: #f6f6f6;
    --border-bloc-text: #e4e4e4;

    /*--tertiary-dark : #3d6594;*/
    --tertiary-dark: #00205b;
    /*--tertiary-base : #3D6594 ;*/
    --tertiary-base: #386f96;
    /*--tertiary-light : #e7ebfa;*/ /* dae1e5 */
    --tertiary-light: #789ac0; /* #6399ae */
    --tertiary-light-2: #5d8aa7;
    --tertiary-light-rgb: 218, 225, 229; /* dae1e5 */

    --color-border: var(--secondary-dark);
    --color-highlight: #c2c4c4;
    --color-highlight-rgb: 194, 196, 196;
    --color-border-rgb: 6, 137, 191;
    --color-path: #fff;
    --color-error: #c9000e;

    --box-shadow: rgba(51, 51, 51, 0.3);

    --gradient-01: linear-gradient(to bottom, rgba(255, 255, 255, .5) 0%, rgba(255, 255, 255, 0) 100%);
    /*--gradient-02 : linear-gradient(to bottom, rgba(202,210,231,1) 0%,rgba(225,225,225,1) 100%);*/
    --gradient-02: linear-gradient(to bottom, var(--tertiary-dark) 0%, var(--tertiary-base) 100%);
    --gradient-03: linear-gradient(to top, #e6e4e4 0%, #f5f6f6 100%);
    --gradient-04: linear-gradient(to bottom, rgba(92, 92, 92, 1) 0%, rgba(36, 36, 36, 1) 100%);
    --gradient-05: linear-gradient(to bottom, #FAFAFA 100px, rgba(231, 235, 250, 1) 100%);


    /* FOnt */
    --font-small: 0.8rem;
    --font-medium: 1rem;
    --font-big: 1.4rem;


    /* Margins
    ***************************************/
    --margin-small: 0.8rem;
    --margin-medium: 2rem;
    --margin-big: 4rem;


    /*--grid-gutter: 2%;*/
    --grid-gutter: 1.6rem;
    --column-gutter: calc(var(--grid-gutter) * 2);
    --logo-url: url(../images/logo_france-simulation.svg);

    /* Borders
    ***************************************/
    --border-primary: var(--primary-base);
    --border-secondary: var(--secondary-light);
    --border-tertiary: var(--tertiary-light);
    --border-toolbar: 1px solid var(--primary-light);

    /* Grid items
    ***************************************/
    --item-number: 1;
    --item-width: 100%;
    --dt-item-width: 30%;

    /* List def
    ***************************************/

    --width-dt: 30%;
    --dl-gap-x: 2rem;
    --width-dd: calc(100% - var(--dl-gap-x) - var(--width-dt));


}

