@charset "utf-8";

#mediaContainer {
	display:none; position: relative;
	flex-direction: row; flex-wrap: nowrap;
	justify-content: center; align-content: center; align-items: center;
	width:100%; height:250px;
	margin:32px auto 0px; padding: 0px;
	/*background-color: yellowgreen;*/
}
#closeBtn {
	display:block; position:absolute;
	top: -16px; margin:0 auto;
	width:32px; height:32px;
	z-index: 100;
	cursor: pointer;
}
#closeBtn:hover {
	-webkit-filter: drop-shadow( -1px 3px 0px rgba(0, 0, 0, .9));
  filter: drop-shadow( -1px 3px 0px rgba(0, 0, 0, .9));
}
.v-vlite {
	display: block; position: relative;
	height:100%;
}
.v-controlBar {
	background-color:darkslategray!important; opacity:0.25!important;
}
.v-progressBar {
	background-color:crimson!important;
}

.button_row {
	display:flex; flex-direction: row; flex-wrap: wrap;
	justify-content: center; align-content: center;
	margin:15px auto 0px;
}

.navBtn {
	display: inline-block; width: 12em; min-height:4em;
	border: solid 2px lightseagreen; border-radius: 0.5em;
	margin:4px 10px; padding: 3px 20px;
	color: teal; background-color: white;
	cursor: pointer;
	font-size: 13pt; line-height: 1.5; font-family: 'Sintony-Bold';
	-moz-box-shadow: 4px 4px 0px 0px teal;
  -webkit-box-shadow: 4px 4px 0px 0px teal;
  box-shadow: 4px 4px 0px 0px teal;
	transition: background 0.4s ease, color 0.4s ease;
}
.navBtn:active {
	box-shadow: none;
}
.navBtn:hover{
	color: white; background-color: teal;
	border: solid 2px floralwhite;
}


#playMedia.disabled {
	background-color: dimgray; color: white;
	-moz-box-shadow: 4px 4px 0px 0px dimgray;
  -webkit-box-shadow: 4px 4px 0px 0px dimgray;
  box-shadow: 4px 4px 0px 0px dimgray;
	border: solid 2px silver;
}
#playMedia.disabled:hover {
	border: solid 2px floralwhite;
	background-color: white; color: dimgray;
}




@media screen and (max-width: 980px) {
#frame_titles { /* slides */
	width:100%; padding-bottom:45%;
	margin: 0px auto 15px auto!important;
	/*background-color: peru;*/
}
}

@media screen and (max-width: 690px) {

#frame_titles {
	width:100%; height: 350px;
	margin: 0px auto 15px auto!important; padding:0;
}
#iframe3 {
	width:100%; height: 350px;
}
}