@media screen and (min-width: 40.5em) {
  .product-img {
    width: 50%;
    float: left;
  }
}


#fondgene{
  position:fixed;
  background:#975401;
  width:100%;
  height:60%;
  margin-top:10%;
  border-radius:2%;
}
   

.toucheblanche{
  position:fixed;
  height:30%;
  width:3.4%;
  margin-top:9%;
  background:white;
  border-right:1px solid #BBB;
  cursor:pointer;
  transition:all 0.1s ease 0ms;
  -o-transition:all 0.1s ease 0ms;
  -ms-transition:all 0.1s ease 0ms;
  -moz-transition:all 0.1s ease 0ms;
  -webkit-transition:all 0.1s ease 0ms;
}
.toucheblanche:before{
  content: "";  
  
  position:absolute;
  height:43%;
  width:130%;
  margin-top:181px;
  background:white;
  border-right:1px solid #BBB;
  cursor:pointer;
  transition:all 0.1s ease 0ms;
  -o-transition:all 0.1s ease 0ms;
  -ms-transition:all 0.1s ease 0ms;
  -moz-transition:all 0.1s ease 0ms;
  -webkit-transition:all 0.1s ease 0ms;
}


.toucheblanche:active{
  -webkit-transform:perspective(65px) rotateX(-2deg);
  transform:perspective(65px) rotateX(-2deg);
margin-top:8.9%;
}


.toucheblanche1{
  position:fixed;
  height:30%;
  width:4.4%;
  margin-top:9%;
  background:white;
  border-right:1px solid #BBB;
  cursor:pointer;
  transition:all 0.1s ease 0ms;
  -o-transition:all 0.1s ease 0ms;
  -ms-transition:all 0.1s ease 0ms;
  -moz-transition:all 0.1s ease 0ms;
  -webkit-transition:all 0.1s ease 0ms;
}
.toucheblanche1:before{
  content: "";  
  
  position:absolute;
  height:43%;
  width:100%;
  margin-top:181px;
  background:white;
  border-right:1px solid #BBB;
  cursor:pointer;
  transition:all 0.1s ease 0ms;
  -o-transition:all 0.1s ease 0ms;
  -ms-transition:all 0.1s ease 0ms;
  -moz-transition:all 0.1s ease 0ms;
  -webkit-transition:all 0.1s ease 0ms;
}

.toucheblanche1:active{
  -webkit-transform:perspective(65px) rotateX(-2deg);
  transform:perspective(65px) rotateX(-2deg);
margin-top:8.9%;
}

.toucheblanche2{
  position:fixed;
  height:30%;
  width:3.4%;
  margin-top:9%;
  background:white;
  border-right:1px solid #BBB;
  cursor:pointer;
  transition:all 0.1s ease 0ms;
  -o-transition:all 0.1s ease 0ms;
  -ms-transition:all 0.1s ease 0ms;
  -moz-transition:all 0.1s ease 0ms;
  -webkit-transition:all 0.1s ease 0ms;
}
.toucheblanche2:before{
  content: "";  
  
  position:absolute;
  height:43%;
  width:130%;
  margin-top:181px;
  background:white;
  border-right:1px solid #BBB;
  cursor:pointer;
  transition:all 0.1s ease 0ms;
  -o-transition:all 0.1s ease 0ms;
  -ms-transition:all 0.1s ease 0ms;
  -moz-transition:all 0.1s ease 0ms;
  -webkit-transition:all 0.1s ease 0ms;
}

.toucheblanche2:active{
  -webkit-transform:perspective(65px) rotateX(-2deg);
  transform:perspective(65px) rotateX(-2deg);
  margin-top:8.9%;
}

.touchenoire{
  position:fixed;
  height:19.2%;
  width:2.2%;
  margin-top:9%;
  background:black;
  border-right:1px solid #BBB;
  cursor:pointer;
}

.touchenoire:active{
  -webkit-transform:perspective(150px) rotateX(-6deg);
  transform:perspective(150px) rotateX(-6deg);
  margin-top:8.9%;
}

     body{
background-image: -webkit-linear-gradient(right top, #D60F0E 0%, #FFDD01 100%);
width:99%;margin:auto;min-width:600px;max-width:2000px
}


 
 .placebas{
  position:fixed;

  margin-top:59%;
  color:#975401;

}