#jouer{
    width: 1920px;
    height: 1080px;
    overflow: hidden;
    background-image: url(../img/jouer-bg.jpg);
    background-repeat: no-repeat;
    position: relative;
}

#jouer .jouer-btn{
    position:absolute;
    width: 412px;
    height: 357px;
    background-repeat: no-repeat;
    z-index: 1;    
}

#jouer-btn1{
    background-image: url(../img/jouer-btn-1.png);
    top: 250px;
    left: 552px;
}

#jouer-btn2{
    background-image: url(../img/jouer-btn-2.png);
    top: 610px;
    left: 552px;
}

#jouer-btn3{
    background-image: url(../img/jouer-btn-3.png);
    top: 69px;
    left: 863px
}

#jouer-btn4{
    background-image: url(../img/jouer-btn-4.png);
    top: 430px;
    left: 863px;
}

#jouer-btn5{
    background-image: url(../img/jouer-btn-5.png);
    top: 250px;
    left:1174px
}

#jouer-btn6{
    background-image: url(../img/jouer-btn-6.png);
    top: 610px;
    left:1174px
}

#jouer-btn7{
    background-image: url(../img/jouer-btn-7.png);
    top:0px;
    left:0px
}

#jouer-masque1{
    position:absolute;
    width: 659px;
    height: 607px;
    background-image: url(../img/jouer-masque1.png);
    top:0px;
    left:0px;
}

#jouer-masque2{
    position:absolute;
    width: 73px;
    height: 111px;
    background-image: url(../img/jouer-masque2.png);
    left:658px;
    top:0px;
}

#jouer-btn-retour{
    position:absolute;
    background-image: url(../img/boutonretour.png);
    top:0px;
    right:0px;  
    width: 133px;
    height: 241px;
    background-repeat: no-repeat;
    z-index: 10;    
}


@media screen and (max-width :1334px){
    #jouer{
        width: 1334px;
        height: 800px;
        background-size: cover;
    }

    #jouer .jouer-btn{
        width : 286px;
        height: 248px;
        background-size: contain;   
    }

    #jouer-btn1{
        top: 173px;
        left: 386px;
    }

    #jouer-btn2{
        top: 424px;
        left: 386px;
    }

    #jouer-btn3{
        top: 48px;
        left: 603px;
    }

    #jouer-btn4{
        top: 299px;
        left: 603px;
    }

    #jouer-btn5{
        top: 173px;
        left: 821px;
    }

    #jouer-btn6{
        top: 424px;
        left: 821px;
    }

    #jouer-masque1{
        width: 458px;
        height: 422px;
        background-size: contain;
    }

    #jouer-masque2{
        top:0;
        left:457px;
        width: 32px;
        height: 49px;
        background-size: contain;
    }

    #jouer-btn-retour{
        position:absolute;
        background-image: url(../img/btn-retour-tab.png);
        top:0px;
        right:0px;  
        width: 88px;
        height: 171px;
        background-repeat: no-repeat;
        z-index: 10;    
    }

   

    
}