@font-face {
  font-family: myFont; /* set name */
  src: url(../img/ARCADECLASSIC.TTF); /* url of the font */
}
.gameHolder{
    margin-top: -100px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 20px;
    width: calc(60vw + 10vh);
    background-color: aliceblue;
    height: 120vh; /*vh correspond à l'unité de la haueur de l'écran en pourcent*/
    background-image: url(../img/Route.gif);
    background-repeat:repeat-x;
    image-rendering:pixelated;
    background-position: 50%;
    background-size: 400px;
    font-family: myFont;
    image-rendering: pixelated;
    font-size: larger;
}

.voiture{
    width: 9vh;
    transition: transform 100ms linear;
    position: absolute;
    z-index: 2;
    transform: translate(100px,10px);
    image-rendering:pixelated;
}

.cartoonBean{
    z-index: 1;
    width: 10vh;
    position: absolute;
}

#ecranDeMort{
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 20px;
    width: calc(60vw + 10vh);
    height: 80vh; /*vh correspond à l'unité de la taille de l'écran*/
    background-color: rgb(187, 76, 76);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    background-image: url(../img/Deathscreen.gif);
    background-repeat: no-repeat;
    background-size: cover;
    image-rendering:pixelated;
    background-position: 50%;
    
    font-family: myFont;
    image-rendering: pixelated;
    font-size: larger;
    color: rgb(255, 255, 255);
}

#ecranDeMort h2{
    background-color: rgba(0, 0, 0, 0.205);
}

.HideTop{
    background-color: #805e46;
    width: calc(60vw + 10vh);
    height: 20vh;
    display: flex;
    align-items: end;
    justify-content: center;
    position: absolute;
    z-index: 3;
}

.Hidebottom{
    background-color: #805e46;
    width: calc(60vw + 10vh);
    height: 20vh;
    position: absolute;
    z-index: 3;
    margin-top: 100vh;
}

.buttonHolder{
    z-index: 5;
    height: 120vh;
    display: flex;
}

.buttonLeft{
    height: 120vh;
    width: 50%;
    border: none;
    background-color: rgba(234, 0, 255, 0);
    
}
.buttonRight{
    height: 120vh;
    width: 50%;
    background-color: rgba(234, 0, 255, 0);
    border: none;
}

#popUp{
    position: absolute;
    z-index: 3;
    opacity: 0%;
    color: gold;
}

.cinematiqueHolder{
    background-color: rgb(255, 255, 255);
    height: 90vh;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    font-family: myFont;

}

.cinematiqueHolder img{
    image-rendering:pixelated;
    height: 40vh;
}