@font-face {
  font-family: "Titan One";
  src: url("../fonts/TitanOne.woff2") format("woff2"),
    url("../fonts/TitanOne.woff") format("woff");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Rubik Mono One";
  src: url("../fonts/RubikMonoOne-Regular.woff2") format("woff2"),
    url("../fonts/RubikMonoOne-Regular.woff") format("woff");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Rubik";
  src: url("../fonts/Rubik-Light.woff2") format("woff2"),
    url("../fonts/Rubik-Light.woff") format("woff");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Rubik";
  src: url("../fonts/Rubik-Black.woff2") format("woff2"),
    url("../fonts/Rubik-Black.woff") format("woff");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Rubik";
  src: url("../fonts/Rubik-Bold.woff2") format("woff2"),
    url("../fonts/Rubik-Bold.woff") format("woff");
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Rubik";
  src: url("../fonts/Rubik-Medium.woff2") format("woff2"),
    url("../fonts/Rubik-Medium.woff") format("woff");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Rubik";
  src: url("../fonts/Rubik-Regular.woff2") format("woff2"),
    url("../fonts/Rubik-Regular.woff") format("woff");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  overflow-x: hidden;
  font-family: "Rubik", sans-serif;
  color: #808080;
  letter-spacing: 0.7px;
}

.mediaUne .bouton {
  display: none;
}

.texteCTA {
  display: none;
}

.titreAccueil {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 0 8%;
}

.titreAccueil h4 {
  font-size: 2rem;
  margin: 1% 0;
  text-align: center;
  text-transform: unset;
}

.titreAccueil h1 {
  font-size: 1rem;
  text-align: center;
  text-transform: unset;
}
.titreAccueil h2 {
  font-size: 1rem;
  text-align: center;
  text-transform: unset;
}

.refe {
  position: absolute;
  bottom: -3000vh;
  max-width: 90vw;
}
.refe img {
  width: 300px;
}

.container {
  overflow: hidden;
  background-color: white;
  position: relative;
  z-index: 2;
  padding: 0 0 6%;
}

.containerIndustrie {
  overflow: hidden;
  background-color: white;
  position: relative;
  z-index: 2;
}

.pageConstructionText {
  font-size: 3rem;
  font-weight: bold;
  color: #15acc9;
  line-height: 60px;
}

footer {
  position: relative;
  z-index: 2;
}

p {
  font-weight: 400;
  line-height: 21px;
}
strong {
  font-weight: 400;
}

.blue {
  color: #15acc9;
  font-weight: 700;
}

h1,
h2,
h3,
h4,
h5 {
  text-transform: uppercase;
  font-weight: 700;
}

#photo-fond,
#video-fond {
  overflow: hidden;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -1;
}

#photo-fond > picture img,
#video-fond > video {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

header {
  position: fixed;
  background-color: #cf4937;
  height: 60px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  z-index: 10;
  width: 100%;
}

.social {
  margin-right: 100px;
}

.social ul {
  display: flex;
  list-style: none;
  padding: 0;
}

.social img {
  width: 20px;
  margin: 0 5px;
}

.menu-back {
  background-color: #15acc9;
}

.brand img {
  width: 100px;
}

.brand {
  margin-left: 20px;
  margin-top: 64px;
  z-index: 3;
}

/* ///////////////////////////////////////// NAV PAGE VIDEO /////////////// */
.nav-video ul {
  display: flex;
  list-style: none;
  margin: 0 auto;
  padding: 0;
}

.nav-video ul li {
  margin: 0 10px;
}

.nav-video ul a {
  text-decoration: none;
  color: white;
  text-transform: uppercase;
  font-size: 0.8rem;
}

/* ///////////////////////////////////////// VIDEO TOP /////////////// */

.firstSectinonVideo {
  position: relative;
  height: 100vh;
  width: 100%;
  overflow: hidden;
}

.firstPartVideo,
.titrePageSecondaire {
  position: relative;
  height: 100vh;
  width: 100vw;
  display: flex;
  align-items: center;
  z-index: 0;
  color: white;
}

.grandTitre {
  margin-left: 5%;
  margin-top: 6%;
}

.grandTitre .bouton {
  justify-content: unset;
}

.grandTitre .bouton a {
  background-color: #cf4937;
}

.grandTitre h2 {
  font-size: 5rem;
  text-transform: initial;
  margin-bottom: 0;
}

.grandTitre h3 {
  font-size: 3rem;
  text-transform: initial;
  margin: 0;
}

.BBBspan {
  color: #cf4937;
}

.bleu {
  color: #15acc9;
}

.orange {
  color: #cf4937;
  font-weight: 700;
}

.titrePageSecondaire p {
  text-decoration: none;
  font-size: 6.5rem;
  color: white;
  text-transform: uppercase;
  font-weight: 900;
  margin: 7% 0;
}

.punchline {
  position: absolute;
  bottom: 10px;
  right: 10px;
  z-index: 2;
  color: white;
}

.aideScroll {
  position: absolute;
  bottom: 0;
  right: 0;
  left: 0;
  z-index: 2;
  text-align: center;
  display: flex;
  flex-direction: column;
  /* background-color: #cf4937; */
}

.aideScroll p {
  font-size: 0.6rem;
  color: white;
  font-weight: 600;
}

.aideScroll img {
  width: 20px;
  margin: 0 auto;
  animation: bounce2 1s ease infinite alternate;
}

/* ////////////// section full video //////////////// */

.videoDePresentation{
  display: flex;
  justify-content: center;
}

.videoFullContainer{
  width: 80%;
}


/* ///////////////////////////////////////// section affiche + BBB /////////////// */

.BBB {
  background-color: #fffaf3;
  padding: 3% 5%;
  display: flex;
  align-items: center;
}

.photoUnique {
  width: 45%;
  text-align: center;
}

.photoUnique img {
  width: 85%;
}

.BBB article {
  width: 45%;
  display: flex;
  flex-direction: column;
  padding-left: 5%;
}

.titreArticle {
  color: #cf4937;
  font-size: 4.5rem;
  font-weight: bold;
  margin: 0;
  text-transform: none;
}

.complementTitreArticle {
  color: #cf4937;
  font-size: 2.3rem;
  font-weight: 200;
  margin: 0;
  text-transform: none;
}

.sousTitreArticle {
  color: #707070;
  font-size: 1.6rem;
  font-weight: bold;
  margin: 4% 0 4%;
  line-height: 35px;
  text-transform: none;
}

.texteArticle {
  font-weight: 100;
  line-height: 26px;
}

.BBB .bouton {
  margin: 5% 0 0;
  justify-content: unset;
}

/* ///////////////////////////////////////// section programme /////////////// */
.programme {
  padding: 4% 10% 6%;
}

.intro {
  text-align: center;
}

.intro h2 {
  color: #cf4937;
  font-size: 2.5rem;
  text-transform: none;
}

.intro p {
  font-size: 1, 2rem;
  color: #707070;
}

.chiffreGras {
  font-weight: bold;
}

.troisPhotosLigne {
  display: flex;
  justify-content: space-around;
  margin: 5% 0;
}

.troisPhotosLigne picture {
  width: 30%;
}
.troisPhotosLigne img {
  width: 100%;
}

.programmeParDate {
  display: flex;
  text-align: center;
  justify-content: space-around;
}

.programmeParDate article {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 40%;
}

.date {
  color: #cf4937;
  text-transform: uppercase;
  font-size: 1.5rem;
}

.heure {
  font-weight: bold;
  color: #707070;
  margin: 0 auto;
  font-size: 1.1rem;
}

.heureBas {
  font-weight: bold;
  color: #707070;
  margin: 5% 0 0;
  font-size: 1.1rem;
}

.drescProgramme {
  margin: 2% 0;
  font-weight: 100;
}

/* ///////////////////////////////////////// section invités /////////////// */
.invites {
  padding: 4% 6% 6%;
  background-color: #fff6ea;
}

.ensembleCaseInvites {
  display: flex;
  justify-content: space-between;
  margin-top: 5%;
}

.ensembleCaseInvites2 {
  display: flex;
  justify-content: space-evenly;
  margin-top: 6%;
  margin-bottom: 5%;
}

.caseInvite {
  width: 300px;
  position: relative;
}

.caseInvite img {
  width: 100%;
}

.caseInvite a {
  width: 216px;
  position: absolute;
  bottom: -16px;
  left: -30px;
  padding: 2% 7%;
  border-radius: 25px;
  text-decoration: none;
  color: white;
  background-color: #cf4937;
}

.caseInvite a .boutonInvites {
  display: flex;
  justify-content: space-between;
  background-color: #cf4937;
}

.caseInvite a .boutonInvites img {
  width: 20px;
}

.caseInvite a p {
  margin: 0;
  font-size: 0.9rem;
  line-height: 17px;
}

.caseInvite a .nomDomaineInvite {
  font-weight: 100;
}

.caseInvite a .nomInvite {
  font-weight: 600;
}

/* ///////////////////////////////////////// section vignerons /////////////// */

.vignerons .intro {
  padding: 5% 14% 2%;
}

.containerListeVignerons {
  padding: 0 2% 5%;
  display: flex;
  justify-content: space-between;
}

.colonneListeVignerons {
  width: 30%;
}

.colonneListeVignerons a {
  text-decoration: none;
  color: #707070;
  margin-bottom: 3%;
}

.celluleListeVigneron {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border: 0.5px solid #c7c7c7;
  border-radius: 0 25px 25px 0;
  width: 100%;
  margin-bottom: 2%;
  transition: all 0.3s ease;
}

.celluleListeVigneron:hover {
  border: 0.5px solid #cf4937;

  transition: all 0.3s ease;
}

.plusListeVignerons {
  width: 26px;
  margin-right: 2px;
}

.nomsListeVignerons p {
  margin: 0;
  font-size: 0.8rem;
}
.logoDomaineList {
  margin-left: 10px;
}

/* ///////////////////////////////////////// pages description domaine /////////////// */
.socialDomaineListe {
  display: flex;
  align-items: center;
  margin-bottom: 2%;
}

.socialDomaineListe a {
  color: #707070;
  text-decoration: none;
}

.imgSocialeDomaine {
  width: 30px;
  margin-right: 10px;
}

.imgSocial3 {
  width: 30px;
  margin-right: 10px;
  margin-top: 2%;
}

.logoDomaineDescription {
  width: 300px;
  margin: 4% 0;
}

.DescDomaine {
  background-color: white;
}

.DescDomaine h1 {
  font-size: 1rem;
  font-weight: bold;
  text-transform: unset;
  line-height: 29px;
}

.DescDomaine h2 {
  font-size: 0.9rem;
  font-weight: 100;
  text-transform: unset;
}

.firstPartDescDomaine {
  padding: 6% 6% 0 !important;
}

.troisSocialDomaine {
  margin-bottom: 4%;
}

.logoDomaineDescriptionRichardRottier {
  width: 116px;
  margin: 4% 0;
}

.logoDomaineDescriptionAtmosphere {
  width: 250px;
  margin: 4% 0 0 0;
}

.logoDomaineDescriptionPizay {
  width: 250px;
  margin: 0 0 4% 0;
}

.ensembleCaseInvites2 {
  justify-content: space-evenly;
}
/* ///////////////////////////////////////// CTA /////////////// */
.call-to-action {
  position: relative;
  z-index: 2;
  /* width: 100%; */
  background-color: #15acc9;
  padding: 2% 10%;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.call-to-action > div {
  width: 489px;
  display: flex;
  justify-content: space-around;
}

.call-to-action p {
  color: white;
  font-size: 1.2rem;
  font-weight: 600;
}

.ctaFirst {
  display: flex;
  align-items: center;
}

.ctaFirst a {
  font-size: 1rem;
  font-weight: 600;
  text-decoration: none;
  color: white;
  text-transform: uppercase;
  border: 2px solid white;
  padding: 17px 21px;
  border-radius: 50px;
  transition: 0.3s ease-in-out;
}

.ctaFirst a:hover {
  transform: scale(1.1);
  transition: 0.3s ease-in-out;
}
/* ///////////////////////////////////////// FOOTER /////////////// */

footer {
  background-color: #cf4937;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex !important;
  -webkit-box-align: center;
  -ms-flex-align: center;
  /* align-items: center; */
  align-items: flex-start;
}

.titreFooter {
  font-size: 2rem;
  margin-bottom: 3%;
  color: white;
}

footer a {
  color: white;
  text-decoration: none;
  margin: 1% 0;
  font-size: 1.2rem;
  font-weight: 200;
  -webkit-transition: 0.2s;
  -o-transition: 0.2s;
  transition: 0.2s;

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

footer a:hover {
  color: white;
  -webkit-transition: 0.3s;
  -o-transition: 0.3s;
  transition: 0.3s;
}

footer p {
  color: white;
  margin: 1% 0;
  font-size: 1.2rem;
  font-weight: 200;
}

footer div {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  text-align: left;
  margin: 2%;
}

.adress {
  width: 30%;
}

.adress img {
  width: 156px;
  margin-bottom: 3%;
}

.icon-footer {
  width: 15px;
  margin-right: 2%;
}

/* ////////////////////////////////////////////////////////// PAGES SECONDAIRE ///////////////*/

.actu {
  display: flex;
  flex-direction: column;
  /* background-color: #e6582608; */
  padding: 5% 0;
  margin-bottom: 0%;
}

.aLaUne {
  display: flex;
  justify-content: space-around;
  padding: 6% 6%;
  align-items: flex-start;
}

.diffuseRecemment {
  display: flex;
  justify-content: space-around;
  padding: 5% 4%;
}

.articleUne,
.articleDiffuseRecemment {
  width: 45%;
}

.titrePrincipaleAlaUne,
.titrePrincipalDifuseRecement {
  display: flex;
}

.articleUne div img,
.articleDiffuseRecemment div img {
  width: 100px;
  margin-right: 10px;
  margin-bottom: -4px;
}

.titrePrincipaleAlaUne h3 {
  color: #cf4937;
  font-size: 4.5rem;
  font-weight: bold;
  margin: 0;
  text-transform: none;
}

.titrePrincipalDifuseRecement h3 {
  color: #707070;
  font-size: 2.5rem;
  font-weight: bold;
  margin: 0;
  text-transform: none;
}

.textesAlaUne .soustitreAlaUne {
  color: #707070;
  font-size: 1.8rem;
  font-weight: bold;
  margin: 4% 0 4%;
  line-height: 35px;
}

.textesAlaUne p {
  font-weight: 100;
  line-height: 26px;
}

.textesAlaUne h1 {
  font-size: 1rem;
  font-weight: bold;
  text-transform: unset;
  line-height: 29px;
}

.textesAlaUne h2 {
  font-size: 0.9rem;
  font-weight: 100;
  text-transform: unset;
}

.mediaUne {
  width: 42%;
}

.mediaDiffuseRecemment {
  width: 47%;
}

.mediaUne img {
  width: 100%;
  margin: 0 0 5% 0;
}

.boutonPageSecondaire {
  display: flex;
  justify-content: center;
  width: 100%;
  margin-top: 8%;
}
.bouton {
  margin: 0 auto;
  width: 100%;
  display: flex;
  justify-content: center;
}
.bouton a {
  background-color: #cf4937;
  color: white;
  text-decoration: none;
  font-size: 1rem;
  /* font-weight: bold; */
  padding: 16px 30px;
  border-radius: 30px;
  -webkit-box-shadow: 10px 10px 28px -15px rgba(0, 0, 0, 0.75);
  -moz-box-shadow: 10px 10px 28px -15px rgba(0, 0, 0, 0.75);
  box-shadow: 10px 10px 28px -15px rgba(0, 0, 0, 0.75);
  -webkit-transition: 0.3s;
  -o-transition: 0.3s;
  transition: 0.3s;
}

.bouton a:hover {
  transform: scale(1.1);
  -webkit-transition: 0.3s;
  -o-transition: 0.3s;
  transition: 0.3s;
}

.boldSpan {
  font-weight: bold;
}

@keyframes bounce2 {
  from {
    transform: translateY(0);
  }
  to {
    transform: translateY(-7px);
  }
}
/* /////////////////////////////////////////////////////// MEDIA QUERRY /////// */

/* 1. Pas de support d'object-fit */
@media (min-aspect-ratio: 16/9) {
  #video-fond > video {
    height: 300%;
    top: -100%;
  }
  #photo-fond > picture img {
    height: 300%;
    top: -100%;
  }
}
@media (max-aspect-ratio: 16/9) {
  #video-fond > video {
    width: 300%;
    left: -100%;
  }
  #photo-fond > picture img {
    width: 300%;
    left: -100%;
  }
}
/* 2. En cas de support d'object-fit, écrase les règles en (1) */
@supports (object-fit: cover) {
  #video-fond > video {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    object-fit: cover;
  }
  #photo-fond > picture img {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    object-fit: cover;
  }
}

@media screen and (max-width: 1200px) {
  .mediaUne {
    width: 40%;
  }
}

@media screen and (max-width: 1150px) {
  .caseInvite {
    width: 250px;
  }
}

@media screen and (max-width: 1090px) {
  /* .titrePrincipalDroneIndustrie h3 {
    font-size: 1.9rem;
  } */
  .titrePrincipalDifuseRecement h3 {
    font-size: 2rem;
  }

  .textesAlaUne p {
    line-height: 24px;
  }
  .titrePrincipaleAlaUne h3 {
    font-size: 3.5rem;
  }
  .articleUne div img,
  .articleDiffuseRecemment div img {
    width: 80px;
  }
  .textesAlaUne .soustitreAlaUne {
    font-size: 1.5rem;
    line-height: 28px;
  }

  .titreFooter {
    font-size: 1.5rem;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
  }

  footer a,
  footer p {
    font-size: 1rem;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
  }
  .diffuseRecemment {
    padding: 10% 15% 0%;
  }

  .titreArticle {
    font-size: 3.5rem;
  }

  .sousTitreArticle {
    font-size: 1.5rem;
  }

  .complementTitreArticle {
    font-size: 2rem;
  }
  .colonneListeVignerons {
    width: 32%;
  }
}

@media screen and (max-width: 1020px) {
  .aLaUne {
    flex-direction: column;
    padding: 6% 15% 0;
  }
  .articleUne,
  .articleDiffuseRecemment {
    width: 100%;
  }

  .ctaMediaUne {
    width: 100%;
  }

  .articleUne .bouton {
    display: none;
  }
  .mediaUne .bouton {
    display: flex;
    margin-top: 12%;
  }
  .mediaUne {
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-around;
  }
  .mediaUne img {
    width: 56%;
  }

  .mediaUne picture {
    text-align: center;
  }

  .texteCTA {
    display: block;
  }
  .mediaUne {
    flex-direction: column-reverse;
  }
  .mediaUne .bouton {
    display: flex;
    margin-top: 0%;
    justify-content: flex-start;
    margin-bottom: 9%;
  }
  .mediaUne img {
    width: 80%;
  }

  .BBB {
    flex-direction: column-reverse;
  }

  .photoUnique {
    width: 86%;
    text-align: start;
    margin: 8% 0;
  }

  .photoUnique img {
    width: 50%;
  }

  .BBB article {
    width: 85%;
    padding-left: 0;
  }
}

@media screen and (max-width: 980px) {
  .containerListeVignerons {
    padding: 0 2% 5%;
    flex-direction: column;
    align-items: center;
  }

  .colonneListeVignerons {
    width: 44%;
  }
}

@media screen and (max-width: 940px) {
  .nav-video {
    display: none;
  }
  /* .mediaUne {
    display: none;
  } */

  .articleUne {
    margin-bottom: 0%;
  }

  .ensembleCaseInvites,
  .ensembleCaseInvites2 {
    flex-direction: column;
  }

  .containerCaseInvites {
    display: flex;
    justify-content: space-around;
  }

  .caseInvite {
    margin-bottom: 24%;
  }
}

@media screen and (max-width: 840px) {

  .videoFullContainer{
    width: 90%;
  }
  .troisPhotosLigne2 {
    display: none;
  }

  .aLaUne,
  .diffuseRecemment {
    padding: 6% 5% 0;
  }

  .diffuseRecemment {
    padding: 12% 10% 0;
  }

  .titrePrincipaleAlaUne {
    margin-left: 0px;
  }

  .mediaUne picture {
    text-align: center;
    padding: 10% 7%;
  }
  .ctaMediaUne {
    width: 84%;
    padding: 0 7%;
  }

  /* .brand img {
    width: 120px;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
  } */

  /* .brand {
    top: 8px;
    left: 8px;
    -webkit-transition: 0.4s;
    -o-transition: 0.4s;
    transition: 0.4s;
  } */
  .mediaUne {
    flex-direction: column-reverse;
  }
  .mediaUne .bouton {
    display: flex;
    margin-top: 0%;
    justify-content: flex-start;
    margin-bottom: 9%;
  }
  .mediaUne img {
    width: 80%;
  }

  .troisPhotosLigne {
    flex-direction: column;
    align-items: center;
  }

  .troisPhotosLigne picture {
    width: 70%;
    margin-bottom: 3%;
  }

  .programmeParDate {
    flex-direction: column;
    align-items: center;
  }

  .programmeParDate article {
    width: 90%;
  }

  .colonneListeVignerons {
    width: 60%;
  }
}

@media screen and (max-width: 780px) {

  .videoFullContainer{
    width: 100%;
    margin: 10% 0 -5%;
  }

  .photoUnique img {
    width: 70%;
  }

  footer {
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
  }

  footer {
    padding: 6% 0 4% 7%;
  }
  .adress {
    width: 100%;
  }

  .colonneListeVignerons {
    width: 80%;
  }
}

@media screen and (max-width: 660px) {
  .containerCaseInvites {
    flex-direction: column;
    align-items: center;
  }

  .caseInvite {
    margin-bottom: 20%;
  }

  .ensembleCaseInvites2 {
    margin-top: 0%;
  }

  .caseInvite {
    width: 400px;
  }
  .colonneListeVignerons {
    width: 90%;
  }
}

@media screen and (max-width: 600px) {
  .call-to-action > div {
    flex-direction: column;
    text-align: center;
  }
  .ctaFirst {
    justify-content: center;
  }

  .grandTitre h2 {
    font-size: 4rem;
  }
  .grandTitre h3 {
    font-size: 2rem;
  }
  .mediaUne img {
    width: 100%;
  }

  .mediaUne picture {
    padding: 10% 0%;
  }

  .troisPhotosLigne picture {
    width: 100%;
  }

  .ctaMediaUne {
    padding: 0;
  }

  .BBB {
    padding: 3% 0%;
  }
}

@media screen and (max-width: 526px) {
  .mediaUne img {
    width: 100%;
  }

  .photoUnique img {
    width: 100%;
  }
  .colonneListeVignerons {
    width: 95%;
  }
}

@media screen and (max-width: 490px) {
  .caseInvite {
    width: 360px;
  }
  footer a,
  footer p {
    font-size: 0.9rem;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
  }
}

@media screen and (max-width: 470px) {
}

@media screen and (max-width: 430px) {
  .caseInvite {
    width: 330px;
  }

  .titrePrincipaleAlaUne h3,
  .titreArticle {
    font-size: 3rem;
  }

  .textesAlaUne .soustitreAlaUne,
  .sousTitreArticle {
    font-size: 1.3rem;
  }

  .complementTitreArticle {
    font-size: 1.6rem;
  }
}

@media screen and (max-width: 400px) {
  .caseInvite {
    width: 300px;
  }
  .grandTitre h2 {
    font-size: 3.5rem;
  }
  .grandTitre h3 {
    font-size: 1.7rem;
  }
}

@media screen and (max-width: 1400px) {
}

@media screen and (max-width: 1200px) {
}

@media screen and (max-width: 1090px) {
}

@media screen and (max-width: 840px) {
}

@media screen and (max-width: 780px) {
}

@media screen and (max-width: 540px) {
}

@media screen and (max-width: 490px) {
}

@media screen and (max-width: 384px) {
}