/* 
*****************************************************************/
@font-face {
    font-family: 'bebas_neueregular';
    src: url('fonts/bebasneue-webfont.eot');
    src: url('fonts/bebasneue-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/bebasneue-webfont.woff') format('woff'),
         url('fonts/bebasneue-webfont.ttf') format('truetype'),
         url('fonts/bebasneue-webfont.svg#bebas_neueregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'chunkfiveregular';
    src: url('fonts/chunk-webfont.eot');
    src: url('fonts/chunk-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/chunk-webfont.woff') format('woff'),
         url('fonts/chunk-webfont.ttf') format('truetype'),
         url('fonts/chunk-webfont.svg#chunkfiveregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'din_blackregular';
    src: url('fonts/din-black-webfont.eot');
    src: url('fonts/din-black-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/din-black-webfont.woff') format('woff'),
         url('fonts/din-black-webfont.ttf') format('truetype'),
         url('fonts/din-black-webfont.svg#din_blackregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'dinbold';
    src: url('fonts/din-bold-webfont.eot');
    src: url('fonts/din-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/din-bold-webfont.woff') format('woff'),
         url('fonts/din-bold-webfont.ttf') format('truetype'),
         url('fonts/din-bold-webfont.svg#dinbold') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'din_lightregular';
    src: url('fonts/din-light-webfont.eot');
    src: url('fonts/din-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/din-light-webfont.woff') format('woff'),
         url('fonts/din-light-webfont.ttf') format('truetype'),
         url('fonts/din-light-webfont.svg#din_lightregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'din_mediumregular';
    src: url('fonts/din-medium-webfont.eot');
    src: url('fonts/din-medium-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/din-medium-webfont.woff') format('woff'),
         url('fonts/din-medium-webfont.ttf') format('truetype'),
         url('fonts/din-medium-webfont.svg#din_mediumregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'dinregular';
    src: url('fonts/din-regular-webfont.eot');
    src: url('fonts/din-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/din-regular-webfont.woff') format('woff'),
         url('fonts/din-regular-webfont.ttf') format('truetype'),
         url('fonts/din-regular-webfont.svg#dinregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'din-regularitalicitalic';
    src: url('fonts/din-regularitalic-webfont.eot');
    src: url('fonts/din-regularitalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/din-regularitalic-webfont.woff') format('woff'),
         url('fonts/din-regularitalic-webfont.ttf') format('truetype'),
         url('fonts/din-regularitalic-webfont.svg#din-regularitalicitalic') format('svg');
    font-weight: normal;
    font-style: normal;
}


h1 {
	margin: 0;
	font-family: "bebas_neueregular", Verdana, Helvetica, sans-serif;
	font-size: 30px;
	color: #9e6e9f;
}

h2 {
	margin:0;
	font-family: "din_mediumregular", Verdana, Helvetica, sans-serif;
	font-size: 50px;
	color: #000;
}

h3 {
	font-family: "din_lightregular", Verdana, Helvetica, sans-serif;
	font-size: 10px;
	color:#FFF;
}

h4 {
	font-family: "din_lightregular", Verdana, Helvetica, sans-serif;
	font-size: 14px;
	color: #000;
}

h5 {
	margin:0;
	font-family: "dinbold", Verdana, Helvetica, sans-serif;
	font-size: 12px;
	color: #000;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
	padding: 0px 0px 0px 20px;
    margin: 0;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
	margin-top:0px
}

/* Extended base styles (site specific)
*****************************************************************/

html { 
	overflow-y: scroll; /* always force a scrollbar in non-IE */
	}
body {
	background: #ffffff;
	overflow-x: hidden;
	height: 4550px;
	line-height: 1.5;
	color: #000;
	font-size: 14px;
	font-family: Arial,sans-serif;
}

a img {
border: 0;
text-decoration: none;
} 

a, a:link,
a:active,
a:visited {
	-webkit-transition: color 0.25s ease-out;
	-moz-transition: color 0.25s ease-out;
	-o-transition: color 0.25s ease-out;
	transition: color 0.25s ease-out;
	color:#9e6e9f;
	outline: none;
	text-decoration:none;
	}
	a:hover { 
		color:#000;
		}
img { 
	margin:0;
	}
p {
	margin:0px 0px 7px 0px;
	font-family: "dinregular", Verdana, Helvetica, sans-serif;
	font-size: 12px;
	color: #000;
	}

/* Common shared styles
*****************************************************************/

hr {
	margin: 0;
	border: none;
	height: 3px;
}

/* Page structure
*****************************************************************/

#wrapper {
	position: relative;
}

#logoleft{
width: 480px;
float:left;
margin-left: 15px;
}
 
#navright{
	width: 530px;
	padding-right: 0px;
	float: right;
	margin-top: 0px;
}

#header_container {z-index: 10;
	background: #000;
	height: 125px;
	left: 0;
	position: fixed;
	width: 100%;
	top: 0;
	}
#header{margin: 0;
	width: 100%;}

#footer_container {z-index:10; background:#000000; bottom:0; height:35px; left:0; position:fixed; width:100%; }
#bottom { line-height:8px; margin:0 auto; width:90%; text-align:right; }
		
/* Nav
*****************************************************************/

#primary {
	position: relative;
	list-style: none;
	display: inline-block;
}

#primary li {
	display: inline-block;
}
#primary a {
	display: inline-block;
	font-family: "chunkfiveregular", Verdana, Helvetica, sans-serif;
	font-size: 16px;
	color: #999;
	width: 130px;
	height: 29px;
	text-align: center;
	vertical-align: middle;
	line-height: 29px;
}
#primary a:hover {
	color: #FFF;
}
#primary a.active {
	color: #FFF;
}


/* Gallery
*****************************************************************/
.hidden {
    display: none;
}

/* Parallax
*****************************************************************/

/* content */
#content {
	z-index: 5;
	position: relative;
	max-width: 1100px;
	padding: 0 10px;
	margin: 0 auto;
	left: 100px;
	line-height: 1.5;
	}
	#content article {
		}
		#home ,
		#resume,
		#resume2,
		#portfolio,
		#contact {
			padding-top: 150px;
			}
		#home {
			position: absolute;
			width: 400px;
			left: 500px;
			top: 240px;
			}
		#resume {
			left: -15px;
			width: 515px;
			position: absolute;
			top: 1095px;
			}
		#resume2 {
			width: 500px;
			position: absolute;
			top: 1095px;
			left: 600px;
			}	
		#portfolio {
	width: 825px;
	height: 150px;
	position: absolute;
	top: 2126px;
	left: 165px;
			}
		#contact {
			width: 300px;
			left: 100px;
			position: absolute;
			top: 3870px;
			}
		#contactpos {
			width: 300px;
			position: absolute;
			top: 290px;
			}

		#portfoliobg {
			z-index: 4;
			position: absolute;
			top: 2248px;
			left: -40px;
			}

#parallax-bg4 {
	z-index: 4;
	position: fixed;
	left: 50%; /* align left edge with center of viewport */
	top: 0;
	width: 940px;
	margin-left: -470px; /* move left by half element's width */
	}
	/* foreground */

	#bg4-1 {
		position: absolute;
		top: 2260px;
		left: -40px;
		}	
	#bg4-2 {
		position: absolute;
		top: 620px;
		left: 895px;
		}	
	#bg4-3 {
		position: absolute;
		top: 1643px;
		left: -100px;
		}
	#bg4-4 {
		position: absolute;
		top: 2570px;
		left: -100px;
		}	
	#bg4-5 {
		position: absolute;
		top: 620px;
		left: 665px;
		}										
/* foreground  */
#parallax-bg3 {
	z-index: 3;
	position: fixed;
	left: 50%; /* align left edge with center of viewport */
	top: 0;
	width: 940px;
	margin-left: -470px; /* move left by half element's width */
	}
	/* foreground */
	#bg3-1 {
		position: absolute;
		z-index: 4;
		top: 165px;
		left: -50px;
		}
	#bg3-2 {
		position: absolute;
		top: 340px;
		left: 475px;
		}		
	#bg3-3 {
		position: absolute;
		top: 2960px;
		left: 405px;
		}
	#bg3-4 {
		position: absolute;
		top: 3200px;
		left: 90px;
		}
	#bg3-5 {
		position: absolute;
		top: 620px;
		left: 780px;
		}
	#bg3-6 {
		position: absolute;
		top: 1404px;
		left: -100px;
		}
	#bg3-7 {
		position: absolute;
		top: 2077px;
		left: -100px;
		}	
	#bg3-8 {
		position: absolute;
		top: 620px;
		left: 1010px;
		}																
/* midground */
#parallax-bg2 {
	z-index: 2;
	position: fixed;
	left: 50%; /* align left edge with center of viewport */
	top: 0;
	width: 1200px;
	margin-left: -600px; /* move left by half element's width */
	}
	#bg2-1 {
		position: absolute;
		top: 2150px;
		left: 180px;
		}
	#bg2-2 {
		position: absolute;
		top: 2150px;
		left: 280px;
		}
	#bg2-3 {
		position: absolute;
		top: 2150px;
		left:380px;
		}
	#bg2-4 {
		position: absolute;
		top: 1165px;
		left: 30px;
		}	
	#bg2-5 {
		position: absolute;
		top: 1585px;
		left: 30px;
	}
/* background */
#parallax-bg1 {
	z-index: 1;
	position: fixed;
	left: 50%; /* align left edge with center of viewport */
	top: 0;
	width: 1200px;
	margin-left: -600px; /* move left by half element's width */
	}
	#bg1-1 {
		position: absolute;
		top: 1155px;
		left: 550px;
		}
	#bg1-2 {
		position: absolute;
		top: 928px;
		left: 30px;
		}
	#bg1-4 {
		position: absolute;
		top: 1200px;
		left: 0px;
		}