/* ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::

	(c) 2009 Jonathan Powell, All Rights Reserved.

::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */ 


/*.......................................................................
	Reset styles
...................................................................... */
 
body, div, dl, dt, dd, li, pre,
form, fieldset, input, textarea, p, blockquote, th, td, button { margin: 0; padding: 0; }
h1, h2, h3, h4, h5, h6 { margin: 0; padding: 0; font-size: 100%; font-weight: normal; }
address, caption, cite, code, dfn, em, strong, var { font-style: normal; font-weight: normal; }
ol, ul { list-style: none; margin: 0; padding: 0; }
table { border-collapse: collapse; border-spacing: 0; } 
caption, th { text-align: left; font-weight: normal; font-style: normal; }
acronym, abbr, fieldset, img { border: 0;}
:focus { outline: 0; }


/*.......................................................................
	Standard styles
...................................................................... */

body {
	background-image: url(../images/main_bg.jpg);
	font-family: Georgia, "New Century Schoolbook","Nimbus Roman No9 L", serif;
	font-size: 12px;
}

a, a img { 
	border: 0; 
	text-decoration: none; 
	outline: 0;
	color: #CC0000; 
}

a:link, a:visited, a:active, a:hover {
	color: #CC0000;
	text-decoration: none;
}

h1 {
	font-size: 32px;
	letter-spacing: 1px;
}

h2 {
	font-size: 24px;
	text-transform: uppercase;
	letter-spacing: 1px;
}

h3 {
	font-size: 18px;
	letter-spacing: 1px;
}

h4 {
	font-size: 14px;
	letter-spacing: 1px;
}

p {
	font-size: 12px;
	letter-spacing: 1px;
}

ol, ul {}

ol li, ul li {}

blockquote {}

blockquote p {}

form {
	float: right;
	padding: 0 12px 5px 0;
	color: #fff;
	background-color: #000;
}

dt {
	float: left;
	padding-left: 12px;
}

dd {
	float: right;
}

/*.......................................................................
	Layout
...................................................................... */

#page_wrap {
	margin: 0 auto;
	width: 980px;
	margin-top: 30px;
}

#header {
	width: 943px;
}

#content_wrap {
	width: 973px;
	margin: 0px !important;
	background-image: url(../images/content_bg.png);
	background-repeat: no-repeat;
}

#anythingSlider_stage {
	width: 910px;
	height: 353px;
	margin: 0 0 0 25px;
	background-image: url(../images/home_sliding_image_bg.png);
	background-repeat: no-repeat;
}

#anythingSlider_stage_about_top {
	width: 910px;
	height: 50;
	margin: 0 0 0 25px;
}

#anythingSlider_stage_about_middle {
	width: 910px;
	background-image: url(../images/home_sliding_image_bg_about_middle.png);
	background-position: center;
	background-repeat: repeat-y;
}

#anythingSlider_stage_about_inside {
	padding-left: 20px;
	width: 890px;
}
	
	#anythingSlider_stage_about_inside p {
		color: #fff;
		padding: 0px 30px 10px 30px;
		line-height: 18px;
		letter-spacing: 1.5px;
	}

#anythingSlider_stage_portfolio {
	width: 910px;
	height: 585px;
	margin: 17px 0 0 25px;
	background-image: url(../images/portfolio_sliding_image_bg.png);
	background-repeat: no-repeat;
}


#footer {
	width: 930px;
	height: 295px;
	margin: 20px 0 0 20px;
	padding: 32px 0 0 38px;  
	background-image: url(../images/footer_bg.png);
	background-repeat: no-repeat;
}

	#footer_left {
		width: 270px;
		height: 260px;
		float: left;
	}
	
	#footer_center {
		width: 300px;
		height: 260px;
		float: left;
	}
	
	#footer_right {
		width: 280px;
		height: 260px;
		padding-left: 15px;
		float: left;
	}
	
		#footer_right img {
			float: left; 
			border: 5px solid #000;
			margin: 5px 10px 5px 0;
		}
		
		#footer_right p {
			margin-top: 2px;
			font-size: 14px;
		}
/*....................................................................... 
	Nav
...................................................................... */

#main_nav {
	margin: 0 0 0 25px;
}

ul#nav {
	display: inline;
}

	ul#nav li a {
		display: block;
		height: 30px;
		text-indent: -9999px;
		float: left;
	}

		ul#nav li.home a {
			width:152px;
			background: url(../images/home.jpg) bottom center;
		}
		
		ul#nav li.portfolio a {
			width:153px;
			background: url(../images/portfolio.jpg) bottom center;
		}
		
		ul#nav li.about a {
			width:152px;
			background: url(../images/about.jpg) bottom center;
		}
		
			ul#nav li a:hover {
				background-position: top center;
			}
			
			ul#nav li a.active {
				background-position: top center;
			}
	
#portfolio_nav {
	margin: -15px 0 0 385px;
}

ul#portfolio {
	display: inline;
}

	ul#portfolio li a {
		display: block;
		height: 32px;
		text-indent: -9999px;
		float: left;
	}

		ul#portfolio li.websites a {
			width:126px;
			background: url(../images/websites.png) top center;
		}
		
		ul#portfolio li.textiles a {
			width:129px;
			background: url(../images/textiles.png) top center;
		}
		
		ul#portfolio li.photo a {
			width:128px;
			background: url(../images/photo.png) top center;
		}
		
		ul#portfolio li.fineart a {
			width:126px;
			background: url(../images/fine_art.png) top center;
		}
		
			ul#portfolio li a:hover {
				background-position: bottom center;
			}
			
			ul#portfolio li a.active {
				background-position: bottom center;
			}

#anythingSlider_stage_portfolio ul {
	width: 300px;
	height: 125px;
	top: 15px;
}

ul.tertiary_nav {
	
}

ul.tertiary_nav li {
	color: #fff;
	font-size: 12px;
}


/*....................................................................... 
	anythingSlider     By Chris Coyier: http://css-tricks.com with major improvements by Doug Neiner: http://pixelgraphics.us/ based on work by Remy Sharp: http://jqueryfordesigners.com/
...................................................................... */

.anythingSlider                         { width: 910px; height: 320px; position: relative; margin: 0 auto 15px; }
.anythingSlider .wrapper                { width: 830px; overflow: auto; height: 323px; margin: 15px 0 0 40px; position: absolute; top: 0; left: 0; }
.anythingSlider .wrapper ul             { width: 9999px; list-style: none; position: absolute; top: 0; left: 0; background: #eee; border-top: 3px solid #CC0000; border-bottom: 3px solid #CC0000; margin: 0; }
.anythingSlider ul li                   { display: block; float: left; padding: 0; height: 326px; width: 910px; margin: 0; }
.anythingSlider .arrow                  { display: block; height: 200px; width: 67px; background: url(../images/arrows.png) no-repeat 0 0; text-indent: -9999px; position: absolute; top: 65px; cursor: pointer; }
.anythingSlider .forward                { background-position: 0 0; right: -20px; }
.anythingSlider .back                   { background-position: -67px 0; left: -20px; }
.anythingSlider .forward:hover          { background-position: 0 -200px; }
.anythingSlider .back:hover             { background-position: -67px -200px; }

#thumbNav                               { position: relative; top: 338px; text-align: center; }
#thumbNav a                             { color: black; font: 11px/18px; Georgia, Serif; display: inline-block; padding: 2px 8px; height: 18px; margin: 0 5px 0 0; background: #CC0000 url(../images/cellshade.png) repeat-x; text-align: center; -moz-border-radius-bottomleft: 5px; -moz-border-radius-bottomright: 5px; -webkit-border-bottom-right-radius: 5px; -webkit-border-bottom-left-radius: 5px; }
#thumbNav a:hover                       { background-image: none; }
#thumbNav a.cur                         { background: #000; color: #fff;}

#start-stop                             { background: green; background-image: url(../images/cellshade.png); background-repeat: repeat-x; color: white; padding: 2px 5px; width: 40px; text-align: center; position: absolute; right: 45px; top: 338px; -moz-border-radius-bottomleft: 5px; -moz-border-radius-bottomright: 5px; -webkit-border-bottom-right-radius: 5px; -webkit-border-bottom-left-radius: 5px; }
#start-stop.playing                     { background-color: red; }
#start-stop:hover                       { background-image: none; }

/*
  Prevents
*/
.anythingSlider .wrapper ul ul          { position: static; margin: 0; background: none; overflow: visible; width: auto; border: 0; }
.anythingSlider .wrapper ul ul li       { float: none; height: auto; width: auto; background: none; }

ul                                      { margin: 0 0 25px 25px; }
ul li                                   { font: 15px Georgia, Serif; margin: 0 0 8px 0; }

#dl                                     { position: absolute; top: 10px; right: 0; background: black; color: white; -moz-border-radius: 5px; -webkit-border-radius: 5px; padding: 3px 6px; }
#dl:hover                               { background: #666; }

/*
    This stuff is for the TitleBlock Plugin
*/
.image                                  { position: relative; margin-bottom: 20px; width: 100%; }
.image h2                               { position: absolute; top: 220px; left: 0; width: 100%; }
.image h2 span                          { color: white; font: bold 30px/40px Helvetica, Sans-Serif; letter-spacing: -1px; background: rgb(0, 0, 0); background: rgba(0, 0, 0, 0.7); padding: 6px 8px; }
.image h2 span.spacer                   { padding: 0 2px; background: none; }

/*....................................................................... 
    Misc.
...................................................................... */

div.clear { clear: both; }

.red { color: #CC0000;}

.grey { color: #666; }

.red_arrow { margin: -100px 0 0 120px;}

.input { 
	border: 1px solid #006;
	background-color: #CC0000;
	color: #fff;
	font-family: Georgia, "New Century Schoolbook","Nimbus Roman No9 L", serif;
	font-size: 14px;
	margin-top: 7px;
}