/* 
    Name: Metric Group CSS 
    Date: September 2009 
    Description: Main CSS file for Metric Group website. 
    Version: 1.0 
    Author: Andrew Gunstone - Thirst Studios
    Site: http://www.thirststudios.com/
*/  

/* Imports */  
@import url("reset.css");
@import url("prettyPhoto.css");

/***** Global *****/  
html, body, #wrap {height: 100%;}
body > #wrap {height: auto; min-height: 100%;}

/* Body */  
body {  
    background: #F0F4F7 url(../img/bg-header-sub.jpg) 0 0 repeat-x scroll;  
    color: #333;  
    font: 0.75em/1.5 Arial, sans-serif;  
    margin: 0;  
    padding: 0;  
    text-align: left;  
}  
body.home { background: #F0F4F7 url(../img/bg-header.jpg) 0 0 repeat-x; }  


/* Headings */
h1 {font-size: 2.3em; line-height:65px; color:#4A6576; font-weight:normal; padding-left:10px;}
h2 {font-size: 1.8em;}   
h3 {font-size: 1.35em; color:#4F7314;}   
h4 {font-size: 1.286em}   
h5 {font-size: 1.143em}   
h6 {font-size: 1em}   
  
h2, h3, h4, h5, h6 {  
    line-height: 1.1;  
    margin-bottom: .8em;
    font-weight:normal;  
}

.columns .body-content h2 {font-size:2.0em; margin-bottom:.6em; margin-top:0.2em;}

/* Anchors */  
a {outline: 0;}  
a img {border: 0px; text-decoration: none;}  
a:link, a:visited {  
    color: #006FA8;  
    padding: 0 1px;  
    text-decoration: none;  
}  
a:hover, a:active { 
    color: #222F36;
    text-decoration: underline;  
}

a.more:link, a.more:visited {background:transparent url(../img/more-arrow.png) 100% 50% no-repeat; padding-right:10px; text-decoration:none;}
a.more:hover, a.more:active {background:transparent url(../img/more-arrow.png) 100% 50% no-repeat; padding-right:10px; text-decoration:underline;}
  
/* Paragraphs */  
p {margin-bottom: 1.143em;}  
* p:last-child {margin-bottom: 0;}  
  
strong, b {font-weight: bold;}  
em, i {font-style: italic;} 

::-moz-selection {background: #F6CF74; color: #fff;}  
::selection {background: #F6CF74; color: #fff;}  
  
/* Lists */  
ul {  
    list-style: outside disc;  
    margin: 1em 0 1.5em 1.5em;  
}  
  
ol {  
    list-style: outside decimal;  
    margin: 1em 0 1.5em 1.5em;  
}  
  
dl {}  
dt {}  
dd {}  
  
/* Quotes */  
blockquote {font-style: italic;}  
cite {}  
  
q {}  

/***** Layout *****/
#footer, #copyright { width:100%; overflow:hidden; }

.body {clear: both; margin: 0 auto; width: 940px; position:relative;}
.right {float:right}
.left {float:left}

/***** Header *****/
#header { height:174px; z-index:30; position:relative;}
	
	#nav-main, h3.tag-line, #form-search, h1.logo a, .signin { position:absolute; margin:0; padding:0; line-height: normal; }

	h1.logo a { top:24px; left:0; display:block; width:207px; height:109px; background:transparent url(../img/logo.png) 0 0 no-repeat; text-indent: -9999.9em; cursor:hand; cursor:pointer; }
	h3.tag-line { top:8px; left:0; text-transform: uppercase; color:#729AB6; font-size:1.1em; }
	
	#nav-main { left:0; top:136px; list-style: none;}
	#nav-main li {position:relative; list-style: none; float:left; margin-right:1px;}
	#nav-main li.last {margin:0;}
	#nav-main li a {display:block; text-align: center; margin:0; padding:0; font-size:1.3em; text-decoration: none; line-height:32px; padding-bottom:2px; color:#222F36; background:#CFDCE0 url(../img/bg-nav-main.png) 0 0 repeat-x;}
	#nav-main li:hover a {background:#E6EBEB;}
	#nav-main li.here a, #nav-main li.here a:hover,
	#nav-main li.parent-here a, #nav-main li.parent-here a:hover {background:#4A6576; color:#FFF;}

	#nav-main .nav-home a {width:122px;}
	#nav-main .nav-about a {width:124px;}
	#nav-main .nav-products-services a {width:215px;}
	#nav-main .nav-hse a {width:112px;}
	#nav-main .nav-work-opportunities a {width:208px;}
	#nav-main .nav-contact-us a {width:154px;}
	
	#nav-main li ul { display:none; position:absolute; top:22px; left:-19px; border:1px solid #FFF; border-top:0px;}
/*	#nav-main li li.sub-level-1 {margin-right:0;}
	#nav-main li li.sub-level-1 a {color:#222F36;  width:230px; font-size:1.1em; line-height:28px; padding:0 10px; background:#E6EBEB; text-align:left;}
	#nav-main li li.sub-level-1 a:hover {background:#CFDCE0;}
	#nav-main li:hover ul { display:block; }
*/	
	#form-search { right:80px; top:4px; }
	#form-search span {display:block; float:left; background:transparent url(../img/bg-search.gif) 0 0 no-repeat;}
	#form-search #keywords {margin:4px; border:0;}
	#form-search button {  background:transparent url(../img/bt-search-go.gif) 100% 0 no-repeat; border:0; height:26px; padding-bottom:5px; color:#FFF; text-transform: uppercase; text-indent:-999.99em; width:30px; }
	#form-search .search-light {color:#729AB6;}
	
	.call-phone { color:#729AB6; text-transform:uppercase; font-size:1.1em; }
	.call-phone span {font-size:2.3em; color:#659315; letter-spacing:-1px; }
	#header .call-phone {position:absolute; right:0; bottom:45px;}

	.signin {top:4px; right:0px; }
	.signin a#mainbutton {display:block; position:relative; text-indent: -999.99em; overflow:hidden; background:transparent url(../img/signin.png) 0 0 no-repeat; width:71px; height:25px;}
	.signin a#mainbutton:hover {display:block; position:relative; text-indent: -999.99em; overflow:hidden; background:transparent url(../img/signin.png) -74px 0 no-repeat; width:71px; height:25px;}

	.signin a#mainlogout {display:block; position:relative; text-indent: -999.99em; overflow:hidden; background:transparent url(../img/signin_logout.png) 0 0 no-repeat; width:71px; height:25px;}
	.signin a#mainlogout:hover {display:block; position:relative; text-indent: -999.99em; overflow:hidden; background:transparent url(../img/signin_logout.png) -74px 0 no-repeat; width:71px; height:25px;}

	.signin a#mainbutton.over, .signin a#mainbutton.over:hover {display:block; position:relative; text-indent: -999.99em; overflow:hidden; background:transparent url(../img/signin.png) 100% 0 no-repeat; width:71px; height:25px;}
	.signin .drop {display:block; position:absolute; background-color:#A2BBCB; top:25px; right:0; width:275px; display:none; padding:12px; -moz-border-radius:5px; -moz-border-radius-topright: 0px; -webkit-border-radius: 5px; -webkit-border-top-right-radius:0px; z-index: 100;}

/***** Sub-nav *****/
#nav-sub, #nav-sub li {list-style: none; margin:0; padding:0; margin-top:0.3em;}
	 #nav-sub li {margin:0;padding:0;padding-bottom:1px;padding-right:5px;}
	 /*#nav-sub li.here {background: transparent url(../img/bg-sub-nav-arrow.gif) 100% 50% no-repeat;}*/
	 #nav-sub li a {display:block; padding:5px 20px; background: transparent url(../img/bg-sub-nav-bot.gif) 100% 100% no-repeat; }
	 #nav-sub li span {display:block;background: #E3EBF0 url(../img/bg-sub-nav-top.gif) 100% 0 no-repeat;}
	 #nav-sub li.here a {background: transparent url(../img/bg-sub-nav-bot.gif) 0 100% no-repeat; color:#FFF;}
	 #nav-sub li.here a:hover {text-decoration: none;}
	 #nav-sub li.here span {background: #E3EBF0 url(../img/bg-sub-nav-top.gif) 0 0 no-repeat;}

/***** Body *****/
#body {padding-bottom: 155px;}

/***** Hero *****/
#hero { position:relative; background-color:#729AB6; color:#FFF; margin-top:20px; height:190px;}
	.content { padding:20px 480px 20px 20px; overflow:hidden; height:150px; }
	.content h2 { font-size:2.0em; margin-bottom:0.2em; font-weight:100; }
	.content p { font-size:1.08em; }
	.corner-bot-left { position:absolute; bottom:-20px; left:-20px; background:transparent url(../img/corner-bot-left.png) 0 0 no-repeat; width:56px; height:61px; z-index: 20;  }
	.corner-top-right { position:absolute; top:-20px; right:-20px; background:transparent url(../img/corner-top-right.png) 0 0 no-repeat; width:56px; height:61px; z-index: 20; }
	.cycle { position:absolute; right:0; top:0; height:100%; overflow:hidden; width:411px; border-left:1px solid #FFF; z-index: 1; }

/***** Home *****/
.home .column h3 {padding:0 20px;}
.home .column p {padding:0 20px;}
.home .industry-news {list-style: none; margin:0; padding:0; margin-right:20px;}
	.home .industry-news li { overflow:hidden; position:relative; list-style: none; border-bottom:1px dotted #CCC; padding-left:20px; padding-bottom:5px; margin-bottom:5px;}
	.home .industry-news a {padding-left:55px; float:left; display:block; }
	.home .industry-news span {color:#694F2D; position:absolute; left:20px; }
		
/***** Columns *****/
.columns {overflow: hidden; width:100%; padding-top:20px; display:block;}
	.home .columns { background:transparent url(../img/column-triple-bg.gif) 50% 0 repeat-y; margin-top:0;}
	.column {float:left;}

	.double {width:470px;}
	.triple {width:705px;}
	.single {width:235px;}
	.single-border {width:234px; border-right:1px dotted #CCC;}
	
	.column h2 {margin-bottom: .3em;}
	
	.column h2, .body-content h3, .column h4, .column h5,
	.column p { padding:0 20px; }
	.columns .body-content ul {list-style: square; margin-left: 35px;}
	.body-content blockquote {font-family:Georgia, serif; font-size:1.4em; line-height: 160%; color:#999; margin-bottom:0.8em; margin-right:50px; padding-bottom:0.4em; border-bottom:1px dotted #CCC; color:#659315;}
	.body-content blockquote.large {font-size:1.7em; color:#666;}
	.body-content h3 {padding-top:0.8em;}
	.body-content a {text-decoration: underline;}
	
/***** Images *****/
img.right, figure.right {margin: 0 0 2em 2em;}
img.left, figure.left {margin: 0 1.2em 2em 0;}

.body-content img {border:5px solid #EEE;}
.body-content img.no-border {border:0;}

/***** Forms *****/
#form-contact {background:#E3EBF0; padding:20px; margin-right:20px;}

	.drop form label,
	#form-contact label {font-size:1.2em;}
	.drop form input,
	#form-contact input, 
	#form-contact textarea {font-size:1.1em; width:395px; margin-bottom:5px; border:1px solid #DAE5EB; padding:5px; font-family:Arial, sans-serif;} 
	#form-contact button { line-height:32px; height:32px; width:128px; background:#999 url(../img/bg-button.png) 0 0 no-repeat; border:0; font-size:1.2em; cursor:hand; cursor:pointer;}
	
	#form-contact label.error, #drop-form label.error {font-size:1.0em; color:#FF0000; margin-bottom:5px; display:block;}
	.drop label.auto_login {font-size:1em;}
	input#auto_login, input#auto_login2 {width:auto; border:0;}
	.drop form input { width:260px; }
	.drop dl {padding-bottom:8px;}
	.drop fieldset {margin-bottom:8px;}

/***** Display *****/
.contact-list ul {margin:0; padding:0; list-style: none;}
	.contact-list ul li { padding:15px 0; border-top:1px dotted #CCC; height:115px;}
	.contact-list ul.list-one li {margin-left:20px;}
	.contact-list ul.list-two li {padding-left:20px;}
	.contact-list h3 {margin-bottom:0;}
	.contact-list h3 a { position:relative; width:20px; height:23px; text-indent: -999.99em; background:transparent url(../img/icon-map.gif) 100% 0 no-repeat; display:inline-block; margin-bottom:0; clear:both;}
	.contact-list li p {margin:0;padding:0;}

.columns .body-content ul.tick-list {list-style:none; margin-left:20px;}
	.tick-list li {list-style:none; font-size:1.2em; margin-left:0px; padding-left:25px; margin-bottom:0.3em; padding-bottom:0.3em; border-bottom:1px dotted #CCC; background:transparent url(../img/accept-trans.png) 0 3px no-repeat;}

.column .news-date {float:left; margin:0; padding:10px; background:#E3EBF0; margin-left:20px; margin-right:10px; color:#4A6576; margin-top:0.5em;}
	.news-date span {display:block; text-align: center; padding:0; margin:0;line-height:90%;}
	.news-date .day {font-size:2em;}	
	.news-date .month {font-size:1em; text-transform: uppercase;}	
	.news-date .year {font-size:0.9em; }
	
.news-date-sub { color:#999; font-size:1.3em; margin-bottom:0.3em;}
		
/***** Search results *****/
.search{}
	.search .search-results {border-bottom:1px dotted #CCC; padding-left:10px; margin-left:10px; padding-bottom:15px;}
	.search h5 {margin-bottom:0.2em;}
	.search h5 a {text-decoration: underline;}
	.search .search-excerpt {margin:0;}
	.search .search-link a {color:#AAA;}
	
	.search .paginate {padding-left:20px; padding-top:15px; border-top:1px dotted #CCC;}
	.search .paginate a {font-weight:bold; padding-left:10px;}

	#form-search-sub {margin-top:0.3em; width:235px; background: #E3EBF0 url(../img/bg-sub-nav-top.gif) 100% 0 no-repeat;} 
	#form-search-sub fieldset {padding:20px; padding-right:25px; background: transparent url(../img/bg-sub-nav-bot.gif) 100% 100% no-repeat;}
	#form-search-sub #keywords {font-size:1.1em; width:100%; margin-bottom:5px; border:1px solid #DAE5EB; padding:5px; font-family:Arial, sans-serif;}
	#form-search-sub button { line-height:25px; height:25px; width:100px; background:#999 url(../img/bg-button-small.png) 0 0 no-repeat; border:0; font-size:1em; cursor:hand; cursor:pointer;}
	.drop form button { line-height:25px; height:25px; width:100px; background:#999 url(../img/bg-button-small-dark.png) 0 0 no-repeat; border:0; font-size:1em; cursor:hand; cursor:pointer; color:#FFF;}
	#form-search-sub p {margin-top:0; padding:0;} 

/***** Footer *****/
#footer { position:relative; background:transparent url(../img/bg-footer.png) 0 100% repeat-x; margin-top:-115px; height:115px; clear:both; }
	#footer .body {background:transparent url(../img/footer-arrow.gif) 130px 0 no-repeat; overflow:hidden; height:115px; }
	
	#footer .call-phone {margin-top:17px;}
	#footer .call-phone, #footer .call-phone span {color:#859C98;}
	
	#nav-footer {margin:0; padding:0; margin-top:35px;}
	#nav-footer li {list-style: none; float:left; margin-right:15px;}
	#nav-footer li a {display:block; color:#FFF; }
	#nav-footer li a:hover { color:#EEE; }
	
	#copyright { position:absolute; left:0; bottom:0; width:100%; padding:0; }
	#copyright p {font-size:0.8em; color:#FFF; margin: 0; line-height: 38px;}
	#copyright a:link, #copyright a:visited {color:#FFF;}