/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Geotechnical Engineering CSS
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

/* Cullahs 
	069
	3385AD
	66A3C2
*/

html{ margin: 0; padding: 0; height:100%; }
body{ margin: 0; padding: 0; font-family: Arial, sans-serif; font-size: 14px; height:100%; text-align: center;  min-width: 820px; background:url(../images/bodybg.jpg) repeat-x #EEE; color:#666; }

/* ~~~~~~~~~ ANCHORS ~~~~~~~~~ */
a, a:active, a:visited { text-decoration: underline; color:#069; outline:none; }
a:hover { text-decoration:none; color:#333; border:none; }
a img{ border:none; }
#rightcolumn-inner a, #rightcolumn-inner2 a{ color:#3385AD; }
#rightcolumn-inner a:hover, #rightcolumn-inner2 a:hover { text-decoration:none; color:#666; border:none; }
a.selected{ text-decoration: none; color:#666; font-style:italic; }
/* ~~~~~~~~~ HEADERS ~~~~~~~~~ */
h1{ font-size:28px; color:#069; letter-spacing: 0px; font-weight:normal; margin:0;}
h2{ color:#333; font-size:16px; margin:0px 0px 5px 0px; }
h3{ 	color:#66A3C2; font-size: 11px; text-transform: uppercase; margin:0px 0px 8px 0px; }
h5{ color:#3385AD; text-transform: uppercase; font-size:10px; display:block; letter-spacing: 1px; font-weight:bold; margin-bottom:3px; }
h6{ color:#999; text-transform: uppercase; font-size:10px; display:block; letter-spacing: 1px; font-weight:bold; margin-bottom:6px;  }
/* ~~~~~~~~~ PARAGRAPHS ~~~~~~~~~ */
 p{ 	line-height:150%; 	font-size:14px;  }
#rightcolumn-inner p, #rightcolumn-inner2 p{ font-size:12px; line-height:135%; color:#999; margin:0px 0px 20px 0px; }
#rightcolumn-inner2 p.tight{ margin:0; }
.career p{ margin:0; }
p.tight { margin-bottom:5px !important; margin-top:0px; }

/* ~~~~~~~~~ LISTS ~~~~~~~~~ */
ul{ list-style-type: square; padding-left:20px; margin:0; line-height:130%;}
li{ color:#666; margin-bottom:2px; }
	#rightcolumn-inner ul, #rightcolumn-inner2 ul { padding-left:15px; margin:0; line-height:130%; font-size:12px;}
	#rightcolumn-inner li{ color:#999; }
	#rightcolumn-inner2 li{ color:#999;}
ul.jumper{ list-style-type: none; padding-left:0px; margin:0px 0px 15px 0px; line-height: 130%; }
	ul.jumper li a.selected{ background:url(../images/arrow.jpg) no-repeat 0px 4px; padding-left:10px; color:#999; }	
	ul.jumper li a{ padding-left:10px; }
	
/* ~~~~~~~~~ FORMS ~~~~~~~~~ */
form{ margin-top:20px; }
label, input, select, textarea{ font-family: Arial, sans-serif; }
label{ text-transform: uppercase; font-size:10px; color:#666; display:block; letter-spacing: 1px; padding:1px 0px; }
textarea.textarea, input.text, select{ background:url(../images/inputbg.jpg) repeat-x; border:1px solid #CCC; padding:5px; font-size:14px; color:#333; margin-bottom:15px; }
textarea.textarea{ width:400px; height:150px; display:block; margin-bottom:10px; }
button.submit{ width:82px; height:30px; background:url(../images/button-submit.jpg) no-repeat; border:none; cursor:pointer; }
.error{background:url(../images/inputerror.jpg) no-repeat 0px 1px; padding:1px 0px 1px 17px; color:#F30; }
.error2{background:url(../images/inputerror.jpg) no-repeat 0px 3px; padding:1px 0px 1px 17px; color:#666; display:block; margin-top:5px;}
.spinner{ background:url(../images/sending.gif) no-repeat 0px 5px; padding:5px 0px 1px 20px; color:#666; display:block; margin-top:5px; }

/* ~~~~~~~~~ MISCELLANEOUS STYLES ~~~~~~~~~ */
.blue{ color:#069; }
.gray{ color:#999; }
.darkgray{ color:#555; }
.mini{color:#666; text-transform: uppercase; font-weight: bold; font-size:10px;}
.invisible{ display:none; }
.clearit{ clear:both; }
.x250{ width:250px; }
.career{ margin-bottom:20px; }
hr{ border:none; background:#CCC; height:1px; margin-bottom:10px; }
.spaceme{ margin-bottom: 25px;}
.spacemeabit{ margin-bottom:15px; }
.spacemeatinybit{ margin-bottom:10px !important; }
.hugme{ margin-top:0px; }
.notouchy{ margin-bottom:0px !important; }
.graybox{ background:url(../images/grayboxbg.jpg) repeat-x #EEE; border:1px solid #CCC; padding:10px 15px; margin:10px 0px; }
.arrowup{ background:url(../images/arrowup.jpg) no-repeat 0px 4px; padding-left:12px; }
.popupicon{ background:url(../images/popupicon.jpg) no-repeat 0px 4px; padding-left:14px; }
.centerme{ text-align: center; }
.certification{ width:288px; text-align: center; height:135px; background:#FFF; padding-top:10px; }

.imageright{ float:right; margin-left:10px; margin-bottom:0px; }
.imagerightdark{ background:url(../images/graygradient.jpg) repeat-x #141414 0px -1px; border:1px solid #333; float:right; margin-left:10px; margin-bottom:10px; padding:5px; }
.imagedark{ background:url(../images/graygradient.jpg) repeat-x #141414 0px -1px; border:1px solid #333; padding:5px; }
.imagelight{ background:url(../images/lightbg.jpg) repeat-x #EEE; border:1px solid #CCC; padding:5px;}

.imagerightlight{ background:url(../images/lightbg.jpg) repeat-x #EEE; border:1px solid #CCC; padding:5px; float:right; margin-left:15px; margin-bottom:10px;}
.imageleftlight{ background:url(../images/lightbg.jpg) repeat-x #EEE; border:1px solid #CCC; padding:5px; float:left; margin-right:15px; margin-bottom:10px;}

/* =========== PAGE STRUCTURE ============================================ */

/* ~~~~~~~~~ CONTAINER ~~~~~~~~~ */
#container { padding:0; text-align: left; width:864px; margin: 0 auto; /* center */ }
/* ~~~~~~~~~ HEADER ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
#header{ height:95px; width:850px; margin-left:7px; text-align: left; }
	#logo{ position: absolute; margin-top:30px; margin-left:0px; width:195px; height:35px; }

	/* Navigation... */
		#nav { width:425px; height: 30px; position:absolute; margin-top:30px; margin-left:428px; z-index: 2; }
		#nav-list ul{ margin:0; padding:0; list-style:none; }
		#nav-list li{ float:left; margin:0; padding:0;	}
		#nav-list ul a{ display:block; }
		#nav-list li a.invisible strong {display: none;} /*This makes the link text invisible except when styles are turned off*/
		#nav-list a{ border: none; }
	
		/* Home Button */	
			li#home a{ background:url(../images/nav-home.jpg) no-repeat left; width:48px; height:20px; margin-top:5px; margin-right:15px; }
			li#home a:hover{ background:url(../images/nav-home.jpg) no-repeat right; width:48px; height:20px; margin-top:5px; margin-right:15px; }
			li#home-off{ background:url(../images/nav-home-off.jpg) no-repeat; width:58px; height:30px; margin-right:15px; }
		/* Services Button */	
			li#services a{ background:url(../images/nav-services.jpg) no-repeat left; width:72px; height:20px; margin-top:5px; margin-right:15px; }
			li#services a:hover{ background:url(../images/nav-services.jpg) no-repeat right; width:72px; height:20px; margin-top:5px; margin-right:15px;}
			li#services-off{ background:url(../images/nav-services-off.jpg) no-repeat; width:82px; height:30px; margin-right:15px;}
		/* Community Button */	
			li#community a{ background:url(../images/nav-community.jpg) no-repeat left; width:92px; height:20px; margin-top:5px; margin-right:15px; }
			li#community a:hover{ background:url(../images/nav-community.jpg) no-repeat right; width:92px; height:20px; margin-top:5px; margin-right:15px; }
			li#community-off{ background:url(../images/nav-community-off.jpg) no-repeat; width:102px; height:30px; margin-right:15px; }
		/* Careers Button */	
			li#careers a{ background:url(../images/nav-careers.jpg) no-repeat left; width:69px; height:20px; margin-top:5px; margin-right:15px; }
			li#careers a:hover{ background:url(../images/nav-careers.jpg) no-repeat right; width:69px; height:20px; margin-top:5px; margin-right:15px; }
			li#careers-off{ background:url(../images/nav-careers-off.jpg) no-repeat; width:79px; height:30px; margin-right:15px; }
		/* Contact Button */	
			li#contact a{ background:url(../images/nav-contact.jpg) no-repeat left; width:70px; height:20px; margin-top:5px; }
			li#contact a:hover{ background:url(../images/nav-contact.jpg) no-repeat right; width:70px; height:20px; margin-top:5px; }
			li#contact-off{ background:url(../images/nav-contact-off.jpg) no-repeat; width:81px; height:30px;}

/* ~~~~~~~~~ PAGE BLOCK ~~~~~~~~~ */
	
#pagetop{ background:url(../images/page-top.jpg) no-repeat; width:864px; height:40px; }
	#pagetop img{ position:absolute; margin-left:663px; margin-top:20px;}
#page{ width:864px; 	min-height:600px; background:url(../images/page-body.jpg) repeat-y; overflow:auto; }
#pagefooter{  background:url(../images/page-footer.jpg) no-repeat; height:20px; font-size:11px; color:#999; padding-top:20px; text-align: center; }

#widebox{ width:784px; height: 190px; margin:0px 40px; background:url(../images/homebanner.jpg) no-repeat; }
	#widebox a{ position: absolute; margin-left:406px; margin-top: 96px;}
	.widebox-bottom{ 	width:740px; height:10px; 	margin-left:40px; }
#leftcolumn{	float:left; display:inline; width:454px; margin:20px 40px; }
#leftcolumn2{	float:left; display:inline; width:454px; margin:0px 40px; }
#rightcolumn{ float:left; display:inline; width: 288px; margin:20px 42px 20px 0px; background:url(../images/graygradient.jpg) repeat-x #141414; }
#rightcolumn2{ float:left; display:inline; width: 288px; margin:0px 42px 0px 0px; background:url(../images/graygradient.jpg) repeat-x #141414; }
	#rightcolumn-inner, #rightcolumn-inner2 { padding:5px 15px; }
#sidebartop{ 	background: url(../images/sidebartop.jpg) no-repeat; width:260px; height:10px; }
#sidebarbottom{ background: url(../images/sidebarbottom.jpg) no-repeat; width:260px; height:10px; 	} 
