@font-face {
    font-family: 'prono';
    src: url(fonts/pronot.woff);
    font-weight: 100;
}

@font-face {
    font-family: 'prono';
    src: url(fonts/pronol.woff);
    font-weight: 200;
}

@font-face {
    font-family: 'prono';
    src: url(fonts/pronor.woff);
    font-weight: 400;
}

@font-face {
    font-family: 'prono';
    src: url(fonts/pronos.woff);
    font-weight: 600;
}


* {
	box-sizing:border-box;
	-moz-box-sizing:border-box;
}

html {
	height: 100%;
	background: rgb(41, 43, 45);
}

body {
	min-height: 100%;
	background-color: #618724;
	/*background: url('background.jpg') fixed center;*/
	background-size: cover;
	font-family: 'prono';
	color: #012537;
	font-size: 18px;
	max-width: 1500px;
	margin: auto;
	box-shadow: 0 0 5px black;
}

img {
	max-width: 100%;
}

a {
	text-decoration: none;
}

h1 {
	font-weight: 600;
	font-size: 2.5em;
	margin: 0 0 0.3em 0;
}

	h1 span {
		text-transform: uppercase;
		font-size: 0.76em;
		font-weight: 400;
	}
	
h2 {
	text-transform: uppercase;
	font-weight: 300;
	line-height: 1.5;
	letter-spacing: 2px;
}

	h2 span {
		display: block;
		font-size: 0.6em;
	}
	
section {
	width: 100%;
	padding: 8em 3em;
}

p {
	opacity: 0.7;
	line-height: 1.5;
	font-size: 1.2em;
}

	section p:last-of-type {
		margin-bottom: 0;
	}
	
header {
	padding: 10% 0;
	text-align: center;
	color: rgb(255, 255, 255);
}

	header a {
		color: inherit;
	}
	
	header h1 {
		font-size: 5em;
		margin: 0.25em 0;
		line-height: 0.8;
		text-shadow: 0 1px 3px rgb(0, 0, 0);
	}
	
	header h2 {
		text-shadow: 0 0.5px 3px rgb(0, 0, 0);
	}
	
.stripe {
	background-color: rgb(251,255,255);
/*	box-shadow: 0 0 30px black;
	z-index: 10;
	position: relative;*/
}

.dim {
	/*background-color: rgba(0,0,0,0.4);*/
	color: #fff;
	/*text-shadow: 0 1px 1px rgb(0, 0, 0);*/
}
	
#intro {
	overflow: hidden;
	max-height: 1000px;
	background-image: url('introbg.jpg');
	background-size: cover;
	background-position: 50% 50%;
	padding: 0;
	position: relative;
}

	.contact {
		padding: 1em 3em;
	}
	
		.contact a {
			color: rgba(0,0,0,0.6);
			text-transform: uppercase;
			font-size: 0.7em;
			letter-spacing: 1px;
			margin-top: 5px;
		}
	
		.contact a:nth-of-type(2) {
			width: 100%;
			text-align: center;
			position: absolute;
			left: 0;
		}
		
		.contact a:last-of-type {
			float: right;
			position: relative;
			z-index: 10;
		}
		
		.contact .logo {
			background: url(http://adamfishercox.com/blog/wp-content/themes/afc-11.2/images/logo.gif) no-repeat;
			width: 0;
			height: 0;
			overflow: hidden;
			display: inline-block;
			background-size: 40px;
			padding: 21px 0 0 40px;
			background-position: top 1px center;
			opacity: 0.6;
			margin-top: 0;
		}

	.why, .end {
		background-image: url('browse-current.png');
		background-position: calc(50% + 650px) 45px;
		background-repeat: no-repeat;
		background-size: 1200px;
		padding-right: calc(3em + 45%);
	}
	
		.end {
			background-image: url('browse.png');
			background-position: calc(50% + 650px) center;
		}
	
	.fix {
		position: relative;
		overflow: hidden;
		padding-left: calc(3em + 45%);
	}
	
			.fix:before {
				content: "";
				position: absolute;
				top:-4em;
				left: -2em;
				z-index: 0;
				height: 150%;
				width:100%;
				background-image: url('launch.png');
				background-repeat: no-repeat;
				background-size: 1200px;
				background-position: left calc(-36em + 50%) top 0;
				-webkit-transform: rotate(-7deg);
				-moz-transform: rotate(-7deg);
				-ms-transform: rotate(-7deg);
				-o-transform: rotate(-7deg);
			}
	
	.slider {
		padding: 0;
		margin-bottom: 1.2rem;
	}
	
	#scroll {
		position: absolute;
		bottom: 0;
		left: 50%;
		background: #7aaa2d;
		z-index: 20;
		text-align: center;
		color: #fff;
		height: 45px;
		margin-left: -45px;
		width: 90px;
		border-radius: 90px 90px 0 0;
		-moz-border-radius: 90px 90px 0 0;
		-webkit-border-radius: 90px 90px 0 0;
		font-size: 35px;
		padding-top: 6px;
	}
	
nav {
	margin: 1em auto 2em;
	display: block;
	text-align: center;
}

	nav a, .toggle a {
		background: #fff;
		color: #7aaa2d;
		display: inline-block;
		text-align: center;
		font-weight: bold;
		transition: 0.02s linear;
		-webkit-transition: 0.02s linear;
		-moz-transition: 0.02s linear;
		border: 1px solid #7aaa2d;
	}
	
		nav a {
			width: 30px;
			height: 30px;
			border-radius: 100%;
			padding: 5px 0;
			margin: 0 10px;
			font-size: 1.4em;
		}
	
	nav a:hover, .toggle a:hover, .opaque.opaque {
		opacity: 1;
		cursor: pointer;
		background: #7aaa2d;
		color: #fff;
	}
	
		nav, .toggle {
			display: inline-block;
		}
		
			.toggle {
				margin-left: 40px;
			}
		
		.toggle a {
			padding: 7px 13px 5px;
			text-transform: uppercase;
			font-size: 1em;
			letter-spacing: 1px;
		}
		
			.toggle a:first-of-type {
				border-top-left-radius: 100px;
				border-bottom-left-radius: 100px;
				padding-left: 15px;
			}
			
			.toggle a:last-of-type {
				border-top-right-radius: 100px;
				border-bottom-right-radius: 100px;
				padding-right: 15px;
			}

.slider img {
	margin: 0 auto;
	display: block;
}

.screens {
	font-size: 0.7em;
	text-align: center;
	padding:0;
	background-image: url('background.jpg');
}

	.screens h1, .screens p {
		max-width: 600px;
		margin-left: auto;
		margin-right: auto;
		padding-left: 3rem;
		padding-right: 3rem;
	}
	
	.screens h1 {
		margin-top: 1.2rem;
	}
	
	.fade {
		padding: 6em 0;
		background: -moz-linear-gradient(top,  rgba(255,255,255,0) 0%, rgba(255,255,255,0) 25%, rgba(255,255,255,1) 61%, rgba(255,255,255,1) 74%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0)), color-stop(25%,rgba(255,255,255,0)), color-stop(61%,rgba(255,255,255,1)), color-stop(74%,rgba(255,255,255,1)));
		background: -webkit-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(255,255,255,0) 25%,rgba(255,255,255,1) 61%,rgba(255,255,255,1) 74%);
		background: -o-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(255,255,255,0) 25%,rgba(255,255,255,1) 61%,rgba(255,255,255,1) 74%);
		background: -ms-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(255,255,255,0) 25%,rgba(255,255,255,1) 61%,rgba(255,255,255,1) 74%);
		background: linear-gradient(to bottom,  rgba(255,255,255,0) 0%,rgba(255,255,255,0) 25%,rgba(255,255,255,1) 61%,rgba(255,255,255,1) 74%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 ); 
}

#loading {
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
  position: fixed;
  display: block;
  background-color: #fff;
  z-index: 99;
  text-align: center;
}

#loading-image {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left:-30px;
  margin-top:-30px;
  z-index: 100;
  width:60px;
}

@media screen and (max-width: 1000px) {
	
	body {		
		font-size: 16px;
	}
	 
	nav a {
		padding: 7px 0;
	}
	
	.fix:before {
		left: -4em;
	}
	
}
	
@media screen and (max-width: 800px) {
	
	.why, .end {
		background-position: left calc(3em - 32px) bottom -185px;
		background-size: 800px;
		padding: 3em 3em 20em;
	}
	
	.fix {
		padding: 3em;
	}
	
	section {
		padding: 3em;
	}
	
	.fade {
		padding-top: 2em;
		background: #fff;
	}
	
	.fix:before {
		background: none;
	}
	
}

@media screen and (max-width: 700px) {
	body {
		font-size: 14px;
	}
	 
	nav a {
		padding: 6px 0;
	}
	
	.screens {
		font-size: 0.8em;
	}
	
	.fix:before {
		background-position: left calc(-18em + 50%) top -110px;
		background-size:800px;
	}

}

@media screen and (max-width: 550px) {
		
		.why, .end {
			background-position: left calc(3em - 20px) bottom -50px;
			background-size: 500px;
		}
		
header h1 {
	font-size: 5.0em;
	text-shadow: 0 1px 2px rgb(0, 0, 0);
}
		
		header h1 span {
			font-size: 0.5em;
			display: block;
			margin-top: 0.3em;
		}
header h2 {
	font-size: 0.8em;
	font-weight: 400;
	text-shadow: 0 0px 2px rgb(0, 0, 0);
}

	header h2 span {
		letter-spacing: 1px;
	}
	
.toggle {
	margin-left: 0;
	display: block;
}

.contact {
	padding: 1em;
}

#intro img {
	width: 800px;
	max-width: 800px;
}

}