@font-face {
    font-family: 'SlimSansSerif';
    font-style: normal;
    font-weight: normal;
    src: local('SlimSansSerif'), url('SlimSansSerif.woff') format('woff');
    }











.sidenav {
  height: 100%;
  width: 0;
  position:fixed;
  z-index: 2;
  top: 0;
  right: 0;
  background-color: rgb(1,2,9,0.89);
  overflow-x: hidden;
  transition: 0.5s;
  padding-top: 100px;
}

.sidenav a {
  padding: 8px 8px 8px 32px;
  text-decoration: none;
  font-size: 16px;
  color: white;
  display: block;
  transition: 0.3s;
    font-family:acumin-pro,arial;
    
}
.sidenav li{
 padding: 8px 8px 8px 32px;
  text-decoration: none;
  font-size: 16px;
  color: white;
  display: block;
  transition: 0.3s;
    font-family:acumin-pro,arial;   
    
}

.Container{
       max-width: 834px;
    min-width: 320px;
        margin: auto;
        
    }


   .videographytitle{
   width: 37%;
    height: auto;
    position: fixed;
    z-index: 1;
    margin-left: 30px;
    margin-top: 15px;
   
}

.titlelastfiring h2{
  text-align: left;
    font-family:slimsansserif,arial;
    font-size: 22px;
    font-weight: 200;
    font-stretch:extra-condensed;
    padding: 0px 10px 0px 30px;
    color:lightgray;
    position:absolute;
    flex-direction: column;
    margin-top: 75px;
    z-index: -3;  
    
    
}

.img-lastfiring{
   width: 95%;
    position: relative;
    padding-top: 110px;
     margin-left: auto;
  margin-right: auto;
    display: flex;
    z-index: -4;
}
.topnav{
    height: 70px;
   width: 100%;
    position: fixed;
    background-color: #030513;
    margin: 0px;
    top:0;
    left: 0;
    display: block;
    z-index:-1;
    opacity: 0.9;
    
      
}

.foo{
    color: rgb(193, 154, 83);
    position:fixed;
    margin-left: 200px;
    margin-top: 10px;
}
.foo img{
    position:fixed;
    width: 28px;
    margin-left: 65px;
    margin-top: 15px;
}
.sidenav a:hover {
  color: #f1f1f1;
}

.sidenav .closebtn {
  position: absolute;
  top: 0;
  right: 25px;
  font-size: 36px;
  margin-left: 50px;
    color:#f7cd46;
}


.about h2{
    text-align: left;
    font-family:slimsansserif,arial;
    font-size: 23px;
    font-weight: 200;
    font-stretch:extra-condensed;
    padding: 10px 10px 0px 30px;
    color:#f7cd46;
    position:relative;
    flex-direction: column;
    margin-top: 20px;
    z-index: -3;
    
}
.synopsisback{
    
    
    width: 100%;
    height: 100%;
    background-color: white;
    position: relative;
   margin-top:6px;
    z-index: -8;
    
}

.textsynopsis{
    width: 100%;
    height: 100%;
       
}
.textsynopsis p{
    text-align: justify;
    font-family:acumin-pro,arial;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    font-stretch: condensed;
    padding: 0px 50px 0px 20px;
color:black;
    opacity: 0.75;
    position:relative;
    margin: 0px;
    z-index: -4;
    height: auto;

    }


.wrapper{
    margin:auto;
    width: 100%;
    margin:35px 0px 0px -130px;
}

.videowrapper{
    
   position: relative;
    padding-bottom: 56.25%;
height: 100%;
    
    width: 100%;
border-bottom: 2px solid #3399cc;
    border-top: 2px solid #3399cc;
    
    border-right: 2px solid #3399cc;
    
    margin-left: 80px;
    
    
    
    }

.videowrapper iframe{
  position: absolute;
    left: 40%;
    right: auto;
    height: 100%;
    width: 120%;
    border: none;
       
}

.infoback{
    
    
    width: 100%;
    height: 100%;
    background-color: white;
    position: relative;
   margin-top:35px;
    z-index: -8;
    
    
}
.textinfo p{
  text-align: justify;
    font-family:acumin-pro,arial;
    
    font-style: normal;
    font-weight: 500;
    font-stretch: condensed;
     padding: 0px 50px 0px 20px;
    
color:black;
    opacity: 0.75;
    position:relative;
    margin: 0px;
    z-index: -4;
  
    
    
    
}

.Copyright h4{
     text-align: left;
    font-family: acumin-pro,arial;
    font-size: 12px;
    color:#f7cd46;
    position:relative;}







@media only screen and (min-device-width: 0px) and (max-width:299px) {

    .Container{display: none}
    
}






@media only screen and (min-device-width: 300px) and (max-device-width:359px) {
    
  .Container{
        max-width: 320px;}
    
    #mySidenav{padding-top: 60px;}
    
    #mySidenav.sidenav a{padding: 6px 8px 8px 32px;font-size: 16px;}
    
    #mySidenav.sidenav li{padding: 13px 8px 8px 32px;font-size: 16px;}
    
    #mySidenav.sidenav span {font-size: 17px;}
    
    #mySidenav.sidenav .closebtn {top: 20px;right: 25px;font-size: 30px;margin-left: 10px;}
    
     .foo img{width: 24px;margin-left: 80px;margin-top: 13px;}
    
     .topnav{
        height: 60px;}
    
    .img-lastfiring{padding-top: 100px;}
    
    .synopsisback p {margin-top: 0px; font-size: 14px;padding: 10px 30px 10px;}
    
    .synopsisback{padding-bottom: 10px;padding-top: 5px;}
    
    .sidenav a {font-size: 14px;}
    
    .wrapper{
    margin:auto;
    width: 100%;
    margin:30px 0px -20px -130px;}

     .videowrapper{height: 190px;width: 215px;margin-top: 30px;}
    
    .videowrapper iframe{left:35%;}

    
    
.videographytitle{width: 34%;margin-left: 30px;margin-top: 18px;}
    
    .titlelastfiring h2{padding: 0px 10px 0px 35px;margin-top: 70px;font-size: 18px;}
    
    .about h2{font-size: 17px;margin-top: 12px;}
    
    .textsynopsis p{padding:5px 10px 0px 15px;font-size: 16px;text-align: justify;word-spacing:-1.5px;}
    
    
    .infoback{padding-bottom: 3px;padding-top: 3px;margin-top:50px;}
    
    .textinfo p{padding:8px 10px 10px 15px;font-size: 16px;text-align: justify;word-spacing:-1.5px;}
    
    .Copyright h4{padding:10px 15px 40px 20px;}
    
    
    
    
     #mySidenav{z-index:8; }



.videographytitle{ z-index: 4;}

.foo{ z-index: 3;}

 .topnav{z-index: 2;}

.videowrapper{z-index: 1;}
    
    
    
    
    
    
    }






@media only screen and (min-device-width: 360px) and (max-device-width:374px) {
    
  .Container{
        max-width: 360px;}
    
    #mySidenav.sidenav a{padding: 10px 10px 8px 52px;font-size: 15px;}
    
    #mySidenav.sidenav .closebtn {top: 0;right: 25px;font-size: 28px;margin-left: 10px;}
    
    #mySidenav.sidenav li{padding: 10px 8px 8px 52px;font-size: 15px;}
    
    #mySidenav.sidenav span {font-size: 15px;}
    
    .foo img{width: 24px;margin-left: 105px;margin-top: 20px;}
    
    .videographytitle{width: 110px;margin-left: 30px;margin-top: 20px;}
    
    .wrapper{
    margin:auto;
    width: 100%;
    margin:30px 0px -20px -130px;}

     .videowrapper{height: 190px;width: 230px;margin-top: 30px;}
    
    .videowrapper iframe{left:35%;}

    
    
    .titlelastfiring h2{padding: 0px 10px 0px 35px;margin-top: 70px;font-size: 19px;}
    
    .about{ width: 100%; height: auto;margin-top: 25px; }
    
    .about h2{padding: 0px 5px 0px 25px;font-size: 16px;font-weight: 200;}
    
   .textinfo p{padding:8px 20px 10px 20px;font-size: 4.5vw;text-align: justify;} 
    
    .textsynopsis p{padding:5px 20px 0px 20px;font-size: 4.5vw;text-align: justify;word-spacing:-1px;}
    
    .synopsisback{padding-bottom: 8px;padding-top: 2px;}
    
    .infoback{margin-top:50px;}
    
    .textinfo p{padding:6px 20px 8px 20px;font-size: 4.5vw;text-align: justify;}
    
    .Copyright h4{padding:10px 15px 70px 20px;}
    
    .img-lastfiring{
   width: 95%;
    position: relative;
        padding-top: 105px;}
        
        
        #mySidenav{z-index:8; }



.videographytitle{ z-index: 4;}

.foo{ z-index: 3;}

 .topnav{z-index: 2;}

.videowrapper{z-index: 1;}
        
    


}









@media only screen and (min-device-width: 375px) and (max-device-width:389px) {
    
  .Container{
        max-width: 375px;}
    
     #mySidenav.sidenav a{padding: 5px 10px 8px 52px;font-size: 4.3vw;}
    
    #mySidenav.sidenav .closebtn {top: 10px;right: 25px;font-size: 30px;margin-left: 10px;}
    
    #mySidenav.sidenav li{padding: 8px 8px 8px 52px;font-size: 4.3vw;}
    
    #mySidenav.sidenav span {font-size: 4.2vw;}
    
 .foo img{width: 27px;margin-left: 125px;margin-top: 18px;}
    
.synopsisback p {margin-top: 0px; font-size: 4.4vw;padding: 10px 30px 25px;}
    
    .synopsisback{padding-bottom: 3px;padding-top: 0px;}
    
    .sidenav a {font-size: 14px;}
    
    
    
    .videographytitle{width: 125px;margin-left: 30px;margin-top: 20px;}
    
   .titlelastfiring h2{font-size: 20px;font-weight: 200;padding: 10px 10px 0px 35px;margin-top: 65px;}
    
    .img-lastfiring{padding-top: 110px;}
    
     .about{ width: 100%; height: auto;margin-top: 25px; }
    
    .about h2{font-size: 4.5vw;padding: 0px 20px 0px 35px; }
    
    .textsynopsis p{padding:3px 18px 3px 18px;font-size: 4.4vw;text-align: justify;word-spacing:0px;}
    
    .wrapper{
    margin:auto;
    width: 100%;
    margin:30px 0px -20px -130px;}

     .videowrapper{height: 210px;width: 230px;margin-top: 30px;}
    
    .videowrapper iframe{left:35%;width: 300px;}
  
    
    .infoback{padding-bottom: 3px;padding-top: 0px;margin-top:50px;}
    
    .textinfo p{padding:3px 18px 5px 18px;font-size: 17px;text-align: justify;word-spacing:0px;}
    
    .Copyright h4{padding:10px 15px 80px 20px;font-size: 12px;}
    
    #mySidenav{z-index:8; }



.videographytitle{ z-index: 4;}

.foo{ z-index: 3;}

 .topnav{z-index: 2;}

.videowrapper{z-index: 1;}


}



@media only screen and (min-device-width: 390px) and (max-device-width:411px) {
    
  .Container{
        max-width: 390px;}
        
     #mySidenav{padding-top: 120px;}
    
    #mySidenav.sidenav a {padding: 15px 10px 8px 62px;font-size: 17px;}
    
    #mySidenav.sidenav .closebtn {top: 0;right: 25px;font-size: 30px;margin-left: 10px;}
    
    #mySidenav.sidenav li {padding: 8px 8px 8px 62px;font-size: 17px;}
    
    #mySidenav.sidenav span {font-size: 17px;}

.foo img{width: 28px;margin-left: 130px;margin-top: 18px;}
    

    
    .synopsisback{padding-bottom: 10px;padding-top: 5px;}
    
    .sidenav a {font-size: 14px;}
    
    .wrapper {width: 100%;} 
    
    .videographytitle{width: 125px;margin-left: 30px;margin-top: 23px;}
    
   .titlelastfiring h2{font-size: 20px;font-weight: 200;padding: 15px 10px 0px 35px;margin-top: 65px;}
    
    .img-lastfiring{padding-top: 115px;}
    
     .about{ width: 100%; height: auto;margin-top: 30px; }
    
    .about h2{padding: 0px 10px 0px 30px;font-size: 18px;font-weight: 200;}
    
    .textsynopsis p{padding:3px 18px 3px 15px;font-size: 18px;text-align: justify;word-spacing:0px;}
    
    
    .infoback{padding-bottom: 0px;padding-top: 0px;}
    
    .textinfo p{padding:8px 18px 10px 15px;font-size: 18px;text-align: justify;word-spacing:0px;}
    
    .Copyright h4{padding:10px 15px 100px 30px;}
    
    .wrapper{
    margin:auto;
    width: 100%;
    margin:30px 0px -5px -130px;}

     .videowrapper{height: 210px;width: 250px;margin-top: 30px;}
    
    .videowrapper iframe{left:35%;width: 300px;}
    
    #mySidenav{z-index:8; }



.videographytitle{ z-index: 4;}

.foo{ z-index: 3;}

 .topnav{z-index: 2;}

.videowrapper{z-index: 1;}
    

}






@media only screen and (min-device-width: 412px) and (max-device-width:427px) {
    
    .Container{
        max-width: 412px;}
    
     #mySidenav.sidenav{padding-top: 100px;}
    
   #mySidenav.sidenav a {padding: 15px 10px 8px 62px;font-size: 4.2vw;}
    
    #mySidenav.sidenav .closebtn {top: 0;right: 25px;font-size: 30px;margin-left: 10px;}
    
    #mySidenav.sidenav li {padding: 8px 8px 8px 62px;font-size: 4.2vw;}
    
    #mySidenav.sidenav span {font-size: 4.2vw;}
    
    .foo img{width: 30px;margin-left: 150px;margin-top: 18px;}

.synopsisback{padding-bottom: 10px;padding-top: 5px;}
    
    .sidenav a {font-size: 14px;}
    
    .wrapper {width: 100%;} 
    
    .videographytitle{width: 130px;margin-left: 30px;margin-top: 23px;}
    
   .titlelastfiring h2{font-size: 20px;font-weight: 200;padding: 10px 10px 0px 35px;margin-top: 75px;}
    
    .img-lastfiring{padding-top: 120px;}
    
     .about{ width: 100%; height: auto;margin-top: 30px; }
    
    .about h2{padding: 0px 10px 0px 30px;font-size: 4.5vw;font-weight: 200;}
    
    .textsynopsis p{padding:3px 18px 3px 15px;font-size: 18px;text-align: justify;word-spacing:0px;}
    
    
    .infoback{padding-bottom: 0px;padding-top: 0px;}
    
    .textinfo p{padding:8px 18px 10px 15px;font-size: 4.5vw;text-align: justify;word-spacing:0px;}
    
    .Copyright h4{padding:10px 15px 100px 30px;font-size:13px;}

.wrapper{
    margin:auto;
    width: 100%;
    margin:30px 0px -5px -130px;}

     .videowrapper{height: 210px;width: 250px;margin-top: 30px;}
    
    .videowrapper iframe{left:35%;width: 320px;}
    
    
    #mySidenav{z-index:8; }



.videographytitle{ z-index: 4;}

.foo{ z-index: 3;}

 .topnav{z-index: 2;}

.videowrapper{z-index: 1;}
    
    

    }





    



@media only screen and (min-device-width: 428px) and (max-device-width:479px) {
    
    .Container{
        max-width: 428px;}
    
    #mySidenav.sidenav{padding-top: 130px;}
    
    #mySidenav.sidenav a{padding: 15px 10px 8px 72px;font-size: 18px;}
    
    #mySidenav.sidenav .closebtn {top: 0;right: 25px;font-size: 30px;margin-left: 10px;}
    
    #mySidenav.sidenav li{padding: 15px 8px 8px 72px;font-size: 18px;}
    
    #mySidenav.sidenav span {font-size: 18px;}

    
    .foo img{width: 29px;margin-left: 175px;margin-top: 20px;}
    
    .topnav{
        height: 70px;}
    
    
    
    
   .synopsisback{padding-bottom: 10px;padding-top: 5px;}
    
    .sidenav a {font-size: 14px;}
    
    .wrapper {width: 100%;} 
    
    .videographytitle{width: 137px;margin-left: 30px;margin-top: 23px;}
    
   .titlelastfiring h2{font-size: 20px;font-weight: 200;padding: 10px 10px 0px 35px;margin-top: 75px;}
    
    .img-lastfiring{padding-top: 125px;}
    
     .about{ width: 100%; height: auto;margin-top: 30px; }
    
    .about h2{padding: 0px 10px 0px 30px;font-size: 19px;font-weight: 200;}
    
    .textsynopsis p{padding:3px 18px 3px 15px;font-size: 18px;text-align: justify;word-spacing:0px;}
    
    
    .infoback{padding-bottom: 0px;padding-top: 0px;}
    
    .textinfo p{padding:8px 18px 10px 15px;font-size: 18px;text-align: justify;word-spacing:0px;}
    
    .Copyright h4{padding:10px 15px 100px 30px;font-size:13px;}

.wrapper{
    margin:auto;
    width: 100%;
    margin:30px 0px -5px -130px;}

     .videowrapper{height: 220px;width: 250px;margin-top: 30px;}
    
    .videowrapper iframe{left:35%;width: 340px;}
    
    
    #mySidenav{z-index:8; }



.videographytitle{ z-index: 4;}

.foo{ z-index: 3;}

 .topnav{z-index: 2;}

.videowrapper{z-index: 1;}
    


    }




@media only screen and (min-device-width: 480px) {
    
    
     .Container{
        max-width: 100%;}
    
 #mySidenav.sidenav a{padding: 15px 10px 8px 72px;font-size: 19px;}
    
    #mySidenav.sidenav .closebtn {top: 0;right: 25px;font-size: 30px;margin-left: 10px;}
    
    #mySidenav.sidenav li{padding: 18px 8px 8px 72px;font-size: 19px;}
    
    #mySidenav.sidenav span {font-size: 19px;}
    
   .foo img{width: 30px;margin-left: 220px;margin-top: 20px;}
    
    
    
.synopsisback p {margin-top: 0px; font-size: 20px;padding: 10px 30px 10px;}
    
    .synopsisback{padding-bottom: 10px;padding-top: 5px;}
    
    .sidenav a {font-size: 14px;}
    
    .videographytitle{width: 135px;margin-left: 35px;margin-top: 20px;}
    
   .titlelastfiring h2{font-size: 22px;font-weight: 200;padding: 15px 10px 0px 40px;margin-top: 65px;}
    
    .img-lastfiring{padding-top: 125px;}
    
    .about h2{font-size: 20px;}
    
    .textsynopsis p{padding:3px 20px 3px 20px;font-size: 20px;text-align: justify;word-spacing:0px;}
    
    .wrapper{
    margin:auto;
    width: 300px;
    margin:30px 0px -5px -130px;}

     .videowrapper{height: 250px;width: 280px;margin-top: 30px;}
    
    .videowrapper iframe{left:35%;width: 360px;}
  
    
    .infoback{padding-bottom: 3px;padding-top: 2px;margin-top: 40px;}
    
    .textinfo p{padding:7px 20px 10px 20px;font-size: 20px;text-align: justify;word-spacing:0px;}
    
    .Copyright h4{padding:10px 35px 90px 40px;font-size:13px;}


#mySidenav{z-index:8; }



.videographytitle{ z-index: 4;}

.foo{ z-index: 3;}

 .topnav{z-index: 2;}

.videowrapper{z-index: 1;}



}
    
    
    
    


/* ----------- iPad Pro 9----------- */
/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 768px)and (max-device-width: 1024px)
  
    
   {
    
    
    
   .Container{
        max-width: 768px;}
    
    
 #mySidenav.sidenav a{padding: 25px 10px 8px 140px;font-size: 16px;}
    
    #mySidenav.sidenav .closebtn {top: 20px;right: 45px;font-size: 30px;margin-left: 10px;}
    
    #mySidenav.sidenav li{padding: 15px 8px 8px 140px;font-size: 16px;}
    
    #mySidenav.sidenav span {font-size: 16px;}
       
       
       #mySidenav.sidenav{
  height: 100%;
        max-width: 100%;
        transition: 1s;padding-top: 170px;
    
    }   
    
    .foo img{width: 25px;margin-left: 500px;margin-top: 20px;}
    
    .topnav{height: 65px;}
    

    
    .videographytitle{width: 125px;margin-left: 45px;margin-top: 20px;}
    
   .titlelastfiring h2{font-size: 20px;font-weight: 200;padding:10px 10px 0px 50px;margin-top: 75px;}
    
    .img-lastfiring{padding-top: 125px;max-width: 80%;}
    
    .about h2{font-size: 17px;margin-top: 20px;font-weight: 200;padding: 10px 10px 0px 35px;}
       
       
    
     .textsynopsis p{padding:8px 35px 10px 35px;font-size: 16px;color: white;}
       
       
    
    .synopsisback{padding-bottom: 10px;padding-top: 5px;background: rgba(114,114,114,0.1)}
    
    .sidenav a {font-size: 14px;}
    
    .videowrapper iframe{ left:30%;}
    
    .videowrapper {height: 200px;margin-left: 125px;width: 350px;}
    
    .videowrapper iframe {padding-top: 0%; width: 135%;}
       .wrapper{width: 75%;}
  
    
    .infoback{padding-bottom: 0px;padding-top: 0px;background: rgba(114,114,114,0.1);margin-top: -150px;}
    
    
    .textinfo p{padding:15px 35px 15px 35px;font-size: 16px;text-align: justify;word-spacing:0px;color: white;}
    
    .textinfo{margin-top: 24%;}
    
    .Copyright h4{padding:15px 35px 60px 40px;font-size: 11px;margin-top: 20px;}
    
    
    #mySidenav{z-index:8; }



.videographytitle{ z-index: 4;}

.foo{ z-index: 3;}

 .topnav{z-index: 2;}

.videowrapper{z-index: 1;}
    
    

}
    
    
    
    
    
    
    
    
 /*Ipad 10*/   
    
    
    

@media only screen and (min-device-width: 810px){
    
    .Container{
        max-width: 810px;}
    
 #mySidenav.sidenav a{padding: 30px 10px 8px 140px;font-size: 16px;transition: 1s;}
    
    #mySidenav.sidenav .closebtn {top: 0;right: 25px;font-size: 30px;margin-left: 10px;}
    
    #mySidenav.sidenav li{padding: 20px 8px 8px 140px;font-size: 16px;transition: 1s;}
    
    #mySidenav.sidenav span {font-size: 17px;transition: 1s;}
    
    #mySidenav.sidenav{
  height: 100%;
        max-width: 100%;
        transition: 1s;padding-top: 200px;
    
    }
    
    .foo img{width: 27px;margin-left: 515px;margin-top: 20px;}
    
    .topnav{height: 80px;}
    

    
    .videographytitle{width: 120px;margin-left: 45px;margin-top: 20px;}
    
   .titlelastfiring h2{font-size: 20px;font-weight: 200;padding:10px 10px 0px 50px;margin-top: 75px;}
    
    .img-lastfiring{padding-top: 125px;max-width: 80%;}
    
    .about h2{font-size: 17px;margin-top: 20px;font-weight: 200;padding-left: 60px;}
    
     .textsynopsis p{padding:8px 35px 10px 58px;font-size: 17px;color: white;}
       
       
    
    .synopsisback{padding-bottom: 10px;padding-top: 5px;background: rgba(114,114,114,0.1)}
    
    .sidenav a {font-size: 14px;}
    
    .videowrapper iframe{ left:50%;}
    
    .videowrapper {height: 170%;margin-left: 0px;width: 500px;}
    
    .videowrapper iframe {padding-top: 0%; width: 100%;}
    
    .wrapper {width: 100px;height: 210px;} 
  
    
    .infoback{padding-bottom: 0px;padding-top: 0px;background: rgba(114,114,114,0.1);margin-top: 190px;}
    
    
    .textinfo p{padding:15px 35px 20px 55px;font-size: 17px;text-align: justify;word-spacing:0px;color: white;}
    
    .textinfo{margin-top: 22%;}
    
    .Copyright h4{padding:10px 35px 60px 40px;font-size: 11px;}
    
    
    #mySidenav{z-index:8; }



.videographytitle{ z-index: 4;}

.foo{ z-index: 3;}

 .topnav{z-index: 2;}

.videowrapper{z-index: 1;}
    
    
    

}
    
    
    
    
    

/* ----------- iPad Pro 11----------- */
/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 834px) 
  and (max-device-height: 1194px) 
  {
    

.Container{
        max-width: 810px;}
    
 #mySidenav.sidenav a{padding: 25px 10px 8px 150px;font-size: 16px;transition: 1s;}
    
    #mySidenav.sidenav .closebtn {top: 0;right: 50px;font-size: 30px;margin-left: 10px;}
    
    #mySidenav.sidenav li{padding: 20px 8px 8px 150px;font-size: 16px;transition: 1s;}
    
    #mySidenav.sidenav span {font-size: 16px;transition: 1s;}
    
    #mySidenav.sidenav{
  height: 100%;
        max-width: 100%;
        transition: 1s;padding-top: 200px;
    
    }
    
    .foo img{width: 25px;margin-left: 535px;margin-top: 25px;}
    
    .topnav{height: 80px;}
    

    
    .videographytitle{width: 130px;margin-left: 45px;margin-top: 25px;}
    
   .titlelastfiring h2{font-size: 20px;font-weight: 200;padding:10px 15px 0px 50px;margin-top: 80px;}
    
    .img-lastfiring{padding-top: 130px;max-width: 80%;}
    
    .about h2{font-size: 16px;margin-top: 20px;font-weight: 200;padding-left: 35px;}
    
     .textsynopsis p{padding:8px 35px 10px 35px;font-size: 16px;color: white;}
       
       
    
    .synopsisback{padding-bottom: 10px;padding-top: 5px;background: rgba(114,114,114,0.1)}
    
    .sidenav a {font-size: 14px;}
    
    .videowrapper iframe{ left:30%;}
    
    .videowrapper {height: 320px;margin-left: 135px;width: 400px;}
    
    .videowrapper iframe {padding-top: 0%; width: 115%;}
      
      .wrapper {width: 150px;height: 195px;}
  
    
    .infoback{padding-bottom: 0px;padding-top: 0px;background: rgba(114,114,114,0.1);margin-top: 120px;}
    
    
    .textinfo p{padding:8px 35px 10px 35px;font-size: 16px;text-align: justify;word-spacing:0px;color: white;}
    
    .textinfo{margin-top: 20%;}
    
    .Copyright h4{padding:10px 35px 60px 40px;font-size: 11px;}
    
    
    #mySidenav{z-index:8; }



.videographytitle{ z-index: 4;}

.foo{ z-index: 3;}

 .topnav{z-index: 2;}

.videowrapper{z-index: 1;}
    
    

}
    
    
  



/*ipad  12*/
@media only screen and (min-device-width: 1366px) and (max-device-width: 1366px)and (orientation:landscape) {


.Container{
        max-width: 1000px;}
    
#mySidenav.sidenav a{padding: 25px 10px 8px 220px;font-size: 16px;transition: 1s;}
    
    #mySidenav.sidenav .closebtn {top: 0;right: 65px;font-size: 27px;}
    
    #mySidenav.sidenav li{padding: 15px 8px 8px 220px;font-size: 16px;transition: 1s;}
    
    #mySidenav.sidenav span {font-size: 16px;transition: 1s;}
    
    #mySidenav.sidenav{
  height: 100%;
        max-width: 100%;
        transition: 1s;padding-top: 160px;
    
    }

    
    .foo img{width: 27px;margin-left: 720px;margin-top: 20px;}
    
.videographytitle{width: 130px;margin-left: 100px;margin-top: 30px;}
    
   .titlelastfiring h2{font-size: 20px;font-weight: 200;padding:10px 15px 0px 100px;margin-top: 90px;}
    
    .img-lastfiring{padding-top: 140px;max-width: 80%;max-height:auto;}
    
    .about h2{font-size: 17px;margin-top: 30px;font-weight: 200;padding: 0px 0px 0px 95px;}
    
     .textsynopsis p{padding:0px 85px 5px 95px;font-size: 17px;color: white;}
       
       
    
    .synopsisback{padding-bottom: 0px;padding-top: 0px;background: transparent;}
    
    .sidenav a {font-size: 14px;}
    
    .wrapper {width: 550px; margin-top: 30px;} 
    
    
      .videowrapper iframe{ left:30%;}
    
    .videowrapper {height: 370px;margin-left: 225px;width: 420px;}
    
    .videowrapper iframe {padding-top: 0%; width: 520px;}
       
    
    .infoback{padding-bottom: 0px;padding-top: 0px;background: transparent;margin-top: 40px;}
    
    
    .textinfo p{padding:170px 85px 10px 95px;font-size: 17px;text-align: justify;word-spacing:0px;color: white;}
    
    .textinfo{margin-top: 0%;}
    
    .Copyright h4{padding:15px 35px 80px 90px;font-size: 12px;}
    
    
    
    #mySidenav{z-index:8; }



.videographytitle{ z-index: 4;}

.foo{ z-index: 3;}

 .topnav{z-index: 2;}

.videowrapper{z-index: 1;}
    
    
    
    
    

}
    






    
    
 
    










    
   





    
 
  







 /*Macbook*/

@media only screen and  (min-height: 1440px) and (max-height: 1440px) and (min-width: 2304px) and (max-width: 2304px) {


.Container{
        max-width: 1100px;}
    
#mySidenav.sidenav a{padding: 35px 10px 8px 32px;font-size: 18px;transition: 1s;}
    
    #mySidenav.sidenav .closebtn {top: 0;right: 85px;font-size: 25px;margin-left: 10px;}
    
    #mySidenav.sidenav li{padding: 18px 8px 8px 32px;font-size: 18px;transition: 1s;}
    
    #mySidenav.sidenav span {font-size: 18px;transition: 1s;}
    
    #mySidenav.sidenav{
  height: 100%;
        max-width: 20%;
        transition: 1s;padding-top: 200px;
    
    }

    
    .foo img{width: 31px;margin-left: 805px;margin-top: 35px;}
      
    
    .videographytitle{width: 150px;margin-left: 35px;margin-top: 30px;}
    
   .titlelastfiring h2{font-size: 22px;font-weight: 200;padding:10px 15px 0px 35px;margin-top: 110px;}
    
    .img-lastfiring{padding-top: 180px;max-width: 78%;}
    
    .about h2{font-size: 20px;margin-top: 20px;font-weight: 200;margin-left: 0px;padding-left: 35px;}
    
     .textsynopsis p{padding:3px 35px 10px 35px;font-size: 20px;color: white;}
       
       
    
    .synopsisback{padding-bottom: 0px;padding-top: 0px;background: transparent;}
    
    .sidenav a {font-size: 14px;}
    
    .wrapper {width: 300px; margin-top: 20px;} 
    
    
      .videowrapper iframe{ left:34%;}
    
    .videowrapper {height: 420px;margin-left: 165px;width: 480px;}
    
    .videowrapper iframe {padding-top: 0%; width: 570px;}
       
    
    .infoback{padding-bottom: 0px;padding-top: 0px;background: transparent;margin-top: 40px;}
    
    
    .textinfo p{padding:210px 35px 10px 35px;font-size: 20px;text-align: justify;word-spacing:0px;color: white;}
    
    .textinfo{margin-top: 0%;}
    
    .Copyright h4{padding:15px 35px 80px 35px;font-size: 14px;}
    
    
    
    #mySidenav{z-index:8; }



.videographytitle{ z-index: 4;}

.foo{ z-index: 3;}

 .topnav{z-index: 2;}

.videowrapper{z-index: 1;}
    
    
    
    
    

}
    






 @media only screen and (min-device-width: 2305px) 
   {
 




.Container{
        max-width: 900px;}
    
#mySidenav.sidenav a{padding: 25px 10px 8px 32px;font-size: 14px;transition: 1s;}
    
    #mySidenav.sidenav .closebtn {top: 0;right: 25px;font-size: 25px;margin-left: 10px;}
    
    #mySidenav.sidenav li{padding: 15px 8px 8px 32px;font-size: 14px;transition: 1s;}
    
    #mySidenav.sidenav span {font-size: 14px;transition: 1s;}
    
    #mySidenav.sidenav{
  height: 100%;
        max-width: 20%;
        transition: 1s;padding-top: 200px;
    
    }
    
    .foo img{width: 24px;margin-left: 625px;margin-top: 20px;}
        
       .videographytitle{width: 110px;margin-left: 35px;margin-top: 30px;}
    
   .titlelastfiring h2{font-size: 17px;font-weight: 200;padding:10px 15px 0px 38px;margin-top: 90px;}
    
    .img-lastfiring{padding-top: 140px;max-width: 78%;max-height: 60%;}
    
    .about h2{font-size: 15.5px;margin-top: 30px;font-weight: 200;padding: 0px 0px 0px 60px;}
    
     .textsynopsis p{padding:0px 60px 10px 60px;font-size: 15px;color: white;}
       
       
    
    .synopsisback{padding-bottom: 0px;padding-top: 0px;background: transparent;}
    
    .sidenav a {font-size: 14px;}
    
    .videowrapper iframe{ left:30%;}
    
    .videowrapper {height: 340px;margin-left: 190px;width: 370px;}
    
    .videowrapper iframe {padding-top: 0%; width: 130%;height: 340px;}
    
    .wrapper {width: 230px;height: 250px;margin-top: 20px;}  
    
    .infoback{padding-bottom: 0px;padding-top: 0px;background: transparent;margin-top: 23px;}
    
    
    .textinfo p{padding:110px 58px 10px 58px;font-size: 14px;text-align: justify;word-spacing:0px;color: white;}
    
    .textinfo{margin-top: 0%;}
    
    .Copyright h4{padding:15px 35px 80px 58px;font-size: 10px;}
    
    
    
    
    #mySidenav{z-index:8; }



.videographytitle{ z-index: 4;}

.foo{ z-index: 3;}

 .topnav{z-index: 2;}

.videowrapper{z-index: 1;}
    
    
    
    

} 







@media only screen and (min-width: 1440px) and (max-width: 2303px)
   {
 




.Container{
        max-width: 900px;}
    
#mySidenav.sidenav a{padding: 25px 10px 8px 32px;font-size: 14px;transition: 1s;}
    
    #mySidenav.sidenav .closebtn {top: 0;right: 25px;font-size: 25px;margin-left: 10px;}
    
    #mySidenav.sidenav li{padding: 15px 8px 8px 32px;font-size: 14px;transition: 1s;}
    
    #mySidenav.sidenav span {font-size: 14px;transition: 1s;}
    
    #mySidenav.sidenav{
  height: 100%;
        max-width: 20%;
        transition: 1s;padding-top: 200px;
    
    }
    
    .foo img{width: 24px;margin-left: 625px;margin-top: 20px;}
        
       .videographytitle{width: 110px;margin-left: 35px;margin-top: 30px;}
    
   .titlelastfiring h2{font-size: 17px;font-weight: 200;padding:10px 15px 0px 38px;margin-top: 90px;}
    
    .img-lastfiring{padding-top: 140px;max-width: 78%;max-height: 60%;}
    
    .about h2{font-size: 15.5px;margin-top: 30px;font-weight: 200;padding: 0px 0px 0px 60px;}
    
     .textsynopsis p{padding:0px 60px 10px 60px;font-size: 15px;color: white;}
       
       
    
    .synopsisback{padding-bottom: 0px;padding-top: 0px;background: transparent;}
    
    .sidenav a {font-size: 14px;}
    
    .videowrapper iframe{ left:30%;}
    
    .videowrapper {height: 340px;margin-left: 190px;width: 370px;}
    
    .videowrapper iframe {padding-top: 0%; width: 130%;height: 340px;}
    
    .wrapper {width: 230px;height: 250px;margin-top: 20px;}  
    
    .infoback{padding-bottom: 0px;padding-top: 0px;background: transparent;margin-top: 23px;}
    
    
    .textinfo p{padding:110px 58px 10px 58px;font-size: 14px;text-align: justify;word-spacing:0px;color: white;}
    
    .textinfo{margin-top: 0%;}
    
    .Copyright h4{padding:15px 35px 80px 58px;font-size: 10px;}




#mySidenav{z-index:8; }



.videographytitle{ z-index: 4;}

.foo{ z-index: 3;}

 .topnav{z-index: 2;}

.videowrapper{z-index: 1;}






} 
 
    









    
 /* ----------- Desktop MDPI ----------- */
/* Portrait and Landscape */
@media only screen 
  and (min-width: 1440px) and (max-width:1440px)
  and (min-height: 900px) and (max-height:900px)  {
 


.Container{
        max-width: 600px;}
    
#mySidenav.sidenav a{padding: 25px 10px 8px 300px;font-size: 12px;transition: 1s;}
    
    #mySidenav.sidenav .closebtn {top: 0;right: 100px;font-size: 22px;margin-left: 10px;}
    
    #mySidenav.sidenav li{padding: 15px 8px 8px 300px;font-size: 12px;transition: 1s;}
    
    #mySidenav.sidenav span {font-size: 12px;transition: 1s;}
    
    #mySidenav.sidenav{
  height: 100%;
        max-width: 100%;
        transition: 1s;padding-top: 150px;
    
    }

    
    .foo img{width: 18px;margin-left: 350px;margin-top: 15px;}  
      
    .topnav{height: 50px;}
    
    .videographytitle{width: 90px;margin-left: 35px;margin-top: 18px;}
    
   .titlelastfiring h2{font-size: 14px;font-weight: 200;padding:10px 15px 0px 35px;margin-top: 60px;}
    
    .img-lastfiring{padding-top: 100px;max-width: 90%;}
    
    .about h2{font-size: 12px;margin-top: 20px;font-weight: 200;padding-left:30px;}
    
     .textsynopsis p{padding:0px 35px 0px 30px;font-size: 12px;color: white;}
       
       
    
    .synopsisback{padding-bottom: 0px;padding-top: 0px;background: transparent;}
    
    .sidenav a {font-size: 14px;}
    
    .wrapper {width: 400px; margin-top: 20px;height: 250px;} 
    
    
       .videowrapper iframe{ left:40%;}
    
    .videowrapper {height: 240px;margin-left: 160px;width: 280px;}
    
    .videowrapper iframe {height: 235px; width: 340px;}
       
    
    .infoback{padding-bottom: 0px;padding-top: 0px;background: transparent;margin-top: 23px;}
    
    
    .textinfo p{padding:0px 35px 10px 30px;font-size: 12px;text-align: justify;word-spacing:0px;color: white;}
    
    .textinfo{margin-top: 0%;}
    
    .Copyright h4{padding:5px 35px 80px 30px;font-size: 8px;}


#mySidenav{z-index:8; }



.videographytitle{ z-index: 4;}

.foo{ z-index: 3;}

 .topnav{z-index: 2;}

.videowrapper{z-index: 1;}






}
    
    
    
 
    
    
    
   

    

    
    

@media only screen and (min-device-width: 1367px) and (max-width: 1439px)
   {
 




.Container{
        max-width: 900px;}
    
#mySidenav.sidenav a{padding: 20px 10px 8px 220px;font-size: 14px;transition: 1s;}
    
    #mySidenav.sidenav .closebtn {top: 0;right: 25px;font-size: 25px;margin-left: 10px;}
    
    #mySidenav.sidenav li{padding: 15px 8px 8px 220px;font-size: 14px;transition: 1s;}
    
    #mySidenav.sidenav span {font-size: 14px;transition: 1s;}
    
    #mySidenav.sidenav{
  height: 100%;
        max-width: 100%;
        transition: 1s;padding-top: 200px;
    
    }
    
    .foo img{width: 24px;margin-left: 625px;margin-top: 20px;}
        
       .videographytitle{width: 110px;margin-left: 35px;margin-top: 30px;}
    
   .titlelastfiring h2{font-size: 17px;font-weight: 200;padding:10px 15px 0px 38px;margin-top: 90px;}
    
    .img-lastfiring{padding-top: 140px;max-width: 78%;max-height: 60%;}
    
    .about h2{font-size: 15.5px;margin-top: 30px;font-weight: 200;padding: 0px 0px 0px 60px;}
    
     .textsynopsis p{padding:0px 60px 10px 60px;font-size: 15px;color: white;}
       
       
    
    .synopsisback{padding-bottom: 0px;padding-top: 0px;background: transparent;}
    
    .sidenav a {font-size: 14px;}
    
    .videowrapper iframe{ left:30%;}
    
    .videowrapper {height: 340px;margin-left: 190px;width: 370px;}
    
    .videowrapper iframe {padding-top: 0%; width: 130%;height: 340px;}
    
    .wrapper {width: 230px;height: 250px;margin-top: 20px;}  
    
    .infoback{padding-bottom: 0px;padding-top: 0px;background: transparent;margin-top: 23px;}
    
    
    .textinfo p{padding:110px 58px 10px 58px;font-size: 14px;text-align: justify;word-spacing:0px;color: white;}
    
    .textinfo{margin-top: 0%;}
    
    .Copyright h4{padding:15px 35px 80px 58px;font-size: 10px;}
    
    
    
    
    #mySidenav{z-index:8; }



.videographytitle{ z-index: 4;}

.foo{ z-index: 3;}

 .topnav{z-index: 2;}

.videowrapper{z-index: 1;}
    
    
    

} 
    
 
 
















/* ----------- Desktop HIDPI ----------- */

@media only screen and (min-device-width: 1920px) and (max-device-height: 1080px)
   {
 




.Container{
        max-width: 900px;}
    
#mySidenav.sidenav a{padding: 20px 10px 8px 32px;font-size: 14px;transition: 1s;}
    
    #mySidenav.sidenav .closebtn {top: 0;right: 100px;font-size: 25px;margin-left: 10px;}
    
    #mySidenav.sidenav li{padding: 15px 8px 8px 32px;font-size: 14px;transition: 1s;}
    
    #mySidenav.sidenav span {font-size: 15px;transition: 1s;}
    
    #mySidenav.sidenav{
  height: 100%;
        max-width: 20%;
        transition: 1s;padding-top: 200px;
    
    }
    
    .foo img{width: 24px;margin-left: 625px;margin-top: 20px;}
        
       .videographytitle{width: 120px;margin-left: 35px;margin-top: 30px;}
    
   .titlelastfiring h2{font-size: 17px;font-weight: 200;padding:0px 15px 0px 38px;margin-top: 90px;}
    
    .img-lastfiring{padding-top: 130px;max-width: 78%;max-height: 60%;}
    
    .about h2{font-size: 15.5px;margin-top: 25px;font-weight: 200;padding: 0px 0px 0px 60px;}
    
     .textsynopsis p{padding:0px 60px 10px 60px;font-size: 15px;color: white;}
       
       
    
    .synopsisback{padding-bottom: 0px;padding-top: 0px;background: transparent;}
    
    .sidenav a {font-size: 14px;}
    
    .videowrapper iframe{ left:35%;}
    
    .videowrapper {height: 335px;margin-left: 190px;width: 380px;}
    
    .videowrapper iframe {padding-top: 0%; width: 450px;height: 335px;}
    
    .wrapper {width: 210px;height: 250px;margin-top: -10px;}  
       
    
    .infoback{padding-bottom: 0px;padding-top: 0px;background: transparent;margin-top: -25px;}
    
    
    .textinfo p{padding:140px 60px 10px 60px;font-size: 15px;text-align: justify;word-spacing:0px;color: white;}
    
    .textinfo{margin-top: 0%;}
    
    .Copyright h4{padding:15px 35px 80px 60px;font-size: 10px;}
    
    
    
    
    #mySidenav{z-index:8; }



.videographytitle{ z-index: 4;}

.foo{ z-index: 3;}

 .topnav{z-index: 2;}

.videowrapper{z-index: 1;}
    
    
    

} 
    












 
    
 @media only screen and (min-device-width: 1281px)and (max-width:1365px){


.Container{
        max-width: 900px;}
    
#mySidenav.sidenav a{padding: 20px 10px 8px 220px;font-size: 14px;transition: 1s;}
    
    #mySidenav.sidenav .closebtn {top: 0;right: 25px;font-size: 25px;margin-left: 10px;}
    
    #mySidenav.sidenav li{padding: 15px 8px 8px 220px;font-size: 14px;transition: 1s;}
    
    #mySidenav.sidenav span {font-size: 14px;transition: 1s;}
    
    #mySidenav.sidenav{
  height: 100%;
        max-width: 100%;
        transition: 1s;padding-top: 200px;
    
    }

    
    .foo img{width: 24px;margin-left: 625px;margin-top: 20px;}
        
       .videographytitle{width: 110px;margin-left: 35px;margin-top: 30px;}
    
   .titlelastfiring h2{font-size: 17px;font-weight: 200;padding:10px 15px 0px 38px;margin-top: 90px;}
    
    .img-lastfiring{padding-top: 140px;max-width: 78%;max-height: 60%;}
    
    .about h2{font-size: 15.5px;margin-top: 30px;font-weight: 200;padding: 0px 0px 0px 60px;}
    
     .textsynopsis p{padding:0px 60px 10px 60px;font-size: 15px;color: white;}
       
       
    
    .synopsisback{padding-bottom: 0px;padding-top: 0px;background: transparent;}
    
    .sidenav a {font-size: 14px;}
    
    .videowrapper iframe{ left:30%;}
    
    .videowrapper {height: 340px;margin-left: 190px;width: 370px;}
    
    .videowrapper iframe {padding-top: 0%; width: 130%;height: 340px;}
    
    .wrapper {width: 230px;height: 250px;margin-top: 20px;}  
    
    .infoback{padding-bottom: 0px;padding-top: 0px;background: transparent;margin-top: 23px;}
    
    
    .textinfo p{padding:110px 58px 10px 58px;font-size: 14px;text-align: justify;word-spacing:0px;color: white;}
    
    .textinfo{margin-top: 0%;}
    
    .Copyright h4{padding:15px 35px 80px 58px;font-size: 10px;}
    
    
    
    #mySidenav{z-index:8; }



.videographytitle{ z-index: 4;}

.foo{ z-index: 3;}

 .topnav{z-index: 2;}

.videowrapper{z-index: 1;}
    
    
    
    
    

} 
    
 



    
    
    
@media only screen and (min-device-width: 1201px)and (max-width:1279px){
    
    
    
 .Container{
        max-width: 900px;}
    
#mySidenav.sidenav a{padding: 20px 10px 8px 220px;font-size: 14px;transition: 1s;}
    
    #mySidenav.sidenav .closebtn {top: 0;right: 25px;font-size: 25px;margin-left: 10px;}
    
    #mySidenav.sidenav li{padding: 15px 8px 8px 220px;font-size: 14px;transition: 1s;}
    
    #mySidenav.sidenav span {font-size: 14px;transition: 1s;}
    
    #mySidenav.sidenav{
  height: 100%;
        max-width: 100%;
        transition: 1s;padding-top: 200px;
    
    }

    
    .foo img{width: 24px;margin-left: 625px;margin-top: 20px;}
        
       .videographytitle{width: 110px;margin-left: 35px;margin-top: 30px;}
    
   .titlelastfiring h2{font-size: 17px;font-weight: 200;padding:10px 15px 0px 38px;margin-top: 90px;}
    
    .img-lastfiring{padding-top: 140px;max-width: 78%;max-height: 60%;}
    
    .about h2{font-size: 15.5px;margin-top: 30px;font-weight: 200;padding: 0px 0px 0px 60px;}
    
     .textsynopsis p{padding:0px 60px 10px 60px;font-size: 15px;color: white;}
       
       
    
    .synopsisback{padding-bottom: 0px;padding-top: 0px;background: transparent;}
    
    .sidenav a {font-size: 14px;}
    
    .videowrapper iframe{ left:30%;}
    
    .videowrapper {height: 340px;margin-left: 190px;width: 370px;}
    
    .videowrapper iframe {padding-top: 0%; width: 130%;height: 340px;}
    
    .wrapper {width: 230px;height: 250px;margin-top: 20px;}  
    
    .infoback{padding-bottom: 0px;padding-top: 0px;background: transparent;margin-top: 23px;}
    
    
    .textinfo p{padding:110px 58px 10px 58px;font-size: 14px;text-align: justify;word-spacing:0px;color: white;}
    
    .textinfo{margin-top: 0%;}
    
    .Copyright h4{padding:15px 35px 80px 58px;font-size: 10px;}
    
    
    #mySidenav{z-index:8; }



.videographytitle{ z-index: 4;}

.foo{ z-index: 3;}

 .topnav{z-index: 2;}

.videowrapper{z-index: 1;}
    
    
    
    
    

} 
 
 
    
    
    
    
@media only screen and (min-device-width: 1024px)and (max-width:1200px) {

.Container{
        max-width: 900px;}
    
#mySidenav.sidenav a{padding: 20px 10px 8px 220px;font-size: 14px;transition: 1s;}
    
    #mySidenav.sidenav .closebtn {top: 0;right: 25px;font-size: 25px;margin-left: 10px;}
    
    #mySidenav.sidenav li{padding: 15px 8px 8px 220px;font-size: 14px;transition: 1s;}
    
    #mySidenav.sidenav span {font-size: 14px;transition: 1s;}
    
    #mySidenav.sidenav{
  height: 100%;
        max-width: 100%;
        transition: 1s;padding-top: 200px;
    
    }

    
    .foo img{width: 24px;margin-left: 625px;margin-top: 20px;}
        
       .videographytitle{width: 110px;margin-left: 35px;margin-top: 30px;}
    
   .titlelastfiring h2{font-size: 17px;font-weight: 200;padding:10px 15px 0px 38px;margin-top: 90px;}
    
    .img-lastfiring{padding-top: 140px;max-width: 78%;max-height: 60%;}
    
    .about h2{font-size: 15.5px;margin-top: 30px;font-weight: 200;padding: 0px 0px 0px 60px;}
    
     .textsynopsis p{padding:0px 60px 10px 60px;font-size: 15px;color: white;}
       
       
    
    .synopsisback{padding-bottom: 0px;padding-top: 0px;background: transparent;}
    
    .sidenav a {font-size: 14px;}
    
    .videowrapper iframe{ left:30%;}
    
    .videowrapper {height: 320px;margin-left: 190px;width: 340px;}
    
    .videowrapper iframe {padding-top: 0%; width: 135%;height: 320px;}
    
    .wrapper {width: 230px;height: 250px;margin-top: 20px;}  
    
    .infoback{padding-bottom: 0px;padding-top: 0px;background: transparent;margin-top: 23px;}
    
    
    .textinfo p{padding:90px 58px 10px 58px;font-size: 14px;text-align: justify;word-spacing:0px;color: white;}
    
    .textinfo{margin-top: 0%;}
    
    .Copyright h4{padding:15px 35px 80px 58px;font-size: 10px;}
    
    
    
    #mySidenav{z-index:8; }



.videographytitle{ z-index: 4;}

.foo{ z-index: 3;}

 .topnav{z-index: 2;}

.videowrapper{z-index: 1;}
    
    
    

} 
 
 
  







/*ipad 11 */
@media only screen and (min-device-width: 1113px) and (max-device-width:1365px)and (orientation:landscape) {


.Container{
        max-width: 1000px;}
    
#mySidenav.sidenav a{padding: 25px 10px 8px 220px;font-size: 16px;transition: 1s;}
    
    #mySidenav.sidenav .closebtn {top: 0;right: 65px;font-size: 27px;}
    
    #mySidenav.sidenav li{padding: 15px 8px 8px 220px;font-size: 16px;transition: 1s;}
    
    #mySidenav.sidenav span {font-size: 16px;transition: 1s;}
    
    #mySidenav.sidenav{
  height: 100%;
        max-width: 100%;
        transition: 1s;padding-top: 80px;
    
    }

    
    .foo img{width: 27px;margin-left: 720px;margin-top: 20px;}


.videographytitle{width: 125px;margin-left: 95px;margin-top: 30px;}
    
   .titlelastfiring h2{font-size: 19.5px;font-weight: 200;padding:10px 15px 0px 100px;margin-top: 90px;}
    
    .img-lastfiring{padding-top: 140px;max-width: 80%;max-height:auto;}
    
    .about h2{font-size: 17px;margin-top: 30px;font-weight: 200;padding: 0px 0px 10px 95px;}
    
     .textsynopsis p{padding:0px 85px 10px 95px;font-size: 17px;color: white;}
       
       
    
    .synopsisback{padding-bottom: 0px;padding-top: 0px;background: transparent;}
    
    .sidenav a {font-size: 14px;}
    
     .wrapper {width: 400px; margin-top: 30px;height: 250px;} 
    
    
      .videowrapper iframe{ left:33%;}
    
    .videowrapper {height: 350px;margin-left: 220px;width: 400px;}
    
    .videowrapper iframe {padding-top: 0%; width: 490px;}
    
       
    
    .infoback{padding-bottom: 0px;padding-top: 0px;background: transparent;margin-top: 142px;}
    
    
    .textinfo p{padding:0px 85px 10px 90px;font-size: 17px;text-align: justify;word-spacing:0px;color: white;}
    
    .textinfo{margin-top: 0%;}
    
    .Copyright h4{padding:15px 35px 80px 95px;font-size: 12px;}
    
    
    #mySidenav{z-index:8; }



.videographytitle{ z-index: 4;}

.foo{ z-index: 3;}

 .topnav{z-index: 2;}

.videowrapper{z-index: 1;}
    
    
    

}
    













 /*Laptop-Small size*/


@media only screen and (min-device-width: 1280px)and (max-device-height:800px){


.Container{
        max-width: 600px;}
    
#mySidenav.sidenav a{padding: 20px 10px 8px 32px;font-size: 10px;transition: 1s;}
    
    #mySidenav.sidenav .closebtn {top: 0;right: 50px;font-size: 15px;margin-left: 10px;}
    
    #mySidenav.sidenav li{padding: 10px 8px 8px 32px;font-size: 10px;transition: 1s;}
    
    #mySidenav.sidenav span {font-size: 10px;transition: 1s;}
    
    #mySidenav.sidenav{
  height: 100%;
        max-width: 20%;
        transition: 1s;padding-top: 100px;
    
    }
    .topnav{height: 60px;}
    
    .foo img{width: 18px;margin-left: 350px;margin-top: 20px;}
    
    
     .videographytitle{width: 85px;margin-left: 30px;margin-top: 25px;}
    
   .titlelastfiring h2{font-size: 13px;font-weight: 200;padding:10px 15px 0px 35px;margin-top: 70px;}
    
    .img-lastfiring{padding-top: 110px;max-width: 90%;}
    
    .about h2{font-size: 10px;margin-top: 20px;font-weight: 200;padding: 0px 0px 5px 35px;}
    
     .textsynopsis p{padding:0px 35px 0px 35px;font-size: 11px;color: white;}
       
       
    
    .synopsisback{padding-bottom: 0px;padding-top: 0px;background: transparent;}
    
    .sidenav a {font-size: 14px;}
    
    .videowrapper iframe{ left:30%;}
    
    .videowrapper {height: 230px;margin-left: 165px;width: 260px;}
    
    .videowrapper iframe {padding-top: 0%; width: 330px;height: 227px;}
    
     .wrapper {width: 370px;height: 260px;margin-top: -10px;} 
       
    
    .infoback{padding-bottom: 0px;padding-top: 0px;background: transparent;margin-top:-30px;}
    
    
    .textinfo p{padding:20px 35px 10px 35px;font-size: 11px;text-align: justify;word-spacing:0px;color: white;}
    
    .textinfo{margin-top: 0%;}
    
    .Copyright h4{padding:0px 35px 80px 35px;font-size: 7px;}
    
    
    
    #mySidenav{z-index:8; }



.videographytitle{ z-index: 4;}

.foo{ z-index: 3;}

 .topnav{z-index: 2;}

.videowrapper{z-index: 1;}
    
    
    

}
    






/*Laptop-Medium size*/


@media only screen and (min-device-width: 1366px)and (max-device-height:768px){


.Container{
        max-width: 600px;}
    
#mySidenav.sidenav a{padding: 20px 10px 8px 32px;font-size: 10px;transition: 1s;}
    
    #mySidenav.sidenav .closebtn {top: 0;right: 50px;font-size: 15px;margin-left: 10px;}
    
    #mySidenav.sidenav li{padding: 10px 8px 8px 32px;font-size: 10px;transition: 1s;}
    
    #mySidenav.sidenav span {font-size: 10px;transition: 1s;}
    
    #mySidenav.sidenav{
  height: 100%;
        max-width: 20%;
        transition: 1s;padding-top: 100px;
    
    }
    .topnav{height: 40px;}
    
    .foo img{width: 18px;margin-left: 350px;margin-top: 5px;}
       
    
.videographytitle{width: 80px;margin-left: 35px;margin-top: 10px;}
    
   .titlelastfiring h2{font-size: 12px;font-weight: 200;padding:10px 15px 0px 35px;margin-top: 50px;}
    
    .img-lastfiring{padding-top: 90px;max-width: 90%;}
    
    .about h2{font-size: 10px;margin-top: 25px;font-weight: 200;padding-left: 35px;}
    
     .textsynopsis p{padding:0px 35px 0px 35px;font-size: 11px;color: white;}
       
       
    
    .synopsisback{padding-bottom: 0px;padding-top: 0px;background: transparent;}
    
    .sidenav a {font-size: 14px;}
    
    .videowrapper iframe{ left:30%;}
    
    .videowrapper {height: 230px;margin-left: 165px;width: 260px;}
    
    .videowrapper iframe {padding-top: 0%; width: 330px;height: 227px;}
    
     .wrapper {width: 370px;height: 260px;margin-top: -10px;} 
       
    
    .infoback{padding-bottom: 0px;padding-top: 0px;background: transparent;margin-top: -10px;}
    
    
    .textinfo p{padding:0px 35px 10px 35px;font-size: 11px;text-align: justify;word-spacing:0px;color: white;}
    
    .textinfo{margin-top: 0%;}
    
    .Copyright h4{padding:5px 35px 80px 35px;font-size: 7px;}
    
    
    
    #mySidenav{z-index:8; }



.videographytitle{ z-index: 4;}

.foo{ z-index: 3;}

 .topnav{z-index: 2;}

.videowrapper{z-index: 1;}
    
    
    
    
    

}
    








 


 /* ----------- iPad 12 Pro ----------- */
/* Portrait  */
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px)and (min-device-height: 1366px) and (max-device-height: 1366px) and (orientation:portrait) {
   
    

.Container{
        max-width: 900px;}
    
#mySidenav.sidenav a{padding: 25px 10px 8px 180px;font-size: 17px;transition: 1s;}
    
    #mySidenav.sidenav .closebtn {top: 80px;right: 100px;font-size: 25px;margin-left: 30px;}
    
    #mySidenav.sidenav li{padding: 15px 8px 8px 180px;font-size: 17px;transition: 1s;}
    
    #mySidenav.sidenav span {font-size: 17px;transition: 1s;}
    
    #mySidenav.sidenav{
  height: 100%;
        max-width: 100%;
        transition: 1s;padding-top: 300px;
    
    }

    
    .foo img{width: 27px;margin-left: 625px;margin-top: 25px;}
    
    
     .videographytitle{width: 130px;margin-left: 45px;margin-top: 25px;}
    
   .titlelastfiring h2{font-size: 21px;font-weight: 200;padding:10px 15px 0px 50px;margin-top: 80px;}
    
    .img-lastfiring{padding-top: 135px;max-width: 80%;}
    
    .about h2{font-size: 17px;margin-top: 35px;font-weight: 200;padding-left: 50px;}
    
     .textsynopsis p{padding:0px 50px 10px 50px;font-size: 17px;color: white;}
       
       
    
    .synopsisback{padding-bottom: 0px;padding-top: 5px;background: transparent;}
    
    .sidenav a {font-size: 14px;}
    
   .videowrapper iframe{ left:37%;}
    
    .videowrapper {height: 350px;margin-left: 180px;width: 390px;}
    
    .videowrapper iframe {padding-top: 0%; width: 500px;height: 345px;}
    
    .wrapper {width: 160px; height: 180px;margin-top: -10px;}  
       
    
    .infoback{padding-bottom: 0px;padding-top: 0px;background: transparent;}
    
    
    .textinfo p{padding:8px 50px 10px 50px;font-size: 16px;text-align: justify;word-spacing:0px;color: white;}
    
    .textinfo{margin-top: 22%;}
    
    .Copyright h4{padding:15px 35px 80px 50px;font-size: 12px;}
    
    
    #mySidenav{z-index:8; }



.videographytitle{ z-index: 4;}

.foo{ z-index: 3;}

 .topnav{z-index: 2;}

.videowrapper{z-index: 1;}
    
    
    
    
    

}
    



/*ipad 9*/
@media only screen and (min-device-width: 936px) and (max-device-width:1024px)and (orientation:landscape) {

    .Container{max-width:800px;}
    
    
   #mySidenav.sidenav{
  height: 100%;
        max-width: 100%;
        transition: 1s;padding-top: 130px;padding-bottom: 60px;
    
    } 
    
#mySidenav.sidenav a{padding: 17px 10px 8px 140px;font-size: 16px;}
    
    #mySidenav.sidenav .closebtn {top: 0;right: 45px;font-size: 30px;margin-left: 10px;}
    
    #mySidenav.sidenav li{padding: 15px 8px 8px 140px;font-size: 16px;}
    
    #mySidenav.sidenav span {font-size: 16px;}
    
    .foo img{width: 27px;margin-left: 530px;margin-top: 22px;}
    
    .topnav{height: 75px;}
    
    
.videographytitle{width: 125px;margin-left: 50px;margin-top: 25px;}
    
   .titlelastfiring h2{font-size: 20px;font-weight: 200;padding:0px 15px 0px 53px;margin-top: 95px;}
    
    .img-lastfiring{padding-top: 140px;max-width: 90%;max-height: 60%;}
    
    .about h2{font-size: 17px;margin-top: 30px;font-weight: 200;padding: 0px 10px 0px 50px;}
    
    .textsynopsis{padding:0px 0px 0px 0px;text-align:justify-all;word-spacing:-1px;}
    
     .textsynopsis p{padding:5px 20px 0px 20px;font-size: 17px;color: white;word-spacing: -1px;}
       
       
    
    .synopsisback{background: transparent;padding:0px 30px 0px 30px;}
    
    .sidenav a {font-size: 14px;}
    
    
    
    
     .wrapper {width: 150px; margin-top: 30px;height: 207px;} 
    
    
      .videowrapper iframe{ left:30%;}
    
    .videowrapper {height: 350px;margin-left: 175px;width: 350px;}
    
    .videowrapper iframe {padding-top: 0%; width: 480px;}
    
       
    
    .infoback{padding: 0px 30px 0px 30px;background: transparent;margin-top: 0px;}
    
    
    .textinfo p{padding:0px 20px 20px 15px;font-size: 17px;color: white;word-spacing: -1px;}
    
    .textinfo{padding:5px 0px 0px 0px;text-align:justify-all;word-spacing:-1px;margin-top: 170px;}
    
    .Copyright h4{padding:0px 35px 100px 45px;font-size: 12px;}
    
    
    
    #mySidenav{z-index:8; }



.videographytitle{ z-index: 4;}

.foo{ z-index: 3;}

 .topnav{z-index: 2;}

.videowrapper{z-index: 1;}
    
    
    
    
    

} 







    @media only screen and (min-device-width: 900px)and (max-width:1023px){

.Container{
        max-width: 900px;}
    
#mySidenav.sidenav a{padding: 20px 10px 8px 140px;font-size: 14px;transition: 1s;}
    
    #mySidenav.sidenav .closebtn {top: 0;right: 25px;font-size: 25px;margin-left: 10px;}
    
    #mySidenav.sidenav li{padding: 15px 8px 8px 140px;font-size: 14px;transition: 1s;}
    
    #mySidenav.sidenav span {font-size: 14px;transition: 1s;}
    
    #mySidenav.sidenav{
  height: 100%;
        max-width: 100%;
        transition: 1s;padding-top: 200px;
    
    }

    
    .foo img{width: 24px;margin-left: 625px;margin-top: 20px;}
        
       .videographytitle{width: 110px;margin-left: 35px;margin-top: 30px;}
    
   .titlelastfiring h2{font-size: 17px;font-weight: 200;padding:10px 15px 0px 38px;margin-top: 90px;}
    
    .img-lastfiring{padding-top: 140px;max-width: 78%;max-height: 60%;}
    
    .about h2{font-size: 14px;margin-top: 30px;font-weight: 200;padding: 0px 0px 0px 60px;}
    
     .textsynopsis p{padding:0px 60px 10px 60px;font-size: 15px;color: white;}
       
       
    
    .synopsisback{padding-bottom: 0px;padding-top: 0px;background: transparent;}
    
    .sidenav a {font-size: 14px;}
    
    .videowrapper iframe{ left:30%;}
    
    .videowrapper {height: 320px;margin-left: 190px;width: 340px;}
    
    .videowrapper iframe {padding-top: 0%; width: 135%;height: 320px;}
    
    .wrapper {width: 230px;height: 250px;margin-top: 20px;}   
    
    .infoback{padding-bottom: 0px;padding-top: 0px;background: transparent;margin-top: 23px;}
    
    
    .textinfo p{padding:90px 58px 10px 58px;font-size: 14px;text-align: justify;word-spacing:0px;color: white;}
    
    .textinfo{margin-top: 0%;}
    
    .Copyright h4{padding:15px 35px 80px 58px;font-size: 10px;margin-top: 10px;}
    
    
    
    
    #mySidenav{z-index:8; }



.videographytitle{ z-index: 4;}

.foo{ z-index: 3;}

 .topnav{z-index: 2;}

.videowrapper{z-index: 1;}
    
    
    
    

} 
 








  @media only screen and (min-device-width: 835px) and (max-width:899px) {


.Container{
        max-width: 835px;}
    
#mySidenav.sidenav a{padding: 20px 10px 8px 140px;font-size: 14px;transition: 1s;}
    
    #mySidenav.sidenav .closebtn {top: 0;right: 25px;font-size: 25px;margin-left: 10px;}
    
    #mySidenav.sidenav li{padding: 15px 8px 8px 140px;font-size: 14px;transition: 1s;}
    
    #mySidenav.sidenav span {font-size: 14px;transition: 1s;}
    
    #mySidenav.sidenav{
  height: 100%;
        max-width: 100%;
        transition: 1s;padding-top: 200px;
    
    }

    
    .foo img{width: 23px;margin-left: 560px;margin-top: 20px;}  
      
      .videographytitle{width: 110px;margin-left: 95px;margin-top: 30px;}
    
   .titlelastfiring h2{font-size: 17px;font-weight: 200;padding:10px 15px 0px 98px;margin-top: 90px;}
    
    .img-lastfiring{padding-top: 140px;max-width: 80%;max-height: 60%;}
    
    .about h2{font-size: 14px;margin-top: 30px;font-weight: 200;padding: 0px 0px 0px 80px;}
    
     .textsynopsis p{padding:0px 58px 10px 78px;font-size: 14px;color: white;}
       
       
    
    .synopsisback{padding-bottom: 0px;padding-top: 0px;background: transparent;}
    
    .sidenav a {font-size: 14px;}
    
    .videowrapper iframe{ left:30%;}
    
    .videowrapper {height: 320px;margin-left: 210px;width: 340px;}
    
    .videowrapper iframe {padding-top: 0%; width: 135%;height: 320px;}
    
    .wrapper {width: 230px;height: 250px;margin-top: 20px;} 
    
    .infoback{padding-bottom: 0px;padding-top: 0px;background: transparent;margin-top: 23px;}
    
    
    .textinfo p{padding:90px 58px 10px 78px;font-size: 14px;text-align: justify;word-spacing:0px;color: white;}
    
    .textinfo{margin-top: 0%;}
    
    .Copyright h4{padding:15px 35px 80px 78px;font-size: 10px;}
    
    
    
    #mySidenav{z-index:8; }



.videographytitle{ z-index: 4;}

.foo{ z-index: 3;}

 .topnav{z-index: 2;}

.videowrapper{z-index: 1;}
    
    
    
    

} 
    
  







@media only screen and (min-device-width: 927px) and (max-device-width:935px)and (orientation:landscape) {



.Container{
        max-width: 750px;}
    
    
#mySidenav.sidenav{
  height: 100%;
        max-width: 100%;
        transition: 1s;padding-top: 25px;padding-bottom: 30px;
    
    }
    
    #mySidenav.sidenav a{padding: 5px 10px 3px 140px;font-size: 17px;}
    
    #mySidenav.sidenav .closebtn {top: 5px;right: 55px;font-size: 27px;margin-left: 40px;}
    
    #mySidenav.sidenav li{padding: 5px 8px 3px 140px;font-size: 17px;}
    
    #mySidenav.sidenav span {font-size: 16px;}
    
     #mySidenav.sidenav a {font-size: 17px;padding-top: 10px;}
    
    .foo img{width: 30px;margin-left: 500px;margin-top: 25px;z-index: 1;}
    
    
     .topnav{height: 70px;z-index: -1;}
    
    
.videographytitle{width: 135px;margin-left: 60px;margin-top: 20px;}
    
   .titlelastfiring h2{font-size: 22px;font-weight: 200;padding:0px 15px 0px 65px;margin-top: 85px;}
    
    .img-lastfiring{padding-top: 130px;max-width: 85%;max-height: 60%;}
    
    .about h2{font-size: 19px;margin-top: 30px;font-weight: 200;padding: 0px 10px 0px 60px;}
    
    .textsynopsis{padding:0px 0px 0px 0px;text-align:justify-all;word-spacing:-1px;}
    
     .textsynopsis p{padding:10px 10px 20px 30px;font-size: 18px;color: white;word-spacing: -1px;}
       
       
    
    .synopsisback{background: rgba(114,114,114,0.1);padding:5px 30px 0px 30px;margin-bottom: 40px;}
    
    .sidenav a {font-size: 14px;}
    
    
    
    .videowrapper {height: 300px;margin-left: 135px;width: 340px;}
    
    .videowrapper iframe {padding-top: 0%; width: 430px;left:120px;height: 295px;}
    
     .wrapper {width: 500px;height: 180px;margin-top:-10px;padding-bottom: 105px;} 
       
    
    .infoback{padding: 5px 30px 0px 30px;background: rgba(114,114,114,0.1);margin-top: 160px;}
    
    
    .textinfo p{padding:10px 20px 20px 30px;font-size: 18px;color: white;word-spacing: -1px;}
    
    .textinfo{padding:0px 0px 0px 0px;text-align:justify-all;word-spacing:-1px;}
    
    .Copyright h4{padding:15px 35px 100px 60px;font-size: 13px;}
    
    
    
    #mySidenav{z-index:8; }



.videographytitle{ z-index: 4;}

.foo{ z-index: 3;}

 .topnav{z-index: 2;}

.videowrapper{z-index: 1;}
    
    
    
    
    
    

} 











    @media only screen and (min-device-width: 811px) and (max-width:833px) {

.Container{
        max-width: 811px;}
    
#mySidenav.sidenav a{padding: 20px 10px 8px 130px;font-size: 14px;transition: 1s;}
    
    #mySidenav.sidenav .closebtn {top: 0;right: 25px;font-size: 25px;margin-left: 10px;}
    
    #mySidenav.sidenav li{padding: 15px 8px 8px 130px;font-size: 14px;transition: 1s;}
    
    #mySidenav.sidenav span {font-size: 14px;transition: 1s;}
    
    #mySidenav.sidenav{
  height: 100%;
        max-width: 100%;
        transition: 1s;padding-top: 200px;
    
    }

    
    .foo img{width: 23px;margin-left: 540px;margin-top: 20px;}
    
     .videographytitle{width: 110px;margin-left: 80px;margin-top: 30px;}
    
   .titlelastfiring h2{font-size: 17px;font-weight: 200;padding:10px 15px 0px 85px;margin-top: 90px;}
    
    .img-lastfiring{padding-top: 140px;max-width: 80%;max-height: 60%;}
    
    .about h2{font-size: 14px;margin-top: 30px;font-weight: 200;padding: 0px 0px 0px 80px;}
    
     .textsynopsis p{padding:0px 50px 10px 80px;font-size: 14px;color: white;}
       
       
    
    .synopsisback{padding-bottom: 0px;padding-top: 0px;background: transparent;}
    
    .sidenav a {font-size: 14px;}
    
   .videowrapper iframe{ left:30%;}
    
    .videowrapper {height: 320px;margin-left: 210px;width: 340px;}
    
    .videowrapper iframe {padding-top: 0%; width: 135%;height: 320px;}
    
    .wrapper {width: 230px;height: 250px;margin-top: 20px;}  
       
    
    .infoback{padding-bottom: 0px;padding-top: 0px;background: transparent;margin-top: 20px;}
    
    
    .textinfo p{padding:90px 55px 10px 80px;font-size: 14px;text-align: justify;word-spacing:0px;color: white;}
    
    .textinfo{margin-top: 0%;}
    
    .Copyright h4{padding:15px 35px 80px 80px;font-size: 10px;}
    
    
    #mySidenav{z-index:8; }



.videographytitle{ z-index: 4;}

.foo{ z-index: 3;}

 .topnav{z-index: 2;}

.videowrapper{z-index: 1;}
    
    
    
    
    
    
    
    

} 
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    @media only screen and (min-device-width: 769px) and (max-width:809px) {
    
  
.Container{
        max-width: 769px;}
    
    #mySidenav.sidenav{
  height: 100%;
        max-width: 100%;
        transition: 1s;padding-top: 200px;
    
    }
    
    
#mySidenav.sidenav a{padding: 20px 10px 8px 130px;font-size: 14px;transition: 1s;}
    
    #mySidenav.sidenav .closebtn {top: 0;right: 25px;font-size: 25px;margin-left: 10px;}
    
    #mySidenav.sidenav li{padding: 15px 8px 8px 130px;font-size: 14px;transition: 1s;}
    
    #mySidenav.sidenav span {font-size: 14px;transition: 1s;}

    
    .foo img{width: 23px;margin-left: 500px;margin-top: 20px;}
        
    .videographytitle{width: 110px;margin-left: 55px;margin-top: 30px;}
    
   .titlelastfiring h2{font-size: 17px;font-weight: 200;padding:10px 15px 0px 60px;margin-top: 90px;}
    
    .img-lastfiring{padding-top: 140px;max-width: 85%;max-height: 60%;}
    
    .about h2{font-size: 14px;margin-top: 30px;font-weight: 200;padding: 0px 0px 0px 60px;}
    
     .textsynopsis p{padding:0px 60px 10px 60px;font-size: 14px;color: white;}
       
       
    
    .synopsisback{padding-bottom: 0px;padding-top: 0px;background: transparent;}
    
    .sidenav a {font-size: 14px;}
    
   .videowrapper iframe{ left:30%;}
    
    .videowrapper {height: 320px;margin-left: 190px;width: 340px;}
    
    .videowrapper iframe {padding-top: 0%; width: 135%;height: 318px;}
    
    .wrapper {width: 230px;height: 250px;margin-top: 20px;}  
       
    
    .infoback{padding-bottom: 0px;padding-top: 0px;background: transparent;margin-top: 20px;}
    
    
    .textinfo p{padding:90px 60px 10px 60px;font-size: 14px;text-align: justify;word-spacing:0px;color: white;}
    
    .textinfo{margin-top: 0%;}
    
    .Copyright h4{padding:15px 35px 80px 60px;font-size: 10px;}
    
    
    #mySidenav{z-index:8; }



.videographytitle{ z-index: 4;}

.foo{ z-index: 3;}

 .topnav{z-index: 2;}

.videowrapper{z-index: 1;}
    
    
    
    
    

} 
    
    
    
    
    @media only screen and (min-device-width: 601px) and (max-width:767px) {
    
  .Container{
        max-width: 601px;}
    
    #mySidenav.sidenav{
  height: 100%;
        max-width: 100%;
        transition: 1s;padding-top: 200px;
    
    }
    
#mySidenav.sidenav a{padding: 15px 10px 8px 140px;font-size: 14px;}
    
    #mySidenav.sidenav .closebtn {top: 0;right: 25px;font-size: 25px;margin-left: 10px;}
    
    #mySidenav.sidenav li{padding: 18px 8px 8px 140px;font-size: 14px;}
    
    #mySidenav.sidenav span {font-size: 14px;}
    
     #mySidenav.sidenav a {font-size: 14px;padding-top: 20px;}
    
    .foo img{width: 23px;margin-left: 360px;margin-top: 10px;}
        
        .videographytitle{width: 110px;margin-left: 30px;margin-top: 30px;}
    
   .titlelastfiring h2{font-size: 17px;font-weight: 200;padding:10px 15px 0px 35px;margin-top: 90px;}
    
    .img-lastfiring{padding-top: 140px;max-width: 90%;max-height: 60%;}
    
    .about h2{font-size: 14px;margin-top: 30px;font-weight: 200;padding-left: 35px;}
    
     .textsynopsis p{padding:0px 35px 15px 35px;font-size: 14px;color: white;}
       
       
    
    .synopsisback{padding-bottom: 0px;padding-top: 0px;background: transparent;}
    
    .sidenav a {font-size: 14px;}
    
    .videowrapper iframe{ left:30%;}
    
    .videowrapper {height: 290px;margin-left: 160px;width: 300px;}
    
    .videowrapper iframe {padding-top: 0%; width: 135%;height: 287px;}
    
    .wrapper {width: 230px;height: 250px;margin-top: 15px;}  
    
       
    
    .infoback{padding-bottom: 0px;padding-top: 0px;background: transparent;margin-top: 30px;}
    
    
    .textinfo p{padding:58px 35px 10px 35px;font-size: 14px;text-align: justify;word-spacing:0px;color: white;}
    
    .textinfo{margin-top: 0%;}
    
    .Copyright h4{padding:15px 35px 80px 35px;font-size: 10px;}
    
    
    
    #mySidenav{z-index:8; }



.videographytitle{ z-index: 4;}

.foo{ z-index: 3;}

 .topnav{z-index: 2;}

.videowrapper{z-index: 1;}
    
    
    
    

} 
  




/*Ipad 10*/
@media only screen and (min-device-width: 1025px) and (max-device-width:1112px) and (orientation:landscape) {

.Container{
        max-width: 850px;}
    
#mySidenav.sidenav a{padding: 25px 10px 8px 220px;font-size: 16px;transition: 1s;}
    
    #mySidenav.sidenav .closebtn {top: 0;right: 100px;font-size: 25px;margin-left:0px;}
    
    #mySidenav.sidenav li{padding: 15px 8px 8px 220px;font-size: 16px;transition: 1s;}
    
    #mySidenav.sidenav span {font-size: 16px;transition: 1s;}
    
    #mySidenav.sidenav{
  height: 100%;
        max-width: 100%;
        transition: 1s;padding-top: 80px;
    
    }

    
    .foo img{width: 27px;margin-left: 675px;margin-top: 25px;}

 .videographytitle{width: 125px;margin-left: 35px;margin-top: 30px;}
    
   .titlelastfiring h2{font-size: 19px;font-weight: 200;padding:10px 15px 0px 38px;margin-top: 85px;}
    
    .img-lastfiring{padding-top: 135px;max-width: 92%;max-height: auto;}
    
    .about h2{font-size: 17px;margin-top: 30px;font-weight: 200;padding: 0px 0px 5px 0px;margin-left: 35px;}
    
     .textsynopsis p{padding:0px 35px 5px 35px;font-size: 17px;color: white;}
       
       
    
    .synopsisback{padding-bottom: 0px;padding-top: 0px;background: transparent;}
    
    .sidenav a {font-size: 14px;}
    
    .wrapper {width: 150px; margin-top: 30px;height: 267px;} 
    
    
      .videowrapper iframe{ left:33%;}
    
    .videowrapper {height: 350px;margin-left: 165px;width: 400px;}
    
    .videowrapper iframe {padding-top: 0%; width: 480px;}
       
    
    .infoback{padding-bottom: 0px;padding-top: 0px;background: transparent;margin-top: 0px;}
    
    
    .textinfo p{padding:120px 35px 10px 35px;font-size: 17px;text-align: justify;word-spacing:0px;color: white;}
    
    .textinfo{margin-top: 0%;}
    
    .Copyright h4{padding:5px 35px 80px 37px;font-size: 12.5px;}
    
    
    
    
    #mySidenav{z-index:8; }



.videographytitle{ z-index: 4;}

.foo{ z-index: 3;}

 .topnav{z-index: 2;}

.videowrapper{z-index: 1;}
    
    
    
    
    

}
    













@media only screen and (min-device-width: 669px) and (max-device-width:844px)and (orientation:landscape) {
    
    .Container{
        max-width: 669px;}
    
    

 #mySidenav.sidenav{
  height: 100%;
        max-width: 100%;
        transition: 1s;padding-top: 40px;padding-bottom: 0px;
    
    }
    
    
#mySidenav.sidenav a{padding: 0px 10px 8px 112px;font-size: 16px;}
    
    #mySidenav.sidenav .closebtn {top: 20px;right: 45px;font-size: 25px;margin-left: 30px;}
    
    #mySidenav.sidenav li{padding: 0px 8px 8px 112px;font-size: 16px;}
    
    #mySidenav.sidenav span {font-size: 16px;}
    
     #mySidenav.sidenav a {font-size: 16px;padding-top: 1px;}
    
    .foo img{width: 28px;margin-left: 420px;margin-top: 20px;z-index: 1;}
    

    
    .topnav{height: 65px;z-index: -1;}

 .videographytitle{width: 130px;margin-left: 15px;margin-top: 25px;}
    
   .titlelastfiring h2{font-size: 20px;font-weight: 200;padding:0px 15px 0px 18px;margin-top: 80px;}
    
    .img-lastfiring{padding-top: 120px;max-width: 95%;max-height: 60%;}
    
    .about h2{font-size: 18px;margin-top: 30px;font-weight: 200;padding: 0px 10px 0px 0px;margin-left: 15px;}
    
     .textsynopsis p{padding:10px 10px 10px 15px;font-size: 18px;color: white;word-spacing: -1px;}
       
       
    
    .synopsisback{padding-bottom: 0px;padding-top: 0px;background: rgba(114,114,114,0.1);}
    
    .sidenav a {font-size: 14px;}
    
    .videowrapper {height: 300px;margin-left: 135px;width: 310px;}
    
    .videowrapper iframe {padding-top: 0%; width: 430px;left:90px;height: 300px;}
    
     .wrapper {width: 500px;height: 200px;padding-top: 0px;padding-bottom: 210px;} 
    
       
    
    .infoback{padding-bottom: 0px;padding-top: 0px;background: rgba(114,114,114,0.1);margin-top: 128px;}
    
    
    
    .textinfo p{padding:10px 10px 10px 15px;font-size: 18px;text-align: justify;word-spacing:-1px;color: white;}
    
    .textinfo{margin-top: 0%;}
    
    .Copyright h4{padding:15px 35px 80px 15px;font-size: 13px;}
    
    
    
    
    #mySidenav{z-index:8; }



.videographytitle{ z-index: 4;}

.foo{ z-index: 3;}

 .topnav{z-index: 2;}

.videowrapper{z-index: 1;}
    
    
    
    
    

} 
 








/*Galaxy S21*/   
       
       
 @media
   only screen and (min-device-width: 800px) and (max-device-width:800px) and (orientation:landscape)
  { 


.Container{
        max-width: 669px;}
    
    

 #mySidenav.sidenav{
  height: 100%;
        max-width: 100%;
        transition: 1s;padding-top: 10px;padding-bottom: 0px;
    
    }
    
    
#mySidenav.sidenav a{padding: 0px 10px 8px 112px;}
    
    #mySidenav.sidenav .closebtn {top: 20px;right: 45px;font-size: 25px;margin-left: 30px;}
    
    #mySidenav.sidenav li{padding: 0px 8px 8px 112px;font-size: 2vw;}
    
    #mySidenav.sidenav span {font-size: 2.1vw;}
    
     #mySidenav.sidenav a {font-size: 2vw;padding-top: 1px;}
    
    .foo img{width: 28px;margin-left: 420px;margin-top: 20px;z-index: 1;}
    

    
    .topnav{height: 65px;z-index: -1;}

 .videographytitle{width: 120px;margin-left: 15px;margin-top: 25px;}
    
   .titlelastfiring h2{font-size: 19px;font-weight: 200;padding:0px 15px 0px 18px;margin-top: 80px;}
    
    .img-lastfiring{padding-top: 120px;max-width: 95%;max-height: 60%;}
    
    .about h2{font-size: 17px;margin-top: 30px;font-weight: 200;padding: 0px 10px 0px 0px;margin-left: 15px;}
    
     .textsynopsis p{padding:10px 10px 10px 15px;font-size: 2.3vw;color: white;word-spacing: -1px;}
       
       
    
    .synopsisback{padding-bottom: 0px;padding-top: 0px;background: rgba(114,114,114,0.1);}
    
    .sidenav a {font-size: 14px;}
    
    .videowrapper {height: 300px;margin-left: 135px;width: 310px;}
    
    .videowrapper iframe {padding-top: 0%; width: 430px;left:90px;height: 300px;}
    
     .wrapper {width: 500px;height: 200px;padding-top: 0px;padding-bottom: 210px;} 
    
       
    
    .infoback{padding-bottom: 0px;padding-top: 0px;background: rgba(114,114,114,0.1);margin-top: 128px;}
    
    
    
    .textinfo p{padding:10px 10px 10px 15px;font-size: 2.3vw;text-align: justify;word-spacing:-1px;color: white;}
    
    .textinfo{margin-top: 0%;}
    
    .Copyright h4{padding:15px 35px 80px 15px;font-size: 12px;}
    
    
    
    #mySidenav{z-index:8; }



.videographytitle{ z-index: 4;}

.foo{ z-index: 3;}

 .topnav{z-index: 2;}

.videowrapper{z-index: 1;}
    
    
    
    
    
    
    

} 




@media only screen and (min-device-width: 845px) and (max-device-width:851px)and (orientation:landscape) {

 .Container{
        max-width: 750px;}
    
    
#mySidenav.sidenav{
  height: 100%;
        max-width: 100%;
        transition: 1s;padding-top: 25px;padding-bottom: 10px;
    
    }
    
    #mySidenav.sidenav a{padding: 3px 10px 8px 140px;font-size: 17px;}
    
    #mySidenav.sidenav .closebtn {top: 15px;right: 40px;font-size: 25px;margin-left: 10px;}
    
    #mySidenav.sidenav li{padding: 5px 8px 8px 140px;font-size: 15px;}
    
    #mySidenav.sidenav span {font-size: 15px;}
    
     #mySidenav.sidenav a {font-size: 15px;padding-top: 1px;}
    
     .foo img{width: 28px;margin-left: 480px;margin-top: 20px;z-index: 1;}
    
    .topnav{height: 65px;z-index: -1;}
    
.videographytitle{width: 135px;margin-left: 50px;margin-top: 20px;}
    
   .titlelastfiring h2{font-size: 21px;font-weight: 200;padding:0px 15px 0px 53px;margin-top: 80px;}
    
    .img-lastfiring{padding-top: 120px;max-width: 90%;max-height: 60%;}
    
    .about h2{font-size: 19px;margin-top: 30px;font-weight: 200;padding: 0px 10px 0px 50px;}
    
    .textsynopsis{padding:0px 0px 0px 0px;text-align:justify-all;word-spacing:-1px;}
    
     .textsynopsis p{padding:10px 20px 20px 20px;font-size: 18px;color: white;word-spacing: -1px;}
       
       
    
    .synopsisback{background: rgba(114,114,114,0.1);padding:5px 30px 0px 30px;}
    
    .sidenav a {font-size: 14px;}
    
    
   .videowrapper {height: 310px;margin-left: 135px;width: 350px;}
    
    .videowrapper iframe {padding-top: 0%; width: 430px;left:120px;height: 305px;}
    
     .wrapper {width: 500px;height: 200px;padding-top: 0px;padding-bottom: 170px;} 
    
       
    
    .infoback{padding: 5px 30px 0px 30px;background: rgba(114,114,114,0.1);margin-top: 148px;}
    
    
    .textinfo p{padding:10px 20px 20px 20px;font-size: 18px;color: white;word-spacing: -1px;}
    
    .textinfo{padding:0px 0px 0px 0px;text-align:justify-all;word-spacing:-1px;}
    
    .Copyright h4{padding:15px 35px 80px 50px;font-size: 13px;}
    
    
    
    #mySidenav{z-index:8; }



.videographytitle{ z-index: 4;}

.foo{ z-index: 3;}

 .topnav{z-index: 2;}

.videowrapper{z-index: 1;}
    
    
    
    
    
    
    

} 
 


/*Iphone 14 Pro*/

@media only screen and (min-device-width: 852px) and (max-device-width:852px) and (orientation:landscape){


.Container{
        max-width: 700px;}
    
    
#mySidenav.sidenav{
  height: 100%;
        max-width: 100%;
        transition: 1s;padding-top: 30px;padding-bottom: 0px;
    
    }
    
    #mySidenav.sidenav a{padding: 3px 10px 8px 140px;font-size: 17px;}
    
    #mySidenav.sidenav .closebtn {top: 15px;right: 40px;font-size: 25px;margin-left: 10px;}
    
    #mySidenav.sidenav li{padding: 5px 8px 8px 140px;font-size: 15px;}
    
    #mySidenav.sidenav span {font-size: 16px;}
    
     #mySidenav.sidenav a {font-size: 15px;padding-top: 2px;}
    
     .foo img{width: 28px;margin-left: 440px;margin-top: 20px;z-index: 1;}
    
    .topnav{height: 65px;z-index: -1;}
    
.videographytitle{width: 130px;margin-left: 50px;margin-top: 20px;}
    
   .titlelastfiring h2{font-size: 21px;font-weight: 200;padding:0px 15px 0px 53px;margin-top: 80px;}
    
    .img-lastfiring{padding-top: 120px;max-width: 90%;max-height: 60%;}
    
    .about h2{font-size: 19px;margin-top: 30px;font-weight: 200;padding: 0px 10px 0px 50px;}
    
    .textsynopsis{padding:0px 0px 0px 0px;text-align:justify-all;word-spacing:-1px;}
    
     .textsynopsis p{padding:10px 20px 20px 20px;font-size: 18px;color: white;word-spacing: -1px;}
       
       
    
    .synopsisback{background: rgba(114,114,114,0.1);padding:5px 30px 0px 30px;}
    
    .sidenav a {font-size: 14px;}
    
    .videowrapper {height: 320px;margin-left: 135px;width: 350px;}
    
    .videowrapper iframe {padding-top: 0%; width: 435px;left:100px;height: 315px;}
    
     .wrapper {width: 500px;height: 200px;padding-top: 0px;padding-bottom: 115px;} 
    
       
    
    .infoback{padding: 5px 30px 0px 30px;background: rgba(114,114,114,0.1);margin-top: 158px;}
    
    
    .textinfo p{padding:10px 20px 20px 20px;font-size: 18px;color: white;word-spacing: -1px;}
    
    .textinfo{padding:0px 0px 0px 0px;text-align:justify-all;word-spacing:-1px;}
    
    .Copyright h4{padding:15px 35px 80px 50px;font-size: 12px;}



#mySidenav{z-index:8; }



.videographytitle{ z-index: 4;}

.foo{ z-index: 3;}

 .topnav{z-index: 2;}

.videowrapper{z-index: 1;}






} 
 











/*Galaxy Note 5*/

@media only screen and (min-device-width: 853px) and (max-device-width:853px) and (orientation:landscape)



{

.Container{
        max-width: 750px;}
    
    
#mySidenav.sidenav{
  height: 100%;
        max-width: 100%;
        transition: 1s;padding-top: 30px;padding-bottom: 10px;
    
    }
    
    .foo img{width: 33px;margin-left: 490px;margin-top: 20px;}
    
    #mySidenav.sidenav a{padding: 3px 10px 8px 140px;font-size: 18px;}
    
    #mySidenav.sidenav .closebtn {top: 20px;right: 70px;font-size: 30px;margin-left: 0px;}
    
    #mySidenav.sidenav li{padding: 5px 8px 8px 140px;font-size: 18px;}
    
    #mySidenav.sidenav span {font-size: 18px;}
    
     #mySidenav.sidenav a {font-size: 18px;padding-top: 5px;}
    
.foo img{width: 33px;margin-left: 490px;margin-top: 20px;z-index: 1;}
    
    .topnav{height: 75px;z-index: -1;}
    
.videographytitle{width: 150px;margin-left: 10px;margin-top: 25px;}
    
   .titlelastfiring h2{font-size: 23px;font-weight: 200;padding:0px 15px 0px 13px;margin-top: 90px;}
    
    .img-lastfiring{padding-top: 130px;max-width: 95%;max-height: 60%;}
    
    .about h2{font-size: 20px;margin-top: 30px;font-weight: 200;padding: 0px 10px 0px 5px;margin-left: 25px;}
    
    .textsynopsis{padding:0px 0px 0px 0px;text-align:justify-all;word-spacing:-1px;}
    
     .textsynopsis p{padding:10px 20px 20px 0px;font-size: 20px;color: white;word-spacing: -1px;}
       
       
    
    .synopsisback{background: rgba(114,114,114,0.1);padding:5px 30px 0px 28px;}
    
    .sidenav a {font-size: 14px;}
    
    
   .videowrapper {height: 340px;margin-left: 135px;width: 370px;}
    
    .videowrapper iframe {padding-top: 0%; width: 480px;left:120px;height: 340px;}
    
     .wrapper {width: 500px;height: 200px;padding-top: 0px;padding-bottom: 115px;margin-top: 35px;} 
    
       
    
    .infoback{padding: 5px 30px 0px 30px;background: rgba(114,114,114,0.1);margin-top: 183px;}
    
    
    .textinfo p{padding:10px 20px 20px 0px;font-size: 20px;color: white;word-spacing: -1px;}
    
    .textinfo{padding:0px 0px 0px 0px;text-align:justify-all;word-spacing:-1px;}
    
    .Copyright h4{padding:15px 35px 80px 15px;font-size: 13px;}
    
    
    #mySidenav{z-index:8; }



.videographytitle{ z-index: 4;}

.foo{ z-index: 3;}

 .topnav{z-index: 2;}

.videowrapper{z-index: 1;}
    
    
    
    
    

} 
 




/*S Galaxy S20 Plus*/

@media only screen and (min-device-width:854px) and (max-device-width:854px) and (orientation:landscape){

.Container{
        max-width: 650px;}
    
    
#mySidenav.sidenav{
  height: 100%;
        max-width: 100%;
        transition: 1s;padding-top: 18px;padding-bottom: 10px;
    
    }
    
    
    
    #mySidenav.sidenav a{padding: 3px 10px 8px 140px;font-size: 15px;}
    
    #mySidenav.sidenav .closebtn {top: 20px;right: 70px;font-size: 27px;margin-left: 0px;}
    
    #mySidenav.sidenav li{padding: 5px 8px 8px 140px;font-size: 15px;}
    
    #mySidenav.sidenav span {font-size: 15px;}
    
     #mySidenav.sidenav a {font-size: 15px;padding-top: 1px;}
    
.foo img{width: 26px;margin-left: 440px;margin-top: 20px;z-index: 1;}
    
    .topnav{height: 75px;z-index: -1;}
    
.videographytitle{width: 125px;margin-left: 30px;margin-top: 25px;}
    
   .titlelastfiring h2{font-size: 19px;font-weight: 200;padding:0px 15px 0px 33px;margin-top: 85px;margin-bottom: 20px;}
    
    .img-lastfiring{padding-top: 115px;max-width: 90%;max-height: 60%;}
    
    .about h2{font-size: 17px;margin-top: 30px;font-weight: 200;padding: 0px 10px 0px 35px;}
    
    .textsynopsis{padding:0px 0px 0px 0px;text-align:justify-all;word-spacing:-1px;}
    
     .textsynopsis p{padding:10px 0px 20px 10px;font-size: 17px;color: white;word-spacing: -0.5px;}
       
       
    
    .synopsisback{background: rgba(114,114,114,0.1);padding:5px 50px 0px 28px;}
    
    .sidenav a {font-size: 14px;}
    
    .videowrapper {height: 245px;margin-left: 135px;width: 300px;}
    
    .videowrapper iframe {padding-top: 0%; width: 350px;left:100px;height: 240px;}
    
     .wrapper {width: 300px;height: 200px;padding-top: 0px;padding-bottom: 160px;} 
    
    .infoback{padding: 5px 30px 0px 30px;background: rgba(114,114,114,0.1);margin-top: 80px;}
    
    
    .textinfo p{padding:15px 20px 20px 0px;font-size: 17px;color: white;word-spacing: 0.5px;}
    
    .textinfo{padding:0px 0px 0px 0px;text-align:justify-all;word-spacing:-1px;}
    
    .Copyright h4{padding:15px 35px 80px 15px;font-size: 12px;}


#mySidenav{z-index:8; }



.videographytitle{ z-index: 4;}

.foo{ z-index: 3;}

 .topnav{z-index: 2;}

.videowrapper{z-index: 1;}






} 
 









@media only screen and (min-device-width: 897px) and (max-device-width:926px)and (orientation:landscape) {


.Container{
        max-width: 700px;}
    
    
#mySidenav.sidenav{
  height: 100%;
        max-width: 100%;
        transition: 1s;padding-top: 20px;padding-bottom: 10px;
    
    }
    
    #mySidenav.sidenav a{padding: 5px 10px 0px 140px;font-size: 1.8vw;}
    
    #mySidenav.sidenav .closebtn {top: 5px;right: 55px;font-size: 27px;margin-left: 40px;}
    
    #mySidenav.sidenav li{padding: 5px 8px 0px 140px;font-size: 1.8vw;}
    
    #mySidenav.sidenav span {font-size: 2vw;}
    
     #mySidenav.sidenav a {font-size: 1.8vw;padding-top: 10px;}
    
    .foo img{width: 30px;margin-left: 470px;margin-top: 25px;z-index: 1;}
    
    
     .topnav{height: 70px;z-index: -1;}
    
    
.videographytitle{width: 130px;margin-left: 50px;margin-top: 25px;}
    
   .titlelastfiring h2{font-size: 20px;font-weight: 200;padding:0px 15px 0px 53px;margin-top: 90px;}
    
    .img-lastfiring{padding-top: 135px;max-width: 85%;max-height: 60%;}
    
    .about h2{font-size: 19px;margin-top: 30px;font-weight: 200;padding: 0px 10px 0px 60px;}
    
    .textsynopsis{padding:0px 0px 0px 0px;text-align:justify-all;word-spacing:-1px;}
    
     .textsynopsis p{padding:10px 20px 20px 30px;font-size: 18px;color: white;word-spacing: -1px;}
       
       
    
    .synopsisback{background: rgba(114,114,114,0.1);padding:5px 30px 0px 30px;margin-bottom: 35px;}
    
    .sidenav a {font-size: 14px;}
    
    
    
    .videowrapper {height: 320px;margin-left: 135px;width: 330px;}
    
    .videowrapper iframe {padding-top: 0%; width: 460px;left:100px;height: 315px;}
    
     .wrapper {width: 500px;height: 200px;padding-top:0px;padding-bottom: 105px;} 
       
    
    .infoback{padding: 5px 30px 0px 30px;background: rgba(114,114,114,0.1);margin-top: 160px;}
    
    
    .textinfo p{padding:10px 20px 20px 30px;font-size: 18px;color: white;word-spacing: -1px;}
    
    .textinfo{padding:0px 0px 0px 0px;text-align:justify-all;word-spacing:-1px;}
    
    .Copyright h4{padding:15px 35px 100px 60px;font-size: 13px;}



#mySidenav{z-index:8; }



.videographytitle{ z-index: 4;}

.foo{ z-index: 3;}

 .topnav{z-index: 2;}

.videowrapper{z-index: 1;}









} 





   @media only screen and (min-device-width: 855px) and (max-device-width:896px)and (orientation:landscape) {


.Container{
        max-width: 853px;}
    
    
#mySidenav.sidenav{
  height: 100%;
        max-width: 100%;
        transition: 1s;padding-top: 10px;padding-bottom: 10px;
    
    }
    
    #mySidenav.sidenav a{padding: 5px 10px 3px 140px;font-size: 19px;}
    
    #mySidenav.sidenav .closebtn {top: 5px;right: 55px;font-size: 27px;margin-left: 40px;}
    
    #mySidenav.sidenav li{padding: 5px 8px 3px 140px;font-size: 19px;}
    
    #mySidenav.sidenav span {font-size: 19px;}
    
     #mySidenav.sidenav a {font-size: 19px;padding-top: 10px;}
    
    .foo img{width: 30px;margin-left: 540px;margin-top: 25px;z-index: 1;}
    
    
     .topnav{height: 70px;z-index: -1;}
    
    
.videographytitle{width: 140px;margin-left: 60px;margin-top: 25px;}
    
   .titlelastfiring h2{font-size: 22px;font-weight: 200;padding:0px 15px 0px 60px;margin-top: 90px;}
    
    .img-lastfiring{padding-top: 135px;max-width: 85%;max-height: 60%;}
    
    .about h2{font-size: 20px;margin-top: 40px;font-weight: 200;padding: 0px 10px 0px 60px;}
    
    .textsynopsis{padding:0px 0px 0px 0px;text-align:justify-all;word-spacing:-1px;}
    
     .textsynopsis p{padding:10px 20px 20px 30px;font-size: 18px;color: white;word-spacing: -1px;}
       
       
    
    .synopsisback{background: rgba(114,114,114,0.1);padding:5px 30px 0px 30px;margin-bottom: 40px;}
    
    .sidenav a {font-size: 14px;}
    
    
    
    .videowrapper {height: 330px;margin-left: 135px;width: 340px;}
    
    .videowrapper iframe {padding-top: 0%; width: 470px;left:120px;height: 330px;}
    
     .wrapper {width: 500px;height: 200px;padding-top:0px;padding-bottom: 105px;} 
       
    
    .infoback{padding: 5px 30px 0px 30px;background: rgba(114,114,114,0.1);margin-top: 170px;}
    
    
    .textinfo p{padding:10px 20px 20px 30px;font-size: 18px;color: white;word-spacing: -1px;}
    
    .textinfo{padding:0px 0px 0px 0px;text-align:justify-all;word-spacing:-1px;}
    
    .Copyright h4{padding:15px 35px 100px 60px;font-size: 13px;}
    
    
    #mySidenav{z-index:8; }



.videographytitle{ z-index: 4;}

.foo{ z-index: 3;}

 .topnav{z-index: 2;}

.videowrapper{z-index: 1;}
    
    
    
    
    

} 
 





















 






@media only screen and (min-device-width: 667px) and (max-device-width:668px)and (orientation:landscape) {

#mySidenav.sidenav{
  height: 100%;
        max-width: 100%;
        transition: 1s;padding-top: 35px;padding-bottom: 10px;
    
    }
    
    
#mySidenav.sidenav a{padding: 0px 10px 8px 112px;font-size: 16px;}
    
    #mySidenav.sidenav .closebtn {top: 20px;right: 35px;font-size: 25px;margin-left: 30px;}
    
    #mySidenav.sidenav li{padding: 0px 8px 8px 112px;font-size: 16px;}
    
    #mySidenav.sidenav span {font-size: 16px;}
    
     #mySidenav.sidenav a {font-size: 16px;padding-top: 0px;}
    
    .foo img{width: 28px;margin-left: 350px;margin-top: 15px;z-index: 1;}
    

    
    .topnav{height: 65px;z-index: -1;}
    
 .videographytitle{width: 130px;margin-left: 15px;margin-top: 20px;}
    
   .titlelastfiring h2{font-size: 20px;font-weight: 200;padding:0px 15px 0px 18px;margin-top: 80px;}
    
    .img-lastfiring{padding-top: 120px;max-width: 95%;max-height: 60%;}
    
    .about h2{font-size: 19px;margin-top: 30px;font-weight: 200;padding: 0px 10px 0px 15px;}
    
     .textsynopsis p{padding:10px 10px 10px 15px;font-size: 18px;color: white;word-spacing: -1px;}
       
       
    
    .synopsisback{padding-bottom: 0px;padding-top: 0px;background: rgba(114,114,114,0.1);}
    
    .sidenav a {font-size: 14px;}
    
    .videowrapper {height: 330px;margin-left: 135px;width: 280px;}
    
    .videowrapper iframe {padding-top: 0%; width: 460px;left:50px;height: 325px;}
    
     .wrapper {width: 400px;height: 200px;padding-top: 0px;padding-bottom: 285px;} 
       
    
    .infoback{padding-bottom: 0px;padding-top: 0px;background: rgba(114,114,114,0.1);margin-top: 85px;}
    
    
    .textinfo p{padding:10px 10px 10px 15px;font-size: 18px;text-align: justify;word-spacing:-1px;color: white;}
    
    .textinfo{margin-top: 0%;}
    
    .Copyright h4{padding:15px 35px 80px 15px;font-size: 13px;}
    
    
    
    #mySidenav{z-index:8; }



.videographytitle{ z-index: 4;}

.foo{ z-index: 3;}

 .topnav{z-index: 2;}

.videowrapper{z-index: 1;}
    
    
    
    
    
    
    

} 
 
    












@media only screen and (min-device-width: 601px) and (max-device-width:666px)and (orientation:landscape) {


  #mySidenav.sidenav{
  height: 100%;
        max-width: 100%;
        transition: 1s;padding-top: 15px;padding-bottom: 10px;
    
    }
    
    
#mySidenav.sidenav a{padding: 0px 10px 8px 112px;font-size: 15px;}
    
    #mySidenav.sidenav .closebtn {top: 10px;right: 35px;font-size: 25px;margin-left: 30px;}
    
    #mySidenav.sidenav li{padding: 0px 8px 8px 112px;font-size: 15px;}
    
    #mySidenav.sidenav span {font-size: 15px;}
    
     #mySidenav.sidenav a {font-size: 15px;padding-top: 0px;}
    
    .foo img{width: 25px;margin-left: 340px;margin-top: 15px;z-index: 1;}
    
 .topnav{height: 55px;z-index: -1;}
       
     .videographytitle{width: 120px;margin-left: 25px;margin-top: 15px;}
    
   .titlelastfiring h2{font-size: 18px;font-weight: 200;padding:0px 15px 0px 30px;margin-top: 70px;}
    
    .img-lastfiring{padding-top: 110px;max-width: 90%;max-height: 60%;}
    
    .about h2{font-size: 17px;margin-top: 30px;font-weight: 200;padding: 0px 10px 0px 25px;}
    
     .textsynopsis p{padding:10px 10px 10px 25px;font-size: 16px;color: white;word-spacing: -1px;}
       
       
    
    .synopsisback{padding-bottom: 0px;padding-top: 0px;background: rgba(114,114,114,0.1);}
    
    .sidenav a {font-size: 14px;}
    
    
    
   .videowrapper {height: 245px;margin-left: 135px;width: 280px;}
    
    .videowrapper iframe {padding-top: 0%; width: 350px;left:90px;height: 240px;}
    
     .wrapper {width: 300px;height: 200px;padding-top: 0px;padding-bottom: 160px;} 
       
    
    .infoback{padding-bottom: 0px;padding-top: 0px;background: rgba(114,114,114,0.1);margin-top: 80px;}
    
    
    .textinfo p{padding:10px 10px 10px 25px;font-size: 16px;text-align: justify;word-spacing:-1px;color: white;}
    
    .textinfo{margin-top: 0%;}
    
    .Copyright h4{padding:15px 35px 80px 25px;font-size: 11px;}



#mySidenav{z-index:8; }



.videographytitle{ z-index: 4;}

.foo{ z-index: 3;}

 .topnav{z-index: 2;}

.videowrapper{z-index: 1;}







} 
 
    
    











    
    @media only screen and (min-device-width: 481px) and (max-width:600px) {
    
.Container{
        max-width: 481px;}
    
    #mySidenav.sidenav{
  height: 100%;
        max-width: 100%;
        transition: 1s;padding-top: 200px;
    
    }
    
    
#mySidenav.sidenav a{padding: 5px 10px 8px 72px;font-size: 14px;}
    
    #mySidenav.sidenav .closebtn {top: 0;right: 25px;font-size: 25px;margin-left: 10px;}
    
    #mySidenav.sidenav li{padding: 18px 8px 8px 72px;font-size: 14px;}
    
    #mySidenav.sidenav span {font-size: 14px;}
    
     #mySidenav.sidenav a {font-size: 14px;padding-top: 15px;}
    
    .foo img{width: 23px;margin-left: 230px;margin-top: 20px;}
    
         .videographytitle{width: 110px;margin-left: 30px;margin-top: 30px;}
    
   .titlelastfiring h2{font-size: 17px;font-weight: 200;padding:10px 15px 0px 35px;margin-top: 90px;}
    
    .img-lastfiring{padding-top: 140px;max-width: 90%;max-height: 60%;}
    
    .about h2{font-size: 14px;margin-top: 30px;font-weight: 200;padding-left: 35px;}
    
     .textsynopsis p{padding:0px 35px 15px 35px;font-size: 14px;color: white;}
       
       
    
    .synopsisback{padding-bottom: 0px;padding-top: 0px;background: transparent;}
    
    .sidenav a {font-size: 14px;}
    
    .wrapper {width: 200px; margin-top: 15px;height: 300px;} 
    
    
      .videowrapper iframe{ left:23%;}
    
    .videowrapper {height: 260px;margin-left: 160px;width: 230px;}
    
    .videowrapper iframe {padding-top: 0%; width: 155%;height: 255px;}
    
       
    
    .infoback{padding-bottom: 0px;padding-top: 0px;background: transparent;margin-top: -35px;}
    
    
    .textinfo p{padding:38px 35px 10px 35px;font-size: 14px;text-align: justify;word-spacing:-1.5px;color: white;}
    
    .textinfo{margin-top: 0%;}
    
    .Copyright h4{padding:15px 35px 80px 35px;font-size: 10px;}
    
    
    
    #mySidenav{z-index:8; }



.videographytitle{ z-index: 4;}

.foo{ z-index: 3;}

 .topnav{z-index: 2;}

.videowrapper{z-index: 1;}
    
    
    
    
    

} 
 
    
    
    
    
    
    
 @media only screen and (min-device-width: 481px) and (max-device-width:600px) and (orientation:landscape){

   #mySidenav.sidenav{
  height: 100%;
        max-width: 100%;
        transition: 1s;padding-top: 20px;padding-bottom: 5px;
    
    }
    
    
#mySidenav.sidenav a{padding: 0px 10px 8px 82px;font-size: 15px;}
    
    #mySidenav.sidenav .closebtn {top: 5px;right: 25px;font-size: 25px;margin-left: 20px;}
    
    #mySidenav.sidenav li{padding: 0px 8px 2px 82px;font-size: 15px;}
    
    #mySidenav.sidenav span {font-size: 15px;}
    
     #mySidenav.sidenav a {font-size: 15px;padding-top: 0px;}
    
    .foo img{width: 26px;margin-left: 240px;margin-top: 25px;z-index: 1;}
    

    
    .topnav{height: 65px;z-index: -1;}
       
     .videographytitle{width: 120px;margin-left: 15px;margin-top: 25px;}
    
   .titlelastfiring h2{font-size: 19px;font-weight: 200;padding:0px 15px 0px 20px;margin-top: 78px;}
    
    .img-lastfiring{padding-top: 110px;max-width: 100%;max-height: 60%;}
    
    .about h2{font-size: 17px;margin-top: 20px;font-weight: 200;padding: 0px 10px 0px 10px;}
    
     .textsynopsis p{padding:10px 0px 15px 10px;font-size: 17px;color: white;word-spacing: -1px;}
       
       
    
    .synopsisback{padding-bottom: 0px;padding-top: 0px;background: rgba(114,114,114,0.1);}
    
    .sidenav a {font-size: 14px;}
    
    .wrapper {width: 440px; margin-top: 30px;height: 280px;} 
    
    
      .videowrapper iframe{ left:27%;}
    
    .videowrapper {height: 170px;margin-left: 130px;width: 250px;}
    
    .videowrapper iframe {padding-top: 0%; width: 350px;height: 245px;}
    
       
    
    .infoback{padding-bottom: 0px;padding-top: 0px;background: rgba(114,114,114,0.1);margin-top: 5px;}
    
    
    .textinfo p{padding:10px 0px 15px 10px;font-size: 17px;text-align: justify;word-spacing:-1px;color: white;}
    
    .textinfo{margin-top: 0px;}
    
    .Copyright h4{padding:15px 35px 80px 10px;font-size: 12px;}
    
    
    
    #mySidenav{z-index:8; }



.videographytitle{ z-index: 4;}

.foo{ z-index: 3;}

 .topnav{z-index: 2;}

.videowrapper{z-index: 1;}
    
    
    
    
    

}