@font-face {
  font-family: Helvetica;
  src: url("/font/Helvetica.ttf") format("ttf");
}
body {
  margin: 0;
  padding: 0;
  background-color: white;
  line-height: 1.2;
  color: #2c2a2b;
}

#mattxamv {
  font-family: Helvetica, Arial, sans-serif;
  font-size: clamp(25px, 2vw, 2vw);
  background-color: white;
  color: black;
  overflow: hidden;
  margin-bottom: 36px;
  /* Marquee*/
  /* Marquee titre*/
}
#mattxamv h1 {
  display: flex;
  align-items: baseline;
  position: relative;
  width: 100%;
  background-color: #2c2a2b;
  margin: 0;
  padding: 0;
}
#mattxamv h1 span {
  position: relative;
  display: inline-block;
  white-space: nowrap;
  text-transform: uppercase;
  font-size: clamp(100px, 31vw, 428px);
  line-height: clamp(100px, 25vw, 390px);
  vertical-align: middle;
  font-weight: 700;
  color: white;
  -moz-animation: marqueeTitre 30s linear infinite;
  -webkit-animation: marqueeTitre 30s linear infinite;
  animation: marqueeTitre 30s linear infinite;
}
#mattxamv h2 {
  margin: 36px 0;
  color: #2c2a2b;
  font-size: clamp(20px, 3vw, 3vw);
  font-weight: 800;
  text-transform: uppercase;
}
@media screen and (max-width: 690px) {
  #mattxamv h2 {
    margin: 9px 0;
  }
}
#mattxamv .bloc {
  position: relative;
}
#mattxamv .bloc--video iframe {
  display: block;
  width: 100%;
  height: auto;
}
#mattxamv .bloc--video .credit {
  text-align: center;
  margin-top: 54px;
  font-size: clamp(14px, 2vw, 28px);
}
#mattxamv .bloc--img img {
  display: block;
  width: 100%;
  height: auto;
}
#mattxamv .bloc--img span {
  position: absolute;
  display: inline-block;
  text-align: center;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%) rotate(1deg);
  text-transform: uppercase;
  color: #2c2a2b;
  background-color: white;
  font-weight: 700;
  font-size: clamp(14px, 3vw, 3vw);
  padding: 5px 54px 0 54px;
}
@media screen and (max-width: 690px) {
  #mattxamv .bloc--img span {
    padding: 5px 18px 0 18px;
  }
}
#mattxamv .bloc--emoji {
  text-align: right;
  margin: 0 5vw;
}
#mattxamv .bloc--emoji img {
  width: clamp(50px, 11vw, 200px);
  height: auto;
}
#mattxamv .bloc--main {
  display: flex;
  flex-direction: column;
  gap: 36px;
  margin: 0 5vw;
  font-size: clamp(16px, 3vw, 3vw);
}
@media screen and (max-width: 690px) {
  #mattxamv .bloc--main {
    gap: 18px;
  }
}
#mattxamv .bloc--second {
  margin: 0;
  padding: 72px 18px;
  font-size: clamp(18px, 2.5vw, 2.5vw);
  background-color: #2c2a2b;
}
#mattxamv .bloc--defile {
  display: flex;
  align-items: baseline;
  position: relative;
  gap: 12px;
  width: 100%;
  background-color: #ff5800;
  padding: 18px 0 9px 0;
}
@media screen and (max-width: 690px) {
  #mattxamv .bloc--defile {
    padding: 9px 0;
  }
}
#mattxamv .bloc--defile span {
  display: block;
  font-size: clamp(22px, 2.5vw, 2.5vw);
  font-weight: 700;
  white-space: nowrap;
  color: #fff;
  -moz-animation: marquee 5s linear infinite;
  -webkit-animation: marquee 5s linear infinite;
  animation: marquee 5s linear infinite;
}
#mattxamv .bloc--produits h2 {
  text-align: center;
  font-size: clamp(30px, 3vw, 55px);
  font-weight: 400;
  color: #2c2a2b;
  text-transform: none;
}
#mattxamv .bloc--produits h2 a {
  color: #2c2a2b;
  text-decoration: none;
}
#mattxamv .bloc--produits h2 a:hover {
  text-decoration: underline;
}
#mattxamv .bloc--produits .produits {
  display: flex;
  gap: 5px;
}
@media screen and (max-width: 690px) {
  #mattxamv .bloc--produits .produits {
    gap: 2px;
    flex-wrap: wrap;
  }
}
#mattxamv .bloc--produits .produits .img {
  display: block;
  width: calc(16.66% - 4px);
  padding: 54px 2vw;
  background-color: #eae9e5;
}
@media screen and (max-width: 690px) {
  #mattxamv .bloc--produits .produits .img {
    padding: 54px 18px;
    width: calc(33.33% - 2px);
  }
}
#mattxamv .bloc--produits .produits .img img {
  display: block;
  width: 100%;
  height: auto;
}
#mattxamv .bloc--footer {
  display: flex;
  flex-direction: column;
  gap: 0;
  border: 1px solid #2c2a2b;
  background-color: #fff;
  padding: 0;
  margin: 10.8px 18px;
  transform: rotate(0.5deg);
}
#mattxamv .bloc--footer:nth-of-type(odd) {
  transform: rotate(-0.5deg);
}
#mattxamv .bloc--footer .footer--title {
  display: flex;
  align-items: center;
  gap: 5px;
  justify-content: space-between;
  font-weight: 700;
  font-size: clamp(14px, 2vw, 30px);
  margin: 0;
  padding: 18px;
  border-bottom: 1px solid #2c2a2b;
}
#mattxamv .bloc--footer .footer--title img {
  display: block;
  width: clamp(20px, 2vw, 33px);
  height: auto;
}
#mattxamv .bloc--footer .footer--cnt {
  font-size: clamp(13px, 2vw, 30px);
  padding: 18px;
}
@-moz-keyframes marquee {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(-100%);
  }
}
@-webkit-keyframes marquee {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(-100%);
  }
}
@keyframes marquee {
  0% {
    -moz-transform: translateX(0%);
    -webkit-transform: translateX(0%);
    transform: translateX(0%);
  }
  100% {
    -moz-transform: translateX(-100%);
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
  }
}
@-moz-keyframes marqueeTitre {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(-100%);
  }
}
@-webkit-keyframes marqueeTitre {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(-100%);
  }
}
@keyframes marqueeTitre {
  0% {
    -moz-transform: translateX(0%);
    -webkit-transform: translateX(0%);
    transform: translateX(0%);
  }
  100% {
    -moz-transform: translateX(-100%);
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
  }
}

.gap-1 {
  width: 100%;
  height: 18px;
}
@media screen and (max-width: 690px) {
  .gap-1 {
    height: 36px;
  }
}
.gap-2 {
  width: 100%;
  height: 36px;
}
@media screen and (max-width: 690px) {
  .gap-2 {
    height: 36px;
  }
}
.gap-3 {
  width: 100%;
  height: 54px;
}
@media screen and (max-width: 690px) {
  .gap-3 {
    height: 36px;
  }
}
.gap-4 {
  width: 100%;
  height: 72px;
}
@media screen and (max-width: 690px) {
  .gap-4 {
    height: 36px;
  }
}
.gap-5 {
  width: 100%;
  height: 90px;
}
@media screen and (max-width: 690px) {
  .gap-5 {
    height: 36px;
  }
}
.gap-6 {
  width: 100%;
  height: 108px;
}
@media screen and (max-width: 690px) {
  .gap-6 {
    height: 36px;
  }
}

@media screen and (max-width: 690px) {
  .gap-3 {
    height: 9px;
  }
}

@media screen and (max-width: 690px) {
  .img--desk {
    display: none !important;
  }
}
@media screen and (min-width: 690px) {
  .img--mobile {
    display: none !important;
  }
}

/*# sourceMappingURL=mattxamv_v1-9.css.map */