@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; } }