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

body {
background-color: #8b6c4c;
display: flex;
justify-content: center;
align-items: center;
min-height: 100vh;
overflow-x: hidden;
}

.container {
position: relative;
width: 100vw;
max-width: 100%;
display: block;
}

.background-img {
width: 100%;
height: auto;
display: block;
}

.hotspot {
position: absolute;
cursor: pointer;
background: rgba(255, 255, 255, 0); 
z-index: 10;
}

.hotspot.ticket {
top: 47%;
left: 12.5%;
width: 13.5%;
height: 9%;
transform: rotate(-12deg);
}

.hotspot.onglet-bleu {
top: 21%;
left: 91%;
width: 3.5%;
height: 10%;
}

.hotspot.onglet-vert {
top: 31%;
left: 91%;
width: 3.5%;
height: 10%;
}

.hotspot.onglet-jaune {
top: 41%;
left: 91%;
width: 3.5%;
height: 12%;
}