/* CSS Document */

/* SEITENAUFBAU --------------------------------------------------------------------------------------------------*/
body {
margin: 0;
padding: 0;
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
background: url(image/hg.gif);
text-align: center;
}

#container{
position: relative;
margin: 1% auto 0 auto;
padding: 0;
width: 992px;
height: 635px;
background: transparent url(image/hg-flora.gif) no-repeat;
}

#start-image {
position: absolute;
top: 60px;
left: 95px;
width: 800px;
height: 546px;
z-index: 10;
}
#page {
position: absolute;
top: 60px;
left: 95px;
width: 800px;
height: 546px;
background: #FFFFFF;
border: 1px solid #555555;
}

#header {
width: 800px;
height: 130px;
}

#navi {
width: 800px;
height: 37px;
background: #FFFFFF;
border-bottom: 1px solid #C2C3C3;
}

#content-image1 {
float: left;
width: 159px;
height: 351px;
background: #FFFFFF;
border-top: 1px solid #555555;
border-right: 1px solid #555555;
}

#content {
float: left;
width: 480px;
height: 351px;
text-align: left;
background: #FFFFFF url(image/hg-content.jpg) top left no-repeat;
border-top: 1px solid #555555;
overflow: hidden;
}

#content-image2 {
float: left;
width: 159px;
height: 351px;
background: #FFFFFF;
border-top: 1px solid #555555;
border-left: 1px solid #555555;
}

#footer {
padding: 5px 0 0 0;
width: 800px;
height: 20px;
color: #444444;
background: #FFF0BF;
border-top: 1px solid #555555;
}

#cleaner {
clear: both;
}


/* NAVIGATION ------------------------------------------------------------------------------------------------ */
/* Main-Navigation ------------------------------------------------------------------------------------------- */
#navi ul {
position: relative;
list-style-type: none;
margin: 0;
padding: 0;
}

#navi ul li {
margin: 0;
padding: 0;
width: 160px;
height: 37px;
display: inline;
overflow: hidden;
}

.bt1 a {
float: left;
background: url(image/bts/bt_home.gif) no-repeat;
}
.bt2 a {
float: left;
background: url(image/bts/bt_aboutus.gif) no-repeat;
}
.bt3 a {
float: left;
background: url(image/bts/bt_wellness.gif) no-repeat;
}
.bt4 a {
float: left;
background: url(image/bts/bt_gallery.gif) no-repeat;
}
.bt5 a{
float: left;
background: url(image/bts/bt_contact.gif) no-repeat;
}

/* Main-Navi-Links --------------------------------------------------------------------------------------------- */
.bt1 a:hover {
background: url(image/bts/bt_home_active.gif) no-repeat;
}

.bt2 a:hover {
background: url(image/bts/bt_aboutus_active.gif) no-repeat;
}

.bt3 a:hover {
background: url(image/bts/bt_wellness_active.gif) no-repeat;
}

.bt4 a:hover {
background: url(image/bts/bt_gallery_active.gif) no-repeat;
}

.bt5 a:hover {
background: url(image/bts/bt_contact_active.gif) no-repeat;
}
/* ---------------------------------------------------------------------------------------------------------------*/
/* SUB-MENUES ----------------------------------------------------------------------------------------------------*/
/* SUB-Menue 1 ---------- */
#submenu1 {
position:absolute;
top: 169px;
left: 162px;
width: 159px;
height: 85px !important;
height: 95px;
background: #fff7df url(image/abschluss-layermenue.gif) bottom left no-repeat;
visibility: hide; 
visibility: hidden;
z-index: 10;
}

ul.subnavi {	
margin: 0px;
padding: 6px 0 0 0;
}
  
ul.subnavi li {
margin: 0 0 2px 0;
padding: 0;
list-style-type: none;
}
  
.ubt1-1 a {
display: block;
width: 159px;
height: 16px;
background: url(image/bts/aboutus-imaginofwellness.gif) no-repeat;
}
.ubt1-2 a {
display: block;
width: 159px;
height: 16px;
background: url(image/bts/aboutus-ourteam.gif) no-repeat;
}
.ubt1-3 a {
display: block;
width: 159px;
height: 16px;
background: url(image/bts/aboutus-businessclients.gif) no-repeat;
}
.ubt1-4 a {
display: block;
width: 159px;
height: 16px;
background: url(image/bts/aboutus-press.gif) no-repeat;
}

/* sub-menue 1 active------------------------------------------- */
.ubt1-1 a:hover, .ubt1-1 a:active {
display: block;
width: 159px;
height: 16px;
background: url(image/bts/aboutus-imaginofwellness_active.gif) no-repeat;
}
.ubt1-2 a:hover, .ubt1-2 a:active {
display: block;
width: 159px;
height: 16px;
background: url(image/bts/aboutus-ourteam_active.gif) no-repeat;
}
.ubt1-3 a:hover, .ubt1-3 a:active {
display: block;
width: 159px;
height: 16px;
background: url(image/bts/aboutus-businessclients_active.gif) no-repeat;
}
.ubt1-4 a:hover, .ubt1-4 a:active {
display: block;
width: 159px;
height: 16px;
background: url(image/bts/aboutus-press_active.gif) no-repeat;
}
/* ---------------------- */
/* SUB-Menue 2 ---------- */
#submenu2 {
position:absolute;
top: 169px;
left: 321px;
width: 159px;
height: 69px !important;
height: 75px;
background: #fff7df url(image/abschluss-layermenue.gif) bottom left no-repeat;
visibility: hide; 
visibility: hidden;
z-index: 10;
}
 
.ubt2-1 a {
display: block;
width: 159px;
height: 16px;
background: url(image/bts/wellness-treatments.gif) no-repeat;
}
.ubt2-2 a {
display: block;
width: 159px;
height: 16px;
background: url(image/bts/wellness-membership.gif) no-repeat;
}
.ubt2-3 a {
display: block;
width: 159px;
height: 16px;
background: url(image/bts/wellness-giftvoucherundpackages.gif) no-repeat;
}

/* sub-menue 2 active------------------------------------------- */
.ubt2-1 a:hover, .ubt2-1 a:active {
display: block;
width: 159px;
height: 16px;
background: url(image/bts/wellness-treatments_active.gif) no-repeat;
}
.ubt2-2 a:hover, .ubt2-2 a:active {
display: block;
width: 159px;
height: 16px;
background: url(image/bts/wellness-membership_active.gif) no-repeat;
}
.ubt2-3 a:hover, .ubt2-3 a:active {
display: block;
width: 159px;
height: 16px;
background: url(image/bts/wellness-giftvoucherundpackages_active.gif) no-repeat;
}

/* ---------------------- */
/* SUB-SUB-SUB-Navi Treatments -------------------------------------------------------------------*/
#subsbunavi-treatments {
margin: 0px 30px 0px 30px;
padding: 5px 0 5px 0;
font: Arial, Helvetica, sans-serif;
font-size: 11px;
color: #B5B5B5;
text-align: center;
/*border-bottom: 1px solid #CCCCCC;*/
background-color: #EEEEEE;
}
#subsbunavi-treatments ul {
position: relative;
list-style-type: none;
margin: 0;
padding: 0;
}

#subsbunavi-treatments ul li{
margin: 0;
padding: 0;
display: inline;
}

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

/* Links ALLGEMEIN -------------------------------------*/
a {
text-decoration: none;
color: #666666;
}
a:hover, a:focus, a:active {
text-decoration: none;
color: #FFC300;
}

/* SCROLLINGLAYERS AND SCROLLBARS ---------------------------------------------------------------------------------*/
/* CONTENT-ANPASSUNG (Balken-Abdeckung) -----------------------------------------------*/
#abdeckung_o {
position: absolute;
top: 169px;
left: 160px;
width: 466px;
height: 25px;
background: url(image/abdeckung_o.gif) no-repeat;
z-index: 2;
}
#abdeckung_u {
position: absolute;
top: 495px;
left: 160px;
width: 466px;
height: 25px;
background-color: #FFFFFF;
z-index: 2;
}
/* ------------------------------------------------------------------------------------*/

#content_holder { 
position: relative;
margin: 0;
padding: 0;
width: 466px; 
height: 351px; 
clip: rect(0, 480px, 351px, 0); 
overflow: hidden; 
z-index: 1;
}

#content_input {
width: 466px;
padding: 25px 0 25px 0;
}

div.content {
position: relative; 
visibility: hidden; 
z-index:1;
}

#scrollbar { 
position: absolute;
top: 170px;
left: 625px;
visibility: hidden;
width: 13px; 
height: 349px; 
font-size: 1px; 
z-index: 2;
}

#track { 
position: absolute; 
left: 1px; 
top: 12px;
margin: 0;
padding: 0;
width: 11px; 
height: 325px;
z-index: 1;
background-color: #FFFFFF;
border: 1px solid #ffe17f;
}

#dragBar {
position: absolute; 
left: 0px; 
top: 0px;
width: 11px; 
height: 1px;
background-color: #FFF0BF;
z-index: 1;
}  
#up { 
position: absolute; 
left: 1px; 
top: 0; 
z-index:2;
}  
#down {
position: absolute;
left: 1px; 
bottom: 0; 
z-index: 3;
}
/* ----------------------------------------------------------------------------------------------------------------*/


/* FONT-FORMATING -------------------------------------------------------------------------------------------------*/
h1 {
margin: 0px 30px 0px 30px;
padding:0 0 10px 0;
font: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #222222;
}
h2 {
margin: 0px 30px 0px 30px;
padding:0 0 3px 0;
font: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #222222;
font-weight: normal;
}

h3 {
margin: 0;
padding:0 0 10px 0;
font: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #222222;
}
h4 {
margin: 0;
padding:0 0 3px 0;
font: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #222222;
font-weight: normal;
}

.txtformat {
margin: 0px 30px 0px 30px;
padding: 0;
font: Arial, Helvetica, sans-serif;
font-size: 11px;
color: #666666;
}

.txtlist{
margin: 0;
padding: 0 30px 0 45px;
font: Arial, Helvetica, sans-serif;
font-size: 11px;
color: #666666;
}

ul.pdflist {
margin: 0;
padding: 0 30px 0 30px;
list-style-type: none;
font: Arial, Helvetica, sans-serif;
font-size: 11px;
color: #666666;
}

.price {
margin: 0px 30px 0px 30px;
padding: 0;
font: Arial, Helvetica, sans-serif;
font-size: 11px;
color: #FFC300;
}
/* ----------------------------------------------------------------------------------------------------------------*/

/* -- INDEX - START ----------------------------------------------------------------------------------------------------- */
table.index {
margin: 5px 30px 5px 31px;
padding: 0;
width: 405px;
font: Arial, Helvetica, sans-serif;
font-size: 11px;
color: #666666;
}
table.index tr {
text-align: left;
vertical-align: bottom;
}
table.index td.image_a {
width: 80px;
padding: 3px 0 0 0;
}
/* ----------------------------------------------------------------------------------------------------------------*/

/* -- GALLERY ----------------------------------------------------------------------------------------------------- */
.thumbnail {
float: left;
margin: 0;
padding: 4px 0 0 4px;
width: 131px;
height: 109px;
background: transparent url(image/hg-thumbnail.gif) no-repeat;
}

.thumbnails-gallery {
position: relative;
margin: 0px 30px 0px 30px;
padding: 0; 
}

/* TREATMENTS -----------------------------------------------------------------------------------------------------*/
.link-treatments {
margin: 0 30px 5px 31px;
padding: 0;
text-align: right;
}

.link-treatments a {
font: Arial, Helvetica, sans-serif;
font-size: 11px;
color: #222222;
}
.link-treatments a:hover, .link-treatments a:active {
font-size: 11px;
color: #FFC300;
}

table.treatments {
margin: 0 30px 5px 31px;
padding: 0;
width: 405px;
font: Arial, Helvetica, sans-serif;
font-size: 11px;
color: #666666;
}
table.treatments tr {
text-align: left;
vertical-align: top;
}
table.treatments td.cell-1 {
width: 95px;
}
table.treatments td.image {
padding: 3px 0 5px 0;
width: 95px;
text-align: right;
}

.txtformat-treatments {
margin: 0px 30px 0px 30px;
padding: 0 0 10px 0;
font: Arial, Helvetica, sans-serif;
font-size: 11px;
color: #666666;
border-bottom: 1px solid #B5B5B5;
}