body {
  background: #669acc url(../images/bg-body.gif) top left repeat-x;
  margin: 40px auto;
  color: #1f1f1f;
  font-family: "Arial", sans-serif;
  font-size: 11.5px;
  line-height: 16px;
}
body#home #callouts {
  border-top: 1px solid #88aad9;
  border-bottom: 1px solid #88aad9;
  margin: 20px 0 0 0;
  padding: 7px 0;
} 
body#home #callout-1 {
  float: left;
}
body#home #callout-2 {
   margin: 55px 0 0 80px;
  float: left;
}
#wrapper {
  margin: 0 auto;
  padding: 4px;
  border: 1px solid #c5e9fb;
  border: 1px solid #c5e9fb;
  text-align: left;
  width: 900px;
  position: relative;
}
#gutter-left,
#gutter-right {
  height: 690px;
  width: 50px;
  position: absolute;
  top: 0;
  left: -46px;
}
#gutter-right {
  left: 904px;
}
#container {
  background: #fff;
  padding: 0 25px;
  margin: 0 auto;
  width: 850px;
  position: relative; /* for absolutely positioned #nav div */
}
div#photo {
  width: 844px;
  border-top: 1px solid #88aad9;
  border-bottom: 1px solid #88aad9;
  margin: 0px;
  padding: 0px;
}
div#photo img {
  width: 844px;
  height: 249px;
}
#logo {
  border-top: 1px solid #88aad9;
  text-align: right;
  padding: 10px 0 20px 0;
  margin: 20px 0 0 0;
}
#logo img {
  margin: 0 20px 0 0;
}
#sidebar {
  width: 190px;
  float: left;
  margin-right: 30px;
  min-height: 100px;
  height:auto !important;
  height: 100px;
}
#sidebar ul#sidenav {
  width: 190px;
  margin: 0;
  padding: 0 0 1em 0;
  list-style: none;
}
#sidebar ul#sidenav li a {
  display: block;
  padding-left: 14px;
  color: #3971ab;
  font-size: 12px;
  text-decoration: none;
  background: url(../images/bg-sidenav.gif) top left no-repeat;
}
#sidebar ul#sidenav li a:hover,
#sidebar ul#sidenav li a.on {
  text-decoration: underline;
  background: url(../images/bg-sidenav-on.gif) 0 1px no-repeat;
}
#content.with-sidebar {
  float: left;
  width: 630px;
}
#content {
  width: 850px;
  min-height: 260px;
  height:auto !important;
  height:260px;
  padding: 0 0 20px 0;
}
#footer {
  margin: 10px auto;
  color: #b5d4ef;
  width: 900px;
}
#footer p {
  font-size: 9px;
  line-height: 10px;
  text-align: center;
  padding: 0 0 5px 0;
}
#footer a {
  color: #b5d4ef;
  text-decoration: none;
  text-transform: uppercase;
}
#footer a.on,
#footer a:hover {
  text-decoration: underline;
  color: #fff;
}

/***************************************************************************************************
  Navigation
***************************************************************************************************/
div#navtop {
  width: 850px;
  height: 28px;
}
#navtop ul { /* all lists */
  margin: 0 auto;
  width: 650px;
  list-style: none;
  line-height: 1;
  font-size: 11px;
  letter-spacing: 1px;
  padding: 0;
}
#navtop a {
  text-decoration: none;
  text-transform: uppercase;
  display: block;
  padding: 9px 10px;
  width: 100%;
  color: #3971ab;
}
#navtop li { 
  display: inline;
  float: left;
  height: 28px;
  border-right: 1px solid #fff;
  position: relative;
  z-index: 3; /* fix IE's z-index bug for absolutely-positioned children */
}
#navtop li:hover,
#navtop li.on {
  background: url(../images/bg-navtop.png) top left no-repeat;
  border-right: 1px solid #ccc;
  color: #fff;
  font-style: italic;
}
#navtop li:hover a,
#navtop li.on a {
  color: #fff;
}
#navtop li ul { 
  display: none; 
  position: absolute;
  z-index: 4;
  top: 28px;
  padding: 8px 0 10px 0;
  width: 140px;
  letter-spacing: 0;
  background: url(../images/bg-navtop.png) bottom left no-repeat;
  /* left: -999em; */
  /* 
  original used left instead of display to hide menus because 
  display: none isn't read by screen readers
  (removed in order to give better centered alignment relative to parent LI )
  */
}
#navtop li:hover ul {
  display: block;
  /*left: auto;*/
}
#navtop li li {
  width: 100%;
  height: 19px;
  text-align: center;
  margin: 2px 5px 2px 9px;
  padding: 1px 0;
  border: 0;
  background: none;
}
#navtop li li:hover,
#navtop li li.on {
  border: 0;
  background: url(../images/bg-navtop-tab-on.gif) top left repeat-x;
}
#navtop li li a {
  padding: 4px 0;
  margin: 0;
  color: #fff;
  font-style: normal;
}
#navtop li li a:hover,
#navtop li li.on a {
  font-style: italic;
}

#nav {
  height: 75px;
  width: 850px;
  text-align: center;
}
#nav ul {
  width: 730px;
  list-style: none;
  margin: 0 auto;
  padding: 0;
}
#nav li {
  float: left;
}
#nav li a {
  color: #3971ab;
  letter-spacing: 1px;
  display: block;
  font-size: 14px;
  padding: 10px 18px 6px 18px;
  text-transform: uppercase;
  text-decoration: none;
}
#nav li:hover,
#nav li.on,
body#home #nav li#navtab_home,
body#communities #nav li#navtab_communities,
body#costahomes #nav li#navtab_costahomes,
body#philosophy #nav li#navtab_philosophy,
body#investors #nav li#navtab_investors,
body#financing #nav li#navtab_financing,
body#about #nav li#navtab_about {
  background: url(../images/bg-nav-tab-on.gif) center 27px no-repeat;
}
/* hidden subnav blocks */
#nav li div {
	display: none;
	position: absolute;
  z-index: 2;
  top: 310px;
	width: 850px;
	text-align: center;
  list-style: none;
}
/* visible subnav blocks */
#nav li:hover div,
body#home #nav li#navtab_home div,
body#communities #nav li#navtab_communities div,
body#costahomes #nav li#navtab_costahomes div,
body#philosophy #nav li#navtab_philosophy div,
body#investors #nav li#navtab_investors div,
body#financing #nav li#navtab_financing div,
body#about #nav li#navtab_about div {
  display: block;
	left: 0;
}
#nav li div a {
  display: inline;
  width: auto;
  font-size: 11px;
  line-height: 25px;
  padding: 6px 10px 8px 10px;
  text-decoration: none;
}
#nav li div a:hover, 
#nav li div a.on {
  background: url(../images/bg-subnav-tab-on.gif) center 21px no-repeat;
}

/***************************************************************************************************
  Typography
***************************************************************************************************/
h1 {
  margin: 0 0 1em 0;
  font-size: 18px;
  color: #3971ab;
  line-height: 22px;
}
h2 {
  margin: 0 0 1em 0;
  font-size: 15px;
  color: #799ec4;
  font-style:italic; 
  line-height: 18px;
}
h3 {
  margin: 0 0 1em 0;
  font-size: 15px;
  line-height: 18px;
}

ul {
  margin: 0 0 0 3em;
  padding: 0 0 1em 0;
  list-style: disc;
}
ol {
  margin: 0 0 0 3em;
  padding: 0 0 1em 0;
  list-style: decimal;
}
p {
  padding-bottom: 1em;
}
a {
  color: #3971ab;
}
.right {
  text-align: right;
}
.clear {
  clear: both;
}
.clearfix:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
.clearfix {display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

small {
  font-size: 10px;
}
.uppercase {
  text-transform: uppercase;
}
.center {
  text-align: center;
}
.highlight {
  background: #ff0;
  color: red;
  margin: 10px 0;
  font-weight: bold;
}
.light-green, a.light-green {
  color: #0d4123;
}
.dark-green {
  color: #043f20;
}
.light-blue {
  color: #336699;
  font style: bold;
}
div#back-to-top {
  margin: 10px 0 20px 120px;
}
div#back-to-top a {
  color: #3971ab;
}

/***************************************************************************************************
  photo galleries
***************************************************************************************************/
div.crossfade-container {
  height: 365px;
  width: 380px;
  position: relative;
  float: left;
}
div.fade-box {
  width: 377px;
  position: absolute;
  top: 0;
  left: 0;
}
div.photo-wrapper {
  width: 365px;
  padding: 5px;
  border: 1px solid #679acb;
}
div.gallery-nav {
  margin: 15px 0;
  border-top: 1px solid #679acb;
  border-bottom: 1px solid #679acb;
  height: 30px;
  width: 377px;
  line-height: 30px;
}
div.gallery-nav a, div.gallery-nav span {
  display: block;
  float: left;
  line-height: 30px;
}
div.gallery-cycle a img {
  margin: 7px 8px;
}
div.gallery-enlarge {
  float:left;
  width:212px;
  padding-left: 25px;
}
div.gallery-cycle {
  float:left;
  width:120px;
}

/***************************************************************************************************
  Gradiented boxes
***************************************************************************************************/
div#home-details {
  width: 210px;
  margin: 0 10px 0 28px;
  float: left;
  border: 1px solid #679acb;
}
div#home-details div.gradient,
div#portfolio-project-details div.gradient {
  background: #fff url(../images/gradient.jpg) top left repeat-x;
  margin: 5px;
  width: 166px;
  padding: 17px;
}
div#home-details h2 {
  margin: 0 0 10px 0;
}
div#home-details p {
  line-height: 28px;
  padding: 0;
}
div#home-details p.blurb {
  line-height: 18px;
  margin-top: 8px;
}
div#portfolio-project-details {
  width: 210px;
  border: 1px solid #679acb;
  margin: 0 10px 0 28px;
  float: left;
}
div#portfolio-project-details p {
  margin-bottom: 8px;
  line-height: 14px;
}
div#project-details {
  width: 592px;
  border: 1px solid #679acb;
  margin: 10px 0 20px 0;
}
div#project-details h3 {
  text-transform: uppercase;
  font-size: 11.5px;
  line-height: 16px;
  color: #7eacdc;
}
div.project-details-column {
  min-height:100px;
  height:auto !important;
  height:100px;
  width:120px;
  padding:10px;
  float:left;
  background:url(../images/dots-vertical.jpg) top right no-repeat;
}
div#project-details div.gradient {
  background: #fff url(../images/gradient.jpg) top left repeat-x;
  margin: 5px;
  padding: 10px;
}
div.pdf-download a {
  float: left;
  display: block;
  margin: 6px 6px 0 0;
}
div.pdf-download img {
  float: left;
  display: block;
}


/***************************************************************************************************
  Misc
***************************************************************************************************/
div.news-item-meta {
  margin: 15px 0;
  line-height: 18px;
}
span.news-item-date {
  color:#0d4123;
  font-size: 13px;
}
span.news-item-headline {
  color: #0d4123;
  font-size: 13px;
}
span.news-item-publication {
  text-transform: uppercase;
  color: #b9be4d;
  font-size: 13px;
}
span.news-item-author {

}
div.news-item-download {
  float: right;
  margin: 0 15px 0 0;
  padding-bottom:15px;
  text-align: right;
  width: 160px;
}
div.news-item-download a {
  float: left;
  display: block;
  margin: 10px 0 0 0;
}
img.news-item-download-file {
  float: left;
}

div.management-team-item {
  float:left;
  width:280px;
  margin-right:15px;
  line-height: 14px;
}
div.model-home-item-wrapper {
  background: url(../images/bg-model-home-item.jpg) top left no-repeat;
  margin: 0 5px;
  position: relative;
  left: -20px;
}
div.model-home-item {
  border: 1px solid #828a8f;
  color: #828a8f;
  margin: 20px;
  width: 578px;
}
div.model-home-item-photo {
  float: left;
}
div.model-home-item-photo img { 
  margin: 3px 10px 3px 3px;
  /* width: 336px; */
}
div.model-home-item-detail {
  margin: 50px 0 0 0;
  float: left;
  width: 221px;
}
div.portfolio-item-detail {
  margin: 50px 0 0 0;
  float: left;
  width: 221px;
  height: 200px;
  overflow: auto;
}
div#paginator a {
  color: white;
  background: #82898f;
  border: 1px solid #82898f;
  display: block;
  text-align: center;
  float: left;
  margin: 2px;
  width: 16px;
  height: 16px;
  line-height: 16px;
  text-decoration: none;
}
div#paginator a:hover,
div#paginator a.on {
  background: white;
  color: #82898f;
}

 img.orenco {
   padding-top:80px;
   padding-left:12px;
   vertical-align:top;
}

 img.villebois {
   padding-top:110px;
   vertical-align:top;
}
/***************************************************************************************************
  Flash
***************************************************************************************************/
#flash-intro {
   position: absolute;
   z-index: 0;
}

/***************************************************************************************************
  Forms
***************************************************************************************************/
form input, 
form select,
form textarea {
  width: 250px;
}
form label {
  text-transform: uppercase;
  font-size: 11px;
  line-height: 17px;
  height: 17px;
  padding: 3px 0;
}
div.field-wrapper { margin-top: 8px; }
form label.required {
  padding-right: 58px;
  background: url(../images/required.gif) top right no-repeat;
}
form textarea#comments {
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 11px;
  height: 60px;
}
form span.required {
  color: #937350;
}
.error {
  color: red;
  background: #fff7c3;
}
form span.field_tip {
  color: #666;
  font-style: italic;
  font-size: 10px;
}
form div.field_wrapper {
  width: 300px;
  margin: 7px 0;
}
form input#submit {
  width: auto;
  height: auto;
  margin: 10px 0;
  float: left;
}