/********************************\
story_style.css
Styling for homepage with scrolling banners
\********************************/

.story-background {
	width: 100%; 
	height: 695px;
	padding: 0;
	margin: 0;
	position: relative;
	background: white 50% 0 no-repeat fixed;
	box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.30) inset;
	-webkit-background-size:cover;moz-background-size:cover;-o-background-size:cover;background-size:cover;background-position:center;
	z-index:-10;
}
.story-banner {
	width: 100%; 
	height: 420px;
	padding: 0;
	margin: 0; 
	position: relative; 
	background-color: white;
}
.story-banner article {
	width: 100%;
	line-height: 1.5em;
	position: absolute;
	padding-top: 5%;
}
.story-banner .imgbanner {
	position: relative;
	margin-left: 20%;
	margin-bottom: 200px;
	float: left;
	padding: 0px 20px 0px 0px;
}
.story-banner .txt {
	padding: 3% 15% 0px 15%;
}
.story-banner article h3 {
	text-align: left;
	font-family: Voltaire, Futura, Trebuchet MS, sans-serif;
	color: #2e318b;
	font-size: 46px;
	margin-top: 20px;
	line-height: 46px;
}
.story-banner article p {
	text-align: left;
	margin-bottom: 10px;
	font-size: 16px;
	color: black;
	margin-top: 20px
}
section.story-banner:nth-of-type(4n-2) p {
	text-align: right;
}
section.story-banner:nth-of-type(4n-2) h3 {
	text-align: right;
}
section.story-banner:nth-of-type(4n-2) img.imgbanner {
	float:right;
	margin-right:20%;
	margin-left: 0px;
	padding: 0px 0px 0px 20px;
}
#first-text {
	background: no-repeat scroll center center / contain transparent;
	position: absolute;
	top: 0px;
}
#theend { padding: 0px 0;vertical-align:middle}
#theend article {  
	width: 100%;
	color: black; 
	position: absolute; 
	top: 0;
	line-height: 1.5em;
	padding: 10px 0; 
	margin: 200px 0 0 0;
	/*background-color: rgba(0, 0, 0, 0.4);
	border-color: transparent;
	-webkit-border-radius: 6px  6px  6px  6px;
	-moz-border-radius: 6px 6px 6px 6px;
	 border-radius: 6px 6px 6px 6px;*/
 }
#theend article h3 {
	text-align: center;
	font-family: Voltaire, Futura, Trebuchet MS, sans-serif;
	color: #2e318b;
	font-size: 46px;
	margin-top: 20px;
	line-height: 46px;
}
#theend article p {
	text-align: center;
	margin-bottom: 10px;
	font-size: 16px;
	color: black;
	margin-top: 20px;
}
#theend article a {
	color: black;
}
@media all and (max-width : 1200px) {
	.story-banner .imgbanner {
		position: relative;
		margin-left: 10%;
		margin-bottom: 200px;
		float: left;
		padding: 0px 20px 0px 0px;
	}
}
@media all and (max-width : 1000px) {
	.story-banner .imgbanner {
		position: relative;
		margin-left: 2%;
		margin-bottom:0;
		float: left;
		padding: 0px 20px 0px 0px;
	}
	.imgbanner  {
		width:40%;
		height:auto;
	}
	.story-banner article h3 {
		text-align: left;
		font-family: Voltaire, Futura, Trebuchet MS, sans-serif;
		color: #2e318b;
		font-size: 23px;
		margin-top: 20px;
		line-height: 23px;
	}
	.story-banner article p {
		text-align: justify;
		margin-bottom: 0;
		font-size: .85em;
		color: black;
		margin-top: 20px;
	}
}