body {
  margin: 0;
  /*! background-color: #00ff00; */
  background-image: url('sprite.png');
  background-size: 100% 100%;
  color: #F5F3E7;
  font-family: 'Lato', sans-serif;
}
* {
  box-sizing: border-box;
}



header {
  padding: 20px;
  text-align: center;
  border-radius: 12px;
  margin: 40px;
}

h1 {
  font-family: 'Cinzel', 'Segoe UI Emoji', 'Noto Color Emoji', 'Apple Color Emoji', serif;
  font-size: 5em;
  color: #D4AF37;
}
.emoji{
height:3rem
}
header h2{
  font-size: 3.5em;
}
div {
  margin: 40px;
  padding: 20px;
  background-color: rgba(1,0,102,0.5);
  border-radius: 30px;
}
span {
  margin: 5px;
  background-color: rgba(1,0,102,0.5);
  border-radius: 16px;
  display:inline-block
}
label{
      margin-left: 10px;
}

h2 {
  font-family: 'Cinzel', serif;
}

footer {
  text-align: center;
  font-size: 0.8em;
}

input {
  padding:8px;
  border-top-right-radius: 16px;
  border: none;
  border-bottom-right-radius: 16px;
}
select {
  padding:8px;
  border-top-right-radius: 16px;
  border: none;
  border-bottom-right-radius: 16px;
}
button {
  padding: 8px;
  background-color: dodgerblue;
  color: white;
  border: none;
  border-radius: 16px;
  margin : 5px;
  cursor : pointer;
}
.complet {
  padding: 8px 20px;
  background-color: red;
  color: white;
  border: none;
  border-radius: 5px;
  display:inline;
}
#admin{
background-color:#00000000;
padding:0;
}
#adminBtn{
margin:0;
}
form {
display : inline-block;
margin : 0;
padding : 0;
}
#account{background-color: #00000000}
#img1 {
object-position: -90px -235px;
top: 120px;
left: 1500px;
transform: rotate(25deg)
}
#img2 {
object-position: -90px -335px;
top: 220px;
right: 200px;
transform: rotate(-45deg)
}
#img3 {
object-position: -90px -136px;
bottom: 500px;
left: 320px;
transform: rotate(65deg)
}
#cartes-ambiance {
  position: relative;
background: none;
  border: none;
  width: 0;
  height: 0;
  margin: 0;
  padding: 0;
}

.carte-floatee {
  z-index:-1;
  position: absolute;
  width: 72px;
  height: 96px;
  object-fit: none;
  pointer-events: none; /* Évite de bloquer les clics */
}
@media (max-width: 768px) {
body {
font-size: 1.5em;
  }
h1 {
  font-size: 2.5em;
  }
header h2{
  font-size: 2em;
  }
#img1 {
top: 580px;
left: 150px;
}
#img2 {
top: 580px;
right: 100px;
}
#img3 {
bottom: 500px;
left: 320px;
}
}

