/**********************************************************************************************

	Title: CSS
	Author: Cara Thiem
	Date: 2009 

***********************************************************************************************

	1. Global Reset
	
	2. General Elements
	
	3. Layout
		3.1 Header
		3.2 Pitch
		3.3 portfolio
		3.4 Services
		3.5 We do
		3.6 Footer		
		
***********************************************************************************************/


/* 1. Global 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, images, 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;
	text-align: left;
}

	ol, ul {
		list-style: none;
	}
	
	table {
		border-collapse: separate; 
		border-spacing: 0;
	}

	caption, th, td {
		text-align: left; 
		font-weight: normal;
	}
	h1, h2, h3, h4, h5, h6 {
		font-weight:normal;
	}

/* 2. General Elements
-----------------------------------------------------------------------------------------------
===============================================================================================*/	

	#body_style { background: #181b0f url('images/gradient_bg.jpg') repeat-x;  } 
	
	#container {		
		width:950px;
		height:950px;
	}


/* 3 HEADER
------------------------------------------------------------------------------------------------ */
#header_container {
		width:950px;
		height:163px;
}

#header_logo {
		background: url('images/header_logo4.jpg') no-repeat;
		float:left;
		position: relative;
		width:950px;
		height:163px;		
}

#header_right {
		float:right;
		position: relative;
		width:521px;
		height:163px;
}

#networkinglinks_container {
	float: left;
	width: 270px;
	height: 35px;
	padding: 8px 0px 0px 680px;
	
}

#networking_links {
	float: left;
	font-weight: none; 
	text-decoration: none; 
	font: 10px "Century Gothic", "Avant Garde", Verdana, Arial, Helvetica, sans-serif; 
	width: 80px;
	height: 20px;
	padding: 0px 0px 0px 8px;
}

#contactme {
	float: right; 
	text-align: right; 
	display:block; color:#000000;  
	text-decoration:none; 
	font: 13px "Century Gothic", "Avant Garde", Verdana, Arial, Helvetica, sans-serif;  
	width: 250px;
	height: 20px;
	padding: 0px 25px 0px 0px;
}

#networking_icons {
	float: left;
	width: 14px;
	height: 14px;
	border: none;
	padding: 0px 4px 0px 0px;
}

#home_link {
		width:300px;
		height:130px;
		margin: 0px 325px 0px 325px;
}

	
/* 3.1 MENU
-----------------------------------------*/
	#main_menu {
		float:left;
		position: relative;
		display:inline;
		width:950px;
		height:27px;
	}
	.webdesign_btn {
		float:left;
		position: relative;
		background:url('images/web_nav.png') left top no-repeat;
		display:block;
		height:27px;
		width:126px;
		overflow:hidden;
		text-align:right; 
	}
	.webdesign_btn:hover {
		background:url('images/web_nav.png') left bottom no-repeat;
		}
	.graphics_btn {
		float:left;
		position: relative;
		background:url('images/graphics_nav.png') left top no-repeat;
		display:block;
		height:27px;
		width:109px;
		overflow:hidden;
		text-align:center;
	}
	.graphics_btn:hover {
		background:url('images/graphics_nav.png') left bottom no-repeat;
		}			
	.branding_btn {
		float:left;
		position: relative;
		background:url('images/branding_nav.png') left top no-repeat;
		display:block;
		height:27px;
		width:113px;
		overflow:hidden;
		text-align:center;
	}
	.branding_btn:hover {
		background:url('images/branding_nav.png') left bottom no-repeat;
		}
	.photography_btn {
		float:left;
		position: relative;
		background:url('images/photography_nav.png') left top no-repeat;
		display:block;
		height:27px;
		width:157px;
		overflow:hidden;
		text-align:center;
	}
	.photography_btn:hover {
		background:url('images/photography_nav.png') left bottom no-repeat;
		}
	.services_btn {
		float:left;
		position: relative;
		background:url('images/services_nav.png') left top no-repeat;
		display:block;
		height:27px;
		width:107px;
		overflow:hidden;
		text-align:center;
	}
	.services_btn:hover {
		background:url('images/services_nav.png') left bottom no-repeat;
		}
	.aboutme_btn {
		float:left;
		position: relative;
		background:url('images/aboutme_nav.png') left top no-repeat;
		display:block;
		height:27px;
		width:112px;
		overflow:hidden;
		text-align:center;
	}
	.aboutme_btn:hover {
		background:url('images/aboutme_nav.png') left bottom no-repeat;
		}
	.contact_btn {
		float:left;
		position: relative;
		background:url('images/contact_nav.png') left top no-repeat;
		display:block;
		height:27px;
		width:102px;
		overflow:hidden;
		text-align:center;
	}
	.contact_btn:hover {
		background:url('images/contact_nav.png') left bottom no-repeat;
		}
		
	.quote_btn {
		float:left;
		position: relative;
		background:url('images/quote_nav.png') left top no-repeat;
		display:block;
		height:27px;
		width:124px;
		overflow:hidden;
		text-align:left;
	}
	.quote_btn:hover {
		background:url('images/quote_nav.png') left bottom no-repeat;
	}

	#main_menu li.webdesign {				
			padding-left:1px;
			margin-left:0px;
			display:inline;
	}
	
	#main_menu a {
			color:#4b4b4b;
			font: 15px "Century Gothic", "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
			padding:1px;
			font-weight:bold;
			text-decoration:none;
	}
		
		
/* 3.2 Main Content
-----------------------------------------*/
	
	#main_content_container {
		float:left;
		position: relative;
		width: 950px;
		height: 643px;
	}
	
	#main_content_leftside {
		float:left;
		position: relative;
		background: url('images/content_leftside_shadow.png') no-repeat;
		width: 20px;
		height: 643px;	
	}
	
	#main_content_center {
		float:left;
		position: relative;
		background: url('images/main_content_center.jpg') repeat-x;
		width: 910px;
		height: 643px;
	}
	
	
	#main_content_bg {
		float:left;
		position: relative;
		background: url('images/grey_container.jpg') repeat-x;
		background-color:#FFF;
		width: 893px;
		height: 610px;
		margin: 16px 0px 0px 10px;
	}
	
	#main_content_rightside {
		float:left;
		position: relative;
		background: url('images/content_rightside_shadow.png') no-repeat;
		width: 20px;
		height: 643px;
	}	

	#top_pic {
		float:left;
		position: relative;
		background: url('images/top-pic7.jpg') no-repeat;
		width: 881px;
		height: 315px;
		margin: 9px 6px 0px 6px;
	}
	
	#middle_categorys {
		float:left;
		position: relative;
		background: url('images/home_center_gradient.jpg') repeat-x;
		width: 881px;
		height: 265px;
		margin: 10px 6px 0px 6px;
	}
	
	#webdesign_category {
		float:left;
		position: relative;
		width: 293px;
		height: 265px;
	}
	
	#logo_category {
		float:left;
		position: relative;
		width: 293px;
		height: 265px;
	}
	
	#print_category {
		float:left;
		position: relative;
		width: 293px;
		height: 265px;
	}
	
	.category_devider {
		float:right;
		position: relative;
		background: url('images/portfolio_seporator_line.jpg') no-repeat;
		width: 2px;
		height: 265px;
	}

	.category_header {
		float: left;
		color:#3f504c;
		font: 18px "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
		font-weight:bold;
		text-align:center;
		width: 285px;
		height: 20px;
		margin: 10px 3px 15px 3px;
	}
	
	.category_image {
		float: left;
		position: relative;
		width: 270px;
		height: 108px;
		margin: 0px 10px 10px 10px;
	}
	
	.category_description {
		float: left;
		position: relative;
		text-align:center;
		color:#3f504c;
		font: 12px "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
		font-weight:bold;
		width: 250px;
		height: 40px;
		margin: 5px 19px 10px 19px;
		text-decoration:none;
	}
	
	.category_btn {
		float: left;
		position: relative;
		width: 165px;
		height: 34px;
		margin: 15px 60px 0px 60px;
	}

	.btn_web {
		background:url('images/btn_web.png') left top no-repeat;
		display:block;
		height:34px;
		width:165px;
		margin: 15px 84px 0px 44px;
		overflow:hidden;
	}
	.btn_web:hover {
		background:url('images/btn_web.png') left bottom no-repeat;
		}
	
	.btn_logo {
		background:url('images/btn_logo.png') left top no-repeat;
		display:block;
		height:34px;
		width:165px;
		margin: 15px 84px 0px 44px;
		overflow:hidden;
	}
	.btn_logo:hover {
		background:url('images/btn_logo.png') left bottom no-repeat;
		}
		
	.btn_design {
		background:url('images/btn_design.png') left top no-repeat;
		display:block;
		height:34px;
		width:165px;
		margin: 15px 84px 0px 44px;
		overflow:hidden;
	}
	.btn_design:hover {
		background:url('images/btn_design.png') left bottom no-repeat;
		}

/* 3.3 Bottom Section
-----------------------------------------*/
	
	#bottom_section {
	float:left;
	width: 881px;
	height: 190px;
	margin: 6px 6px 0px 6px;
	text-align: left;
	}
	#bottom_left {
		float: left;
		background: url('images/bottom_inside_gradient_left.jpg') no-repeat;
		width: 18px;
		height: 190px;
		margin: 0px 0px 0px 0px;
	}
	
	#bottom_gradient {
		float:left;
		background: url('images/bottom_inside_gradient.jpg') repeat-x;
		width: 404px;
		height: 190px;
		margin: 0px;
	}
	#bottom_left_side {
		width: 384px;
		height: 165px; 
	}
	
	#bottom_text_title {
		float:left;
		width: 160px;
		height: 20px;
		color:#CCC;
		font: 17px "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
		font-weight:bold;
		margin: 0px 5px 5px 0px; 
	}
	#bottom_text1 {
		float:left;
		width: 160px;
		height: 150px;
		color:#ccc;
		font: 13px "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
		font-weight:bold;
		margin: 140px 5px 5px 30px; 
	}
	
	#bottom_text2 {
		float:left;
		width: 180px;
		height: 125px;
		color:#ccc;
		font: 13px "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
		font-weight:bold;
		margin: 127px 5px 0px 0px; 
		padding: 40px 0px 0px 0px;
	}
	
	.btn_view_services {
		float:left;
		position: relative;
		background:url('images/view_services_btn.png') left top no-repeat;
		display:block;
		height:26px;
		width:158px;
		overflow:hidden;
		text-align:right;
		cursor:pointer;
		margin: 5px 0px 0px 0px; 
	}
	.btn_view_services:hover {
		background:url('images/view_services_btn.png') left bottom no-repeat;
		}
		
	.category_devider_bottom {
		float:right;
		position: relative;
		background: url('images/bottom_separatorline.png') no-repeat;
		width: 2px;
		height: 177px;
		margin: 10px 0px 0px 0px; 
	}
	
	#bottom_right_side {
		width: 398px;
		height: 165px;
		color:#3f504c;
		font: 16px "Century Gothic", "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
		font-weight:bold;
		margin: 10px 5px 5px 5px;
	}
	
	#bottom_left_arrow {
		float:left;
		background:url('images/left_arrow.png') left center no-repeat;
		width: 11px;
		height: 56px;
		margin: 54px 0px 54px 0px;
	}
	
	#bottom_right_content {
		position: relative;
		float: left;
		width: 350px;
		height: 139px;
		margin: 15px 5px 0px 5px;
		border: 1px solid #000000;
	}

	#bottom_right_arrow {
		float:left;
		background:url('images/right_arrow.png') left center no-repeat;
		width: 11px;
		height: 56px;
		margin: 54px 0px 54px 0px;
	}
	
	.btn_view_recent {
		position: relative;
		background:url('images/view_recent_btn.png') left top no-repeat;
		display:block;
		height:26px;
		width:158px;
		overflow:hidden;
		text-align:right;
		cursor:pointer;
		margin: 0px 0px 0px 0px; 
	}
	.btn_view_recent:hover {
		background:url('images/view_recent_btn.png') left bottom no-repeat;
		}
		
	#bottom_right {
		float:left;
		background: url('images/bottom_inside_gradient_right.jpg') no-repeat;
		width: 18px;
		height: 190px;
		margin: 0px;
	}
	

/* 4 Footer
-----------------------------------------*/

	#footer {
		float: left;
		position: relative;
		width: 950px;
		height: 60px;
	}

	#bottom_logo {
		float: left;
		position: relative;
		background: url('images/bottom_logo.png') no-repeat;
		width: 216px;
		height: 39px;
		margin: 10px 367px 5px 367px;
	}
	
	#copywrite { text-align: center; 
	display:block; color:#ffffff;  
	text-decoration:none; 
	font: 10px "Century Gothic", "Avant Garde", Verdana, Arial, Helvetica, sans-serif; 
	padding: 15px 0px 20px 0px; }
		


/* 5 Main Content
-----------------------------------------*/
	#main_content {
		float:left;
		position: relative;
		background: url('images/content_gradient.jpg') repeat-x;
		width: 881px;
		height: 596px;
		margin: 7px 6px 7px 6px;
	}
	
	#main_content_workthumbs {
		float:left;
		position: relative;
		background: url('images/content_gradient.jpg') repeat-x;
		background-color:#FFFFFF;
		width: 881px;
		height: 596px;
		margin: 7px 6px 7px 6px;
		overflow: scroll;
		overflow-x: hidden;
	}
	
/* 6 Web Portfolios
-----------------------------------------*/
	#web_portfolio_header {
		float:left;
		position: relative;
		background: url('images/web_header.png') no-repeat;
		width: 881px;
		height: 314px;
	}
	
	#parazyn_header {
		float:left;
		position: relative;
		background: url('images/parazyns-top.png') no-repeat;
		width: 881px;
		height: 314px;
	}
	
	#actionfit_header {
		float:left;
		position: relative;
		background: url('images/actionfit-header.png') no-repeat;
		width: 881px;
		height: 314px;
	}
	
	#paradise_header {
		float:left;
		position: relative;
		background: url('images/paradise-header.png') no-repeat;
		width: 881px;
		height: 314px;
	}
	
	#camasonry_header {
		float:left;
		position: relative;
		background: url('images/camasonry-header.png') no-repeat;
		width: 881px;
		height: 314px;
	}
	
	#teamwyle_header {
		float:left;
		position: relative;
		background: url('images/team-wyle-header.png') no-repeat;
		width: 881px;
		height: 314px;
	}
	
	#teamwyle_description {
		float:left;
		position: relative;
		width: 230px;
		height: 140px;
		margin: 140px 20px 20px 30px;
		text-align:center;
		color:#000000;
		font: 13px "Century Gothic", "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
		font-weight:bold;
		text-decoration:none;
	}
	
	#actionfitlink {
		float: right;
		position: relative;
		width: 200px;
		height: 80px;
		margin: 15px 10px 50px 300px;
		text-align:right;
		color:#000000;
		font: 13px "Century Gothic", "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
		font-weight:bold;
		text-decoration:none;
	}
	
	#view_site {
		float: right;
		position: relative;
		width: 200px;
		height: 50px;
		margin: 250px 55px 0px 250px;
		text-align:right;
		color:#000000;
		font: 13px "Century Gothic", "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
		font-weight:bold;
		text-decoration:none;
	}
	
	#portfolio_title {
		float:left;
		position: relative;
		width: 230px;
		height: 140px;
		margin: 110px 10px 5px 40px;
		padding: 20px 0px 10px 0px;
		text-align:left;
		color:#000000;
		font: 13px "Century Gothic", "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
		text-decoration:none;
	}
	
	#web-portfolio_title {
		float:left;
		position: relative;
		width: 250px;
		height: 140px;
		margin: 115px 10px 5px 30px;
		padding: 20px 0px 10px 0px;
		text-align:left;
		color:#000000;
		font: 13px "Century Gothic", "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
		text-decoration:none;
	}
	
	
	#work_description {
		float:left;
		position: relative;
		width: 280px;
		height: 140px;
		margin: 140px 20px 20px 30px;
		text-align:center;
		color:#000000;
		font: 13px "Century Gothic", "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
		font-weight:bold;
		text-decoration:none;
	}
	
	#work_description-long {
		float:left;
		position: relative;
		width: 280px;
		height: 200px;
		margin: 90px 20px 20px 30px;
		text-align:center;
		color:#000000;
		font: 13px "Century Gothic", "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
		font-weight:bold;
		text-decoration:none;
	}
	
	#web_portfolio_devider {
		float:left;
		position: relative;
		background: url('images/horizontal_devider.jpg') no-repeat;
		width: 859px;
		height: 2px;
		margin: 0px 30px 0px 10px;
	}
	
	#web_portfolio_bottom_squares_container {
		float:left;
		position: relative;
		width: 881px;
		height: 282px;
		margin: 0px 0px 0px 0px;
	}
	
	#web_portfolio_bottom_squares {
		float:left;
		position: relative;
		background: #babcbc;
		width: 275px;
		height: 247px;
		margin: 15px 4px 5px 12px;
		border:#FFF 1px;
	}
	
	#web_squares_image {
		float:left;
		position: relative;
		width: 270px;
		height: 190px;
		padding: 2px 2px 0px 3px;
	}
	
	#web_squares_text {
		float:left;
		position: relative;
		width: 140px;
		height: 52px;
		margin: 3px 5px 5px 5px;
		text-align:center;
		color:#3f504c;
		font: 14px "Century Gothic", "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
		font-weight:bold;
		text-decoration:none;
	}
	
	.btn_view_details {
		float:left;
		position: relative;
		background:url('images/view_details_btn2.png') left top no-repeat;
		display:block;
		height:26px;
		width:112px;
		overflow:hidden;
		text-align:right;
		cursor:pointer;
		margin: 10px 5px 0px 5px; 
	}
	.btn_view_details:hover {
		background:url('images/view_details_btn2.png') left bottom no-repeat;
		}
		
	.btn_view_details_main {
		float:right;
		position: relative;
		background:url('images/view_details_btn2.png') left top no-repeat;
		display:block;
		height:26px;
		width:112px;
		overflow:hidden;
		text-align:right;
		cursor:pointer;
		margin: 10px 0px 0px 0px; 
	}
	.btn_view_details_main:hover {
		background:url('images/view_details_btn2.png') left bottom no-repeat;
		}
		
	.btn_view_site {
		float:right;
		position: relative;
		background:url('images/view_site_btn.png') left top no-repeat;
		display:block;
		height:26px;
		width:112px;
		overflow:hidden;
		text-align:right;
		cursor:pointer;
		margin: 10px 0px 0px 0px; 
	}
	.btn_view_site:hover {
		background:url('images/view_site_btn.png') left bottom no-repeat;
		}
		
	
	
	/* 7 Graphics Portfolios
-----------------------------------------*/
	#graphics_portfolio_squares {
		float:left;
		position: relative;
		background: #babcbc;
		width: 275px;
		height: 227px;
		margin: 10px 2px 0px 10px;
		border:#FFF 1px;
	}
	
	#graphics_portfolio_squares-long {
		float:left;
		position: relative;
		background: #babcbc;
		width: 275px;
		height: 247px;
		margin: 10px 2px 0px 10px;
		border:#FFF 1px;
	}
	
	#graphics_portfolio_header {
		float:left;
		position: relative;
		background: url('images/graphics_portfolio-header.png') no-repeat;
		background-color:#FFFFFF;
		width: 881px;
		height: 314px;
	}


	#graphics_portfolio_devider {
		float:left;
		position: relative;
		background: url('images/horizontal_devider.jpg') no-repeat;
		width: 840px;
		height: 2px;
		margin: 0px 30px 0px 10px;
	}
	
	#graphics_squares_text {
		float:left;
		position: relative;
		width: 140px;
		height: 25px;
		margin: 5px 5px 5px 5px;
		text-align:center;
		color:#3f504c;
		font: 14px "Century Gothic", "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
		font-weight:bold;
		text-decoration:none;
	}
	
	.btn_view_details_design {
		float:right;
		position: relative;
		background:url('images/view_details_btn2.png') left top no-repeat;
		display:block;
		height:26px;
		width:112px;
		overflow:hidden;
		text-align:right;
		cursor:pointer;
		margin: 2px 6px 0px 0px; 
	}
	.btn_view_details_design:hover {
		background:url('images/view_details_btn2.png') left bottom no-repeat;
		}
		
/* 8 Photography Portfolio
-----------------------------------------*/
	
	#photography_portfolio_header {
		float:left;
		position: relative;
		background: url('images/photography-header.png') no-repeat;
		width: 881px;
		height: 314px;
	}
	
	#photo-portfolio_title {
		float:left;
		position: relative;
		width: 250px;
		height: 140px;
		margin: 120px 10px 5px 30px;
		padding: 10px 0px 10px 0px;
		text-align:left;
		color:#000000;
		font: 13px "Century Gothic", "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
		text-decoration:none;
	}
	
/* 8 Logo Portfolio
-----------------------------------------*/
	#graphics_portfolio_squares {
		float:left;
		position: relative;
		background: #babcbc;
		width: 275px;
		height: 227px;
		margin: 10px 2px 0px 10px;
		border:#FFF 1px;
	}
	
	#logo_portfolio_header {
		float:left;
		position: relative;
		background: url('images/logo-portfolio-header.png') no-repeat;
		width: 881px;
		height: 314px;
	}


	#graphics_portfolio_devider {
		float:left;
		position: relative;
		background: url('images/horizontal_devider.jpg') no-repeat;
		width: 840px;
		height: 2px;
		margin: 0px 30px 0px 10px;
	}
	
	
	.btn_view_details_design {
		float:right;
		position: relative;
		background:url('images/view_details_btn2.png') left top no-repeat;
		display:block;
		height:26px;
		width:112px;
		overflow:hidden;
		cursor:pointer;
		text-align:right;
		margin: 2px 6px 0px 0px; 
	}
	.btn_view_details_design:hover {
		background:url('images/view_details_btn2.png') left bottom no-repeat;
		}
		
		
/* 9 Services
-----------------------------------------*/
	#graphics_portfolio_squares {
		float:left;
		position: relative;
		background: #babcbc;
		width: 275px;
		height: 227px;
		margin: 10px 2px 0px 10px;
		border:#FFF 1px;
	}
	
	#services_portfolio_header {
		float:left;
		position: relative;
		background: url('images/services-portfolio-header.png') no-repeat;
		width: 881px;
		height: 314px;
	}
	
	#services_title {
		float:left;
		position: relative;
		width: 260px;
		height: 140px;
		margin: 90px 10px 5px 40px;
		padding: 10px 0px 10px 0px;
		text-align:left;
		color:#000000;
		font: 13px "Century Gothic", "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
	}


	#graphics_portfolio_devider {
		float:left;
		position: relative;
		background: url('images/horizontal_devider.jpg') no-repeat;
		width: 840px;
		height: 2px;
		margin: 0px 30px 0px 10px;
	}
	
	#services_squares_text {
		float:left;
		position: relative;
		width: 140px;
		height: 25px;
		margin: 3px 5px 5px 6px;
		text-align:center;
		color:#3f504c;
		font: 14px "Century Gothic", "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
		font-weight:bold;
	}
	
	#nobtn_squares_text {
		position: relative;
		width: 265px;
		height: 25px;
		margin: 3px 5px 5px 5px;
		text-align:center;
		color:#3f504c;
		font: 14px "Century Gothic", "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
		font-weight:bold;
	}
	
	.btn_view_details_design {
		float:right;
		position: relative;
		background:url('images/view_details_btn2.png') left top no-repeat;
		display:block;
		height:26px;
		width:112px;
		overflow:hidden;
		text-align:right;
		cursor:pointer;
		margin: 2px 6px 0px 0px; 
	}
	.btn_view_details_design:hover {
		background:url('images/view_details_btn2.png') left bottom no-repeat;
		}
		
/* 9 Branding Portfolio
-----------------------------------------*/
	
	#branding_portfolio_header {
		float:left;
		position: relative;
		background: url('images/branding-portfolio-header.png') no-repeat;
		width: 881px;
		height: 314px;
	}
	
	#photo-portfolio_title {
		float:left;
		position: relative;
		width: 250px;
		height: 140px;
		margin: 120px 10px 5px 30px;
		padding: 10px 0px 10px 0px;
		text-align:left;
		color:#000000;
		font: 13px "Century Gothic", "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
	}
	
/* 10 Vector Illustrations Portfolio
-----------------------------------------*/
	
	#vector_portfolio_header {
		float:left;
		position: relative;
		background: url('images/vector-portfolio-header.png') no-repeat;
		width: 881px;
		height: 314px;
	}
	
	#vector-title {
		float:left;
		position: relative;
		width: 295px;
		height: 140px;
		margin: 120px 10px 5px 20px;
		padding: 10px 0px 10px 0px;
		text-align:left;
		color:#000000;
		font: 13px "Century Gothic", "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
	}
	
/* 10 Trade Shows
-----------------------------------------*/
	
	#tradeshow_portfolio_header {
		float:left;
		position: relative;
		background: url('images/tradeshow-portfolio-header.png') no-repeat;
		width: 881px;
		height: 314px;
	}
	
	#tradeshow-title {
		float:left;
		position: relative;
		width: 280px;
		height: 140px;
		margin: 150px 10px 5px 30px;
		padding: 10px 0px 10px 0px;
		text-align:left;
		color:#000000;
		font: 13px "Century Gothic", "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
	}
	
	#tradeshow_portfolio_container {
		float:left;
		position: relative;
		width: 881px;
		height: 282px;
		margin: 0px 0px 0px 0px;
	}
	
/* 11 Technical Illustrations
-----------------------------------------*/
	
	#technical_portfolio_header {
		float:left;
		position: relative;
		background: url('images/technical-header.png') no-repeat;
		width: 881px;
		height: 314px;
	}
	
/* 12 Spawar Portfolio
-----------------------------------------*/
	
	#spawar_portfolio_header {
		float:left;
		position: relative;
		background: url('images/spawar-header.png') no-repeat;
		width: 881px;
		height: 314px;
	}
	
		#spawar-portfolio_title {
		float:left;
		position: relative;
		width: 280px;
		height: 80px;
		margin: 190px 10px 5px 80px;
		padding: 10px 0px 10px 0px;
		text-align:left;
		color:#000000;
		font: 13px "Century Gothic", "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
	}
	
/* 13 JL Stormwater
-----------------------------------------*/
	
	#stormwater_portfolio_header {
		float:left;
		position: relative;
		background: url('images/stormwater-header.png') no-repeat;
		width: 881px;
		height: 314px;
	}
	
		#stormwater-portfolio_title {
		float:left;
		position: relative;
		width: 280px;
		height: 80px;
		margin: 190px 10px 5px 80px;
		padding: 10px 0px 10px 0px;
		text-align:center;
		color:#000000;
		font: 13px "Century Gothic", "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
	}
	
/* 14 Tattoo Portfolio
-----------------------------------------*/
	
	#tattoo_portfolio_header {
		float:left;
		position: relative;
		background: url('images/tattoo-header.png') no-repeat;
		width: 881px;
		height: 314px;
	}
	
		#tattoo-portfolio_title {
		float:left;
		position: relative;
		width: 250px;
		height: 100px;
		margin: 150px 10px 5px 45px;
		padding: 10px 0px 10px 0px;
		text-align:center;
		color:#000000;
		font: 13px "Century Gothic", "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
	}
	
	/* 14 Afcea C4ISR
-----------------------------------------*/
	
	#afcea_portfolio_header {
		float:left;
		position: relative;
		background: url('images/afcea-header.png') no-repeat;
		width: 881px;
		height: 314px;
	}
	
		#afcea-portfolio_title {
		float:left;
		position: relative;
		width: 250px;
		height: 100px;
		margin: 150px 10px 5px 45px;
		padding: 10px 0px 10px 0px;
		text-align:center;
		color:#000000;
		font: 13px "Century Gothic", "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
	}
	
/* 15 Old Artful Site
-----------------------------------------*/
	
	#artful_portfolio_header {
		float:left;
		position: relative;
		background: url('images/artful-header.png') no-repeat;
		width: 881px;
		height: 314px;
	}
	
		.btn_view_oldsite {
		float:right;
		position: relative;
		background:url('images/view_site_btn.png') left top no-repeat;
		display:block;
		height:26px;
		width:112px;
		overflow:hidden;
		text-align:right;
		cursor:pointer;
		margin: 10px 24px 0px 0px; 
	}
	.btn_view_oldsite:hover {
		background:url('images/view_site_btn.png') left bottom no-repeat;
		}
		
	#artful_title {
		float:left;
		position: relative;
		width: 230px;
		height: 140px;
		margin: 115px 10px 5px 40px;
		padding: 20px 0px 10px 0px;
		text-align:center;
		color:#000000;
		font: 13px "Century Gothic", "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
	}
	
	#artful_flash_container {
		float:left;
		position: relative;
		width: 633px;
		height: 272px;
		margin: 5px 124px 5px 124px;
	}
	
/* 16 About Me Section
-----------------------------------------*/
	
	#aboutme_header {
		float:left;
		position: relative;
		background: url('images/aboutme-header.png') no-repeat;
		width: 881px;
		height: 596px;
	}
	
	#aboutme-leftside {
		float:left;
		position: relative;
		width: 320px;
		height: 596px;
		margin: 0px 0px 0px 0px;
		text-align:center;
		color:#000000;
		font: 13px "Century Gothic", "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
		font-weight:bold;
	}
		
	#aboutme_photo {
		float:left;
		position: relative;
		background: #babcbc;
		width: 340px;
		height: 227px;
		margin: 40px 20px 20px 40px;
		border:#FFF 1px;
	}
	
	#aboutme-info {
		float:left;
		position: relative;
		width: 415px;
		height: 420px;
		margin: 100px 20px 20px 90px;
		text-align:center;
		color:#3f504c;
		font: 13px "Century Gothic", "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
	}
	
	#aboutme-extras {
		float:left;
		position: relative;
		width: 340px;
		height: 227px;
		margin: 5px 20px 5px 40px;
	}
	
	#aboutmeicons {
		float:left;
		position: relative;
		width: 33px;
		height: 33px;
		margin: 0px 10px 0px 30px;
	}
	
	#aboutmelinks {
		float:left;
		position: relative;
		width: 340px;
		height: 33px;
		margin: 2px 0px 2px 0px;
	}

	#linktext {
		float:left;
		position: relative;
		width: 230px;
		height: 20px;
		margin: 10px 0px 10px 0px;
		text-align:left;
		color:#3f504c;
		font: 13px "Century Gothic", "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
		font-weight:bold;
	}
	
/* Screen Printing
-----------------------------------------*/
	
	#screenprinting_header {
		float:left;
		position: relative;
		background: url('images/screenprinting-header.png') no-repeat;
		width: 881px;
		height: 314px;
	}
	
		#screenprinting_title {
		float:left;
		position: relative;
		width: 335px;
		height: 115px;
		margin: 140px 10px 5px 35px;
		padding: 10px 0px 10px 0px;
		text-align:center;
		color:#000000;
		font: 12px "Century Gothic", "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
	}
	
/* Invites and Announcments
-----------------------------------------*/
	
	#invites_header {
		float:left;
		position: relative;
		background: url('images/invites-header.png') no-repeat;
		width: 881px;
		height: 314px;
	}
	
		#invites_title {
		float:left;
		position: relative;
		width: 335px;
		height: 100px;
		margin: 115px 10px 5px 60px;
		padding: 10px 0px 10px 0px;
		text-align:center;
		color:#000000;
		font: 13px "Century Gothic", "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
	}
	
/* Fine Art
-----------------------------------------*/
	
	#fineart_header {
		float:left;
		position: relative;
		background: url('images/fineart-header2.png') no-repeat;
		width: 881px;
		height: 314px;
	}
	
		#fineart_title {
		float:left;
		position: relative;
		width: 270px;
		height: 100px;
		margin: 130px 10px 5px 40px;
		padding: 10px 0px 10px 0px;
		text-align:center;
		color:#000000;
		font: 13px "Century Gothic", "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
	}
	
/* Balboa Tennis Club
-----------------------------------------*/
	
	#tennis_header {
		float:left;
		position: relative;
		background: url('images/tennis-header.png') no-repeat;
		width: 881px;
		height: 314px;
	}

/* Quote Page
-----------------------------------------*/
	
	
	#quote_content {
		float:left;
		position: relative;
		background: url('images/quote-title.png')  no-repeat;
		background-position:top;
		width: 831px;
		height: 596px;
		color:#000000;
		font: 12px "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
		font-weight:bold;
		text-align:center;
		margin: 0px 0px 0px 0px;
		padding: 85px 0px 20px 20px;
	}
	
	.btn_submit {
		background:url('images/submit_form_btn.png') left top no-repeat;
		height:26px;
		width:113px;
		border:0;
		cursor:pointer;
		margin: 10px 310px 20px 290px;
		float:right;
		text-indent:-9999px;
	}
	.btn_submit:hover {
		background:url('images/submit_form_btn.png') left bottom no-repeat;
		}
		
	#checkboxes {
		float:left;
		position: relative;
		width: 170px;
		height: 12px;
		color:#000000;
		font: 11px "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
		font-weight:normal;
		text-align:left;
		margin: 3px 5px 3px 0px;
		padding: 0px 0px 0px 5px;
	}
	
	#yesno {
		float:left;
		position: relative;
		width: 230px;
		height: 45px;
		color:#000000;
		font: 11px "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
		font-weight:normal;
		text-align:left;
		margin: 6px 20px 6px 0px;
		padding: 0px 0px 0px 5px;
		border-bottom:#999 solid 1px;
	}
	
	#contactmeathod {
		float:left;
		position: relative;
		width: 615px;
		height: 20px;
		color:#000000;
		font: 12px "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
		font-weight:bold;
		text-align:center;
		margin: 3px 6px 10px 30px;
	}
	
	#name_input{
		float:left;
		position: relative;
		width: 615px;
		height: 35px;
		color:#000000;
		font: 13px "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
		font-weight:bold;
		text-align:center;
		margin: 3px 6px 3px 30px;
	}
	
	#designinterest {
		float:left;
		position: relative;
		width: 615px;
		height: 90px;
		margin: 20px 30px 3px 40px;
		text-align:center;
	}
	
	#project_type {
		float:left;
		position: relative;
		width: 615px;
		height: 30px;
		color:#000000;
		font: 13px "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
		font-weight:bold;
		text-align:center;
		margin: 0px 0px 10px 0px;
	}

	#dropdowns{
		float:center;
		width: 210px;
		height: 40px;
		color:#000000;
		font: 12px "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
		font-weight:bold;
		text-align:center;
		margin: 5px 2px 10px 0px;
	}
	
	#dropdown_container{
		float:left;
		width: 700px;
		height: 60px;
		color:#000000;
		font: 12px "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
		font-weight:bold;
		text-align:center;
		margin: 5px 2px 10px 90px;
	}
	
	#project-due{
		float:left;
		width: 755px;
		height: 55px;
		color:#000000;
		font: 12px "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
		font-weight:normal;
		text-align:center;
		margin: 5px 5px 5px 5px;
		padding: 5px 0px 5px 0px;
		border:1px #666;
	}
	
	#site-questions{
		float:enter;
		width: 770px;
		height: 230px;
		color:#000000;
		font: 12px "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
		font-weight:normal;
		text-align:center;
		margin: 5px 5px 5px 5px;
		padding: 5px 0px 5px 0px;
		border:#999 solid 1px;
	}
	
	#project-need{
		float:center;
		width: 770px;
		height: 175px;
		color:#000000;
		font: 12px "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
		font-weight:normal;
		text-align:center;
		margin: 5px 5px 5px 5px;
		padding: 5px 0px 5px 0px;
		border:#999 solid 1px;
	}
	
	#messagecontainer{
		float:center;
		width: 770px;
		height: 140px;
		color:#000000;
		font: 12px "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
		font-weight:bold;
		text-align:center;
		margin: 5px 5px 5px 5px;
		padding: 5px 0px 5px 0px;
	}
	
	#messagebox{
		float:left;
		width: 370px;
		height: 110px;
		color:#000000;
		font: 12px "Avant Garde", Verdana, Arial, Helvetica, sans-serif;
		font-weight:bold;
		text-align:center;
		margin: 0px 15px 15px 0px;
		padding: 5px 0px 5px 0px;
	}
	
	
/******THanks Page******/
	#thanks-header {
		float:left;
		position: relative;
		background: url('images/thankyou-title.png') no-repeat;
		width: 881px;
		height: 596px;
	}
	
/******Error Page******/
	#error-header {
		float:left;
		position: relative;
		background: url('images/uhh-title.png') no-repeat;
		width: 881px;
		height: 596px;
	}

/**********************************************************************************************

	Title: Artful Identity
	Author: Cara Thiem & Co
	Date: July 2009 

***********************************************************************************************/