:root {
  --titre-size: 2.1vw;
}

html {
  scroll-behavior: smooth;
}

@font-face {
  font-family: "Bodoni Italic";
  src: url('../fonts/Bodoni-Italic.ttf') format("truetype");
  font-weight: normal;
  font-style: italic;
}

@font-face {
  font-family: "Futura";
  src: url('../fonts/FuturaLight.ttf') format("truetype");
}

@font-face {
 font-family: "Telegrafico";
 src: url("../fonts/Telegrafico.ttf") format("truetype");
/*      url("../fonts/Telegrafico.woff2") format("woff2"),
      url("../fonts/Telegrafico.woff") format("woff"),
      url("../fonts/Telegrafico.otf") format("otf");*/
}

@font-face {
 font-family: "Bison";
 src: url("../fonts/Bison-Bold.ttf") format("truetype");
}

@font-face {
 font-family: "Theano";
 src: url("../fonts/TheanoDidot-Regular.ttf") format("truetype");
/*      url("../fonts/Telegrafico.woff2") format("woff2"),
      url("../fonts/Telegrafico.woff") format("woff"),
      url("../fonts/Telegrafico.otf") format("otf");*/
}


@font-face {
 font-family: "AlternateGot";
 src: url("../fonts/AlternateGot.woff2") format("woff2"),
      url("../fonts/AlternateGot.woff") format("woff"),
      url("../fonts/AlternateGot.ttf") format("truetype"),
      url("../fonts/AlternateGot.otf") format("otf");
}

@font-face {
  font-family: "MontserratSb";
  src: url('../fonts/Montserrat-SemiBold.ttf') format("truetype");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "MontserratLight";
  src: url('../fonts/Montserrat-Light.ttf') format("truetype");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "Sitka";
  src: url('../fonts/SitkaVF.ttf') format("truetype");
  font-weight: normal;
  font-style: normal;
}

body {
    margin: 0;
    overflow-x: hidden;
    font-family: "Theano";
    margin-left: 4vh;
    padding-right: 4vh;
}

h2, h3 {
  font-family: "Theano";
  margin: 0;
  margin-top: 3vh;
}



h1 {
  font-family: "Telegrafico";
  font-size: 9vh;
  margin: 0;
  margin-top: 2vh;
}

.lien {
  color: navy;
  transition: all 0.2s;
}

.lien-2 {
  color: navy;
}

.lien:hover {
  background-color: navy;
  color: white;
}

@media (max-width:  640px) {
  h1 {
    font-size: 9vw;
  }

  h2 {
    font-size: 4vw;
  }
}