@font-face {
  font-family: 'Gotham';
  src: url("../font/Gotham-Light.woff") format("woff");
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Gotham';
  src: url("../font/Gotham-Book.woff") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

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

@font-face {
  font-family: 'Gotham';
  src: url("../font/Gotham-Bold.woff") format("woff");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Gotham';
  src: url("../font/Gotham-Black.woff") format("woff");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

html body {
  margin: 0 auto;
  padding: 0;
  font-family: 'Gotham';
  font-size: 3.73333vw;
  line-height: 5.33333vw;
  color: #58544C;
  max-width: 640px;
}

@media screen and (min-width: 640px) {
  html body {
    font-size: 24px;
    line-height: 34px;
  }
}

html body .retourFixed {
  position: fixed;
  top: 0;
  background-color: #0E4194;
  background-repeat: no-repeat;
  background-size: 100%;
  z-index: 5;
  width: 100%;
  padding: 3.46667vw 0;
  text-decoration: none;
  max-width: 640px;
  color: #fff;
}

html body .retourFixed span {
  padding-left: 11.73333vw;
  font-size: 4vw;
  line-height: 6.4vw;
  font-weight: 500;
  background-repeat: no-repeat;
  background-image: url("../img/flecheback.svg");
  background-position: left 5.33333vw center;
  background-size: 1.06667vw;
}

@media screen and (min-width: 640px) {
  html body .retourFixed {
    padding: 22.1px 0;
  }
  html body .retourFixed span {
    padding-left: 74.8px;
    font-size: 25.5px;
    line-height: 40.8px;
    background-position: left 34px center;
    background-size: 6.8px;
  }
}

html body .head {
  padding-bottom: 10.66667vw;
  margin-top: 13.33333vw;
}

@media screen and (min-width: 640px) {
  html body .head {
    padding-bottom: 68px;
    margin-top: 83.3px;
  }
}

html body .head .entete {
  position: relative;
}

html body .head .entete img {
  width: 100%;
  display: block;
  border-radius: 0 0 0 8vw;
}

@media screen and (min-width: 640px) {
  html body .head .entete img {
    border-radius: 0 0 0 51px;
  }
}

html body .head .logo {
  position: absolute;
  top: 5.33333vw;
  left: 5.33333vw;
  background-color: #fff;
  border-radius: 3.2vw;
  width: 42.66667vw;
  height: 19.2vw;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding: 3.46667vw 4vw 4vw 3.73333vw;
  -webkit-box-shadow: 0 0.8vw 1.6vw rgba(0, 0, 0, 0.16);
          box-shadow: 0 0.8vw 1.6vw rgba(0, 0, 0, 0.16);
}

html body .head .logo img {
  width: 100%;
  border-radius: 0;
}

@media screen and (min-width: 640px) {
  html body .head .logo {
    top: 34px;
    left: 34px;
    width: 272px;
    height: 122.4px;
    border-radius: 20.4px;
    padding: 22.1px 25.5px 25.5px 23.8px;
    -webkit-box-shadow: 0 5.1px 10.2px rgba(0, 0, 0, 0.16);
            box-shadow: 0 5.1px 10.2px rgba(0, 0, 0, 0.16);
  }
  html body .head .logo img {
    width: 200px;
  }
}

html body .head .logo.ogier {
  padding: 3.46667vw 0 4vw;
}

@media screen and (min-width: 640px) {
  html body .head .logo.ogier {
    padding: 22.1px 0 25.5px;
  }
  html body .head .logo.ogier img {
    width: 270px;
  }
}

html body .head .logo.champy {
  padding: 1.86667vw 8vw;
}

@media screen and (min-width: 640px) {
  html body .head .logo.champy {
    padding: 11.9px 51px;
  }
}

html body .head .logo.chablis {
  padding: 1.86667vw 5.06667vw;
}

@media screen and (min-width: 640px) {
  html body .head .logo.chablis {
    padding: 11.9px 32.3px;
  }
}

html body .head .logo.capet {
  padding: 3.73333vw 5.6vw;
}

@media screen and (min-width: 640px) {
  html body .head .logo.capet {
    padding: 23.8px 35.7px;
  }
}

html body .head .logo.cazes {
  padding: 3.46667vw 0 4vw;
}

html body .head .logo.cazes img {
  width: 16vw;
}

@media screen and (min-width: 640px) {
  html body .head .logo.cazes {
    padding: 22.1px 0 25.5px;
  }
  html body .head .logo.cazes img {
    width: 105px;
  }
}

html body .head .logo.bachelard img {
  max-width: 26.66667vw;
}

@media screen and (min-width: 640px) {
  html body .head .logo.bachelard img {
    max-width: 170px;
  }
}

html body .head .vinPremier {
  position: absolute;
  right: 0;
  top: 5.33333vw;
  width: 49.86667vw;
}

@media screen and (min-width: 640px) {
  html body .head .vinPremier {
    top: 34px;
    width: 319px;
  }
}

html body .head .nomDuvin {
  width: 46.66667vw;
  padding: 5.33333vw;
  font-size: 5.33333vw;
  line-height: 6.4vw;
  text-transform: uppercase;
  color: #58544C;
}

html body .head .nomDuvin span {
  font-weight: 700;
}

@media screen and (min-width: 640px) {
  html body .head .nomDuvin {
    width: 297.5px;
    padding: 34px;
    font-size: 34px;
    line-height: 40.8px;
  }
}

html body .head .profil {
  padding: 7.2vw 5.33333vw 8vw;
  line-height: 5.33333vw;
}

@media screen and (min-width: 640px) {
  html body .head .profil {
    padding: 46px 34px 51px;
    line-height: 34px;
  }
}

html body .head .enteteListing {
  position: relative;
  background-color: #0E4194;
  background-repeat: no-repeat;
  background-size: 100%;
  border-radius: 0 0 0 8vw;
}

@media screen and (min-width: 640px) {
  html body .head .enteteListing {
    border-radius: 0 0 0 51px;
  }
}

html body .head .enteteListing .nomEntete {
  position: relative;
  top: 0;
  padding: 6.93333vw 5.33333vw 9.06667vw;
  width: 100%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  text-align: center;
  font-weight: 600;
  color: #fff;
  font-size: 5.33333vw;
  line-height: 6.4vw;
  text-transform: uppercase;
}

@media screen and (min-width: 640px) {
  html body .head .enteteListing .nomEntete {
    padding: 44.2px 34px 57.8px;
    font-size: 34px;
    line-height: 40.8px;
  }
}

html body .head.special {
  padding-bottom: 9.6vw;
  margin-top: 0;
}

@media screen and (min-width: 640px) {
  html body .head.special {
    padding-bottom: 61.2px;
  }
}

html body .blocListing {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 0 3.46667vw 0;
  width: 100%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

@media screen and (min-width: 640px) {
  html body .blocListing {
    padding: 0 22.1px 0;
  }
}

html body .blocListing .blocU {
  -ms-flex-preferred-size: 50%;
      flex-basis: 50%;
  padding: 0 1.86667vw;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  padding-bottom: 12.53333vw;
  text-decoration: none;
}

@media screen and (min-width: 640px) {
  html body .blocListing .blocU {
    padding: 0 11.9px;
    padding-bottom: 79.9px;
  }
}

html body .blocListing .blocU img {
  margin-bottom: -8vw;
  width: 100%;
}

@media screen and (min-width: 640px) {
  html body .blocListing .blocU img {
    margin-bottom: -51px;
  }
}

html body .blocListing .blocU .blocNom {
  color: #0E4194;
  font-size: 2.66667vw;
  line-height: 3.2vw;
  text-transform: uppercase;
  text-align: center;
  padding: 8vw 2.66667vw 2.66667vw;
  border-radius: 2.66667vw;
  -webkit-box-shadow: 0 0 2.93333vw rgba(0, 0, 0, 0.1);
          box-shadow: 0 0 2.93333vw rgba(0, 0, 0, 0.1);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
}

@media screen and (min-width: 640px) {
  html body .blocListing .blocU .blocNom {
    font-size: 17px;
    line-height: 20.4px;
    padding: 51px 17px 17px;
    border-radius: 17px;
    -webkit-box-shadow: 0 0 18.7px rgba(0, 0, 0, 0.1);
            box-shadow: 0 0 18.7px rgba(0, 0, 0, 0.1);
  }
}

html body .blocListing .blocU .blocNom span {
  font-size: 3.2vw;
  line-height: 4.26667vw;
  padding-top: 2.66667vw;
  font-weight: 700;
  display: block;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

@media screen and (min-width: 640px) {
  html body .blocListing .blocU .blocNom span {
    font-size: 20.4px;
    line-height: 27.2px;
    padding-top: 17px;
  }
}

html body .containCarroussel {
  padding: 0 6.66667vw 10.66667vw 6.66667vw;
  margin: 0 3.46667vw;
}

@media screen and (min-width: 640px) {
  html body .containCarroussel {
    padding: 0 42.5px 68px 42.5px;
    margin: 0 22.1px;
  }
}

html body .carroussel {
  position: relative;
}

html body .carroussel .slick-dotted.slick-slider {
  margin: 0 !important;
}

html body .carroussel .blocCar {
  text-align: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

html body .carroussel .blocCar .bulle {
  margin: 0 auto;
}

html body .carroussel .blocCar .sousNom {
  padding: 2.66667vw 0 0 0;
  font-weight: 500;
  line-height: 4.26667vw;
}

@media screen and (min-width: 640px) {
  html body .carroussel .blocCar .sousNom {
    line-height: 27.2px;
    padding: 17px 0 0 0;
  }
}

html body .carroussel .blocCar .descriptif {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 2.4vw 9.33333vw 4vw 9.33333vw;
}

@media screen and (min-width: 640px) {
  html body .carroussel .blocCar .descriptif {
    padding: 15.3px 59.5px 25.5px 59.5px;
  }
}

html body .carroussel .slick-prev {
  left: -3.46667vw;
  background-repeat: no-repeat;
  background-image: url("../img/avant.svg");
  background-size: 3.46667vw;
  width: 3.46667vw;
  height: 6.93333vw;
}

@media screen and (min-width: 640px) {
  html body .carroussel .slick-prev {
    left: -22.1px;
    background-size: 22.1px;
    width: 22.1px;
    height: 44.2px;
  }
}

html body .carroussel .slick-prev:before {
  content: none;
}

html body .carroussel .slick-next {
  right: -3.46667vw;
  background-repeat: no-repeat;
  background-image: url("../img/apres.svg");
  background-size: 3.46667vw;
  width: 3.46667vw;
  height: 6.93333vw;
}

@media screen and (min-width: 640px) {
  html body .carroussel .slick-next {
    right: -22.1px;
    background-size: 22.1px;
    width: 22.1px;
    height: 44.2px;
  }
}

html body .carroussel .slick-next:before {
  content: none;
}

html body .carroussel .slick-dots {
  position: relative;
  bottom: initial;
}

html body .carroussel .slick-dots li {
  margin: 0;
  width: 5.33333vw;
}

html body .carroussel .slick-dots li button {
  width: 5.33333vw;
}

html body .carroussel .slick-dots li button:before {
  font-size: 2.66667vw;
}

@media screen and (min-width: 640px) {
  html body .carroussel .slick-dots li {
    width: 34px;
  }
  html body .carroussel .slick-dots li button {
    width: 34px;
  }
  html body .carroussel .slick-dots li button:before {
    font-size: 17px;
  }
}

html body .bulle {
  border-radius: 8vw;
  width: 13.33333vw;
  height: 13.33333vw;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

@media screen and (min-width: 640px) {
  html body .bulle {
    border-radius: 51px;
    width: 85px;
    height: 85px;
  }
}

html body .blocGustatif {
  margin: 0vw 5.33333vw 13.33333vw;
  padding: 5.6vw 5.33333vw 2.4vw;
  border-radius: 5.33333vw;
  -webkit-box-shadow: 0 0 2.93333vw rgba(0, 0, 0, 0.1);
          box-shadow: 0 0 2.93333vw rgba(0, 0, 0, 0.1);
}

@media screen and (min-width: 640px) {
  html body .blocGustatif {
    margin: 0px 34px 85px;
    padding: 35.7px 34px 15.3px;
    border-radius: 34px;
    -webkit-box-shadow: 0 0 18.7px rgba(0, 0, 0, 0.1);
            box-shadow: 0 0 18.7px rgba(0, 0, 0, 0.1);
  }
}

html body .blocGustatif .titleGus {
  font-weight: 700;
  text-transform: uppercase;
  padding-bottom: 2.66667vw;
}

html body .blocGustatif .ligne {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 78.66667vw;
  padding-bottom: 2.66667vw;
}

@media screen and (min-width: 640px) {
  html body .blocGustatif .ligne {
    width: 501.5px;
    padding-bottom: 17px;
  }
}

html body .blocGustatif .ligne .unPeu {
  width: 12vw;
}

@media screen and (min-width: 640px) {
  html body .blocGustatif .ligne .unPeu {
    width: 76.5px;
  }
}

html body .blocGustatif .ligne .bcp {
  width: 16.8vw;
}

@media screen and (min-width: 640px) {
  html body .blocGustatif .ligne .bcp {
    width: 107.1px;
  }
}

html body .blocGustatif .ligne img {
  padding-left: 2.66667vw;
  padding-right: 2.66667vw;
  width: 42.93333vw;
}

@media screen and (min-width: 640px) {
  html body .blocGustatif .ligne img {
    padding-left: 17px;
    padding-right: 17px;
    width: 273.7px;
  }
}

html body .blocMet {
  margin: 0 5.33333vw 10.66667vw;
}

@media screen and (min-width: 640px) {
  html body .blocMet {
    margin: 0 34px 68px;
  }
}

html body .blocMet .titleMet {
  font-weight: 700;
  text-transform: uppercase;
  padding-bottom: 5.33333vw;
}

@media screen and (min-width: 640px) {
  html body .blocMet .titleMet {
    padding-bottom: 34px;
  }
}

html body .blocMet .listMet {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding-bottom: 2.66667vw;
}

@media screen and (min-width: 640px) {
  html body .blocMet .listMet {
    padding-bottom: 17px;
  }
}

html body .blocMet .listMet .textMet {
  padding-left: 2.66667vw;
  width: 73.33333vw;
}

@media screen and (min-width: 640px) {
  html body .blocMet .listMet .textMet {
    padding-left: 17px;
    width: 467.5px;
  }
}

html body .blocMet .listMet:last-child {
  padding-bottom: 0;
}

html body .blocArome {
  margin: 0 5.33333vw;
  padding: 5.33333vw 8vw 2.66667vw 5.33333vw;
  border-radius: 5.33333vw;
  -webkit-box-shadow: 0 0 2.93333vw rgba(0, 0, 0, 0.1);
          box-shadow: 0 0 2.93333vw rgba(0, 0, 0, 0.1);
}

@media screen and (min-width: 640px) {
  html body .blocArome {
    margin: 0 34px;
    padding: 34px 51px 17px 34px;
    border-radius: 34px;
    -webkit-box-shadow: 0 0 18.7px rgba(0, 0, 0, 0.1);
            box-shadow: 0 0 18.7px rgba(0, 0, 0, 0.1);
  }
}

html body .blocArome .titleArome {
  font-weight: 700;
  text-transform: uppercase;
  padding-bottom: 2.66667vw;
}

@media screen and (min-width: 640px) {
  html body .blocArome .titleArome {
    padding-bottom: 17px;
  }
}

html body .blocArome .listMet {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  padding-bottom: 2.66667vw;
  line-height: 0;
}

@media screen and (min-width: 640px) {
  html body .blocArome .listMet {
    padding-bottom: 17px;
  }
}

html body .blocArome .listMet .nomMet {
  line-height: 4.26667vw;
}

@media screen and (min-width: 640px) {
  html body .blocArome .listMet .nomMet {
    line-height: 27.2px;
  }
}

html body .blocArome .listMet .listcheck {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

html body .blocArome .listMet .listcheck span {
  border-radius: 6.13333vw;
  width: 2.66667vw;
  height: 2.66667vw;
  background-color: #E2E0DC;
  margin-left: 2.66667vw;
  display: inline-block;
}

@media screen and (min-width: 640px) {
  html body .blocArome .listMet .listcheck span {
    border-radius: 39.1px;
    width: 17px;
    height: 17px;
    margin-left: 17px;
  }
}

html body .blocImgAv img {
  width: 100%;
  display: block;
  border-radius: 0 0 0 8vw;
}

@media screen and (min-width: 640px) {
  html body .blocImgAv img {
    border-radius: 0 0 0 51px;
  }
}

html body.vert .bulle {
  background-color: #9FD1B2;
}

html body.vert .listcheck span.active {
  background-color: #9FD1B2;
}

html body.DarkGreen .bulle {
  background-color: #B1BD05;
}

html body.DarkGreen .listcheck span.active {
  background-color: #B1BD05;
}

html body.brownLight .bulle {
  background-color: #AE9567;
}

html body.brownLight .listcheck span.active {
  background-color: #AE9567;
}

html body.brown .bulle {
  background-color: #B08735;
}

html body.brown .listcheck span.active {
  background-color: #B08735;
}

html body.red .bulle {
  background-color: #E20026;
}

html body.red .listcheck span.active {
  background-color: #E20026;
}

html body.purple .bulle {
  background-color: #5A315E;
}

html body.purple .listcheck span.active {
  background-color: #5A315E;
}

html body.camel .bulle {
  background-color: #C14D02;
}

html body.camel .listcheck span.active {
  background-color: #C14D02;
}

html body.orange .bulle {
  background-color: #D56D2E;
}

html body.orange .listcheck span.active {
  background-color: #D56D2E;
}

html body .blocCarte {
  padding: 5.33333vw;
  position: relative;
}

@media screen and (min-width: 640px) {
  html body .blocCarte {
    padding: 34px;
  }
}

html body .blocCarte .titleCarte {
  font-size: 5.33333vw;
  line-height: 6.4vw;
  text-transform: uppercase;
  font-weight: 500;
  padding-bottom: 2.66667vw;
}

@media screen and (min-width: 640px) {
  html body .blocCarte .titleCarte {
    font-size: 34px;
    line-height: 40.8px;
    padding-bottom: 17px;
  }
}

html body .blocCarte .textMap50 {
  width: 42.66667vw;
  padding-bottom: 1.33333vw;
}

@media screen and (min-width: 640px) {
  html body .blocCarte .textMap50 {
    width: 272px;
    padding-bottom: 8.5px;
  }
}

html body .blocCarte .cartefr {
  position: absolute;
  right: 6.66667vw;
  top: 15.46667vw;
  width: 40.26667vw;
}

@media screen and (min-width: 640px) {
  html body .blocCarte .cartefr {
    right: 42.5px;
    top: 98.6px;
    width: 256.7px;
  }
}

html body .blocCarte .cartefr img {
  width: 100%;
}

html body .buttonDcv {
  border-radius: 50.66667vw;
  background-color: #58544C;
  color: #fff;
  display: table;
  font-weight: 500;
  margin: 0 auto 8vw;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding: 5.33333vw;
  text-decoration: none;
}

@media screen and (min-width: 640px) {
  html body .buttonDcv {
    border-radius: 323px;
    margin: 0 auto 51px;
    padding: 34px;
  }
}

html body footer .reseaux {
  border: 1px solid #e2e0dc;
  padding: 5.33333vw 0 6.4vw 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: space-evenly;
      -ms-flex-pack: space-evenly;
          justify-content: space-evenly;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

@media screen and (min-width: 640px) {
  html body footer .reseaux {
    border: 1px solid #e2e0dc;
    padding: 34px 0 40.8px 0;
  }
}

html body footer .reseaux .bullefin {
  width: 10.66667vw;
  height: 10.66667vw;
  background-color: #58544C;
  border-radius: 8vw;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

@media screen and (min-width: 640px) {
  html body footer .reseaux .bullefin {
    width: 68px;
    height: 68px;
    border-radius: 51px;
  }
}

html body footer .reseaux .blocBulles {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 25.86667vw;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

@media screen and (min-width: 640px) {
  html body footer .reseaux .blocBulles {
    width: 164.9px;
  }
}

html body footer .reseaux .blocBulles.alone {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

html body footer .reseaux .logoF {
  width: 22.4vw;
}

@media screen and (min-width: 640px) {
  html body footer .reseaux .logoF {
    width: 142.8px;
  }
}

html body footer .reseaux .logoF.logoBio {
  width: 23.73333vw;
}

@media screen and (min-width: 640px) {
  html body footer .reseaux .logoF.logoBio {
    width: 151.3px;
  }
}

html body footer .mention {
  text-transform: uppercase;
  font-size: 2.66667vw;
  line-height: 4vw;
  text-align: center;
  padding: 2.66667vw;
}

@media screen and (min-width: 640px) {
  html body footer .mention {
    font-size: 17px;
    line-height: 25.5px;
    padding: 17px;
  }
}

html body .containPopin {
  position: absolute;
  height: 100%;
  width: 100%;
  max-width: 640px;
  bottom: 0;
}

html body .containPopin.active {
  display: none;
}

html body .popin {
  position: fixed;
  bottom: 0;
  margin: auto;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  width: 100%;
  max-width: 640px;
  padding: 6.66667vw 5.33333vw;
  background-color: #fff;
  -webkit-box-shadow: 0 0 2.93333vw rgba(0, 0, 0, 0.1);
          box-shadow: 0 0 2.93333vw rgba(0, 0, 0, 0.1);
  text-align: center;
}

@media screen and (min-width: 640px) {
  html body .popin {
    padding: 42.5px 34px;
    -webkit-box-shadow: 0 0 18.7px rgba(0, 0, 0, 0.1);
            box-shadow: 0 0 18.7px rgba(0, 0, 0, 0.1);
  }
}

html body .popin .textBasic {
  font-size: 3.73333vw;
  line-height: 5.86667vw;
  color: #0E4194;
}

@media screen and (min-width: 640px) {
  html body .popin .textBasic {
    font-size: 23.8px;
    line-height: 37.4px;
  }
}

html body .popin .btnValide {
  font-size: 3.2vw;
  line-height: 4vw;
  font-weight: 500;
  display: table;
  color: #fff;
  background-color: #0E4194;
  padding: 5.33333vw 10.66667vw;
  border-radius: 50.66667vw;
  margin: 5.33333vw auto 0;
  cursor: pointer;
}

@media screen and (min-width: 640px) {
  html body .popin .btnValide {
    font-size: 20.4px;
    line-height: 25.5px;
    padding: 34px 68px;
    border-radius: 323px;
    margin: 34px auto 0;
  }
}

html body .tonneau {
  width: 8.8vw;
}

@media screen and (min-width: 640px) {
  html body .tonneau {
    width: 56.1px;
  }
}

html body .homard {
  width: 7.46667vw;
}

@media screen and (min-width: 640px) {
  html body .homard {
    width: 47.6px;
  }
}

html body .viande {
  width: 7.73333vw;
}

@media screen and (min-width: 640px) {
  html body .viande {
    width: 49.3px;
  }
}

html body .fromage {
  width: 9.6vw;
}

@media screen and (min-width: 640px) {
  html body .fromage {
    width: 61.2px;
  }
}

html body .insta {
  width: 5.33333vw;
}

@media screen and (min-width: 640px) {
  html body .insta {
    width: 34px;
  }
}

html body .world {
  width: 5.6vw;
}

@media screen and (min-width: 640px) {
  html body .world {
    width: 35.7px;
  }
}

html body .sol {
  width: 5.86667vw;
}

@media screen and (min-width: 640px) {
  html body .sol {
    width: 37.4px;
  }
}

html body .raisin {
  width: 4.53333vw;
}

@media screen and (min-width: 640px) {
  html body .raisin {
    width: 28.9px;
  }
}

html body .horloge {
  width: 7.73333vw;
}

@media screen and (min-width: 640px) {
  html body .horloge {
    width: 49.3px;
  }
}

html body .poisson {
  width: 8.26667vw;
}

@media screen and (min-width: 640px) {
  html body .poisson {
    width: 52.7px;
  }
}

html body .poisson2 {
  width: 8.26667vw;
  padding-right: 0.53333vw;
}

@media screen and (min-width: 640px) {
  html body .poisson2 {
    width: 52.7px;
    padding-right: 3.4px;
  }
}

html body .vin {
  width: 3.46667vw;
}

@media screen and (min-width: 640px) {
  html body .vin {
    width: 22.1px;
  }
}

html body .boeuf {
  width: 8.53333vw;
}

@media screen and (min-width: 640px) {
  html body .boeuf {
    width: 54.4px;
  }
}

html body .sanglier {
  width: 7.46667vw;
}

@media screen and (min-width: 640px) {
  html body .sanglier {
    width: 47.6px;
  }
}

html body .nouilles {
  width: 6.13333vw;
}

@media screen and (min-width: 640px) {
  html body .nouilles {
    width: 39.1px;
  }
}

html body .brochette {
  width: 6.4vw;
}

@media screen and (min-width: 640px) {
  html body .brochette {
    width: 40.8px;
  }
}

html body .pie {
  width: 8vw;
}

@media screen and (min-width: 640px) {
  html body .pie {
    width: 51px;
  }
}

html body .planche {
  width: 7.46667vw;
  padding-left: 2.13333vw;
}

@media screen and (min-width: 640px) {
  html body .planche {
    width: 47.6px;
    padding-left: 13.6px;
  }
}

html body .veloute {
  width: 6.66667vw;
}

@media screen and (min-width: 640px) {
  html body .veloute {
    width: 42.5px;
  }
}
/*# sourceMappingURL=style.css.map */