/* ----------  Book  ------------ */

.screen{
  background: rgba(0, 0, 0, 0.5);
  border: 1px solid white;
  display: block;
  position: absolute;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.8);
}

.screenImg{
  width: fit-content;
  width: -moz-max-content;
  height: auto;
  padding: 1%;
}

.zoomImg{
  position: relative;
}

/* ----------  Artiste  ------------ */

.artisteImg1{
  top: 10%;
  right: 12%;
}

.artisteImg2{
  top: 15%;
  right: 1%;
}

.artisteImg3{
  top: 1%;
  right: 15%;
}

.artisteImg4{
  top: 19%;
  right: 10%;
}

.artisteImg5{
  top: 35%;
  right: 40%;
}

.artisteImg6{
  top: 28%;
  right: 18%;
}

.artisteImg7{
  top: 34.2%;
  right: 39.8%;
}

.artisteText{
  top: 25%;
  left: 12%;
  width: 32em;
}

/* ----------  Graphiste  ------------ */

.graphisteImg1{
  top: 8%;
  left: 12%;
}

.graphisteImg2{
  top: 8%;
  left: 12%;
}

.graphisteImg3{
  top: 10%;
  left: 10%;
}

.graphisteImg4{
  top: 10%;
  left: 10%;
}

.graphisteImg5{
  top: 10%;
  left: 10%;
}

.graphisteImg6{
  top: 10%;
  left: 10%;
}

.graphisteImg7{
  top: 60%;
  right: 10%;
}

.graphisteImg8{
  top: 50%;
  right: 10%;
}

.graphisteImg9{
  top: 50%;
  right: 10%;
}

.graphisteImg10{
  top: 50%;
  right: 10%;
}

.graphisteImg11{
  top: 50%;
  right: 10%;
}

.graphisteImg12{
  top: 50%;
  right: 10%;
}

.graphisteImg13{
  top: 50%;
  right: 10%;
}

.graphisteImg14{
  top: 10%;
  right: 20%;
}

.graphisteImg15{
  top: 10%;
  right: 20%;
}

.graphisteImg16{
  top: 10%;
  right: 20%;
}

.graphisteImg17{
  top: 50%;
  left: 25%;
}

.graphisteImg18{
  top: 32%;
  left: 15%;
}

.graphisteImg19{
  top: 60%;
  right: 70%;
}

.graphisteImg20{
  top: 40%;
  right: 13%;
}

.graphisteText{
  top: 20%;
  left: 35%;
  width: 38em;
}

/* ----------  Webdesigner  ------------ */

.webdesignerImg1{
  top: 14%;
  right: 5%;
}

.webdesignerImg2{
  top: 15%;
  right: 8%;
}

.webdesignerImg3{
  top: 32%;
  right: 17%;
}

.webdesignerImg4{
  top: 13%;
  left: 10%;
}

.webdesignerImg5{
  top: 48%;
  left: 22%;
}

.webdesignerText{
  top: 30%;
  left: 28%;
  width: 38em;
}

.webdesignerActu{
  top: 2%;
  left: 6%;
  width: 63em;
}

/* ----------  technomage  ------------ */

.technomageImg1{
  top: 25%;
  left: 24%;
}

.technomageImg2{
  top: 25%;
  left: 23%;
}

.technomageImg3{
  top: 25%;
  left: 22%;
}

.technomageImg4{
  top: 25%;
  left: 76%;
}

.technomageImg5{
  top: 25%;
  left: 75%;
}

.technomageImg6{
  top: 25%;
  left: 44%;
}

.technomageImg7{
  top: 25%;
  left: 53%;
}

.technomageImg8{
  top: 25%;
  left: 50%;
}

.technomageImg9{
  top: 25%;
  left: 49%;
}

.technomageImg10{
  top: 25%;
  left: 48%;
}

.technomageImg11{
  top: 25%;
  left: 47%;
}

.technomageText{
  top: 20%;
  left: 15%;
  width: 38em;
}

/* ----------  Contact  ------------ */

p.contact{
  font-size: 2em;
  text-align: center;
  margin-bottom: 30px;
}

p.contact a{
  font-size: 2em;
  text-align: center;
  color: white;
}

a#mail:hover{
  color: #fbe311;
}

a#facebook:hover{
  color: #6bcfcf;
}

a#instagram:hover{
  color: #db5cb9;
}

.tarifsLink{
  top: 55%;
  left: 12%;
  width: 13em;
  padding: 1%;
  text-align: center;
}

.tarifsLink a{
  color: #fbe311;
  color: #fbe311;
  font-size: 2em;
  font-family: 'pixelmusketeer';
  text-shadow: 0 0 1em black;
  position: relative;
  cursor: pointer;
}

.tarifsLink a:hover{
  color: #df508a;
}

.best{
  top: 10%;
  right: 5%;
  width: 13em;
  padding: 1%;
  text-align: center;
}


/* ----------  Tarifs  ------------ */

.tarifsTitle{
  font-size: 8em;
  text-align: center;
  color: #fbe311;
  opacity: 0.4;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.8);
}

.tarifsCarte{
  top: 25%;
  left: 25%;
  width: 21em;
  text-align: center !important;
}

.tarifsEstim{
  top: 40%;
  left: 12%;
  width: 34em;
  text-align: center !important;
}

.tarifsOffre1{
  top: 18%;
  right: 15%;
  width: 40em;
  text-align: center !important;
}

.white{
  color:white !important;
}


/* ----------  Texts  ------------ */

.screenText{
  font-family: 'pokemon_gb';
  font-size: 0.8em;
  line-height: 1.3em;
}

.screenText p{
  text-align: left justify;
  border-top: 1px solid white;
  padding: 4%;
}

/* ----------  Citation  ------------ */

p.citation{
  text-align: center;
  font-family: 'pixelmusketeer';
  text-shadow: 0 0 1em black;
}

.surligner{
  font-size: 2em;
}

.prix{
  color: #fbe311;
  font-size: 2em;
  font-family: 'pixelmusketeer';
  text-shadow: 0 0 1em black;
}

.prixOffre{
  color: #fbe311;
  font-size: 3em;
  font-family: 'pixelmusketeer';
  text-shadow: 0 0 1em black;
}