/*
vandigroup.com - MAIN CSS (global.css)
COPYRIGHT 2006, Visions and Ideas Group, Inc. 
*/


/* Color Pallette
================================================================
	
	dark green - #2b6001			light grey - #b3b3b3
	light green - #62bd19			med grey - #656565
	pale med green - #xxxxxx		dark grey - #1f1f28
	orange - #ff7b0f
	
	text - #1f1f28					
	a text - #007db2				
	hover - #70b005
================================================================*/


/*-------------------- Global Formatting --------------------*/

html {height:100%}
body {height:100%;font:13px "Trebuchet MS", arial, helvetica, sans-serif;color:#1f1f28;background:#fff}

a:visited, a:link {color:#62bd19;text-decoration:underline;background-color:transparent}
a:hover {color:#2b6001}

body, div, span, acronym, h6, h5, h4, h3, h2, h1, radio, textarea, 
input, select, form, dd, dt, dl, ol, li, ul, br {margin:0;padding:0}

h1, h2, h3, h4, h5, h6 {color:#31302e}
h1 {font-size:22px}
h2 {font-size:20px}
h3 {font-size:18px}
h4 {font-size:16px}
h5 {font-size:14px}
h6 {font-size:12px}
p {margin:12px;padding:0;line-height:19px}
ul li {list-style-type:none}
img a {border:0}
img {border:0}
.clear {clear:both}
.left {text-align:left}
.center {text-align:center}
.right {text-align:right}
.nobold {font-weight:normal}
.uline {text-decoration:underline}
.highLight {background:#fef890;padding:0 2px}

/*-------------------- Main --------------------*/

	#wrap {margin:0;display:none;background:url('../images/background.jpg') repeat-x top}

/*-------------------- Header --------------------*/

	#header {margin:0 auto;width:900px;height:274px}
		#hTop {height:83px}
			#logo {margin: 10px 0 0 4px;float:left;width:223px;height:59px;background:url('../images/logo.gif') repeat-x top}
			#nav {margin:32px 28px 0 0;height:31px;float:right;text-align:center}
				#nav a {display:block;padding:3px 15px 0 15px;float:left;color:#000;font-size:15px;font-weight:bold;text-decoration:none;background-color:transparent}
					#nav a:hover {color:#fff;background-color:transparent}
			#whoweare {border-right:1px #97d565 solid}
			#about {border-right:1px #97d565 solid}
			#home {border-right:1px #97d565 solid}
		#bTop {height:191px}
			#bTopCon {margin:0 auto;width:900px}
			#bTopL {margin-top:2px;float:left;width:552px;height:165px;background:url('../images/header_image.jpg') no-repeat top left}
			#bTopR {float:right;width:340px;height:165px;text-align:center;border-left:1px #fff dotted}
			#bTopRT {margin:20px auto;width:249px;height:44px;text-align:center}
				#bTopRT a {display: block;width:249px;height:44px;background:url('../images/recentprojects.gif') no-repeat}
				#bTopRT a:hover {background-position:-249px}
		
		/*thumbs*/	
				#folioStrip {margin:0 auto;width:300px;height:60px}
					#folioStrip p {float:left;margin:0 3px;width:52px;height:52px}
					p.thumb1 a {display:block;width:52px;height:52px;background:url(../images/thumb1.gif) no-repeat 0 0}
						p.thumb1 a:hover {background-position:-52px}
					p.thumb2 a {display:block;width:52px;height:52px;background:url(../images/thumb2.gif) no-repeat 0 0}
						p.thumb2 a:hover {background-position:-52px}					
					p.thumb3 a {display:block;width:52px;height:52px;background:url(../images/thumb3.gif) no-repeat 0 0}
						p.thumb3 a:hover {background-position:-52px}
					p.thumb4 a {display:block;width:52px;height:52px;background:url(../images/thumb4.gif) no-repeat 0 0}
						p.thumb4 a:hover {background-position:-52px}
					p.thumb5 a {display:block;width:52px;height:52px;background:url(../images/thumb5.gif) no-repeat 0 0}
						p.thumb5 a:hover {background-position:-52px}
			
/*-------------------- Body --------------------*/

	#copyright span, #validation a span, #body #workContent, #body #aboutContent, #body #contactContent, #body #contactThanks, #body #whatwedoContent {
	display:none}

	#body {margin:0 auto;width:900px;text-align:left}
		#contactContent, #whatwedoContent, #workContent, #aboutContent, #contactContent {clear:both;margin:12px auto}
	.bodyWrap {margin:20px auto 0 auto}

	#interested {margin:36px auto 6px auto;padding:7px;width:600px;text-align:center;color:#1f1f28;font-weight:bold;font-size:14px;border:1px #eaeaea dashed}
		#interested a.contact {color:#2b6001}
		
/*-------------------- Home Section --------------------*/

	#homeContent {}
		#hCL {float:left;padding:12px;width:270px}
		#hCM {float:left;padding:12px;width:270px}
			#hCM ul {margin:6px 0 0 12px}
			#hCM ul li {margin:2px 0;list-style:none}
			#hCM li a {padding:0 0 0 22px;font-size:12px;background:url('../images/lightbulb_smg.gif') no-repeat 0px center}
		#hCR {float:left;padding:12px;width:270px}

/*-------------------- About Section --------------------*/

	#aboutCon {}
		#aboutCon img {float:right;border:none}
		#aboutCon h3 {margin:14px 0 3px 0}
		#aboutCon p {margin:0}
		#aboutCon p.list {margin-left:12px}

	.list {}
		#list span {margin:0}
		.listSub {margin:0 0 0 8px;font-size:12px;background:#fafafa}


/*-------------------- What We Do Section --------------------*/

	#learnMore {float:right;margin:12px;width:150px;padding:1px;font-size:10px;background:#fff;border:1px #eaeaea dotted}
		#learnMoreIn {padding:2px 2px;background:#fafafa}
		#learnMoreIn h4 {padding-left:3px;font-size:13px;font-weight:bold;background:#eaeaea}
		#learnMoreIn a {display:block;font-size:12px}

	.wwd ul {margin:0 0 0 24px}
		.wwd li {margin:2px 0;padding:0 0 0 22px;font-size:11px;background:url('../images/green_arrow.gif') no-repeat 0px center}
		.wwd li a {padding:0 0 0 22px;font-size:11px;background:url('../images/green_arrow.gif') no-repeat 0px center}

	.bodyhr {margin:0 0 22px 0;height:1px;border-bottom:1px #eaeaea dashed}
	.bodyhrhalf {clear:both;margin:22px auto;width:50%;height:1px;border-bottom:1px #eaeaea dashed}
	.list2 {margin:0 0 0 22px;font-size:11px;font-family:Arial, Helvetica, sans-serif;background:#fcfcfc}
	 .list2 h6 {margin:0 0 2px 0;padding:2px 4px;width:520px;background:#eaeaea}
	 .list2 p {margin:2px 6px}

	 #socialp {clear:both;margin:18px 0 0 0;padding:6px 22px;background:#f2f2f2;border-top:1px #eaeaea solid;border-bottom:1px #eaeaea solid}
		 #socialp img {float:left;margin:6px}


/*-------------------- Portfolio Section --------------------*/

	.project {;margin:12px auto;width:840px;height:131px;background:url(../images/test_back.gif) no-repeat 0 0;font-family:Arial, Helvetica, sans-serif}
		.testConL {padding:7px;float:left;width:380px}
			.testConL h2 {font-size:13px;border-bottom:1px #959595 solid}
			.testConL p {margin:4px 2px;font-size:11px;line-height:13px}
			.testConL span {font-weight:bold}
			.launch a {font-size:12px;font-weight:bold}		
		.testConR {float:left;width:440px}


		#body .bodyWrap .preview {display:block;float:right;width:420px;height:108px;margin:14px 0px 0 6px;text-decoration:none}
		#body .bodyWrap .previewLink {display:block;width:420px;height:108px;text-decoration:none}
		#body .bodyWrap .previewLaunch {width:420px;height:108px;background:url(../images/preview_over.png) no-repeat 0 0}
		#body .bodyWrap .previewGrey  {width:420px;height:108px}
		
			
		#body div.bodyWrap #ms {background:url(../images/onecall_grey.gif) no-repeat 0 0}
		#body div.bodyWrap #msw {background:url(../images/slither_grey.gif) no-repeat 0 0}
		#body div.bodyWrap #rz {background:url(../images/route56_grey.gif) no-repeat 0 0}
		#body div.bodyWrap #aw {background:url(../images/cuffo_grey.gif) no-repeat 0 0}
		#body div.bodyWrap #wi {background:url(../images/bodyandsoul_grey.gif) no-repeat 0 0}
		
		#body div.bodyWrap div#greyms {background:url(../images/onecall.gif) no-repeat 0 0}
		#body div.bodyWrap div#greymsw {background:url(../images/slither.gif) no-repeat 0 0}
		#body div.bodyWrap div#greyrz {background:url(../images/route56.gif) no-repeat 0 0}
		#body div.bodyWrap div#greyaw {background:url(../images/cuffo.gif) no-repeat 0 0}
		#body div.bodyWrap div#greywi {background:url(../images/bodyandsoul.gif) no-repeat 0 0}
		
			
/*-------------------- Contact Section --------------------*/

		#body .bodyWrap #contactLeft {float:left;margin-left:28px;width:334px;font-size:13px;font-family:'Trebuchet MS', arial, helvetica, sans-serif !important}
		#body .bodyWrap #contactRight {float:left;width:350px;margin:-26px 0 0 72px;padding:1px;font-size:10px;
		background:#fff;border:1px #1f1f28 solid}
		#body .bodyWrap #contactTable {padding:8px;background:#333441;border:1px #1f1f28 solid}
	
			#body .bodyWrap #contactTable h3 {color:#fff;background-color:transparent}
			#contactLeft h6 {margin:26px auto 20px auto;text-align:center}
		
			#emailSuccess p {color:#fff;font-size:14px}
			#track {margin-top:5px; background:transparent url(../images/budget-bar.gif) no-repeat 0 6px; width:235px; height:16px; display:none; position:relative;}
			#handle {width:16px; height:16px; left: 0px; position: relative;}		
			#contactFrog {float:right;margin:-63px 20px 0 0;width:110px;height:61px;background:url(../images/frog1.jpg) no-repeat 0 0}
	
			fieldset {border:0;margin-left:20px}
			label {display:block;margin-top:5px;color:#fff;font-size:13px;font-weight:bold;background-color:transparent}
			input,select,textarea {color:#333441;padding:3px;margin:1px 0 0 0px;border:1px solid #ccc}
			input.text {width:260px}
			#cForm select {width:266px}
			textarea {width:260px}
			checkbox, radio {}
			input.submit {margin:6px 0 0 60px;width:150px;padding:2px 5px;color:#000;background-color:#62bd19;font-weight:bold}

/*-------------------- Marketing Section --------------------*/

/*-------------------- Hidden Box --------------------*/

	#overlay {display:none;background-image:url(../images/overlay.png);position:absolute;z-index:1;}
	#hiddenms, #hiddenmsw, #hiddenaw, #hiddenrz, #hiddenwi {display:none;position:absolute;margin:0;padding:2px 20px;
	width:531px;background:#353747;border:8px #fff solid;z-index:100}
		.hiddenBox {font-size:12px;color:#fff;background-color:transparent}
		.hiddenBox .title, .hiddenBox .right {float:left;margin:0 0 3px 0;width:200px;font-size:18px;color:#fff;background-color:transparent}
		.hiddenBox .right {text-align:right}
		.hiddenBox a, #aboutContent a {padding:0;color:#fff;text-decoration:underline;background-color:transparent}
		.hiddenBox .image {margin:6px 0;width:531px;height:284px}
		.hiddenBody {clear:both}
			.hiddenBody p {margin:0}
			.hiddenBox ul {margin:0 0 0 25px;font-size:11px}
			.hiddenBox li {list-style:circle}
		.hiddenBox .left {float:left;width:360px;line-height:16px}
			.hiddenBox a:hover, #aboutContent a:hover {color:#f1f1f1;border-bottom:1px solid #B5E06B}

/*-------------------- Social Stuff --------------------*/
	#social {display:none;clear:both;margin:0 0;padding:4px 0;width:100%;height:134px;background:#d8d8d8}
		#socialwrap {margin:0 auto;width:900px;height:122px;background:url(../images/bg-social.jpg) top left no-repeat}

		#facebook {float:left;margin:0 0;width:440px}
			#fbadd {float:right;margin:10px 16px 0 0}
			#statwrap {margin:48px 0 0 66px;width:370px}
				#statwrap p {margin:0 0 8px 0;font-family:arial;font-size:12px;line-height:12px}
				#statwrap span {font-size:10px;color:#666}

		#twwrap {float:right;margin:0 0;width:430px}
		#twitter {float:left;padding:0 0 0 0;width:350px}
			.twitted {margin-bottom: 1.5em;font-family:arial;font-size:11px;line-height:12px}
				.twitted p.preLoader {margin: 0;padding: 3em 1em 1em 3em;background: transparent url("loader.gif") 1em center no-repeat;font-size:13px;
				/* generate your own loader gif: http://www.ajaxload.info */}
					.twitted ul#twitter_update_list {margin:42px 0 0 52px;padding: 0 0;list-style-type: none}
						.twitted ul#twitter_update_list li {margin: 0;padding: 2px 0;border-bottom: 1px solid #e3e3e3}
						.twitted ul#twitter_update_list li span {/* tweet content */}
						.twitted ul#twitter_update_list li span a {/* links in tweet content */}
							.twitted ul#twitter_update_list li a {/* timestamp link */ }
							.twitted ul#twitter_update_list li.firstTweet {}
							.twitted ul#twitter_update_list li.lastTweet {border-bottom: none}

				#twfol {float:right;margin:3px 34px 0 0}
					#twfol a {text-decoration:none;font-size:18px;font-family:times;color:#2b6001;font-weight:bold}
				#twadd {float:right;margin:20px 0 0 0}
					#twadd a {display:block;width:76px;height:62px}

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

	#footer {position:relative;margin-top:-12px;height:16px;background:url('../images/footerhr.gif') repeat-x top;width: 70%; /* See note below */
		text-align: center;padding: 0 15%}
		/* Lets IE see 100%, others see 70% */
		#footer {
			\width: 100%;
			w\idth: 70%}

		#copyright {margin:0px auto;width:900px;text-align:center}
			#copyrightL {float:left;width:275px;font-size:11px}
			#copyrightM {float:left;width:350px;font-size:11px}
			#copyrightR {float:left;width:275px;font-size:11px}