.tutorial-image {
    position: fixed;
    z-index: 9999;
}

#tutorial1, #tutorial2, #tutorial3, #tutorial4, #tutorial5, #tutorial-overlay {
    display: none;
}
#no-hints-overlay {
    display: none;
    z-index: 10000;
}

#tutorial1,#tutorial4 {
    width: 90%;
    max-width: 510px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
#tutorial5 {
    width: 350px;
    position: absolute;
    top: 40px;
    left: 50%;
    transform: translateX(-50%);
}
#no-hints {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

@media (orientation: portrait) {

    #tutorial2,#tutorial3 {
        width: 80%;
        bottom: 20px;
        left: 50%;
        transform: translate(-50%, 0%);
    }
    #no-hints {
        width: 86%;
    }

}
@media (orientation: landscape) {

    #tutorial2,#tutorial3 {
        width: 30%;
        max-width: 420px;
        bottom: 50%;
        right: 2%;
        transform: translate(0%, 50%);
    }
    #tutorial5 {
        visibility: hidden;
    }
}