body {
  text-align: center;
  background: #AAE4EB url(page-bg.gif);
  font-size: 75%;
  font-family: Verdana, Tahoma, sans-serif;
}

#page {
  text-align: left;
  width: 811px; /* external width */
  margin: 0 auto;
}

#masthead {
  background: url(header-bg.gif) 50% 0% no-repeat;
  height: 248px;
  position: relative;
}

#content {
  background: url(content-bg.gif) 50% 0% repeat-y;
  padding: 0px 12px 4px 7px;
}

#footer {
  background: url(footer-bg.gif) 50% 0% no-repeat;
  height: 65px; /* external width: 65px; */
  position: relative;
  /*padding: 0px 12px 0px 7px;*/
}

#content h1 {
  padding: 0px;
  margin: 0px;
  height: 108px;
  background: url(banner.jpg) 0% 0% no-repeat;
  text-indent: -90000px;
  border-top: 1px solid white;
}

/* Change header images here
   -------------------------
   (uncomment and adjust filename if necessary)
   */

#spas     #content h1 { background-image: url(banner-spas.jpg)   ; } 
#saunas   #content h1 { background-image: url(banner-saunas.jpg) ; } 
#pools    #content h1 { background-image: url(banner-pools.jpg)  ; } 
#testi    #content h1 { background-image: url(banner-testi.jpg)  ; }
#install  #content h1 { background-image: url(banner-install.jpg); } 
#access   #content h1 { background-image: url(banner-access.jpg) ; } 
#contact  #content h1 { background-image: url(banner-contact.jpg) ; } 


#content .innercontent {
  padding: 0px 3px;
  font-size: 90%;
  text-align: justify;
  
}

#masthead a#logo {
  position: absolute;
  display: block;
  left: 29px;
  top: 47px;
  width: 254px;
  height: 109px;
  background: url(logo.gif);
  text-indent: -90000px;
  overflow: hidden;
}

#masthead ul#mainmenu {
  list-style: none;
  display: block;
  padding: 0px;
  margin: 0px;
  position: absolute;
  left: 7px;
  top: 181px;
  height: 67px;
}

#masthead ul#mainmenu li {
  list-style: none;
  display: block;
  margin: 0px;
  padding: 0px;
  float: left;
  position: relative;
  height: 67px;
  overflow: hidden;
}

#masthead ul#mainmenu li a {
  display: block;
  position: absolute;
  width: 100%;
  height: 30px;
  left: 0px;
  top: 37px;
  color: white;
  background: yellow;
  text-indent: -90000px;
}

#masthead ul#mainmenu li.spas    { width:  48px; background: url(menu-spas-bg.gif)    0% 0% no-repeat; }
#masthead ul#mainmenu li.saunas  { width:  53px; background: url(menu-saunas-bg.gif)  0% 0% no-repeat; }
#masthead ul#mainmenu li.pools   { width: 106px; background: url(menu-pools-bg.gif)   0% 0% no-repeat; }
#masthead ul#mainmenu li.testi   { width:  86px; background: url(menu-testi-bg.gif)   0% 0% no-repeat; }
#masthead ul#mainmenu li.install { width: 135px; background: url(menu-install-bg.gif) 0% 0% no-repeat; }
#masthead ul#mainmenu li.access  { width:  88px; background: url(menu-access-bg.gif)  0% 0% no-repeat; }
#masthead ul#mainmenu li.contact { width:  88px; background: url(menu-contact-bg.gif) 0% 0% no-repeat; }


#masthead ul#mainmenu li.spas    a { background: url(menu-spas-fg.gif)    0% 0% no-repeat; }
#masthead ul#mainmenu li.saunas  a { background: url(menu-saunas-fg.gif)  0% 0% no-repeat; }
#masthead ul#mainmenu li.pools   a { background: url(menu-pools-fg.gif)   0% 0% no-repeat; }
#masthead ul#mainmenu li.testi   a { background: url(menu-testi-fg.gif)   0% 0% no-repeat; }
#masthead ul#mainmenu li.install a { background: url(menu-install-fg.gif) 0% 0% no-repeat; }
#masthead ul#mainmenu li.access  a { background: url(menu-access-fg.gif)  0% 0% no-repeat; }
#masthead ul#mainmenu li.contact a { background: url(menu-contact-fg.gif) 0% 0% no-repeat; }

#masthead ul#mainmenu li a:hover { background-position: 0px 30px; }

#spas    #masthead ul#mainmenu li.spas    a,
#saunas  #masthead ul#mainmenu li.saunas  a,
#pools   #masthead ul#mainmenu li.pools   a,
#testi   #masthead ul#mainmenu li.testi   a,
#install #masthead ul#mainmenu li.install a,
#access  #masthead ul#mainmenu li.access  a,  
#contact #masthead ul#mainmenu li.contact  a {

  background-position: 0px 30px;
}


div.layout3col {
  background: white url(pane-bg.gif) repeat-x;
  clear: both;
  position: relative;
}

* html div.layout3col { height: 1%; }

div.layout3col div.pane {
  float: left;
  width: 32.9%;
  padding: 0px 0px 20px 0px;
  /*border: 1px solid red;*/
}

div.layout3col div.pane a.moreinfo {
  font-size: 80%;
  position: absolute;
  margin-left: 35px;
  bottom: 145px;
}

#page #content div.layout3col div.pane h2 {
  margin: 20px 48px 2px 35px;
  padding: 0px;
  position: relative;
  overflow: hidden;
  height: 21px;
  border: none;
  background: transparent;
}

div.layout3col div.pane h2 span {
  position: absolute;
  left: 0%;
  top: 0%;
  width: 100%;
  height: 100%;
}

div.layout3col div.spas   h2 span { background: url(panetitle-spas.gif); }
div.layout3col div.saunas h2 span { background: url(panetitle-saunas.gif); }
div.layout3col div.pools  h2 span { background: url(panetitle-pools.gif); }

div.layout3col div.pane p {
  margin: 10px 48px 2px 35px;
  padding: 0px;
  color: #003366;
  text-align: justify;
  font-size: 80%;
}

div.layout3col div.pane div.imageholder {
  text-align: center;
  padding: 2px 48px 2px 35px;
}

div.layout3col div.pane img {
  width: 178px;
  height: 118px;
  border: none;
}


.clearing { clear: both; }

#footer {
  font-size: 80%;
  padding-left: 10px;
}

#footer ul {
  list-style: none;
  display: block;
  text-align: center;
  position: absolute;
  left: 0px;
  bottom: 13px;
  margin: 0px;
  padding: 0px;
  width: 100%;
}

#footer li {
  list-style: none;
  display: inline;
  padding: 0ex 1ex 0ex 1ex;
  text-transform: uppercase;
}

#footer li a:link, #footer li a:visited {
  color: white;
  text-decoration: none;
}

#footer li a:hover, #footer li a:active {
  color: white;
  text-decoration: underline overline;
}

#content h2 {
  font-size: 130%;
  color: #003366;
  font-weight: bold;
  border-bottom: 2px solid #003366;
  /*border-top: 2px solid #f4d405;*/
  background: white url(h2-bg.gif) repeat-y 0% 0%;
  padding: 3px;
  margin-top: 3px;
  margin-left: -3px;
  clear: both;
}

#content h3 {
  clear: both;
  font-size: 110%;
  font-weight: bold;
  text-transform: uppercase;
  margin-bottom: 0px;
}

#content p {
}

ul.imagelist {
  margin: 0; padding: 0; list-style: none;
}

ul.imagelist li {
  float: left;
  width: 200px;
  height: 220px;
  margin: 5px 5px 5px 0px;
  position: relative;
}

ul.imagelist li span {
  position: absolute;
  display: block;
  left: 0%; width: 100%;
  bottom: 0; height: 20px;
  text-align: center;
  font-style: italic;
}

.imageholder {
  text-align: center;
}

.imagerotater {
  position: relative;
  width: 390px;
  height: 293px;
  overflow: hidden;
  float: left;
}

.imagerotater img {
  position: absolute;
  left: 0; top: 0; width: 390px; height: 293px;
}

div.layout2col {
  background: white;
  clear: both;
  position: relative;
}

* html div.layout2col { height: 1%; }

div.layout2col .pane {
  float: left;
  width: 49.5%;
}

div.layout2col .pane-right { float: right; }

#contact address {
  float: left;
  width: 49.5%;
  margin-top: 10px;
  margin-bottom: 10px;
  font-weight: bold;
  line-height: 150%;
  font-style: normal;
  font-size: 120%;
}

#contact dl {
  margin-top: 10px;
  width: 49.5%;
  float: right;
  margin-top: 10px;
  margin-bottom: 10px;
  line-height: 150%;
  font-size: 120%;
}

#contact dt { height: 2em; line-height: 2em; font-weight: bold; width: 7em;  }

#contact dd { height: 2em; line-height: 2em; margin-top: -2em; margin-left: 7em; }

form {
}

form input.text, form textarea {
  font-family: Verdana, Tahoma, sans-serif;
  font-size: 100%;
  width: 100%;
}

form div.leftside {
  width: 48.5%; float: left; 
}

form div.rightside {
  width: 48.5%; float: right; 
}

#contact div.rightside {
}

form .row {
}

form .label {
  height: 2em;
  line-height: 2em;
  font-weight: bold;
}

form .field {
}

form .buttonholder {
  padding-top: 1em;
  clear: both;
  text-align: center;
}

#access .listholder {
  float: left;
  width: 49.5%;
}

* html #access .listholder { height: 1%; }

#access .listholder ul {
  padding-right: 1em;
  line-height: 120%;
  font-size: 120%;
}

#access .listholder ul li { padding-top: 0.5em; padding-bottom: 0.5em; }

#access .examples {
  float: right;
  width: 49.5%;
}

#access .examples h3 {
  margin: 0px 5px 5px 0px;
}

#access .examples img {
  width: 390px;
  height: 293px;
  margin-right: 5px;
}


#company_reg {
  text-align: center;
  font-size: 80%;
}