/*--------------------------------------*/
/* CSS Created by Domo - 2009 ----------*/
/* www.okdomo.com ----------------------*/
/*--------------------------------------*/

/*---------------------*/
/* General ------------*/
/*---------------------*/
* {margin: 0;padding: 0;}
body {                   
	background: url(../img/bg_pattern.gif) fixed top left repeat;
	font-family: Georgia, Times, "Times New Roman", serif;
	font-size: 12px;
	color: #6c6254;
}
hr {display: none;}
img, fieldset {border: none;}
a:link, a:visited {color: #537480;}
a:hover, a:active {color: #385b66;}
.clear {
	clear: both;
	height: 0;
	font-size: 0;
	line-height: 0;
}
#paint {background: url(../img/bg_paint.png) top center no-repeat;}
#container {
	width: 870px;
	margin: 0 auto;
}
/*---------------------*/
/* Header -------------*/
/*---------------------*/
#header {
	background: url(../img/bg_page_top.gif) top left no-repeat;
	width: 675px;
	padding: 50px 90px 30px 105px;
	overflow: hidden;
}
#header h1 a {
	background: url(../img/logo_twisted_mind.png) top left no-repeat;
	float: left;
	display: inline;
	text-indent: -999em;
	overflow: hidden;
	width: 142px;
	height: 140px;
}
#header #hero {
	float: right;
	display: inline;
	width: 460px;
	margin: 25px 0 0 0;
}
#header #hero h2 {
	color: #dc5624;
	font-size: 22px;
	margin: 0 0 10px 0;
}
#header #hero p {
	line-height: 20px;
}
/*---------------------*/
/* Services -----------*/
/*---------------------*/
#txtServices {
	background: url(../img/txt_services.gif) top left no-repeat;
	text-indent: -999em;
	overflow: hidden;
	width: 870px;
	height: 27px;
}             
#services .mid {
	background: url(../img/bg_content_mid.gif) top left repeat-y;
	width: 850px;
	padding: 0 10px;
	overflow: hidden;
}             
#services .btm {
	background: url(../img/bg_content_btm.gif) top left no-repeat;
	width: 870px;
	height: 16px;
}
#services ul {
	list-style: none;
	list-style-position: outside;
	overflow: hidden;
}                                
#services li {display: inline;}
#services li .content p {
	line-height: 20px;
	margin: 10px 0 0 0;
}
#serviceA {         
	background: url(../img/tile_dot_vert.gif) 520px 10px repeat-y;
	width: 517px;                                                
	float: left;                                                    
	padding: 0 0 11px 5px;
	margin: 0 0 3px 0;
}                
#serviceB {	
	width: 315px;
	float: right;                                              
	margin: 0 0 5px 0;
}                
#serviceC {   
	background: url(../img/tile_dot_horiz.gif) 10px 0 repeat-x;
	width: 375px;
	float: right;	
	padding: 0 5px 0 0;
}          
#serviceD {
	background: url(../img/tile_dot_horiz.gif) 0 0 repeat-x;
	width: 445px;
	float: left; 
	padding: 15px 15px 0 10px;
}
/*---------------------*/
/* Service Copy -------*/
/*---------------------*/
#serviceA .content {
	float: right;
	display: inline;
	width: 210px;
	margin: 0 15px 0 0;
}              
#serviceB .content {
	margin: 0 5px 0 0;
}
#serviceC .content {
	background: url(../img/tile_dot_vert.gif) 0 0 repeat-y;
	float: left;
	display: inline;
	width: 230px;
	padding: 10px 0 0 15px;
	margin: 5px 0 0 0;                           
	height: 220px;  
}                   
#serviceD .content {
	float: left;
	display: inline;
	width: 135px;
}   
/*---------------------*/
/* Service Headlines --*/
/*---------------------*/
#services h2 {
	color: #dc5624;
	display: block;
	text-indent: -999em;
	overflow: hidden;
	width: 193px;
	height: 21px;        
	margin: 11px 0 0 0; 
}
#serviceA h2 {
	background: url(../img/txt_new_site.gif) top left no-repeat;		
}                                          
#serviceB h2 {
	background: url(../img/txt_optimization.gif) top left no-repeat;
}                                              
#serviceC h2 {
	background: url(../img/txt_code_reviews.gif) top left no-repeat;
}                                              
#serviceD h2 {
	background: url(../img/txt_scaling.gif) top left no-repeat;
	width: 130px;
}
/*---------------------*/
/* Service Images -----*/
/*---------------------*/
#serviceA img {
	float: left;
	display: inline;
}
#serviceB img {
	display: block;
}
#serviceC img {     
	margin: 15px 0 0 0;
	float: right;
	display: inline;
}
#serviceD img {
	float: right;
	display: inline;
}
/*---------------------*/
/* Featured Projects --*/
/*---------------------*/
#projects {
	background: url(../img/bg_featured.png) top left no-repeat;
	margin: 20px 0 0 0;
	width: 870px;
	height: 170px;
	overflow: hidden;
}
#txtProjects {
	background: url(../img/txt_projects.png) top left no-repeat;
	display: block;
	text-indent: -999em;
	overflow: hidden;
	width: 870px;
	height: 24px;
}
#projects h3 {     	
	color: #537480;
}
/*---------------------*/
/* Project Images -----*/
/*---------------------*/
.projectImgs {
	float: left;
	display: inline;
	width: 263px;
	margin: 0 15px 0 10px;
	position: relative;
	height: 141px;
}
.projectImgs img {
	display: block;
	margin: 0 0 0 13px;
}                          
.projectImgs li {
	float: left;
	display: inline;
	list-style: none;
	list-style-position: outside;
}
.projectImgs #navBtns a {
	z-index: 1;
	display: block;
	position: absolute;
	text-indent: -999em;
	overflow: hidden;
	width: 28px;
	height: 28px;     
	top: 53px;
}
/*---------------------*/
/* Project Nav --------*/
/*---------------------*/                    
#btnNext {
	background: url(../img/btn_arrows.gif) bottom right no-repeat;
	right: 0;
}   
#btnPrev {
	background: url(../img/btn_arrows.gif) bottom left no-repeat;
	left: 0;
}
#btnNext:hover {background-position: top right;}
#btnPrev:hover {background-position: top left;}
.projectImgs #dots {
	margin: 0 auto;
	/* Change width depending on number of projects */
	/* 15px per project */
	width: 45px; 
}                    
.projectImgs #dots a {
	float: left;
	display: inline;
	text-indent: -999em;
	overflow: hidden;
	width: 9px;
	height: 8px;    
	padding: 0 3px;
}
.projectImgs #dots a {
	background: url(../img/btn_dot.gif) 0 -8px no-repeat;
}
.projectImgs #dots .active,
.projectImgs #dots a:hover {
	background-position: top left;
}
/*---------------------*/
/* Project Info -------*/
/*---------------------*/
.projectInfo {
	float: left;
	display: inline;
	margin: 18px 0 0 0;
	width: 155px;
	line-height: 20px;
}               
.projectInfo h3,
#contact h3 {
	background: url(../img/txt_services_performed.gif) top left no-repeat;
	display: block;
	text-indent: -999em;
	overflow: hidden;
	width: 139px;
	height: 15px;
	margin: 0 0 15px 0;
}
.projectInfo ul {
	list-style: none;
	list-style-position: outside;
}            
/*---------------------*/
/* Contact ------------*/
/*---------------------*/ 
#contact {            
	background: url(../img/tile_dot_vert_contact.gif) top left repeat-y;
	width: 323px;
	margin: 18px 55px 0 0;                                                
	padding: 0 0 0 32px;
	float: right;
	display: inline;
	line-height: 20px;
}             
#contact h3 {
	background: url(../img/txt_get_started.gif) top left no-repeat;
}
.contact {
	color: #537480;	
	margin: 5px 0 0 0;
}         
.contact .iconEmail {
	background: url(../img/icon_email.gif) center left no-repeat;
	font-weight: bold;
	font-family: Helvetica, Arial, sans-serif;
	padding: 0 10px 0 20px;
}                     
.contact .iconPhone {                            
	background: url(../img/icon_phone.gif) 7px 0px no-repeat;
	font-weight: bold;
	font-size: 14px;   
	padding: 0 0 0 23px;
}              
/*---------------------*/
/* Copyright ----------*/
/*---------------------*/
#copyright {        
	font-family: Helvetica, Arial, sans-serif;
	text-align: right;
	font-size: 10px;
	text-transform: uppercase;
	color: #83837e;          
	margin: 25px 0 20px 0;
}