/* =============================================================================

template.css

Template styles based on element IDs. This provides basic presentational style
for such things as:
  * header
  * footer
  * left column
  * right column
  * content column

Additionally, this file provides all the styles required for template variation.
As such, most site-specific customizations will be made elsewhere.

Exceptions:
  * Logo height: to change logo height, modify the styles for #head, making sure
    the first "height" and the final "min-height" match the height of the logo
    image.

----------------------------------------------------------------------------- */

/* ===== IDs ===== */

/* ----- WRAP ----- */
#wrap { width: 760px; }

/* ----- HEAD ----- */

#head {
/*  clear: both; */
  padding-left: 180px;
  padding-bottom: 5px;
}

.simplified #head,
.enhanced #head { padding-left: 0; }

.enhanced #address,
.enhanced #nav-head {
  display: block;
  padding: 0.25em 0.5em;
}

#nav-head {
  float: right;
  margin: 0;
  padding: 0;
}

#nav-head li { margin: 0; }

.enhanced #logo {
  clear: right;
  float: right;
  margin-left: -6px; /* fixes IE float issue */
} html>/**/body.enhanced #logo {
  margin: 0;
}

.enhanced #masthead {
  clear: left;
  float: left;
}

/* ----- MAIN ----- */
#main {
  float: left;
  margin-right: -100%;
  width: 100%;
}

/* ----- BODY ----- */
#body { margin: 0 180px; padding-left: 35px; }

.two-col #body { margin: 0 0 0 180px; }

#content {
  padding: 0.5em 18px 0.5em 0.5em;
  min-height: 300px;
  height: auto;
}

/* ----- RIGHT ----- */
#right {
  display: inline;
  float: right;
  width: 180px;
}

#nav-right { padding: 0.5em; }

.two-col #right { display: none; }

/* ----- LEFT ----- */
#left {
  display: inline;
  float: left;
  margin-top: -75px;
  width: 180px;
}

#nav-left { padding: 0.5em; }

.enhanced #left,
.simplified #left { margin-top: 5px; }

#left form input { width: 96%; }

#left form button {
  cursor: pointer;
  float: right;
  padding: 0;
}

/* ----- FOOT -----

To adjust the positioning of the #foot element beneath columns, alter the margin
style on the element accordingly. The margins on left and right should either be
zero or identical to the width of the #left or #right elements. Therefore,
assuming #left and #right have widths of exactly 180px, the following hold:

 * centered under only the content column
   #foot { margin: 0 180px; }
 * centered under all columns
   #foot { margin: 0; }
 * left aligned under content and #left column
   #foot { margin: 0 180px 0 0; }
 * right aligned under content and #right column
   #foot { margin: 0 0 0 180px; }

---------------- */

#foot,
#foot.all,
.two-col #foot.left,
.two-col #foot.right {
  clear: both;
  margin: 0;
  background: transparent none;
}

#foot.content { margin: 0 180px; }

#foot.left { margin: 0 0 0 0; }

#foot.right,
.two-col #foot.content { margin: 0 0 0 180px; }

#nav-foot { background: #fff none; margin: 0; }