@media (max-width: 1000px) {


     /*ENDGAME*/
    #endgame-leaderboard {
        background-image: url(../images/endgame/egMobile.png) !important;
        background-size: cover !important;
        width: 90% !important;
        height: 80% !important;

    }

    .leaderboard-row{
        width: 70% !important;
        height: 20% !important;
        /*margin-top: 10% !important;*/
    }
    .avatar {
        height: 40% !important;
        width: 12% !important;

        max-height: 40% !important;
        max-width: 12% !important;
    }

    .time{
        font-size: 2.5vb !important;
    }

    .name{
        height: 40% !important;
        font-size: 25px !important;
    }

    .rank{
        height: 40% !important;

    }

    #play-btn{
        background-image: url(../images/endgame/play.png) !important;
        background-size: contain;
        background-repeat: no-repeat;
    }

    #switch-btn{
        background-image: url(../images/endgame/play.png) !important;
        background-size: contain;
        background-repeat: no-repeat;
    }

/*
    .endgame-btns{
        margin-top: 20%;
    }*/

    /* LOGO PAGE */


    /* HOW TO PLAY */
    #descDiv{
        width: 90% !important;
    }
    #description{
        background-image: url(../images/htp.png);
        background-position: center;
        background-repeat: no-repeat;
        background-size: contain;

        position: relative;
        

    }
    #HowToPlay{
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 50px !important;
        margin-top: 17% !important;
        background-color: rgb(51, 13, 13);
        margin-left: 15%;
        width: 70%;
        height: 7%;
        border-radius: 10px;
    }

    #textImg{
        position: absolute !important;
        width: 90% !important;
        background-size: contain !important;
        margin-bottom: 100px !important;
        margin-top: 10% !important;
        font-size: 27px;
    }
    #textImg img{
        margin-top: 10%;
    }

    #playBtn{
        margin-bottom: 20%;
    }

    /* CHARACTER SELECTION */

    #continue-btn {
        width: 300px;
        height: 100px;


    }

    .char-select-container h2{
        top: 5%;
    }


    #character-selection.passed {
        display: none !important;
    }

    #character-selection {
        flex-direction: column;
        align-items: center;
        justify-content: center;
        height: 100%;
        position: relative;
    }

    .char-select-container {
        margin-left: 0 !important;
        margin-right: 0 !important;
        left: 0 !important;
        right: 0 !important;
        margin-bottom: 20% !important;
        width: 800px !important;
        height: 1700px !important;
        background-size: cover !important;
    }

    .statue-section {
        margin-bottom: 20% !important;
    }

    #statue {
        width: 500px !important;
        height: 300px !important;
    }

    .character-card {
        width: 17vw !important;
    }

    #toilet-statue {
        margin-top: 30% !important;
        width: 300px !important;
        height: 200px !important;
    }

    .statue-title {
        position: absolute !important;
        margin-top: 0 !important;
        margin-bottom: 300px !important;
        width: 300px !important;
        background-size: cover !important;
    }

    .statue-character {
        position: relative !important;
        top: -100px;
        margin-left: 0 !important;
        display: flex !important;
        justify-content: center;
        align-items: center;
    }

    #statue-title {
        display: none !important;
    }




    /*GAMEPLAY*/
    #counter{
        top: 25%;
        width: 300px;
        height: 500px;
        background-size: contain !important;
    }

    #TIMER{
        font-size: 4.2vb;
    }


    #soundContainer {
        height: 30%;
    }



    #loudnessBarContainer,
    #speedBarContainer {
        width: 50%; 
        height: 100%;
        position: relative;
        overflow: hidden;
        max-width: 55% !important;
        min-width: 55% !important;
        max-height: 30vh !important;
        min-height: 30vh !important;

        background-image: url(../images/EnvironemntImages/game/scale.png);
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;

        bottom: 0;
    }


    #modelCharacter{
        margin-left: 0;

    }


    .fart-particle {
        left: 0;
        margin-left: 0;

        margin-right: 300px;
        right: 300px;
        margin-bottom: 100px;
        margin-top: -100px;
    }

   
}



















@media (min-width: 1500px) {
    #HowToPlay {
        margin-top: 2%;
        font-size: 70px;
    }


    #textImg{
        font-size: 50px;
        width: 80%;
        height: 60%;

    }

    #textImg img{
        width: 90%;
        height: 80%;  
    }


    .statue-character {
        font-size: 40px;
        margin-left: 15%;
        margin-top: 40%;
    }

    .char-select-container h2{
        margin-top: 1%;
        font-size: 50px;
    }


    .fart-particle {
        left: 0;
        margin-left: 0;

        margin-right: 300px;
        right: 300px;
        margin-top: 150px;
    }

}