@import url("html5reset-1.6.1.css");
@import url("../fonts/kaushanscript/stylesheet.css");
@import url("../fonts/Quicksand/stylesheet.css");
@import url("../fonts/Cantarell-fontfacekit/stylesheet.css");
@import url("../fonts/Raleway/stylesheet.css");
@import url("../fonts/font-awesome-4.3.0/css/font-awesome.min.css");
html {
	position: absolute;
	height: 100%;
	min-height: 100%;
	width: 100%;
	margin: 0; padding: 0;
	display: table;	
	background: #666;
	/* Fix for FF bolded fonts bug */
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	/* Hack to prevent iOS resizing */
	-webkit-text-size-adjust: none;
}
body {
	position: relative;
	height: 100%;
	width: 80%;
	max-width: 768px;
	margin: 0 auto;
	border-left: 1px solid #eee;
	border-right: 1px solid #eee;
	font-family: Arial, sans-serif;
	background: white;
	display: table;
	z-index: 1;
	overflow-x: hidden;
}
body * {
	-webkit-transition-duration: .5s;
	-moz-transition-duration: .5s;
	-ms-transition-duration: .5s;
	-o-transition-duration: .5s;
	transition-duration: .5s;
}
.left { float: left;}
.right { float: right;}
.center { margin-left: auto; margin-right: auto; display: block;}
.centertext { text-align: center;}
.clear { clear: both;}
#masthead {
	position: relative;
	height: 62px;
	width: 100%;
	padding: 0; margin: 0;
	background: rgb(46,46,46);
	border-top: 6px solid rgb(209,74,23);
	z-index: 9999;
}
	#masthead_text {
		height: 62px;
		line-height: 62px;
		margin: 0 auto;
		font-family: 'kaushan_scriptregular','Brush Script',script,serif;
		font-size: 52px;
		font-weight: normal;
		color: rgb(169,186,124);
		text-shadow: 1px 1px 1px rgb(46,46,46);
		display: block;
		text-align: center;
	}

#slogan {
	margin: 0;
	padding: 0px;
	background: rgb(169,186,124);
	font-size: 18px;
	color: rgb(46,46,46);
	text-align: center;
	display: block;
}
	#slogan span {
		display: block;
		vertical-align: middle;
		font-family: 'kaushan_scriptregular','Brush Script',script,serif;
		font-size: 24px;
		padding: 20px;
		line-height: 32px;
	}
#fold {
	clear:both;
	margin-top: 10px;
	width: 100%;
	border-top: 10px solid rgb(139,197,63);
}
#mainbody {
	margin-left: 30px;
	margin-right: 235px;
	padding-bottom: 100px;
}

#mainbody div.pic {
	width: 190px;
	display: table;
	text-align: center;
	margin: 0px 10px 10px 10px;
}
	#mainbody div.pic img {
		width: 100%;
		height: auto;
		border: 1px solid #eee;
	}

	#mainbody div.pic p.caption {
		font-size: 12px;
		font-style: oblique;
		font-weight: bold;
	}
#mainbody h3.header {
	margin: 54px 0 40px 0;
	color: rgb(209,74,23);
	font-family: 'kaushan_scriptregular','Brush Script',script,serif;
	font-size: 48px;
	font-weight: lighter;
}
#mainbody p {
	font-family: 'CantarellRegular', Arial, sans-serif;
	font-size: 18px;
	line-height: 21px;
	margin: 18px 0;
}
	#mainbody small.thought {
		font-size: 16px;
		line-height: 18px;
		display: inline-block;
		margin: 0 30px 30px 30px;
		text-align: justify;
		font-style: italic;
	}
	#mainbody .fineprint {
		font-size: 14px;
		line-height: 14px;
		margin: 14px 0 !important;
	}

#footer {
	position: absolute;
	top: auto; bottom: 0px;
	left: 0px; right: 0px;
	width: auto; 
	height: 75px;
	background: #eee;
	padding-top: 10px;
	border-top: 10px solid rgb(139,197,63);
	font-size: 12px;
}
	#footer a { color: black; text-decoration: none; }
	#footer a:hover { text-decoration: underline;}
	#footer .left { margin-left: 10px;}
	#footer .right { margin-right: 10px;}


@media screen and (min-width: 1366px) {
	html {
 	background: url('../images/background.jpg') #666 0 0 no-repeat fixed;
 	-webkit-background-size: 100% 100%;
 	-webkit-background-size: cover;
 	-moz-background-size: cover;
 	-ms-background-size: cover;
	background-size: cover;
	}
		html::after {
			content: '';
			position: absolute;
			top: 0; left: 0; right: 0; bottom: 0;
			background-color: rgba(25,25,25,.75);
		}
	body {
		width: 1280px;
		max-width: 768px;
		-webkit-box-shadow: -10px 0px 15px rgba(0,0,0,.75),10px 0px 15px rgba(0,0,0,.75);
		-moz-box-shadow: -10px 0px 15px rgba(0,0,0,.75),10px 0px 15px rgba(0,0,0,.75);
		-ms-box-shadow: -10px 0px 15px rgba(0,0,0,.75),10px 0px 15px rgba(0,0,0,.75);
		box-shadow: -10px 0px 15px rgba(0,0,0,.75),10px 0px 15px rgba(0,0,0,.75);
	}

	#mainbody div.pic.sidebar {
		float: right !important;
		margin: 0px -205px 0px 30px;
		clear: both;
	}

}
@media screen and (min-width: 1024px) and (max-width: 1365px) {
	html {
 	background: #666 url('../images/background.jpg') 0 0 no-repeat fixed;
 	-webkit-background-size: 100% 100%;
 	-webkit-background-size: cover;
 	-moz-background-size: cover;
 	-ms-background-size: cover;
	background-size: cover;
	}
		html::after {
			content: '';
			position: absolute;
			top: 0; left: 0; right: 0; bottom: 0;
			background-color: rgba(25,25,25,.75);
		}
	body {
		width: 768px;
		-webkit-box-shadow: -10px 0px 15px rgba(0,0,0,.75),10px 0px 15px rgba(0,0,0,.75);
		-moz-box-shadow: -10px 0px 15px rgba(0,0,0,.75),10px 0px 15px rgba(0,0,0,.75);
		-ms-box-shadow: -10px 0px 15px rgba(0,0,0,.75),10px 0px 15px rgba(0,0,0,.75);
		box-shadow: -10px 0px 15px rgba(0,0,0,.75),10px 0px 15px rgba(0,0,0,.75);
	}

	#mainbody div.pic.sidebar {
		float: right !important;
		margin: 0px -205px 30px 30px;
		clear: both;
	}
}
@media screen and (min-width: 1024px) and (max-width: 1365px) and (-webkit-min-device-pixel-ration: 2.0),
only screen and (min-device-pizel-ratio : 2.0) {

}
/* iPad Portrait */
@media screen and (min-width: 768px) and (max-width: 1023px) {
	body {
		width: 100%;
		margin: 0 auto;
		padding: 0;
		border: none;
		-webkit-box-shadow: none;
		-moz-box-shadow: none;
		-ms-box-shadow: none;
		box-shadow: none;
	}
	#masthead {
		position: fixed;
		left: 0px;
		height: 50px;
		z-index: 9999;
	}
	#masthead_text {
		text-align: center;
		display: block;
		margin: 0 55px;
		font-size: 48px;
		line-height: 42px;
	}

	#slogan {
		margin-top: 56px;
	}
	#mainbody {
		margin-left: 20px;
		margin-right: 20px;
		padding-bottom: 110px;
	}

}
/* iPad Portrait Retina */
@media screen and (min-width: 768px) and (max-width: 1023px) and (-webkit-min-device-pixel-ration: 2.0),
only screen and (min-device-pizel-ratio : 2.0) {

}
/* Android Hack - Medium Zoom Landscape */
@media screen and (min-width: 768px) and (max-width: 1023px) and (max-height: 480px) {

}
/* Android Hack - High Density */
@media screen and (min-width: 768px) and (max-width: 1023px) and (max-height: 480px) and (-webkit-min-device-pixel-ration: 2.0),
only screen and (min-device-pizel-ratio : 2.0) {

}
/* Phone Landscape */
@media screen and (min-width: 480px) and (max-width: 767px) {
	body {
		width: 100%;
		margin: 0;
		padding: 0;
		border: none;
		-webkit-box-shadow: none;
		-moz-box-shadow: none;
		-ms-box-shadow: none;
		box-shadow: none;
	}
	#masthead {
		height: 50px;
		position: fixed;
		z-index: 9999;
	}
		#masthead_text {
			font-size: 36px;
			line-height: 32px;
			margin: 5px 55px;
			text-align: center;
			display: block;
		}

	#mainbody {
		margin: 0 10px;
		padding: 40px 0px;
	}

	#slogan {
		margin-top: 55px;
	}

	#mainbody h3.header {
		padding: 5px;
		margin: 0;
		font-size: 36px;
		background: rgba(255,255,255,.5);
	}

}
/* Phone Landscape - High Density */
@media screen and (min-width: 480px) and (max-width: 767px) and (-webkit-min-device-pixel-ration: 2.0),
only screen and (min-device-pizel-ratio : 2.0) {

}
/* Android Hack - Medium Zoom Portrait */
@media screen and (min-width: 480px) and (max-width: 767px) and (min-height: 600px) {

}
/* Android Hack - High Density */
@media screen and (min-width: 480px) and (max-width: 767px) and (min-height: 600px) and (-webkit-min-device-pixel-ration: 2.0),
only screen and (min-device-pizel-ratio : 2.0) {

}
/* iPhone 3/4 Portrait Safari */
@media screen and (max-width: 479px) {
	body {
		width: 100%;
		margin: 0;
		padding: 0;
		border: none;
		-webkit-box-shadow: none;
		-moz-box-shadow: none;
		-ms-box-shadow: none;
		box-shadow: none;
	}
	#masthead {
		position: fixed;
		top: 0px; left: 0px;
		height: 50px;
		z-index: 9999;
	}
		#masthead_text {
			font-size: 36px;
			line-height: 36px;
			margin: 0px 5px;
			text-align: center;
			display: block;
		}

	#mainbody {
		margin: 0 10px;
		padding: 40px 0px 100px 0px;
	}
	#mainbody h3.header {
		text-align: center;
		margin: 0 auto 20px auto;
	}
	#mainbody div.pic {
		float: none;
		margin: 0px auto 10px auto;
	}

	#slogan {
		margin-top: 55px;
		
	}

	#footer { }

}
/* iPhone 3/4 Portrait App View, iPhone 5+ in Safari */
@media screen and (max-width: 479px) and (min-height: 460px) {

}
/* iPhone 5 App View and Android widescreen in portrait */
@media screen and (max-width: 479px) and (min-height: 532px) {

}
/* iPhone 6 App View and Android widescreen in portrait */
@media screen and (max-width: 479px) and (min-height: 647px) {

}
/* iPhone 6+ App View and Android widescreen in portrait */
@media screen and (max-width: 479px) and (min-height: 716px) {
	#masthead_text {
		margin: 0px auto;
	}
	#slideshow {
		height: 620px;
	}
}
/* iPhone Portrait Retina */
@media screen and (max-width: 479px) and (-webkit-min-device-pixel-ration: 2.0),
only screen and (min-device-pizel-ratio : 2.0) {

}
@media screen and (max-width: 360px){
	#masthead_text {
		font-size: 24px;
		line-height: 50px;
		height: 50px;
	}
	#slogan span {
		font-size: 18px;
	}
}