html, body { height:100%; width:100%; margin:0;font-family: Arial, Verdana, Helvetica, sans-serif; text-align: center; background-color: #2b2b2b;}

#container { width:100%; height:auto; display: table; padding: 0; text-align: center; background-color: #fff; }
#content{width:965px;  margin: 0 auto; text-align: left; position: relative;  background-color: #fff; }
#header{padding:10px 0 60px 0;}


#contentHome{border-bottom: solid 1px #ccc; border-top: solid 1px #ccc; padding:10px 0 10px 0; width:955px; overflow: hidden;}
#homeHeaderLeft{background-color:#5e5e61; padding:15px; color:#fff; font-size: 1.09em; line-height: 1.4em; letter-spacing: 0.06em; font-weight: normal; width:200px; height:200px; _width:230px; _height:230px; float:left; margin:0;}
#homeHeaderRight{float:right; margin:0 0 0 0; padding:0;}

#mainContent{margin:0; padding:0;}


/* =========================  projects =========================*/

#projectList {}
#projectImage {float:left; margin:0 11px 0 11px; text-align: center; width:170px; }
#projectImage img{border:solid 1px #ccc; padding:1px}
#projectImage img:hover{border:solid 1px #ff0000; padding:1px}
#projectImage p{font-size: 10px; text-align: center; margin:0px 0 20px 0; line-height:12px;}
#buttProjectList {float:both;margin-left:7px;}

#projectImages{float:left; width:110px; margin:0 15px 0 0; border-right: 1px solid #999;}
#projectInfo{float:right; width:668px;}

#projectThumbs {width:960px; margin:0; padding:20px 0 20px 0; border-top: solid 1px #ccc; overflow:hidden}

#projectInfo a{color:#666; text-decoration: none;}
#projectInfo a:hover{color:#ff0000; text-decoration: underline;}

#filterPosts{top:165px; left:15px; position:absolute;}
#panel p {font-size: 12px;}

#aboutImage{float:left; width:202px; margin:0 0 0 0px;}
#aboutImage img {padding:2px; margin:3px; border-style: solid; border-width: 1px; border-color: #ccc;}
#aboutText{float:right; width:700px; margin: 0 0 0 0}

#aboutImage a.teamMembersButton{width:150px; height:15px; _height:10px; margin:0 0 0 50px;; text-indent: -9999px; background-image: url("images/butt_teamMembers_off.gif"); display: block; background-repeat: no-repeat}
#aboutImage a:hover.teamMembersButton{width:150px; height:15px; margin:0 0 0 50px; text-indent: -9999px; background-image: url("images/butt_teamMembers_on.gif"); display: block; }

#projectListButton a.buttProjectList{width:112px; height:15px; margin:0 0 0 0px;; text-indent: -9999px; background-image: url("images/butt_projectList_off.gif"); display: block; background-repeat: no-repeat; float:right }
#projectListButton a:hover.buttProjectList{width:112px; height:15px; margin:0 0 0 0px; text-indent: -9999px; background-image: url("images/butt_projectList_on.gif"); display: block; }

#teamList a.aboutInfoButton{width:150px; height:15px; margin:0 0 0 0px;; text-indent: -9999px; background-image: url("images/butt_aboutUsInfo_off.gif"); display: block; background-repeat: no-repeat }
#teamList a:hover.aboutInfoButton{width:150px; height:15px; margin:0 0 0 0px; text-indent: -9999px; background-image: url("images/butt_aboutUsInfo_on.gif"); display: block; }

#projectLeadingText{padding:5px 15px 15px 15px; margin:-15px 0 0 0; border-top:solid 1px #ccc;}
.categoryFilterList{}

#filterPostsSub {margin:-20px 0 0 15px}
#filterPostsSubSingle {margin:-40px 0 0px 15px; padding:0; width:940px; overflow: hidden;}

#filterPostsSub h4{margin:0 0 0px 0 }

#projectListButton{float:right; margin:0px 0px 0 0; padding:0}
#postTitle{float:left; margin:-24px 0 0 0; height:55px;}

select { background-color: #fff; color: #333; border: solid 1px #ccc;}
select option:hover { background-color:red; color:#fff;}

/* =========================  about =========================*/

#teamInfo{float:left; width:635px; margin:0 15px 0 0px;}
#staffImage{float:left; width:100px; margin:0 10px 0 0}
#memberInfo{float:right; margin:0 0px 0 0; width:500px;}
#teamList{float:right; width:260px; margin:0; line-height: 24px;}
#teamList a{text-decoration: none; color: #666; font-size: 14px; font-weight: normal;}
#teamList a:hover{text-decoration: none; color: #ff0000;}

#teamList a.active{color:#ff0000;}
#teamList a.nonActive{color:#666;}


/* =========================  news =========================*/

#newsImage{float:left; width:190px; margin:0 0 0 0px;}
#newsImage img {padding:2px; margin:3px; border-style: solid; border-width: 1px; border-color: #ccc;}
#newsImage img:hover {padding:2px; margin:3px; border-style: solid; border-width: 1px; border-color: #ff0000;}
#newsInfo {float:right; margin:0 0px 0 0; font-size: 11px; color:#ff0000; width:720px;}

#contentText{width:955px; margin:20px 0px 50px 0px; }
#contentText{width:955px; margin:20px 0px 50px 0px; }
#contentTextPost{width:940px; margin:20px 0px 50px 15px; }
#flashContent{}


/* =========================  contact =========================*/

#contactForms{float:left; width:400px; font-size: 12px; color:#333; margin:0 0 0 100px;}
#contactInfo{float:right; margin:0 160px 50px 0;}
#contactInfo a{text-decoration: none; color:#ff0000;}
#contactInfo a:hover{text-decoration: underline;}

#clearFloat{clear:both;}
#vertSeperator{float:left; width:10px; height:400px; background:url("images/vertSeperator.gif") repeat-y; }

hr{margin-bottom:25px;}

form {display:inline;}
.seperator{size:1; width:90%;}
#reminder{text-align: center; background-color:#c4ed89; padding:5px; width:97%; font-size: 12px;color:#666;}

/* ========================= font styles =========================*/

p {font-size: 12px; color:#666; line-height: 20px; text-align: justify;}

h1{font-size:18px; color: #666;font-weight: normal;}
h2{font-size:16px; padding:0; margin:0; font-weight: normal; color:#666;}
h3{font-size:14px; color: #666; padding:0; margin:0;}
h4{font-size:18px; color: #e11722;font-weight: normal;}

li {font-size:12px; line-height:20px; color:#666;}

a, a:link, a:visited {color:#ff0000; text-decoration: none}
a:hover{text-decoration: underline}

/* ========================= main navigation =========================*/

#logo {float:left;  margin:20px 0 0 0}
#topNav {float:right; height:110px; width:725px; margin: 22px 10px 40px 0;}

#nav {background-image: url("images/topNav.gif"); background-repeat: no-repeat; padding:0; height:110px; width:725px; margin:0px}
#nav span {display: none;}
#nav li, #nav a {display:block; height:110px;}
#nav li {float:left; list-style:none; display:inline;}

#topNav #home {width:78px;}
#topNav #about {width:119px;}
#topNav #architecture {width:159px;}
#topNav #planning {width:119px;}
#topNav #whatsnew {width:137px;}
#topNav #contact {width:113px;}

/* OVER STATES*/
#topNav #home a:hover {background:url("images/topNav.gif") 0px -113px no-repeat; }
#topNav #about a:hover {background:url("images/topNav.gif") -78px -113px no-repeat; }
#topNav #architecture a:hover {background:url("images/topNav.gif") -197px -113px no-repeat; }
#topNav #planning a:hover {background:url("images/topNav.gif") -356px -113px no-repeat; }
#topNav #whatsnew a:hover {background:url("images/topNav.gif") -475px -113px no-repeat; }
#topNav #contact a:hover {background:url("images/topNav.gif") -612px -113px no-repeat; }

/* ON STATES*/
#topNav.home #home a {background:url("images/topNav.gif") 0px -113px no-repeat; }
#topNav.about #about a {background:url("images/topNav.gif") -78px -113px no-repeat; }
#topNav.architecture #architecture a {background:url("images/topNav.gif") -197px -113px no-repeat; }
#topNav.planning #planning a {background:url("images/topNav.gif") -356px -113px no-repeat; }
#topNav.whatsnew #whatsnew a {background:url("images/topNav.gif") -475px -113px no-repeat; }
#topNav.contact #contact a {background:url("images/topNav.gif") -612px -113px no-repeat; }


/* =========================  footer =========================*/

#footer {width:100%; height:60px; text-align: center; padding:0; margin:auto; background-image: url("images/bg_footer.gif");background-repeat: repeat-x; }
#footerContent{width:680px; height:40px; margin: 0px auto; padding:15px 0 0 0; text-align: center; position: relative;}
#footer p {font-size: 0.7em; color:#fff; margin:0;}
.footerLinks, .footerLinks a{font-size: 10px; color:#666; text-decoration: none;}
.footerLinks a:hover{font-size: 10px; color:#fff; text-decoration: underline;}


/* ========================= form formatting =========================*/

.inputError {
	BORDER-RIGHT: #cc3333 1px solid;	BORDER-TOP: #cc3333 1px solid;	BORDER-LEFT: #cc3333 1px solid;	BORDER-BOTTOM: #cc3333 1px solid;	COLOR: #cc3333;	BACKGROUND-COLOR: #FFFFD7;	margin:0px;	padding:2px;	font-family: Verdana, Arial, Helvetica, sans-serif;	font-size: 11px;width:315px;}
	
.inputNormal {
	BORDER-RIGHT: #999 1px solid;	BORDER-TOP: #999 1px solid;	BORDER-LEFT: #999 1px solid;	BORDER-BOTTOM: #999 1px solid;	COLOR: #333;
	BACKGROUND-COLOR: #efefef;	width:315px;	margin:0px;	padding:2px;	font-family: Verdana, Arial, Helvetica, sans-serif;	font-size: 11px;}
	
.innerError {
	BORDER-RIGHT: #cc3333 1px solid;	BORDER-TOP: #cc3333 1px solid;	MARGIN: 0 0 10px 0;	BORDER-LEFT: #cc3333 1px solid;	BORDER-BOTTOM: #cc3333 1px solid;
	COLOR: #ff0000;	padding:5px;	width:310px;}

.submitClass { background: #ff0000; color:#fff; padding:2px; border:none; }
.submitClass:hover { background: #b32017; color:#fff; padding:2px; border:none; }
.success{font-weight: bold; color:#339900}


div#rotator { position:relative; margin:0px; width:715px; height:230px}
div#rotator ul {margin:0; padding:0;}
div#rotator ul li {	float:left;	position:absolute;	list-style-type: none; margin:0; padding:0;}
div#rotator ul li.show {z-index:50}

/* ========================= this is for the coda slider =========================*/

ul.menu {list-style-type:none; width:700px; height:33px; font-size:12px; font-family:"Lucida Grande", Geneva, Arial, sans-serif; margin:0 0 0 6px; padding:0;}
ul.menu li {display:block; float:left; margin:0; padding:9px 0 0 0;}
ul.menu li a {float:left; color:#666; text-decoration:none; height:24px; padding:0px 9px 0 9px; font-weight:normal;}
ul.menu li a:hover,.current {color:#cc0000; text-decoration:none;}
ul.menu .current a {color:#cc0000;}