/* CSS Document 

COLORS:

B15628  orange
B76335	light orange #B86536
46453D brown
A29E87 Tan EAD9B2
46453D Gray
35332E psuedo  black





*/



h1, h2, h3, h4, h5, h6, ul, dl {margin:0px; padding:0;}

li { list-style:none;}
a {color:#A29E87;
text-decoration:none;}

a:hover {color:#B15628;
text-decoration:underline;}

body {font:12px/1.3em Arial, Helvetica, sans-serif;
color:#252525;
background:#161715 url(images/rhino_bkg.jpg) no-repeat center top;
margin:0px; padding:0;}

#container {background:#ffffff url(images/contentBkg.gif) repeat-x;
width:95%;
min-width:700px;
position:relative;
margin:20px auto 0px auto;}



/* -------------------------------Branding Div---------------------------------*/

#branding {background:#B86536 url(images/brandingbkg_03.gif) repeat-x; 
height:176px; width:95%;
margin:30px auto;
min-width:700px;
position:relative;
}

#branding h1 { background:url(images/logo.gif) no-repeat;
text-indent:-9999px;
height:153px; width:117px;
position:relative;
top:14px;
border-right:5px solid #ffffff;
z-index:10;}

#branding h1 a { height:153px; width:117px; display:block;}

#branding h2 { background:url(images/images/h2_branding.gif) no-repeat 6px;
text-indent:-9999px;
height:152px; width:322px;
position:absolute;
top:15px; right:0px;
z-index:5;
}

/* -------------------------------Content Div---------------------------------*/


#content {
min-width:400px;
padding:80px 220px 30px 250px;
*padding:80px 220px 30px 250px;
_padding:80px 220px 30px 250px;}

*html #test {width:450px; padding:0 0 0 150px;}


/* ---------------------copy of content 1 div. this if for the pages with no quotes on side. note adjusted padding------------------*/
#content.services {
min-width:400px;
padding:80px 220px 30px 50px;
*padding:80px 220px 30px 50px;
_padding:80px 220px 30px 50px;}


#content.subcontractors {
min-width:400px;
padding:80px 220px 30px 50px;
*padding:80px 220px 30px 50px;
_padding:80px 220px 30px 50px;}

#content.jobs {
min-width:400px;
padding:80px 220px 30px 50px;
*padding:80px 220px 30px 50px;
_padding:80px 220px 30px 50px;}

#content.about {
min-width:400px;
padding:80px 220px 30px 50px;
*padding:80px 220px 30px 50px;
_padding:80px 220px 30px 50px;}


#content.projects {
min-width:400px;
padding:80px 220px 30px 50px;
*padding:80px 220px 30px 50px;
_padding:80px 220px 30px 50px;}

#content.safety {
min-width:400px;
padding:80px 220px 30px 50px;
*padding:80px 220px 30px 50px;
_padding:80px 220px 30px 50px;}


#content.services {
min-width:400px;
padding:80px 220px 30px 50px;
*padding:80px 220px 30px 50px;
_padding:80px 220px 30px 50px;}


#content.clients {
min-width:400px;
padding:80px 220px 30px 50px;
*padding:80px 220px 30px 50px;
_padding:80px 220px 30px 50px;}


#content.press {
min-width:400px;
padding:80px 220px 30px 50px;
*padding:80px 220px 30px 50px;
_padding:80px 220px 30px 50px;}

#new_form.form {
min-width:400px;
padding:80px 220px 30px 50px;
*padding:80px 220px 30px 50px;
_padding:80px 220px 30px 50px;}



/* ----------IE fix---------------*/

*html #content { padding-left:220px; padding-right:220px; }


#content h1.main { background:url(images/title_durrTakeCharge.gif) no-repeat; text-indent:-9999px;
height:32px;
}


#content h1 {height:25px; margin:7px 0 7px 0; 
width:400px;
display:block;
padding:0; font-size:20px; 
line-height:1em; 
font-family: Arial, Helvetica, sans-serif; 
font-weight:bold; visibility:visible; 
text-transform:uppercase;
}



#content h2 { margin:19px 0 3px 0; 
padding:0; font-size:14px; 
font-family: Arial, Helvetica, sans-serif; 
font-weight:bold;
letter-spacing:normal;
color:#B15628;
}

#content h3 { font-weight:bold; color:#46453D; font-size:13px;}

#content p {margin:15px 0 5px 0px;}

 #content ul { margin:0 0 0 30px;}
 #content ul li { list-style:disc;}

 #content ul.links {margin-top:20px; }
 #content ul.links li {padding:3px 0;}
  #content ul.links li a {text-decoration:underline;}
   #content ul.links li a:hover {color:#B15628;
text-decoration:underline;}


.right {float:right; padding:0 0px 20px 20px;}
.left {float:left; padding:0 20px 20px 0;}

ul#equip1 li {list-style:none;}
ul#equip1 {position:absolute; top:418px; left:301px; }

ul#equip2 li {list-style:none;}
ul#equip2 {position:absolute; top:418px; left:516px; }



/* -------------------------------Switching out quotes - use switchout.js and quotes.asp files to control---------------------------------*/

#quote {width:200px; position:absolute;
left:0px;
bottom:-40px;
margin:0px; padding:0;
width:200px;
margin:0px; padding:0;}

#quote dt {
margin:0px; padding:20px 0 0 0px;
background:url(images/person.gif) no-repeat bottom;
height:210px; width:231px;
display:block;
color:#ffffff;}

#quote dd {margin:0px; padding:0;
 width:175px;
display:block;
position:relative;
left:-14px; top:-10px;
padding:20px 30px 30px 25px;
color:#ffffff;
font-size:12px;
text-align:center;
line-height:1.3em;}


/* ------to add  photos to quotes - give the dt new class 
and add photo as background image - like this example: -----*/

#quote dt.first {background:url(images/person_1.gif) no-repeat bottom;}

#quote dt.second {background:url(images/person_2.gif) no-repeat bottom;}

/* -- this guy was omitted from the rotation so i renamed the next quote 'fifth' -----
#quote dt.third {background:url(images/person_3.gif) no-repeat bottom;}
*/

#quote dt.third {background:url(images/person_4.gif) no-repeat bottom;}

/* -- this guy was omitted from the rotation so i renamed the next quote 'fifth' -----
#quote dt.fifth {background:url(images/person_5.gif) no-repeat bottom;}
*/

#quote dt.fourth {background:url(images/person_6.gif) no-repeat bottom;}

#quote dt.fifth {background:url(images/person_7.gif) no-repeat bottom;}

#quote dt.sixth {background:url(images/person_8.gif) no-repeat bottom;}


/* ------this filter lets you use transparent background image (the orange box with shadow) -----*/
.quote { 
    filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='/images/quote_bkg.png');
	background-position:bottom;
}

.quote[class] {
  background:url(/images/quote_bkg.png) bottom;
}


#dropcontentsubject{width:200px; position:absolute;
left:0px;
bottom:-40px;
margin:0px; padding:0;

}




/* ------------------------------ NAVIGATION ---------------------------------*/

/* -------------- mainnav - in main_nav.asp file (working .ai file is called main_nav.ai)---------------*/



#mainnav {background:#46453D;
color:#ffffff;
height:30px;
width:100%;
position:absolute;
top:-30px;
}

#mainnav_links {width:865px;
margin:0 auto;
position:relative;}

#mainnav li {display:block; text-indent:-9999px; position:absolute; }
#mainnav li a {display:block; height:30px;}

li#mn_1 {top:0; left:0;}
li#mn_2 {top:0; left:50px;}
li#mn_3 {top:0; left:120px;}
li#mn_5 {top:0; left:188px;}
li#mn_4 {top:0; left:352px;}
li#mn_6 {top:0; left:412px;}
li#mn_7 {top:0; left:473px;}
li#mn_8 {top:0; left:589px;}
li#mn_9 {top:0; left:674px;}
li#mn_10 {top:0; left:774px;}




li#mn_1 a { width:50px; background: url(images/mainnav.gif) 0 0;}
li#mn_2 a { width:70px; background: url(images/mainnav.gif) -50px 0;}
li#mn_3 a { width:68px;background: url(images/mainnav.gif) -120px 0;}
li#mn_5 a { width:164px; background: url(images/mainnav.gif) -188px 0;}
li#mn_4 a { width:60px;background: url(images/mainnav.gif) -352px 0;}
li#mn_6 a { width:61px;background: url(images/mainnav.gif) -412px 0;}
li#mn_7 a { width:116px;background: url(images/mainnav.gif) -473px 0;}
li#mn_8 a { width:85px;background: url(images/mainnav.gif) -589px 0;}
li#mn_9 a { width:93px;background: url(images/mainnav.gif) -674px 0;}
li#mn_10 a { width:93px;background: url(images/mainnav.gif) -774px 0;}



li#mn_1 a:hover, body.about li#mn_1 a { width:50px; background: url(images/mainnav_on1.gif) 0 0;}
li#mn_2 a:hover, body.services li#mn_2 a { width:70px; background: url(images/mainnav_on1.gif) -50px 0;}
li#mn_3 a:hover, body.projects li#mn_3 a { width:68px;background: url(images/mainnav_on1.gif) -120px 0;}
li#mn_5 a:hover, body.subcontractors li#mn_5 a { width:164px; background: url(images/mainnav_on1.gif) -188px 0;}
li#mn_4 a:hover, body.safety li#mn_4 a { width:60px;background: url(images/mainnav_on1.gif) -352px 0;}
li#mn_6 a:hover, body.clients li#mn_6 a { width:61px;background: url(images/mainnav_on1.gif) -412px 0;}
li#mn_7 a:hover, body.press li#mn_7 a { width:116px;background: url(images/mainnav_on1.gif) -473px 0;}
li#mn_8 a:hover, body.employment li#mn_8 a { width:85px;background: url(images/mainnav_on1.gif) -589px 0;}
li#mn_9 a:hover, body.employee_section li#mn_9 a { width:93px;background: url(images/mainnav_on1.gif) -674px 0;}  
li#mn_10 a:hover, body.disaster_info li#mn_10 a { width:93px;background: url(images/mainnav_on1.gif) -774px 0;}  



/* -------------- secondary nav - also in main_nav.asp file ---------------*/

#nav2 {height:153px; width:350px;
position:absolute;
top:-192px; left:122px;
background:url(images/nav2bkg.gif) no-repeat;
z-index:20;}


#nav2 li  { display:block; color:#EAD9B2; text-indent:-9999px;
width: 88px; height:20px; padding: 5px 0 0 ; z-index:20;
}
#nav2 li a { display:block; color:#EAD9B2; text-indent:-9999px;
 height:20px; padding: 2px 0 0 ; 
}

#nav2 li a:hover { display:block; color:#EAD9B2; text-indent:-9999px;
border-bottom:#EAD9B2 3px solid; height:12px;
}

#nav2 li { position:absolute;bottom:32px;}
li#n2_1 {left:30px; width: 88px; background:url(images/demo_link.gif) no-repeat;}
li#n2_2 {left:150px; width: 73px; background:url(images/siteprep_link.gif) no-repeat;}
li#n2_3 {left:260px; width: 68px; background:url(images/utilities_link.gif) no-repeat;}
li#n3_4 {bottom:4px; left:30px; width: 53px; background:url(images/paving_link.gif) no-repeat;}
li#n3_5 {bottom:4px; left:150px; width: 150px; background:url(images/disaster_link.gif) no-repeat;}



/* -------------- sitemap nav -  in more_nav.asp file ---------------*/

#sitemap {text-align:center;
position:absolute;
right:5%;
width:70%;

}

#sitemap li {display:inline;
padding:0px 5px;
text-align:center;
font-weight:bold;
font-size:10px;
color:#A29E87;}

#sitemap li a:hover {background:#A29E87;
color:#35332E;}



a#contact {position:absolute;
top:33px; right:80px;
display:block;
width: 70px; height:10px; text-indent:-9999px;
background:url(images/contact.gif) no-repeat center #ffffff;

}

*html a#contact { top:30px;
height:6px}

a:hover#contact {
background:url(images/contact_on.gif) no-repeat center #ffffff;

}

/* -------------- inside sections nav - each section has it's own .asp file, which is in each section folder ---------------*/


dl#insidenav {width:150px;
font:11px/1em Arial, Helvetica, sans-serif;
text-transform:uppercase;
font-weight:bold;
position:absolute;
right:30px;
top:20px;
margin-top:50px;
padding:0 0 0 0;
color:#46453D;
height:100%;

z-index:30;}

dl#insidenav dt {font-size:14px;line-height:1.3em; padding:0 0 5px 0px; }

dl#insidenav dd { margin:0; padding:3px 0 3px 0px;
border-top:#999999 dotted 1px; background:#FFFFFF;}


 dl#insidenav a {color:#46453D; display:block; padding:5px 0 5px 5px;}
 
 dl#insidenav a:hover  {color:#fff; background:url(images/inside_over.gif) right center no-repeat; text-decoration:none;}
 
 
 
/* -------------- this controls the rollover state of the inside nav ---------------*/ 

body.about #container.history dl#insidenav dd#in2 a, body.about #container.philosophy dl#insidenav dd#in3 a,
body.about #container.personnel dl#insidenav dd#in4 a, body.about #container.resources dl#insidenav dd#in5 a,
body.about #container.associations dl#insidenav dd#in7 a,

body.services #container.demo dl#insidenav dd#in2 a, body.services #container.siteprep dl#insidenav dd#in3 a, body.services #container.utilities dl#insidenav dd#in4 a, 
body.services #container.paving dl#insidenav dd#in5 a, body.services #container.disaster dl#insidenav dd#in6 a,

body.projects #container.current dl#insidenav dd#in2 a, body.projects #container.past dl#insidenav dd#in3 a, 

body.subcontractors #container.upcoming_bids dl#insidenav dd#in2 a, body.subcontractors #container.plan_room dl#insidenav dd#in3 a, body.subcontractors #container.forms dl#insidenav dd#in4 a,

body.safety #container.program dl#insidenav dd#in2 a, body.safety #container.results dl#insidenav dd#in3 a,  

body.clients #container.client_list dl#insidenav dd#in2 a, body.clients #container.testimonials dl#insidenav dd#in3 a,

body.press #container.news dl#insidenav dd#in2 a, body.press #container.awards dl#insidenav dd#in3 a, body.press #container.community dl#insidenav dd#in4 a,
body.press #container.newsletter dl#insidenav dd#in5 a, body.press #container.associations dl#insidenav dd#in6 a, 

body.employment #container.jobs dl#insidenav dd#in2 a
{color:#fff; background:url(images/inside_over.gif) right center no-repeat;}



/* -------------- Special Styles for different sections that have unique needs ---------------*/ 

/* -------------- Projects styling ---------------*/ 

body.projects #content h2 { display:inline; font-size:14px; line-height:1.6em; padding:0 5px 0 0;}
body.projects #content div#photos { float:right; padding: 5px; border:#999999 1px solid; margin:20px 0px 20px 20px; width:225px; height:200px;}
body.projects #content div#photos2 {width:225px; height:167px; margin:0; padding:0px;}



div.project_desc { border-top:1px dotted #666666; margin-top:20px; padding-top:10px; width:100%; position:relative; clear:none;}


body.projects #content, body.about #content, body.safety #content, body.clients #content, body.press #content 
{padding-left:70px; padding-right:220px;}

body.projects #content.reset, body.about #content.reset, body.safety #content.reset, body.clients #content.reset, body.press #content.reset
{padding:80px 220px 30px 250px;
*padding:80px 220px 30px 250px;
_padding:80px 220px 30px 250px;}




*html body.projects #content.reset { padding-left:220px; padding-right:220px; }
*html body.about #content.reset { padding-left:220px; padding-right:220px; }
*html body.press #content.reset { padding-left:220px; padding-right:220px; }

body.projects #content ul.menu li { font-size:14px; line-height:1.6em; list-style:none; color:#B15628; font-weight:bold;}

body.projects #content ul.menu li a {color:#B15628;}






/* -------------- table styling ---------------*/ 

table { border-bottom:#CCCCCC solid 1px; }
tr.heading { font-weight:bold;}
tr { display:block; }
tr:hover {background:#EAD9B2;}
tr.heading:hover {background:none;}
td.equip {  padding:5px 10px; width:140px;}
td.equip2 { width:65px; }




/* -------------- special ULs ---------------*/ 

#content ul.logos {list-style:none;}
#content ul.logos li { clear:left; list-style:none;}
#content ul.logos li img {width:75px;}


/* -------------- testimonial names ---------------*/ 

em.name {display:block; margin:0 0 0 60px;}



/* ----------IE fix---------------*/

*html #new_form { padding:10px 220px 5px 220px;  }



/* -------------- content form ---------------*/ 

#content_form {
width:500px;
padding:10px 0 5px 220px; }

#content_form table { padding:0; margin:0; }
#content_form tr {  }
#content_form tr:hover {background:none; }
#content_form td { padding:0; margin:0; }

#content_form h1 {height:25px; 
margin:7px 0 7px 0; padding:0; font-size:20px; line-height:1em; 
font-family: Arial, Helvetica, sans-serif; font-weight:bold; visibility:visible; text-transform:uppercase;}

#content_form h2 { margin:19px 0 3px 0; padding:0; 
font-size:14px; font-family: Arial, Helvetica, sans-serif; font-weight:bold; color:#B15628;}

#content_form h3 { font-weight:bold; color:#46453D; font-size:13px;}

#content_form p {padding:0; margin:0;}

 #content_form ul { margin:0 0 0 30px;}
 #content_form ul li { list-style:disc;}

 #content_form ul.links {margin-top:20px; }
 #content_form ul.links li {padding:3px 0;}
 #content_form ul.links li a {text-decoration:underline;}
 #content_form ul.links li a:hover {color:#B15628; text-decoration:underline;}



/* -------------- new form ---------------*/ 
#new_form {
width:500px;
padding:10px 0 5px 50px;}

#new_form table { padding:0; margin:0; }
#new_form tr {  }
#new_form tr:hover {background:none;}
#new_form td {  padding:5px 10px; width:40%; }

#new_form p.right {text-align:right; line-height:2.0em; }

#new_form h1 {height:25px; 
margin:7px 0 7px 0; padding:0; font-size:20px; line-height:1em; 
font-family: Arial, Helvetica, sans-serif; font-weight:bold; visibility:visible; text-transform:uppercase;}

#new_form h2 { margin:19px 0 3px 0; padding:0; 
font-size:14px; font-family: Arial, Helvetica, sans-serif; font-weight:bold; color:#B15628;}

#new_form h3 { font-weight:bold; color:#46453D; font-size:13px;}

#new_form p {padding:0; margin:0;}

 #new_form ul { margin:0 0 0 30px;}
 #new_form ul li { list-style:disc;}

 #new_form ul.links {margin-top:20px; }
 #new_form ul.links li {padding:3px 0;}
 #new_form ul.links li a {text-decoration:underline;}
 #new_form ul.links li a:hover {color:#B15628; text-decoration:underline;}
