@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@200;400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Edu+TAS+Beginner:wght@500&display=swap');

* {
  margin: 0;
  padding: 20;
  box-sizing: border-box;
}

/*font-family: 'Edu TAS Beginner', cursive;*/
body {
  font-family: 'Poppins', sans-serif;
}

.headerbackground {
  background-image: url(https://images.pexels.com/photos/270557/pexels-photo-270557.jpeg?cs=srgb&dl=pexels-pixabay-270557.jpg&fm=jpg);
  padding-top: 4px;
}

.text img {
  width: 45%;
}

/* slide */
.banner {
  width: 100%;
  height: 100vh;
  position: relative;
  overflow: hidden;
}

.slider {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
}

#slideImg {
  width: 100%;
  height: 100%;
}

.content {
  padding: 16px;
  margin-top: 10px;
}

.containerpart1 h3 {
  font-size: 22px;
  line-height: 40px;
  margin: 5px 0px;
  color: black;
}

/* Ajoustement écrant */
@media only screen and (max-width: 2000px) {
  #slideImg {
    width: 100%;
  }

  .content {
    margin-top: 162px;
  }
}

@media only screen and (max-width: 1280px) {
  #slideImg {
    width: 100%;
  }

  .content {
    margin-top: 162px;
  }
}

@media only screen and (max-width: 428px) {
  .content {
    margin-top: 0px;
  }

  .containerpart1 h3 {
    font-size: 23px;
    line-height: 35px;
    margin: 5px 0px;
    color: rgb(0, 0, 0);
  }
}

@media only screen and (max-width: 414px) {
  .content {
    margin-top: 0px;
  }

  .containerpart1 h3 {
    font-size: 22px;
    line-height: 33px;
    margin: 5px 0px;
    color: rgb(0, 0, 0);
  }

  .slider {
    height: 50%;
    margin-top: 250px;
  }
}


@media only screen and (max-width: 412px) {
  .content {
    margin-top: 0px;
  }

  .containerpart1 h3 {
    font-size: 22px;
    line-height: 25px;
    margin: 5px 0px;
    color: rgb(0, 0, 0);
  }
}

@media only screen and (max-width: 390px) {
  .content {
    margin-top: 0px;
  }

  .containerpart1 h3 {
    font-size: 22px;
    line-height: 27px;
    margin: 5px 0px;
    color: rgb(0, 0, 0);
  }
}

@media only screen and (max-width: 375px) {
  .content {
    margin-top: -28px;
  }

  .containerpart1 h3 {
    font-size: 20px;
    line-height: 27px;
    margin: 5px 0px;
    color: rgb(0, 0, 0);
  }
}

@media only screen and (max-width: 360px) {
  .content {
    margin-top: 0px;
  }

  .containerpart1 h3 {
    font-size: 18px;
    line-height: 27px;
    margin: 5px 0px;
    color: rgb(0, 0, 0);
  }
}

@media only screen and (max-width: 240px) {
  .content {
    margin-top: -29px;
  }

  .containerpart1 h3 {
    font-size: 13px;
    line-height: 10px;
    margin: 5px 0px;
    color: rgb(0, 0, 0);
  }

  .row {
    margin-left: 0px;
    margin-right: 0px;
  }
}

@keyframes zoom {
  0% {
    transform: scale(1.3);
  }

  15% {
    transform: scale(1);
  }

  85% {
    transform: scale(1);
  }

  100% {
    transform: scale(1.3);
  }
}

.overlay {
  width: 100%;
  height: 100vh;
  position: absolute;
  top: 0;
  background-color: rgba(110, 108, 108, 0.42);
  /*content Ne fonctionne pas
  padding: 16px;
  margin-top: 150px;*/
}


/* Navigation */
.couleurpage {
  background: radial-gradient(rgb(255, 255, 255), #ffffff);
}

.logo img {
  width: 45%;
}

/*page404*/
.container4042 {
  max-width: 1500px;
  margin: 0px auto;
  padding-left: 25px;
  padding-right: 25px;
  padding-bottom: 0px;
  margin-bottom: 255px;
}

.container404 img {
  margin: 0 auto;
  margin-top: 240px;
  margin-bottom: 0px;
  display: block;
}

.containerimg img {
  margin: 0 auto;
  margin-top: 0px;
  margin-bottom: 0px;
}

.containerimg {
  padding-left: 25px;
  padding-right: 25px;
}

/*Soins-PRIX*/
.containersoins {
  padding-top: 200px;
  padding-bottom: 100px;
}

.containersoins2 {
  margin-bottom: 100px;
}

/*.____STRUCTURE BASIQUE_____.*/
.text-droite t {
  font-size: 23px;
  font-family: 'Edu TAS Beginner', cursive;
}

.text-droite t2 {
  font-size: 22px;
  float: right;
}

.text-droite t3 {
  font-size: 22px;
  float: right;
}


.text-droite {
  float: initial;
  margin-left: 50px;
  margin-right: 200px;
  z-index: 100;
}

.row .col h4 {
  font-size: 23px;
  font-family: 'Edu TAS Beginner', cursive;
}

.row .col h5 {
  font-size: 22px;
}


.row .col hr {
  border-top: 2px solid black;
  margin-top: 0;
  margin-bottom: 20px;
}

/*.Séance structure.*/
.bordurebas t {
  font-size: 28px;
  display: block;
  z-index: 100;
}

.bordurebas i {
  display: block;
  z-index: 100;
}

.bordurebas t2 {
  font-size: 22px;
  float: right;
  z-index: 100;
}

.aligner {
  display: grid;
  float: right;
  font-size: 22px;
  margin-top: 5px;
}

.aligner2 {
  display: grid;
  float: right;
  font-size: 21px;
  margin-top: 5px;
}

.aligner t3 {
  margin-top: 28.5px;
}

.text-droite2 {
  float: right;
  margin-left: 50px;
  margin-right: 200px;
  z-index: 100;
}

/*._____Séance structure____.*/
.rownav {
  display: flex;
  align-items: center;
  justify-content: space-around;
  flex-wrap: wrap;
  margin-left: -20px;
  margin-right: -20px;
}

.row {
  display: flex;
  align-items: center;
  justify-content: space-around;
  flex-wrap: wrap;
  margin-left: 20px;
  margin-right: 20px;
}

.row2 {
  align-items: center;
  justify-content: space-around;
  flex-wrap: wrap;
  padding-left: 20px;
  padding-right: 20px;
}

/*Soins-MEDIA*/
/*_________Logixcube-Cornu________*/
@media only screen and (min-width: 240px) {

  .text-droite {
    margin-right: 20px;
    margin-left: 15px;
    z-index: 101;
  }

  .text-droite2 {
    margin-right: 20px;
    z-index: 101;
  }

  .aligner {
    font-size: 19px;
  }

  .aligner2 {
    font-size: 19px;
  }

  .bordurebas h3 {
    font-size: 24px;
  }

}

@media only screen and (min-width: 280px) {

  .text-droite {
    margin-right: 20px;
    margin-left: 15px;
    z-index: 101;
  }

  .text-droite2 {
    margin-right: 20px;
    z-index: 101;
  }

  .aligner {
    font-size: 20px;
  }

  .aligner2 {
    font-size: 20px;
  }

  .bordurebas h3 {
    font-size: 24px;
  }

}

@media only screen and (min-width: 320px) {

  .text-droite {
    margin-right: 20px;
    margin-left: 15px;
    z-index: 101;
  }

  .text-droite2 {
    margin-right: 20px;
    z-index: 101;
  }

  .aligner {
    font-size: 19px;

  }

  .aligner2 {
    font-size: 19px;
  }

  .bordurebas h3 {
    font-size: 24px;
  }

  .bordurebas t {
    font-size: 23px;
  }

}

/*_________Logixcube-Cornu________*/
@media only screen and (min-width: 330px) {
  .text-droite {
    margin-right: 20px;
    margin-left: 5px;
  }

  .aligner {
    font-size: 19px;
  }

  .aligner2 {
    font-size: 19px;
  }

  .bordurebas h3 {
    font-size: 24px;
  }

  .bordurebas t {
    font-size: 23px;
  }
}

/*_________Logixcube-Cornu________*/
@media only screen and (min-width: 360px) {
  .text-droite {
    margin-right: 25px;
    margin-left: 10px;
  }

  .text-droite t {
    font-size: 21px;
  }

  .aligner {
    font-size: 19px;
  }

  .aligner2 {
    font-size: 19px;
  }

  .bordurebas h3 {
    font-size: 24px;
  }

  .bordurebas t {
    font-size: 23px;
  }
}

/*_________Logixcube-Cornu________*/
@media only screen and (min-width: 375px) {
  .text-droite {
    margin-right: 20px;
    margin-left: 5px;
  }

  .aligner {
    font-size: 19px;
  }

  .aligner2 {
    font-size: 19px;
  }

  .bordurebas h3 {
    font-size: 24px;
  }

  .bordurebas t {
    font-size: 23px;
  }
}

/*_________Logixcube-Cornu________*/
@media only screen and (min-width: 384px) {
  .text-droite {
    margin-right: 20px;
    margin-left: 15px;
  }

  .aligner {
    font-size: 19px;
  }

  .aligner2 {
    font-size: 19px;
  }

  .bordurebas h3 {
    font-size: 24px;
  }

  .bordurebas t {
    font-size: 23px;
  }
}

/*_________Logixcube-Cornu________*/
@media only screen and (min-width: 390px) {
  .text-droite {
    margin-right: 20px;
    margin-left: 15px;
  }

  .aligner {
    font-size: 19px;
  }

  .aligner2 {
    font-size: 19px;
  }

  .bordurebas h3 {
    font-size: 24px;
  }

  .bordurebas t {
    font-size: 23px;
  }
}

/*_________Logixcube-Cornu________*/
@media only screen and (min-width: 412px) {
  .text-droite {
    margin-right: 30px;
    margin-left: 15px;
  }

  .aligner {
    font-size: 19px;
  }

  .aligner2 {
    font-size: 19px;
  }

  .bordurebas h3 {
    font-size: 24px;
  }

  .bordurebas t {
    font-size: 23px;
  }
}

/*_________Logixcube-Cornu________*/
@media only screen and (min-width: 414px) {
  .text-droite {
    margin-right: 20px;
    margin-left: 15px;
  }

  .aligner {
    font-size: 22px;
  }

  .aligner2 {
    font-size: 22px;
  }

  .bordurebas h3 {
    font-size: 24px;
  }

  .bordurebas t {
    font-size: 23px;
  }
}

/*_________Logixcube-Cornu________*/
@media only screen and (min-width: 428px) {
  .text-droite {
    margin-right: 40px;
    margin-left: 20px;
  }

  .aligner {
    font-size: 22px;
  }

  .aligner2 {
    font-size: 22px;
  }

  .bordurebas h3 {
    font-size: 24px;
  }

}


/*_________Logixcube-Cornu________*/
@media only screen and (min-width: 1024px) {
  .text-droite {
    margin-right: 200px;
    margin-left: 50px;
  }

  .text-droite t {
    font-size: 24px;
  }

  .bordurebas h3 {
    font-size: 24px;
  }

  .text-droite2 {
    margin-right: 180px;
    z-index: 101;
  }

  .aligner {
    font-size: 22px;
  }

  .aligner2 {
    font-size: 22px;
  }
}

/*Images fond*/
.imgvisage {
  background-image: url('/images/visage.jpg');
  background-position: top;
  background-repeat: no-repeat;
  background-attachment: fixed;
}

.imgcorp {
  background-image: url('/images/corp.jpg');
  background-position: top;
  background-repeat: no-repeat;
  background-attachment: fixed;
}

.imgcorp {
  background-image: url('/images/corp.jpg');
  background-position: top;
  background-repeat: no-repeat;
  background-attachment: fixed;
}

.imghomme {
  background-image: url('/images/homme2.jpg');
  background-position: top;
  background-repeat: no-repeat;
  background-attachment: fixed;
}

.imgmassage {
  background-image: url('/images/massage.jpg');
  background-position: top;
  background-repeat: no-repeat;
  background-attachment: fixed;
}

.imgonglerie {
  background-image: url('/images/onlgerie.jpg');
  background-position: center;
  background-repeat: no-repeat;
  background-attachment: fixed;
}

.imgmaquillage {
  background-image: url('/images/maquillage_glamour_small_small.jpg');
  background-position: top;
  background-repeat: no-repeat;
  background-attachment: fixed;
}

@media only screen and (max-width: 670px) {
  .imgmaquillage {
    background-position: center;
  }
}

/*accueil*/

.part2 a {
  text-decoration: none;
}

.section-link {
  color: rgb(136, 119, 108);
  font-size: 16px;
  /* par exemple */
  padding: 8px 12px;
  border-radius: 5px;
  transition: background-color 0.3s ease, color 0.3s ease, box-shadow 0.3s ease;
  display: inline-block;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.section-link:hover {
  background-color: rgba(194, 174, 161, 0.1);
  /* légère modification ici */
  color: rgb(194, 174, 161);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}

.section-link.active {
  background-color: rgb(194, 174, 161);
  color: white;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

.part2 h1 {
  font-size: 2em;
}
.part2 h2 {
  font-size: 1.5em;
}
.part2 p {
  font-size: 1.5em;
}
.part2 h3 {
  font-size: 1.5em;
  margin-top: 2em;
  font-weight: 400;
}

@media (min-width: 992px) {
  .section-link {
      font-size: 18px;
      /* ajustez selon vos préférences */
      padding: 12px 16px;
      /* ajustez également l'espacement */
  }
}

.h1 {
  font-size: 38px;
  line-height: 50px;
  margin: 5px 0px;
}

.fond1 {
  background-image: url('/images/bouge1.jpg');
  background-position: top;
  background-repeat: no-repeat;
  background-attachment: fixed;
  z-index: 80;
}

.fond2 {
  background-image: url('/images/bouge2.jpg');
  background-position: top;
  background-repeat: no-repeat;
  background-attachment: fixed;
  z-index: 80;
}

.b3part1 {
  background-image: url('/images/bouge1.jpg');
  background-position: top;
  background-repeat: no-repeat;
  background-attachment: fixed;
}

.containerpart2 h3 {
  font-size: 22px;
  line-height: 40px;
  margin: 5px 0px;
  color: black;
}

.container {
  max-width: 1300px;
  margin: 0px auto;
  padding-left: 25px;
  padding-right: 25px;
  padding-bottom: 600px;
}

.containercontact {
  max-width: 1300px;
  margin: 0px auto;
  margin-top: 100px;
  padding-left: 25px;
  padding-right: 25px;
  padding-bottom: 15px;
}

.containerpart1 {
  padding-top: 150px;
  padding-bottom: 150px;
  width: 80%;
  max-width: 1080px;
  margin: auto;
  width: 100%;
  height: 100vh;
}

.contentcenter {
  width: 60%;
  margin: 160px auto 0;
  text-align: center;
}

.containerpart3 {
  padding-top: 150px;
  padding-bottom: 150px;
  width: 80%;
  max-width: 1080px;
  margin: auto;
  /*  position: relative; */
}

.containerpart4 {
  max-width: 1300px;
  margin: 0px auto;
  padding-left: 25px;
  padding-right: 25px;
  padding-bottom: 200px;
}

.couleurbackground {
  background-color: rgba(112, 112, 112, 0.692);
}

.part3 {
  background-color: rgb(194, 174, 161);
  /*Haut*r gba(27, 190, 68, 0.842);*/
}


.text-center {
  text-align: center;
}

.text-align {
  float: right;
  margin-top: 30px;
  margin-right: 40px;
}
.produit{
  margin-top: 50px;
  margin-bottom: 50px;
}
/*.bodure*/

.bordure {
  border: 3px solid;
}

.bordurehaut {
  border-top: 3px solid;
}

.bordurebas {
  border-bottom: 3px solid;
}

.borduredroite {
  border-right: 3px solid;
}

.borduregauche {
  border-left: 3px solid;
}

.bordureDG {
  border-right: 3px solid;
  border-left: 3px solid;
}

.bordureDBG {
  border-left: 3px solid;
  border-right: 3px solid;
  border-bottom: 3px solid;
}

.bordureDHG {
  border-left: 3px solid;
  border-right: 3px solid;
  border-top: 3px solid;
}

/*.col2 text "Bienvenu blabla..." **/
.text {
  flex-basis: 50%;
  font-size: 20px;
  line-height: 29px;
}

.text img {
  padding: 30px 0;
  margin-left: 0px;
}

/*.col2 Text logicube*/
.text h1 {
  font-size: 48px;
  line-height: 50px;
  margin: 25px 0px;
}

/*.col6 Text logicube c'est quoi ?*/
.text h1 {
  font-size: 48px;
  line-height: 50px;
  margin: 25px 0px;
}

.small {
  font-size: 22px;
  line-height: 15px;
  margin: 5px 0px;
}

/*p*/
p {
  color: rgb(0, 0, 0);
}

/*Centrer images*/
#images {
  overflow: hidden;

}

.center-div-images {
  margin: 0 auto;
  width: 1100px;
}


.secteur {
  float: left;
  margin: 15px;
  text-align: center;
}

img#imgproduit1 {

  width: 360px;
  margin-top: 24px;
}

img#imgproduit2 {
  width: 400px;
}

img#imgproduit3 {
  width: 220px;
}

@media only screen and (max-width: 895px) {
  img#imgproduit1 {

    width: 180px;
    margin-top: 12px;
  }

  img#imgproduit2 {
    width: 200px;
  }

  img#imgproduit3 {
    width: 120px;
  }

  .center-div-images {
    margin: 0 auto;
    width: 200px;
  }
}




@media only screen and (max-width: 360px) {
  img#imgproduit1 {

    width: 89px;
    margin-top: 8px;
  }

  img#imgproduit2 {
    width: 99px;
  }

  img#imgproduit3 {
    width: 59px;
  }

  .center-div-images {
    margin: 0 auto;
    width: 400px;
  }

  #images {
    width: 303px;
  }

  .secteur {
    float: left;
    margin: 5px;
    text-align: center;
  }
}

.dropbtn {
  background-color: rgb(194, 174, 161);
  color: white;
  border: none;
  cursor: pointer;

  font-size: 16px;
  line-height: 25px;
  border-radius: 2px;

  margin-left: 25px;
  margin-right: 25px;
  margin-top: 12px;
  margin-bottom: 12px;

  padding: 12px;
  padding-left: 12px;
  padding-right: 12px;
}

.dropbtn:hover,
.dropbtn:focus {
  background-color: rgb(189, 154, 133);
}

.dropdown {
  position: relative;
  display: inline;
  display: -webkit-inline-box;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: rgb(194, 174, 161);
  min-width: 160px;
  overflow: auto;
  box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.2);
  z-index: 9;
  text-align: center;
}

.dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}

.dropdown a:hover {
  background-color: #ddd;
}

.show {
  display: grid;
  text-align: center;
  /*display: grid;*/
}



/*NAVBAR_________Logixcube-Cornu________*/
#navbar {
  /* background-color: #f1f1f1;*/
  padding: 9px 10px;
  transition: 0.4s;
  position: fixed;
  width: 100%;
  top: 0;
  z-index: 99;
  left: 0px;
}

#navbar a {
  text-align: center;
  padding: 12px;
  text-decoration: none;
  font-size: 16px;
  line-height: 25px;
  border-radius: 2px;
  margin-left: 2px;
  margin-right: 2px;
  z-index: 100;
}


#navbar a.active:hover {
  background-color: rgb(189, 154, 133);
}

#navbar a.active {
  background-color: rgb(194, 174, 161);
  color: white;
}

/* Tu peux centrer en bas la navbar*/
#navbar-right {
  float: right;
  margin-top: 30px;
  margin-right: 0px;
  margin-left: 12.5px;
  z-index: 99;
}

/*_________Logixcube-Cornu________*/
@media only screen and (min-width: 240px) {
  #navbar {
    padding: 40px 20px;
  }

  #navbar a {
    padding: 2px;
  }

  /*
    .show a {}
  */
  .dropbtn {
    padding: 2px;
    margin-left: 2.5px;
    margin-right: 2.5px;
  }

  #navbar-right {
    float: none;
    margin-top: 0px;
    margin-right: -17px;
    margin-left: -14px;
  }

  #navbar img {
    margin-top: 0px;
    width: 200px;
  }

  .containerpart1 h3 {
    padding-top: -5px;
  }
}

/*_________Logixcube-Cornu________*/
@media only screen and (min-width: 280px) {
  #navbar {
    padding: 40px 20px;
  }

  #navbar a {
    padding: 4px;
  }

  /*
    .show a {}
  */
  .dropbtn {
    padding: 4px;
    margin-left: 6.5px;
    margin-right: 6.5px;
  }

  #navbar-right {
    float: none;
    margin-right: -9px;
    margin-left: 0px;
  }

  #navbar img {
    margin-top: 0px;
    width: 252px;
  }

  .containerpart1 h3 {
    padding-top: 40px;
  }
}

@media only screen and (min-width: 320px) {
  #navbar {
    padding: 40px 20px;
  }

  #navbar a {
    padding: 4px;
  }

  /*
  .show a {}
*/
  .dropbtn {
    padding: 4px;
    margin-left: 12.5px;
    margin-right: 12.5px;
  }

  #navbar-right {
    float: none;
  }

  #navbar img {
    margin-top: 0px;
    width: 252px;
  }

  .containerpart1 h3 {
    padding-top: 40px;
  }
}

/*_________Logixcube-Cornu________*/
@media only screen and (min-width: 330px) {
  #navbar {
    padding: 30px 26px;
  }

  #navbar a {
    text-align: center;
    padding: 8px;
    text-decoration: none;
    font-size: 16px;
    line-height: 25px;
    border-radius: 2px;
    margin-left: 2px;
    margin-right: 2px;
    z-index: 100;
  }

  #navbar-right {
    float: none;
    padding-left: 6.5px;
  }

  #navbar img {
    width: 280px;
    margin-bottom: 15px;
  }
}

/*_________Logixcube-Cornu________*/
@media only screen and (min-width: 360px) {
  #navbar {
    padding: 40px 20px;
  }

  #navbar a {
    text-align: center;
    text-decoration: none;
    font-size: 16px;
    line-height: 25px;
    border-radius: 2px;
    margin-left: 2px;
    margin-right: 2px;
    z-index: 100;

    padding: 8px;
  }

  .dropbtn {
    margin-left: 12.5px;
    margin-right: 12.5px;
    margin-top: 6px;
    margin-bottom: 6px;

    padding: 8px;
  }

  #navbar img {
    width: 280px;
    margin-top: 5px;

  }

  #navbar a {
    padding: 8px;

    margin-left: 2px;
    margin-right: 2px;
    z-index: 100;
  }

  #navbar-right {
    float: none;
    margin-top: auto;
    margin-right: 0px;
  }
}

/*_________Logixcube-Cornu________*/
@media only screen and (min-width: 375px) {
  #navbar {
    padding: 30px 20px;
  }

  #navbar a {
    text-align: initial;
    margin-top: 0px;
  }

  .dropbtn {
    margin-left: 12.5px;
    margin-right: 12.5px;
    margin-top: 6px;
    margin-bottom: 6px;
    padding: 8px;
  }

  #navbar img {
    width: 290px;
    margin-top: 6px;
    margin-bottom: 2px;
  }

  #navbar-right {
    float: none;
    margin-top: auto;
    margin-right: 25px;
    margin-left: 20px;
  }
}

/*_________Logixcube-Cornu________*/
@media only screen and (min-width: 384px) {
  #navbar {
    padding: 40px 20px;
  }

  #navbar-right {
    float: right;
    margin-top: 0px;
    margin-left: 0px;
    margin-right: 29px;
  }

  #navbar a {
    text-align: center;
    padding: 8px;
    text-decoration: none;
    font-size: 16px;
    line-height: 25px;
    border-radius: 2px;
    margin-left: 2px;
    margin-right: 2px;
    z-index: 100;
  }

  .dropbtn {
    margin-left: 12.5px;
    margin-right: 12.5px;
    margin-top: 6px;
    margin-bottom: 6px;

    padding: 8px;
  }

  #navbar img {
    width: 306px;
    margin-bottom: 2px;
  }
}

/*_________Logixcube-Cornu________*/
@media only screen and (min-width: 390px) {
  #navbar {
    padding: 40px 20px;
  }

  #navbar-right {
    float: right;
    margin-top: 0px;
    margin-right: 35px;
  }

  #navbar a {
    padding: 8px;
    margin-top: 0px;
    text-align: initial;
  }

  .dropbtn {
    margin-left: 12.5px;
    margin-right: 12.5px;
    margin-top: 6px;
    margin-bottom: 6px;
    padding: 8px;
  }

  #navbar img {
    width: 310px;
    margin-top: -10px;
    margin-bottom: 0px;

  }
}

/*_________Logixcube-Cornu________*/
@media only screen and (min-width: 412px) {
  #navbar {
    padding: 40px 20px;
  }

  #navbar a {
    margin-top: 0px;
  }

  #navbar-right {
    padding-left: 0px;
    margin-right: 46px;
  }

  .dropbtn {
    margin-left: 12.5px;
    margin-right: 12.5px;
    margin-top: 6px;
    margin-bottom: 6px;
    padding: 8px;
  }

  .containerpart1 h3 {
    padding-top: 20px;
  }

  #navbar img {
    width: 331px;
    margin-top: -10px;
    margin-bottom: 5px;
  }
}

/*_________Logixcube-Cornu________*/
@media only screen and (min-width: 414px) {
  #navbar {
    padding: 40px 20px;
  }

  #navbar a {
    padding: 8px;
    margin-top: 0px;
    text-align: initial;
  }

  #navbar-right {
    padding-left: 0px;
    margin-right: 49px;
  }

  .dropbtn {
    margin-left: 12.5px;
    margin-right: 12.5px;
    margin-top: 6px;
    margin-bottom: 6px;
    padding: 8px;
  }

  #navbar img {
    width: 331px;
    margin-top: -10px;
    margin-bottom: 0px;
  }
}

/*_________Logixcube-Cornu________*/
@media only screen and (min-width: 428px) {
  #navbar {
    padding: 40px 20px;
  }

  #navbar a {

    margin-top: 0px;

  }

  #navbar-right {
    padding-left: 0px;
    margin-right: 39px;
  }

  .dropbtn {
    margin-left: 12.5px;
    margin-right: 12.5px;
    margin-top: 6px;
    margin-bottom: 6px;
    padding: 8px;
  }

  #navbar img {
    width: 338px;
    margin-top: -10px;
    margin-bottom: 0px;
  }
}


/*_________Logixcube-Cornu________*/
@media only screen and (min-width: 1024px) {
  #navbar {
    padding: 30px 20px;
  }

  #navbar a {
    text-align: center;
    text-decoration: none;
    font-size: 16px;
    line-height: 25px;
    border-radius: 2px;
    margin-left: 2px;
    margin-right: 2px;
    z-index: 100;

    margin-top: 0px;

    padding: 12px;

  }

  #navbar-right {
    padding-left: 0px;
    margin-top: 0px;
    margin-right: 150px;
  }

  .dropbtn {
    margin-left: 12.5px;
    margin-right: 12.5px;
    margin-top: 6px;
    margin-bottom: 6px;
    padding: 12px;
  }

  #navbar img {
    width: 332px;
    margin-top: -10px;
    margin-bottom: 0px;
  }
}

/*CSS Footer ajout FOOTER*/
.hidden {
  display: none;
}

.footer-gray {
  background-color: rgb(137, 118, 106);
  /* bas rgb(128, 0, 133); fONCER COULEUR DU LOGO app tEL MODIFIER Carte*/
  width: 100%;

}

/* font le 12px permet de monter le haut */
.footer-custom {
  color: black;
  font: normal normal 12px/1.4 "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  max-width: 1008px;
  box-sizing: border-box;
  margin: -9px auto;
  padding: 24px;
}

.footer-custom:after {
  display: table;
  clear: both;
  content: "";
}

.footer-lists:after {
  display: table;
  clear: both;
  content: "";
}

.ftr-hdr {
  color: white;
  font: 22px/1.4 'BebasNeueRegular', BebasNeue, Arial, sans-serif;
  margin: 1em 0 0;
}

@media only screen and (min-width: 768px) {
  .ftr-hdr {
    font-size: 16px;
  }
}

.footer-list-wrap {
  width: 50%;
  float: left;
  box-sizing: border-box;
}

/*écran taille*/
@media only screen and (max-width: 375px) {
  .footer-list-wrap {
    width: 50.3333%;
  }
}

@media only screen and (min-width: 375px) {
  .footer-list-wrap {
    width: 50.3333%;
  }
}

@media only screen and (min-width: 568px) {
  .footer-list-wrap {
    width: 34.3333%;
  }
}

@media only screen and (min-width: 768px) {
  .footer-list-wrap {
    width: 25%;
  }
}

@media only screen and (min-width: 1024px) {
  .footer-list-wrap {
    width: 30%;
  }
}

/*Page Navbar*/
@media only screen and (max-width: 800px) {
  .logo img {
    width: 50%;
  }
}

/*Page NavBar*/
@media only screen and (max-width: 400px) {
  .logo img {
    width: 50%;
  }

}

.ftr-links-sub {
  padding: 0px;
  margin: 0px;
  padding-left: 5px;
}

.ftr-links-sub:after {
  display: table;
  clear: both;
  content: "";
}

.ftr-links-sub li {
  display: block;
  list-style-type: none;
  margin: 0;
  padding: 3px 0;
  color: black;
  font: normal normal 12px "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  text-transform: uppercase;
  /*width: 150px;*/
}

.footer-custom a,
.footer-custom a:link,
.footer-custom a:visited,
.ftr-links-sub li .link {
  text-decoration: none;
  color: black;
  padding: 5px 0;
  display: block;
}

.footer-custom .footer-legal a {
  display: inline;
}

.footer-custom a:hover,
.footer-custom a:active,
.ftr-links-sub li .link:hover {
  text-decoration: underline;
  color: black;
  cursor: pointer;
}

@media only screen and (min-width: 768px) {

  .footer-custom a,
  .footer-custom a:link,
  .footer-custom a:visited,
  .ftr-links-sub li .link {
    padding: 0;
  }
}

@media only screen and (min-width: 768px) {
  .footer-lists {
    width: 100%;
  }

  .footer-email {
    width: 50%;
    float: left;
    text-align: left;
  }

  .footer-social {
    width: 45%;
    margin-left: 5%;
    float: left;
    text-align: left;
  }
}

@media only screen and (min-width: 1008px) {
  .footer-lists {
    width: 66.6666%;
    float: left;
  }

  .footer-email {
    width: 33.3333%;
  }

  .footer-social {
    width: 33.3333%;
    float: right;
    margin-left: 0;
  }
}

.footer-legal {
  padding: 15px 0 0;
  clear: left;
}

.footer-payment {
  text-align: center;
}

@media only screen and (min-width: 768px) {
  .footer-legal {
    width: 66.6666%;
    float: left;
  }

  .footer-payment {
    width: 33.3333%;
    float: left;
  }
}

@media only screen and (min-width: 1008px) {
  .footer-payment {
    text-align: left;
  }
}

.footer-payment ul {
  padding: 0;
  display: inline-block;
  list-style-type: none;
}

.footer-payment ul li {
  display: inline-block;
  margin: 0 6px;
}

@media only screen and (min-width: 1008px) {
  .footer-payment ul li.ftr-stella {
    margin-left: 0;
  }
}

.ftr-bbb span,
.ftr-stella span {
  background-image: url("http://cache1.artprintimages.com/images/jump_pages/rebrand2/images/subnav2.png");
  background-repeat: no-repeat;
  background-color: transparent;
  cursor: pointer;
  display: inline-block;
  height: 36px;
  margin: 0;
  padding: 0;
}

.ftr-bbb span {
  background-position: -339px -8px;
  width: 96px;
}

.ftr-stella span {
  background-position: -339px -107px;
  width: 57px;
}