/*==============================================
/* The Basic Stylesheet for citybuilderspdx.com;
/* This can get hacked up into multiple
/* style sheets later, but for now I prefer
/* to have everything in one. Also, I've
/* chosen to use spaces in each element to
/* help with readability. ~b
==============================================*/

/*===================================
/* Reseting all basic styles, so that
/* there are a lot less cross-browser
/* display issues.
===================================*/

* { margin: 0; padding: 0; }
h1, h2, h3, h4, h5, h6, form, body, html, p, input, ul, ol, li { margin: 0; padding: 0;}
ul, ol { list-style: none; }
a img, :visited img, :link img { border: none; }
:link, :visited { text-decoration: none; }
.clear { clear: both; }

/*===================================
/* Amazing big props to Angus Turnbull
/* for this simple fix to the IE PNG
/* conundrum. You are a scholar and
/* a saint, sirrah.
===================================*/

img, div, a { behavior: url(iepngfix.htc); }

/*===================================
/* Global Styles
===================================*/

a {
  color: rgb(146,96,15);
}

a:hover, a:active { color: rgb(106,46,0);}

body { 
  background-color: rgb(148,149,124);
  margin: 60px 0 0 90px;
  color: rgb(20,20,20);
  font-family: Garamond, Georgia, serif;
}

#container {
  background-color: rgb(217,220,155);
  border: 10px solid white;
  width: 720px;
  voice-family: "\"}\""; 
  voice-family:inherit;
  width:700px;
  /*950px*/
}

.splash { 
  height: 160px;
  width: 700px;
  /*203px*/
  background-color: rgb(228,234,184);
  background-repeat: no-repeat;
  border-top: 10px solid white;
  border-bottom: 10px solid white;
}

#content {
  padding: 2em; 
}

#header {
  height: 150px;
}

.clear { clear: both; }

/*===================================
/* Typographic Styles
===================================*/

h1 { margin-bottom: .3em; font-variant: small-caps; }
p { margin-bottom: 1.2em; }

/*===================================
/* Image Splash Styles
===================================*/

#mainSplash { background-image: url(splash01.jpg); }
#projectsSplash { background-image: url(splash02.jpg); }
#employeesSplash { background-image: url(splash09.jpg); }
#linksSplash { background-image: url(splash07.jpg); }
#contactSplash { background-image: url(splash05.jpg); }
#pardeeSplash { background-image: url(splash06.jpg); }

/*===================================
/* Menu Styles
===================================*/

#menu { 
  width: 547px; 
  height: 37px;
  background-image: url(menuBar.png);
  margin: 0 0 0 0;
  padding: 0;
  position: relative;  
  top: 112px;
  left: 25px;
  float: left; 
}

#menu li {
  margin: 0;
  padding: 0;
  list-style: none;
  position: absolute;
}

#menu li, #menu a {
  height: 38px;
  display: block;
  outline: none;
}

#logo { float: left; margin: 10px 0 0 10px; }

#menu li a span { visibility: hidden; }

#home { left: 2px; width: 91px; }
#projects { left: 92px; width: 98px; }
#team { left: 189px; width: 82px; }
#sustainability { left: 270px; width: 147px; }
#contact { left: 415px; width: 104px; }

#home a:hover { background: transparent url(menuBar.png) -2px -38px no-repeat; }
#projects a:hover { background: transparent url(menuBar.png) -92px -38px no-repeat; }
#team a:hover { background: transparent url(menuBar.png) -189px -38px no-repeat; }
#sustainability a:hover { background: transparent url(menuBar.png) -270px -38px no-repeat; }
#contact a:hover { background: transparent url(menuBar.png) -415px -38px no-repeat; }

#homeSelected { background: transparent url(menuBar.png) -2px -38px no-repeat; }
#projectsSelected { background: transparent url(menuBar.png) -92px -38px no-repeat; }
#teamSelected { background: transparent url(menuBar.png) -189px -38px no-repeat; }
#sustainabilitySelected { background: transparent url(menuBar.png) -270px -38px no-repeat; }
#contactSelected { background: transparent url(menuBar.png) -415px -38px no-repeat; }

/*===================================
/* Header Styles
===================================*/

/*
#header {
  background-image: url(logo.png);
  background-repeat: no-repeat;
  background-position: 10px 10px;
  height: 150px;  
  /*223px*/
/*}
*/

/*===================================
/* Footer Styles
===================================*/

#footer { 
  margin: 40px 0 0 0;
  font-size: 120%;
  width: 700px;
  padding: 0 20px 35px 20px;
  letter-spacing: .1em; 
}

#footerWrapper { text-align: center; margin: 0 auto 0 auto;}

#footer p { margin: 0; }

/*===================================
/* Projects Page Layout
===================================*/


h2 { margin: 1em 0 1em 0 ;}
#kingpark { display: none; }

/*===================================
/* Employee Page Layout
===================================*/

.employeeBox { }

.employeeBox img { 
  border: 4px solid black; 
  width: 115px; 
  height: 130px; 
  float: left;
  margin: 0 1em 2em 0;
}

.employeeBox h1 { }

.employeeBox p { text-align: justify; }

/*===================================
/* Contact Form Layout
===================================*/

form li { margin-bottom: 1em; }

li label {
	position: absolute;
	display: block;
	width: 7em;
	margin: 0 .1em 0 0;
	border: 0px solid rgb(229,220,138);
	padding: 0px;
   	font: normal 1em/1.3em georgia, serif;
	text-align: right;
	}
label span {
	color: rgb(146,96,15);
	}
	
input, select, textarea {
   	font: normal 1em/1.3em Garamond, Georgia, serif;
	border: 0;
    border: 1px solid rgb(225,202,160);
    background: rgb(223,223,178);
	color: rgb(146,96,15);
	padding: 2px 4px;
	margin: 0 0 0 7.1em;
	}
	
p.submit {
	margin: 12px 0 10px 7.1em;
	padding: 0;
	}
	
p.submit input {
	background-color: rgb(185,185,151);
   	font: normal 1em/1.3em arial, helvetica, sans-serif;
    border: 3px solid rgb(175,175,151);
	color: rgb(54,53,48);
	padding: 1px 5px;
	margin: 0;
	}
	
	
/*===================================
/* Pardee Commons Layout
===================================*/

.pardeeHighlights li { margin: 0 0 1em 2em; }
.priorityContact p { margin: 0 0 0 0; }
.priorityContact h3 { margin: 0 0 0 0; font-size: 100%; }
.priorityContact { margin: 0 0 2em 2em; }
h1.pardeeHead { margin: 0; }
h2.pardeeHead { margin: 0 0 1em 0; }

.updateBlock { width: 600px; }
.update { margin: 0 0 20px 0; }
.infoBlock { float: left; width: 200px; padding: 0 0 0 50px; text-align: right; }
.imageBlock { float: right; width: 310px; }
.imageBlock img { margin-bottom: 10px; border: 4px solid white; }