/*
AUTHOR: <a href="http://www.sleepvisual.com/">Hugh Collier</a>
*/

	
/* CSS Reset  */
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;
	}


	
/* remember to define focus styles! */
:focus {
	outline:0;
	}

body {
	line-height:1;
	color:black;
	background-color:#343434;
	font-family:"Helvetica Neue", Arial, Helvetica, sans-serif ;
	background-image:url(images/header-bg-dark.jpg);
	background-repeat:repeat-x;
	}

ol,ul {
	list-style:none;
	}	


	
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse:separate;
	border-spacing:0;
	}

caption,th,td {
	text-align:left;
	font-weight:normal;
	}

blockquote:before,blockquote:after,q:before,q:after {
	content:"";
	}

blockquote,q {
	quotes:;
	}
	
body {
}


body#home {
	background-color: black;
}

body#bodygraphics {
	background-color: rgb(56,78,105);
}

body#bodyweb {
	background-color: rgb(121,65,65);
}

body#bodyphotog {
	background-color: rgb(81,99,79);
}

body#bodysketch {
	background-color: rgb(117,118,105);
}

/* ++++++++++++++++++++++++++++++++++++++++++ HEADINGS ++++++++++++++++++++++++++++++++++++++++++ */


h1 {
	font-size: 50pt;
}

h2 {
	font-family: Helvetica, "Helvetica Neue", Arial, sans-serif;
	padding-bottom: 18px;
	color:rgb(211, 209, 186);
	font-size: 12pt;
	background-color: black;
	text-transform: uppercase;
	line-height: 22px;
	padding:5px 5px 3px 5px;
	display: inline;
}

hr {
	width: 604px;
	height: 1px;
	background-color: #7B7B7B;
	margin-top: 35px;
	margin-bottom: 15px;
	color:#7B7B7B;
	border:none;
}

.vertical-line {
	width: 1px;
	height: 300px;
	background-color: #7B7B7B;
	margin-top: 45px;
	margin-bottom: 15px;
	color:#7B7B7B;
	border:none;
	position: relative;
}


/* ++++++++++++++++++++++++++++++++++++++++++ SITE WIDE STYLES ++++++++++++++++++++++++++++++++++++++++++ */

.iam {

	font-family: Verdana;
	font-weight: bold;
	font-size: 360pt;
	position:absolute;
	bottom:50px;
	left:0px;
	letter-spacing: -10.8pt;
}

.ce-graphics {
	position: absolute;
	left:0px;
	top:-290px;
	display: none;

}

#black-box {
	position: relative;
	margin: 0 auto;
	background-color: black;
	height: 60px;
	min-width: 1030px;
}

#menu-container {
	width:650px;
	background-color: black;
	position: relative;
	top:50px;
	left:30px;
}

.menu {
	background-color: rgb(211, 209, 186);
	position: relative;
	width:246px;
	font-size: 8pt;
	font-weight: bold;
	font-family: "Helvetica Neue", Arial, Helvetica, sans-serif ;
	padding-top: 15px;
	padding-left: 0px;
	padding-bottom: 10px;

	
}

.menu li {
	padding-bottom: 2px;
	padding-left: 0px;
}

.menu a {
	color:black;
	text-decoration: none;
	letter-spacing: 0.2pt;
	padding-left: 20px;
}

.bg2 {
	position: absolute;
	bottom:0px;
	right:400px;
	z-index: 100;
}

#menu-container p {
	position: absolute;
	top:21px;
	left:270px;
	width:370px;
	color: rgb(211, 209, 186);
/* 	text-transform: uppercase; */
	font-size: 10pt;
	line-height: 11pt;
	font-family: "Helvetica Neue", Arial, Helvetica, sans-serif ;
	, 
}

#content-area {
	width:980px;
	margin: 0 auto;
	position: relative;
	padding-bottom: 30px;
}

#content-area-container {
	background-color: rgb(211, 209, 186);
	width:100%;
	min-width: 1030px;
}

#title {
	position: absolute;
	top:35px;
	left:0px;
	width: 400px;
}



.folio {
	margin-top: 30px;
	margin-bottom: 35px;
	border-color: black;
	border-width: 2px;
	border-style: solid;
}



.double {
	width:600px;
	height: 414px;
	float:right;
	display: inline;
}

.double img {
	display:inline;
	margin-top: 30px;
	margin-bottom: 0px;
	border-color: black;
	border-width: 2px;
	border-style: solid;
}

.right {
	float:right;
}

.left {
	float:left;
	
}

.line {
	width:980px;
	height:30px;
	font-family: "Helvetica Neue", Arial, Helvetica, sans-serif ;
	font-size: 12pt;
	font-weight: 500;
	border-bottom: black;
	border-bottom-style: solid;
	border-bottom-width: 1px;
	clear: both;
}

.line p {
	position: relative;
	top:-29px;
}


.sprites {
	background-image: url(images/tree-home.png);
	background-color: transparent;
	background-repeat: no-repeat;
	position: absolute;
	bottom:70px;
	left:460px;
 }

#sidebar {
	position: absolute;
	top:250px;
	left:0px;
	z-index: 1001;
}

#sidebar-second {
	position: absolute;
	top:317px;
	left:0px;
	z-index:1001;
}

#work a {
	text-decoration: none;
	font-family: "Helvetica Neue", Arial, Helvetica, sans-serif ;
/* 	font-weight: 600; */
	font-size: 10pt;
	display: block;
	
}

.work-title {
	padding-bottom: 15px;
}


 #tree {
	height: 410px;
	width: 536px;
	position: absolute;
	left:150px;
	bottom:150px;
 }


/* ++++++++++++++++++++++++++++++++++++++++++ HOME PAGE ++++++++++++++++++++++++++++++++++++++++++ */

#sub-container-home {
	width:980px;
	height: 670px;
	margin: 0 auto;
	background-color: #715a6c;
	position: relative;
	overflow: hidden;
}

#sub-container-home .menu {
	background-repeat: no-repeat;
	background-position: 100% 0%;
	
}


#main-container-home {
	width:100%;
	position: relative;
	background-image: url(images/home-bg.png);
	background-repeat: repeat-x;
}

#home-tree_png {
	height: 354px;
	width: 377px;
	position: absolute;
	bottom:-5px;
	left:570px;
	background-image: url(images/home-tree.png);
 }



/* ++++++++++++++++++++++++++++++++++++++++++ GRAPHIC DESIGN PAGE ++++++++++++++++++++++++++++++++++++++++++ */



#sub-container-graphics {
	width:980px;
	height: 670px;
	margin: 0 auto;
	background-color: rgb(56,78,105);
	position: relative;
	overflow: visible;
}

#sub-container-graphics .menu {
	background-repeat: no-repeat;
	background-position: 100% 0%;
	
}


.graphics-tree {
	position: absolute;
	top:280px;
	left:440px;
	z-index: 100;
}

.graphics-color {
	color: rgb(56, 78, 105);
}

.graphics-color a {
	color: rgb(56, 78, 105);
} 

#current-graphic-design {
	background-image: url(images/current-graphic-design.png);
	background-repeat: no-repeat;
	background-position: 0% 47%;
	z-index: 1001;
}

.bg-text-space {
	color:rgb(56, 78, 105);
}


#graphics-tree_png {
	height: 337px;
	width: 466px;
	background-position: -843px -0px;
 }


.space {
	background-repeat: no-repeat;
	background-image: url(images/tree-space.png);
 }


/* ++++++++++++++++++++++++++++++++++++++++++ WEB DESIGN PAGE ++++++++++++++++++++++++++++++++++++++++++ */


#sub-container-web-design {
	width:980px;
	height: 670px;
	margin: 0 auto 0px auto;
	background-color: rgb(121,65,65);
	position: relative;
	overflow: visible;
}

#sub-container-web-design .menu {
	background-image: url(images/photography-menu-bg1.png); 
	background-repeat: no-repeat;
	background-position: 100% 0%;
	
}


.website-tree {
	position: absolute;
	top:280px;
	left:440px;
	z-index: 100;
}

.web-design-color {
	color: rgb(121,65,65);
}

.web-design-color a {
	color: rgb(121,65,65);
}

#current-web-design {
	background-image: url(images/current-web-design.png);
	background-repeat: no-repeat;
	background-position: -0% 47%;
	z-index: 1001;
}

.bg-text-code {
	color:rgb(121,65,65);
}

#web-design-tree_png {
	height               : 337px;
	width                : 466px;
	background-position  : -1309px -0px;
 }



/* ++++++++++++++++++++++++++++++++++++++++++ PHOTOGRAPHY PAGE ++++++++++++++++++++++++++++++++++++++++++ */


#sub-container-photography {
	width:980px;
	height: 670px;
	margin: 0 auto;
	background-color: rgb(81,99,79);
	position: relative;
	overflow: hidden;
}

#sub-container-photography .menu {
	background-image: url(images/photography-menu-bg1.png); 
	background-repeat: no-repeat;
	background-position: 100% 0%;
	
}


.photography-tree {
	position: absolute;
	top:280px;
	left:440px;
	z-index: 100;
}

.photography-color {
	color: rgb(81,99,79);
}

#current-photography {
	background-image: url(images/current-photogrpahy.png);
	background-repeat: no-repeat;
	background-position: -0% 47%;
	z-index: 1001;
}

.bg-text-focus {
	color:rgb(81,99,79);
}

#photography-tree_png {
	height: 337px;
	width: 466px;
	background-position: -0px -0px;
}

#thumbnails {
	width:249px;
	z-index: 1001;
}

.thumbnail {
	display: inline;
	float:left;
	margin-bottom: 15px;
	margin-right: 15px;
	border-width: 2px;
	border-color: black;
	border-style: solid;
	height: 76px;	
}





.slide-photog {
	text-align: center; !!important;
	height: 600px;
	
}

.slide-photog img {
	vertical-align: middle;	
}


.photog-folio {
	border-width: 40px 40px 70px 40px;
	border-color: black;
}

.photog-title {
	position: relative;
	top: -80px;
	font-size: 10pt;
	
}

.focus {
	background-repeat: no-repeat;
	background-image: url(images/tree-focus.png);
 }

.shift {
	position: relative;
	left:95px;
}


/* ++++++++++++++++++++++++++++++++++++++++++ SKETCH BOOK PAGE ++++++++++++++++++++++++++++++++++++++++++ */


#sub-container-sketch-book {
	width:980px;
	height: 670px;
	margin: 0 auto;
	background-color: rgb(117,118,105);
	position: relative;
	overflow: hidden;
}


#sketch-tree {
	position: absolute;
	top:280px;
	left:440px;
	z-index: 100;
	height: 354px;
	width: 377px;
	background-image: url(images/tree-home.png);
}

.sketch-color {
	color: rgb(117,118,105);
}

.sketch-color a {
	color: rgb(117,118,105);
}

#current-sketch-book {
	background-image: url(images/current-sketch.png);
	background-repeat: no-repeat;
	background-position: -0% 47%;
	z-index: 1001;
}

.bg-text-play {
	color:rgb(117,118,105);
}

.sketch {
	background-repeat: no-repeat;
	background-image: url(images/tree-sketch.png);
 }

/* ++++++++++++++++++++++++++++++++++++++++++ CYCLE PLUGIN ++++++++++++++++++++++++++++++++++++++++++ */


#slide-container {
	min-height: 1200px;
}

.slide {
	width:604px;
	margin-left: 376px;
}

.slide p {

	font-size: 10pt; 
	line-height: 13pt;
	color: #7b7b7b;
	font-weight: normal;
	margin-top: 15px;
	font-family: "Helvetica Neue", Arial, Helvetica, sans-serif ;
}

.slide a {

	font-size: 10pt; 
	line-height: 13pt;
	color: #585858;
	text-decoration: none;
	font-weight: 600;

	margin-top: 15px;
	font-family: "Helvetica Neue", Arial, Helvetica, sans-serif ;

}

.sub-slide {
	margin-bottom: 65px;
}

.slide img {
	margin: 0 auto;
	display: block;
	margin-top: 35px;
	margin-bottom: 35px;
}


.nav {
	float: right;
	padding-top: 20px;
}


/* ++++++++++++++++++++++++++++++++++++++++++ FOOTER ++++++++++++++++++++++++++++++++++++++++++ */


#footer-grass {
	background-image: url(images/grass.png);
	background-repeat: repeat-x;
	height:59px;
	background-color: #D3D1BA;
	min-width: 1030px;

}

#footer {
	width:100%;
	background-color: black;
	height: 30px;
	min-width: 1030px;
	padding-bottom: 50px;
}

#footer p {
	font-size: 7.5pt;
	color:#D3D1BA;
	margin-top: 20px;
	text-align: center;
	position: relative;
	top:-10px;
	
}

#copyright-notice {
	width:980px;
	margin: 0 auto;
}

.footer-menu {
	margin: 0 auto;
	padding-top: 13px;
	width:760px;
	position: relative;
	top:-10px;
}

.footer-menu li {
	display: inline;
	margin-right: 15px;
	margin-left: 15px;
}

.footer-menu li a {
	text-decoration: none;
	color:#D3D1BA;
	font-size: 12pt;
	font-family: "Helvetica Neue", Arial, Helvetica, sans-serif ;
	
}