@charset "UTF-8";
/*
    Name: YouTubePopUp
    Description: jQuery plugin to display YouTube video in PopUp, responsive and retina, easy to use.
    Version: 1.0.0
    Plugin URL: http://wp-time.com/youtube-popup-jquery-plugin/
    Written By: Qassim Hassan
    Twitter: @QQQHZ
    Websites: wp-time.com | qass.im | wp-plugins.in
    Dual licensed under the MIT and GPL licenses:
        http://www.opensource.org/licenses/mit-license.php
        http://www.gnu.org/licenses/gpl.html
    Copyright (c) 2016 - Qassim Hassan
*/
.YouTubePopUp-Wrap {
    position: fixed;
    width: 100%;
    height: 100%;
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.8);
    top: 0;
    left: 0;
    opacity: 0;
    z-index: 9999999999999;
    -webkit-animation-duration: .5s;
    animation-duration: .5s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-name: YouTubePopUp;
    animation-name: YouTubePopUp;
    cursor: pointer
}

@-webkit-keyframes YouTubePopUp {
    0% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

@keyframes YouTubePopUp {
    0% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

body.logged-in .YouTubePopUp-Wrap {
    top: 32px;
    z-index: 99998
}

.YouTubePopUp-Content {
    max-width: 1120px;
    display: block;
    margin: 0 auto;
    height: 100%;
    position: relative
}

.YouTubePopUp-Content iframe {
    max-width: 100%!important;
    width: 100%!important;
    display: block!important;
    height: 630px!important;
    border: none!important;
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto 0
}

.YouTubePopUp-Hide {
    -webkit-animation-duration: .5s;
    animation-duration: .5s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-name: YouTubePopUpHide;
    animation-name: YouTubePopUpHide
}

@-webkit-keyframes YouTubePopUpHide {
    0% {
        opacity: 1
    }
    100% {
        opacity: 0
    }
}

@keyframes YouTubePopUpHide {
    0% {
        opacity: 1
    }
    100% {
        opacity: 0
    }
}

.YouTubePopUp-Close {
    position: absolute;
    top: 18vh;
    cursor: pointer;
    right: 0;
    margin: auto 0;
    font-size: 30px;
    text-align: center;
    color: #fff;
	opacity: .8
}

.YouTubePopUp-Close:hover {
    opacity: 1;
}

@media screen and (min-width: 1368px) and (max-width: 1680px) {
    .YouTubePopUp-Close {
        top: 60px;
    }
}

@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px)
  and (orientation: portrait) {
	 .YouTubePopUp-Close { position: absolute;top: 24rem;font-size: 26px;}
	 .YouTubePopUp-Content {max-width: 90%}
	 .YouTubePopUp-Content iframe {height:420px!important}
}

@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px)
  and (orientation: landscape) {
	 .YouTubePopUp-Close { position: absolute;top: 10px;font-size: 26px;}
	 .YouTubePopUp-Content {max-width: 98%}
}

/* Ipad Pro Portrait */
@media only screen 
  and (min-device-width: 834px)
  and (max-device-width: 834px)
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 2) {
	 .YouTubePopUp-Close { position: absolute;top: 25rem;font-size: 26px;}
	 .YouTubePopUp-Content {max-width: 98%}
	 .YouTubePopUp-Content iframe {height:480px!important}
}

@media only screen 
  and (min-device-width: 834px) 
  and (max-device-width: 834px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 2) {
	.YouTubePopUp-Close { position: absolute;top: 10px;font-size: 26px;}
	.YouTubePopUp-Content {max-width: 98%}
}
@media all and (max-width: 767px) and (min-width: 10px){
    .YouTubePopUp-Content {max-width: 98%}
	.YouTubePopUp-Close {
		position: absolute;
		font-size: 24px;
	}
}

@media all and (max-width: 767px) and (min-width: 10px) and (orientation: portrait){
	.YouTubePopUp-Close {
		top: 15rem;
		right: 0px;
	}
	.YouTubePopUp-Content iframe {height: 220px!important}
}

@media all and (max-width: 767px) and (min-width: 10px) and (orientation: landscape){
	.YouTubePopUp-Close {
		top: 15px;
		right: 0px;
	}
	.YouTubePopUp-Content iframe {height: 250px!important}
}