/**
* @author  Joachim  Eberhardt
* @copyright Copyright 2008  Agentur Lernsite - Joachim  Eberhardt
* @version 1.0 02.09.08
* @package Layout www.baltrum-kluender.de
*
*/

* {
margin:  0;
padding: 0;
}


body {
	font-family: verdana, arial, sans-serif;
	background-image:url('../images/hg-4.jpg');
	background-repeat:repeat-x;
	background-color: #f5f6f1;
}

 
div#container {
	position: absolute;
	margin: 0 auto 0 0;
	width: 988px;
	min-height: 100%;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}

img.preload {
 display: none;
 visibility:hidden;
}
   
/* ************************************************************************************ */
/* NAVIGATION - OBERE LEISTE                                                            */
/* ************************************************************************************ */
div#container ul#navigationOben {
 position: absolute;
 margin: 145px auto 0 auto; 
 padding:     0;
 list-style-type:         none;
 z-index: 10;
 }


div#container ul#navigationOben li {
 display: line;
 float: left;
 color: #000000;
 white-space: nowrap;
 list-style-type: none;
 width:    76px;
 height:   18px;
}

div#container ul#navigationOben li a {
 display: block;
 text-decoration: none;
 width:    76px;
 height:   18px;
 }

div#container ul#navigationOben .hidden {
 display:      none;
 visibility: hidden;
}
 
div#container ul#navigationOben li#haus a {
 width:    76px;
 height:   18px;
 background-image:url('../images/haus_normal.gif');
}

div#container ul#navigationOben li#haus a:hover {
background-image:url('../images/haus_mouseover.gif');
}
div#container ul#navigationOben li#haus a:active {
background-image:url('../images/haus_active.gif');
}


div#container ul#navigationOben li#wohnungen a {
 width:    76px;
 height:   18px;
 background-image:url('../images/wohnungen_normal.gif');
}

div#container ul#navigationOben li#wohnungen a:hover {
background-image:url('../images/wohnungen_mouseover.gif');
}
div#container ul#navigationOben li#wohnungen a:active {
background-image:url('../images/wohnungen_active.gif');
}

div#container ul#navigationOben li#preise a {
 width:    76px;
 height:   18px;
 background-image:url('../images/preise_normal.gif');
}

div#container ul#navigationOben li#preise a:hover {
background-image:url('../images/preise_mouseover.gif');
}
div#container ul#navigationOben li#preise a:active {
background-image:url('../images/preise_active.gif');
}
 
 
div#container ul#navigationOben li#kontakt a {
 width:    76px;
 height:   18px;
 background-image:url('../images/kontakt_normal.gif');
}

div#container ul#navigationOben li#kontakt a:hover {
background-image:url('../images/kontakt_mouseover.gif');
}
div#container ul#navigationOben li#kontakt a:active {
background-image:url('../images/kontakt_active.gif');
}


div#container ul#navigationOben li#baltrum a {
 width:    76px;
 height:   18px;
 background-image:url('../images/baltrum_normal.gif');
}

div#container ul#navigationOben li#baltrum a:hover {
background-image:url('../images/baltrum_mouseover.gif');
}
div#container ul#navigationOben li#baltrum a:active {
background-image:url('../images/baltrum_active.gif');
}


div#container ul#navigationOben li#impressum a {
 width:    76px;
 height:   18px;
 background-image:url('../images/impressum_normal.gif');
}

div#container ul#navigationOben li#impressum a:hover {
background-image:url('../images/impressum_mouseover.gif');
}
div#container ul#navigationOben li#impressum a:active {
background-image:url('../images/impressum_active.gif');
}

div#container ul#navigationOben li.navi_orange {
background-image:url('../images/orange_balken.gif');

}

div#container ul#navigationOben li.navi_weiss {
background-image:url('../images/weiss_balken.gif');
}



/* ************************************************************************************ */
/* CONTENT                                                                              */
/* ************************************************************************************ */
div#container div#content {
	position:     absolute;
	margin-top:      165px;
	margin-left:     153px;
	width:          45.3em;
}



div#container div#content div#headline {
 display: none;
 visibility:hidden;
 }

div#container div#content div.abschnitt {
padding-top:    0.8em;
padding-bottom: 0.1em;
clear: both;
}
 
div#container div#content div.abschnitt div.text {
 float: right;
 width: 22.8em;
 /*width: 18em;*/
 font-size: 1.1em;
} 
 


div#container div#content div.abschnitt div.text  h2 {
 font-size:   1.0em;
 font-weight: normal;
 padding-bottom: 0.7em;
}
div#container div#content div.abschnitt div.text  p {
padding-bottom: 0.4em;
/*padding-bottom: 0.7em;*/
}

div#container div#content div.abschnitt div.text p img {
border: 0;
}

/* button email */
div#container div#content div.abschnitt div.text p#email a {
display:block;
text-decoration: none;
background-image:url('../images/email_normal.gif');
width:76px;
height:18px
 }
 
div#container div#content div.abschnitt div.text p#email a:hover {
background-image:url('../images/email_mouseover.gif');
}

div#container div#content div.abschnitt div.text p#email a:focus {
background-image:url('../images/email_mouseover.gif');
}
div#container div#content div.abschnitt div.text p#email a:active  {
background-image:url('../images/email_active.gif');
}

/* button freieZeiten */
div#container div#content div.abschnitt div.text p#freieZeiten a {
display:block;
text-decoration: none;
background-image:url('../images/freieZeiten_normal.gif');
width:76px;
height:18px
 }
 
div#container div#content div.abschnitt div.text p#freieZeiten a:hover {
background-image:url('../images/freieZeiten_mouseover.gif');
}

div#container div#content div.abschnitt div.text p#freieZeiten a:focus {
background-image:url('../images/efreieZeiten_mouseover.gif');
}
div#container div#content div.abschnitt div.text p#freieZeiten a:active  {
background-image:url('../images/freieZeiten_active.gif');
}

div#container div#content div.abschnitt div.image {

} 

div#container div#content div.abschnitt div.image div#image_index_1  {
width: 230px;
height: 140px;
 background-image:url('../images/upstalsboom_haus.jpg');
}

div#container div#content div.abschnitt div.image div#image_index_1:hover {
 background-image:url('../images/detail.jpg');
}

div#container div#content div.abschnitt div.image div#image_index_2  {
 width: 230px;
 height: 140px;
 background-image:url('../images/familie_auf_terrasse.jpg');
}

div#container div#content div.abschnitt div.image div#image_index_2:hover {
 background-image:url('../images/kids1.jpg');
}

div#container div#content div.abschnitt div.image div#image_index_3  {
 width: 230px;
 height: 140px;
 background-image:url('../images/wohnzimmer_mit_kamin.jpg');
}

div#container div#content div.abschnitt div.image div#image_index_3:hover {
 background-image:url('../images/ess.jpg');
}

div#container div#content div.abschnitt div.image div#image_index_4  {
 width: 230px;
 height: 140px;
 background-image:url('../images/schlafzimmer_eltern.jpg');
}

div#container div#content div.abschnitt div.image div#image_index_4:hover {
 background-image:url('../images/kinderzimmer.jpg');
}

div#container div#content div.abschnitt div.image div#image_index_5  {
 width: 230px;
 height: 300px;
 background-image:url('../images/kueche.jpg');
}

div#container div#content div.abschnitt div.image div#image_index_5:hover {
 background-image:url('../images/bad.jpg');
}

div#container div#content div.abschnitt div.image div#image_index_10  {
 width: 230px;
 height: 156px;
 background-image:url('../images/strand.jpg');
}

div#container div#content div.abschnitt div.image div#image_index_10:hover {
 background-image:url('../images/hund.jpg');
}


div#container div#content div.abschnitt div.clear {
 clear: both;
 }
 
div#container div#content div#bilderspalte {
margin: 0;
width: 230px;
	
}

div#container div#content div#bilderspalte img {
 margin-top: 1.0em;
 }

div#container div#content div#textspalte {
 margin: 0;
 width: 30em;
 float: right;	
 font-size: 0.8em;
}
div#container div#content div#textspalte h2 {
 font-size:   1.0em;
 font-weight: normal;
}
div#container div#content div#textspalte p {
padding-top: 1.0em;
}



div#container div#content div#Upstalsboom-Flyer {
position: absolute;
margin-top: -30.5em; 
margin-left: 48em;
/*
margin-top: -7.5em; 
margin-left: 42em;
*/
z-index: 20;
}
div#container div#content div#Upstalsboom-Flyer img {
 border: 0;
}


/* ************************************************************************************ */
/* LAYOUT                                                                               */
/* ************************************************************************************ */

div#container div#layout {
	position: absolute;
	margin: 0 auto 0 0;
	width: 66.8em;
}
                 
div#container div#layout div#titelbild {
 	position: absolute;
 top: 0;
 left: 20px;
 width:   800px;
 height:  138px;
}

div#container div#layout div#rotweisslinie {
 position: relative;
 top:      30px;
 left: 0;
 width:  990px;
 height:  18px; 
}
