body, html {margin:0;padding:0;}
body {overflow-x: hidden;}

 @media (orientation: portrait) {
.navbar-fixed-top {position: fixed;}}


    a img {filter: brightness(100%);}
    a img:hover {filter: brightness(105%);}
    .container-movie {padding:0px;
    display: flex; align-items: center; justify-content: center;}

    @media (orientation: landscape) {
        .container-movie {height:100vh;}
        .portrait {display:none;}
        .landscape {display:block;}
        img {width:auto;height:100vh;}

}

    @media (orientation: portrait) {
        .portrait {display:block;}
        .landscape {display:none;}
        img {width:100%;height:auto;}


    }
.container-movie {width:100vw;overflow-x: hidden;}

#video-viewport {
    position: absolute;top: 0;overflow: hidden;
    z-index: -1; /* for accessing the video by click */
}

#top {filter: saturate(0.5);
    position:absolute;z-index:99;width:100px;height:70px;top:70px;right:0px;background: url('../pics/audio-on4.png')
     no-repeat left top;background-size: 70px;filter: saturate(0.9);}
#top.off {filter: saturate(0.5);background: url('../pics/audio-off.png')
     no-repeat center top;background-size: 70px;}


/*  @media(max-width:768px) {
#top, #bottom {width: 300px;font-size:40px;}} */

#top:hover {filter: saturate(1);}    
#bottom:hover {color:#eee;}    
#top a,#bottom a {text-decoration:none;color:red;}


video#video-content {width:100%!important;margin:0;}

 .logo { display:none;}

@media (max-width: 1024px) and (orientation: landscape) {
.safedate, footer,.navbar-fixed-top {display:none;}
#top { position:absolute;z-index:99;width:70px;height:60px;top:15px;right:0px;background: url('../pics/audio-on4.png')
     no-repeat left top;background-size: 80%;filter: saturate(0.9);}
#top.off {filter: saturate(0.5);background: url('../pics/audio-off.png')
     no-repeat center top;background-size: 80%;}

video {position:absolute; top:0;}
 
}