/* mini reset */
body, div, span, p, h1, img, a, figure, object {
	margin: 0;
	padding: 0;
	border: 0;
}

body {
	background: #000000;
	font-size: 10px;
	font-family: arial;
}

a {
	text-decoration: none;
}

object {
	display: block;
}


/* general styles, for all resolutions */



/* page content */
.body {
	width: 100%;
	text-align: center;
}

/* page title */
.vsl_title {
	display: block;
	height: 200px;
	background: url("http://blackoutusa.com.s3.amazonaws.com/isisbg3-top.jpg") no-repeat center center;
}

.split1013_title {
	display: block;
	height: 200px;
	background: url("http://blackoutusa.com.s3.amazonaws.com/assets/headline2.jpg") no-repeat center center;
}
.split1012_title {
	display: block;
	height: 200px;
	background: url("http://blackoutusa.com.s3.amazonaws.com/assets/headline1.jpg") no-repeat center center;
}


/* sound notification */
.sound_info {
	text-indent: 5px;
	text-align: center;
	color: #000000;
	background: #808080;
	opacity: 0.8;
}
.sound_info img {
	display: inline-block;
	width: 27px;
	height: 23px;
	vertical-align: bottom;
}
.sound_info span {
	font-weight: bold;
}


/* video player container */
.video_player {
	position: relative;
	background:url("../img/responsive/blackoutusa_video_placeholder.jpg") no-repeat top center;
}

/* resume video message */
.resume_video {
	position:relative;
	top:230px;
	display: none;
	width: 103px;
	height: 101px;
	margin: 0 auto;
	cursor: pointer;
	background:url("../img/resume-video.png") no-repeat top center;
}


.tsl-button{background:url("../img/transcript-bg.png") no-repeat top center; margin:auto;max-width:461px;height:50px;padding-top:20px;}
.tsl-button p a{font-size:17px;text-decoration:none;color:black;top:-2px;position:relative;letter-spacing:-1px;}

/* video iframe */
.vzaar_video_player {
	display: block;
}


/* buy btn */
.action_div {
	display: block;
}
.action_div a {
	display: block;
}
.action_div img {
	display: block;
}

.seen_text {
	display: block;
	color: #ffffff;
	font-weight: bold;
	overflow: hidden;
}
.seen_img {
	display: block;
	margin: 15px auto 0 auto;
	overflow: hidden;
}


/* footer container */
.footer {
	line-height: 13px;
	font-weight: bold;
	text-align: center;
	color: #ffffff;
	overflow: hidden;
}
/* footer links */
.footer a {
	color: #ffffff;
}
/* footer image */
.footer img {
	display: block;
}
/* footer copyright text */
.footer span {
	font-size: 11px;
}


/* small screen devices with a maximum width of 788px - video resolution width */
@media screen and (max-width: 788px) {
	.vsl_title {
		height: 60px;
		line-height: 60px;
		background-size: cover;
	}

	.sound_info {
		width: 100%;
		line-height: 12px;
		padding-bottom:1px;
		overflow: hidden;
	}
	.sound_info img {
		float: left;
		vertical-align: middle;
	}

	.video_container {
		display: block;
		width: 100%;
		margin: 10px auto 0 auto;
		overflow: hidden;
	}
	.video_player {
		display: block;
		width: 100%;
		padding-bottom: 56.25%;
		padding-top: 30px;
		/*
		commented because of safari 5.1 for windows
		height: 0;*/
		border: 0;
	}
	/* video iframe */
	.vzaar_video_player {
		overflow: hidden;
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}

	/* because of safari 5.1.7 */
	object {
		max-height: 480px;
	}

	.action_div {
		margin: 5px 0;
		overflow: auto;
	}
	.action_div a {
		margin: 0 auto;
		max-width: 469px;
		max-height: 147px;
	}
	.action_div img {
		display: block;
		max-width: 100%;
	}

	.seen_text {
		margin: 15px 0 10px 0;
		font-size: 12px;
	}
	.seen_img {
		max-width: 70%;
	}

	.footer {
		margin: 40px 0 10px 0;
		overflow: hidden;
	}
	.footer img {
		max-width: 60%;
		max-height: 49px;
		margin: 5px auto;
		overflow: auto;
	}
}



/* special conditions for video player: if screen width is greater than video width */
@media (min-width: 789px) and (max-width: 1920px) {
	.sound_info {
		display: inline-block;
		height: 29px;
		margin: 100px auto 0 auto;
		line-height: 29px;
		font-size: 16px;
		overflow: hidden;
	}
	.sound_info img {
		vertical-align: middle;
	}

	.video_container {
		width: 788px;
		height: 480px;
		margin: 15px auto 0 auto;
		/*border: 9px solid #a6a8a6;
		outline: 1px solid #912B2B;*/
		overflow: hidden;
	}
	.video_player {
		width: 788px;
		height: 480px;
	}
}
@media (min-width: 1921px) and (max-width: 2300px) {
	.sound_info {
		display: inline-block;
		height: 40px;
		margin: 110px auto 0 auto;
		line-height: 40px;
		font-size: 28px;
		overflow: hidden;
	}
	.sound_info img {
		vertical-align: middle;
	}

	.video_container {
		width: 46%;
		margin: 30px auto 0 auto;
		overflow: hidden;
	}
	.video_player {
		width: 100%;
		min-height: 538px;
	}
	object, video {
		min-height: 538px;
	}
}
@media (min-width: 2301px) and (max-width: 2700px) {
	.sound_info {
		display: inline-block;
		height: 40px;
		margin: 110px auto 0 auto;
		line-height: 40px;
		font-size: 28px;
		overflow: hidden;
	}
	.sound_info img {
		vertical-align: middle;
	}

	.video_container {
		width: 46%;
		margin: 40px auto 0 auto;
		overflow: hidden;
	}
	.video_player {
		width: 100%;
		min-height: 645px;
	}
	object, video {
		min-height: 645px;
	}
}
@media (min-width: 2701px) and (max-width: 3100px) {
	.sound_info {
		display: inline-block;
		height: 40px;
		margin: 110px auto 0 auto;
		line-height: 40px;
		font-size: 28px;
		overflow: hidden;
	}
	.sound_info img {
		vertical-align: middle;
	}

	.video_container {
		width: 46%;
		margin: 50px auto 0 auto;
		overflow: hidden;
	}
	.video_player {
		width: 100%;
		min-height: 757px;
	}
	object, video {
		min-height: 757px;
	}
}
@media (min-width: 3101px) {
	.sound_info {
		display: inline-block;
		height: 40px;
		margin: 110px auto 0 auto;
		line-height: 40px;
		font-size: 28px;
		overflow: hidden;
	}
	.sound_info img {
		vertical-align: middle;
	}

	.video_container {
		width: 46%;
		margin: 50px auto 0 auto;
		overflow: hidden;
	}
	.video_player {
		width: 100%;
		min-height: 869px;
	}
	object, video {
		min-height: 869px;
	}
}



/* special condition for background image */
@media screen and (max-width: 788px) {
	.vsl {
		background: #000000;
		max-width: 788px;
		min-height: 400px;
		overflow: auto;
	}
}
@media (min-width: 789px) and (max-width: 1400px) {
	.vsl {
		background: #000000 url("http://blackoutusa.com.s3.amazonaws.com/blackoutusa_bg_isis_3_w1200px_h0826px.jpg") no-repeat top center;
		background-size: cover;
		max-width: 1400px;
		min-width: 789px;
		min-height: 846px;
	}
}
@media (min-width: 1401px) and (max-width: 1920px) {
	.vsl {
		background: #000000 url("http://blackoutusa.com.s3.amazonaws.com/blackoutusa_bg_isis_3_w1580px_h1087px.jpg") no-repeat top center;
		background-size: cover;
		min-width: 1401px;	/* min media query value */
		max-width: 1920px;	/* max media query value */
		min-height: 1113px;	/* img height */
	}
}
@media screen and (min-width: 1921px) {
	.vsl {
		background: #000000 url("http://blackoutusa.com.s3.amazonaws.com/blackoutusa_bg_isis_3_w1920px_h1321px.jpg") no-repeat top center;
		background-size: cover;
		min-width: 1920px;	/* media query value */
		min-height: 1353px;	/* img height */
	}
}



/* medium screen devices, width between 789 px and 1400px */
@media (min-width: 789px) and (max-width: 1400px) {
	.vsl_title {
		height: 90px;
		line-height: 90px;
		background-size: cover;
	}

	.action_div {
		height: 147px;
		margin: 30px 0;
		overflow: hidden;
	}
	.action_div a {
		display: block;
		width: 469px;
		height: 147px;
		margin: 0 auto;
	}
	.action_div img {
		display: block;
		width: 469px;
		height: 147px;
	}

	.seen_text {
		margin: 25px 0 15px 0;
		font-size: 16px;
	}
	.seen_img {
		width: 553px;
		height: 41px;
	}

	.footer {
		margin: 60px 0 10px 0;
		overflow: hidden;
	}
	.footer img {
		width: 339px;
		height: 49px;
		margin: 10px auto;
		overflow: auto;
	}
}



/* big screen devices */
@media (min-width: 1401px) and (max-width: 1920px) {
	.action_div {
		height: 147px;
		margin: 40px 0;
		overflow: hidden;
	}
	.action_div a {
		width: 469px;
		height: 147px;
		margin: 0 auto;
	}
	.action_div img {
		width: 469px;
		height: 147px;
	}

	.seen_text {
		margin: 60px 0 25px 0;
		font-size: 16px;
	}
	.seen_img {
		width: 553px;
		height: 41px;
	}

	.footer {
		margin: 130px 0 10px 0;
		overflow: hidden;
	}
	.footer img {
		width: 339px;
		height: 49px;
		margin: 20px auto 0 auto;
		overflow: auto;
	}
}



/* veri big oans. amazon kindle alike */
@media (min-width: 1921px) {
	.vsl_title {
		background-size: cover;
	}
	.action_div {
		height: 147px;
		margin: 40px 0;
		overflow: hidden;
	}
	.action_div a {
		width: 469px;
		height: 147px;
		margin: 0 auto;
	}
	.action_div img {
		width: 469px;
		height: 147px;
	}

	.seen_text {
		margin: 60px 0 25px 0;
		font-size: 16px;
	}
	.seen_img {
		width: 553px;
		height: 41px;
	}

	.footer {
		margin: 130px 0 10px 0;
		overflow: hidden;
	}
	.footer img {
		width: 339px;
		height: 49px;
		margin: 20px auto 0 auto;
		overflow: auto;
	}
}