/* Collection 1 - Laptop */
/* Couleurs - Mode 1 */

:root {
  --Noir: #000000FF;
  --Blanc: #FFFFFFFF;
  --Gris-clair: #DBDBDBFF;
  --Gris-foncé: #5C5C5CFF;
  --Fonts-H1kafka-Fontsize: 190px;
  --Fonts-H1helvetica-Fontsize: 56px;
  --Fonts-H1helvetica-Lineheight: 54px;
  --Fonts-H1helvetica-LetterSpacing: 5px;
  --Fonts-H1kafka-Lineheight: 150px;
  --Fonts-H2kafka-Fontsize: 56px;
  --Fonts-H2helvetica-Fontsize: 28px;
  --Fonts-H3kafka-Fontsize: 32px;
  --Fonts-H3kafka-Lineheight: 32px;
  --Fonts-H3kafka-LetterSpacing: 1px;
  --Fonts-H3helvetica-Fontsize: 20px;
  --Fonts-H3helvetica-Lineheight: 20px;
  --Fonts-H3helvetica-LetterSpacing: 2px;
  --Fonts-H2helvetica-Lineheight: 36px;
  --Fonts-H2helvetica-LetterSpacing: 3px;
  --Fonts-H2kafka-Lineheight: 60px;
  --Fonts-H2kafka-LetterSpacing: 3px;
  --Fonts-Chapo-Fontsize: 24px;
  --Fonts-Chapo-Lineheight: 40px;
  --Fonts-Chapo-LetterSpacing: 2px;
  --Fonts-Citation-Fontsize: 18px;
  --Fonts-Intertitre-Fontsize: 20px;
  --Fonts-Intertitre-Lineheight: 36px;
  --Fonts-Citation-Lineheight: 44px;
  --Fonts-Body1-Fontsize: 18px;
  --Fonts-Body1-Lineheight: 36px;
  --Fonts-Bouton-Fontsize: 16px;
  --Fonts-Bouton-Lineheight: 18px;
  --Fonts-Bouton-LetterSpacing: 2px;
  --Sizes-Maxwidth-Bodytext: 740px;
  --Sizes-Image-Carrouselheight: 300px;
  --Spaces-Padding-Chapo: 56px;
  --Spaces-Gapvertical-XL: 120px;
  --Spaces-Padding-Cartel: 32px;
  --Spaces-Gapvertical-L: 48px;
  --Spaces-Gapvertical-M: 40px;
  --Spaces-Gapvertical-S: 16px;
  --Spaces-Gaphorizontal-XL: 120px;
  --Spaces-Gaphorizontal-L: 48px;
  --Spaces-Gaphorizontal-M: 40px;
  --Spaces-Gaphorizontal-S: 20px;
}

@media(max-width:1000px){
  /* Collection 1 - Tablet */
:root {
  --Fonts-H1kafka-Fontsize: 140px;
  --Fonts-H1helvetica-Fontsize: 36px;
  --Fonts-H1helvetica-Lineheight: 40px;
  --Fonts-H1helvetica-LetterSpacing: 5px;
  --Fonts-H1kafka-Lineheight: 120px;
  --Fonts-H2kafka-Fontsize: 44px;
  --Fonts-H2helvetica-Fontsize: 24px;
  --Fonts-H3kafka-Fontsize: 24px;
  --Fonts-H3kafka-Lineheight: 24px;
  --Fonts-H3kafka-LetterSpacing: 1px;
  --Fonts-H3helvetica-Fontsize: 16px;
  --Fonts-H3helvetica-Lineheight: 16px;
  --Fonts-H3helvetica-LetterSpacing: 2px;
  --Fonts-H2helvetica-Lineheight: 32px;
  --Fonts-H2helvetica-LetterSpacing: 3px;
  --Fonts-H2kafka-Lineheight: 48px;
  --Fonts-H2kafka-LetterSpacing: 3px;
  --Fonts-Chapo-Fontsize: 20px;
  --Fonts-Chapo-Lineheight: 32px;
  --Fonts-Chapo-LetterSpacing: 2px;
  --Fonts-Citation-Fontsize: 16px;
  --Fonts-Intertitre-Fontsize: 20px;
  --Fonts-Intertitre-Lineheight: 36px;
  --Fonts-Citation-Lineheight: 32px;
  --Fonts-Body1-Fontsize: 16px;
  --Fonts-Body1-Lineheight: 32px;
  --Fonts-Bouton-Fontsize: 16px;
  --Fonts-Bouton-Lineheight: 18px;
  --Fonts-Bouton-LetterSpacing: 1px;
  --Sizes-Maxwidth-Bodytext: 740px;
  --Sizes-Image-Carrouselheight: 260px;
  --Spaces-Padding-Chapo: 40px;
  --Spaces-Gapvertical-XL: 100px;
  --Spaces-Padding-Cartel: 28px;
  --Spaces-Gapvertical-L: 36px;
  --Spaces-Gapvertical-M: 32px;
  --Spaces-Gapvertical-S: 16px;
  --Spaces-Gaphorizontal-XL: 100px;
  --Spaces-Gaphorizontal-L: 36px;
  --Spaces-Gaphorizontal-M: 32px;
  --Spaces-Gaphorizontal-S: 20px;
}
}

@media(max-width:560px){
  /* Collection 1 - mobile */
:root {
  --Fonts-H1kafka-Fontsize: 80px;
  --Fonts-H1helvetica-Fontsize: 24px;
  --Fonts-H1helvetica-Lineheight: 28px;
  --Fonts-H1helvetica-LetterSpacing: 5px;
  --Fonts-H1kafka-Lineheight: 64px;
  --Fonts-H2kafka-Fontsize: 36px;
  --Fonts-H2helvetica-Fontsize: 20px;
  --Fonts-H3kafka-Fontsize: 20px;
  --Fonts-H3kafka-Lineheight: 20px;
  --Fonts-H3kafka-LetterSpacing: 1px;
  --Fonts-H3helvetica-Fontsize: 12px;
  --Fonts-H3helvetica-Lineheight: 12px;
  --Fonts-H3helvetica-LetterSpacing: 2px;
  --Fonts-H2helvetica-Lineheight: 28px;
  --Fonts-H2helvetica-LetterSpacing: 3px;
  --Fonts-H2kafka-Lineheight: 44px;
  --Fonts-H2kafka-LetterSpacing: 3px;
  --Fonts-Chapo-Fontsize: 16px;
  --Fonts-Chapo-Lineheight: 28px;
  --Fonts-Chapo-LetterSpacing: 2px;
  --Fonts-Citation-Fontsize: 14px;
  --Fonts-Intertitre-Fontsize: 18px;
  --Fonts-Intertitre-Lineheight: 28px;
  --Fonts-Citation-Lineheight: 28px;
  --Fonts-Body1-Fontsize: 15px;
  --Fonts-Body1-Lineheight: 28px;
  --Fonts-Bouton-Fontsize: 12px;
  --Fonts-Bouton-Lineheight: 18px;
  --Fonts-Bouton-LetterSpacing: 1px;
  --Sizes-Maxwidth-Bodytext: 740px;
  --Sizes-Image-Carrouselheight: 220px;
  --Spaces-Padding-Chapo: 20px;
  --Spaces-Gapvertical-XL: 80px;
  --Spaces-Padding-Cartel: 20px;
  --Spaces-Gapvertical-L: 28px;
  --Spaces-Gapvertical-M: 20px;
  --Spaces-Gapvertical-S: 14px;
  --Spaces-Gaphorizontal-XL: 80px;
  --Spaces-Gaphorizontal-L: 28px;
  --Spaces-Gaphorizontal-M: 20px;
  --Spaces-Gaphorizontal-S: 16px;
}
}