body{
font-family: 'Montserrat', sans-serif !important;
    font-weight: normal;
    background: #000;
    color:#fff;
    opacity:0.8;
}
.big-img{
    float:left;
    width:100%;
    position:relative;
}
.play-btn{
    position:absolute;
    left:30px;
    height: 50px;
    background-size:50%;
    bottom:65px;
    width:50px;
}
.play-btn img{
    width:100%;
}
.whatch{
    position:absolute;
    left:100px;
    bottom:73px;
    color:#fff;
    background:red;
    padding:5px;
}
.big-img img{
    float:left;
    width:100%;
}
.title-logo{
    display:inline-block;
    width:500px;
    margin:30px 0px;
    font-size:40px;
    font-weight: bold;
    /*margin-left:50px;*/
    
}
.title-logo img{
    float:left;
    width:100%;
}
.see-trailer{
    float:left;
    width:100%;
    margin-top:20px;
    margin-bottom:20px;
    position:relative;
    
}
.see-trailer a{
    float:left;
    padding:20px 40px;
    box-sizing:border-box;
    background:#b18c48;
    color:#fff;
    border-top-right-radius:20px;
    border-bottom-left-radius:20px;
    font-size:20px;
    position:relative;
    padding-left:60px;
    position:absolute;
    top:75%;
    left:50%;
}
.see-trailer a:before{
    position:absolute;
    content:"";
    left:10px;
    top:10px;
    background:url("../img/filmlanding/play.svg") no-repeat center;
    background-size:40%;
    width:50px;
    height: 50px;
}
.title{
    margin-left:0px;
    font-size:50px;
    font-weight: bold;
    float:left;
    width: 100%;
    margin-top:50px;
    margin-bottom:30px;
    color:#b18c48;
}
.logo-vina{
    float:left;
    width:220px;
    margin-top:20px;
}
.logo-vina img{
    float:left;
    width:100%;
}
.title img{
    float:left;
    width:100%;
}
.info-film{
    float:left;
    width:100%;
    margin-bottom:20px;
}
.bnt-film{
    float:left;
    padding:10px 20px;
    box-sizing:border-box;
    background:red;
    color:#fff;
}
.more-info-film{
    float:left;
    width:100%;
    margin-top:20px;
    background:url(../img/filmlanding/logo-vina.png) no-repeat center;
    background-size:26%;
   
}
.more-info-film p{
    float:left;
    width:100%;
    margin:5px 0px;
    line-height: 29px;
    text-align: justify;
}
.teem-wrap{
    float:left;
    width:100%;
}
.teem-wrap .title{
    float:left;
    width:100%;
    text-align:left;
    margin-top:30px;
}
.teem-boxes{
    float:left;
    width:100%;
}
.teem-box{
    float:left;
    width:31%;
    margin:1%;
    cursor:pointer;
    padding:5px;
    box-sizing:border-box;
    border:1px solid #000;
}
.teem-box:hover{
  border:1px solid #b18c48;
}
.teem-box img{
    float:left;
    width:100%;
}
.film-name{
    float:left;
    width:100%;
    font-size:18px;
    font-weight: bold;
    margin-top:10px;
    margin-bottom:5px;
}
.name{
    float:left;
    width:100%;
    font-size:17px;
}
.sub-title{
    float:left;
    width:100%;
    text-align:center;
    margin-bottom:20px;
}
.box-video{
    float:left;
    width:46%;
    box-shadow: rgb(50 50 93 / 25%) 0px 50px 100px -20px, rgb(0 0 0 / 30%) 0px 30px 60px -30px, rgb(10 37 64 / 35%) 0px -2px 6px 0px inset;
    padding: 20px;
    box-sizing:border-box;
    display: flex;
    flex-direction: row;
    margin:1%;
}

.box-img{
    width:250px;
    float:left;
    position:relative;
}
.box-img .play-btn{
    position:absolute;
    width:30px;
    height: 30px;
    left:10px;
    bottom:10px;
}
.box-img img{
    float:left;
    width:100%;
}
.descr{
    float:left;
    width:calc(100% - 250px);
    font-size:14px;
    padding-left:5px;
    box-sizing:border-box;
}
.small-title{
    float:left;
    font-size:16px;
    width:100%;
}
.popup{
   display:none;
   position:fixed;
   background: #fff;
   max-width: 700px;
   z-index:999999999999999999;
   left:50%;
   -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    max-height: 72vh;
    overflow: auto;
    top:20%;
    padding:20px;
    box-sizing:border-box; 
}
.popup.active{
    display:block;
}
.dim.active{
    display:block;
    z-index:99 !important;
}
.popup .popup-content{
    float:left;
    width:100%;
}
.popup .popup-content .left-image-part{
    width:50%;
    float:left;
    display: flex;
    flex-wrap: nowrap;
    align-content: stretch;
    justify-content: center;
    flex-direction: column-reverse;
}
.popup .popup-content .left-image-part img{
    width:100%;
    float:left;
    margin-right:10px;
}
.popup .popup-content .right-txt-part{
    float:left;
    width:100%;
    margin-top:10px;
}
.authors{
    float:left;
    width:100%;
}
.links-vina{
    float:left;
    width:100%;
}
.links-vina a{
    float:left;
    width:100%;
    margin-bottom:10px;
    color:#000;
    border:1px solid #161515;
    margin-top:30px;
    border-top-right-radius:20px;
}
.links-vina a:hover{
    border:1px solid #b18c48;
    border-top-right-radius:20px;
}
.more-film-info{
    float:left;
    width:100%;
    margin-top:30px;
}
.more-film-info span{
    float:left;
    width:100%;
    text-transform: uppercase;
    font-size:18px;
    color:#b18c48;
}
.more-film-info span.bigger{
    font-size:25px;
    font-weight: bold;
}
.authors span{
   float:left;
   width:100%; 
}
.authors span.big{
   float:left;
   width:100%; 
   font-size:18px;
   font-weight: bold;
   margin-top:40px;
}
.img-part1{
    float:left;
    width:200px;
}
.img-part1 img{
    float:left;
    width:100%;
}
.txt-part{
    float:left;
    width:calc(100% - 230px);
    padding-left:20px;
    box-sizing:border-box;
    margin-top:20px;
    font-size:20px;
    color:#fff;
}
.modal__container{
        position: absolute;
    top: 239px;
    /* left: 0px; */
    background: #fff;
    width: 500px;
    margin: 0 auto;
   
}
.modal__content{
    padding:20px !important;
    box-sizing:border-box;
}
@media screen and (max-width: 990px) {
     .logo-vina {
        float: left;
        width: 160px;
        margin-top: 20px;
    }
    .title-logo {
        float: left;
        width: 335px;
        margin: 30px 0px;
        font-size: 40px;
        font-weight: bold;
        margin-left: 50px;
    }
    .title{
        font-size:40px;
    }
}
@media screen and (max-width: 780px) {
     .logo-vina {
        float: left;
        width: 105px;
        margin-top: 55px;
    }
    .title-logo {
        float: left;
        width: 250px;
        margin: 30px 0px;
        font-size: 40px;
        font-weight: bold;
        margin-left: 10px;
        margin-top: 65px;
    }
    .teem-box{
        width:48%;
    }
    .video-box{
        width:100% !important;
        float:left !important;
        margin-bottom:10px;
    }
}
@media screen and (max-width: 560px) {
     iframe{
         width:100%;
     }
     .more-film-info span{
        float:left;
        width:100%;
        text-transform: uppercase;
        font-size:16px;
        color:#b18c48;
    }
}
@media screen and (max-width: 500px) {
     .more-info-film{
         margin-top:0px;
     }
     /*.logo-vina{
         width:70px;
     }   */
     .title-logo{
         width:100%;
         margin-left:0px;
         margin-bottom:0px;
     }
     .more-info-film {
        float: left;
        width: 100%;
        margin-top: 20px;
        background: url(../img/filmlanding/logo-vina.png) no-repeat center;
        background-size: 100%;
    }
    .modal__container{
        top:20px !important;
    }
         .more-info-film p{
         line-height: 25px;
     }
     .teem-box {
        width: 100%;
    }
    .title {
        font-size: 25px;
    }
    .img-part1{
        float:left;
        width:100%;
    }
    .txt-part{
      float:left;
      width:100%;
      font-size:18px;
      margin-top:10px;  
      padding-left:0px;
      margin-bottom:30px;
    }
    .modal__container{
        width:100%;
    }
}
.modal__overlay{
    width:100%;
    height: 100%;
    background:rgba(0,0,0,0.7);
}
.gallery-film{
    float:left;
    width: 100%;
    height: 500px;
    max-height: 500px;
}
.gallery-film .swiper-slide img{
    float:left;
    width:100%;
    height: 245px;
    object-fit:cover;
}
.bottom-prev-next .swiper-button-prev{
         position: absolute;
    top: 210px !important;
    z-index: 9999999999;
    width: 50px;
    height: 95px;
    right: 0;
}
.bottom-prev-next .swiper-button-next{
         position: absolute;
    top: 210px !important;
    z-index: 9999999999;
    width: 50px;
    height: 95px;
    right: 0;
}
#getting-started{
    width:100%;
    float:left;
    text-align:center;
    color:#fff;
    font-size:30px;
    font-weight: bold;
    background:rgba(187,151,85,0.5);
    padding:15px 0px;
    box-sizing:border-box;
    
}
.video-box{
    width:31%;
    margin:0 1%;
    float:left;
}