#startBtt2{
    width: 100px;
    height: 100px;
    background-color: red;
    position: absolute;
    z-index: 99999;
}

#homeBtt{
    display:block;
    width:5.46875%;
    height:9.72222%;
    background-image: url('../img/homeBtt.png');
    background-size: 100% 100%;
    position: absolute;
    right:1.953125%;
    top:1.953125%;
    cursor: pointer;
    z-index: 9999;
}
#soundBtt{
    display:none;
    width:5.46875%;
    height:9.72222%;
    background-image: url('../img/sound_on.png');
    background-size: 100% 100%;
    position: absolute;
    left:1.953125%;
    top:1.953125%;
    cursor: pointer;
    z-index: 9999;
}
/*
.no-touch #soundBtt:hover{
    background-image: url('../img/sound_off.png');
}

.no-touch #soundBtt.active:hover{

    background-image: url('../img/sound_on.png');
}

*/
#soundBtt.active{

    background-image: url('../img/sound_off.png');
}
.mojo,.intro2_p,.button,.question{
    background-repeat: no-repeat;
}

html{

    background-color: black;

}

@media  (min-aspect-ratio: 16/8){

    html,body{
        margin: 0 auto;
        max-width:1024px;
        width:177vh;
        height:100%;
        max-height: 576px;
    }
    .button p{
        font-size: 6.3vh;
    }
    .intro-box h1{
        font-size:16vh;
    }
    .intro-box h2{
        font-size:9vh;
    }
    .intro-box h3{
        font-size:15vh;
    }

    .intro2_bubble p{
        font-size: 10.4vh;
        line-height: 0.9;
    }
    .question p{
        font-size: 6.5vh;
    }

    .button-answer p{
        font-size: 4.8vh;
    }
    .mojo p{
        font-size: 4.4vh;
    }
    .summary_appla .h3{
        font-size: 6vh;
    }
    .summary_appla .h4{
        font-size: 8.8vh;
    }
    .summary_appla .h5{
        font-size: 5.4vh;
    }

}
@media (orientation: portrait) {


    html,body{
        height: 100%;
        width:100%;
    }

    #body-container{
        display: none;

    }
    body{
        background-image: url('../img/rotate_screen.png');
        background-position: center center;
        background-size: cover;
    }
}

@media (max-width: 500px){

    html,body{
        height: 100%;
        width:100%;
    }

    #body-container{
        display: none;

    }
    body{
        background-image: url('../img/rotate_screen.png');
        background-position: center center;
        background-size: cover;
    }

}