/* Lightbox Popup */
.modal{display:none;position:fixed;z-index:10000;padding-top:100px;padding-top:5vh;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:#24282b;background-color:rgba(35,35,35,0.5)}
.modal-content{position:relative;background-color:white;margin:auto;padding:0;width:80%;box-shadow:0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.2);-webkit-animation-name:animatetop;-webkit-animation-duration:.4s;animation-name:animatetop;animation-duration:.4s}

.videoWrapper {position:relative; padding-bottom:56.25%;padding-top:0px; height:0; overflow:hidden;}
	.videoWrapper iframe, .videoWrapper object, .videoWrapper embed {position:absolute;top:0;left:0;width:100%; height:100%;}

	@-webkit-keyframes animatetop {
		from {
			top: -300px;
			opacity: 0
		}
		to {
			top: 0;
			opacity: 1
		}
	}
	@keyframes animatetop {
		from {
			top: -300px;
			opacity: 0
		}
		to {
			top: 0;
			opacity: 1
		}
	}

button.play-video {color:white; background:transparent; padding:0; min-width:40px; margin-right:10px; width:75px; height:75px; border-radius:50px; border:1px solid white; display:inline-block; text-align:center; line-height:75px;}


.close{color:white; position:absolute; z-index:100; right:20px; top:10px; font-size:40px; line-height:40px;}
.close:hover,.close:focus{color:#f5a81d;cursor:pointer}

.modal-body{padding:2em;text-align:left;}

@media only screen and (max-width:768px) {
	.modal-content{width:90%;}
	.modal-body {padding: 1em;}
	button.play-video {min-width:40px; width:40px; height:40px; line-height:40px;}
}