#video-area-wrap{
  width: 100%;
  padding-left: 8.125%;
  padding-right: 8.125%;
}


    .video-container{
        margin-top: 100px;
    }
        .video-big {
            width: 84.38%;
            position: relative;
            float: left;
            margin-left: 0.5%;
        }
            .video-big .videoholder{
                position: absolute;
                left: 0;
                top: 0;
                width: 100%;
                height: 100%;
            }
            .video-big .photoholder{
                position: absolute;
                left: 0;
                top: 0;
                width: 100%;
                height: 100%;
                display: none;
            }
            .video-big canvas{
                display: block;
                background: #000;
                width: 100%;
            }
            .video-big video{
                display: block;
                width: 100%;
                height: 100%;
              
            }

            .video-big .photoholder canvas {
                background-size: auto 100%;
                background-repeat: no-repeat;
                background-position: center center;
            }
        .video-first-sets {
            width: 13.4%;
            float: right;
            margin-right: 0.5%;
        }
        .mdl-logo{
            width: 100%;
        }
            .mdl-logo img{
                display: block;
                width: 100%;
            }
        .video-lists {
            width: 100%;
            height: calc( 87.6% / 3 );
            padding-top: 7%;
        }
            .video-lists a{
                display: block;
                background: #959595;
                height: 100%;
            }
            .video-lists canvas{
                display: block;
                width: 100%;
                height: 100%;
                background-size: cover;
                transition: all 0.2s linear;
                opacity: 0.5;
            }
                .video-lists a:hover canvas{
                    opacity: 1;   
                }

    .video-second-sets{
        display: block;
        float: left;
        width: 100%;
        margin-top: 20px;
    }
    .video-second-sets .video-lists{
        width: calc( 100% / 5);
        height: auto;
        float: left;
        padding: 0 0.5%;

    }   

#behind-scene{
    width: calc( 100% - 30px );
    margin: 15px auto 0;
    background: url(../../images/tv/bg.jpg) no-repeat center top transparent;
    background-size:cover;
}

    #behind-scene .behind-scene-wrapper{
        padding-left: 8%;
        padding-right: 8%;
        margin-top: 60px;
    }

         #behind-scene .behind-scene-wrapper h2{
            margin: 0 !important;
            display: inline-block;
            position: relative;
            min-height: 155px;
            padding: 50px 0 40px;
            font-weight: 400;
            font-family: 'Italiana', serif;
            font-size: 85px;
            color: #0a0a0a;
            letter-spacing: 0.05em;
            line-height: 0.8;
            text-transform: uppercase;
         }

            #behind-scene .behind-scene-wrapper h2 span{
                display: block;
                margin-bottom: 20px;
                font-weight: 500;
                font-family: 'Quicksand', sans-serif;
                font-size: 15px;
                letter-spacing: 0.55em;
            }
            .behind-scene-photos {
                display: flex;
            }

                .behind-scene-photos .photos-lists{
                    width: calc( 100% / 5);
                    position: relative;
                    background: #959595;
                    cursor: pointer;
                    margin: 0 0.5%;
                }
                    .behind-scene-photos .photos-lists > canvas{
                        display: block;
                        width: 100%;
                        height: auto;
                        opacity: 0.5;
                        transition: all 0.2s linear;
                        background-position: center;
                        background-size: cover;
                    } 
                        .behind-scene-photos .photos-lists:hover > canvas{
                            opacity: 1;
                        }

                    .behind-scene-photos .photos-lists .photo-poup{
                        display: block;
                        background: #000;
                        position: absolute;
                        top: -150px;
                        left: -150px;
                        width: calc(100% + 300px);
                        height: calc(100% + 300px);
                        visibility: hidden;
                        opacity: 0;
                        transition: all 0.3s, opacity 0.3s ease-in-out;
                        transform: scale(0.5);
                        cursor: default;
                    }
                        .behind-scene-photos .photos-lists.active .photo-poup {
                            transform: scale(0.9);
                            visibility: visible;
                            opacity: 1;
                            z-index: 99;
                        }
                            .behind-scene-photos .photos-lists .photo-poup canvas{
                                display: block;
                                width: 100%;
                                height: auto;
                                transition: all 0.2s linear;
                                /* background-size: 100% auto; */
                                background-size: cover;
                                background-position: center center;
                                background-repeat: no-repeat;
                            }

                    .behind-scene-photos .photos-lists .photo-poup .close-image{
                        position: absolute;
                        top: 20px;
                        right: 20px;
                        z-index: 2;
                        cursor: pointer;
                        font-size: 32px;
                        color: #FFF;
                        text-shadow: 0px 1px 3px rgba(0,0,0,0.3);
                    }
                    #videos-btns-holder {
                        text-align: center;
                        padding: 62px 0;
                    }

                    #videos-btns-holder a {
                        width: 100%;
                        padding: 7px 0;
                        font-size: 18px;
                        margin: 0 5px;
                        max-width: 350px;
                    }


@media only screen and (max-width: 1440px) {
.behind-scene-photos .photos-lists:last-child .photo-poup {
    left: 0;
    transform: translateX(-50%);
}

.behind-scene-photos .photos-lists:first-child .photo-poup {
    left: auto;
    right: 0;
    transform: translateX(50%);
}
}

/* iPad(landscape) | iPad(landscape) | Galaxy Tab 4 (landscape) | Galaxy Tab 3 (landscape) */ 
@media only screen and (max-width: 1199px) {
    #videos-btns-holder{
        font-size: 0;
    }
        #videos-btns-holder a{
            font-size: 13px;
            margin: 0;
            max-width: calc( calc(100% / 3) - 5px );
        }
        #videos-btns-holder a:nth-of-type(2){
            margin: 0 5px;
        }

} 

/* iPad(portrait) | Galaxy Tab 4(portrait)  */ 
@media only screen and (max-width: 991px) {
    .behind-scene-photos .photos-lists .photo-poup {
        left: 50%!important;
        right: auto!important;
        top: 50%!important;
        transform: translate(-50%,-50%)!important;
        width: calc(100% + 50px);
        height: calc(100% + 50px);
    }
} 

/* Galaxy Tab 3(portrait) | Galaxy S5(landscape) */ 
@media only screen and (max-width: 767px) {
    .video-big{
        width: 100%;
        margin: 0;
        float: none;
    }
    .mdl-logo {
        width: calc(100% /2);
        float: left;
    }
    .video-first-sets{
        width: 100%;
        float: none;
        margin: 0;
    }
    .video-lists {
        width: calc(100% / 2);
        height: auto;
        padding-top: 0;
        float: left;
    }
    .video-second-sets .video-lists {
        width: calc( 100% / 2);
        height: auto;
        float: left;
        padding: 0;
    }
    .video-second-sets{
        margin-top: 0;
    }
    .behind-scene-photos{
        display: flex;
        flex-direction: column;
    }
    #behind-scene .behind-scene-wrapper h2{
        font-size: 60px;
    }
    .behind-scene-photos .photos-lists {
        width: 100%;
    }
    #videos-btns-holder a {
        width: 100%;
        font-size: 18px;
        margin: 10px 0!important;
        max-width: 100%;
    }
}

/* Galaxy S5(portrait) | iPod Touch(landscape) | iPod Touch(portrait) */ 
@media only screen and (max-width: 480px) {
    .behind-scene-photos .photos-lists .photo-poup{
        /* transform: scale(0.6) !important; */
    }
    #videos-btns-holder a{
        max-width: 100% !important;
    }
    #videos-btns-holder a:nth-of-type(2){
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
}