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

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;
}

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

#address,
#nav-head { display: none; }

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

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

#nav-head li { margin: 0; }

#address { float: left; }

.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 {
  position: relative;
  float: right;
  width: 522px;
}

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

.two-col #body { margin: 0 0 0 0; } /* 228px; } */

#content {
  padding: 0.5em 90px 0.5em 16px;
}

#messagefield {
  height: 100px;
  width: 99.9%;
}

#tpl-content div.gallerythumb {
  height: 155px;
}

li.product-head {
  font-weight: bold;
  list-style-type: none;
}

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

#nav-right { padding: 0.5em; }

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

/* ----- LEFT ----- */
#left {
  display: inline;
  float: left;
  width: 228px;
}

#nav-left { padding: 0em; margin-right: 40px }

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

li.page {
  background-color: #e6efd8;
  display: block;
}

#main-menu li.page strong a:link,
#main-menu li.page strong a:visited
 {
  border-top: 1px dotted;
  margin-top: 8px;
  padding-top: 8px;
}


#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 {
  clear: both;
}
#foot,
#foot.all,
.two-col #foot.left,
.two-col #foot.right {
  margin: -1px 0 0 0; /* This fixes an IE color bleed bug */
  padding: 0 0 8px 0;
}

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

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

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

#nav-foot {
  margin: 0 0 1em 0;
  background: #fff; 
  color: #030; 
  padding: 0 0 4px;
}
#nav-foot A {
  padding: 0 10px  0 10px;
}


#left-nav-contact {
  line-height: 2.2em;
  margin: 1em 0;
  padding: 0 5px;
}

#top-nav {
  top: 0px;
  right: 0px;
  margin-top: -20px;
  padding: 10px;
  position: absolute;
  text-align: center;
  width: 400px;
  z-index: 3;
}