@charset "utf-8";
/* CSS Resets */
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, font, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;	padding: 0;	border: 0;	outline: 0;	font-weight: inherit;	font-style: inherit;	font-size: 100%;	font-family: inherit;	vertical-align: baseline;}
:focus {	outline: 0;}
body {	line-height: 1;	color: black;	background: white;}
ol, ul {	list-style: none;}
a {text-decoration: none;}
img {border: none;}
caption, th, td {	text-align: left;	font-weight: normal;}
blockquote:before, blockquote:after,q:before, q:after {	content: "";}
blockquote, q {	quotes: "" "";}

/*
Copyright (c) 2009, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version: 2.7.0
*/
html{color:#000;background:#FFF;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var,optgroup{font-style:inherit;font-weight:inherit;}del,ins{text-decoration:none;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;}sup{vertical-align:baseline;}sub{vertical-align:baseline;}legend{color:#000;}input,button,textarea,select,optgroup,option{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;}input,button,textarea,select{*font-size:100%;}


/* Clearfix */
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.clearfix {display: inline-block;}
* html .clearfix {height: 1%;}
.clearfix {display: block;}




/* Google Font Face */
@font-face {  font-family: 'Tangerine';  font-style: normal;  font-weight: normal;  src: local('Tangerine'), url('http://themes.googleusercontent.com/font?kit=HGfsyCL5WASpHOFnouG-RD8E0i7KZn-EPnyo3HZu7kw') format('woff');}


body {background:#009393; font-family: Verdana, Geneva, sans-serif;font-size: 11.5px; margin: 0px; padding: 0px; overflow:hidden;}

/* Background Elements */
div#title_content {background:url(../images/bg-titlepage.png) no-repeat; background-position:center; width: 100%;}
li#homepage {background:url(../images/page1_bg.jpg) repeat-x; height: 1020px; }
li#contactpage {background:url(../images/page2_bg.jpg) repeat-x; height: 1200px; }
li#aboutpage {background:url(../images/page3_bg.jpg) repeat-x; height: 1200px;}
li#workpage {background:url(../images/page4_bg.jpg) repeat-x; height: 1200px;}

div.page {width: 1000px; height: 800px; margin: 50px auto 0px auto; }
div.header {width: 1000px; height: 79px; padding-bottom: 15px;}
div.main_display { position: relative; width: 1000px; height: 530px;} 
div.main_background { background: #fff; width: 962px; height: 490px; padding: 20px 19px;-moz-border-radius: 15px; border-radius: 15px; opacity: 0.1; position: absolute; } 
div.main_display_content {position: absolute; opacity: 1;width: 962px; height: 490px; padding: 20px 19px;}


div#title {background:url(../images/bg-titlepage.png) no-repeat; background-position:center; height: 1020px; width: 100%;}
div.page#title {margin-top: 0px; position:relative;}
div.page#title p {text-align: center; padding-top: 250px;}

.contact div.left-content {float:left; width: 582px; }
.contact div.right-content {float:left; width: 328px; }
.contact div.left-content p {width: 445px;}

div#about_content { background-position:center; height: 1200px; width: 100%;}
div.page#about {margin-top: 0px; position:relative;}
.about div.left-content {float:left; width: 590px; }
.about div.right-content {float:left; width: 320px; }
.about div.right-content p {width: 375px;}

.work div.left-content {float:left; width: 100%; }
.work div.right-content {float:left; width: 401px; height: 488px; position: relative;}
.work div.right-content p {width: 400px;}
.work div.right-content div.worklist {position: absolute; bottom: 15px;}
.work #slideshow-container {width:542px;height:488px}

/* text styles */
div.loader {position: absolute;	top: 0;	left: 0;	/*background-image: url('images/loader.gif');*/	background-repeat: no-repeat;	background-position: center;}
.name {font-size: 80px; color: #bbbbbb; float:left; font-family: 'Smythe', serif;position:relative;line-height:100px;}
ul.nav {font-size: 24px; color: #bbbbbb; font-family: 'Smythe', serif; position: relative;}

p {font-family: Verdana, Geneva, sans-serif; color: #fff; line-height: 14px; padding-bottom: 16px;}
.about p {width: 440px; line-height: 14px;}

h1 {font-size: 24px; font-family: 'Smythe', serif; margin-bottom: 12px;}
.about h1  {color: #071053;}
.contact h1 {color: #5da29d;}
.work h1 {color: #959aff;}

a {color: #ffc600; }
.main_display_content a.anchor {color:#ffc600; float:left; margin-top: 9px; padding: 3px 0px 0px 7px; font-family: 'Smythe', serif; font-size: 20px; }
.main_display_content img.anchor {clear: both; float:left; margin-top: 9px;}

ul.nav {float:right;position:relative;}
ul.nav li {float:left; margin-left: 15px; }
.nav a {color: #bbbbbb;}
.nav a:hover {color: #fff;}
.nav a.active {#fff;}

/*contact page features*/
#form-contact input {clear: both; display: block; color: #30e0d4; margin-bottom: 7px;}
#form-contact input.text {border: none; background:url(../images/textbox.png) no-repeat; width: 307px; height: 30px; padding: 0px 0px 0px 15px;}
#form-contact textarea.msg {border: none; background:url(../images/textarea.png) no-repeat; width: 430px; height: 242px; padding: 0px 0px 0px 15px;margin-bottom: 7px;}
#form-contact input#submit {color: #fff;}
#submit {border:0; width:445px; height:38px; font-size:22px; font-family: 'Smythe', serif; background:url("../images/btn-submit.png") no-repeat 0 0; margin-top: 2px;}
#form-contact input#submit:hover {color:#529893;background:url("../images/btn-submit.png") no-repeat 0 -38px ;}

div#twitter-feed {width: 380px; height: 113px; position: relative;}
div#twitter-feed img {float:left; z-index: 10; position: relative;}
div#twitter-feed h1 {float:left;}

/*.loader		{ position: absolute; top: 250px; left: 105px; }*/
div#twitter	{ position: absolute; bottom: 0; right: 0; z-index: 4; width: 290px; height: 67px; padding: 5px 10px 10px 67px; background:url(../images/bg-twitter.png) no-repeat; }
#twitter li p	{ padding: 0px; margin: 0px; color: #63a6a1;}
#twitter p a:link, #twitter p a:active, #twitter p a:visited	{ color: #6fb2cd; text-decoration: none; }
#twitter p a:hover	{ text-decoration: underline; }
#twitter ul	{width: 260px;	height: auto;	padding: 0px 0 0 15px;	margin: 0;}
#twitter li	{float: left;margin: 0;	list-style-type: none;}
li.twitter_date	{display: none;}
.twitter_date a:active, .twitter_date a:link, .twitter_date a:visited	{	color: #666;	font-family: Arial, Helvetica, sans-serif;	font-size: 11px;	text-decoration: none;	text-transform: uppercase;	padding: 7px;}
.twitter_date a:hover	{color: #666;}

/*social media icons*/
div#sm {margin-top: 30px;}
div#sm ul#social-media {width: 375px; height: 55px; }
div#sm ul#social-media li {float:left; width: 51px; height:51px; margin-left: 11px; }
div#sm ul#social-media li#tweet {background:url("../images/sm-icons.png") no-repeat 0px 0px ;}
div#sm ul#social-media li#linkedin{ background:url("../images/sm-icons.png") no-repeat -65px 0px ;}
div#sm ul#social-media li#facebook{ background:url("../images/sm-icons.png") no-repeat -132px 0px ;}
div#sm ul#social-media li#yelp{ background:url("../images/sm-icons.png") no-repeat -197px 0px ;}
div#sm ul#social-media li#tumblr{ background:url("../images/sm-icons.png") no-repeat -260px 0px ;}
div#sm ul#social-media li#forrst{ background:url("../images/sm-icons.png") no-repeat -325px 0px ;}
#tweet a {height: 51px; width: 51px;}

/*instagram feed*/
div#ig {margin-top: 30px;}
div.instagram {width: 375px; }
div.instagram-placeholder {float:left; padding-right: 10px; }
img.instagram-images {float:left; padding-left: 10px;}

/*work page */
.worklist ul {color: #fff; }
.worklist ul li {margin-top: 10px; padding-left: 15px; background:url(../images/bullet-work.png) no-repeat; background-position: left center;}
.proj-info {height: 488px; position: relative;}	
.proj-info .worklist {position: absolute; bottom: 15px;}
ul.thumbs {width: 1005px; }
ul.thumbs li {padding: 0px; margin: 37px 3px 0px 0px !important ; }
div.lb-gallery span {display: none;}

/**************************************************
scrollTo 
 *************************************/
#wrapper	{ width:100%; height:100%; position:absolute; top:0; left:0; overflow:hidden; }
#mask		{ width:100%; height:300%; }
.box		{ width:100%; height:33%; float:left; }
.content	{ width:960px; height:400px; top:20%; margin: 0 auto; position:relative; background:rgba(255,255,255, 0.3);	border-radius:35px; -moz-border-radius:35px; -webkit-border-radius:35px; }			
.inner		{ width:920px; height:360px; background:rgba(255, 255, 255, 0.3); border-radius:30px; -moz-border-radius:30px; -webkit-border-radius:30px; margin:5px; padding:15px; top:5px; position:relative; }
					


/*********************************
PARALLAX
******************************/
/*** CONTACT PAGE ***/
.contact_parallax			{ width:1900px; height:4000px; overflow:hidden; position:absolute; }
#contact_parallax_2			{ height:100%; width:15000px; background:url(../images/contact_layer1.png) repeat-x; position:relative;}
#contact_parallax_1			{ height:100%; width:15000px; background:url(../images/contact_layer2.png) repeat-x; position:relative;}

/*** ABOUT PAGE ***/
.about_parallax				{ width:1900px; height:4000px; overflow:hidden; position:absolute; }
#about_parallax_4			{ height:4000px; width:100%;background:url(../images/about_layer4.png) repeat-y; position:absolute; top:0px; }
#about_parallax_3			{ height:100%; width:1900px; background:url(../images/about_layer3.png) no-repeat; position:absolute; left:0px;}
#about_parallax_2			{ height:1200px; width:100%; background:url(../images/about_layer2.png) no-repeat; position:absolute; left:0px;}
#about_parallax_1			{ height:4000px; width:100%; background:url(../images/about_layer1.png) repeat-y; top:0px;}

#about_parallax_container	{overflow:hidden;width:1900px; height: 1200px;position:absolute; margin-top:-100px;}

/*** WORK PAGE ***/
.work_parallax				{ width:100%; height:1200px; overflow:hidden; position:absolute; }
#work_parallax_3			{ height:1200px; width:100%; background:url(../images/work_layer3.png) no-repeat; background-position:bottom; position:relative;top:0px;}
#work_parallax_2			{ height:1200px; width:100%; background:url(../images/work_layer2.png) no-repeat; background-position:bottom; position:relative;top:0px;}
#work_parallax_1			{ height:100%; width:4000px; background:url(../images/work_layer1.png) no-repeat; position:relative; left:0px; }



/*********************************
jQUERY LIGHTBOX
******************************/
#jquery-overlay {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
}
#jquery-lightbox {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 100;
	text-align: center;
	line-height: 0;
}
#jquery-lightbox a img { border: none; }
#lightbox-container-image-box {
	position: relative;
	background-color: #fff;
	width: 250px;
	height: 250px;
	margin: 0 auto;
}
#lightbox-container-image { padding: 10px; }
#lightbox-loading {
	position: absolute;
	top: 40%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
}
#lightbox-nav {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
}
#lightbox-container-image-box > #lightbox-nav { left: 0; }
#lightbox-nav a { outline: none;}
#lightbox-nav-btnPrev, #lightbox-nav-btnNext {
	width: 49%;
	height: 100%;
	zoom: 1;
	display: block;
}
#lightbox-nav-btnPrev { 
	left: 0; 
	float: left;
}
#lightbox-nav-btnNext { 
	right: 0; 
	float: right;
}
#lightbox-container-image-data-box {
	font: 10px Verdana, Helvetica, sans-serif;
	background-color: #fff;
	margin: 0 auto;
	line-height: 1.4em;
	overflow: auto;
	width: 100%;
	padding: 0 10px 0;
}
#lightbox-container-image-data {
	padding: 0 10px; 
	color: #666; 
}
#lightbox-container-image-data #lightbox-image-details { 
	width: 70%; 
	float: left; 
	text-align: left; 
}	
#lightbox-image-details-caption { font-weight: bold; }
#lightbox-image-details-currentNumber {
	display: block; 
	clear: left; 
	padding-bottom: 1.0em;	
}			
#lightbox-secNav-btnClose {
	width: 66px; 
	float: right;
	padding-bottom: 0.7em;	
}

/*********************************
GALLERIFIC
******************************/

div.main_display_content work {width: 1000px; height: 530px;}

div.main_display_content work a, div.navigation a {	text-decoration: none;}
div.main_display_content work a:hover, main_display_content work a:active {	text-decoration: underline;}

div#about_content p {line-height: 17px;}

div.navigation a.pageLink {	height: 77px;	line-height: 77px;}

div.controls {	margin-top: 5px;	height: 23px;}
div.controls a {	padding: 5px;}
div.ss-controls {	float: left;}
div.nav-controls {	float: right;}

div.slideshow-container,div.loader,div.slideshow a.advance-link {	width: 542px; /* This should be set to be at least the width of the largest image in the slideshow with padding */}
div.loader,div.slideshow a.advance-link,div.summary {	height: 488px; /* This should be set to be at least the height of the largest image in the slideshow with padding */	}

div.slideshow-container {	position: relative;	clear: both;	float: left;	height: 488px;}
div.slideshow span.image-wrapper {	display: block;	position: absolute;	}

div#slideshow {position: relative;}
div#slideshow img {position: absolute; left: 0; top: 0;}
div.slideshow img {	border-style: none;}
div.summary {	float: left;position: relative;margin-top: 0px; width: 400px;}
caption.summary {width:400px;}
span.image-caption {display: block;	position: absolute;	top: 0;	left: 0;}
#slideshow.slideshow {height:488px;width:542px;background:#999;}

div.proj-info {	padding: 0 12px;}
div.image-title {	font-weight: bold;	font-size: 1.4em;}

div#work-nav {	float: left; position:absolute;top:500px;}
div.navigation {	float: left;	position: relative;	}
div.navigation a.pageLink {	display: block;	position: relative;	float: left;	margin: 2px;	width: 16px;	background-position:center center;	background-repeat:no-repeat;}
div.navigation a.pageLink:focus {	outline: none;}


ul.thumbs {	position: relative;	float: left;	margin: 0;	padding: 0;}
ul.thumbs li {	float: left;	padding: 0;	margin: 2px;	list-style: none;}
a.thumb {	padding: 1px;	display: block;}
a.thumb:focus {	outline: none;}
ul.thumbs img {	border: none;	display: block;}
div.pagination {	clear: both;	position: relative;	left: -50%;}
div.pagination a, div.pagination span.current, div.pagination span.ellipsis {
	position: relative;	display: block;	float: left;	margin-right: 2px;	padding: 9px 7px 2px 7px;	border: 1px solid #ccc;}
div.pagination a:hover {	text-decoration: none;}
div.pagination span.current {	font-weight: bold; padding: 0; margin: 0;}
div.pagination span.ellipsis {	border: none;	padding: 0px 0 3px 2px;}

div.gallery-gutter {	clear: both;	padding-bottom: 20px;}


#progress_bar { position:relative;left:760px;top:100px; }

li.linkopacity { opacity:1 !important; }

#about_parallax_container {margin-top:-100px;}
.nav li span.active { color: #fff;}
