*
{
  margin: 0;
  padding: 0;
}

.desktop
{
  height: 474px;
  width: 743px;
  background-image: url("../img/vitraux/Melun/Plan colore.jpg");
  margin-left: 50%;
  transform: translateX(-50%);
}

.mobile
{
  display: none;
}

h1
{
  text-align: center;
  font-size: 40px;
  font-weight: bold;
  margin-bottom: 20px;
}

#coinUn, #coinDeux, #arcUn, #arcDeux, #arcTrois, #arcQuatre, #arcCinq, #arcSix, #arcSept, #arcHuit, #arcNeuf, #pieceUn, #pieceDeux, #pieceTrois
{
  position: absolute;
}

#coinUn
{
  left: 3%;
  top: 3%;
}

#coinDeux
{
  right: 3%;
  top: 3%;
}

#arcUn
{
  top: 76%;
  left: 29%;
}

#arcDeux
{
  top: 56%;
  left: 23%;
}

#arcTrois
{
  top: 34%;
  left: 23%;
}

#arcQuatre
{
  top: 11%;
  left: 31%;
}

#arcCinq
{
  top: 5%;
  left: 47%;
}

#arcSix
{
  top: 11%;
  left: 57%;
}

#arcSept
{
  top: 33.5%;
  left: 63.5%;
}

#arcHuit
{
  top: 56%;
  left: 63.5%;
}

#arcNeuf
{
  top: 76%;
  left: 66.5%;
}

#pieceUn
{
left: 44%;
bottom: 50%;
}

#pieceDeux
{
  bottom: 2%;
  left: 44%;
}

#pieceTrois
{
  bottom: 5%;
  left: 81%;
}

#responsiveTitre
{
  display: none;
}

@media screen and (max-width: 700px)
{
  #responsiveTitre
  {
    display: flex;
    justify-content: center;
    font-size: 40px;
    font-weight: bold;
    text-align: center;
    margin-top: 4%;
  }

  .desktop
  {
    display: none;
  }

  .mobile
  {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
  }

  .top
  {
    display: flex;
    flex-direction: column;
  }

  .mobile img
  {
    margin: 15px;
  }

  .mid
  {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
  }

  .mid > .troisParQuatre
  {
    width: 50%;
  }

  section h1
  {
    display: none;
  }

}