/* ----------- Page Layout ---------- */

html, body { height: 100%; }

body {
  background: #F0F0DE;
}

#pagewrapper {
  background: white;
  position: relative;
  max-width: 1260px;
  margin: 0 auto;
  text-align: left;
  /*
  padding-top: 0px;
  border-left: 2px solid white;
  border-right: 2px solid white;
  */
  /*padding-bottom: 7px;*/
  
  padding: 10px;
}

#pagewrapper b.nw,#pagewrapper b.ne,#pagewrapper b.sw,#pagewrapper b.se,#pagewrapper b.n,#pagewrapper b.s,#pagewrapper b.e,#pagewrapper b.w
{ position: absolute; width: 8px; height: 8px; overflow: hidden; background-repeat: repeat; background-position: 0 0; }
#pagewrapper b.nw { left: 0; top: 0; background-image: url(../img/frame-nw.png); }
#pagewrapper b.ne { right: 0; top: 0; background-image: url(../img/frame-ne.png);}
#pagewrapper b.sw { left: 0; bottom: 0; background-image: url(../img/frame-sw.png); }
#pagewrapper b.se { right: 0; bottom: 0; background-image: url(../img/frame-se.png); }

#pagewrapper b.n { top: 0; left: 8px; right: 8px; width: auto;  background-image: url(../img/frame-n.png);  }
#pagewrapper b.s { bottom: 0; left: 8px; right: 8px; width: auto; background-image: url(../img/frame-s.png); } 
#pagewrapper b.e { right: 0; top: 8px; bottom: 8px; height: auto; background-image: url(../img/frame-e.png); } 
#pagewrapper b.w { left: 0; top: 8px; bottom: 8px; height: auto;  background-image: url(../img/frame-w.png); } 

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

#header {
  clear: both;
}

#maincol {
	display: table;/* <- using display: table hack here for Gecko browsers */
	float: left;
	min-height: 100%;
	width: 100%;
}
	
#wrapper {
  display: table-row; vertical-align: top; /* <- this is needed by Opera */
}

#main {
  border: 1px solid white;
	min-height: 100%;
	margin-left: 18em;
	margin-right: 27em;
}

#col2 {
  float: left; margin-left: -100%; width: 18em; overflow: hidden; 
}

#ads-panel {
  float: right; margin-left: -27em; width: 27em; overflow: hidden;
}

#footer {
  clear: both;
  width: 100%;
  border: 1px solid white;
  text-align: center;
  font-size: 90%;
  border-top: 3px solid #8A8A8A;
}

div.footerbgtrap { background: white; }

#topbar {
  position: absolute;
  left: 0; top: 0; width: 100%; height: 64px;
}

* html #topbar ul     { padding-top: 0.5em; }


/* --------- End Page Layout -------- */

#header {
  height: 195px;
  background: white url(../img/header-repeat.png) repeat-x left bottom;
}

#header .content {
  background: url(../img/header-photo.jpg) no-repeat 100% 79px;
  position: relative;
}

#header b {
  position: absolute;
  right: 0; bottom: 0; height: 131px; width: 509px;
  background: url(../img/header-right.png) no-repeat 0 0;
}

#header .tagline {
  text-indent: -9999px;
  background: url(../img/logo-big.png) no-repeat left bottom;
  height: 195px;
}

#col2 .content { padding: 2px; font-size: 90%; }

#main .content { padding: 0 15px; }

.form-section-title {
  border-bottom: 2px solid #993906;
  clear: both;
}

.highlight { background: yellow; font-weight: bold; }

/* ---------------- Top Bar -------------- */

#topbar form {
  position: absolute;
  left: 0;
  top: 50%;
  top: 1.5em;
  margin-top: -1.5em;
  height: 3em;
  padding-left: 1em;
  line-height: 3em;
  overflow: hidden;
}

#topbar ul {
  display: block;
  position: absolute;
  right: 0;
  top: 0; height: 64px; line-height: 64px;
  padding-right: 16px;
}

#topbar ul li {
  display: inline;
  margin: 2px;
  vertical-align: middle;
}

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

div.factsheet {
  position: relative;
}

.factsheet-pdf-link {
  float: right;
  font-size: 180%;
  margin-top: -1.8em;
  background: url(../img/pdf.gif) no-repeat 100% 50%;
  padding: 0;
  padding-right: 48px;
  min-height: 32px;
  margin-right: 5px;
  line-height: 32px;
}


/* --- */
/* ----------- Ads Bar -------------- */

#ads-panel .content {
  font-size: 80%;
}

#ads-panel .content h2 {
  text-align: right;
  padding-top: 4px;
}

#ads-panel .content p {
  text-align: right;
}

#ads-panel .content * p {
  text-align: left;
}

#ads-panel .listing {
  clear: both;
  border: 1px solid #9999C9;
  margin-bottom: 5px;
  background: #F8F7F1;
  position: relative;
  overflow: auto;
}

#ads-panel .listing .innertube { overflow: auto; }

#ads-panel .listing h3 {
  padding: 8px 8px 0px 8px;
  background: transparent;
}

#ads-panel .listing .blurb {
  color: #006699;
  font-weight: bold;
  overflow: auto;
}

#ads-panel .listing .blurb img {
  float: right;
}

#ads-panel .listing.gold h3 {
  background: #9999C9 url(../img/hash-orange.png) repeat 0% 0%;
  padding: 8px;
  color: white;
  text-align: left;
}

#ads-panel .listing .leftcol {
  display: block;
  float: left;
  width: 55%;
}

#ads-panel .listing .rightcol {
  display: block;
  float: left;
  width: 40%;
}

#ads-panel .listing .address { color: #666666; padding-bottom: 1em; }

#ads-panel .listing dl { padding-bottom: 1em; color: #666666; }
#ads-panel .listing dl dt { display: block; clear: left; width: 3em; float: left; padding-right: 1em; }
#ads-panel .listing dl dd { display: block; float: none; }

#ads-panel .listing li a { display: block; color: blue; text-transform: uppercase; text-decoration: underline; font-weight: bold; }
#ads-panel .listing li { display: block; }

#ads-panel .listing li p { padding-left: 20px; color: #666666; }


#ads-panel .advert {
  clear: both;
  border: 1px solid #006699;
  margin-bottom: 5px;
  background: #F8F7F1;
  position: relative;
  overflow: auto;
}

#ads-panel .advert .innertube { overflow: auto; }

#ads-panel .advert .blurb {
  color: #006699;
  font-weight: bold;
  overflow: auto;
}

#ads-panel .advert .blurb img {
  float: right;
  height: 80px;
}

#ads-panel .advert h3 {
  padding: 8px;
  background: #006699 url(../img/hash-blue.gif) repeat 0% 0%;
  color: white;
  text-align: left;
}

#ads-panel .advert .leftcol {
  display: block;
  float: left;
  width: 55%;
}

#ads-panel .advert .rightcol {
  display: block;
  float: left;
  width: 40%;
}
#ads-panel .advert .address { color: #666666; padding-bottom: 1em; }

#ads-panel .advert dl { padding-bottom: 1em; color: #666666; }
#ads-panel .advert dl dt { display: block; clear: left; width: 3em; float: left; padding-right: 1em; }
#ads-panel .advert dl dd { display: block; float: none; }

#ads-panel .advert li a { display: block; color: blue; text-transform: uppercase; text-decoration: underline; font-weight: bold; }
#ads-panel .advert li { display: block; }

#ads-panel .advert li p { padding-left: 20px; color: #666666; }

/* ----------- Floating Map -------------- */

#region-map {
  float: right;
  width: 300px;
  border: 1px solid #9999C9;
  overflow: auto;
  margin: 0.5em 0.0em 0.5em 0.5em;
  text-align: center;
  background-color: #F8F7F1;
}

#region-map h2 {
  background: #9999C9 url(../img/hash-orange.png) repeat 0% 0%;
  padding: 8px;
  color: white;
  text-align: left;
}

/* ----------- Suppliers Frame -------------- */

#listing {
  /*float: left;*/
  padding: 16px 2px 2px 2px;
}

/*
* > #listing { width: 100%; }
*/

#listing ul.tabs { border-bottom: none; background: white; margin-bottom: 0px; padding-bottom: 0; }
#listing ul.tabs li { background-image: url(../img/tab-right-orange.png) }
#listing ul.tabs li a { background-image: url(../img/tab-left-orange.png); color: white; }

#listing .pane {
  clear: left;
  border: 2px solid #9999C9;
  background: #F8F7F1 url(../img/hash-orange.png) repeat-x 0% 0%;
  padding: 10px 1em 1em 1em;
}

#listing #pane-contact {
  position: relative;

  padding-right: 455px; /* 439+16 */
  min-height: 375px; /* 359+16 */

  padding-right: 316px; /* 300+16 */
  min-height: 261px; /* 245+16 */

}

#listing .pane address {
  font-style: normal;
  font-weight: normal;
  color: #666666;
}

#listing .pane dl {
  margin-top: 1em;
  display: block;
  color: #666666;
}

#listing .pane dt {
  float: left;
  clear: left;
  min-width: 3em;
  display: block;
}

#listing .pane dd {
}

#listing .pane dd:before { content: ': '; }

#listing #pane-contact #logo {
  float: left;
  width: 50%;
}

#listing #pane-contact #address {
  float: left;
  width: 50%;
  font-size: 80%;
  min-height: 80px;
}


#listing #pane-contact #map {
  position: absolute;
  top: 0px;
  right: 0px;
  border: 2px solid #995825;
  width: 300px;
  height: 245px;
}

#listing #map img {
  border: none;
  margin: 0; padding: 0;
  width: 300px;
  height: 245px;
  position: absolute;
}

#listing #pane-contact ul.links { clear: both; display: block; padding-top: 10px; }
#listing #pane-contact ul.links li { display: block; width: 50%; float: left; }


#listing h2 { padding-top: 10px; }

#listing #img-holder {
  float: right;
  width: 300px; height: 200px;
  margin-left: 15px;
  position: relative;
  text-align: right;
}

#listing #img-holder img {
  position: absolute;
  left: 0; top: 0; width: 295px; height: 196px;
}

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

/*
form .row { display:table-row; }
form .label, form .field { display:table-cell; vertical-align: top; padding: 5px; }
*/

/* ------------- CheckBoxLists (js-replaced) ------------ */

.checkboxlist {
  display: block;
  border: 1px solid black;
  max-height: 8em;
  overflow: auto;
}

.checkboxlist a.cb-checkbox {
  display: block;
  width: 40%;
  float: left;
  padding: 2px 2px 2px 20px;
  background: white url(../img/checkbox-unchecked.gif) no-repeat 0% 50%;
  color: black;
  text-decoration: none;
}

.checkboxlist a.cb-checked {
  background-image: url(../img/checkbox-checked.gif);
}

.checkboxlist a.cb-checkbox:hover {
  background-color: #CDE6E6;
}