@charset "UTF-8";



/*

    Name: YouTubePopUp | Style

    Description: jQuery plugin to display YouTube, Vimeo, and MP4 video in a pop-up. Responsive, retina ready, and easy to use.

    Version: 1.1.2

    Written By: Alobaidi

    Live Demo: https://wp-plugins.in/VP-Live-Demos

    Copyright 2020 Alobaidi (email: wp-plugins@outlook.com)

*/



.YouTubePopUp-Wrap{

    position:fixed;

    width:100%;

    height:100%;

    background-color:#000;

    background-color:rgba(0,0,0,0.8);

    top:0;

    left:0;

    z-index:2147483647;

}



.Video-PopUp-Content{

    display: -webkit-box; 

    display: -moz-box;

    display: -ms-flexbox;

    display: -webkit-flex; 

    display: flex;

    -webkit-box-align: center;

    -moz-box-align: center;

    -ms-flex-align: center;

    -webkit-align-items: center;

    align-items: center;

    justify-content: center;

    -webkit-justify-content:center;

    width:100%;

    height:100%;

}



.vp-flex{

   max-width:800px;

   width:100%;

   height:450px;

   max-height:90%;

   margin:0 40px;

   position:relative;

   background-color:#000;

}



.vp-flex iframe, .vp-flex video{

    width:100%;

    height:100%;

    max-width:100% !important;

    max-height:100%;

    min-width:100%;

    min-height:100%;

    margin: 0 !important;

    padding: 0 !important;

    outline: none !important;

    display:block;

    border:5px solid #fff;

    border-radius:3px;

    -moz-border-radius:3px;

    -webkit-border-radius:3px;

    box-shadow:0px 2px 10px 0px rgba(0, 0, 0, 0.3);

    -moz-box-shadow:0px 2px 10px 0px rgba(0, 0, 0, 0.3);

    -webkit-box-shadow:0px 2px 10px 0px rgba(0, 0, 0, 0.3);

    background-color:#000;

    box-sizing: border-box;

    -webkit-box-sizing: border-box;

    -moz-box-sizing: border-box;

}



.YouTubePopUp-Close{

    position:absolute;

    top:0px;

    cursor:pointer;

    left:-36px;

    margin:auto 0;

    transition:all ease-in-out 0.3s;

    -webkit-transition:all ease-in-out 0.3s;

    -moz-transition:all ease-in-out 0.3s;

    -o-transition:all ease-in-out 0.3s;

}



.YouTubePopUp-Close:before{

    font-family: 'vp-close-icon' !important;

    speak: none !important;

    font-style: normal !important;

    font-weight: normal !important;

    font-variant: normal !important;

    text-transform: none !important;

    line-height: 1 !important;

    -webkit-font-smoothing: antialiased !important;

    -moz-osx-font-smoothing: grayscale !important;

    content: "\61";

    text-shadow: 0px 1px 2px rgba(0, 0, 0, 0.9);

    font-size:26px;

    color:#fff;

}



.YouTubePopUp-Close:hover{

    opacity:0.5;

}



.vp-flex.vp-flex-no-border iframe,

.vp-flex.vp-flex-no-border video{

    padding:0 !important;

    border: 0 !important;

    border-radius: 0 !important;

    -moz-border-radius:0 !important;

    -webkit-border-radius:0 !important;

}



.vp-flex-no-border.vp-vt-locally,

.vp-flex-no-border.vp-vt-vimeo{

    box-shadow:none;

   -moz-box-shadow:none;

   -webkit-box-shadow:none;

}



/* Tablet & Mobile Style */

@media all and (max-width: 782px){

    .vp-flex, .Video-PopUp-Content .vp-flex{

        max-width:480px !important;

        height:270px !important;

    }

}



@media all and (max-width: 320px){

    .vp-flex, .Video-PopUp-Content .vp-flex{

        max-width:240px !important;

        height:140px !important;

    }

}