@media screen and (min-width: 320px) and (max-width: 1023px) and (orientation: portrait) {

    body {
        background: url("../img/turn-phone.png") no-repeat center center;
        background-attachment: fixed;
        overflow: hidden;
    }

    .container-video {
        opacity: 0;
    }


}

@media screen and (min-width: 320px) and (max-width: 1023px) and (orientation: landscape) {

    html, body {
        margin: 0;
        padding: 0;
        background-color: black;
        width: 100%;
        height: 100%;
        min-height: 100%;
        min-width: 100%;
        overflow: hidden;
        position: fixed;
        top: 0;
        left: 0;

    }

    body {
        /*display: flex;
        align-items: center;
        justify-content: center;
        box-sizing: border-box;*/
    }

    #main_video {
        width: 100vh;
        height: 100vw;
    }


    .plyr__poster {
        background-size: cover;
    }



    .plyr video {
        width: 100vw!important;
        height: 100vh!important;

    }

    #pip_video {
        position: fixed;
        width: 200px;
        bottom: 60px;
        right: 10px;

    }

    .plyr__poster {
        height: 100vh;
    }

    .container-video {
        height: 100vh;
    }

    .actions {
        height: 100vh!important;
        padding-right: 20px;
    }

    .window-body {
        overflow: scroll!important;
        max-height: calc(100vh - 80px)!important;
    }

    .window table tr:hover td {
        background: transparent;
        color: inherit;
    }

    .alert-message {
        font-size: 16px!important;
    }



    /* Target Chrome on mobile devices in landscape mode */
    body.is-mobile-chrome
    {
        overflow: hidden!important;
        width: calc(100vw)!important;
        height: calc(100vh - 0px)!important;
    }

    body.is-mobile-chrome #main_video {
        width: calc(100vw)!important;
        height: calc(100vh - 0px)!important;
    }

    body.is-mobile-chrome .plyr video {
        width: calc(100vw)!important;
        height: calc(100vh - 0px)!important;

    }

    body.is-mobile-chrome .container-video {
        width: calc(100vw)!important;
        height: calc(100vh - 40px)!important;
    }






    /* Target Safari on mobile devices in landscape mode */
    body.is-mobile-safari {
        overflow: hidden!important;
        width: calc(100vw)!important;
        height: calc(100vh - 60px)!important;
    }

    body.is-mobile-safari #main_video {
        width: calc(100vw)!important;
        height: calc(100vh - 60px)!important;
    }

    body.is-mobile-safari .plyr video {
        width: calc(100vw)!important;
        height: calc(100vh - 60px)!important;

    }

    body.is-mobile-safari .container-video {
        width: calc(100vw)!important;
        height: calc(100vh - 60px)!important;
    }

}