/* 
 * ========================================
 * global element styles 
 * ========================================
 */


* {
	margin:0;
	padding:0;
}

body { 
	font-size: 62.5%; 
	font-family: Arial, Helvetica, sans-serif; 
	margin:0 auto; 
	text-align: center; 
}

div#wrapper { 
	width: 825px; 
	margin-left:auto; 
	margin-right:auto; 
	text-align: left;
}

div#wrapper img { width: 156px;  height: 66px; float: left; display: inline; }

div#wrapper p { float: right; margin:43px 0 0 0; display: inline; font-weight: bold; font-size: 1.3em;}

div#navcontainer ul {
	padding: 0;
	margin-bottom: 3px;
	background-color: #40d0ff;
	color: #fff;
	float: left;
	width: 100%;
	height:28px;
}

div#navcontainer ul li { display: inline; line-height: 28px; }

div#navcontainer ul li a {
	padding: 0 2em;
	color: #000;
	text-decoration: none;
	font-family: arial, helvetica, sans-serif;
	font-weight: bold;
	font-size: 1em;
	letter-spacing: .25em;
	text-transform: uppercase;
	background-image: url(images/pipe.gif);
	background-repeat: no-repeat;
	background-position: center right;
	float: left;
}

div#navcontainer ul li a:hover {
	background-color: #f28a00;
	color: #fff;
}


#home #navcontainer ul li a.active ,
#about #navcontainer ul li a.active ,
#services #navcontainer ul li a.active,
#clients #navcontainer ul li a.active,
#portfolio #navcontainer ul li a.active,
#contact #navcontainer ul li a.active {
background-color: #f28a00;
}

a {
	outline: none;
}

h1 {
	width:825px;
	height:125px;
	text-indent: -5000px;
	clear: both;
}

h2 {
	height: 20px;
	text-indent: -5000px;
}

#flashheader{

width:825px;
height:125px;
margin:auto;
margin-bottom:5px;
float:left;
}

#main {
	background: #000;
	width:785px;/*is width and padding bad to do together */		
	padding:20px;
	float:left; 
}

#home #main {
	background: #000;
	width:827px;
	height: 336px;
	padding: 0;	
	float:left; 
}
#about p.largeText {
color:#FFFFFF;
float:left;
font-family:Arial,Helvetica,sans-serif;
font-size:13px;
font-weight:normal;
line-height:26px;
margin:35px 0 0;
padding-top:10px;
width:450px;
}

#secondary {
	width:785px;
	float:left;
	background-image:url(images/orange_bg.jpg);
	background-repeat:repeat;
	background-color:#f28a00;
	margin:7px 0 0;
	padding:40px 20px; 
	clear: both;
}

#secondary p {
	font-family: Arial, Helvetica, sans-serif;
	padding-right:25px;
	font-size: 1.2em;
	line-height: 1.5em;
	float: left;
	font-weight: normal;
	margin: 0;
}

#footer {
	width:824px;
	clear:both;
}

#footer ul {
	width:824px;
	height: 28px;
	margin-left:auto;
	margin-right: auto;
	float:left;
	list-style: none;
}

#footer ul li {
	float: left;
	margin: 1em 0;
}

#footer ul li.first {
	float: left;
	margin: 1em 0;
	padding:0 1.5em;
	background-image: none;
}

#footer ul a {
	text-decoration: none;
	color:#8C8C8C;
	font-size: 1.1em;
	letter-spacing: .125em;
	padding: 0 1.5em;
	background:url(images/pipe.gif) top right no-repeat; 
}

#footer ul a:hover {
	color: #000;
}

#footer .copyright {
	color:#8C8C8C;
	font-size: 1.1em;
	letter-spacing: .125em;
	padding: 0 0 0 2em;
}


/* 
 * ========================================
 * home page
 * ========================================
 */

	
#home h1 {
	background: url(images/homeHead2.gif) center no-repeat;
}

#home #secondary h2 {
	height: 25px;
	background: url(images/h2_Pinnacle.png) top left no-repeat;
	margin-bottom: 5px;
}

#home #secondary p {
	font-family: Arial, Helvetica, sans-serif;
	padding-right:25px;
	font-size: 13px;
	font-weight:bold;
	color:#333333;
	line-height: 15px;
	float: left;
	font-weight: normal;
	margin: 0;
}

 


/* 
 * ========================================
 * about page
 * ========================================
 */
 
 #about #main {
 	background:#000 url(images/silhouette2.jpg) top right no-repeat;
 	height: 254px;
 	font-family: Georgia, Times, serif;
 	font-size: 1.3em;
}

 
 .tagline {
 	font-weight: bold;
 	color: #a6c82b;
 	display: block;
 }
 
 #about h1 {
	background: url(images/aboutHead.gif) center no-repeat;
}

#about #secondary h2 {
	background: url(images/h2_SecAbout.png) top left no-repeat;
	margin-bottom: 10px;
}

#about #secondary p {
	font-family: Arial, Helvetica, sans-serif;
	padding-right:25px;
	font-size: 13px;
	font-weight:bold;
	color:#333333;
	line-height: 15px;
	float: left;
	font-weight: normal;
	margin: 0;
}

/* 
 * ========================================
 * clients page
 * ========================================
 */

#clients h1 {
	background: url(images/clientsHead.gif) center no-repeat;
}


#clients #main {
	background-image:url(images/center_bg_graysteel.jpg);
}

#clients table {
	table-layout: fixed;
	width: 800px;
	border-collapse: collapse;
	color: #fff;
	font-size: 1.3em;
}

#clients td {
	width: 200px;
	padding: 2px 0;
}

.catGreen {
	color: #a6c82b;
	font-weight: bold;
	padding-top: 4px;
}

.catOrange {
	color: #f28a00;
	font-weight: bold;
	padding-top: 4px;
}



/* 
 * ========================================
 * portfolio page
 * ========================================
 */

#portfolio #main {
  	background-color: #fff;
  	margin:0;
  	padding:0;
  	width: 825px;
  	height: 333px;
  	font-size: 1.2em;
  	border: solid 1px #4d4d4d;
  }

#portfolio h1 {
	background: url(images/portfolioHead.gif) center no-repeat;
}

#menu {height:333px; width:150px; background-color: #4d4d4d; position:relative;}

#menu ul {margin:0; padding:0; list-style:none; white-space:nowrap; text-align:left; padding:0; background:#4d4d4d;}

#menu li {margin:0; padding:0; list-style:none; width: 140px;}
#menu li {display:inline-block; display:inline;}
#menu ul ul {position:absolute; left:-9999px;}
#menu ul#toplevel {position:absolute; left:0; top:0; margin: 30px 0 0 0;}

#menu a {display:block; width: 140px; font:normal 11px arial,helvetica, sans-serif; color:#fff; line-height:28px; text-decoration:none; padding:0 0 0 10px; background: url(images/bttn_subportfolio.png) no-repeat right bottom; } 

#menu ul li:hover > ul {left:100%; margin-top:-28px; margin-left:-1px;}

/* 
 *the commented out styles below will add a third flyout column to the menu 
 */

/*
#menu a:hover ul,
#menu a:hover a:hover ul, 
#menu a:hover a:hover a:hover ul {left:100%;}
#menu a:hover ul ul, 
#menu a:hover a:hover ul ul {left:-9999px;}
*/

#menu li a:hover {background:#F28A00 url(images/bttn_subportfolio.png) no-repeat right top; color:#fff;} 
#menu li:hover > a {background:#F28A00 url(images/bttn_subportfolio.png) no-repeat right top; color:#fff;}
#menu li a.fly {background: url(images/bttn_portfolio.png) no-repeat right top;}
#menu li a.fly:hover {background:#F28A00 url(images/bttn_portfolio.png) no-repeat right bottom;} 
#menu li:hover > a.fly {background:#F28A00 url(images/bttn_portfolio.png) no-repeat right bottom;}

#menu table {position:absolute; left:99%; height:0; width:0; border-collapse:collapse; margin-top:-7px; margin-left:-1px;}

iframe { 
width: 675px;
height: 330px;
margin:-333px 0 0 0;
padding:0;
float:right;
display: inline-block;
display: inline;
}


/* 
 * ========================================
 * services page
 * ========================================
 */

#services #main {
	background:#f28a00 url(images/servicesMain2.jpg) top left no-repeat; 
	background-position:left;
	width:555px;
	height:198px;
	padding:20px 20px 20px 250px;
	float:left; 
}

 
 #services h1 {
	background: url(images/servicesHead.gif) center no-repeat;
}

#services #main h2 {
	background: url(images/h2_ourServices.png) top left no-repeat;
	margin-bottom: 5px;
}

#services #secondary {
	width:785px;
	float:left;
	background-color: #40d0ff;
	margin:7px 0 0;
	padding:10px 20px; 
	clear: both;
}


#services #secondary.servicesbox {
background-color:#FFFFFF;
background-image:none;
border:thin solid #CCCCCC;
clear:both;
float:left;
margin:7px 0 0;
padding:10px 20px;
width:785px;
}

#clients #secondary.bottom{
background-image:url(images/clients_bottom_bg.jpg);
background-repeat:repeat;
padding-top:10px;
padding-bottom:10px;
}

#portfolio #secondary.bottom{
background-image:url(images/portfolio_bottom_bg.jpg);
background-repeat:repeat;
padding-top:10px;
padding-bottom:10px;
}

#contact #main.bottom{
background-image:url(images/contact_bg.jpg);
background-repeat:no-repeat;
}


#services #secondary h2 {
	background: url(images/h2-SecServices.png) top left no-repeat;
	margin-bottom: 5px;
}

#services #secondary p {
	font-family: Arial, Helvetica, sans-serif;
	width: 215px;
	padding-right:25px; 
	font-size: 1.2em;
	line-height: 1.8em;
	float: left;
	font-weight: normal;
	margin:0;
	color:#666666;
}

#serviceTable {
	/* width:520px; */
	color: #fff;
	font-size: 1.3em;
	height: 175px;
}

#serviceTable td {
	width:275px;
}

/* 
 * ========================================
 * services form element
 * ========================================
 */
 
#contact form p { float: right; margin:0; display: inline; font-size: 1em; font-weight: normal;}


#services form {
	display: inline;
	margin: 0; /* removes mystery form tag gapping */
	padding: 0; /* removes mystery form tag gapping */
}

#services fieldset {
	float: left;
	margin: -20px 0 0 15px;/* fixes IE6 double margin bug */
	padding: 0 0 5px;
	border: solid 0 transparent;
}

#services label {
  display: block;
  float: left;
  clear: left;
  width: 40px;
  line-height: 15px;
  margin:5px 5px 10px;/* fixes IE6 double margin bug */
  text-align: right;
}

#services input, textarea, select {
  margin: 0;
  padding: 3px;
  font-size: 12px;
  color: #666666;
  background: #F5F5F5;
  border: 1px solid #ccc;
  margin: 5px;
}   

#services textarea {width: 209px; resize: none;}

#services input:focus, textarea:focus, select:focus {
  border: 1px solid #999;
  background-color: #FFFFFF;
}

#services input.button {
  cursor: pointer;
  font-weight: bold;
  width: 216px;
  height: 21.5px;
  margin-top: -7px;
  background: #ccc url(images/btn_submit.jpg) top right no-repeat;
  border:none;
}

/* 
 * ========================================
 * Secondary services 
 * ========================================
 */
 
 
#clients #secondary div, #portfolio #secondary div {float: left; margin-right: 1%; padding-right: 1%; width: 22%; display: block; }

#clients #secondary h2, #portfolio #secondary h2 {
	background: url(images/ourServices.png) top left no-repeat;
	margin: 10px 0 0 0;
	padding: 0;
}

#clients  #secondary ul, #portfolio #secondary ul {
	color: #FFFFFF;
	font-size:12px;
	margin:0;
	padding:0;
	display: block;
	font-size: 1.1em;
	list-style: none;
}

#clients #secondary li, #portfolio #secondary li {line-height: 1.2em; width: 100%; display: block; margin:0 0 10px; }



/* 
 * ========================================
 * Contact page
 * ========================================
 */

#contact #main {
	background:#f28a00 url(images/operator.jpg) top left no-repeat; 
}

 #contact h1 {
	background: url(images/h1_Contact.gif) center no-repeat;
}


#contact form {
	display: inline;
	width: 505px;
	height: 260px;
	margin: 0; /* removes mystery form tag gapping */
	padding: 0; /* removes mystery form tag gapping */
	float:right;
}

#contact form p {
	width: 215px;
	font-size: 1.2em;
	line-height: 1.6em;
	margin-right: 20px;
	float:left;
}


#contact fieldset {
	margin:0;/* fixes IE6 double margin bug */
	padding: 0;
	border: solid 0 transparent;
}

#contact label {
  display: block;
  float: left;
  clear: left;
  width: 40px;
  line-height: 15px;
  margin:5px 5px 10px;/* fixes IE6 double margin bug */
  text-align: right;
}

#contact fieldset input, #contact fieldset select {
  margin: 0;
  padding: 3px;
  padding-left:2px;
  padding-right:2px;
  font-size: 1em;
  color: #666666;
  background: #F5F5F5;
  border: 1px solid #ccc;
  margin: 5px 5px 5px 0;
} 



#contact textarea, #contact select {
  margin: 0;
  padding: 3px;
  font-size: 12px;
  color: #666666;
  background: #F5F5F5;
  border: 1px solid #ccc;
  margin: 5px 5px 5px 0;
} 


#contact textarea {width: 477px; resize: none;}  

#contact input.button {
  cursor: pointer;
  font-weight: bold;
  width: 485px;
  height: 22px;
  margin-top: -7px;
  background: #ccc url(images/btn_submit.jpg) top right no-repeat;
  border:none;
}


.message{

color:#FFFFFF;
font-family:Arial, Helvetica, sans-serif;
font-size:11px;
}


#services .message{

color:#FF6600;
font-family:Arial, Helvetica, sans-serif;
font-size:11px;


}