/************************************************************************
                            IMPORT DES POLICES
************************************************************************/

/*
 * @import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;400;900&family=Roboto+Condensed:wght@300;400;700&display=swap');
 * mettre dans font.css le contenu de l'url une fois que c'est terminé.
 * Accelere le chargement de la page
 */

:root {

  /********** COULEURS **********/
  --color-black: #000;
  --color-black-trans: rgba(0, 0, 0, 0.8);
  --color-black-trans-mid: rgba(0, 0, 0, 0.5);
  --color-black-trans-plus: rgba(0, 0, 0, 0.2);
  --color-white: #FFF;
  --color-white-trans: rgba(255, 255, 255, 0.8);

  --color-blue: #004dca;
  --color-blue-trans: #004dcac8;
  --color-blue-trans-mid: #004dcac5;
  --color-blue-trans-plus: #004dca99;
  --color-blue-text: #fff;
  --color-blue-trans-text: #fff;

  --color-grey: #f0f0f0;
  --color-grey-trans: #f0f0f0c8;
  --color-grey-text: #000;

  --color-dark-grey: #878787;
  --color-dark-grey-trans: #878787c8;
  --color-dark-grey-text: #000;

  --color-hover: var(--color-blue);


  /********** GAPS **********/
  --gap-xs : 8px;
  --gap    : 15px;
  --gap-2  : 30px;
  --gap-3  : 45px;
  --gap-4  : 60px;
  --gap-5  : 75px;
  --gap-6  : 90px;
  --gap-7  : 105px;
  --gap-8  : 120px;
  --gap-9  : 135px;
  --gap-10 : 150px;
  --gap-11 : 165px;
  --gap-12 : 180px;
  --gap-13 : 195px;
  --gap-14 : 210px;
  --gap-15 : 225px;

  --gap-button-v: 5px;
  --gap-button-h: 10px;

  --height-header: 100px;


  /********** FONTS **********/
    --font-title: 'Fira Sans', sans-serif;
  
    --font-title-regular: 400;
    --font-title-bold: 700;
    --font-title-extra-bold: 800;

    --font-text: 'Lato', sans-serif;
    
    --font-text-thin: 100;
    --font-text-regular: 400;
    --font-text-bold: 700;

    --font-article: 'Fjalla One', sans-serif;
    --font-article-weight: 400;

    --font-title-article: 'Unna', sans-serif;
    --font-title-article-weight: 400;
  /********** SIZES **********/
  --size-h1-title: 6rem;
  --size-h1-title-height: 6rem;
  --size-h1-title-small: 5.5rem;
  --size-h1-title-height-small: 5.3rem;
  --size-h1: 3.5rem;
  --size-h1-height: 3.8rem;
  --size-h2-title: 5rem;
  --size-h2-title-height: 5.1rem;
  --size-h2-title-small: 4.5rem;
  --size-h2-title-height-small: 4.8rem;
  --size-h2: 2.4rem;
  --size-h2-height: 2.5rem;
  --size-h3: 1.6rem;
  --size-h3-height: 2rem;
  --size-h4: 1.5rem;
  --size-h4-height: 1.2rem;
  --size-p: 1.3rem;
  --size-p-height: 2rem;

  font-size: 62.5%;

  /********** WIDTH **********/
  --width-column: 7.6%;
  --width-space: 0.8%;
}