/*
	Grunley site styles
	Developed by Saforian
*/


/* --- Formatting --- */
BODY
{ color:#49494b; font:normal .7em/1.2em verdana,arial,helvetica,sans-serif }

P, TH, TD, LI, DT, DD
{ color:#49494b }
TH, STRONG, B
{ font-weight:bold }
EM, I, CITE
{ font-style:italic }
SUP, SUB
{ font-size:75% }
BLOCKQUOTE
{ margin:0; padding:0 }
TABLE, TR, TD, TH
{ font-size:100% }


/* Links */
A:link
{ color:#18377a; text-decoration:underline }
A:visited
{ color:#113a56; text-decoration:underline }
A:hover, A:active
{ text-decoration:none }


/* Paragraphs */
P
{ margin:0 0 1.2em 0; line-height:1.5em }

.small /* Fine print */
{ font-size:91% }
.big /* Large print */
{ font-size:110% }
.more /* More info links */
{ margin-bottom:0; text-align:right }
#updated /* Last updated field */
{ float:right; margin:-2px 0 0 0; font-size:91%; font-style:italic }


/* Images */
A IMG
{ border-style:none }
.floatleft /* Floating images */
{ float:left; margin:0 8px 8px 0 }
.floatright
{ float:right; margin:0 0 8px 8px }


/* Separators */
HR
{ color:#c44d1e; background-color:#c44d1e; height:1px; margin:0 0 .4em 0; padding:0; border-style:none; overflow:hidden }
	HTML>BODY HR
	{ margin:1em 0 }


/* Headers */
H1, H2, H3, H4, H5, H6
{ color:#c44d1e; margin:0 0 .6em 0; padding:0; font:bold 110% verdana,arial,helvetica,sans-serif; line-height:1.3em }
H1
{ color:#333; text-transform:uppercase }
H3
{ font-size:105% }
H4, H5, H6
{ font-size:100% }
H6
{ margin-bottom:.2em }


/* Lists */
UL
{ margin:0 0 1em auto; padding:0; list-style-type:none }
UL LI, OL LI UL LI
{ margin:0; padding:1px 0 .5em 13px; line-height:1.5em; background:transparent url("/images/bullet_star.gif") no-repeat 2px .5em }
UL UL
{ margin:5px 0 2px 2px }

OL
{ margin:0 0 1em 33px; padding-left:0 }
OL LI, UL LI OL LI
{ margin-bottom:.5em; line-height:1.5em }

DL
{ margin:0 0 1em 0 }
DT
{ display:block; font-weight:bold; line-height:1.5em }
DD
{ margin:1px 0 .6em 0; line-height:1.5em }


/* Forms */
FORM
{ margin:0; padding:0 }
FIELDSET
{ border-style:none; margin:0; padding:0 }
LEGEND
{ font-size:110%; color:#000; font-weight:bold; margin:0 0 1em 0; padding:0 }
INPUT, SELECT, TEXTAREA
{ font-family:verdana,arial,helvetica,sans-serif; font-size:100%; vertical-align:middle }


/* Data Tables */
TABLE.data
{ margin:0 0 1.3em 0; padding:0; border:1px solid #eee; border-collapse:collapse; border-spacing:0; empty-cells:show }

TABLE.data TH
{ background-color:#fff; color:#000; text-align:left; padding:5px; border-bottom:2px solid #000; vertical-align:top; line-height:1.4em }
TABLE.data TR, TABLE.data TR.data-even
{ background-color:#fff }
TABLE.data TR.data-odd
{ background-color:#f1f1f1 }

TABLE.data TD
{ padding:4px 5px; vertical-align:top; line-height:1.4em }

TABLE.data TR.break TD
{ border-top:16px solid #fff }

TABLE.data TABLE.data /* Nested table */
{ border-width:0 }



/* --- Layout --- */

#skipnav, .hide, .hide *
{ position:absolute; overflow:hidden; left:0; top:-9999px; width:1px; height:1px }

BODY
{ margin:0; padding:22px 10px 10px 10px; background:#fff url("/images/back_body.gif") repeat-x;
  text-align:center; /* IE5 centering fix */ }


/* - Header - */
#header
{ position:relative; width:800px; height:57px; margin:0 auto 20px auto; 
  text-align:left; /* IE5 centering fix */ }

#logo IMG
{ float:right; margin-right:18px; display:block }
	* html #logo IMG /* IE double-margin float fix */
	{ display:inline }


/* Navigation bar */
#navigation
{ width:600px; margin-left:6px; padding-top:6px }

/* Separators */
#navigation DIV
{ width:11px; height:51px; float:left; background: url("/images/nav_sep.gif") no-repeat top center }
#navSep1, #navSep7  /* Hide first and last separators by default */
{ visibility:hidden }

/* Navigation images using Phark revised image replacement */
#navigation A
{ float:left; text-indent:-9999px; height:51px; padding:0 10px; overflow:hidden; 
  color:#113a56; text-decoration:none; white-space:nowrap; background:transparent none no-repeat top center }
#navigation A:hover  /* Hover state */
{ color:#c44d1e; background-position:50% -51px }

/* Navigation images (with IE5 box model fix) */
#navigation A#navHome
{ width:52px; w\idth:32px; background-image:url("/images/nav_home.gif") }
#navigation A#navAbout
{ width:74px; w\idth:54px; background-image:url("/images/nav_about.gif") }
#navigation A#navNews
{ width:87px; w\idth:67px; background-image:url("/images/nav_news.gif") }
#navigation A#navServices
{ width:66px; w\idth:46px; background-image:url("/images/nav_services.gif") }
#navigation A#navPortfolio
{ width:94px; w\idth:74px; background-image:url("/images/nav_portfolio.gif") }
#navigation A#navProjects
{ width:118px; w\idth:98px; background-image:url("/images/nav_projects.gif") }

/* Active state (uses ids so they do not go in Dreamweaver's class list */
#homenav #navHome, #aboutnav #navAbout, #newsnav #navNews, #servicesnav #navServices, #portfolionav #navPortfolio
{ background-position:50% -51px; background-color:#fff; color:#c44d1e }

/* Left-of-active separator */
#homenav #navSep1, #aboutnav #navSep2, #newsnav #navSep3, #servicesnav #navSep4, #portfolionav #navSep5
{ visibility:visible; background:#fff url("/images/nav_sepleft.gif") }

/* Right-of-active separator */
#homenav #navSep2, #aboutnav #navSep3, #newsnav #navSep4, #servicesnav #navSep5, #portfolionav #navSep6
{ visibility:visible; background:#fff url("/images/nav_sepright.gif") }



/* - Content wrappers - */
#wrapper
{ position:relative; clear:both; min-height:309px; margin:20px auto 0 auto; 
  border:7px solid #fff; border-width:0 7px; background:#fff none no-repeat 0 0; 
  text-align:left; /* IE5 centering fix */
  width:814px; w\idth:800px; /* IE5 box model fix */ }
	#wrapper:after /* Clear after floats */
	{ content:"."; display:block; height:0; clear:both; visibility:hidden }
	* html #wrapper /* IE min-height fix */
	{ height:309px }

#wrapper
{ background:#fff url("/images/back_columnside.gif") repeat-y 139px 0 }

/* Subnavigation */
#subnav
{ float:left; min-height:309px; 
  border:7px solid #fff; border-width:0 7px 7px 0; background-color:#113a56;
  width:179px; w\idth:172px /* IE5 box model fix */ }
	* html #subnav
	{ height:316px; he\ight:309px; /* IE5 min-height and box model fix */ }

#subnav UL
{ margin:0; padding:6px 0; list-style-type:none }
#subnav UL LI
{ display:inline; margin: 0; padding:0; background-image:none }

#subnav UL LI A
{ padding:3px 8px 4px 21px; line-height:1.2em; display:block; color:#fff; 
  background:transparent url("/images/bullet_subnav.gif") no-repeat 9px .6em; 
  text-decoration:none; height:1% }
	HTML>BODY #subnav UL LI A /* IE hasLayout fix */
	{ height:auto }
#subnav UL LI A:hover
{ background-color:#6b94c0; color:#fff }

#subnav UL LI#active A, #subnav UL LI#active A:hover /* Active link */
{ background-color:#6b94c0; color:#fff; background-image:url("/images/bullet_subnav_active.gif") }



/* - Content Area - */
#content
{ float:left; padding:0 7px;
  width:385px; w\idth:371px; /* IE5 box model fix */ }

#content DIV.photos IMG /* Top photo */
{ display:block; margin:0 -7px 15px -7px; padding-left:40px; text-align:right; 
  background:transparent url("/images/back_columnside.gif") repeat-y }

H1 IMG
{ display:block }


/* Right sidebar */
#sidebar
{ float:right; min-height:309px; padding:0 10px; background-color:#c44d1e; 
  color:#fff; font-size:91%; 
  width:228px; w\idth:208px; /* IE box model fix */ }
	* html #sidebar /* IE min-height fix */
	{ height:309px }

#sidebar UL LI, #sidebar OL LI UL LI /* White star bullet */
{ background-image:url("/images/bullet_star_white.gif") }

#sidebar DIV.photos IMG /* Optional big photos */
{ display:block; border-bottom:7px solid #fff; margin:0 -10px }

#sidebar H2, #sidebar H3, #sidebar H4, #sidebar H5, #sidebar P
{ color:#fff; margin:1em 0 }
#sidebar A, #sidebar LI, #sidebar DT, #sidebar DD, #sidebar H6
{ color:#fff }

#sidebar HR
{ color:#fff; background-color:#fff }


/* - Footer - */
#quote
{ clear:both; margin:30px auto; display:block; text-align:center }

#footer /* Contains bottom-left corner of sidebar */
{ width:799px; clear:both; margin:20px auto 0 auto; 
  color:#163a57; font-size:91%; text-align:right }

#footer P
{ margin:0 0 .9em 0; padding:8px 15px; background-color:#e4e2e3; color:#163a57 }
#footer A
{ margin-left:14px; padding:4px 0; color:#163a57; white-space:nowrap; text-decoration:none }
	* html #footer A
	{ height:1% }
#footer A:hover
{ color:#163a57; text-decoration:underline }

#footer A#iconsub
{ padding-right:20px; background:transparent url("/images/icon_subcontractor.gif") no-repeat center right }
#footer A#iconemp
{ padding-right:23px; background:transparent url("/images/icon_employee.gif") no-repeat center right }

#footer P#copyright /* Copyright */
{ float:left }

#footer ADDRESS
{ color:#163a57; line-height:1.3; margin:0; padding:0 15px; font-style:normal; text-align:left }



/* --- Portfolio --- */
.portfolio #wrapper /* Faux column */
{ background:#fff url("/images/back_sidebar.gif") repeat-y 179px 0 }

.portfolio #content
{ float:right; width:376px; padding:0 }

.portfolio #sidebar
{ float:left; padding-top:1em }
.portfolio #sidebar UL LI
{ padding-left:13px; background:transparent url("/images/bullet_plus_white.gif") no-repeat 0 .55em }

.portfolio #intro
{ padding-right:40px; background:transparent url("/images/back_columnside.gif") repeat-y right top }
.portfolio #intro P
{ font-size:91% }

.portfolio #content DIV.photos
{ width:383px; margin:0 -7px 1em 0 }
	* html .portfolio #content DIV.photos /* IE margin fix */
	{ margin-right:-14px }

	.portfolio #content DIV.photos:after /* Clear after floats */
	{ content:"."; display:block; height:0; clear:both; visibility:hidden }


.portfolio #content DIV.photos IMG /* Photos */
{ display:block; float:left; margin:0 7px 7px 0; padding-left:0; background-image:none }

.portfolio #sidebar LI.active A
{ zoom:1; padding:2px 9px 2px 0; background:transparent url("/images/bullet_star.gif") no-repeat 100% .2em }
	* html .portfolio #sidebar LI.active A /* IE multi-line wrap fix */
	{ background-position:100% .7em }

.portfolio #sidebar P.active /* Legend */
{ margin:2.2em 0; padding:7px 0 7px 13px; font-style:italic; 
  background:transparent url("/images/bullet_star.gif") no-repeat 1px 50% }

