@charset "utf-8";
/* CSS Document */

<!--

* {padding: 0; margin: 0; color:#333333; border:none;} /*makes most text dark grey not black*/

h4 {margin-top: 5px;}

body {
	font: 100% Arial, Verdana, Helvetica, sans-serif;
	background: #330000;
	margin: 20px 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	color: #000000;
}
#container {
	width: 980px;  /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
	background: #FFFFFF;
	margin: 25px auto; /* the auto margins (in conjunction with a width) center the page */
	border: 1px solid #000000;
	text-align: left; /* this overrides the text-align: center on the body element. */
}
#mainContent {
	padding: 20px 30px;	 /* remember that padding is the space inside the div box and margin is the space outside the div box */
}
#header {border-bottom: #ff5900 2px solid;}/*#f99904 light orange*/



#selectedstep {border-bottom:#333333 2px solid;} /*{background-image:url(../images/blueback.png); background-repeat:repeat; background-position:top left;} puts blue in top corner of the step in question or if white thenbackground-color:#000000;*/

.fltleft {float: left;}
.clearboth {clear: both; height:1px;}
.fltright {float: right;}
/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */
/*nav menu in header*/

.underlinemenu{
font-weight: bold;
width: 100%; /*was 100%*/
margin: 0 0 10px 0;
/*float: right;*/
}

.underlinemenu ul{
padding: 6px 0 7px 0; /*6px should equal top padding of "ul li a" below, 7px should equal bottom padding + bottom border of "ul li a" below*/
margin: 0;
text-align: left; /*set value to "left", "center", or "right"*/
}

.underlinemenu ul li{
display: inline;
}

.underlinemenu ul li a{
color: #494949;
padding: 6px 3px 4px 3px; /*top padding is 6px, bottom padding is 4px*/
margin-right: 35px; /*spacing between each menu link, orig 20px*/
text-decoration: none;
border-bottom: 3px solid white; /*bottom border is 3px was grey*/
}

.underlinemenu ul li a:hover, .underlinemenu ul li a.selected{
border-bottom-color: black;
}

/*end of nav menu in header*/

#leftcol {width: 200px;}

#rightcol {width: 700px;}
#rightcol h1 {padding: 10px 0 5px 0;}

.breadcrumb {color: #f95904; font-size:80%; padding: 5px 0 5px 0;}


#footer {margin: 10px 30px; background-color: #ff5900; /* #ff6600; or#f95904; orange, #0f55A3 blue*/ color: #ffffff; padding: 10px;	}
#footer p {color: #FFFFFF; font-size:80%;}
#footer a {color: #FFFFFF; text-decoration:none;}
#footer a:hover {text-decoration:underline;}

.noborder {border: none;} /*removes border from an image or link*/
.leftmarginminus24px {margin-left: -24px;} /*used on quotes image in mainquote div*/

/*mainpic is the div behind the differnetmain images on each page padding: 30px; */
#mainpic { text-decoration:none; border:none; width: 700px; margin-bottom:10px; }
#mainpic a:link, #mainpic a:visited, #mainpic a:focus{text-decoration:none; color:#000000; border:none;}
#mainpic a:hover {text-decoration:none; color:#000000; border:none;}
#mainpic a:active {text-decoration:none; color:#000000; border:none;}

#mainpic_home { background-image:url(../images/neadle_700x256.jpg); background-repeat:no-repeat; background-position:top left; }
/*#mainpic_home { background-image:url(../images/office_woman700px.jpg); background-repeat:no-repeat; background-position:top left; }*/
/* #mainpic_home { background-image:url(../images/bridge700x256.gif); background-repeat:no-repeat; background-position:top left; }animated gif*/
/*#mainpic_home { background-image:url(../images/bridge700x256.jpg); background-repeat:no-repeat; background-position:top left; }*/



#mainpic_about {background-image:url(../images/tubeuk700px.jpg); background-repeat:no-repeat; background-position:top left;}

#mainpic_case {background-image:url(../images/steps700px.jpg); background-repeat:no-repeat; background-position:top left;}

#mainpic_links {background-image:url(../images/map700x256.gif); background-repeat:no-repeat; background-position:top left;}

#mainpic_portfolio {background-image:url(../images/yellowwall700x256.jpg); background-repeat:no-repeat; background-position:top left;}

#steplist li {list-style-position:inside; margin: 0 0 2px 0;} /*not used*/

.stepimg {margin: 0 5px -8px 0;} /*margin for step images on case study page*/
.stepdefn { margin: 5px 0 20px 0;}
#stepgallery img {margin: 0 9px 20px 0;}

.mainquote {color:#000000; padding: 20px 40px 5px 30px; background-color:#fcdd74; width: 200px; font-size: 120%;  line-height: 1.4;margin: 20px;}

#featuredleft {width: 340px; line-height:1.4; margin-top: 5px;}
#featuredright {width: 340px; line-height:1.4; margin-top: 5px;}
#featuredleft p, #featuredright p {padding: 0 0 5px 0;}
#featuredleft a, #featuredright a {text-decoration:none; font-weight:bold;} 
.orange {color:#ff5900; display: inline; font-weight:bold;}/* makes list heading bold orange on about page*/


.portfoliobox {width: 340px;}

.portfoliobox a {text-decoration:none;}
.border {border:#CCCCCC 1px solid}



/*for folder image and steps on case study page - put text in the picture, not used
.stepdiv  {color:#990000; background-color: #FFFFFF; width: 100px; height:50px; padding: 5px; margin: 0 6px 6px 0;}*/

.noline a{text-decoration:none;}
.noline li {list-style-type:square;}

#contact {line-height: 1.4; margin-top: 18px;}

/*styles the form to show up in firefox*/
.formbox {border: #999999 1px solid;}
.submit {background-color:  #cccccc; border: #330000 2px solid;}

#frame {position:absolute; top:40px; left:0px; width:480px; height: 640px; border:#999999 1px solid;} /* create an empty frame so that visitors expect something to go there on wireframe page */
#image_links li {list-style-position:inside; margin: 0 0 10px 0; display:inline;}



/*pre loads images from http://perishablepress.com/press/2007/07/22/css-throwdown-preload-images-without-javascript/*/
div#preloaded-images {
   position: absolute;
   overflow: hidden;
   left: -9999px; 
   top: -9999px;
   height: 1px;
   width: 1px;
}
-->