/* ----------------------------- 
	COMMON STYLES 
----------------------------- */
    html { overflow-y: scroll; }
	html, body{  margin: 0; padding: 0; font-family: "Century Gothic", Verdana, "Trebuchet MS", Arial, sans-serif; width: 100%;  } 
	body {  font-size: 13px; text-align: center; background: #7c8697 url(../images/body_background.png) repeat-x top left; background-attachment: fixed; }
	p, h1, h2, h3, h4, h5, h6, form, ul, ol, li, dd, dt, dl, form, blockquote, button {  margin: 0; padding: 0; font-weight: normal; color: #333;  }
	p {  font-size: 13px; }
	a {  text-decoration: none; color: #BF5417; font-weight: 900;  }
	a:hover {  color: #F8CC38; text-decoration: underline; }
	img {  display: block; border: none; }
	ol, ul {  list-style-position: outside; list-style-type: none; }
	h1 {  font-size: 38px;  }
	h2 {  font-size: 32px; }
	h3 {  font-size: 32px; }
	h4 {  font-size: 12px; font-weight: 900; }
	h5 {  font-size: 12px; }
	select, textarea, input {  font-family: arial; font-size:12px; } 
	em {  font-style: normal; text-decoration: underline; }
	
	.clearer {  clear: both; }
	.bold {  font-weight: 900; }
	
/* -----------------------------
	HEADINGS
----------------------------- */
	h2.page_heading	{ margin: 20px 0 0 18px; color: #69634d; font-weight: 900; }
		h2.page_heading span {  color: #333; font-weight: normal; margin-left: -8px; }
	
	
	h3.arrow_heading { height: 54px; float: left; margin: 20px 0 0 0; padding: 0 0 0 23px; display: block;  background: url(../images/header_arrow_left.gif) no-repeat top left; font-size: 16px; font-weight: 900; }
	h3.arrow_heading span { float: left; display: block; padding: 16px 72px 16px 0; background: url(../images/header_arrow_right.gif) no-repeat top right; color: #666; }

	
/* ----------------------------- 
	PAGE FRAMEWORK 
----------------------------- */	

	#page_wrapper {  width: 100%; margin: 25px auto 0 auto; background: url(../images/body_dropshadow.png) repeat-y center; text-align: left;  }

	/* --- HEADER --- */
	#header {  width: 1000px; height: 200px; position: relative; background: url(../images/header_background.jpg) no-repeat bottom right; border-top: 6px solid #b94401; margin: 0 auto;  }

	#header #site_heading {  margin: 48px 0 40px 40px; text-align: left; }
		#header #site_heading #logo {  float: left; }
		#header #site_heading #heading_text {  float: left; margin: 24px 0 0 6px; }
		#header #site_heading #heading_text h1 {  color: #FFF; line-height: 32px; }
		#header #site_heading #heading_text h1 span {  color: #afc501;   }
		#header #site_heading #heading_text h6 {  font-size: 26px; color: #b34000; margin: 0 0 0 142px; }
		
		#header #social_media_icons {  position: absolute; top: 20px; right: 15px; }
		#header #social_media_icons li {  float: left; margin: 0 10px 0 0;  }

	/* --- NAVIGATION --- */
	#nav_bar { width: 1000px; height: 70px; margin: 0 auto; background: #e1e1e1 url(../images/nav_bar_bg.gif) repeat-x top left; position: relative; }
	#nav_bar #nav_bar_dropshadow {  width: 1000px; height: 7px; position: absolute; bottom: -7px; left: 0; background: url(../images/nav_bar_dropdshadow.png) repeat-x top left; }
	
	#nav_bar ul#nav {  float: right; margin: 4px 0 0 0; }
	#nav_bar ul#nav li {  float: left; margin: 0 5px 0 0; }
		#nav_bar ul#nav li a {  float: left; height: 32px; padding-left: 17px; color: #FFF; text-transform: uppercase; font-size: 14px; }
		#nav_bar ul#nav li a span { height: 28px; display: block; float: left; padding: 6px 17px 0 0; cursor: pointer;  }
			#nav_bar ul#nav li.selected a {  background: url(../images/nav_selected_left.png) no-repeat top left;   }
			#nav_bar ul#nav li.selected a span {  background: url(../images/nav_selected_right.png) no-repeat right top;  }		
		#nav_bar ul#nav li a:hover {  background: url(../images/nav_selected_left.png) no-repeat top left;   }
		#nav_bar ul#nav li a:hover span {  background: url(../images/nav_selected_right.png) no-repeat right top;  }
				
	
	/* --- BREADCRUMB --- */
	#nav_bar ol#breadcrumbs { width: auto; margin: 11px 0 0 17px; float: left; font-size: 11px; }
	#nav_bar ol#breadcrumbs li { float: left; margin: 0 10px 0 0; padding: 0 16px 0 0; background: url(../images/icon_chevron.gif) no-repeat right;  }
	#nav_bar ol#breadcrumbs li.current { background: none; font-weight: 900;  }
	#nav_bar ol#breadcrumbs #breadcrumbs li a { font-weight: normal; }
	
	/* --- SUB MENU --- */
	#sub_menu { width: 630px; margin: 10px 20px 0 0; padding: 5px 0 0 0; float: right; display: inline; border-top: 1px solid #ccc;  }
	#sub_menu li { float: right; margin: 0 0 0 2px; font-weight: 900; padding: 0 0 0 16px; background: url(../images/icon_bar.gif) no-repeat left; }
		#sub_menu li.first { background: none; margin: 0; padding: 0;  }
	
	/*	--- PAGE CONTENT --- */
	#page_content_wrapper {  width: 1000px; margin: 0 auto; padding: 0 0 20px 0; background: url(../images/page_content_bg.gif) repeat-y top left; }	
	#page_content_wrapper #left_column {  width: 669px; float: left; }
		#page_content_wrapper #left_column .padding {  width: 629px; float: left; margin: 20px 0 0 20px; display: inline; }
	#page_content_wrapper #right_column {  width: 301px; float: left; }
	
	/* --- FOOTER --- */
	#footer {  width: 1000px; height: 216px; margin: 0 auto; color: #FFF; border-top: 1px solid #AFC501; background: #3c3a3c url(../images/footer_bg.gif) repeat-x top left ;   }
	#footer p { float: right; margin: 20px 20px 0 0; display: inline; color: #FFF; }
	#footer p span { color: #afc501; }

/* ----------------------------- 
	CONTENT BOXES 
----------------------------- */

	/* --- HOMEPAGE IMAGE --- */
	#homepage_image { margin: 20px 0; }

	/* --- RIGHT HAND QUOTATION --- */
	#quote_box {  width: 306px; margin: 20px 0 0 13px; float: left; display: inline;   }
		#quote_box h3 {  color: #69634d; font-weight: 900; margin: 0 0 20px 0; }
		#quote_box h3 span {  color: #333; font-weight: normal; margin-left: -8px; }
		#quote_box #the_quote {  background: url(../images/blockquote_top.png) no-repeat top left; }
		#quote_box #the_quote blockquote {  padding: 18px 46px 20px 52px;  background: url(../images/blockquote_bottom.png) no-repeat bottom right; }
	
	/* --- RIGHT HAND CV LINK --- */
	#cv_download {  width: 306px; height: 187px; margin: 20px 0 180px 13px; float: left; display: inline; background: url(../images/cv_box_bg.png) no-repeat top left; }
		#cv_download h3 {  margin: 3px 15px 12px 0; float: right; display: inline; color: #69634d; font-weight: 900; }
		#cv_download h3 span {  color: #333; font-weight: normal; margin-left: -8px; }
		#cv_download img {  float: left; margin: 0 12px 0 10px; display: inline; }
		#cv_download p {  margin: 42px 0 0 0; float: left; display: block; font-size: 72px; color: #8b8b8b; }
		
	/* --- CONTENT BOXES --- */
	.content_box { width: 629px; float: left; margin: 20px 0 0 20px; padding: 10px 0 0 0; background: url(../images/content_box_top.gif) no-repeat top left;  }
		.content_box .content_box_bottom { background: url(../images/content_box_bottom.gif) no-repeat bottom left; width: 100%; height: 20px; }
		.content_box p { margin: 20px 0 0 20px; width: 589px; }
		.content_box p.first_paragraph { width: auto; margin-top: 10px; padding-right: 20px; font-style: italic;  font-weight: 900; }
		
		.content_box a.download_link_pdf { height: 44px; margin: 20px 0 0 14px; float: left; background: url(../images/icon_pdf_small.png) no-repeat 6px 6px; padding: 0 12px 0 50px; display: inline; }
			.content_box a.download_link_pdf:hover { background-color: #BF5417; }
			.content_box a.download_link_pdf span { padding-top: 14px; display: block; }

		.content_box a.download_link_jpg { height: 44px; margin: 20px 0 0 14px; float: left; background: url(../images/icon_jpg_small.png) no-repeat 6px 6px; padding: 0 12px 0 50px; display: inline; }
			.content_box a.download_link_jpg:hover { background-color: #BF5417; }
			.content_box a.download_link_jpg span { padding-top: 14px; display: block; }

		.content_box a.back_to_top { clear: both; float: left; margin: 20px 0 0 20px; display: inline; background: url(../images/icon_arrow_up.gif) no-repeat left; padding: 0 0 0 16px; font-size: 11px; }	
			
		.content_box .content_image { margin: 15px 0 0 2px; }
		.content_box .content_box_image { float: left; margin: 10px 10px 0 20px; display: inline; border: 1px solid #e0e0e0;  }
		
		
		.content_box ul { margin: 20px 0 20px 0; }
		.content_box ul li { width: 569px; float: left; padding: 2px 0 0 40px; margin: 0 0 5px 0; background: url(../images/content_box_bullet.gif) no-repeat top left; }

	/* --- PAGE CONTENTS --- */
	#page_contents { width: 669px; background: #F3F3F3; border: 1px solid #e1e1e1; border-left: none; border-right: none;  float: left; margin: 10px 0 0 0; }
	#page_contents h5 { font-weight: 900; margin: 10px 0 0 20px; font-size: 14px; }
	#page_contents ol { margin: 10px 0 15px 40px; list-style-type: decimal; float: left; }
	#page_contents ol li { margin-bottom: 3px; }
		
	/* --- SKILLS GRAPHS --- */
	#skills_list { width: 600px; margin: 20px 0 0 20px;  }
		#skills_list dt { clear: both; margin-bottom: 3px; font-weight: 900; }
		#skills_list dd { width: 582px; height: 14px; float: left; margin: 0 0 10px 0; border: 1px solid #333; background: #e0e0e0 url(../images/graph_gradient.gif) no-repeat left;  }
		#skills_list dd div { height: 14px; background: #b94401;}
		#skills_list dd div span { float: right; padding: 0 12px 0 0; font-size: 10px; color: #FFF; background: url(../images/graph_marker.gif) no-repeat top right; }	

	/* --- PERSONA LIST --- */	
	#personas_list { width: auto; margin: 20px 0 0 20px; float: left; }
		#personas_list dt { clear: both; margin-bottom: 3px; font-weight: 900; }
		#personas_list dd { width: auto; margin: 0 0 10px 0; padding: 0 20px 0 0;  }

	/* --- SCENARIO LIST --- */	
	#scenario_list { margin: 20px 0 0 40px; list-style-type: decimal; }
	#scenario_list li { padding: 0 20px 0 0; margin: 0 0 5px 0; }
		 
/* ----------------------------
	GALLERY
----------------------------- */

	#main_image { width: 669px; height: 456px; margin: 20px 0 0 0; float: left; background: #f2ece5 url(../images/work_gallery_bg.gif) top left; position: relative; overflow: hidden; color: #fff; }
	
	#main_image .desc{ position: absolute; bottom: 0; left: 0; width: 100%; display: none; }
		#main_image .desc .block { width: 100%; background: #111; }
		#main_image .desc .block h5 { padding: 10px; font-size: 16px; font-weight: 900; color: #FFF;  }
		#main_image .desc .block p { padding: 0 10px 10px 10px; color: #666; }
		#main_image .desc .block a { float: right; padding: 0 25px 10px 0; }

	#main_image a.collapse {  height: 34px; width: 100px; background: #111; color: #FFF; position: absolute; top: -34px; right: 20px; opacity: 0.9}
		#main_image a.collapse span { padding: 10px; display: block;  }
		#main_image	a.collapse:hover { background: #BF5417; }
	#main_image a.show {}

	#image_thumb { float: left; width: 100%; border-right: 1px solid #fff; border-top: 1px solid #ccc;}
	#image_thumb img { border: 1px solid #ccc; padding: 5px; background: #fff; float: left;}
	#image_thumb ul { margin: 0; padding: 0; list-style: none;}
	#image_thumb ul li{ margin: 0; padding: 12px 10px; background: #f0f0f0 url(nav_a.gif) repeat-x; width: 202px; float: left; border-bottom: 1px solid #ccc; border-right: 1px solid #ccc;}
	#image_thumb ul li h5 { font-weight: 900; font-size: 13px; }
	#image_thumb ul li p { display: none; } /*-- Hide the description on the list items --*/		
		#image_thumb ul li.hover { background: #BF5417; cursor: pointer; }
			#image_thumb ul li.hover h5 { color: #FFF; }
		#image_thumb ul li.active { background: #FFF; cursor: default; }
			#image_thumb ul li.active h5 { color: #333; }
	#image_thumb ul li .block { width: 130px; float: left; margin-left: 10px; padding: 0; ;}
	#image_thumb ul li .block a { display: none; } /*-- Hide the link on the list items --*/
	
/* ----------------------------
	CONTACT FORM 
---------------------------- */	
	#contact_form { margin: 10px 0 0 0; float: left; }
	#contact_form .row { width: 620px; float: left; margin: 0 0 5px 0; }
	#contact_form .row label { width: 100px; float: left; margin: 0 10px 0 20px; display: inline; }
		#contact_form .row label.error { color: #FF0000; width: 200px; margin: 0 0 0 130px; font-size: 11px; display: block; float: none; clear: both; }
	#contact_form .row input { width: 280px; float: left; }
		#contact_form input#submit_button { width: 140px; margin: 0 0 0 278px; }
	#contact_form .row textarea { width: 280px; float: left; }
	
	p.contact_success { color: #39b44a; }

/* --- CHRIS MEARS 2009 --- */