﻿body {
	border-color: #FF9872;
	background-color: #FF9872;
	color: maroon;
	font-family: Calibri; Brush Script MT;
	font-size: medium;
	margin-top: 5%;
	border-left-width: medium;
	overflow-y: scroll;
}	

header {
  background-color: maroon;
  color: #FF9872;
  font-family:"Brush Script MT";
  font-size:xx-large;
  text-align:center;
  top:0px;
  position:fixed;
  left: 0px;
  height:10%;
  width:100%;
}

footer {
  bottom:0px;
  position:absolute;
  left: 16%;
  height:2em;
  width:100%;
  margin-left:0%;
  position:fixed !important;
}

@font-face { font-family: 'Brush Script MT';
             src: url('brushsci.ttf') format('truetype'); }


#navibereich li {
  display: inline;            /* Listenelemente nebeneinander */
  list-style-type: none;      /* Aufzählungszeichen entfernen */
}

#navibereich {
  background-color: maroon;        /* Hintergrundfarbe für die Navigation */
  padding: 4px 0;                   /* Innenabstand: oben/unten 4px, li/re 0 */
  color: #FF9872;
  margin: 0;                        /* Keinen Außenabstand */
}

#navibereich a {
  color: #FF9872;         
  font-family: Calibri;
  font-size: medium;
  text-decoration: none;         /* Unterstreichung entfernen */ 
  padding: 4px 8px;              /* oben/unten 4px, re/li 8px */
}

#navibereich a:hover {
  background-color: #FF9872;
  color: maroon;
  font-weight:normal;
}

#navibereich a:hover,        /* mit Komma am Ende */
#homeseite #navi01 a,       /* mit Komma am Ende */
#ausstattungseite #navi02 a,       /* mit Komma am Ende */
#galerieseite #navi03 a,       /* mit Komma am Ende */
#lageseite #navi04 a,       /* mit Komma am Ende */
#preiseseite #navi05 a,       /* mit Komma am Ende */
#buchungseite #navi06 a,       /* mit Komma am Ende */
#kontaktseite #navi07 a {    /* ohne Komma am Ende */
  background-color: #FF9872;
  color: maroon;
}

a {
color:maroon;
text-decoration:none;
}
a:visited{
color:maroon;
text-decoration: none;	
}
a:active{
color:maroon;
text-decoration: none;	
}
a:hover{

font-weight:normal;	
}
a:focus{
	color:#CC5200;
text-decoration: none;	
}

.image-container { /* main container. incl all elements */
 padding:0;
 width:844px;
 height:608px;
 float:left;
 margin:0 0 10px 0;
 position:relative;
 border:1px solid #191b1f;
 background:maroon;
 padding:10px;
}

#first-image { /* first image - always in bg */
 position:absolute;
 top:10px;
 left:10px;
 height:380px; width:600px;
 background:url(images/gallery-0x.jpg) 0 0 no-repeat;
}

.image-container a img { /* thumbs 1-4 */
 width:112px;
 height:108px;
 padding:0 10px 40px 0;
 margin:500px 0 0 0;
 border:0;
 float:left;
}

.image-container a img.last { /* thumb 5. I don't use last-child to support ie-users. */
 width:112px;
 height:108px;
 padding:0; /* no right padding for the last thumb */
 margin:500px 0 0 0;
 float:left;
}

.image-container a span { /* hide spans */
 display: none;
}

.image-container a:hover span { /* display span if hovered */
 display: block;
 position: absolute;
 width: 736px;
 height:490px;
 padding:0;
 margin:0;
 top:10px;
 left:10px;
}

/* large images */
a#image1:hover span {background:url(images/gallery-01.jpg);}
a#image2:hover span {background:url(images/gallery-02.jpg);}
a#image3:hover span {background:url(images/gallery-03.jpg);}
a#image4:hover span {background:url(images/gallery-04.jpg);}
a#image5:hover span {background:url(images/gallery-05.jpg);}
a#image6:hover span {background:url(images/gallery-06.jpg);}
a#image7:hover span {background:url(images/gallery-07.jpg);}