@font-face {
  font-family: "DINPro-Light";
  src: url("typo/DINPro-Light.otf") format("opentype");
}

@font-face {
  font-family: "DINPro-Bold";
  src: url("typo/DINPro-Bold.otf") format("opentype");
}

@font-face {
  font-family: "NewsGothicStd";
  src: url("typo/NewsGothicStd.otf") format("opentype");
}

@font-face {
  font-family: "NewsGothicStd-Bold";
  src: url("typo/NewsGothicStd-Bold.otf") format("opentype");
}

@font-face {
  font-family: "NewsGothicStd-Oblique";
  src: url("typo/NewsGothicStd-Oblique.otf") format("opentype");
}

html,
body {
  width: 100%;
  height: 100%;
  margin: 0;
  overflow: hidden;
}
dt {
  font-family: "NewsGothicStd-Bold";
}

#stage {
  position: absolute;
  top: 0;
  left: 0;
  width: 1920px;
  height: 1080px;
  color: #323e48;
}

#page_01 {
  position: absolute;
  top: 0;
  left: 0;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

#page_02 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_03 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_04 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_05 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_06 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_07 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_08 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_09 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_video {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_10 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_11 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_12 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_13 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_14 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_15 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_16 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_17 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_18 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}
#page_18b {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_cccream {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_19 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_20 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_21 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_22 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_23 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_24 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_25 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_26 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_27 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_28 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_29 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_30 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_31 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_32 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_33 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_34 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_35 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_36 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_37 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_38 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_39 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_40 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_40b {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_41 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_42 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_43 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_44 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_44b {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_45 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_46 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_47 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_48 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_49 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_50 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_51 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_52 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_53 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_54 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_55 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_56 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_57 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_58 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_59 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}
#page_59b {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#page_60 {
  position: absolute;
  width: 1920px;
  height: 1080px;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: hidden;
}

#fond {
  width: 93.4vw;
}

#logo {
  position: absolute;
  top: 105px;
  left: 594px;
  width: 732px;
}

#choose_language {
  position: absolute;
  top: 434px;
  font-family: "DINPro-Light", sans-serif;
  font-weight: lighter;
  font-size: 42px;
}

#langues {
  position: absolute;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
  width: 1250px;
  top: 563px;
}

.btn_lg {
  border: 0.2vw solid rgb(255, 255, 255);
  border-radius: 999vw;
  cursor: pointer;
  width: 95px;
}

.btn_lg:hover {
  border: 0.2vw solid black;
  box-shadow: 0vw 0.5vw 0.5vw rgba(0, 0, 0, 0.4);
}

#rectangle_haut {
  position: absolute;
  top: 0;
  width: 1920px;
  height: 25px;
}

#rectangle_bas {
  position: absolute;
  top: 1055px;
  width: 1920px;
  height: 25px;
  z-index: 999;
}

#ligne {
  position: absolute;
  left: -45px;
  top: 819px;
  width: 2000px;
  height: 2px;
}

#trajet {
  position: absolute;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
  width: 1750px;
  top: 819px;
  transform: translate(-0%, -25%);
}

#trajet div {
  display: flex;
  flex-direction: column;
  align-items: center;
}

#trajet div h1 {
  font-family: "NewsGothicStd", sans-serif;
  font-size: 20px;
  font-weight: lighter;
  margin: 0;
}

.ellipse {
  margin-bottom: 17px;
  width: 50px;
  height: 50px;
  cursor: pointer;
}

#ph_1 {
  position: absolute;
  left: 514px;
  top: 395px;
  width: 332px;
  height: 332px;
}

#ph_2 {
  position: absolute;
  left: 793px;
  top: 394px;
  width: 334px;
  height: 334px;
}

#ph_3 {
  position: absolute;
  left: 1102px;
  top: 392px;
  width: 338px;
  height: 338px;
}

.animate-in-ph1 {
  animation: slide-in-ph1 2.5s forwards;
}

@keyframes slide-in-ph1 {
  0% {
    left: -100%;
  }
  100% {
    left: 514px;
  }
}

.animate-in-ph2 {
  animation: slide-in-ph2 2s forwards;
}

@keyframes slide-in-ph2 {
  0% {
    left: -100%;
  }
  100% {
    left: 793px;
  }
}

.animate-in-ph3 {
  animation: slide-in-ph3 1.5s forwards;
}

@keyframes slide-in-ph3 {
  0% {
    left: -100%;
  }
  100% {
    left: 1102px;
  }
}

#navigation {
  position: absolute;
  left: 72px;
  top: 0px;
  width: 1801px;
  height: 111px;
  background-color: rgb(240, 239, 239);
  /*border: 1px solid red;*/
  border-radius: 0 0 0.5vw 0.5vw;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  z-index: 999;
}

#menu {
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-left: 15px;
}

#menu .ellipse {
  width: 44px;
  height: 44px;
  margin-bottom: 0;
  margin-right: 0.5vw;
}

#menu div {
  display: flex;
  flex-direction: raw;
  flex-wrap: nowrap;
  align-items: center;
  margin: 0 0 0 1.5vw;
  cursor: pointer;
}

#menu div h1 {
  font-family: "NewsGothicStd", sans-serif !important;
  font-size: 20px !important;
  font-weight: lighter !important;
  color: #000000 !important;
  position: static !important;
  letter-spacing: 0 !important;
}

#menu div:hover h1 {
  color: #d8292f !important;
  text-shadow: 0vw 0.3vw 0.3vw rgba(0, 0, 0, 0.4);
}

#menu div:hover .ellipse {
  content: url(bouton/Groupe1.png);
}

#trajet .ellipse:hover {
  content: url(bouton/Groupe1.png);
}

#fleches img {
  width: 37px;
  height: 29px;
  margin-right: 2vw;
  cursor: pointer;
}

.arrow:hover {
  filter: grayscale(100%);
}

#trajet_page3 {
  position: absolute;
  left: 121px;
  top: 172px;
  width: 32px;
  height: 612px;
}

.parcours {
  position: absolute;
  left: 142px;
  top: 119px;
  width: 700px;
  height: 475px;
  list-style-type: none;
  font-family: "NewsGothicStd", sans-serif;
  font-size: 25px;
}

ul li {
  line-height: 3.6;
}

#page_03 #logo {
  left: 961px;
  top: 170px;
  width: 767px;
  height: 235px;
}

#page_03 #decoration {
  position: absolute;
  left: 1056px;
  top: 443px;
  width: 671px;
  height: 579px;
}

#etape {
  font-family: "NewsGothicStd-Bold", sans-serif;
  color: #d8292f;
}

.paragraphe {
  position: absolute;
  text-align: center;
  left: 960px;
  top: 160px;
  width: 900px;
}

.paragraphe p {
  font-family: "NewsGothicStd", sans-serif;
  font-size: 30px;
  margin: 0;
}

.paragraphe #date {
  font-family: "NewsGothicStd", sans-serif;
  font-weight: lighter;
  color: #d8292f;
  font-size: 40px;
  margin: 0;
}

.paragraphe #barre {
  background-color: #d8292f;
  height: 5px;
  width: 40px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 1.5vw;
  margin-bottom: 1.5vw;
}

.paragraphe #logo {
  position: relative;
  width: 375px;
  top: 0;
  left: 0;
  margin-top: 1vw;
  margin-bottom: 1vw;
}

#page_04 #decoration {
  position: absolute;
  left: 151px;
  top: 629px;
  width: 389px;
  height: 393px;
}

.paragraphe b {
  font-family: "NewsGothicStd-Bold", sans-serif;
}

#page_05 #decoration {
  position: absolute;
  left: 1026px;
  top: 779px;
  width: 644px;
  height: 247px;
}

#ordre {
  position: absolute;
  top: 892px;
  width: 1700px;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
}

.numero {
  display: flex;
  flex-direction: column;
  align-items: center;
  font-family: "NewsGothicStd", sans-serif;
  font-size: 20px;
  width: 300px;
  text-align: center;
}

.numero div {
  margin-bottom: 0.5vw;
  color: #d8292f;
  font-family: "NewsGothicStd", sans-serif;
  font-size: 24px;
  border: 1px solid #d8292f;
  border-radius: 999vw;
  height: 46px;
  width: 60px;
  padding-top: 15px;
}

.Ellipse_1_copie_16 {
  border-width: 2px;
  border-color: rgb(216, 41, 47);
  border-style: solid;
  border-radius: 50%;
  position: absolute;
  left: 1621px;
  top: 892px;
  width: 46px;
  height: 46px;
  z-index: 36;
}

#page_07 .paragraphe {
  position: absolute;
  text-align: center;
  top: 441px;
  left: 960px;
}

#page_07 #decoration {
  position: absolute;
  left: 157px;
  top: 693px;
  width: 603px;
  height: 333px;
}

#page_07 #decoration_2 {
  position: absolute;
  left: 1090px;
  top: 170px;
  width: 463px;
  height: 247px;
}

#page_08 .paragraphe {
  position: absolute;
  text-align: center;
  left: 959.808px;
  top: 533.164px;
}

#page_08 #decoration {
  position: absolute;
  left: 1099px;
  top: 99px;
  width: 735px;
}

#infos {
  margin-top: 3vw;
  padding: 0 5vw 0 5vw;
  font-family: "NewsGothicStd", sans-serif;
  font-size: 21px;
  border-left: 10px solid #d8292f;
  border-right: 10px solid #d8292f;
  color: #d8292f;
}

#page_08 .paragraphe #barre {
  background-color: #d8292f;
  height: 3px;
  width: 100px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 0.8vw;
  margin-bottom: 0.8vw;
}

#page_09 #decoration {
  position: absolute;
  left: 177px;
  top: 606px;
  width: 508px;
  height: 507px;
}

#page_09 #infos {
  color: black;
  border: 3px solid #d8292f;
  text-align: left;
  padding: 0.5vw 1vw 0.5vw 1vw;
  font-size: 30px;
  margin-top: 2vw;
}

#page_09 #infos_2 {
  font-family: "NewsGothicStd", sans-serif;
  color: black;
  border: 3px solid #d8292f;
  text-align: left;
  padding: 0.5vw 1vw 0.5vw 1vw;
  font-size: 30px;
  border-top: 0;
  margin-bottom: 2vw;
}

#page_09 .paragraphe #barre {
  background-color: #d8292f;
  height: 4px;
  width: 120px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 0.8vw;
  margin-bottom: 0.8vw;
}

#page_09 .paragraphe b {
  margin-right: 2vw;
  font-family: "NewsGothicStd-Bold", sans-serif;
}

#arbre {
  position: absolute;
  left: 317px;
  top: 305px;
  width: 1286px;
}

#page_10 #soin {
  color: #d8292f;
  position: absolute;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  top: 175px;
  left: 950px;
  font-family: "NewsGothicStd-Bold", sans-serif;
  font-size: 30px;
  transform: translate(-50%, -0%);
}

#page_10 p {
  font-size: 20px;
  font-family: "NewsGothicStd", sans-serif;
  color: black;
  margin: 0;
}

#page_10 #men {
  color: #d8292f;
  position: absolute;
  display: flex;
  flex-direction: raw;
  flex-wrap: wrap;
  justify-content: start;
  align-items: center;
  top: 590px;
  left: 1425px;
  font-family: "NewsGothicStd-Bold", sans-serif;
  font-size: 30px;
  transform: translate(-0%, -5%);
}

#page_10 #parfum {
  color: #d8292f;
  position: absolute;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  top: 850px;
  left: 950px;
  font-family: "NewsGothicStd-Bold", sans-serif;
  font-size: 30px;
  transform: translate(-50%, -0%);
}

#make-up {
  position: absolute;
  top: 592px;
  left: 345px;
  transform: translate(-0%, -27%);
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
}

#make-up div {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  margin-bottom: 70px;
}

#make-up h2 {
  color: #d8292f;
  font-size: 30px;
  margin: 0;
  font-family: "NewsGothicStd-Bold", sans-serif;
}

#branche {
  position: absolute;
  width: 266px;
  left: 607px;
  top: 586px;
  transform: translate(-0%, -37%);
}

.btn_arbre {
  margin: 0.5vw;
  width: 30px;
  cursor: pointer;
  height: 30px;
}

#intemporel b {
  font-family: "DINPro-Bold", sans-serif;
  position: absolute;
  top: 875px;
  left: 425px;
  transform: translate(-50%, -0%);
}

#godai b {
  font-family: "DINPro-Bold", sans-serif;
  position: absolute;
  top: 875px;
  left: 1490px;
  transform: translate(-50%, -0%);
}

#btn_parfum:hover {
  content: url(bouton/On\ mouse\ over.png);
}

#btn_men:hover {
  content: url(bouton/On\ mouse\ over.png);
}

#btn_soin:hover {
  content: url(bouton/On\ mouse\ over.png);
}

#btn_makeup-klassisches:hover {
  content: url(bouton/On\ mouse\ over.png);
}

#btn_makeup-naturliches:hover {
  content: url(bouton/On\ mouse\ over.png);
}

#page_11 #logo {
  left: 693px;
  top: 170px;
  width: 519px;
}

#page_11 h1 {
  position: absolute;
  top: 366px;
  left: 460px;
  font-size: 73px;
  font-family: "DINPro-Light", sans-serif;
  font-weight: lighter;
}

#page_11 .paragraphe {
  position: absolute;
  top: 550px;
  left: 389px;
  text-align: start;
  width: 1450px;
}

#page_11 .paragraphe div {
  display: flex;
  flex-direction: row;
  justify-content: left;
}

#page_11 .paragraphe p {
  font-size: 24px;
  margin-bottom: 1.2vw;
  margin-left: 0.5vw;
}

#page_11 .paragraphe #barre {
  margin: 0;
  margin-top: 13px;
  height: 5px;
  width: 40px;
}

#filet {
  position: absolute;
  left: 428px;
  top: 344px;
  width: 1068px;
}

#page_12 .paragraphe {
  display: flex;
  flex-direction: column;
  position: absolute;
  justify-content: center;
  align-items: center;
  left: 430px;
  top: 463px;
  transform: translateX(-50%);
}

#page_12 .paragraphe p {
  text-align: left;
  font-size: 26px;
  margin-bottom: 0.4vw;
}

#page_12 .paragraphe #btn_aac {
  width: 30px;
  margin: 1vw;
  cursor: pointer;
}

#btn_aac:hover {
  content: url(bouton/On\ mouse\ over.png);
}

#page_12 .paragraphe #logo_p {
  width: 219px;
  margin: 0;
}

#page_12 .paragraphe h2 {
  font-size: 30px;
  margin: 0;
  margin-top: 0.5vw;
}

#page_12 .paragraphe_2 {
  display: flex;
  flex-direction: column;
  position: absolute;
  justify-content: center;
  align-items: center;
  left: 1495px;
  top: 463px;
  transform: translateX(-50%);
  width: 1000px;
}

#page_12 .paragraphe_2 p {
  text-align: left;
  font-size: 26px;
  font-family: "NewsGothicStd", sans-serif;
  margin: 0;
  margin-bottom: 0.4vw;
}

#page_12 .paragraphe_2 #btn_pg {
  width: 30px;
  margin: 1vw;
  cursor: pointer;
}

#btn_pg:hover {
  content: url(bouton/On\ mouse\ over.png);
}

#page_12 .paragraphe_2 #logo_p {
  width: 264px;
  margin: 0;
}

#page_12 .paragraphe_2 h2 {
  font-family: "NewsGothicStd-Bold", sans-serif;
  font-size: 30px;
  margin: 0;
  margin-top: 0.5vw;
}

#page_12 .paragraphe_2 #infos {
  font-family: "NewsGothicStd-Oblique", sans-serif;
  font-size: 22px;
  border: 0;
  padding: 0;
  color: black;
  margin-top: 2vw;
  text-align: center;
}

#page_12 #logo {
  position: absolute;
  left: 911px;
  top: 172px;
  width: 98px;
}

#page_12 h1 {
  position: absolute;
  color: #d8292f;
  font-family: "NewsGothicStd-Bold", sans-serif;
  font-size: 30px;
  top: 265px;
}

#page_12 #decoration {
  position: absolute;
  left: 1602px;
  top: 342px;
  width: 147px;
  transform: translate(-50%, -50%);
}

#page_12 h3 {
  position: absolute;
  left: 1602px;
  top: 342px;
  text-align: center;
  font-size: 16px;
  font-family: "DINPro-Light", sans-serif;
  color: white;
  font-weight: lighter;
  transform: translate(-50%, -80%);
}

#page_13 #logo {
  position: absolute;
  left: 693px;
  top: 170px;
  width: 519px;
}

#page_13 #titre {
  position: absolute;
  left: 955px;
  top: 544px;
  font-family: "DINPro-Light", sans-serif;
  font-size: 62px;
  font-weight: lighter;
  transform: translateX(-50%);
}

#page_14 #arbre {
  position: absolute;
  left: 143px;
  top: 236px;
  width: 1632px;
  z-index: -1;
}

.lg_gamme {
  position: absolute;
  top: 590px;
  display: flex;
  flex-direction: column;
  align-items: center;
  font-family: "NewsGothicStd", sans-serif;
  font-size: 14px;
  text-align: center;
  background-color: white;
}

#lg_cccream {
  color: #13bfd6;
  transform: translate(-50%, -10%);
  left: 568px;
  top: 261px;
}

#lg_cccream img {
  width: 63px;
}

#lg_24h {
  color: #13bfd6;
  transform: translate(-50%, -10%);
  left: 140px;
}

#lg_24h img {
  width: 48px;
}

#lg_dn {
  left: 420px;
  color: #9cc3e5;
  transform: translate(-50%, -10%);
}

#lg_dn img {
  width: 200px;
}

#lg_mk {
  left: 690px;
  color: #62339b;
  transform: translate(-50%, -50%);
}

#lg_mk img {
  width: 80px;
}

#lg_bb {
  left: 960px;
  color: #80bc03;
  transform: translate(-50%, -20%);
}

#lg_bb img {
  width: 100px;
}

#lg_ut {
  left: 1370px;
  color: #d8292f;
  transform: translateX(-50%);
}

#lg_ut img {
  width: 140px;
}

#lg_ex {
  left: 1660px;
  transform: translate(-0%, -10%);
}

#lg_ex img {
  width: 100px;
}

.produit_gamme {
  position: absolute;
  top: 670px;
}

.produit_gamme img {
  width: 225px;
}

#produit_cccream {
  left: 645px;
  top: 199px;
}
#produit_cccream img {
  width: 83px;
}

#produit_24h {
  left: 30px;
  top: 685px;
}

#produit_dn {
  top: 685px;
  left: 320px;
}

#produit_mk {
  top: 685px;
  left: 590px;
}

#produit_bb {
  top: 725px;
  left: 830px;
}

#produit_ut_blanc {
  top: 725px;
  left: 1120px;
}

#produit_ut_rouge {
  top: 700px;
  left: 1355px;
}

#produit_ut_rouge img {
  width: 300px;
}

#produit_ex {
  left: 1650px;
}

#btn_gammes {
  position: absolute;
  top: 925px;
  width: 1700px;
  display: flex;
  justify-content: space-between;
}

.btn_gm {
  width: 30px;
  margin: 1vw;
  cursor: pointer;
}
#infos_cccream {
  visibility: hidden;
  position: absolute;
  font-family: "NewsGothicStd", sans-serif;
  background-color: white;
  padding: 10px;
  border: 2px solid #e2c0b2;
  border-radius: 5px;
  bottom: 680px;
  left: 530px;
  width: 200px;
  font-size: 18px;
  transform: translate(-50%, -50%);
}
#infos_cccream li::before {
  color: #e2c0b2 !important;
  width: 14px !important;
}

#infos_24h {
  visibility: hidden;
  position: absolute;
  font-family: "NewsGothicStd", sans-serif;
  background-color: white;
  padding: 10px;
  border: 2px solid #13bfd6;
  border-radius: 5px;
  bottom: 550px;
  left: 150px;
  font-size: 18px;
  transform: translate(-50%, -50%);
}

#page_14 ul {
  margin: 0;
  padding: 0;
  margin-left: 7px;
  list-style: none;
}

#page_14 li {
  line-height: 20px;
  margin: 5px 0px;
}

#page_14 li::before {
  content: "•";
  color: #d8292f;
  display: inline-block;
  width: 7px;
  margin-left: -10px;
}

#infos_dn {
  visibility: hidden;
  position: absolute;
  font-family: "NewsGothicStd", sans-serif;
  background-color: white;
  padding: 10px;
  border: 2px solid #9cc3e5;
  border-radius: 5px;
  bottom: 475px;
  left: 422px;
  font-size: 18px;
  transform: translate(-50%, -50%);
}

#infos_dn li::before {
  color: #9cc3e5;
}

#infos_mk {
  visibility: hidden;
  position: absolute;
  font-family: "NewsGothicStd", sans-serif;
  background-color: white;
  padding: 10px;
  border: 2px solid #62339b;
  border-radius: 5px;
  bottom: 465px;
  left: 690px;
  font-size: 18px;
  transform: translate(-50%, -50%);
}

#infos_mk li::before {
  color: #62339b;
}

#list_mk {
  padding-top: 40px;
  border-top: 10px solid white;
  border-bottom: 10px solid white;
}

#list_mk li {
  line-height: 15px;
  margin: 5px -3px;
}

#list_mk li::before {
  content: "•";
  width: 15px;
  margin-left: -13px;
}

#infos_bb {
  visibility: hidden;
  position: absolute;
  font-family: "NewsGothicStd", sans-serif;
  background-color: white;
  padding: 10px;
  border: 2px solid #80bc03;
  border-radius: 5px;
  bottom: 505px;
  left: 960px;
  font-size: 18px;
  transform: translate(-50%, -50%);
  z-index: 999;
}

#infos_bb li::before {
  color: #80bc03;
}

#infos_ut {
  visibility: hidden;
  position: absolute;
  font-family: "NewsGothicStd", sans-serif;
  background-color: white;
  padding: 10px;
  border: 2px solid #d8292f;
  border-radius: 5px;
  bottom: 495px;
  left: 1375px;
  font-size: 18px;
  transform: translate(-50%, -50%);
}

#infos_ex {
  visibility: hidden;
  position: absolute;
  font-family: "NewsGothicStd", sans-serif;
  background-color: white;
  padding: 10px;
  border: 2px solid black;
  border-radius: 5px;
  bottom: 585px;
  left: 1625px;
  width: 275px;
  font-size: 18px;
}

#infos_ex li::before {
  color: black;
}
#btn_cccream:hover {
  content: url(bouton/bouton\ cccream\ ON.png);
}
#btn_cccream {
  position: absolute;
  left: 725px;
  top: 430px;
}
#btn_gamme_24h:hover {
  content: url(bouton/bouton\ 24H\ ON.png);
}
#btn_gamme_dn:hover {
  content: url(bouton/bouton\ DoubleNettoyage\ \ ON.png);
}
#btn_gamme_mk:hover {
  content: url(bouton/bouton\ fiche\ produit\ MASK+\ ON.png);
}
#btn_gamme_bb:hover {
  content: url(bouton/bouton\ vers\ fiche\ produit\ bamboo\ ON.png);
}
#btn_gamme_ut_blanc:hover {
  content: url(bouton/boutton\ extreme\ ON.png);
}
#btn_gamme_ut_rouge:hover {
  content: url(bouton/boutton\ extreme\ ON.png);
}
#btn_gamme_ex:hover {
  content: url(bouton/boutton\ extreme\ ON.png);
}

#page_15 #logo {
  width: 410px;
  top: 166px;
  transform: translateX(40%);
}

#page_15 h1 {
  position: absolute;
  top: 180px;
  font-family: "NewsGothicStd", sans-serif;
  font-weight: lighter;
  font-size: 30px;
  color: #9cc3e5;
}

#page_15 .la_gamme {
  position: absolute;
  top: 250px;
  width: 1800px;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  text-align: center;
}

#page_15 .la_gamme p {
  width: 310px;
}

.la_gamme div {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: right;
  font-family: "NewsGothicStd-Bold", sans-serif;
  font-size: 18px;
}

#page_15 .infos_produit {
  width: 350px;
}

#text_lotion {
  align-items: start;
}

.la_gamme .le_produit {
  justify-content: end;
  margin-bottom: 1vw;
  height: 325px;
}

.la_gamme h4 {
  height: 75px;
}

#page_15 #produit_1 img {
  width: 140px;
}

#page_15 #produit_2 img {
  width: 310px;
}

#page_15 #produit_3 img {
  width: 230px;
}

#page_15 #produit_4 img {
  width: 150px;
}

#page_15 #produit_5 img {
  width: 300px;
}

.la_gamme h4 {
  font-size: 23px;
}

.la_gamme p {
  font-family: "NewsGothicStd", sans-serif;
  text-align: justify;
  margin-top: 0.3vw;
  font-size: 18px;
}

.bt-dn {
  position: absolute;
  top: 650px;
}

.bt-dn:hover {
  content: url(bouton/bouton\ DoubleNettoyage\ \ ON.png);
}

#btn_produit_gel-demaq {
  left: 275px;
}
#btn_produit_mousse-1 {
  left: 556px;
}
#btn_produit_mousse-2 {
  left: 710px;
}
#btn_produit_lotion-1 {
  left: 928px;
}
#btn_produit_lotion-2 {
  left: 1071px;
}
#btn_produit_exfoliant {
  left: 1363px;
}
#btn_produit_eponge {
  left: 1715px;
}

#page_16 #logo {
  width: 125px;
  top: 125px;
  left: 910px;
}

#page_16 h1 {
  position: absolute;
  top: 180px;
  font-family: "NewsGothicStd", sans-serif;
  font-weight: lighter;
  font-size: 30px;
  color: #62339b;
}

#page_16 .la_gamme {
  position: absolute;
  top: 250px;
  width: 1600px;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  text-align: center;
}

#page_16 .infos_produit {
  width: 350px;
}

#page_16 .le_produit img {
  width: 350px;
}

.bt-mk {
  position: absolute;
  top: 650px;
}

.bt-mk:hover {
  content: url(bouton/bouton\ fiche\ produit\ MASK+\ ON.png);
}

#btn_produit_apaisant {
  left: 404px;
}
#btn_produit_nourrissant {
  left: 803px;
}
#btn_produit_purifiant {
  left: 1204px;
}
#btn_produit_eclat {
  left: 1610px;
}

#page_17 #logo {
  width: 190px;
  left: 865px;
  top: 130px;
}

#page_17 h1 {
  font-family: "NewsGothicStd", sans-serif;
  font-weight: lighter;
  font-size: 30px;
  color: #80bc03;
  margin-bottom: 5px;
}

#page_17 .la_gamme {
  position: absolute;
  top: 350px;
  width: 1600px;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  text-align: center;
}
#page_17 .la_gamme p {
  width: 270px;
}

#page_17 .infos_produit {
  width: 350px;
}

#page_17 #produit_1 img {
  width: 140px;
  position: absolute;
  z-index: -1;
}

#page_17 #produit_2 img {
  width: 220px;
  position: absolute;
  z-index: -1;
  top: 130px;
}

#page_17 #produit_3 img {
  width: 125px;
  position: absolute;
  z-index: -1;
  top: 145px;
}

#page_17 #produit_4 img {
  width: 130px;
  position: absolute;
  z-index: -1;
  top: 140px;
}

#page_17 #produit_5 img {
  width: 250px;
  position: absolute;
  z-index: -1;
  top: 275px;
}

#page_17 #infos {
  border: 0;
  margin: 0;
  padding: 0;
  font-family: "NewsGothicStd", sans-serif;
  font-weight: lighter;
  font-size: 22px;
  color: #80bc03;
}

#titre-infos {
  position: absolute;
  top: 170px;
}

.bt-bb {
  position: absolute;
  top: 740px;
}

.bt-bb:hover {
  content: url(bouton/bouton\ vers\ fiche\ produit\ bamboo\ ON.png);
}

#btn_produit_mousse-nettoyante {
  left: 378px;
}

#btn_produit_masque-energisant {
  left: 696px;
}

#btn_produit_soin-yeux {
  left: 1012px;
}

#btn_produit_soin-perfecteur {
  left: 1320px;
}

#btn_produit_soin-visage {
  left: 1705px;
}

#page_17 #infos_2 {
  position: absolute;
  top: 200px;
  left: 200px;
  font-family: "DINPro-Bold", sans-serif;
  text-align: center;
  font-size: 22px;
  background-color: #80bc03;
  color: white;
  padding: 20px;
}

#page_18 #logo {
  width: 275px;
  left: 825px;
  top: 150px;
}

#page_18 h1 {
  position: absolute;
  top: 180px;
  font-family: "NewsGothicStd", sans-serif;
  font-weight: lighter;
  font-size: 30px;
  color: #d8292f;
  text-align: center;
}

#page_18 .la_gamme {
  position: absolute;
  top: 400px;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  text-align: center;
}

#page_18 #infos {
  border: 0;
  margin: 0;
  padding: 0;
  position: absolute;
  top: 400px;
  left: 1150px;
  font-family: "DINPro-Bold", sans-serif;
  font-weight: lighter;
  font-size: 32px;
  color: #000000;
}

#page_18 #infos_2 {
  position: absolute;
  top: 500px;
  left: 350px;
  font-family: "NewsGothicStd", sans-serif;

  text-align: center;
  font-size: 25px;
  color: rgb(0, 0, 0);
  padding: 0.5vw;
  padding-left: 1vw;
  padding-right: 1vw;
  border-left: 0.2vw solid #d8292f;
  border-right: 0.2vw solid #d8292f;
}

#page_18 #infos_3 {
  position: absolute;
  top: 525px;
  left: 1150px;
  font-family: "DINPro", sans-serif;

  text-align: left;
  font-size: 23px;
}

#page_18 .le_produit img {
  position: absolute;
  top: -100px;
  width: 250px;
  z-index: -1;
}

#page_18 h4 {
  font-family: "NewsGothicStd", sans-serif;
  font-weight: lighter;
  color: #d8292f;
  font-size: 40px;
  margin-bottom: 0.5vw;
  height: 45px;
}

#page_18 h5 {
  font-family: "NewsGothicStd", sans-serif;
  font-weight: lighter;
  color: #d8292f;
  font-size: 25px;
  margin: 0;
}

#page_18 .la_gamme p {
  font-family: "NewsGothicStd", sans-serif;
  text-align: center;
  font-size: 25px;
  margin: 0;
  margin-top: 0.4vw;
}

#page_18b #logo {
  width: 275px;
  left: 825px;
  top: 150px;
}

#page_18b h1 {
  position: absolute;
  top: 180px;
  font-family: "NewsGothicStd", sans-serif;
  font-weight: lighter;
  font-size: 30px;
  color: #d8292f;
  text-align: center;
}

#page_18b .la_gamme {
  position: absolute;
  top: 400px;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  text-align: center;
}

#page_18b #infos {
  border: 0;
  margin: 0;
  padding: 0;
  position: absolute;
  top: 470px;
  left: 1210px;
  font-family: "DINPro-Bold", sans-serif;
  font-weight: lighter;
  font-size: 32px;
  color: #000000;
}

#page_18b #infos_2 {
  position: absolute;
  top: 500px;
  left: 350px;
  font-family: "NewsGothicStd", sans-serif;

  text-align: center;
  font-size: 25px;
  color: rgb(0, 0, 0);
  padding: 0.5vw;
  padding-left: 1vw;
  padding-right: 1vw;
  border-left: 0.2vw solid #d8292f;
  border-right: 0.2vw solid #d8292f;
}

#page_18b #infos_3 {
  position: absolute;
  top: 545px;
  left: 1210px;
  font-family: "DINPro", sans-serif;

  text-align: left;
  font-size: 23px;
}

#page_18b .le_produit img {
  position: absolute;
  top: -100px;
  width: 530px;
  z-index: -1;
}

#page_18b h4 {
  font-family: "NewsGothicStd", sans-serif;
  font-weight: lighter;
  color: #d8292f;
  font-size: 40px;
  margin-bottom: 0.5vw;
  height: 45px;
}

#page_18b h5 {
  font-family: "NewsGothicStd", sans-serif;
  font-weight: lighter;
  color: #d8292f;
  font-size: 25px;
  margin: 0;
}

#page_18b .la_gamme p {
  font-family: "NewsGothicStd", sans-serif;
  text-align: center;
  font-size: 25px;
  margin: 0;
  margin-top: 0.4vw;
}

#sur2 {
  position: absolute;
  top: 130px;
  left: 1700px;
  font-family: "NewsGothicStd", sans-serif;
  font-size: 35px;
  border: 4px solid #d8292f;
  color: #d8292f;
  padding: 10px 25px;
}

.bt-cccream:hover {
  content: url(bouton/bouton\ cccream\ ON.png);
}

#page_cccream #logo {
  width: 275px;
  left: 175px;
  top: 420px;
}

#page_cccream h1 {
  position: absolute;
  top: 180px;
  font-family: "NewsGothicStd", sans-serif;
  font-weight: bolder;
  font-size: 30px;
  color: #e2c0b2;
  text-align: center;
}

#page_cccream .la_gamme {
  position: absolute;
  top: 400px;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  text-align: center;
}

#page_cccream #infos {
  border: 0;
  margin: 0;
  padding: 0;
  position: absolute;
  top: 490px;
  left: 1190px;
  font-family: "DINPro-Bold", sans-serif;
  font-weight: lighter;
  font-size: 32px;
  color: #000000;
}

#page_cccream #infos_2 {
  position: absolute;
  top: 500px;
  left: 350px;
  font-family: "NewsGothicStd", sans-serif;

  text-align: center;
  font-size: 25px;
  color: rgb(0, 0, 0);
  padding: 0.5vw;
  padding-left: 1vw;
  padding-right: 1vw;
  border-left: 0.2vw solid #e2c0b2;
  border-right: 0.2vw solid #e2c0b2;
}

#page_cccream #infos_3 {
  position: absolute;
  top: 510px;
  left: 1190px;
  font-family: "NewsGothicStd", sans-serif;

  text-align: left;
  font-size: 30px;
}

#page_cccream .le_produit img {
  position: absolute;
  top: -120px;
  left: 50px;
  width: 550px;
  z-index: -1;
}

#page_cccream h4 {
  font-family: "NewsGothicStd", sans-serif;
  font-weight: lighter;
  color: #e2c0b2;
  font-size: 40px;
  margin-bottom: 0.5vw;
  height: 45px;
}

#page_cccream h5 {
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  color: #e2c0b2;
  position: absolute;
  top: 470px;
  font-size: 25px;
  margin: 0;
}

#page_cccream .la_gamme p {
  font-family: "NewsGothicStd", sans-serif;
  text-align: center;
  font-size: 25px;
  position: relative;
  top: 160px;
  margin: 0;
  margin-top: 0.4vw;
}

#btn_produit_cccream {
  position: absolute;
  top: 700px;
  left: 1050px;
}

#btn_produit_cccream:hover {
  content: url(bouton/bouton\ cccream\ ON.png);
}

#btn_produit_soin-microbiote {
  position: absolute;
  top: 700px;
  left: 1050px;
}

#btn_produit_ultratime2 {
  position: absolute;
  top: 700px;
  left: 1050px;
}

#btn_produit_soin-microbiote:hover {
  content: url(bouton/boutton\ extreme\ ON.png);
}

#page_19 #logo {
  width: 275px;
  left: 825px;
  top: 150px;
}

#page_19 h1 {
  position: absolute;
  top: 180px;
  font-family: "NewsGothicStd", sans-serif;
  font-weight: lighter;
  font-size: 30px;
  color: #d8292f;
}

#page_19 #infos {
  border: 0;
  margin: 0;
  padding: 0;
  position: absolute;
  top: 240px;
  font-family: "NewsGothicStd", sans-serif;
  font-weight: lighter;
  font-size: 26px;
  color: #d8292f;
}

#page_19 .la_gamme {
  position: absolute;
  top: 300px;
  width: 1600px;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  text-align: center;
}

#page_19 .la_gamme div {
  width: 300px;
}

#page_19 .le_produit img {
  width: 50px;
}

#page_19 #produit_1 img {
  width: 200px;
}

#page_19 #produit_2 img {
  width: 110px;
}

#page_19 #produit_3 img {
  width: 225px;
}

#page_19 #produit_4 img {
  width: 250px;
}

#page_19 #produit_5 img {
  width: 250px;
}

.bt-ut-blanc {
  position: absolute;
  top: 690px;
}

.bt-ut-blanc:hover {
  content: url(bouton/boutton\ extreme\ ON.png);
}

#btn_produit_ultralisse {
  left: 405px;
}

#btn_produit_spiralis {
  left: 700px;
}

#btn_produit_creme-haute-prevention-enrichie {
  left: 1075px;
}

#btn_produit_creme-haute-prevention {
  left: 1075px;
  top: 525px;
}

#btn_produit_soin-jour-nuit {
  left: 1395px;
}

#btn_produit_creme-nuit {
  left: 1725px;
}

#page_20 #logo {
  width: 275px;
  left: 825px;
  top: 150px;
}

#page_20 h1 {
  position: absolute;
  top: 180px;
  font-family: "NewsGothicStd", sans-serif;
  font-weight: lighter;
  font-size: 30px;
  color: #d8292f;
}

#page_20 #infos {
  border: 0;
  margin: 0;
  padding: 0;
  position: absolute;
  top: 240px;
  font-family: "NewsGothicStd", sans-serif;
  font-weight: lighter;
  font-size: 26px;
  color: #d8292f;
}

#page_20 .la_gamme {
  position: absolute;
  left: 70px;
  top: 300px;
  width: 1600px;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  text-align: center;
}
#page_20 .la_gamme p {
  width: 260px;
}

#page_20 .la_gamme div {
  width: 300px;
}

#page_20 .le_produit img {
  width: 50px;
}

#page_20 #produit_1 img {
  width: 110px;
}

#page_20 #produit_2 img {
  width: 150px;
  position: absolute;
  top: 135px;
  z-index: -1;
}

#page_20 #produit_3 img {
  width: 225px;
}

#page_20 #produit_4 img {
  width: 250px;
}

#page_20 #produit_5 img {
  width: 250px;
}

#page_20 #produit_6 img {
  width: 125px;
}

.bt-ut-rouge {
  position: absolute;
  top: 685px;
}

.bt-ut-rouge:hover {
  content: url(bouton/boutton\ extreme\ ON.png);
}

#btn_produit_serum-perfecteur {
  left: 250px;
}

#btn_produit_serum-restructurant {
  left: 560px;
}

#btn_produit_soins-yeux-liftant {
  left: 900px;
}

#btn_produit_creme-redensifiante {
  left: 1218px;
}

#btn_produit_masque-beaume-nuit {
  left: 1520px;
}

#btn_produit_soin-cou-decollete {
  left: 1772px;
}

#page_21 #logo {
  width: 207px;
  top: 126px;
  left: 859px;
}

#page_21 #infos {
  border: 0;
  margin: 0;
  padding: 0;
  position: absolute;
  top: 190px;
  font-family: "NewsGothicStd", sans-serif;
  font-weight: lighter;
  font-size: 30px;
  color: #000000;
}

#cote_gauche {
  width: 800px;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: start;
}

#cote_droit {
  width: 1000px;
  display: flex;
  flex-direction: row;
  justify-content: space-evenly;
  align-items: start;
}

#page_21 .la_gamme {
  position: absolute;
  top: 350px;
  width: 1700px;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  text-align: center;
}

#page_21 .la_gamme h3 {
  position: absolute;
  top: -100px;
  font-family: "NewsGothicStd", sans-serif;
  font-size: 30px;
  font-weight: lighter;
  padding: 0.5vw 1vw;
  border: 0.15vw solid #d8292f;
}

#page_21 .le_produit img {
  width: 50px;
}

#page_21 #produit_1 img {
  width: 300px;
}

#page_21 #produit_2 img {
  width: 220px;
  position: absolute;
  z-index: -1;
  top: 130px;
}

#page_21 #produit_3 img {
  width: 300px;
  position: absolute;
  z-index: -1;
  top: 240px;
}

.bt-ex {
  position: absolute;
  top: 735px;
}

.bt-ex:hover {
  content: url(bouton/boutton\ extreme\ ON.png);
}

#btn_produit_soin-extreme {
  left: 625px;
}

#btn_produit_serum-extreme {
  left: 1214px;
}

#btn_produit_soin-hydratation-extreme {
  left: 1695px;
}

#page_22 #logo {
  width: 207px;
  top: 126px;
  left: 859px;
}

#page_22 #infos {
  border: 0;
  margin: 0;
  padding: 0;
  position: absolute;
  top: 190px;
  font-family: "NewsGothicStd", sans-serif;
  font-weight: lighter;
  font-size: 30px;
  color: #000000;
}

#page_22 .la_gamme {
  position: absolute;
  top: 350px;
  width: 1700px;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  text-align: center;
}

#page_22 .la_gamme h3 {
  position: absolute;
  top: -110px;
  font-family: "NewsGothicStd", sans-serif;
  font-size: 30px;
  font-weight: lighter;
  padding: 0.5vw 8vw;
  border: 0.15vw solid #d8292f;
}

#page_22 .la_gamme div {
  width: 300px;
}

#page_22 #produit_1 img {
  width: 120px;
}

#page_22 #produit_2 img {
  width: 200px;
}

#page_22 #produit_3 img {
  width: 115px;
}

#page_22 #produit_4 img {
  width: 250px;
}

#page_22 #produit_5 img {
  width: 250px;
}

#btn_produit_serum-fermete-ex {
  left: 330px;
  top: 740px;
}

#btn_produit_soin-ex-contour-yeux {
  left: 710px;
  top: 740px;
}

#btn_produit_soin-ex-levres-contour {
  left: 1005px;
  top: 740px;
}

#btn_produit_soin-fermete-ex {
  left: 1415px;
  top: 740px;
}

#btn_produit_soin-nuit-ex {
  left: 1750px;
  top: 740px;
}

#page_23 #logo {
  width: 136px;
  top: 150px;
  left: 877px;
}

#page_23 h1 {
  position: absolute;
  top: 240px;
  font-family: "NewsGothicStd", sans-serif;
  font-weight: lighter;
  font-size: 30px;
  color: #13bfd6;
}

#page_23 #infos {
  border: 0;
  margin: 0;
  padding: 0;
  position: absolute;
  top: 300px;
  font-family: "NewsGothicStd", sans-serif;
  font-weight: lighter;
  font-size: 26px;
  color: #13bfd6;
}

#page_23 .la_gamme {
  position: absolute;
  top: 350px;
  width: 1650px;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  text-align: center;
}

#page_23 .la_gamme p {
  width: 280px;
}

#page_23 .la_gamme div {
  width: 320px;
}

#page_23 #produit_1 img {
  width: 140px;
}

#page_23 #produit_2 img {
  width: 170px;
  position: absolute;
  top: 130px;
  z-index: -1;
}

#page_23 #produit_3 img {
  width: 140px;
}

#page_23 #produit_4 img {
  width: 243px;
  position: absolute;
  top: 250px;
  z-index: -1;
}

#page_23 #produit_5 img {
  width: 161px;
  position: absolute;
  top: 130px;
  z-index: -1;
}

.bt-24h {
  position: absolute;
  top: 740px;
}

.bt-24h:hover {
  content: url(bouton/bouton\ 24H\ ON.png);
}

#btn_produit_soin-douche {
  left: 350px;
}

#btn_produit_exfoliant-douceur-corps {
  left: 677px;
}

#btn_produit_soin-hydratation-continue {
  left: 1015px;
}

#btn_produit_soin-hydratation-continue-nourissant {
  left: 1395px;
}

#btn_produit_soin-mains {
  left: 1665px;
}

#page_24 #logo {
  position: absolute;
  left: 610px;
  top: 200px;
  width: 600px;
}

#page_24 h1 {
  position: absolute;
  top: 485px;
  font-family: "DINPro-Light", sans-serif;
  font-size: 62px;
  font-weight: lighter;
}

#page_24 h2 {
  position: absolute;
  font-family: "NewsGothicStd", sans-serif;
  font-weight: lighter;
  font-size: 30px;
  letter-spacing: 0.25vw;
  color: #d8292f;
  top: 370px;
}

#page_24 p {
  position: absolute;
  text-align: center;
  font-family: "NewsGothicStd", sans-serif;
  font-size: 26px;
  top: 690px;
}

#page_24 #barre {
  position: absolute;
  top: 625px;
  background-color: #d8292f;
  height: 4px;
  width: 100px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 1.5vw;
  margin-bottom: 1.5vw;
}

#page_25 #arbre {
  position: absolute;
  left: 204px;
  top: 172px;
  width: 1499px;
  z-index: 1;
}

#produit_cleanskin {
  position: absolute;
  top: 548px;
  left: 267px;
}

#produit_cleanskin img {
  width: 318px;
}

#produit_hanami {
  position: absolute;
  left: 878px;
  top: 498px;
  z-index: -1;
}

#produit_hanami img {
  width: 256px;
}

#produit_wakame {
  position: absolute;
  left: 1300px;
  top: 543px;
  z-index: -1;
}

#produit_wakame img {
  width: 513px;
}

#btn_gamme_cleanskin {
  position: absolute;
  top: 420px;
  left: 415px;
  z-index: 2;
  margin: 0;
}

#btn_gamme_hanami {
  position: absolute;
  top: 420px;
  left: 944px;
  z-index: 2;
  margin: 0;
}

#btn_gamme_wakame {
  position: absolute;
  top: 420px;
  left: 1480px;
  z-index: 2;
  margin: 0;
}

#page_25 #infos {
  position: absolute;
  top: 850px;
  right: 120px;
  padding: 0;
  margin: 0;
  border: 0;
  width: 1630px;
  text-align: center;
  color: #000000;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  font-size: 20px;
  background-color: rgba(255, 255, 255, 0.671);
}

#page_25 p {
  width: 500px;
  margin: 0;
}

#btn_gamme_cleanskin:hover {
  content: url(bouton/bouton\ clenskin\ ON.png);
}

#btn_gamme_hanami:hover {
  content: url(bouton/bouton\ hanami\ ON.png);
}

#btn_gamme_wakame:hover {
  content: url(bouton/bouton\ wakame\ ON.png);
}

#page_26 #logo {
  left: 887px;
  top: 160px;
  width: 147px;
}

#page_26 #infos {
  border: 0;
  margin: 0;
  padding: 0;
  position: absolute;
  top: 375px;
  font-family: "NewsGothicStd", sans-serif;
  font-weight: lighter;
  font-size: 30px;
  color: #28cc7c;
  text-align: center;
}

#page_26 .la_gamme {
  position: absolute;
  top: 425px;
  width: 1700px;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  text-align: center;
}

#page_26 .la_gamme div {
  width: 500px;
}

#page_26 #produit_1 img {
  width: 120px;
}

#page_26 #produit_2 img {
  width: 160px;
  position: absolute;
  top: 110px;
  z-index: -1;
}

#page_26 #produit_3 img {
  width: 105px;
  position: absolute;
  top: 100px;
  z-index: -1;
}

.bt-cleanskin {
  position: absolute;
  top: 810px;
}

.bt-cleanskin:hover {
  content: url(bouton/bouton\ clenskin\ ON.png);
}

#btn_produit_eau-demaquillante {
  left: 450px;
}

#btn_produit_gelee-nettoyante {
  left: 1015px;
}

#btn_produit_lotion-anti-age {
  left: 1585px;
}

#page_27 #logo {
  left: 887px;
  top: 130px;
  width: 147px;
}

#page_27 #infos {
  border: 0;
  margin: 0;
  padding: 0;
  position: absolute;
  top: 320px;
  font-family: "NewsGothicStd", sans-serif;
  font-weight: lighter;
  font-size: 30px;
  color: #f01c74;
  text-align: center;
}

#page_27 .la_gamme {
  position: absolute;
  top: 425px;
  width: 1700px;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  text-align: center;
}

#page_27 .la_gamme div {
  width: 500px;
}

#page_27 #produit_1 img {
  width: 193px;
  position: absolute;
  z-index: -1;
  top: 125px;
}

#page_27 #produit_2 img {
  width: 163px;
  position: absolute;
  z-index: -1;
  top: 150px;
}

#page_27 #produit_3 img {
  width: 365px;
  position: absolute;
  z-index: -1;
  top: 235px;
  left: 1200px;
}

.bt-hanami {
  position: absolute;
  top: 800px;
}

.bt-hanami:hover {
  content: url(bouton/bouton\ hanami\ ON.png);
}

#btn_produit_fluide-concentre-asphyxiees {
  left: 460px;
}

#btn_produit_fluide-concentre-assoiffees {
  left: 1065px;
}

#btn_produit_soin-lumiere {
  left: 1645px;
}

#page_28 #logo {
  left: 887px;
  top: 130px;
  width: 147px;
}

#page_28 #infos {
  border: 0;
  margin: 0;
  padding: 0;
  position: absolute;
  top: 320px;
  font-family: "NewsGothicStd", sans-serif;
  font-weight: lighter;
  font-size: 30px;
  color: #108c64;
  text-align: center;
}

#page_28 .la_gamme {
  position: absolute;
  top: 425px;
  width: 1700px;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  text-align: center;
}

#page_28 .la_gamme div {
  width: 400px;
}

#page_28 #produit_1 img {
  width: 218px;
  position: absolute;
  z-index: -1;
  top: 130px;
  left: 121px;
}

#page_28 #produit_2 img {
  width: 184px;
  position: absolute;
  z-index: -1;
  top: 150px;
}

#page_28 #produit_3 img {
  width: 134px;
  position: absolute;
  z-index: -1;
  top: 160px;
  left: 992px;
}

#page_28 #produit_4 img {
  width: 272px;
  position: absolute;
  z-index: -1;
  top: 260px;
  left: 1327px;
}

.bt-wakame {
  position: absolute;
  top: 810px;
}

.bt-wakame:hover {
  content: url(bouton/bouton\ wakame\ ON.png);
}

#btn_produit_serum-raffermissant {
  left: 395px;
}

#btn_produit_serum-nourrissant {
  left: 820px;
}

#btn_produit_soin-lissant-yeux {
  left: 1220px;
}

#btn_produit_creme-concentree-multi-protection {
  left: 1690px;
}

#page_29 #logo {
  position: absolute;
  left: 693px;
  top: 200px;
  width: 519px;
}

#page_29 h1 {
  position: absolute;
  top: 500px;
  font-family: "DINPro-Light", sans-serif;
  font-size: 62px;
  font-weight: lighter;
}

#page_29 p {
  position: absolute;
  text-align: center;
  font-family: "NewsGothicStd", sans-serif;
  font-size: 26px;
  top: 655px;
}

.La_peau_des_hommes_a_des_besoins_propres__des_p {
  font-size: 26px;
  font-family: "News Gothic Std";
  color: rgb(50, 62, 72);
  line-height: 1.2;
  text-align: center;
  position: absolute;
  left: 523.909px;
  top: 655.42px;
  width: 867px;
  height: 119px;
  z-index: 5;
}

#page_29 #barre {
  position: absolute;
  top: 815px;
  background-color: #d8292f;
  height: 4px;
  width: 100px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 1.5vw;
  margin-bottom: 1.5vw;
}

#page_30 #logo {
  left: 771px;
  top: 171px;
  width: 378px;
}

#page_30 #infos {
  border: 0;
  margin: 0;
  padding: 0;
  position: absolute;
  top: 325px;
  font-family: "NewsGothicStd", sans-serif;
  font-weight: lighter;
  font-size: 30px;
  color: black;
  text-align: center;
}

#page_30 .la_gamme {
  position: absolute;
  top: 400px;
  width: 1700px;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  text-align: center;
}

#page_30 .la_gamme p {
  width: 350px;
}

#page_30 #produit_1 img {
  width: 267px;
  position: absolute;
  top: 100px;
  z-index: -1;
}

#page_30 #produit_1b img {
  width: 113px;
  position: absolute;
  top: 150px;
  z-index: -1;
}

#page_30 #produit_2 img {
  width: 121px;
  position: absolute;
  top: 90px;
  z-index: -1;
}

#page_30 #produit_3 img {
  width: 121px;
  position: absolute;
  top: 90px;
  z-index: -1;
}

.bt-men {
  position: absolute;
  top: 820px;
}

.bt-men:hover {
  content: url(bouton/bouton\ men\ ON.png);
}

#btn_produit_mousse-nettoyante-rasage {
  left: 360px;
}

#btn_produit_men-contour-des-yeux {
  left: 730px;
}

#btn_produit_gel-hydratant-apaisant {
  left: 1140px;
}

#btn_produit_soin-anti-rides {
  left: 1590px;
}

#page_31 #logo {
  position: absolute;
  top: 170px;
  width: 519px;
  left: 693px;
}

#page_31 h1 {
  position: absolute;
  top: 500px;
  font-family: "DINPro-Light", sans-serif;
  font-size: 62px;
  font-weight: lighter;
}

#page_31 p {
  position: absolute;
  text-align: center;
  font-family: "NewsGothicStd", sans-serif;
  font-size: 26px;
  top: 639px;
}

#page_31 #barre {
  position: absolute;
  top: 850px;
  background-color: #d8292f;
  height: 4px;
  width: 100px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 1.5vw;
  margin-bottom: 1.5vw;
}

#page_32 h2 {
  position: absolute;
  top: 150px;
  font-size: 30px;
  font-family: "NewsGothicStd", sans-serif;
  font-weight: lighter;
}

#page_32 #infos {
  border: 0;
  margin: 0;
  padding: 0;
  position: absolute;
  top: 225px;
  font-family: "NewsGothicStd", sans-serif;
  font-weight: lighter;
  font-size: 30px;
  color: black;
  text-align: center;
}

#page_32 .la_gamme {
  position: absolute;
  top: 325px;
  width: 1700px;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  text-align: center;
}

#page_32 .la_gamme div {
  width: 400px;
}

#page_32 #produit_1 img {
  width: 76px;
  position: absolute;
  top: 130px;
}

#page_32 #produit_2 img {
  width: 70px;
  position: absolute;
  top: 130px;
}

#page_32 #produit_3 img {
  width: 133px;
  position: absolute;
  top: 160px;
}

#page_32 #produit_4 img {
  width: 144px;
  position: absolute;
  top: 160px;
}

#page_32 .le_produit {
  height: 350px;
}

.bt-class-intemp-fem {
  position: absolute;
  top: 725px;
}

.bt-class-intemp-fem:hover {
  content: url(bouton/On\ mouse\ over.png);
}

#btn_produit_pour-elle {
  left: 360px;
}

#btn_produit_natsumi {
  left: 785px;
}

#btn_produit_miyabi-woman {
  left: 1260px;
}

#btn_produit_anna {
  left: 1690px;
}

.photos_clsq_intemp {
  position: absolute;
  width: 330px;
  top: 350px;
  visibility: hidden;
  opacity: 0;
}

#photo_pourelle {
  left: 150px;
}

#photo_natsumi {
  left: 570px;
}

#photo_miyabi {
  left: 1015px;
}

#photo_anna {
  left: 1440px;
}

#page_33 h2 {
  position: absolute;
  top: 150px;
  font-size: 30px;
  font-family: "NewsGothicStd", sans-serif;
  font-weight: lighter;
}

#page_33 #infos {
  border: 0;
  margin: 0;
  padding: 0;
  position: absolute;
  top: 225px;
  font-family: "NewsGothicStd", sans-serif;
  font-weight: lighter;
  font-size: 30px;
  color: black;
  text-align: center;
}

#page_33 .la_gamme {
  position: absolute;
  top: 325px;
  width: 1700px;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  text-align: center;
}

#page_33 .la_gamme div {
  width: 400px;
}

#page_33 #produit_1 img {
  width: 136px;
}

#page_33 #produit_2 img {
  width: 107px;
}

#page_33 #produit_3 img {
  width: 89px;
  position: absolute;
  top: 110px;
}

#page_33 #produit_4 img {
  width: 172px;
}

.bt-class-intemp-mas {
  position: absolute;
  top: 700px;
}

.bt-class-intemp-mas:hover {
  content: url(bouton/On\ mouse\ over.png);
}

#btn_produit_pour-lui {
  left: 385px;
}

#btn_produit_undo {
  left: 840px;
}

#btn_produit_tomo {
  left: 1260px;
}

#btn_produit_miyabi-man {
  left: 1690px;
}

.photos_clsq_intemp {
  position: absolute;
  width: 330px;
  top: 350px;
  visibility: hidden;
  opacity: 0;
}

#photo_pourlui {
  left: 175px;
}

#photo_undo {
  left: 610px;
}

#photo_tomo {
  left: 1030px;
}

#photo_miyabiman {
  left: 1425px;
}

#page_34 h2 {
  position: absolute;
  top: 140px;
  font-size: 30px;
  font-family: "NewsGothicStd", sans-serif;
  font-weight: lighter;
}

#page_34 h3 {
  font-size: 24px;
  font-family: "NewsGothicStd", sans-serif;
  font-weight: lighter;
}

#page_34 h4 {
  font-size: 14px;
  font-family: "DINPro-Bold", sans-serif;
}

#page_34 #infos {
  border: 0;
  margin: 0;
  padding: 0;
  position: absolute;
  top: 225px;
  font-family: "NewsGothicStd", sans-serif;
  font-weight: lighter;
  font-size: 30px;
  color: black;
  text-align: center;
}

#page_34 .la_gamme {
  position: absolute;
  top: 290px;
  /*width: 1700px;*/
  left: 100px;
  width: 1800px;
  display: flex;
  flex-direction: row;
  /*justify-content: space-between*/
  text-align: center;
}

#page_34 .infos_produit {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-evenly;
  width: 400px;
}

#page_34 #barre {
  background-color: #d8292f;
  height: 3px;
  width: 100px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 0.5vw;
  margin-bottom: 0.5vw;
}

#page_34 #produit_1 img {
  width: 127px;
  position: absolute;
  top: 200px;
}

#page_34 #produit_2 img {
  width: 130px;
  position: absolute;
  top: 200px;
}

#page_34 #produit_3 img {
  width: 127px;
  position: absolute;
  top: 200px;
}

#page_34 #produit_4 img {
  width: 127px;
  position: absolute;
  top: 200px;
}

#page_34 #produit_5 img {
  width: 127px;
  position: absolute;
  top: 200px;
}

#page_34 #produit_6 img {
  width: 124px;
  position: absolute;
  top: 200px;
}

#page_34 #produit_7 img {
  width: 125px;
  position: absolute;
  top: 200px;
}

#page_34 #produit_8 img {
  width: 127px;
  position: absolute;
  top: 200px;
}

.logos_parfums {
  width: 64px;
  position: absolute;
  top: 600px;
}

.bt-collect-parf {
  position: absolute;
  top: 525px;
  margin: 0;
}

.bt-collect-parf:hover {
  content: url(bouton/On\ mouse\ over.png);
}

#btn_produit_omizu-her {
  left: 195px;
}

#btn_produit_omizu-him {
  left: 375px;
}

#btn_produit_dojou-her {
  left: 611px;
}

#btn_produit_dojou-him {
  left: 800px;
}

#btn_produit_kogai-her {
  left: 1050px;
}

#btn_produit_kogai-him {
  left: 1230px;
}

#btn_produit_kagari-her {
  left: 1481px;
}

#btn_produit_kagari-him {
  left: 1668px;
}

.photos_la-collection {
  position: absolute;
  width: 230px;
  top: 175px;
  visibility: hidden;
  opacity: 0;
}

#photo_omizu_her {
  left: 0px;
}

#photo_omizu_him {
  left: 180px;
}

#photo_dojou_her {
  left: 425px;
}

#photo_dojou_him {
  left: 610px;
}

#photo_kogai_her {
  left: 860px;
}

#photo_kogai_him {
  left: 1050px;
}

#photo_kagari_her {
  left: 1295px;
}

#photo_kagari_him {
  left: 1490px;
}

/* [-------------------------------------------------------------------------------] */
/* [--------------------------------------POP-UP-----------------------------------] */
/* [----------------------------------ANTI-AGE-CIBLE-------------------------------] */

.pop-up {
  position: absolute;
  top: 200px;
  left: 286px;
  width: 1270px;
  height: 640px;
  background-color: white;
  border: 4px solid rgb(59, 59, 59);
  border-radius: 5px;
  display: flex;
  justify-content: space-between;
  font-family: "NewsGothicStd", sans-serif;
  padding: 60px 60px 20px 20px;
  box-shadow: 0.5vw 0.5vw 0vw 0vw #5c5c5c57;
  visibility: hidden;
}

.pop-up b {
  font-family: "NewsGothicStd-Bold", sans-serif;
}

.pop-up h2 {
  color: #13bfd6;
  font-size: 26px;
  margin-top: 4px;
  margin-bottom: 0;
}

.pop-up h3 {
  color: #13bfd6;
  font-size: 19px;
  margin: 0;
}

.pop-up p {
  font-size: 16px;
}

.navigation_popup {
  position: absolute;
}

#close_popup {
  width: 45px;
  top: 10px;
  right: 10px;
  cursor: pointer;
  z-index: 2;
}

.pop-up h4 {
  position: absolute;
  background-color: white;
  padding: 5px;
  font-size: 20px;
  top: 15px;
  left: 1090px;
  margin: 0;
  z-index: 1;
  visibility: hidden;
  opacity: 0;
}

#close_popup:hover {
  content: url(bouton/close\ window\ on.png);
}

#next_popup {
  width: 2vw;
  top: 0.75vw;
  right: 5vw;
  cursor: pointer;
}

#next_popup:hover {
  content: url(bouton/Next\ on.png);
}

#back_popup {
  width: 2vw;
  top: 0.75vw;
  right: 9vw;
  cursor: pointer;
}

#back_popup:hover {
  content: url(bouton/back\ on\ mouse\ over.png);
}

dl {
  font-size: 16px;
}

dt {
  position: relative;
  left: -13px;
  width: 150px;
  display: block;
}

dd {
  position: relative;
  left: 150px;
  top: -20px;
  margin: 0;
  margin-bottom: 5px;
  width: 247px;
}

#photo_quantite {
  display: flex;
  flex-direction: column;
  align-items: center;
}

#le_soin {
  position: relative;
  top: 0vw;
  width: 300px;
}

.logo_soin {
  width: 100px;
}

#photo_soin {
  position: absolute;
  width: 150px;
  height: 380px;
}

#photo_soin img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

#quantite {
  position: absolute;
  bottom: -25px;
}

#quantite_masque {
  position: absolute;
  bottom: 10px;
}

#actifs_action {
  position: absolute;
  left: 327px;
  display: flex;
  flex-direction: column;
  border-radius: 5px;
  background-color: #13bfd610;
  width: 383px;
  height: 480px;
  padding: 18px;
}

#actifs_action div {
  position: relative;
  left: -12px;
  display: flex;
  /*justify-content: space-around;*/
  text-align: left;
}

#texture_application {
  position: absolute;
  left: 770px;
  border-radius: 5px;
  background-color: #13bfd610;
  width: 480px;
  height: 480px;
  padding: 18px;
}

#texture_application p {
  margin-top: 2px;
}

#les_resultats {
  position: absolute;
  top: 600px;
  left: 327px;
  border: 2px solid black;
  border-radius: 5px;
  height: 95px;
  width: 937px;
  padding: 0px 5px;
}

#les_resultats p {
  color: #000000;
  margin-top: 0.3vw;
}

#symboles_application {
  width: 160px;
  height: 50px;
  margin-top: 0.25vw;
}

#photo_eponge {
  position: relative;
  top: 50px;
  left: 50px;
  width: 500px;
  height: 400px;
}

#photo_eponge img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

#schema_eponge {
  position: relative;
  width: 380px;
  top: 50px;
}

/* [-------------------------------------------------------------------------------] */
/* [---------------------------------POP-UP---MASK---------------------------------] */
/* [-------------------------------------------------------------------------------] */

#infos_mask {
  position: absolute;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  top: 75px;
  width: 1265px;
  justify-content: space-between;
}

#close_popup_mask {
  width: 45px;
  top: 10px;
  right: 10px;
  cursor: pointer;
  z-index: 2;
}

#close_popup_mask:hover {
  content: url(bouton/close\ window\ on.png);
}

#masque_eclat {
  width: 300px;
  height: 300px;
}

#masque_eclat h2 {
  color: #ffd951;
}

#masque_eclat #description_masque {
  border: 2px solid #ffd951;
}

#masque_eclat #actifs_action_masque {
  background-color: #ffd9511f;
}

#masque_purifiant {
  width: 300px;
}

#masque_purifiant h2 {
  color: #00eed6;
}

#masque_purifiant #description_masque {
  border: 2px solid #00eed6;
}

#masque_purifiant #actifs_action_masque {
  background-color: #00eed618;
}

#masque_apaisant {
  width: 300px;
}

#masque_apaisant h2 {
  color: #00d7df;
}

#masque_apaisant #description_masque {
  border: 2px solid #00d7df;
}

#masque_apaisant #actifs_action_masque {
  background-color: #00d8df15;
}

#masque_nourrissant {
  width: 300px;
}

#masque_nourrissant h2 {
  color: #ff6c8c;
}

#masque_nourrissant #description_masque {
  border: 2px solid #ff6c8c;
}

#masque_nourrissant #actifs_action_masque {
  background-color: #ff6c8c11;
}

#description_masque {
  border: 2px solid black;
  border-radius: 5px;
  height: 140px;
  padding-left: 5px;
  padding-right: 5px;
  margin-bottom: 2px;
}

#actifs_action_masque {
  background-color: rgba(0, 0, 0, 0.034);
  border-radius: 5px;
  height: 195px;
}

#actifs_action_masque div {
  display: flex;
  justify-content: space-around;
  text-align: left;
}

#photos_masques {
  position: absolute;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  top: 430px;
  left: 100px;
  width: 800px;
}

#photos_masques div {
  width: 100%;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
}

#photos_masques img {
  width: 115px;
}

#photos_masques #quantite {
  top: 250px;
}

#application_masque {
  position: absolute;
  background-color: white;
  border: 2px solid black;
  border-radius: 5px;
  top: 435px;
  left: 987px;
  width: 275px;
  padding: 10px;
}

#application_masque h3 {
  color: black;
}

#popup_mask .actifs {
  font-size: 14px;
  position: absolute;
}

#popup_mask .actions {
  font-size: 12px;
  position: absolute;
  margin: 0;
}

.vertical_1er {
  top: 185px;
}

.vertical_2eme {
  top: 225px;
  width: 140px;
}

.vertical_3eme {
  top: 270px;
}

.horizontal_1er {
  left: 20px;
}

.horizontal_2eme {
  left: 150px;
  width: 145px;
}

.horizontal_3eme {
  left: 340px;
  width: 128px;
}

.horizontal_4eme {
  left: 470px;
  width: 145px;
}

.horizontal_5eme {
  left: 660px;
}

.horizontal_6eme {
  left: 810px;
  width: 145px;
}

.horizontal_7eme {
  left: 980px;
}

.horizontal_8eme {
  left: 1125px;
  width: 145px;
}

#popup_mask h2 {
  font-size: 18px;
  margin-bottom: 5px;
  font-family: "NewsGothicStd-Bold", sans-serif;
}

#popup_mask h3 {
  color: black;
  font-size: 18px;
  margin-top: 10px;
}

#actifs_action_masque h3 {
  color: #d8292f;
}

#popup_mask p {
  font-size: 14px;
  margin: 0;
}

#popup_mask .logo_soin {
  position: absolute;
  width: 120px;
  top: 10px;
  left: 25px;
}

/* [-------------------------------------------------------------------------------] */
/* [---------------------------POP-UP---ANTI-AGE-CIBLE-----------------------------] */
/* [-------------------------------------------------------------------------------] */

.pop-up h1 {
  margin: 0;
  margin-top: 5px;
  font-family: "NewsGothicStd", sans-serif;
  font-size: 22px;
  font-weight: lighter;
  color: #d8292f;
}

#actifs_spiralis {
  position: absolute;
  height: 150px;
  left: 27px;
}

#groupe-actifs-1 {
  position: absolute;
  top: 125px;
  left: 5px;
  writing-mode: vertical-lr;
  transform: rotate(180deg);
}

#groupe-actifs-2 {
  position: absolute;
  top: 310px;
  left: 5px;
  writing-mode: vertical-lr;
  transform: rotate(180deg);
}

#action-jour {
  position: absolute;
  width: 65px;
  top: 60px;
  left: 245px;
}

#action-nuit {
  position: absolute;
  width: 50px;
  top: 200px;
  left: 245px;
}

#actifs-journuit {
  color: #d8292f;
  top: 10px;
}

#schema_theorie {
  margin-left: auto;
  margin-right: auto;
  width: 200px;
}

#schema_theorie-ex {
  position: relative;
  top: -115px;
  width: 180px;
}

#texture_application div {
  position: relative;
  left: -85px;
  display: flex;
  justify-content: space-around;
  text-align: left;
}

#texture_application dl {
  position: absolute;
}

#texture_application dd {
  left: 225px;
  font-size: 14px;
}

#tableau_application {
  width: 480px;
}

#text_tab {
  position: absolute;
  left: 40px;
}

#schema_application {
  width: 480px;
}

#ss-tt_extreme {
  font-family: "NewsGothicStd-Bold", sans-serif;
  /*font-size: 1.25vw;*/
  font-size: 16px;
  color: #283c44;
}

/* [-------------------------------------------------------------------------------] */
/* [--------------------------POP-UP---PROTECTION-GLOBALE--------------------------] */
/* [-------------------------------------------------------------------------------] */

#les_ingredients {
  position: absolute;
  top: 475px;
  left: 327px;
  border: 2px solid #28cc7c;
  background-color: #28cc7c;
  border-radius: 5px;
  height: 100px;
  width: 935px;
  padding: 0px 10px;
}

#les_ingredients p {
  font-family: "NewsGothicStd", sans-serif;
  color: white;
  margin-top: 10px;
}

#next_popup_pg {
  width: 2vw;
  top: 0.75vw;
  right: 5vw;
  cursor: pointer;
}

#next_popup_pg:hover {
  content: url(bouton/Next\ on.png);
}

#back_popup_pg {
  width: 2vw;
  top: 0.75vw;
  right: 9vw;
  cursor: pointer;
}

#back_popup_pg:hover {
  content: url(bouton/back\ on\ mouse\ over.png);
}

#close_popup_pg {
  width: 45px;
  top: 10px;
  right: 10px;
  cursor: pointer;
  z-index: 2;
}

#close_popup_pg:hover {
  content: url(bouton/close\ window\ on.png);
}

#protection_globale .logo_soin {
  width: 9vw;
}

#les_resultats_pg {
  position: absolute;
  top: 600px;
  left: 327px;
  border: 2px solid black;
  border-radius: 5px;
  height: 95px;
  width: 935px;
  padding: 0px 10px;
}

#les_resultats_pg p {
  color: #000000;
  margin-top: 3px;
}

#le_soin_pg {
  position: relative;
  top: 0px;
  width: 300px;
}

#actifs_action_pg {
  position: absolute;
  left: 327px;
  display: flex;
  flex-direction: column;
  border-radius: 5px;
  background-color: #28cc7d10;
  width: 383px;
  height: 360px;
  padding: 18px;
}

#actifs_action_pg div {
  position: relative;
  left: -12px;
  display: flex;
  /*justify-content: space-around;*/
  text-align: left;
}

#texture_application_pg p {
  margin-top: 0.2vw;
}

#texture_application_pg {
  position: absolute;
  left: 770px;
  border-radius: 5px;
  background-color: #28cc7d10;
  width: 480px;
  height: 360px;
  padding: 18px;
}

#photo_soin_pg {
  width: 150px;
  height: 380px;
}

#photo_soin_pg img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* [-------------------------------------------------------------------------------] */
/* [---------------------------------POP-UP---PARFUMS------------------------------] */
/* [-------------------------------------------------------------------------------] */

#parfums {
  padding: 60px 60px 20px 20px;
  left: 400px;
  width: 1000px;
  height: 670px;
}

#close_popup_parf {
  width: 45px;
  top: 10px;
  right: 10px;
  cursor: pointer;
  z-index: 2;
}

#close_popup_parf:hover {
  content: url(bouton/close\ window\ on.png);
}

#next_popup_parf {
  width: 2vw;
  top: 0.75vw;
  right: 5vw;
  cursor: pointer;
}

#next_popup_parf:hover {
  content: url(bouton/Next\ on.png);
}

#back_popup_parf {
  width: 2vw;
  top: 0.75vw;
  right: 9vw;
  cursor: pointer;
}

#back_popup_parf:hover {
  content: url(bouton/back\ on\ mouse\ over.png);
}

#le_parfum {
  position: relative;
  top: 0px;
  width: 290px;
  padding: 0px 0px 0px 40px;
}

#photo_parfum {
  width: 500px;
  height: 500px;
}

#photo_parfum img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

#ingredients_parfum {
  border: 2px solid black;
  border-radius: 5px;
  padding: 20px;
  width: 270px;
  height: 620px;
}

#ingredients_parfum p {
  font-size: 14px;
  margin-top: 2px;
}

#ingredients_parfum img {
  width: 270px;
}

#notes_parfum {
  border: 2px solid black;
  border-radius: 5px;
  padding: 20px;
  width: 270px;
  height: 620px;
}

#notes_parfum p {
  margin-top: 0;
  margin-bottom: 50px;
  font-size: 15px;
}

#parfums b {
  font-size: 16px;
}

.logo_parfum {
  width: 250px;
}

#definition_nom {
  position: absolute;
  padding: 7px;
  border: 2px solid black;
  border-radius: 5px;
  width: 296px;
  top: 653px;
  left: 706px;
}

#parfums h4 {
  left: 830px;
}

#page_35 h2 {
  position: absolute;
  top: 170px;
  font-family: "NewsGothicStd-Bold", sans-serif;
  font-size: 30px;
}

/* [-------------------------------------------------------------------------------] */
/* [--------------------------------FIN---DES---POP-UP-----------------------------] */
/* [-------------------------------------------------------------------------------] */

#page_35 .paragraphe {
  position: static;
  width: 600px;
}

#page_35 p {
  font-size: 26px;
}

#page_35 b {
  font-size: 30px;
}

#page_35 #arbre {
  top: 242px;
  left: 427px;
  width: 1072px;
}

#choix_make-up-1 {
  position: absolute;
  width: 1600px;
  top: 435px;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
}

#page_35 #decoration {
  position: absolute;
  left: 592px;
  top: 576px;
  width: 763px;
}

#page_35 .btn_arbre {
  margin: 0;
}

#page_35 .btn_arbre:hover {
  content: url(bouton/On\ mouse\ over.png);
}

#page_36 #decoration {
  position: absolute;
  left: 171px;
  top: 175px;
  width: 779px;
}

#page_36 .paragraphe {
  position: absolute;
  left: 983px;
  top: 296px;
  width: 657px;
  height: 579px;
  background-color: #f1c9bb;
  font-size: 33px;
  font-family: "NewsGothicStd", sans-serif;
}

#page_36 h2 {
  font-family: "DINPro-Light", sans-serif;
  font-size: 80px;
  font-weight: lighter;
  margin-bottom: 0;
  margin-top: 125px;
}

#page_37 #decoration {
  position: absolute;
  left: 1165px;
  top: 230px;
  width: 658px;
}

#page_37 h2 {
  position: absolute;
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  top: 100px;
  font-size: 50px;
  left: 141px;
}

#page_37 h3 {
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  font-size: 44px;
  margin-bottom: 0;
  margin-top: 25px;
}

#page_37 p {
  font-family: "NewsGothicStd", sans-serif;
  margin-bottom: 0;
  margin-top: 5px;
  font-size: 26px;
}

#matte-hydrating {
  text-align: left;
  position: absolute;
  top: 225px;
  left: 141px;
}

.underline {
  text-decoration: underline;
}

#page_37 ul {
  padding: 0;
  margin-bottom: 0;
  margin-top: 5px;
}

#page_37 ul li {
  font-size: 26px;
  line-height: 35px;
  font-family: "NewsGothicStd", sans-serif;
}

.custom-list {
  list-style-type: none; /* Supprime les puces par défaut */
}

.custom-list li:before {
  content: "";
  display: inline-block;
  width: 25px; /* Définissez la largeur souhaitée de l'image */
  height: 25px; /* Définissez la hauteur souhaitée de l'image */
  background-image: url(../img/ecran_37/puce_liste.png);
  background-size: contain;
  background-repeat: no-repeat;
  margin-right: 5px;
}

#teintes {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  width: 700px;
}

#teintes img {
  width: 50px;
  margin-right: 10px;
}

#teintes div {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 26px;
  font-family: "NewsGothicStd", sans-serif;
  margin-right: 30px;
  margin-top: 15px;
}

.picto {
  position: absolute;
  transform: translate(-50%, -5%);
  left: -50px;
  width: 66px;
}

#page_38 #decoration {
  position: absolute;
  left: 707px;
  top: 86px;
  width: 1118px;
}

#page_38 h2 {
  position: absolute;
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  top: 100px;
  font-size: 50px;
  left: 141px;
}

#page_38 h3 {
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  font-size: 44px;
  margin-bottom: 0;
  margin-top: 25px;
}

#page_38 p {
  font-family: "NewsGothicStd", sans-serif;
  margin-bottom: 0;
  margin-top: 5px;
  font-size: 26px;
}

#page_38 ul {
  padding: 0;
  margin-bottom: 0;
  margin-top: 5px;
}

#page_38 ul li {
  font-size: 26px;
  line-height: 35px;
  font-family: "NewsGothicStd", sans-serif;
}

#page_39 #decoration {
  position: absolute;
  left: 852px;
  top: 212px;
  width: 973px;
}

#page_39 h2 {
  position: absolute;
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  top: 100px;
  font-size: 50px;
  left: 141px;
}

#page_39 h3 {
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  font-size: 44px;
  margin-bottom: 0;
  margin-top: 25px;
}

#page_39 p {
  font-family: "NewsGothicStd", sans-serif;
  margin-bottom: 0;
  margin-top: 5px;
  font-size: 26px;
}

#page_39 ul {
  padding: 0;
  margin-bottom: 0;
  margin-top: 5px;
}

#page_39 ul li {
  font-size: 26px;
  line-height: 35px;
  font-family: "NewsGothicStd", sans-serif;
}

#page_40 #decoration {
  position: absolute;
  left: 767px;
  top: 138px;
  width: 1058px;
}

#page_40 h2 {
  position: absolute;
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  top: 100px;
  font-size: 50px;
  left: 141px;
}

#page_40 h3 {
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  font-size: 44px;
  margin-bottom: 0;
  margin-top: 25px;
}

#page_40 p {
  font-family: "NewsGothicStd", sans-serif;
  margin-bottom: 0;
  margin-top: 5px;
  font-size: 26px;
}

#page_40 ul {
  padding: 0;
  margin-bottom: 0;
  margin-top: 5px;
}

#page_40 ul li {
  font-size: 26px;
  line-height: 35px;
  font-family: "NewsGothicStd", sans-serif;
}

#page_40b #decoration {
  position: absolute;
  left: 1108px;
  top: 148px;
  width: 748px;
}

#page_40b h2 {
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  top: 100px;
  font-size: 50px;
  left: 141px;
  margin-bottom: 0px;
}

#page_40b h3 {
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  font-size: 40px;
  margin-bottom: 0;
  margin-top: 25px;
}

#page_40b p {
  font-family: "NewsGothicStd", sans-serif;
  margin-bottom: 0;
  margin-top: 5px;
  font-size: 24px;
}
#page_40b #matte-hydrating {
  text-align: left;
  position: absolute;
  top: 425px;
  left: 141px;
  width: 1073px;
}

#page_40b ul {
  padding: 0;
  margin-bottom: 0;
  margin-top: 5px;
}

#page_40b ul li {
  font-size: 24px;
  line-height: 35px;
  font-family: "NewsGothicStd", sans-serif;
}
fieldset {
  border: 1px solid #d8292f;
  width: 780px;
}
legend {
  color: #d8292f;
  font-size: 40px;
  font-family: "DINPro", sans-serif;
}

#page_41 #decoration {
  position: absolute;
  left: 1135px;
  top: 168px;
  width: 743px;
}

#page_41 h2 {
  position: absolute;
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  top: 100px;
  font-size: 50px;
  left: 141px;
}

#page_41 h3 {
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  font-size: 44px;
  margin-bottom: 0;
  margin-top: 25px;
}

#page_41 p {
  font-family: "NewsGothicStd", sans-serif;
  margin-bottom: 0;
  margin-top: 5px;
  font-size: 26px;
}

#page_41 ul {
  padding: 0;
  margin-bottom: 0;
  margin-top: 5px;
}

#page_41 ul li {
  font-size: 26px;
  line-height: 35px;
  font-family: "NewsGothicStd", sans-serif;
}

#page_42 #decoration {
  position: absolute;
  left: 836px;
  top: 219px;
  width: 989px;
}

#page_42 h2 {
  position: absolute;
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  top: 100px;
  font-size: 50px;
  left: 141px;
}

#page_42 h3 {
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  font-size: 44px;
  margin-bottom: 0;
  margin-top: 25px;
}

#page_42 p {
  font-family: "NewsGothicStd", sans-serif;
  margin-bottom: 0;
  margin-top: 5px;
  font-size: 26px;
}

#page_42 #teintes img {
  width: 50px;
}

#page_43 #decoration {
  position: absolute;
  left: 518px;
  top: -31px;
  width: 1307px;
}

#page_43 h2 {
  position: absolute;
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  top: 100px;
  font-size: 50px;
  left: 141px;
}

#page_43 h3 {
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  font-size: 44px;
  margin-bottom: 0;
  margin-top: 25px;
}

#page_43 p {
  font-family: "NewsGothicStd", sans-serif;
  margin-bottom: 0;
  margin-top: 5px;
  font-size: 26px;
}

#page_43 #teintes img {
  width: 65px;
}

#page_44 #decoration {
  position: absolute;
  left: 1012px;
  top: 322px;
  width: 813px;
}

#page_44 h2 {
  position: absolute;
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  top: 100px;
  font-size: 50px;
  left: 141px;
}

#page_44 h3 {
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  font-size: 44px;
  margin-bottom: 0;
  margin-top: 25px;
}

#page_44 p {
  font-family: "NewsGothicStd", sans-serif;
  margin-bottom: 0;
  margin-top: 5px;
  font-size: 26px;
}

#page_44 #teintes img {
  width: 65px;
}

#page_44 ul {
  padding: 0;
  margin-bottom: 0;
  margin-top: 5px;
}

#page_44 ul li {
  font-size: 26px;
  line-height: 35px;
  font-family: "NewsGothicStd", sans-serif;
}
#page_44b #decoration {
  position: absolute;
  left: 1175px;
  top: 158px;
  width: 698px;
}

#page_44b h2 {
  position: absolute;
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  top: 100px;
  font-size: 50px;
  left: 141px;
}

#page_44b h3 {
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  font-size: 44px;
  margin-bottom: 0;
  margin-top: 25px;
}

#page_44b p {
  font-family: "NewsGothicStd", sans-serif;
  margin-bottom: 0;
  margin-top: 5px;
  font-size: 26px;
}

#page_44b #teintes img {
  width: 65px;
}

#page_44b ul {
  padding: 0;
  margin-bottom: 0;
  margin-top: 5px;
}

#page_44b ul li {
  font-size: 26px;
  line-height: 35px;
  font-family: "NewsGothicStd", sans-serif;
}

#page_45 #decoration {
  position: absolute;
  left: 137px;
  top: 154px;
  width: 826px;
}

#page_45 .paragraphe {
  position: absolute;
  left: 983px;
  top: 296px;
  width: 657px;
  height: 579px;
  background-color: #f1c9bb;
  font-size: 33px;
  font-family: "NewsGothicStd", sans-serif;
}

#page_45 h2 {
  font-family: "DINPro-Light", sans-serif;
  font-size: 80px;
  font-weight: lighter;
  margin-bottom: 0;
  margin-top: 125px;
}

#page_46 #decoration {
  position: absolute;
  left: 964px;
  top: 290px;
  width: 870px;
}

#page_46 h2 {
  position: absolute;
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  top: 100px;
  font-size: 50px;
  left: 141px;
}

#page_46 h3 {
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  font-size: 44px;
  margin-bottom: 0;
  margin-top: 25px;
}

#page_46 p {
  font-family: "NewsGothicStd", sans-serif;
  margin-bottom: 0;
  margin-top: 5px;
  font-size: 26px;
}

#page_46 #teintes img {
  width: 263px;
}

#page_46 #teintes div {
  flex-direction: column;
  align-items: start;
}

#page_46 ul {
  padding: 0;
  margin-bottom: 0;
  margin-top: 5px;
}

#page_46 ul li {
  font-size: 26px;
  line-height: 35px;
  font-family: "NewsGothicStd", sans-serif;
}

#page_47 #decoration {
  position: absolute;
  left: 1267px;
  top: 244px;
  width: 557px;
}

#page_47 h2 {
  position: absolute;
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  top: 100px;
  font-size: 50px;
  left: 141px;
}

#page_47 h3 {
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  font-size: 44px;
  margin-bottom: 0;
  margin-top: 25px;
}

#page_47 p {
  font-family: "NewsGothicStd", sans-serif;
  margin-bottom: 0;
  margin-top: 5px;
  font-size: 26px;
}

#page_47 ul {
  padding: 0;
  margin-bottom: 0;
  margin-top: 5px;
}

#page_47 ul li {
  font-size: 26px;
  line-height: 35px;
  font-family: "NewsGothicStd", sans-serif;
}

#page_48 #decoration {
  position: absolute;
  left: 1271px;
  top: 243px;
  width: 502px;
}

#page_48 h2 {
  position: absolute;
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  top: 100px;
  font-size: 50px;
  left: 141px;
}

#page_48 h3 {
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  font-size: 44px;
  margin-bottom: 0;
  margin-top: 25px;
}

#page_48 p {
  font-family: "NewsGothicStd", sans-serif;
  margin-bottom: 0;
  margin-top: 5px;
  font-size: 26px;
}

#page_48 ul {
  padding: 0;
  margin-bottom: 0;
  margin-top: 5px;
}

#page_48 ul li {
  font-size: 26px;
  line-height: 35px;
  font-family: "NewsGothicStd", sans-serif;
}

#page_49 #decoration {
  position: absolute;
  left: 1267px;
  top: 243px;
  width: 507px;
}

#page_49 h2 {
  position: absolute;
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  top: 100px;
  font-size: 50px;
  left: 141px;
}

#page_49 h3 {
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  font-size: 44px;
  margin-bottom: 0;
  margin-top: 25px;
}

#page_49 p {
  font-family: "NewsGothicStd", sans-serif;
  margin-bottom: 0;
  margin-top: 5px;
  font-size: 26px;
}

#page_49 ul {
  padding: 0;
  margin-bottom: 0;
  margin-top: 5px;
}

#page_49 ul li {
  font-size: 26px;
  line-height: 35px;
  font-family: "NewsGothicStd", sans-serif;
}

#page_50 #decoration {
  position: absolute;
  left: 1267px;
  top: 243px;
  width: 557px;
}

#page_50 h2 {
  position: absolute;
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  top: 100px;
  font-size: 50px;
  left: 141px;
}

#page_50 h3 {
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  font-size: 44px;
  margin-bottom: 0;
  margin-top: 25px;
}

#page_50 p {
  font-family: "NewsGothicStd", sans-serif;
  margin-bottom: 0;
  margin-top: 5px;
  font-size: 26px;
}

#page_50 ul {
  padding: 0;
  margin-bottom: 0;
  margin-top: 5px;
}

#page_50 ul li {
  font-size: 26px;
  line-height: 35px;
  font-family: "NewsGothicStd", sans-serif;
}

#page_51 #decoration {
  position: absolute;
  left: 118px;
  top: 139px;
  width: 854px;
}

#page_51 .paragraphe {
  position: absolute;
  left: 983px;
  top: 296px;
  width: 657px;
  height: 579px;
  background-color: #f1c9bb;
  font-size: 33px;
  font-family: "NewsGothicStd", sans-serif;
}

#page_51 h2 {
  font-family: "DINPro-Light", sans-serif;
  font-size: 80px;
  font-weight: lighter;
  margin-bottom: 0;
  margin-top: 125px;
}

#page_52 #decoration {
  position: absolute;
  left: 1079px;
  top: 95px;
  width: 705px;
}

#page_52 h2 {
  position: absolute;
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  top: 100px;
  font-size: 50px;
  left: 141px;
}

#page_52 h3 {
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  font-size: 44px;
  margin-bottom: 0;
  margin-top: 25px;
}

#page_52 p {
  font-family: "NewsGothicStd", sans-serif;
  margin-bottom: 0;
  margin-top: 5px;
  font-size: 26px;
}

#page_52 #teintes img {
  width: 50px;
}

#page_52 ul {
  padding: 0;
  margin-bottom: 0;
  margin-top: 5px;
}

#page_52 ul li {
  font-size: 26px;
  line-height: 35px;
  font-family: "NewsGothicStd", sans-serif;
}

#page_53 #decoration {
  position: absolute;
  left: 1079px;
  top: 95px;
  width: 705px;
}

#page_53 h2 {
  position: absolute;
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  top: 100px;
  font-size: 50px;
  left: 141px;
}

#page_53 h3 {
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  font-size: 44px;
  margin-bottom: 0;
  margin-top: 25px;
}

#page_53 p {
  font-family: "NewsGothicStd", sans-serif;
  margin-bottom: 0;
  margin-top: 5px;
  font-size: 26px;
}

#page_53 #teintes img {
  width: 50px;
}

#page_53 #teintes {
  width: 1000px;
}

#page_53 #teintes div {
  margin-right: 90px;
}

#page_53 ul {
  padding: 0;
  margin-bottom: 0;
  margin-top: 5px;
}

#page_53 ul li {
  font-size: 26px;
  line-height: 35px;
  font-family: "NewsGothicStd", sans-serif;
}

#page_54 #decoration {
  position: absolute;
  left: 1059px;
  top: 195px;
  width: 715px;
}

#page_54 h2 {
  position: absolute;
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  top: 100px;
  font-size: 50px;
  left: 141px;
}

#page_54 h3 {
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  font-size: 44px;
  margin-bottom: 0;
  margin-top: 25px;
}

#page_54 p {
  font-family: "NewsGothicStd", sans-serif;
  margin-bottom: 0;
  margin-top: 5px;
  font-size: 26px;
}

#page_54 #teintes img {
  width: 50px;
}

#page_54 #teintes {
  width: 1000px;
}

#page_54 #teintes div {
  margin-right: 90px;
}

#page_54 ul {
  padding: 0;
  margin-bottom: 0;
  margin-top: 5px;
}

#page_54 ul li {
  font-size: 26px;
  line-height: 35px;
  font-family: "NewsGothicStd", sans-serif;
}

#page_55 h2 {
  font-family: "NewsGothicStd-Bold", sans-serif;
  font-size: 30px;
  position: relative;
  top: 180px;
}

#page_55 #decoration {
  position: absolute;
  left: 594px;
  top: 291px;
  width: 727px;
}

#page_56 #decoration {
  position: absolute;
  left: 1151px;
  top: 235px;
  width: 672px;
}

#page_56 h2 {
  position: absolute;
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  top: 100px;
  font-size: 50px;
  left: 141px;
}

#page_56 h3 {
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  font-size: 44px;
  margin-bottom: 0;
  margin-top: 25px;
}

#page_56 p {
  font-family: "NewsGothicStd", sans-serif;
  margin-bottom: 0;
  margin-top: 5px;
  font-size: 26px;
}

#page_56 ul {
  padding: 0;
  margin-bottom: 0;
  margin-top: 5px;
}

#page_56 ul li {
  font-size: 26px;
  line-height: 35px;
  font-family: "NewsGothicStd", sans-serif;
}

#page_57 #decoration {
  position: absolute;
  left: 951px;
  top: 125px;
  width: 932px;
}

#page_57 h2 {
  position: absolute;
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  top: 100px;
  font-size: 50px;
  left: 141px;
}

#page_57 h3 {
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  font-size: 44px;
  margin-bottom: 0;
  margin-top: 25px;
}

#page_57 p {
  font-family: "NewsGothicStd", sans-serif;
  margin-bottom: 0;
  margin-top: 5px;
  font-size: 26px;
}

#page_57 ul {
  padding: 0;
  margin-bottom: 0;
  margin-top: 5px;
}

#page_57 ul li {
  font-size: 26px;
  line-height: 35px;
  font-family: "NewsGothicStd", sans-serif;
}

#page_58 #decoration {
  position: absolute;
  left: 951px;
  top: 125px;
  width: 932px;
}

#page_58 h2 {
  position: absolute;
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  top: 100px;
  font-size: 50px;
  left: 141px;
}

#page_58 h3 {
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  font-size: 44px;
  margin-bottom: 0;
  margin-top: 25px;
}

#page_58 p {
  font-family: "NewsGothicStd", sans-serif;
  margin-bottom: 0;
  margin-top: 5px;
  font-size: 26px;
}

#page_58 ul {
  padding: 0;
  margin-bottom: 0;
  margin-top: 5px;
}

#page_58 ul li {
  font-size: 26px;
  line-height: 35px;
  font-family: "NewsGothicStd", sans-serif;
}

#page_59 #decoration {
  position: absolute;
  left: 1036px;
  top: 216px;
  width: 788px;
}

#page_59 h2 {
  position: absolute;
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  top: 100px;
  font-size: 50px;
  left: 141px;
}

#page_59 h3 {
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  font-size: 44px;
  margin-bottom: 0;
  margin-top: 25px;
}

#page_59 p {
  font-family: "NewsGothicStd", sans-serif;
  margin-bottom: 0;
  margin-top: 5px;
  font-size: 26px;
}

#page_59 ul {
  padding: 0;
  margin-bottom: 0;
  margin-top: 5px;
}

#page_59 ul li {
  font-size: 26px;
  line-height: 35px;
  font-family: "NewsGothicStd", sans-serif;
}
#page_59b #decoration {
  position: absolute;
  left: 996px;
  top: 112px;
  width: 840px;
}

#page_59b h2 {
  position: absolute;
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  top: 100px;
  font-size: 50px;
  left: 141px;
}

#page_59b h3 {
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  font-size: 44px;
  margin-bottom: 0;
  margin-top: 25px;
}

#page_59b p {
  font-family: "NewsGothicStd", sans-serif;
  margin-bottom: 0;
  margin-top: 5px;
  font-size: 26px;
}

#page_59b ul {
  padding: 0;
  margin-bottom: 0;
  margin-top: 5px;
}

#page_59b ul li {
  font-size: 26px;
  line-height: 35px;
  font-family: "NewsGothicStd", sans-serif;
}

#page_60 #decoration {
  position: absolute;
  left: 990px;
  top: 181px;
  width: 853px;
}

#page_60 h2 {
  position: absolute;
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  top: 100px;
  font-size: 50px;
  left: 141px;
}

#page_60 h3 {
  font-family: "DINPro", sans-serif;
  font-weight: lighter;
  font-size: 44px;
  margin-bottom: 0;
  margin-top: 25px;
}

#page_60 p {
  font-family: "NewsGothicStd", sans-serif;
  margin-bottom: 0;
  margin-top: 5px;
  font-size: 26px;
}

#page_60 ul {
  padding: 0;
  margin-bottom: 0;
  margin-top: 5px;
}

#page_60 ul li {
  font-size: 26px;
  line-height: 35px;
  font-family: "NewsGothicStd", sans-serif;
}

video {
  position: absolute;
  width: 1080px;
  top: 550px;
  transform: translateY(-50%);
}