#parent_video_popup{
background: rgba(33,33,33,0.6);
display: none;
position: fixed;
z-index: 99;
top: 0;
left: 0;
bottom: 0;
right: 0;
}

#child_video_popup{
background: #fff;
max-width: 100%;
max-height: 100%;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
-webkit-box-shadow: 0px 0px 20px #000;
-moz-box-shadow: 0px 0px 20px #000;
box-shadow: 0px 0px 20px #000;
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
border-radius: 0px;
}


@media all and (max-width: 768px) {
#child_video_popup {display:none;visibility: hidden;}
#parent_video_popup {display:none;visibility: hidden;}
}


.close-video-popup{
background-color: rgba(0, 0, 0, 0.6);
border: 2px solid #ccc;
height: 24px;
line-height: 24px;
position: absolute;
right: -24px;
cursor: pointer;
font-weight: bold;
text-align: center;
text-decoration: none;
color: rgba(255, 255, 255, 0.9);
font-size: 14px;
text-shadow: 0 -1px rgba(0, 0, 0, 0.9);
top: -24px;
width: 24px;
-webkit-border-radius: 15px;
-moz-border-radius: 15px;
-ms-border-radius: 15px;
-o-border-radius: 15px;
border-radius: 15px;
-moz-box-shadow: 1px 1px 3px #000;
-webkit-box-shadow: 1px 1px 3px #000;
box-shadow: 1px 1px 3px #000;
}

.close-video-popup:hover{
background-color: rgba(0, 122, 200, 0.8);
}