@charset "UTF-8";
@font-face {
  font-family: 'Open Sans regular';
  src: url("../fonts/Open Sans.eot");
  src: url("../fonts/Open Sans.eot?#iefix") format("embedded-opentype"), url("../fonts/Open Sans.woff2") format("woff2"), url("../fonts/Open Sans.woff") format("woff"), url("../fonts/Open Sans.svg#Open Sans") format("svg");
  font-weight: 400;
  font-style: normal;
  font-stretch: normal;
  unicode-range: U+0020-2212; }

@font-face {
  font-family: 'Open Sans bold';
  src: url("../fonts/Open Sans Bold.eot");
  src: url("../fonts/Open Sans Bold.eot?#iefix") format("embedded-opentype"), url("../fonts/Open Sans Bold.woff2") format("woff2"), url("../fonts/Open Sans Bold.woff") format("woff"), url("../fonts/Open Sans Bold.svg#Open Sans Bold") format("svg");
  font-weight: 700;
  font-style: normal;
  font-stretch: normal;
  unicode-range: U+0020-2074; }

@font-face {
  font-family: 'Caribbean';
  src: url("../fonts/Caribbean Regular.eot");
  src: url("../fonts/Caribbean Regular.eot?#iefix") format("embedded-opentype"), url("../fonts/Caribbean Regular.woff2") format("woff2"), url("../fonts/Caribbean Regular.woff") format("woff"), url("../fonts/Caribbean Regular.svg#Caribbean Regular") format("svg");
  font-weight: 400;
  font-style: normal;
  font-stretch: normal;
  unicode-range: U+0020-00AE; }

/*! Generated by Font Squirrel (https://www.fontsquirrel.com) on June 17, 2019 */
@font-face {
  font-family: 'exobold';
  src: url("../fonts/old-webfont.woff2") format("woff2"), url("../fonts/exo-bold-webfont.woff") format("woff");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'exoregular';
  src: url("../fonts/exo-regular-webfont.woff2") format("woff2"), url("../fonts/exo-regular-webfont.woff") format("woff");
  font-weight: normal;
  font-style: normal; }

a {
  -webkit-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out; }

.navbar-brand:hover {
  color: rgba(255, 255, 255, 0.5) !important; }

h1 {
  text-transform: uppercase;
  font-family: 'exoregular';
  color: gray;
  text-align: center; }
  @media (max-width: 768px) {
    h1 {
      letter-spacing: .1vw;
      font-size: 4.4vw;
      margin-top: 4vw;
      margin-bottom: 4vw; } }
  @media (min-width: 768px) {
    h1 {
      letter-spacing: calc(.5px + (1 - .5) * ((100vw - 300px) / (1600 - 300)));
      font-size: calc(18px + (35 - 18) * ((100vw - 300px) / (1600 - 300))); } }

h2 {
  font-family: 'exoregular';
  line-height: 1.5;
  color: #404040; }
  @media (max-width: 768px) {
    h2 {
      letter-spacing: .09vw;
      font-size: 3vw; } }
  @media (min-width: 768px) {
    h2 {
      letter-spacing: calc(.5px + (1 - .5) * ((100vw - 300px) / (1600 - 300)));
      font-size: calc(16px + (34 - 17) * ((100vw - 300px) / (1600 - 300))); } }

h3 {
  font-family: 'exoregular';
  letter-spacing: calc(.5px + (1 - .5) * ((100vw - 300px) / (1600 - 300)));
  margin-bottom: 0;
  font-size: calc(13px + (26 - 13) * ((100vw - 300px) / (1600 - 300)));
  color: #202020;
  text-transform: none;
  margin: 0; }

h4 {
  font-family: 'exoregular';
  letter-spacing: calc(.5px + (1 - .5) * ((100vw - 300px) / (1600 - 300)));
  font-size: calc(10px + (20 - 10) * ((100vw - 300px) / (1600 - 300)));
  color: #101010; }

p {
  font-family: 'exoregular';
  letter-spacing: calc(.3px + (.6 - .3) * ((100vw - 300px) / (1600 - 300)));
  font-size: calc(11px + (22 - 11) * ((100vw - 300px) / (1600 - 300)));
  line-height: 1.5;
  color: black; }

.img-bloc {
  display: block;
  height: 100%;
  width: 100%;
  position: relative;
  z-index: 0; }
  .img-bloc img.bg {
    z-index: 1;
    width: inherit;
    height: inherit; }
  .img-bloc img.flag {
    position: absolute;
    top: 5%;
    left: 3%;
    z-index: 2; }
  .img-bloc h4 {
    position: absolute;
    text-transform: uppercase;
    text-align: center;
    width: 15%;
    top: 5%;
    right: 3%;
    margin-bottom: 0;
    color: white;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 2; }
  .img-bloc h3,
  .img-bloc p {
    position: absolute;
    bottom: 0;
    margin-left: 0;
    margin-bottom: 0;
    width: 100% !important;
    background-color: rgba(0, 0, 0, 0.5) !important;
    padding: 0 0 0 3% !important;
    text-align: left;
    color: white !important;
    border-radius: 0 !important;
    z-index: 2; }

.cta {
  text-align: center !important;
  text-transform: uppercase;
  font-family: 'exoregular';
  background-color: transparent;
  display: block;
  border-color: black; }
  @media (max-width: 576px) {
    .cta {
      width: 37vw;
      margin: 3.5vw auto;
      border: .1rem solid; } }
  @media (min-width: 576px) {
    .cta {
      width: 11rem;
      margin: 1.7rem auto;
      border: .11rem solid; } }
  @media (min-width: 768px) {
    .cta {
      width: 12rem;
      margin: 2rem auto;
      border: .11rem solid; } }
  @media (min-width: 992px) {
    .cta {
      width: 12rem;
      margin: 2rem auto;
      border: .11rem solid; } }
  @media (min-width: 1200px) {
    .cta {
      width: 12rem;
      margin: 2.1rem auto;
      border: .11rem solid; } }
  .cta:hover {
    color: rgba(0, 0, 0, 0.7);
    background-color: rgba(0, 0, 0, 0.1);
    text-decoration: none !important; }

.cta-content {
  color: black;
  border-color: black;
  font-size: calc(12px + (24 - 12) * ((100vw - 300px) / (1600 - 300)));
  height: calc(28px + (56 - 28) * ((100vw - 300px) / (1600 - 300)));
  line-height: calc(28px + (56 - 28) * ((100vw - 300px) / (1600 - 300)));
  border-radius: calc(5.6px + (11.2 - 5.6) * ((100vw - 300px) / (1600 - 300)));
  width: calc(140px + (280 - 140) * ((100vw - 300px) / (1600 - 300))); }

.smallcta {
  border-color: black;
  font-size: calc(9px + (18 - 9) * ((100vw - 300px) / (1600 - 300)));
  height: calc(22px + (44 - 22) * ((100vw - 300px) / (1600 - 300)));
  line-height: calc(22px + (44 - 22) * ((100vw - 300px) / (1600 - 300)));
  border-radius: calc(4.4px + (8.8 - 4.4) * ((100vw - 300px) / (1600 - 300)));
  width: calc(110px + (220 - 110) * ((100vw - 300px) / (1600 - 300)));
  margin: calc(16px + (16 - 8) * ((100vw - 300px) / (1600 - 300))) !important; }

.verysmallcta {
  border-color: black;
  margin: 1rem auto; }

.nav-link {
  text-transform: uppercase;
  font-family: 'exoregular';
  letter-spacing: .08rem;
  line-height: 1;
  color: white !important; }
  .nav-link:hover {
    color: rgba(255, 255, 255, 0.5) !important;
    text-decoration: none; }
  @media (max-width: 576px) {
    .nav-link {
      font-size: 3.5vw; } }
  @media (min-width: 576px) {
    .nav-link {
      font-size: 1rem; } }
  @media (min-width: 768px) {
    .nav-link {
      font-size: .9rem; } }
  @media (min-width: 992px) {
    .nav-link {
      font-size: 1.1rem; } }
  @media (min-width: 1200px) {
    .nav-link {
      font-size: 1.3rem; } }

.cache-menu {
  display: block;
  opacity: 0;
  height: 7vw; }

html {
  margin-top: 0 !important; }

div {
  background-color: transparent; }

@media (max-width: 768px) {
  #section_epinales {
    height: 507vw; } }

@media (min-width: 768px) {
  #section_epinales {
    height: 147vw; } }

@media (min-width: 1200px) {
  #section_epinales {
    height: 87vw; } }

.images-wrapper {
  position: relative;
  margin: 2vw auto;
  background-size: auto 100%;
  background-repeat: no-repeat;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -ms-flex-line-pack: distribute;
      align-content: space-around;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center; }
  @media (max-width: 768px) {
    .images-wrapper {
      height: 500vw; } }
  @media (min-width: 768px) {
    .images-wrapper {
      height: 140vw; } }
  @media (min-width: 1200px) {
    .images-wrapper {
      height: 80vw; } }
  .images-wrapper h1 {
    margin: 4vw auto 1vw auto;
    color: gray; }
  .images-wrapper h2 {
    margin: 2vw auto 2vw auto;
    text-align: center; }
  .images-wrapper .epinales-container,
  .images-wrapper .mentalites-container {
    width: 100%;
    padding-left: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -ms-flex-pack: distribute;
        justify-content: space-around;
    -ms-flex-line-pack: distribute;
        align-content: space-around; }
    @media (max-width: 768px) {
      .images-wrapper .epinales-container,
      .images-wrapper .mentalites-container {
        height: 450vw; } }
    @media (min-width: 768px) {
      .images-wrapper .epinales-container,
      .images-wrapper .mentalites-container {
        height: 105vw; } }
    @media (min-width: 1200px) {
      .images-wrapper .epinales-container,
      .images-wrapper .mentalites-container {
        height: 48vw; } }
    .images-wrapper .epinales-container li,
    .images-wrapper .mentalites-container li {
      position: relative;
      background-size: contain;
      border-style: solid;
      border-color: #ccc;
      display: block; }
      @media (max-width: 768px) {
        .images-wrapper .epinales-container li,
        .images-wrapper .mentalites-container li {
          width: 90vw;
          height: 60vw;
          border-width: .6vw .6vw .3vw .6vw; }
          .images-wrapper .epinales-container li h3,
          .images-wrapper .mentalites-container li h3 {
            font-size: 4.2vw;
            line-height: 10.5vw;
            height: 10.5vw; }
          .images-wrapper .epinales-container li h4,
          .images-wrapper .mentalites-container li h4 {
            font-size: 4.2vw;
            line-height: 8.4vw;
            height: 8.3vw; }
          .images-wrapper .epinales-container li img.flag,
          .images-wrapper .mentalites-container li img.flag {
            height: 8.4vw;
            width: auto; }
          .images-wrapper .epinales-container li img.bg,
          .images-wrapper .mentalites-container li img.bg {
            position: absolute;
            top: 0;
            left: 0; } }
      @media (min-width: 768px) {
        .images-wrapper .epinales-container li,
        .images-wrapper .mentalites-container li {
          width: 43vw;
          height: 28.67vw;
          border-width: .3vw .3vw .3vw .3vw; }
          .images-wrapper .epinales-container li h3,
          .images-wrapper .mentalites-container li h3 {
            font-size: 2vw;
            line-height: 5vw;
            height: 5vw; }
          .images-wrapper .epinales-container li h4,
          .images-wrapper .mentalites-container li h4 {
            font-size: 2vw;
            line-height: 4vw;
            height: 4vw; }
          .images-wrapper .epinales-container li img.flag,
          .images-wrapper .mentalites-container li img.flag {
            height: 4vw;
            width: auto; }
          .images-wrapper .epinales-container li img.bg,
          .images-wrapper .mentalites-container li img.bg {
            position: absolute;
            top: 0;
            left: 0; } }
      @media (min-width: 1200px) {
        .images-wrapper .epinales-container li,
        .images-wrapper .mentalites-container li {
          width: 30vw;
          height: 20vw;
          border-width: .2vw .2vw .2vw .2vw; }
          .images-wrapper .epinales-container li h3,
          .images-wrapper .mentalites-container li h3 {
            font-size: 1.4vw;
            line-height: 3.5vw;
            height: 3.5vw; }
          .images-wrapper .epinales-container li h4,
          .images-wrapper .mentalites-container li h4 {
            font-size: 1.4vw;
            line-height: 2.8vw;
            height: 2.8vw; }
          .images-wrapper .epinales-container li img.flag,
          .images-wrapper .mentalites-container li img.flag {
            height: 2.8vw;
            width: auto; }
          .images-wrapper .epinales-container li img.bg,
          .images-wrapper .mentalites-container li img.bg {
            position: absolute; } }

.exemples-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -ms-flex-line-pack: distribute;
      align-content: space-around;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  margin-bottom: 3vw; }
  .exemples-wrapper h1 {
    margin: 2vw auto 2vw auto; }
  .exemples-wrapper .exemple-container {
    width: 100%;
    padding-left: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -ms-flex-pack: distribute;
        justify-content: space-around; }
    @media (min-width: 768px) {
      .exemples-wrapper .exemple-container .smallcta {
        font-size: calc(7px + (14 - 7) * ((100vw - 300px) / (1600 - 300)));
        height: calc(17px + (34 - 17) * ((100vw - 300px) / (1600 - 300)));
        line-height: calc(17px + (34 - 17) * ((100vw - 300px) / (1600 - 300)));
        border-radius: calc(3.3px + (6.6 - 3.3) * ((100vw - 300px) / (1600 - 300)));
        width: calc(83px + (166 - 83) * ((100vw - 300px) / (1600 - 300)));
        margin: calc(12px + (12 - 6) * ((100vw - 300px) / (1600 - 300))) !important; } }

.mini-wrapper {
  height: 40vw;
  background-size: 100% 100%;
  background-position: top center;
  background-repeat: no-repeat;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -ms-flex-pack: distribute;
      justify-content: space-around;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center; }

.single-flex-wrapper {
  background-size: 100% 100%;
  background-position: top center;
  background-repeat: no-repeat; }
  .single-flex-wrapper .row {
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content; }
    @media (max-width: 768px) {
      .single-flex-wrapper .row h2 {
        margin: 3vw auto 1.8vw auto; } }
    @media (min-width: 768px) {
      .single-flex-wrapper .row h2 {
        margin: 2.1rem auto 1.2rem auto; } }
    @media (min-width: 992px) {
      .single-flex-wrapper .row h2 {
        margin: 2.2rem auto 1.3rem auto; } }
    @media (min-width: 1200px) {
      .single-flex-wrapper .row h2 {
        margin: 2.5rem auto 1.5rem auto; } }
  .single-flex-wrapper aside {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -ms-flex-pack: distribute;
        justify-content: space-around;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1; }
    .single-flex-wrapper aside .bloc-publicitaire {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      width: calc(120px + (240 - 120) * ((100vw - 300px) / (1600 - 300)));
      height: calc(96px + (196 - 96) * ((100vw - 300px) / (1600 - 300)));
      background-color: rgba(0, 0, 0, 0.1); }
      .single-flex-wrapper aside .bloc-publicitaire p {
        margin: auto;
        font-size: 2rem; }

.footer {
  height: calc(360px + (480 - 360) * ((100vw - 300px) / (1600 - 300)));
  background-color: #202020; }
  .footer .haut-footer {
    height: calc(330px + (440 - 330) * ((100vw - 300px) / (1600 - 300)));
    width: 100vw;
    position: relative;
    margin: auto;
    text-align: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -ms-flex-pack: distribute;
        justify-content: space-around;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center; }
    .footer .haut-footer a:hover {
      color: rgba(255, 255, 255, 0.5);
      text-decoration: none; }
    .footer .haut-footer h1 {
      font-family: 'Caribbean';
      text-transform: none;
      font-size: calc(17px + (23 - 17) * ((100vw - 300px) / (1600 - 300)));
      height: 3vw;
      line-height: 6vw;
      color: white; }
    .footer .haut-footer a {
      font-size: calc(18px + (24 - 18) * ((100vw - 300px) / (1600 - 300)));
      color: white;
      line-height: 3vw; }
      .footer .haut-footer a:hover {
        color: rgba(255, 255, 255, 0.5);
        text-decoration: none; }
    .footer .haut-footer p {
      margin-bottom: 0 !important;
      line-height: 3vw; }
    .footer .haut-footer a {
      text-transform: none;
      font-size: calc(15px + (20 - 15) * ((100vw - 300px) / (1600 - 300)));
      color: white; }
      .footer .haut-footer a:hover {
        color: rgba(255, 255, 255, 0.5);
        text-decoration: none; }
    .footer .haut-footer .rs {
      width: calc(180px + (240 - 180) * ((100vw - 300px) / (1600 - 300)));
      height: calc(90px + (120 - 90) * ((100vw - 300px) / (1600 - 300)));
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
          -ms-flex-direction: row;
              flex-direction: row;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
      -ms-flex-pack: distribute;
          justify-content: space-around;
      -ms-flex-line-pack: distribute;
          align-content: space-around; }
      .footer .haut-footer .rs .fondblancicone {
        width: calc(74px + (100 - 74) * ((100vw - 300px) / (1600 - 300)));
        height: calc(74px + (100 - 74) * ((100vw - 300px) / (1600 - 300)));
        border-radius: calc(37px + (50 - 37) * ((100vw - 300px) / (1600 - 300)));
        background-color: white;
        color: black; }
        .footer .haut-footer .rs .fondblancicone:hover {
          color: rgba(0, 0, 0, 0.3); }
        .footer .haut-footer .rs .fondblancicone i {
          font-size: calc(40px + (40 - 30) * ((100vw - 300px) / (1600 - 300)));
          line-height: calc(74px + (74 - 56) * ((100vw - 300px) / (1600 - 300)));
          height: calc(74px + (74 - 56) * ((100vw - 300px) / (1600 - 300))); }
  .footer .bas-footer {
    background-color: #000;
    position: relative;
    height: calc(30px + (40 - 30) * ((100vw - 300px) / (1600 - 300)));
    margin: auto;
    text-align: center; }
    .footer .bas-footer h2 {
      line-height: calc(30px + (40 - 30) * ((100vw - 300px) / (1600 - 300)));
      font-size: 18px;
      color: white; }

.home-header-wrapper {
  position: relative;
  height: 100%;
  z-index: 1;
  background-position: center top; }
  @media (orientation: landscape) {
    .home-header-wrapper {
      background-size: cover; } }
  @media (orientation: portrait) {
    .home-header-wrapper {
      background-size: cover; } }
  .home-header-wrapper:before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    content: "";
    background: rgba(0, 0, 0, 0.45); }
  .home-header-wrapper .header-container {
    top: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 100vh; }
    .home-header-wrapper .header-container .header-content {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: justify;
          -ms-flex-pack: justify;
              justify-content: space-between;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column;
      height: 75vh;
      margin: 25vh auto 0 auto;
      z-index: 3;
      color: white; }
      .home-header-wrapper .header-container .header-content h1 {
        line-height: 1.7;
        word-spacing: calc(5px + (10 - 5) * ((100vw - 300px) / (1600 - 300)));
        color: white; }
      .home-header-wrapper .header-container .header-content h2 {
        text-align: center;
        margin-bottom: 8vh;
        line-height: 1.6;
        color: white; }
      .home-header-wrapper .header-container .header-content h3 {
        color: white; }
        @media (max-width: 576px) {
          .home-header-wrapper .header-container .header-content h3 {
            font-size: 3.2vw;
            text-align: center;
            line-height: 1; } }
        @media (min-width: 576px) {
          .home-header-wrapper .header-container .header-content h3 {
            font-size: 1.1rem;
            text-align: center; } }
        @media (min-width: 768px) {
          .home-header-wrapper .header-container .header-content h3 {
            text-align: left;
            font-size: 1.2rem; } }
        @media (min-width: 992px) {
          .home-header-wrapper .header-container .header-content h3 {
            text-align: left;
            font-size: 1.3rem; } }
        @media (min-width: 1200px) {
          .home-header-wrapper .header-container .header-content h3 {
            text-align: left;
            font-size: 1.4rem; } }
      .home-header-wrapper .header-container .header-content .bloc-cta {
        margin-bottom: 5vh; }
        @media (max-width: 576px) {
          .home-header-wrapper .header-container .header-content .bloc-cta {
            height: 25vh; } }
        @media (min-width: 576px) {
          .home-header-wrapper .header-container .header-content .bloc-cta {
            height: 25vh; } }
        @media (max-width: 576px) {
          .home-header-wrapper .header-container .header-content .bloc-cta .ligne-cta {
            margin: 4vh auto; } }
        @media (min-width: 576px) {
          .home-header-wrapper .header-container .header-content .bloc-cta .ligne-cta {
            margin: 3vh auto; } }
        @media (min-width: 992px) {
          .home-header-wrapper .header-container .header-content .bloc-cta .ligne-cta {
            margin: 0 auto; } }
        .home-header-wrapper .header-container .header-content .bloc-cta .ligne-cta .cta-header {
          display: block;
          color: white;
          border: .07rem solid white;
          text-transform: uppercase;
          text-align: center;
          background-color: rgba(0, 0, 0, 0.8); }
          .home-header-wrapper .header-container .header-content .bloc-cta .ligne-cta .cta-header:hover {
            color: rgba(255, 255, 255, 0.3);
            background-color: black;
            text-decoration: none; }
          @media (max-width: 576px) {
            .home-header-wrapper .header-container .header-content .bloc-cta .ligne-cta .cta-header {
              font-size: 2.2vw;
              line-height: 5.2vw;
              height: 5.2vw;
              border-radius: 1.04vw;
              width: 33vw;
              margin: 3.5vw auto; } }
          @media (min-width: 576px) {
            .home-header-wrapper .header-container .header-content .bloc-cta .ligne-cta .cta-header {
              font-size: 1.7vw;
              line-height: 4vw;
              height: 4vw;
              border-radius: .8vw;
              width: 25vw;
              margin: 2.5vw auto; } }
          @media (min-width: 768px) {
            .home-header-wrapper .header-container .header-content .bloc-cta .ligne-cta .cta-header {
              font-size: .85rem;
              width: 11rem;
              line-height: 2.2rem;
              height: 2.2rem;
              border-radius: .44rem;
              margin: 2rem auto; } }
          @media (min-width: 992px) {
            .home-header-wrapper .header-container .header-content .bloc-cta .ligne-cta .cta-header {
              font-size: .9rem;
              width: 12rem;
              line-height: 2.3rem;
              height: 2.3rem;
              border-radius: .46rem;
              margin: 2rem auto; } }
          @media (min-width: 1200px) {
            .home-header-wrapper .header-container .header-content .bloc-cta .ligne-cta .cta-header {
              font-size: 1rem;
              width: 13rem;
              line-height: 2.4rem;
              height: 2.4rem;
              border-radius: .48rem;
              margin: 2rem auto; } }
      .home-header-wrapper .header-container .header-content .big-cta {
        display: block;
        color: white;
        text-align: center;
        text-transform: uppercase;
        margin: 6vh auto 4vh auto;
        background-color: rgba(0, 0, 0, 0.4); }
        .home-header-wrapper .header-container .header-content .big-cta:hover {
          color: rgba(255, 255, 255, 0.7);
          background-color: black;
          text-decoration: none; }
        @media (max-width: 576px) {
          .home-header-wrapper .header-container .header-content .big-cta {
            font-size: 3vw;
            width: 28vw;
            line-height: 7vw;
            height: 7vw;
            border-radius: 1.4vw;
            border: .08rem solid white; } }
        @media (min-width: 576px) {
          .home-header-wrapper .header-container .header-content .big-cta {
            font-size: 2.5vw;
            width: 24vw;
            line-height: 6vw;
            height: 6vw;
            border-radius: 1.2vw;
            border: .075rem solid white; } }
        @media (min-width: 768px) {
          .home-header-wrapper .header-container .header-content .big-cta {
            font-size: 1.1rem;
            line-height: 2.6rem;
            height: 2.6rem;
            border-radius: .52rem;
            width: 9rem;
            border: .06rem solid white; } }
        @media (min-width: 992px) {
          .home-header-wrapper .header-container .header-content .big-cta {
            font-size: 1.15rem;
            line-height: 2.7rem;
            height: 2.7rem;
            border-radius: .54rem;
            width: 10rem;
            border: .065rem solid white; } }
        @media (min-width: 1200px) {
          .home-header-wrapper .header-container .header-content .big-cta {
            font-size: 1.2rem;
            line-height: 2.8rem;
            height: 2.8rem;
            border-radius: .56rem;
            width: 10rem;
            border: .07rem solid white; } }

.single-header-wrapper {
  position: relative;
  height: 400px;
  z-index: 1;
  background-position: center top;
  background-size: cover; }
  .single-header-wrapper:before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    content: "";
    background: rgba(0, 0, 0, 0.55); }
  .single-header-wrapper .header-container {
    top: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 100%; }
    .single-header-wrapper .header-container .header-content {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-pack: distribute;
          justify-content: space-around;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column;
      height: 80%;
      margin: 5% auto 0 auto;
      z-index: 2;
      color: white; }
      .single-header-wrapper .header-container .header-content h1 {
        font-size: calc(36px + (54 - 36) * ((100vw - 300px) / (1600 - 300)));
        letter-spacing: calc(1px + (2 - 1) * ((100vw - 300px) / (1600 - 300)));
        color: white; }
      .single-header-wrapper .header-container .header-content h2 {
        text-align: center;
        margin-bottom: 2%;
        font-size: calc(30px + (45 - 30) * ((100vw - 300px) / (1600 - 300)));
        letter-spacing: calc(.8px + (1.6 - .8) * ((100vw - 300px) / (1600 - 300)));
        color: white; }
      .single-header-wrapper .header-container .header-content h3 {
        color: white;
        margin-bottom: 1%; }

.flex-wrapper {
  background-size: 100% auto;
  background-position: top center;
  background-repeat: repeat;
  padding: 3rem; }
  .flex-wrapper h1 {
    width: 80%;
    margin: auto; }
  .flex-wrapper p.explications {
    background-color: white;
    font-family: 'Open Sans regular';
    padding: calc(12px + (24 - 12) * ((100vw - 300px) / (1600 - 300)));
    border-radius: calc(6px + (12 - 6) * ((100vw - 300px) / (1600 - 300)));
    width: 80%;
    margin: 2vw auto;
    text-align: center; }
  .flex-wrapper .quiz-content {
    margin: auto; }
    .flex-wrapper .quiz-content a {
      display: block; }
    .flex-wrapper .quiz-content .rempli {
      background-color: rgba(232, 68, 39, 0.8) !important; }
    .flex-wrapper .quiz-content .question-bloc {
      -webkit-box-shadow: 0 0.6rem 1.2rem rgba(0, 0, 0, 0.19), 0 0.8rem 0.8rem rgba(0, 0, 0, 0.23);
              box-shadow: 0 0.6rem 1.2rem rgba(0, 0, 0, 0.19), 0 0.8rem 0.8rem rgba(0, 0, 0, 0.23); }
    .flex-wrapper .quiz-content .bloc-rempli {
      -webkit-box-shadow: 0 0.6rem 1.2rem rgba(0, 0, 0, 0.19) inset, 0 0.8rem 0.8rem rgba(0, 0, 0, 0.23) inset !important;
              box-shadow: 0 0.6rem 1.2rem rgba(0, 0, 0, 0.19) inset, 0 0.8rem 0.8rem rgba(0, 0, 0, 0.23) inset !important; }
    .flex-wrapper .quiz-content .quiz-bloc {
      margin: 2.5rem auto; }
      .flex-wrapper .quiz-content .quiz-bloc .quiz-header {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
            -ms-flex-direction: row;
                flex-direction: row;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -ms-flex-line-pack: center;
            align-content: center;
        height: calc(30px + (60 - 30) * ((100vw - 300px) / (1600 - 300)));
        border-radius: .75rem;
        background-color: rgba(59, 59, 59, 0.2);
        border-width: .07rem;
        border-style: solid;
        border-color: #e84427; }
        .flex-wrapper .quiz-content .quiz-bloc .quiz-header h2 {
          font-size: calc(16px + (32 - 16) * ((100vw - 300px) / (1600 - 300)));
          width: 30vw;
          text-transform: uppercase;
          margin: auto auto auto .65rem;
          text-align: left; }
        .flex-wrapper .quiz-content .quiz-bloc .quiz-header .progress {
          margin: auto .65rem auto auto;
          height: calc(8px + (16 - 8) * ((100vw - 300px) / (1600 - 300)));
          width: 30vw;
          line-height: calc(12px + (24 - 12) * ((100vw - 300px) / (1600 - 300)));
          background-color: white; }
      .flex-wrapper .quiz-content .quiz-bloc nav {
        padding: 0; }
        .flex-wrapper .quiz-content .quiz-bloc nav .row {
          width: 100%; }
      .flex-wrapper .quiz-content .quiz-bloc .bloc-bouton {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex; }
        .flex-wrapper .quiz-content .quiz-bloc .bloc-bouton .smallcta {
          padding: 0; }
        .flex-wrapper .quiz-content .quiz-bloc .bloc-bouton button {
          text-align: center !important;
          text-transform: uppercase;
          font-family: 'exoregular';
          background-color: transparent; }
          @media (max-width: 576px) {
            .flex-wrapper .quiz-content .quiz-bloc .bloc-bouton button {
              width: 60vw;
              margin: 3.5vw auto !important;
              border: .07rem solid; } }
          @media (min-width: 576px) {
            .flex-wrapper .quiz-content .quiz-bloc .bloc-bouton button {
              width: 10rem;
              margin: 1.25rem auto !important;
              border: .08rem solid; } }
          @media (min-width: 768px) {
            .flex-wrapper .quiz-content .quiz-bloc .bloc-bouton button {
              width: 11rem;
              margin: 1.25rem auto !important;
              border: .09rem solid; } }
          @media (min-width: 992px) {
            .flex-wrapper .quiz-content .quiz-bloc .bloc-bouton button {
              width: 12rem;
              margin: 1.25rem auto !important;
              border: .10rem solid; } }
          @media (min-width: 1200px) {
            .flex-wrapper .quiz-content .quiz-bloc .bloc-bouton button {
              width: 13rem;
              margin: 1.25rem auto;
              border: .11rem solid black !important; } }
          .flex-wrapper .quiz-content .quiz-bloc .bloc-bouton button:hover {
            color: black;
            background-color: rgba(0, 0, 0, 0.1);
            text-decoration: none !important; }
      @media (max-width: 576px) {
        .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe {
          height: 140vw; } }
      @media (min-width: 576px) {
        .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe {
          height: 54rem; } }
      @media (min-width: 768px) {
        .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe {
          height: 72rem; } }
      @media (min-width: 992px) {
        .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe {
          height: 33rem; } }
      @media (min-width: 1200px) {
        .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe {
          height: 13rem; } }
      @media (max-width: 576px) {
        .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe {
          height: 470vw; } }
      @media (min-width: 576px) {
        .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe {
          height: 170rem; } }
      @media (min-width: 768px) {
        .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe {
          height: 240rem; } }
      @media (min-width: 992px) {
        .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe {
          height: 85rem; } }
      @media (min-width: 1200px) {
        .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe {
          height: 53rem; } }
      @media (max-width: 576px) {
        .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe {
          height: 565vw; } }
      @media (min-width: 576px) {
        .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe {
          height: 205rem; } }
      @media (min-width: 768px) {
        .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe {
          height: 290rem; } }
      @media (min-width: 992px) {
        .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe {
          height: 100rem; } }
      @media (min-width: 1200px) {
        .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe {
          height: 53rem; } }
      .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts,
      .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets,
      .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs {
        width: 100%; }
        .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe,
        .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe,
        .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe {
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-orient: horizontal;
          -webkit-box-direction: normal;
              -ms-flex-direction: row;
                  flex-direction: row;
          -ms-flex-wrap: wrap;
              flex-wrap: wrap;
          -ms-flex-pack: distribute;
              justify-content: space-around;
          -ms-flex-line-pack: distribute;
              align-content: space-around; }
          .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc,
          .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc,
          .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc {
            list-style-type: none;
            border: 1px solid black;
            border-radius: 1rem;
            position: relative;
            background-color: white; }
            @media (max-width: 576px) {
              .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc,
              .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc,
              .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc {
                height: 42vw;
                width: 90vw; }
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc h3,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc h3,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc h3 {
                  font-size: 4vw; }
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc .reponse,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc .reponse,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc .reponse {
                  top: 46%; }
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc .jenesaispas,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc .jenesaispas,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc .jenesaispas {
                  width: 30vw; }
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc .jesais,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc .jesais,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc .jesais {
                  width: 13vw; }
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc label,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc label,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc label {
                  font-size: 3.5vw; }
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc input[type="radio"],
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc input[type="radio"],
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc input[type="radio"] {
                  width: 3vw;
                  height: 3vw;
                  font-size: 3vw; }
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc a,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc p,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc a,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc p,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc a,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc p {
                  font-size: 4vw;
                  width: 50vw; } }
            @media (min-width: 576px) {
              .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc,
              .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc,
              .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc {
                height: 15rem;
                width: 35rem; }
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc h3,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc h3,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc h3 {
                  font-size: 1.6rem; }
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc .reponse,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc .reponse,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc .reponse {
                  top: 46%; }
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc .jenesaispas,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc .jenesaispas,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc .jenesaispas {
                  width: 13rem; }
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc .jesais,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc .jesais,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc .jesais {
                  width: 5.4rem; }
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc label,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc label,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc label {
                  font-size: 1.4rem; }
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc input[type="radio"],
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc input[type="radio"],
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc input[type="radio"] {
                  width: 1.1rem;
                  height: 1.1rem;
                  font-size: 1.1rem; }
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc a,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc p,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc a,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc p,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc a,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc p {
                  font-size: 1.4rem;
                  width: 20rem; } }
            @media (min-width: 768px) {
              .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc,
              .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc,
              .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc {
                height: 21.8rem;
                width: 40rem; }
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc h3,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc h3,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc h3 {
                  font-size: 2rem; }
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc .reponse,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc .reponse,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc .reponse {
                  top: 46%; }
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc .jenesaispas,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc .jenesaispas,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc .jenesaispas {
                  width: 14rem; }
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc .jesais,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc .jesais,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc .jesais {
                  width: 7rem; }
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc label,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc label,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc label {
                  font-size: 1.4rem; }
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc input[type="radio"],
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc input[type="radio"],
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc input[type="radio"] {
                  width: 1.4rem;
                  height: 1.4rem;
                  font-size: 1.4rem; }
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc a,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc p,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc a,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc p,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc a,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc p {
                  font-size: 1.5rem;
                  width: 20rem; } }
            @media (min-width: 992px) {
              .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc,
              .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc,
              .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc {
                height: 14.4rem;
                width: 26.4rem; }
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc h3,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc h3,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc h3 {
                  font-size: 1.45rem; }
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc .reponse,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc .reponse,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc .reponse {
                  top: 46%; }
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc .jenesaispas,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc .jenesaispas,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc .jenesaispas {
                  width: 10rem; }
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc .jesais,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc .jesais,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc .jesais {
                  width: 5.5rem; }
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc label,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc label,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc label {
                  font-size: 1.2rem; }
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc input[type="radio"],
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc input[type="radio"],
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc input[type="radio"] {
                  width: 1.2rem;
                  height: 1.2rem;
                  font-size: 1.2rem; }
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc a,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc p,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc a,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc p,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc a,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc p {
                  font-size: 1.3rem;
                  width: 17rem; } }
            @media (min-width: 1200px) {
              .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc,
              .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc,
              .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc {
                height: 12rem;
                width: 22rem; }
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc h3,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc h3,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc h3 {
                  font-size: 1.3rem; }
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc .reponse,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc .reponse,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc .reponse {
                  top: 52%; }
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc .jenesaispas,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc .jenesaispas,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc .jenesaispas {
                  width: 9rem; }
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc .jesais,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc .jesais,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc .jesais {
                  width: 4rem; }
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc label,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc label,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc label {
                  font-size: 1.2rem; }
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc input[type="radio"],
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc input[type="radio"],
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc input[type="radio"] {
                  width: 1.2rem;
                  height: 1.2rem;
                  font-size: 1.2rem; }
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc a,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc p,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc a,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc p,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc a,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc p {
                  font-size: 1.1rem;
                  width: 14rem; } }
            .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc h3,
            .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc h3,
            .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc h3 {
              position: absolute;
              text-align: left;
              top: 6%;
              left: 6%;
              right: 6%;
              text-align: justify; }
            .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc .reponse,
            .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc .reponse,
            .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc .reponse {
              position: absolute;
              width: 88%;
              height: 22%;
              left: 6%;
              display: -webkit-box;
              display: -ms-flexbox;
              display: flex;
              -webkit-box-orient: horizontal;
              -webkit-box-direction: normal;
                  -ms-flex-direction: row;
                      flex-direction: row;
              -webkit-box-pack: justify;
                  -ms-flex-pack: justify;
                      justify-content: space-between;
              -webkit-box-align: center;
                  -ms-flex-align: center;
                      align-items: center;
              -ms-flex-wrap: wrap;
                  flex-wrap: wrap;
              -webkit-box-shadow: none;
                      box-shadow: none; }
              .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc .reponse .jenesaispas,
              .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc .reponse .jesais,
              .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc .reponse .jenesaispas,
              .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc .reponse .jesais,
              .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc .reponse .jenesaispas,
              .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc .reponse .jesais {
                height: 100%;
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-orient: horizontal;
                -webkit-box-direction: normal;
                    -ms-flex-direction: row;
                        flex-direction: row;
                -ms-flex-pack: distribute;
                    justify-content: space-around;
                -webkit-box-align: center;
                    -ms-flex-align: center;
                        align-items: center;
                -ms-flex-wrap: wrap;
                    flex-wrap: wrap;
                -webkit-box-shadow: none;
                        box-shadow: none;
                border-radius: .5rem;
                background-color: rgba(58, 58, 58, 0.1); }
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc .reponse .jenesaispas label,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc .reponse .jesais label,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc .reponse .jenesaispas label,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc .reponse .jesais label,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc .reponse .jenesaispas label,
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc .reponse .jesais label {
                  font-family: 'exoregular';
                  margin-bottom: 0;
                  line-height: 1;
                  color: #181818; }
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc .reponse .jenesaispas input[type="radio"],
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc .reponse .jesais input[type="radio"],
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc .reponse .jenesaispas input[type="radio"],
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc .reponse .jesais input[type="radio"],
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc .reponse .jenesaispas input[type="radio"],
                .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc .reponse .jesais input[type="radio"] {
                  background-color: #28a745; }
            .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc a,
            .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc a,
            .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc a {
              position: absolute;
              text-align: center;
              bottom: 6%;
              right: 6%;
              font-family: 'exoregular';
              text-transform: none;
              letter-spacing: .03rem;
              border: none;
              background-color: transparent;
              margin: 0;
              color: black; }
              .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-atouts .questions-groupe .question-bloc a:hover,
              .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-interets .questions-groupe .question-bloc a:hover,
              .flex-wrapper .quiz-content .quiz-bloc #navbarToggleExternalContent-valeurs .questions-groupe .question-bloc a:hover {
                background-color: rgba(0, 0, 0, 0.1);
                text-decoration: none; }

#resultat {
  height: calc(520px + (1040 - 520) * ((100vw - 300px) / (1600 - 300)));
  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-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between; }
  #resultat h2 {
    margin: 1rem auto; }
    #resultat h2 span {
      color: #E84427; }
  #resultat ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -ms-flex-pack: distribute;
        justify-content: space-around;
    width: 100%;
    height: calc(270px + (540 - 270) * ((100vw - 300px) / (1600 - 300)));
    margin-top: 1rem;
    padding-left: 0; }
    #resultat ul li {
      list-style: none;
      height: calc(20px + (40 - 20) * ((100vw - 300px) / (1600 - 300)));
      line-height: calc(20px + (40 - 20) * ((100vw - 300px) / (1600 - 300)));
      width: 100%;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
          -ms-flex-direction: row;
              flex-direction: row;
      -webkit-box-pack: start;
          -ms-flex-pack: start;
              justify-content: flex-start;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center; }
      #resultat ul li .identifiants-pays {
        width: 40%;
        height: inherit;
        line-height: inherit;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
            -ms-flex-direction: row;
                flex-direction: row;
        -webkit-box-pack: end;
            -ms-flex-pack: end;
                justify-content: flex-end; }
        #resultat ul li .identifiants-pays .flag {
          height: 100%;
          width: auto; }
        #resultat ul li .identifiants-pays .code {
          letter-spacing: calc(.5px + (1 - .5) * ((100vw - 300px) / (1600 - 300)));
          display: block;
          height: inherit;
          line-height: inherit;
          font-size: calc(13px + (26 - 13) * ((100vw - 300px) / (1600 - 300)));
          margin: 0 4rem 0 0;
          text-transform: uppercase;
          text-align: center;
          width: 28%;
          color: white;
          background-color: rgba(0, 0, 0, 0.5); }
      #resultat ul li .resultat_pays {
        width: 60%;
        height: 100%;
        display: block; }
        #resultat ul li .resultat_pays .barre {
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-orient: horizontal;
          -webkit-box-direction: normal;
              -ms-flex-direction: row;
                  flex-direction: row;
          -webkit-box-pack: center;
              -ms-flex-pack: center;
                  justify-content: center;
          -webkit-box-align: center;
              -ms-flex-align: center;
                  align-items: center;
          height: 100%; }
          #resultat ul li .resultat_pays .barre p {
            font-size: 1rem;
            width: 3rem;
            display: block;
            color: black;
            background: none;
            padding: 0; }
  #resultat p {
    width: 85%;
    margin: 1rem auto;
    background-color: white;
    font-family: 'Open Sans regular';
    color: black;
    padding: calc(12px + (24 - 12) * ((100vw - 300px) / (1600 - 300)));
    border-radius: calc(6px + (12 - 6) * ((100vw - 300px) / (1600 - 300))); }
    #resultat p span {
      color: #E84427; }
  #resultat a {
    display: block; }

form#blog_form {
  height: calc(150px + (300 - 150) * ((100vw - 300px) / (1600 - 300))); }
  form#blog_form select {
    width: calc(100px + (200 - 10) * ((100vw - 300px) / (1600 - 300)));
    display: block;
    margin: auto;
    height: calc(25px + (50 - 25) * ((100vw - 300px) / (1600 - 300)));
    font-family: 'exoregular';
    letter-spacing: calc(.3px + (.6 - .3) * ((100vw - 300px) / (1600 - 300)));
    font-size: calc(8px + (16 - 8) * ((100vw - 300px) / (1600 - 300)));
    line-height: 1.5;
    color: black;
    text-transform: uppercase; }
    form#blog_form select option {
      padding-top: calc(5px + (100 - 5) * ((100vw - 300px) / (1600 - 300))) !important;
      padding-bottom: calc(5px + (100 - 5) * ((100vw - 300px) / (1600 - 300))) !important; }
  form#blog_form #question-selection {
    width: 100%;
    text-transform: none; }
  form#blog_form #rechercher_art {
    margin-top: 5vw !important; }
  form#blog_form h2 {
    text-align: center; }

.exemples-wrapper {
  /*
    ul {
        //équivalent à .exemple-container elle contient les hauteurs
        list-style: none;
        padding-left: 0;
        height: fit-content;
        li {
            //Les classes responsives
            article {
                //global post-summary et cta
                //adapter les règles @media se l'accueil
                display: flex;
                flex-direction: column;
                justify-content: space-between;
                @media (max-width: 768px) {
                    margin: 2.5vw auto;
                    //une colonne 90% 
                    width: 90vw;
                    height: 90vw;
                    .verysmallcta {
                        font-size: 3vw;
                        height: 6vw;
                        line-height: 6vw;
                        width: 36vw;
                        border-width: .08rem !important;
                    }
                }
                @media (min-width: 768px) {
                    //deux colonnes
                    margin: 2.5vw auto;
                    width: 43vw;
                    height: 48vw;
                    .verysmallcta {
                        font-size: 1.5vw;
                        height: 3vw;
                        line-height: 3vw;
                        width: 18vw;
                        border-width: .08rem !important;
                    }
                }
                @media (min-width: 992px) {
                    //deux colonnes
                    margin: 2.5vw auto;
                    width: 43vw;
                    height: 43vw;
                    .verysmallcta {
                        font-size: 1.1vw;
                        height: 2.2vw;
                        line-height: 2.2vw;
                        width: 12vw;
                        border-width: .09rem !important;
                    }
                }
                @media (min-width: 1200px) {
                    //trois colonnes
                    margin: 3vw auto;
                    height: 32.5vw;
                    width: 30vw;
                    .verysmallcta {
                        font-size: .8vw;
                        height: 1.8vw;
                        line-height: 1.8vw;
                        width: 9vw;
                        border-width: .08rem !important;
                    }
                }
                .post-summary {
                    //avec le résumé en bas
                    //même largeur et hauteur un peu plus faible
                    width: 100%;
                    h3 {
                        width: 100%;
                        margin: auto;
                        color: black;
                        background-color: white;
                        border-radius: 4% / 40%;
                        text-align: justify;
                        hyphens: auto;
                        word-break: break-word;
                        -webkit-hyphens: auto;
                        -moz-hyphens: auto;
                        -ms-hyphens: auto;
                        -o-hyphens: auto;
                        padding: 2% 5%;
                    }
                    @media (max-width: 768px) {
                        //width: 90vw;
                        height: 110vw;
                        h3 {
                            font-size: 3.8vw;
                        }
                    }
                    @media (min-width: 768px) {
                        //deux colonnes
                        height: 60vw;
                        h3 {
                            font-size: 2vw;
                        }
                    }
                    @media (min-width: 992px) {
                        //deux colonnes
                        height: 45vw;
                        h3 {
                            font-size: 1.7vw;
                        }
                    }
                    @media (min-width: 1200px) {
                        //trois colonnes
                        height: 30vw;
                        h3 {
                            font-size: 1.25vw;
                        }
                    }
                    .post-content {
                        //les images, équivalents des li de l'accueil
                        a:hover {
                            background-color: rgba(255, 255, 255, 0.2);
                        }
                        position: relative;
                        background-size: contain;
                        border-style: solid;
                        display: block;
                        margin-bottom: 1vw;
                        @media (max-width: 768px) {
                            //une colonne 90%
                            width: 90vw;
                            height: 63.14vw;
                            border-width: .6vw .6vw 3vw .6vw;
                            h3 {
                                font-size: 4.2vw;
                                line-height: 10.5vw;
                                height: 10.5vw;
                            }
                            h4 {
                                font-size: 4.2vw;
                                line-height: 8.4vw;
                                height: 8.3vw;
                            }
                            img {
                                height: 8.4vw;
                                width: auto;
                            }
                        }
                        @media (min-width: 768px) {
                            //deux colonnes
                            width: 43vw;
                            height: 30.17vw;
                            border-width: .3vw .3vw 1.5vw .3vw;
                            h3 {
                                font-size: 2vw;
                                line-height: 5vw;
                                height: 5vw;
                            }
                            h4 {
                                font-size: 2vw;
                                line-height: 4vw;
                                height: 4vw;
                            }
                            img {
                                height: 4vw;
                                width: auto;
                            }
                        }
                        @media (min-width: 992px) {
                            //deux colonnes
                            width: 43vw;
                            height: 30.17vw;
                            border-width: .3vw .3vw 1.5vw .3vw;
                            h3 {
                                font-size: 2vw;
                                line-height: 5vw;
                                height: 5vw;
                            }
                            h4 {
                                font-size: 2vw;
                                line-height: 4vw;
                                height: 4vw;
                            }
                            img {
                                height: 4vw;
                                width: auto;
                            }
                        }
                        @media (min-width: 1200px) {
                            //trois colonnes
                            width: 30vw;
                            height: 21.1vw;
                            border-width: .2vw .2vw 1vw .2vw;
                            h3 {
                                font-size: 1.35vw;
                                line-height: 3.33vw;
                                height: 3.33vw;
                            }
                            h4 {
                                font-size: 1.35vw;
                                line-height: 2.66vw;
                                height: 2.66vw;
                            }
                            img {
                                height: 2.66vw;
                                width: auto;
                            }
                        }
                    }
                }
            }
        }
        
    }*/ }
  .exemples-wrapper h2 {
    margin: 1.5vw auto .5vw auto;
    text-align: center; }
  .exemples-wrapper .post-summary {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -ms-flex-pack: distribute;
        justify-content: space-around;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    background-color: rgba(255, 255, 255, 0.7);
    border-style: solid;
    height: 20%;
    margin: 2vw auto; }
    @media (max-width: 768px) {
      .exemples-wrapper .post-summary {
        width: 90vw;
        height: 110vw;
        border-radius: 1.8vw;
        border-width: .6vw; }
        .exemples-wrapper .post-summary h3 {
          font-size: 3.2vw;
          padding: 4vw; } }
    @media (min-width: 768px) {
      .exemples-wrapper .post-summary {
        width: 20.6rem;
        height: 24.5rem;
        border-radius: .4rem;
        border-width: .14rem; }
        .exemples-wrapper .post-summary h3 {
          font-size: .8rem;
          padding: .75rem; } }
    @media (min-width: 992px) {
      .exemples-wrapper .post-summary {
        width: 26.7rem;
        height: 31.6rem;
        border-radius: .53rem;
        border-width: .18rem; }
        .exemples-wrapper .post-summary h3 {
          font-size: 1.06rem;
          padding: .94rem; } }
    @media (min-width: 1200px) {
      .exemples-wrapper .post-summary {
        width: 27.4rem;
        height: 32.51rem;
        border-radius: .54rem;
        border-width: .19rem; }
        .exemples-wrapper .post-summary h3 {
          font-size: 1.11rem;
          padding: .96rem; } }
    @media (min-width: 1760px) {
      .exemples-wrapper .post-summary {
        width: 768px;
        height: 870px;
        border-radius: 15.4px;
        border-width: 5px; }
        .exemples-wrapper .post-summary h3 {
          font-size: 34px;
          padding: 26px; } }
    .exemples-wrapper .post-summary .post-content {
      position: relative;
      margin: 2% 0;
      display: block; }
      .exemples-wrapper .post-summary .post-content a:hover {
        background-color: rgba(255, 255, 255, 0.2); }
      @media (max-width: 768px) {
        .exemples-wrapper .post-summary .post-content {
          width: 88.8vw;
          height: 59.2vw; }
          .exemples-wrapper .post-summary .post-content h3 {
            font-size: 4.2vw;
            line-height: 10.5vw;
            height: 10.5vw; }
          .exemples-wrapper .post-summary .post-content h4 {
            font-size: 4.2vw;
            line-height: 8.4vw;
            height: 8.3vw; }
          .exemples-wrapper .post-summary .post-content img.flag {
            height: 8.4vw;
            width: auto; }
          .exemples-wrapper .post-summary .post-content img.bg {
            height: auto;
            width: 100%; } }
      @media (min-width: 768px) {
        .exemples-wrapper .post-summary .post-content {
          width: 20.32rem;
          height: 13.55rem; }
          .exemples-wrapper .post-summary .post-content h3 {
            font-size: .94rem;
            line-height: 2.38rem;
            height: 2.38rem; }
          .exemples-wrapper .post-summary .post-content h4 {
            font-size: .94rem;
            line-height: 1.94rem;
            height: 1.94rem; }
          .exemples-wrapper .post-summary .post-content img.flag {
            height: auto;
            width: 1.9rem; }
          .exemples-wrapper .post-summary .post-content img.bg {
            height: auto;
            width: 100%; } }
      @media (min-width: 992px) {
        .exemples-wrapper .post-summary .post-content {
          width: 26.34rem;
          height: 17.56rem; }
          .exemples-wrapper .post-summary .post-content h3 {
            font-size: 1.19rem;
            line-height: 3rem;
            height: 3rem; }
          .exemples-wrapper .post-summary .post-content h4 {
            font-size: 1.2rem;
            line-height: 2.5rem;
            height: 2.5rem; }
          .exemples-wrapper .post-summary .post-content img.flag {
            height: 2.5rem;
            width: auto; }
          .exemples-wrapper .post-summary .post-content img.bg {
            height: auto;
            width: 100%; } }
      @media (min-width: 1200px) {
        .exemples-wrapper .post-summary .post-content {
          width: 27.04rem;
          height: 18.03rem; }
          .exemples-wrapper .post-summary .post-content h3 {
            font-size: 1.22rem;
            line-height: 3.8rem;
            height: 3.8rem; }
          .exemples-wrapper .post-summary .post-content h4 {
            font-size: 1.22rem;
            line-height: 2.55rem;
            height: 2.55rem; }
          .exemples-wrapper .post-summary .post-content img.flag {
            height: 2.55rem;
            width: auto; }
          .exemples-wrapper .post-summary .post-content img.bg {
            height: auto;
            width: 100%; } }
      @media (min-width: 1760px) {
        .exemples-wrapper .post-summary .post-content {
          width: 758px;
          height: 505px; }
          .exemples-wrapper .post-summary .post-content h3 {
            font-size: 35px;
            line-height: 88px;
            height: 88px; }
          .exemples-wrapper .post-summary .post-content h4 {
            font-size: 35px;
            line-height: 70px;
            height: 70px; }
          .exemples-wrapper .post-summary .post-content img.flag {
            height: 70px;
            width: auto; }
          .exemples-wrapper .post-summary .post-content img.bg {
            height: auto;
            width: 100%; } }

#unitaire article,
#apropos article {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  margin-bottom: 2rem; }

#unitaire h3,
#apropos h3 {
  margin: 3.5rem auto 1rem auto;
  text-transform: uppercase;
  letter-spacing: calc(.2px + (.4 - .2) * ((100vw - 300px) / (1600 - 300)));
  font-size: calc(12px + (24 - 12) * ((100vw - 300px) / (1600 - 300)));
  color: black; }

#unitaire p,
#apropos p {
  background-color: white;
  font-family: 'Open Sans regular';
  color: black;
  padding: calc(12px + (24 - 12) * ((100vw - 300px) / (1600 - 300)));
  border-radius: calc(6px + (12 - 6) * ((100vw - 300px) / (1600 - 300))); }
  #unitaire p span,
  #apropos p span {
    color: #E84427; }

#unitaire .art,
#apropos .art {
  margin: 2rem auto;
  position: relative;
  border-style: solid;
  border-color: #ccc;
  display: block;
  background-size: contain; }
  @media (max-width: 768px) {
    #unitaire .art,
    #apropos .art {
      width: 70vw;
      height: 47vw;
      border-width: .5vw .5vw .5vw .5vw; }
      #unitaire .art img.bg,
      #apropos .art img.bg {
        width: 69vw;
        height: 46vw; }
      #unitaire .art h4,
      #apropos .art h4 {
        height: 5vw;
        line-height: 5vw;
        font-size: 2.5vw; }
      #unitaire .art img.flag,
      #apropos .art img.flag {
        height: 5vw;
        width: auto; } }
  @media (min-width: 768px) {
    #unitaire .art,
    #apropos .art {
      width: 42.6rem;
      height: 28.6rem;
      border-width: .3rem .3rem .3rem .3rem; }
      #unitaire .art img.bg,
      #apropos .art img.bg {
        width: 42rem;
        height: 28rem; }
      #unitaire .art h4,
      #apropos .art h4 {
        height: 3.13rem;
        line-height: 3.13rem;
        font-size: 1.6rem; }
      #unitaire .art img.flag,
      #apropos .art img.flag {
        height: 3.13rem;
        width: auto; } }
  @media (min-width: 992px) {
    #unitaire .art,
    #apropos .art {
      width: 35.52rem;
      height: 23.91rem;
      border-width: .26rem .26rem .26rem .26rem; }
      #unitaire .art img.bg,
      #apropos .art img.bg {
        width: 35rem;
        height: 23.39rem; }
      #unitaire .art h4,
      #apropos .art h4 {
        height: 2.63rem;
        line-height: 2.63rem;
        font-size: 1.3rem; }
      #unitaire .art img.flag,
      #apropos .art img.flag {
        height: 2.63rem;
        width: auto; } }
  @media (min-width: 1200px) {
    #unitaire .art,
    #apropos .art {
      width: 42.84rem;
      height: 28.77rem;
      border-width: .32rem .32rem .32rem .32rem; }
      #unitaire .art img.bg,
      #apropos .art img.bg {
        width: 42.2rem;
        height: 28.13rem; }
      #unitaire .art h4,
      #apropos .art h4 {
        height: 3.13rem;
        line-height: 3.13rem;
        font-size: 1.56rem; }
      #unitaire .art img.flag,
      #apropos .art img.flag {
        height: 3.13rem;
        width: auto; } }

@media (max-width: 768px) {
  #contact_form {
    width: 100%;
    height: 68vw;
    margin: 0 auto auto auto; }
    #contact_form .ligne-form,
    #contact_form .ligne-form-ta {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
          -ms-flex-direction: row;
              flex-direction: row;
      -webkit-box-pack: justify;
          -ms-flex-pack: justify;
              justify-content: space-between;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      height: -webkit-fit-content;
      height: -moz-fit-content;
      height: fit-content;
      width: 90%;
      margin: auto; }
      #contact_form .ligne-form .items-form,
      #contact_form .ligne-form-ta .items-form {
        width: 47%;
        text-align: right; }
        #contact_form .ligne-form .items-form label,
        #contact_form .ligne-form-ta .items-form label {
          font-size: 2.7vw;
          color: black;
          line-height: 4.5vw;
          height: 4.5vw;
          margin-bottom: 0; }
        #contact_form .ligne-form .items-form .input,
        #contact_form .ligne-form-ta .items-form .input {
          font-size: 2vw !important;
          width: 100%; }
        #contact_form .ligne-form .items-form textarea,
        #contact_form .ligne-form-ta .items-form textarea {
          height: 13vw;
          line-height: 1.2; }
    #contact_form .ligne-form-ta {
      -webkit-box-align: start;
          -ms-flex-align: start;
              align-items: flex-start;
      margin-bottom: 5vw; }
    #contact_form .error_message,
    #contact_form .envoi {
      width: 100%;
      text-align: center;
      font-family: 'exobold';
      font-size: 2.2vw;
      height: 5vw;
      padding-top: .3vw; }
    #contact_form #message_validation,
    #contact_form #apres-envoi {
      height: 4vw; } }

@media (min-width: 768px) {
  #contact_form {
    width: 39rem;
    height: 38rem;
    margin: 0 auto auto auto; }
    #contact_form .ligne-form,
    #contact_form .ligne-form-ta {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
          -ms-flex-direction: row;
              flex-direction: row;
      -webkit-box-pack: justify;
          -ms-flex-pack: justify;
              justify-content: space-between;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      height: -webkit-fit-content;
      height: -moz-fit-content;
      height: fit-content;
      width: 34rem;
      margin: auto; }
      #contact_form .ligne-form .items-form,
      #contact_form .ligne-form-ta .items-form {
        width: 16rem;
        text-align: right; }
        #contact_form .ligne-form .items-form label,
        #contact_form .ligne-form-ta .items-form label {
          font-size: 1.5rem;
          color: black;
          line-height: 2rem;
          height: 2rem;
          margin-bottom: 0; }
        #contact_form .ligne-form .items-form .input,
        #contact_form .ligne-form-ta .items-form .input {
          font-size: 1rem !important;
          width: 100%; }
        #contact_form .ligne-form .items-form textarea,
        #contact_form .ligne-form-ta .items-form textarea {
          height: 8rem;
          line-height: 1.2; }
    #contact_form .ligne-form-ta {
      -webkit-box-align: start;
          -ms-flex-align: start;
              align-items: flex-start;
      margin-bottom: 4rem; }
    #contact_form .error_message,
    #contact_form .envoi {
      width: 100%;
      text-align: center;
      font-family: 'exobold';
      font-size: 1rem;
      height: 3.2rem;
      padding-top: .25rem; }
    #contact_form #message_validation,
    #contact_form #apres-envoi {
      height: 2rem; } }

@media (min-width: 992px) {
  #contact_form {
    width: 39rem;
    height: 44rem;
    margin: 0 auto auto auto; }
    #contact_form .ligne-form,
    #contact_form .ligne-form-ta {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
          -ms-flex-direction: row;
              flex-direction: row;
      -webkit-box-pack: justify;
          -ms-flex-pack: justify;
              justify-content: space-between;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      height: -webkit-fit-content;
      height: -moz-fit-content;
      height: fit-content;
      width: 34rem;
      margin: auto; }
      #contact_form .ligne-form .items-form,
      #contact_form .ligne-form-ta .items-form {
        width: 16rem;
        text-align: right; }
        #contact_form .ligne-form .items-form label,
        #contact_form .ligne-form-ta .items-form label {
          font-size: 1.5rem;
          color: black;
          line-height: 2.3rem;
          height: 2.3rem;
          margin-bottom: 0; }
        #contact_form .ligne-form .items-form .input,
        #contact_form .ligne-form-ta .items-form .input {
          font-size: 1.1rem !important;
          width: 100%; }
        #contact_form .ligne-form .items-form textarea,
        #contact_form .ligne-form-ta .items-form textarea {
          height: 9rem;
          line-height: 1.2; }
    #contact_form .ligne-form-ta {
      -webkit-box-align: start;
          -ms-flex-align: start;
              align-items: flex-start;
      margin-bottom: 4.3rem; }
    #contact_form .error_message,
    #contact_form .envoi {
      width: 100%;
      text-align: center;
      font-family: 'exobold';
      font-size: 1.1rem;
      height: 4.2rem;
      padding-top: .3rem; }
    #contact_form #message_validation,
    #contact_form #apres-envoi {
      height: 2.1rem; } }

@media (min-width: 1200px) {
  #contact_form {
    width: 43rem;
    height: 46.5rem;
    margin: 0 auto auto auto; }
    #contact_form .ligne-form,
    #contact_form .ligne-form-ta {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
          -ms-flex-direction: row;
              flex-direction: row;
      -webkit-box-pack: justify;
          -ms-flex-pack: justify;
              justify-content: space-between;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      height: -webkit-fit-content;
      height: -moz-fit-content;
      height: fit-content;
      width: 38rem;
      margin: auto; }
      #contact_form .ligne-form .items-form,
      #contact_form .ligne-form-ta .items-form {
        width: 18rem;
        text-align: right;
        font-family: 'exoregular';
        height: -webkit-fit-content;
        height: -moz-fit-content;
        height: fit-content; }
        #contact_form .ligne-form .items-form label,
        #contact_form .ligne-form-ta .items-form label {
          font-size: 1.6rem;
          color: black;
          line-height: 2.5rem;
          height: 2.5rem;
          margin-bottom: 0; }
        #contact_form .ligne-form .items-form .input,
        #contact_form .ligne-form-ta .items-form .input {
          font-size: 1.2rem !important;
          width: 100%; }
        #contact_form .ligne-form .items-form textarea,
        #contact_form .ligne-form-ta .items-form textarea {
          height: 9.4rem;
          line-height: 1.2; }
    #contact_form .ligne-form-ta {
      -webkit-box-align: start;
          -ms-flex-align: start;
              align-items: flex-start;
      margin-bottom: 4.4rem; }
    #contact_form .error_message,
    #contact_form .envoi {
      width: 100%;
      text-align: center;
      font-family: 'exobold';
      font-size: 1.2rem;
      height: 4.4rem;
      padding-top: .3rem; }
    #contact_form #message_validation,
    #contact_form #apres-envoi {
      height: 2.2rem; } }

#page-legale .row {
  margin: 2.5rem auto 1rem auto; }
  #page-legale .row p {
    line-height: 1.3;
    margin-bottom: 0; }
  #page-legale .row .main .bloc-legal {
    background-color: white;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    margin: 2rem auto;
    padding: .5rem 1rem;
    border-radius: 1rem; }
  #page-legale .row aside {
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content; }
    #page-legale .row aside li {
      list-style-type: none;
      margin: 1rem auto;
      padding: .5rem 1rem;
      background-color: white;
      border-radius: 1rem; }
      #page-legale .row aside li p {
        text-transform: uppercase; }
      #page-legale .row aside li a {
        color: black; }
        #page-legale .row aside li a:hover {
          background-color: rgba(0, 0, 0, 0.2);
          text-decoration: none; }
      @media (max-width: 992px) {
        #page-legale .row aside li p {
          font-size: 1.76vw; }
        #page-legale .row aside li a {
          font-size: 2.2vw; } }
      @media (min-width: 1200px) {
        #page-legale .row aside li p {
          font-size: 1rem; }
        #page-legale .row aside li a {
          font-size: 1.2rem; } }

.menu-menu-superieur-container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1; }
  .menu-menu-superieur-container ul {
    -webkit-margin-after: 0;
            margin-block-end: 0;
    -webkit-margin-before: 0;
            margin-block-start: 0;
    -webkit-padding-start: 0;
            padding-inline-start: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    list-style: none;
    margin-bottom: 0; }
    @media (max-width: 576px) {
      .menu-menu-superieur-container ul {
        margin-left: auto;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: end;
            -ms-flex-align: end;
                align-items: flex-end; } }
    @media (min-width: 576px) {
      .menu-menu-superieur-container ul {
        -webkit-box-flex: 1;
            -ms-flex-positive: 1;
                flex-grow: 1;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
            -ms-flex-direction: row;
                flex-direction: row;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center; } }
    @media (min-width: 768px) {
      .menu-menu-superieur-container ul {
        margin-left: auto;
        -webkit-box-flex: 0;
            -ms-flex-positive: 0;
                flex-grow: 0; } }
    .menu-menu-superieur-container ul li a {
      display: block;
      font-family: 'exoregular';
      letter-spacing: .08rem;
      color: white !important; }
      .menu-menu-superieur-container ul li a:hover {
        color: rgba(255, 255, 255, 0.5) !important;
        text-decoration: none; }
      @media (max-width: 576px) {
        .menu-menu-superieur-container ul li a {
          font-size: 3.8vw;
          padding: .6rem .8rem; } }
      @media (min-width: 576px) {
        .menu-menu-superieur-container ul li a {
          font-size: 1rem;
          padding: .6rem .8rem; } }
      @media (min-width: 768px) {
        .menu-menu-superieur-container ul li a {
          font-size: 1.15rem;
          padding: .5rem .6rem; } }
      @media (min-width: 992px) {
        .menu-menu-superieur-container ul li a {
          font-size: 1.2rem;
          padding: .55rem .7rem; } }
      @media (min-width: 1200px) {
        .menu-menu-superieur-container ul li a {
          font-size: 1.4rem;
          padding: .6rem .8rem; } }

.logo {
  font-family: "Caribbean";
  text-transform: none; }
  @media (max-width: 576px) {
    .logo {
      font-size: 2.5vw;
      letter-spacing: .06vw; } }
  @media (min-width: 576px) {
    .logo {
      font-size: .9rem;
      letter-spacing: .02rem; } }
  @media (min-width: 768px) {
    .logo {
      font-size: .9rem;
      letter-spacing: .02rem; } }
  @media (min-width: 992px) {
    .logo {
      font-size: 1.1rem;
      letter-spacing: .025rem; } }
  @media (min-width: 1200px) {
    .logo {
      font-size: 1.2rem;
      letter-spacing: .027rem; } }

/*# sourceMappingURL=styles.css.map */