/*  =========================================================
Datei: basic-css.css
Media: screen, projection 

Datum: 20. März 2007
                                   
1. Allgemeine Selektoren 
   - Block-Elemente
   - Inline-Elemente
   - Allgemeine Klassen
   - Non-Layout IDs  
                              
2. Layoutbereiche 
   - Wrapper 
   - Kopfbereich   
   - Navibereich   
   - Textbereich   
   - Fussbereich   

3. Spezielle Seiten 
   - Kontaktformular 

========================================================== */

/* ===============================

   =1. Allgemeine Selektoren

=============================== */

* { /* Kalibirierung von Abständen, Little Boxes, S. 76 */
  padding: 0; 
  margin: 0; 
}

html { /* In Firefox Rollbalken erzwingen, Little Boxes S. 77 */
  height: 101%; 
}

body {
	color: white;
	font-family: "Geneva", Arial, Helvetica, sans-serif;
	font-size: 100%;
	background-color: #F3EFBF;
	background-image: url(../img/site/back.gif);
	background-repeat: repeat-x;
}
/* ===============================
   =Block-Elemente 
=============================== */

h1 { 
  font-size: 150%; 
}

h2 {
  font-size: 130%;
  margin-bottom: 1em;
}

p, 
ul, 
ol {
	font-size: 0.75em; 
	line-height:1.4em;
}

ul ul { 
  margin: 0; 
}

li {
  margin-top: 0 ;
  margin-right: 0;
  margin-bottom: 0;
  margin-left: 1em;
}


/* ===============================
   =Inline-Elemente 
=============================== */
strong {
  color: #1a3406;
}

a { 
  text-decoration: none; 
}

a:link { 
  color: #d90000; 
}

a:visited { 
  color: #c66; 
}

a:hover, a:focus { 
  text-decoration: underline; 
}

a:active { 
  color: #fff; 
}

a.skiplink { 
  display: none; 
}

/* ===============================
   =Classes allgemeiner Art 
=============================== */
.clear {clear:both;}
/* ===============================
   =runde ecken 
=============================== */
.box { width: 15em; background: #9BD1FA;}
.box h1, .box p {margin: 0 10px;}
.box h1 {font-size:150%; color:#ffffff; }
.box .top, .box .bottom{display:block;background: #dddddd;}
.box .top b, .box .bottom b { display:block;height: 1px; overflow: hidden; background: #9BD1FA;}
.box .r1{margin: 0 5px;}
.box .r2{margin: 0 3px;}
.box .r3{margin: 0 2px;}
.box .top .r4, .box .bottom .r4{margin: 0 1px;height: 2px;}


/* ========================================

  =2. LAYOUTBEREICHE

========================================= */ 
#wrapper {
	background-color: #FFFFFF;
	width: 830px;
	margin: 0px auto;
	border-right: 1px solid #c0bb61;
	border-left: 1px solid #c0bb61;
}
#innertube {
	margin:0 7px;
	width:816px;
}
/* ===============================
   =KOPFBEREICH
=============================== */
#kopfbereich {
	position: relative;
	color: black;
	background-image: url(../img/site/kopf.jpg);
	background-repeat: no-repeat;
	height: 138px;
	width: 816px;
	margin:0 0 7px 0;
}

    
/* ===============================
   =NAVIBEREICH
=============================== */
#navibereich {
	float:left;
}
#navibereich .kopf {
	background-image: url(../img/site/logo2.gif);
	background-repeat: no-repeat;
	height: 139px;
	width: 302px;
	margin-top: 6px;
}
#nav {
}
#nav li {
	list-style: none;
}
#nav li, #nav a {
	display: block;
	height: 151px;
	float: left;
	width: 151px;
	margin: 0;
}
#nav1 a, #nav1 a:link {
	background-image:  url(../img/navi/vogelkoje_p.png);
	background-repeat: no-repeat;
}
#nav2 a, #nav2 a:link {
	background-image:  url(../img/navi/restaurant_p.png);
	background-repeat: no-repeat;
}
#nav3 a, #nav3 a:link {
	background-image:  url(../img/navi/galerie_p.png);
	background-repeat: no-repeat;
}
#nav4 a, #nav4 a:link {
	background-image:  url(../img/navi/links_p.png);
	background-repeat: no-repeat;
}
#nav1 a:hover { background: transparent url(../img/navi/vogelkoje_hi.png) no-repeat;}
#nav2 a:hover {background: transparent url(../img/navi/restaurant_hi.png) no-repeat;}
#nav3 a:hover { background: transparent url(../img/navi/galerie_hi.png) no-repeat;}
#nav4 a:hover { background: transparent url(../img/navi/links_hi.png) no-repeat;}

#aktiv1 { background: transparent url(../img/navi/vogelkoje_hi.png) no-repeat;}
#aktiv2 { background: transparent url(../img/navi/restaurant_hi.png) no-repeat;}
#aktiv3 { background: transparent url(../img/navi/galerie_hi.png) no-repeat;}
#aktiv4 { background: transparent url(../img/navi/links_hi.png) no-repeat;}
/* ========================================== */
#subnavi {
	height: 26px;
}
#subnavi ul {
	list-style:none;
}
#subnavi li, #subnavi a {
	float:left;
	display: block;
	height: 26px;
	margin:0 0 1px 0;
}

#sub0 a:link {	
	background-color: #d9a726;
	width:56px;
}
#sub1 a:link {
	width: 152px;
	background-image: url(../img/navi/karte_p.gif);
	background-repeat: no-repeat;
}
#sub2 a:link {
	width: 152px;
	background-image: url(../img/navi/feste_p.gif);
	background-repeat: no-repeat;
}
#sub3 a:link {
	width: 152px;
	background-image: url(../img/navi/oz_p.gif);
	background-repeat: no-repeat;
}
#sub1 a:hover {
	width: 152px;
	background-image: url(../img/navi/karte_hi.gif);
	background-repeat: no-repeat;
}
#sub2 a:hover {
	width: 152px;
	background-image: url(../img/navi/feste_hi.gif);
	background-repeat: no-repeat;
}
#sub3 a:hover {
	width: 152px;
	background-image: url(../img/navi/oz_hi.gif);
	background-repeat: no-repeat;
}

/* ==========================================
Flyout mit ie hack
======================================== */
.container {
	width:512px; 
	background:#fff; 
	margin:0;  
}
.menu {
	width:512px;
	height:27px;
	margin:0;
	text-align:center;
	text-transform: uppercase;
}
.menu ul {padding:0; margin:0;list-style-type: none;}
.menu ul li {
	float:left; 
	position:relative;
	margin:0;
}
.menu ul li a, .menu ul li a:visited {
	display:block; 
	text-decoration:none; 
	color:#bdda96; 
	width:152px;
	height:27px; 
	background:transparent url(../img/navi/sub-back_p.gif) no-repeat; 
	float:left;
	padding-top:5px;
}

.menu ul li ul {display: none;font-size:0.9em; }

/* specific to non IE browsers */
.menu ul li:hover a {
	color:#fff; 
	background:transparent url(../img/navi/sub-back_hi.gif) no-repeat; 
}
.menu ul li #activemenu {
	color:#fff; 
	background:transparent url(../img/navi/sub-back_p.gif) no-repeat; 
}
.menu ul li:hover #activemenu {
	color:#fff; 
	background:transparent url(../img/navi/sub-back_hi.gif) no-repeat; 
}
.menu ul li:hover ul {
	display:block; 
	position:absolute; 
	bottom:32px;
	bottom:*31px;
	right:0px; 
	width:150px; 
}
*+html .menu ul li:hover ul {
	height:20px;
}

.menu ul li:hover ul li {float:left;}
.menu ul li:hover ul li a {
	display:block;
	background:transparent url(../img/site/opaque.png) repeat;
	color:#243b08;
	width:150px;
	float:left;
	height: 19px;
	margin-top: 2px;
	padding-top:3px;
}
*+html .menu ul li:hover ul li a {
	border-top: 2px solid #ffffff;
	margin-top: 0;
}
.menu ul li:hover ul li a:hover {background:#688630; color:#FFFFFF;}
.menu ul li .spacer {
	display:block;
	width:56px;
	background-color:#FF9900;
	height:25px;
	float:left;
}
/* ==========================================
Navigation speisekarte
======================================== */
#speisenav {
	clear:both;
	height:25px;
	border-top:3px #FFFFFF solid;
	width:420px;
	text-align:left;
}
#speisenav .square a {
	color:#688630;
	float:left;
	background-color:#FFFFFF;
	padding: 0 16px 2px 17px;
	margin:-22px 0 0 351px;
	text-decoration:underline;
}
#speisenav .square a:hover {
	color: #1a3406;
}
#speisenav .square-2 a {
	color:#688630;
	float:left;
	background-color:#FFFFFF;
	padding: 0 16px 2px 17px;
	text-decoration:underline;
}
#speisenav .square-2 a:hover {
	color: #1a3406;
}
/* ===============================
   =TEXTBEREICH 
=============================== */
#homefla {
	float:left;
	height: 304px;
	width: 514px;
}    
#homeunten {
	clear:both;
	width:816px;
	height:195px;
}
#hometxt {
	color:#1a3406;
	float:left;
	width:494px;
	padding:20px 0 20px 20px;
	background-image: url(../img/site/homehintentxt.gif);
	background-repeat: no-repeat;
	height: 92px;
} 
#homekontakt {
	float:left;
	color: #1a3406;
	width: 294px;
	margin:75px 0 0 7px;
}
#homekontakt p {
	font-size:0.7em;
	float:left;
	line-height:1.5em;
	margin:10px 0;
}
#homekontakt p a {
	color: #1a3406;
}
#homekontakt p a:hover {
	color:#000000;
	text-decoration:underline;
}
/* ===============================*/
#bild {
	float:left;
	height: 261px;
	margin:7px 0 1px 0;
	width: 512px;
}

#contentlinks {
	float:left;
	width:512px;
	border-right: 2px solid #FFFFFF;
}
#contentlinks .contenttxt {
	background-color:#d9e9b5;
	color:#1a3406;
	float:left;
	width:512px;
	height:540px;
	margin-top:-4px;
}
* html #contentlinks .contenttxt {
	width:412px;
}
#contentlinks a:link, #contentlinks  a:visited {
	color:#6b8c40;
	text-decoration:none;
}
#contentlinks a:hover {
	color:#243b08;
	text-decoration:none;
}
#contentlinks .contenttxt2 {
	background-color:#d9e9b5;
	color:#1a3406;
	float:left;
	width:512px;
	height:1420px;
	margin-top:-4px;
}
* html #contentlinks .contenttxt2 {
	width:412px;
}
#contentlinks .quadrat {
	background-color:#FFFFFF;
	float:left;
	display:block;
	height:58px;
	width:58px;
	margin-right:10px;
}
#contentlinks h1 {
	font-size:1.2em;
	float:left;
	color:#243b08;
	font-weight: normal;
	text-transform: uppercase;
	font-family: "Geneva", Arial, Helvetica, sans-serif;
	margin-top:30px;
	border-bottom:2px solid #243b08;
	width:420px;
}
#contentlinks .contenttxt p {
	margin:20px 20px 0 68px;
	padding-top:20px;
}
#contenrechts {
	float:left;
	width:294px;
}
#contenrechts .kontakt {
	color: #1a3406;
	width: 294px;
	margin:0 0 0 7px;
}
#contenrechts .kontakt p {
	font-size:0.7em;
	float:left;
	line-height:1.5em;
	margin:10px 0;
}
#contenrechts .kontakt p a {
	color: #1a3406;
}
#contenrechts .kontakt p a:hover {
	color:#000000;
	text-decoration:underline;
}

/* ===============================
   =FUSSBEREICH 
=============================== */
#footer {
}
/* Inset 3D footer-box */
.footer-box {background: transparent; width:816px; margin:0 auto;}
.footer-box p {
	font-size:0.6em;
	margin:0 10px;
	padding-bottom:0.4em;
	text-transform: uppercase;
	color: #75912e;
}

.footer-box .top, .footer-box .bottom {display:block; background:transparent; }
.footer-box .b1, .footer-box .b2, .footer-box .b3, .footer-box .b4, .footer-box .b1b, .footer-box .b2b, .footer-box .b3b, .footer-box .b4b {display:block; overflow:hidden;}
.footer-box .b1, .footer-box .b2, .footer-box .b3, .footer-box .b1b, .footer-box .b2b, .footer-box .b3b {height:1px;}
.footer-box .b2, 
.footer-box .b3,
.footer-box .b4,
.footer-box .b4b,
.footer-box .b3b,
.footer-box .b2b {background:#1a3406; }


.footer-box .b1 {margin:0 5px; background:#1a3406;}
.footer-box .b2, .footer-box .b2b {margin:0 3px; }
.footer-box .b3, .footer-box .b3b {margin:0 2px;}
.footer-box .b4, .footer-box .b4b {height:2px; margin:0 1px;}
.footer-box .b1b {margin:0 5px; background:#1a3406;}
.footer-box .boxcontent, .footer-box .boxcontent p {display:block; background:#1a3406;color: #75912e; }
.footer-box .boxcontent p a, .footer-box .boxcontent p a:visited {color:#75912e;text-decoration:none;}
.footer-box .boxcontent p a:hover {color:#ffffff;text-decoration:none; }
.footer-box .boxcontent .links {
	float:left;
	text-align:right;
	height:14px;
	width:507px;
	border-right: 2px solid #ffffff;
	padding-right:5px;
	text-transform: uppercase;
}
.footer-box .boxcontent .rechts {
	float:left;
	width:294px;
	text-transform: uppercase;
	padding-left:5px;
}

/* ===============================

   =3. Spezielle Seiten : ESSEN

=============================== */
#essen {
	font-size:0.75em;
	line-height:1.5em;
	margin:20px 20px 0 68px;
	clear:both;
}
#essen a:link, #essen a:visited {
	color:#6b8c40;
	text-decoration:none;
}
#essen a:hover {
	color:#243b08;
	text-decoration:none;
}
#essen .essen-ue {
	color:#6b8c40;
	font-weight:bold;
	border-bottom:1px solid #6b8c40;
	width:420px;
	margin-bottom:5px;
}
#essen .essen-preise {
	float:left;
	background-color:#FFFFFF;
	width:420px;
	text-align:right;
	margin-bottom:5px;
}
#essen .essen1 {
	background-color:#ebfac9;
	width:330px;
	float:left;
	padding:2px 5px;
	text-align:left;
}
#essen .menu1 {
	background-color:#92ba5d;
	color:#243b08;
	width:410px;
	float:left;
	padding:5px 5px;
	text-align:center;
}
#essen .menu2 {
	background-color:#698a40;
	color:#bdda96;
	width:410px;
	float:left;
	padding:5px 5px;
	text-align:center;
}
#essen .stern {
	color:#FFFFFF;
	font-weight:bold;
}
#essen .line {
	border-top: 1px solid #ffffff;
	width: 200px;
	text-align:center;
	margin: 5px auto;
}
#essen .preistxt {
	font-weight:bold;
	padding:0 5px 0 0;
	margin-top:20px;
}
#essen .preistxt-2 {
	font-weight:bold;
	padding:2px 5px 0 0;
}
#essen .essen1 .rechts {
	float:right;
	text-align:right;
}
#essen .essentext {
	font-size:0.6em;
	}
/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
.thumbnail {
	width: 100px;
	height:100px;
	float:left;
	z-index: 0;
	margin:0 5px 15px 0;
}
.thumbnail:hover{
	background-color: transparent;
	z-index: 0;
}
.thumbnail span { /*CSS for enlarged image*/
	visibility: hidden;
	float:left;
	left:0;
}
.thumbnail span img{ /*CSS for enlarged image*/
	border-width: 0;
}

.thumbnail:hover span { /*CSS for enlarged image on hover*/
	visibility: visible;
}
.thumbnail:hover .ab-1 { margin:-468px 0 0 -68px;*margin:-483px 0 0 -68px;}
.thumbnail:hover .ab-2 { margin:-468px 0 0 -173px;*margin:-483px 0 0 -173px;}
.thumbnail:hover .ab-3 { margin:-468px 0 0 -278px;*margin:-483px 0 0 -278px;}
.thumbnail:hover .ab-4 { margin:-468px 0 0 -383px;*margin:-483px 0 0 -383px;}
/* ===============================
   Kontaktformular 
=============================== */