/*==========================================================
                     media queries
=============================================================*/
@media screen and (max-width:1920px) {}

@media screen and (max-width:1440px) {}

@media screen and (max-width:1366px) {
    body { 
    font-size: 13px;
   }
}

@media screen and (max-width:1199px) {}

@media screen and (max-width:1024px) and (orientation: portrait) {
    #scene {
        visibility: hidden;
    }

    #bg {
        visibility: visible;
    }
}

@media screen and (max-width:991px) {}


@media screen and (max-width:768px) and (orientation: portrait) {
    body { 
    font-size: 12px;
   }
    #scene {
        visibility: hidden;
    }

    #bg {
        visibility: visible;
        background-image: url(img/bg_tablet.jpg);
    }
   
}


@media screen and (max-width:600px) and (orientation: portrait) {
    #bg {
        background-image: url(img/bg_tablet.jpg);
    }
     .mah_tablet{
    height: 80vh;
    top:10vh;
    left: 2vw;
}
}


@media screen and (max-width:480px) and (orientation: portrait) {
    body { 
    font-size: 11px;
   }
    #bg {
        background-image: url(img/bg_tablet.jpg);
    }
     .mah_tablet{
    height: 80vh;
    top:8vh;
    left: 2vw;
}
}


@media screen and (max-width: 414px) and (orientation: portrait) {
    #bg {
        background-image: url(img/bg_tablet.jpg);
    }
    .mah_tablet{
    height: 70vh;
    top:8vh;
    left: 2vw;
}
}


@media screen and (max-width: 375px) {
    body { 
    font-size: 10px;
   }
    #bg {
        background-image: url(img/bg_tablet.jpg);
    }
}


@media screen and (max-width: 320px) and (orientation: portrait) {
    #bg {
        background-image: url(img/bg_tablet.jpg);
    }
    
    .mah_tablet{
    height: 70vh;
    top: 8vh;
    left: 2vw;
}
}