/* Custom css */
.vjs-default-skin { color: rgba(255,255,255,1.0); }
.vjs-default-skin .vjs-play-progress, .vjs-default-skin .vjs-volume-level { background-color: rgba(132,120,164,0.7); }
.vjs-default-skin .vjs-big-play-button { background: rgba(132,120,164,0.7); font-size: 1.7em;}
.vjs-default-skin .vjs-control-bar { background: rgba(66,60,82,0.8);  }
/* making the video responsive */
.video-js {padding-top: 56.25%}
.vjs-fullscreen {padding-top: 0px}
/* responsive video wrapper for one col section */
/* figure */
figure.videocontent {
	width: auto;
	max-width: 100%;
	max-height: 100%;
	height: auto !important;
	margin: 0px auto;
	border: 1px dotted rgba(0,0,0,0.75);
}
figure.videocaption{
	text-align: center;
	margin: 0px;
	font-size: 0.8em;
	padding: 5px 0px;
	line-height: 16px;
	color: rgba(132,120,164,1.0);
}
.sec1_art1 figure.videocontent {
	max-width: 50%;
}
.sec2_art1 figure.videocontent, .sec2_art2 figure.videocontent {
	max-width: 90%;
}
figure.videoexternal {
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 0px;
	height: 0px;
	overflow: hidden;
	box-shadow: 2px 2px 3px 1px rgba(0,0,51,0.5);
}

figure.videoexternal iframe, figure.videoexternal object, figure.videoexternal embed {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}
/* div */
div.videocontent {
	width: auto;
	max-width: 100%;
	max-height: 100%;
	height: auto !important;
	margin: 0 auto;
	border: 1px dotted rgba(0,0,0,0.75);
}
div.videocaption{
	text-align: center;
	margin: 0px;
	font-size: 0.8em;
	padding: 5px 0px;
	line-height: 16px;
	color: rgba(132,120,164,1.0);
}
.sec1_art1 div.videocontent {
	max-width: 50%;
}
.sec2_art1 div.videocontent, .sec2_art2 div.videocontent {
	max-width: 90%;
}
div.videoexternal {
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 0px;
	height:0;
	overflow: hidden;
	box-shadow: 2px 2px 3px 1px rgba(0,0,51,0.5);
}

div.videoexternal iframe, div.videoexternal object, div.videoexternal embed {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}
/* HTML5 Media CSS - MEDIA QUERIES FOR A RESPONSIVE LAYOUT */
@media all and (max-width: 765px) {
	.sec1_art1 div.videocontent {
		max-width: 90%;
	}
	.sec2_art1 div.videocontent, .sec2_art2 div.videocontent, .sec3r_art1 div.videocontent {
		max-width: 90%;
	}
}
@media all and (max-width: 590px) {
	.sec1_art1 div.videocontent {
		max-width: 90%;
	}
}
@media all and (max-width: 500px) {
	.sec1_art1 div.videocontent, .sec2_art1 div.videocontent, .sec2_art2 div.videocontent, .sec3r_art1 div.videocontent {
		max-width: 93%;
	}
}