:root {
    /* div */
    --containerValue: 100%;
    --containerXXXL: 1650px;
    --negativeMarginX: -0.75rem;
    --basePadding: 1.5rem;

    /* colors */
    --blue: #019BDD;
    --blue_hover: #0177AD;

    --blue_almostwhite: #F7F9FB;
    --blue_lighter: #E6F2F8;
    --blue_light: #D3E0E7;
    --blue_middle: #438BB5;
    --blue_dark: #1E4D72;
    --blue_darker: #0F141F;

    --grey: #D3E0E7;
    --grey_fake: #EEEEEf;
    --grey_lighter: #F7F7F7;
    --grey_light: #D9DEE3;
    --grey_middle: #8C9199;
    --grey_middle2: #9DB0C2;
    --gray_dark: #666;

    --red: #DF6F63;
    --red_dark: #B90E03;

    --yellow: #FBB37C;

    --green: #5A9E82;


    --color_main: var(--blue); /*red*/
    --color_main_active: #b00307; /*red*/

    --color_one: #cfaa40; /*gold*/
    --color_one_active: #be9930; /*gold*/

    --color_two: #fff2cf; /*beige*/
    --color_two_active: #eee1be; /*beige*/

    --color_three: #FFC300; /*orange*/
    --color_three_active: #eeb200; /*orange*/

    --black: #000;
    --white: #FFFFFF;


    /* fonts */
    --sans-serif: 'Inter';
    --serif: 'Libre Baskerville';

    /* border-radius */
    --borderradius_default: 8px;
    --borderradius_large: 30px;

    /* box-shadow */
    --boxshadow_default: 0 3px 8px 3px rgba(0, 0, 0, 0.05);

}


/*
@media screen and (min-width: 1400px) {
  :root {
    --containerValue: calc(1320px - var(--basePadding));
    --negativeMarginX: calc((var(--viewportWidth) - var(--containerValue)) / -2);
  }
}
*/