/* 
   CSS Styles 
   Author: Chris Fay   
*/
body{font-family:"Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;font-size:12px;line-height:20px;color:#4e4e4e;background:#00689f url('../images/bg.jpg') repeat;}
div{position:relative;}
ul{}
ul li{}

a{text-decoration:none;color:#0e8cc4;}
a:hover{color:#34bdfa;}
a:active {}
a:visited{text-decoration:none;}
img{}
p{padding:5px;padding-left:0;}
.floatLeft{float:left;}
h1{font-size:26px;line-height:28px;padding-bottom:5px;color:#000;font-weight:normal;}
h2{font-size:24px;line-height:26px;padding-bottom:15px;color:#fff;font-weight:normal;}
h3{
	font-size:16px;
	line-height:18px;
	padding-bottom:5px;
	color:#F00;
	font-weight:normal;
}
h4{font-size:14px;line-height:16px;}
h5{font-size:12px;line-height:14px;}
h6{font-size:10px;line-height:12px;}
.clear{display:block;clear:both;}

/*general styles */
#page{}
#mainWrap{background:url('../images/mainWrapBG.jpg') repeat-x top;min-height:500px;}
#wrapper{width:960px;margin:0 auto;background:url('../images/clouds.jpg') no-repeat;}
#wrapper.short{background:url('../images/cloudsShort.jpg') no-repeat -3px 0;}
	
	/*element styling
	/*tables*/
	thead th {background-color:#000;border-bottom:1px solid #000;color:#fff;}
	table th, table td {padding:6px 10px;text-align:left;vertical-align:top;}
	tr.accent{background:#1D9EDF;}
	tr:hover td {background:#E5E6DF ;color:#000;}
	
	/*blockquote*/
	blockquote {background: url('../images/openQuote.png') no-repeat top left;padding:40px 0 0 45px;display:block;}

	
	/*borders*/
	.border{border-bottom:1px dotted #000;clear:both;margin:5px 0;padding-top:5px;}
	.border.light{border-bottom:1px dotted #fff;}
	#contactForm .border.light{width:400px;height:1px;color:#fff;}
	.divider{display:block;height:2px;background:url('../images/divider.jpg') repeat-x;margin:20px 0;}
	
	/*input styling*/
	#contactForm{}
	label{padding:8px 0 0 0;display:block;color:#fff;width:70px;float:left;font-weight:bold;}
	label.optional{color:#60c9f6;font-weight:normal;}
	input{border:none;padding:0;margin:0;}
	.input{padding-top:10px;display:block;color:#fff;width:340px;float:left;border:0;background:transparent;}		
	.submit{display:block;height:37px;line-height:9px;color:#fff;font-size:11px;border:none;cursor:pointer;background:none;text-align:left;}	
	textarea{color:#fff;border:none;padding:7px;width:530px;border:1px dotted #fff;overflow:auto;margin:15px 0 5px 0;height:150px;background:transparent;font-family:"Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;font-size:11px;font-weight:normal;}	
	fieldset{border:none;margin:25px 0;clear:both;}
	fieldset label{}
	fieldset .input{}	
	input.inputError{}	
	label.inputError{float:none;margin:0 !important;padding:0 !important;border:none;color:#eecc0e;width:100px;display:block;clear:both;}
	textarea.inputError{border: 1px solid #EFBF18 !important;}
	.select{padding:10px;background:#292a24;color:#D8DACB;width:300px;margin-bottom:15px;border:1px solid #000;}
	option{padding:2px 0 0 5px;}


/*header*/
a.logo{display:block;width:187px;height:49px;background:url('../images/logo.png') no-repeat; position:absolute;top:15px;left:35px;}
a.logo span{display:block;margin-left:-9999px;}
	
	/* main navigation */
	#mainNav{width:960px;height:81px;background:url('../images/navBG.png') no-repeat center;}
	.navigation{position:absolute;top:0;right:0;background:url('../images/navDivider.png') no-repeat left;padding-left:2px;}
	.navigation li{display:block;float:left;width:100px;text-align:center;font-size:16px;font-weight:normal;background:url('../images/navDivider.png') no-repeat right;height:76px;}	
	.navigation li#last{background:none;}
	.navigation li a{display:block;float:left;width:97px;padding:25px 0;color:#696767;height:26px;text-shadow:0 1px 0 #fff;}
	.navigation li a:hover{background:url('../images/navHover.png') no-repeat -400px 1px;color:#037ab1;}
	.navigation li.current a{background:url('../images/navHover.png') no-repeat -400px 1px;color:#037ab1;}
	.navigation li#last a:hover{background:url('../images/navHover.png') no-repeat -433px 1px;}
	.navigation li.current#last a{background:url('../images/navHover.png') no-repeat -433px 1px;}	

	
.tagLineLarge{margin:25px 0 10px 0;background:url('../images/tagLineLarge.png') no-repeat;height:54px;}
.tagLineLarge span,.tagLineSmall span{display:block;margin-left:-9999px;}
.tagLineSmall{background:url('../images/tagLineSmall.png') no-repeat;height:65px;}

/*accent pannel*/
#accentPanel{margin-top:16px;width:960px;}
#accentPanel .col1{width:590px;height:476px;background:url('../images/accentPanelBG.png') no-repeat;float:left;margin-right:20px;padding: 20px 0 0 0;}
#accentPanel .col1 .content{width:550px;margin:0 auto;}
#accentPanel .col2{width:350px;float:left;font-size:11px;font-weight:normal;}
#accentPanel .col2 .caseDetails{height:240px;background:url('../images/accentPanelSmallBG.png') no-repeat;padding-top:20px;}
#accentPanel .col2 p {color:#807d7d;line-height:18px;padding-top:10px;}
#accentPanel .col2 .content{width:310px;margin:0 auto;}
#accentPanel h3{margin:0;padding:0;}
#accentPanel ul{padding-top:10px;}
#accentPanel li{display:block;padding:0 0 0 35px;line-height:25px;background:url('../images/checkMark.png') no-repeat;width:275px;}
#accentPanel a.button{display:block;width:191px;height:42px;margin-bottom:3px;}
#accentPanel a.button span{display:block;margin-left:-9999px;}
#accentPanel a.button.work{background:url('../images/buttonsSprite.png') no-repeat 0 -142px;}
#accentPanel a.button.quote{background:url('../images/buttonsSprite.png') no-repeat 0 -190px;}
#accentPanel a.button.services{background:url('../images/buttonsSprite.png') no-repeat 0 -238px;}
	/*hover states*/
	#accentPanel a:hover.button.work{background-position:0 -1px;}
	#accentPanel a:hover.button.quote{background-position:0 -49px;}
	#accentPanel a:hover.button.services{background-position:0 -97px;}

/*main content*/
#mainContent{display:block;width:960px;background:url('../images/bodyCenterBG.png') repeat-y;min-height:200px;margin-top:35px;padding:0 0 10px;}
#servicesPage #mainContent{min-height:500px;}
#mainContent .content{width:920px;margin:0 auto;padding:10px 0;z-index:200;}
#mainContent .top{display:block;width:960px;background:url('../images/bodyTopBG.png') no-repeat;height:15px;position:absolute;top:-10px;left:0;}
.bottom{display:block;width:960px;background:url('../images/bodyBottomBG.png') no-repeat;height:18px;margin:0 auto;}
#mainContent .col1{width:290px;float:left;margin-right:25px;}
#mainContent .col2{width:290px;float:left;margin-right:25px;}
#mainContent .col3{width:290px;float:left;}
#mainContent .title{padding-left:55px;height:48px;padding-top:7px;}
#mainContent .title.info{background:url('../images/info.png') no-repeat left top;}
#mainContent .title.clients{
	background:url('../images/clients.png') no-repeat left top;
	color: #36F;
}
#mainContent .title.services{background:url('../images/services.png') no-repeat left top;}
#mainContent .leftBG{display:block;height:499px;width:248px;position:absolute;left:2px;top:-10px;background:url('../images/servicesLeftBG.jpg') no-repeat;z-index:100;}

/*services page*/
#servicesPage #mainContent {height:100%;padding-bottom:0;}
#servicesPage #mainContent .col1{width:230px;float:left;margin-right:45px;}
#servicesPage #mainContent .col2{width:640px;float:left;margin-right:0;padding-top:10px;}
#servicesPage .bottom, #portfolioPage .bottom{display:block;position:relative;width:960px;margin:0 auto;height:18px;background:url('../images/bodyBottomBG.png') no-repeat;z-index:300;}
#servicesPage .serviceImage, #portfolioPage .preview{padding:5px;background:#e6e6e3;border:1px solid #dcdcdc;display:block;margin:15px 0;}
#servicesPage .serviceImage.floatL{float:left;clear:both;margin:10px 15px 10px 0;}
#servicesPage .serviceImage.floatR{float:right;clear:both;margin:10px 0 10px 15px;}
.checks {margin:10px 0;}
.checks li{display:block;padding:0 0 0 35px;line-height:25px;background:url('../images/checkMark.png') no-repeat;}
#servicesPage h3.title{font-size:22px;}
#servicesPage a.quote{color:#7d7c7c!important;position:absolute;bottom:-10px;left:15px;z-index:600;width:137px;height:46px;background:url('../images/quoteButton2.jpg') no-repeat;text-align:center;padding-top:12px;text-shadow:0 1px 0 #fff;}
#servicesPage a:hover.quote{color:#000!important;}
	/*service slider tabs*/
	#servicesSlider{width:920px;margin:0 auto;padding:10px 0;z-index:200;}
	#servicesPage #mainContent .ui-tabs {}	
	#servicesPage #mainContent .ui-tabs .ui-tabs-nav li {}
	#servicesPage #mainContent .ui-tabs .ui-tabs-nav li a {background:url('../images/servicesNavDivider.jpg') repeat-x bottom; padding:15px 0;display:block;width:230px;color:#5a5b5b;font-size:16px;}
	#servicesPage #mainContent .ui-tabs .ui-tabs-nav li a, .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a { cursor: pointer; } /* first selector in group seems obsolete, but required to overcome bug in Opera applying cursor: text overall if defined elsewhere... */
	#servicesPage #mainContent .ui-tabs .ui-tabs-nav li a:hover{color:#000;}		
	#servicesPage #mainContent .ui-tabs .ui-tabs-nav li.ui-tabs-selected a, .ui-tabs .ui-tabs-nav li.ui-state-disabled a, .ui-tabs .ui-tabs-nav li.ui-state-processing a {}
	#servicesPage #mainContent .ui-tabs .ui-tabs-nav li.ui-tabs-selected a {background:#fff url('../images/servicesNavDivider.jpg') repeat-x left bottom!important;color:#000!important;}	
	#servicesPage #mainContent .ui-tabs .ui-tabs-panel {} /*content panel*/
	#servicesPage #mainContent .ui-tabs .ui-tabs-hide { display: none !important; }	

/*portfolio page*/
#portfolioSlider{width:920px;margin:0 auto;padding:10px 0;z-index:200;}
#portfolioPage .pItem{display:block;width:920px;}
#portfolioPage .portfolioNav{position:absolute;left:-17px;top:-50px;}
#portfolioPage #mainContent .ui-tabs {}	
#portfolioPage #mainContent .ui-tabs .ui-tabs-nav li {display:block;float:left;width:29px;height:29px;margin:0 2px 0 0;}
#portfolioPage #mainContent .ui-tabs .ui-tabs-nav li a {display:block;color:#000;display:block;float:left;clear:both;background:url('../images/paginationBG.png') no-repeat;width:29px;height:29px;text-align:center;padding-top:3px;}
#portfolioPage #mainContent .ui-tabs .ui-tabs-nav li a, .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a { cursor: pointer; } /* first selector in group seems obsolete, but required to overcome bug in Opera applying cursor: text overall if defined elsewhere... */
#portfolioPage #mainContent .ui-tabs .ui-tabs-nav li a:hover{color:gray!important;}		
#portfolioPage #mainContent .ui-tabs .ui-tabs-nav li.ui-tabs-selected a, .ui-tabs .ui-tabs-nav li.ui-state-disabled a, .ui-tabs .ui-tabs-nav li.ui-state-processing a {}
#portfolioPage #mainContent .ui-tabs .ui-tabs-nav li.ui-tabs-selected a {color:#000!important;font-weight:bold;}	
#portfolioPage #mainContent .ui-tabs .ui-tabs-panel {} /*content panel*/
#portfolioPage #mainContent .ui-tabs .ui-tabs-hide { display: none !important; }	

/*contact page*/
#contactForm {}
#contactPage .col2, #contactPage .col2 p,#elementsPage .col2,#elementsPage .col2 p,#elementsPage .col1,#elementsPage .col1 p,#elementsPage .col2 a{color:#fff;}	
#contactPage .col2 h2{padding-bottom:5px;}
#contactPage .col2 a{color:#fff;}
#contactPage .col2 a:hover{color:#000;}
#contactPage .col1{background:none;}

/*elements page*/
#elementsPage .col1{height:100%;background:none;}
.elementsPage #mainContent .title{margin-bottom:45px;border-bottom:1px dashed gray;padding-left:0;}
.elementsPage #aForm{padding:5px; background:gray;width:500px;}

/*footer*/
#footer{margin:40px 0 10px 0;padding-top:15px;background:url('../images/footerBorder.jpg') no-repeat top center;color:#fff;font-size:11px;width:960px;}
#footer a{text-decoration:none;color:#34bdfa;}
#footer a:hover{color:#0e8cc4;}

/*stylesheet switcher */
.styleWitcher{display:block;position:fixed;top:300px;left:0;padding:10px;background:#f2f1f1;border:1px solid #fff;}
.styleWitcher p{padding-top:0;}
.styleWitcher li{}
.styleWitcher li a{display:block;margin-bottom:5px;width:15px;height:15px;border:1px solid #fff;}
.styleWitcher li a.last{margin-bottom:0;}
.styleWitcher li.blue a{background:#0782c5;}
.styleWitcher li.brown a{background:#4c3b1e;}
.styleWitcher li.purple a{background:#9220a3;}
.styleWitcher li.green a{background:#217a48;}

/*home page slider */
#bannerSlider{}
#bannerSlider .imagesNav{position:absolute;top:415px;right:-145px;}
#bannerSlider .imagesNav li{background:none;}
#bannerSlider #accentPanel .col2 .content{width:510px;}
#bannerSlider.ui-tabs {}	
#bannerSlider.ui-tabs .ui-tabs-nav li {display:block;float:left;background:none;padding:0;width:29px;height:29px;margin:0 2px 0 0;}
#bannerSlider.ui-tabs .ui-tabs-nav li a {display:block;color:#000;display:block;float:left;clear:both;background:url('../images/paginationBG.png') no-repeat;width:29px;height:29px;text-align:center;}
#bannerSlider.ui-tabs .ui-tabs-nav li a, .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a { cursor: pointer; } /* first selector in group seems obsolete, but required to overcome bug in Opera applying cursor: text overall if defined elsewhere... */
#bannerSlider.ui-tabs .ui-tabs-nav li a:hover{color:gray!important;}		
#bannerSlider.ui-tabs .ui-tabs-nav li.ui-tabs-selected a, .ui-tabs .ui-tabs-nav li.ui-state-disabled a, .ui-tabs .ui-tabs-nav li.ui-state-processing a {}
#bannerSlider.ui-tabs .ui-tabs-nav li.ui-tabs-selected a {color:#000!important;font-weight:bold;}	
#bannerSlider.ui-tabs .ui-tabs-panel {} /*content panel*/
#bannerSlider.ui-tabs .ui-tabs-hide { display: none !important; }
