@font-face {
    font-family: 'SuisseIntl-Medium';
    src: url('../fonts/Suisse Int\'l/SuisseIntl-Medium.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
  font-family: 'SuisseIntl-Regular';
  src: url('../fonts/Suisse Int\'l/SuisseIntl-Regular.otf') format('opentype');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'SuisseIntl-Light';
  src: url('../fonts/Suisse Int\'l/SuisseIntl-Light.otf') format('opentype');
  font-weight: normal;
  font-style: normal;
}


*{
    font-family: 'SuisseIntl-Medium';
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    color:#1a1a1a
}


body{
  padding: 0 10px;
}

.body{
  padding: 0 20px 0 10px;
}


.fixed{
  z-index: 2;
  width: 100%;
  position: fixed;
  background-color: #ffffff;
  top:0;
}

.all-flag{
  width: 7%;
  position: absolute;
  left: 2%;
}

.flag{
width: 100%;
}

.titre{
  font-style: normal;
  font-weight: 500;
  font-size: 60px!important;
  text-align: center;
  letter-spacing: 0.2em;
  margin-bottom: 0;
}

.titre2{
  font-family: 'SuisseIntl-Light';
  font-style: normal;
  font-weight: 300;
  font-size: 30px;
  text-align: center;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}

/* HAMBURGER MENU */

/* CORE STYLES */
:root {
  --primary-color: rgba(255, 255, 255, 0.75);
  --overlay-color: rgb(255, 255, 255);
  --menu-speed: 0.75s;
}


/* MENU STYLES */
.menu-wrap {
  position: fixed;
  top: 2%;
  right: 2%;
  z-index: 1;
}

.menu-wrap .toggler {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 2;
  cursor: pointer;
  width: 200px;
  height: 150px;
  opacity: 0;
}

.menu-wrap .hamburger {
  position: absolute;
  top: 1.5rem;
  right: 0;
  z-index: 1;
  width: 100px;
  height: 60px;
  padding: 1rem;
  background: var(--primary-color);
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Hamburger Line */
.menu-wrap .hamburger > div {
  position: relative;
  flex: none;
  width: 100%;
  height: 10px;
  background: #000000;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.4s ease;
}

/* Hamburger Lines - Top & Bottom */
.menu-wrap .hamburger > div::before,
.menu-wrap .hamburger > div::after {
  content: '';
  position: absolute;
  z-index: 1;
  top: -20px;
  width: 100%;
  height: 10px;
  background: inherit;
}

/* Moves Line Down */
.menu-wrap .hamburger > div::after {
  top: 20px;
}

/* Toggler Animation */
.menu-wrap .toggler:checked + .hamburger > div {
  transform: rotate(135deg);
}

/* Turns Lines Into X */
.menu-wrap .toggler:checked + .hamburger > div:before,
.menu-wrap .toggler:checked + .hamburger > div:after {
  top: 0;
  transform: rotate(90deg);
}

/* Rotate On Hover When Checked */
.menu-wrap .toggler:checked:hover + .hamburger > div {
  transform: rotate(225deg);
}

/* Show Menu */
.menu-wrap .toggler:checked ~ .menu {
  visibility: visible;
}

.menu-wrap .toggler:checked ~ .menu > div {
  transform: scale(1);
  transition-duration: var(--menu-speed);
}

.menu-wrap .toggler:checked ~ .menu > div > div {
  opacity: 1;
  transition:  opacity 0.4s ease 0.4s;
}

.menu-wrap .menu {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  visibility: hidden;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}

.menu-wrap .menu > div {
  background: var(--overlay-color);
  border-radius: 50%;
  width: 300vw;
  height: 300vw;
  display: flex;
  flex: none;
  align-items: center;
  justify-content: center;
  transform: scale(0);
  transition: all 0.4s ease;
}

.menu-wrap .menu > div > div {
  max-width: 90vw;
  max-height: 100vh;
  opacity: 0;
  transition: opacity 0.4s ease;
}

.menu-wrap .menu > div > div > ul > li {
  list-style: none;
  color: #fff;
  font-size: 1.5rem;
  padding: 1rem;
}

.menu-wrap .menu > div > div > ul > li > a {
  color: inherit;
  text-decoration: none;
  transition: color 0.4s ease;
}


/* MESSAGE */

.message{
  margin-top: 361px;
  margin-bottom: 30px;
  width: 80%;
  font-family: 'SuisseIntl-Light';
  font-style: normal;
  font-weight: 300;
  font-size: 40px;
  line-height: 120%;
  letter-spacing: -0.02em;
}

/* CATEGORIE */

.espace{
  margin:40px 0!important;
}

.espace2{
  margin-top:40px!important;
}

.espace3{
  margin-bottom:40px!important;
}

.espace4{
  margin-bottom:60px!important;
}


.espace5{
  margin:150px 0 60px 0!important;
}


.bg-ink{
  display: inline-block;
  position: relative;
  left: 100%;
  transform: translateX(-100%);
  background-color: #1a1a1a;
  color:#ffffff;
  padding: 10px;
  margin-right: 0;
  margin-left: 0;
  text-transform: uppercase;
  padding: 10px 30px;
  scroll-margin-top: 321px;
}

footer{
  background-color: #1a1a1a;
  color:#ffffff;
  padding: 10px;
  margin-right: 0;
  margin-left: 0;
  scroll-margin-top: 321px;
}

h1{
  font-style: normal;
  font-weight: 500;
  font-size: 80px!important;
  line-height: 100%;
  letter-spacing: -0.02em;
}

h3{
  font-style: normal;
  font-weight: 500;
  font-size: 60px!important;
  line-height: 100%;
  letter-spacing: -0.02em;
  text-transform: uppercase;
}

h5{
  font-family: 'SuisseIntl-Light';
  font-style: normal;
  font-weight: 300;
  font-size: 40px!important;
  line-height: 100%;
  letter-spacing: -0.02em;
}

.h5-bold{
  font-family: 'SuisseIntl-Medium';
}

.italique{
  font-family: 'SuisseIntl-Light';
  font-weight: 300;
  font-size: 30px;
  line-height: 100%;
  letter-spacing: -0.02em;
  color: #515151;
}

.lines{

background-color: #1a1a1a;
height: 5px;
width: 80%;
margin: 5px auto;
}
.lines2{

  background-color: #1a1a1a;
  height: 5px;
  width: 10%;
  margin: 5px;
  }


.scrollmenu{

overflow: auto;
white-space: nowrap;
overflow-y: hidden;
}

div.scrollmenu a{

text-decoration: none;
text-transform: uppercase;
padding: 20px;
color: #1a1a1a;
font-size: 50px;

}

.menu div{
  display: flex;
  flex-direction: column;

}

.menu h2{

font-style: normal;
font-weight: 500;
font-size: 80px;
line-height: 21px;
text-align: center;
letter-spacing: 0.2em;
text-transform: uppercase;

}

.menu p{
font-family: 'SuisseIntl-Light';
font-style: normal;
font-weight: 300;
font-size: 50px;
line-height: 100%;
letter-spacing: -0.02em;
text-align: left;
}




/* FORM */

input {
  font-family: 'SuisseIntl-Light'!important;
  width: 100%;
  height: 100px;
  margin: 10px 10px 50px 10px!important;
  box-sizing: border-box;
  font-size: 50px!important;
  border: 5px solid #1a1a1a !important;
}

textarea{
  font-family: 'SuisseIntl-Light'!important;
  width: 100%;
  height: 100px;
  margin: 10px 10px 50px 10px!important;
  box-sizing: border-box;
  font-size: 50px!important;
  border: 5px solid #1a1a1a !important;
}

label{
  font-size: 50px!important;
}

.label{
  font-size: 50px!important;
}

button{
  width: 100%;
  height: 100px;
  margin: 10px 10px 50px 10px!important;
  box-sizing: border-box;
  font-size: 50px!important;
  color: #ffffff!important;
  background: #1a1a1a!important;
}

span.input-group-text{
  font-size: 50px!important;
}

select {
  font-family: 'SuisseIntl-Light'!important;
  width: 100%;
  height: 100px;
  margin: 10px 10px 50px 10px!important;
  box-sizing: border-box;
  font-size: 50px!important;
  border: 5px solid #1a1a1a !important;
}

option{
  font-family: 'SuisseIntl-Light'!important;
  font-size: 20px!important;
  background-color: #1a1a1a!;
}

.btn-xl{
  margin: 0 30px !important;
  padding: 10px 30px!important;
  font-size: 30px!important;
}



/* FOOTER */

footer a{
  font-family: 'SuisseIntl-Light';
  font-style: normal;
  font-weight: 300;
  font-size: 40px!important;
  text-decoration: none;
  border-bottom: 3px solid #ffffff;
  letter-spacing: -0.02em;
}