/*
Landhaus Rössle

Font:Georgia, Times New Roman
Text: 14pt
h1: 34pt
h2: 18pt
h3: 16pt

Farben:
#925D37 / bg Navi, headlines, links
#BEA899  / bg Image
#36353B  / bg header/footer
#2C1A00  / font

Links hover: underline, #2C1A00 

*/

/* Anzeigen des Scrollbalken rechts immer, damit der Inhalt nicht hin- und herspringt */
html { overflow: scroll; }

body { 
	padding: 0px;
	margin: 0px; 
	font-family: Georgia, 'Times New Roman',Times,serif;
	font-size: 14px; 
	color: #2C1A00;
}

img { border: 0px; }

input.submit { border: 0px; padding: 0px 0px 0px 12px; background: url('link_pfeil.gif') no-repeat left 5px; color: #925d37; cursor: pointer; }
input.submit:hover { background: url('link_pfeil_hover.gif') no-repeat left 5px; color: #2C1A00; }


#screen { margin: 0px auto;  }


/***************************** HEADER ******************************/

#header { position: relative; background-color: #d9d9d9; height: 416px; }
#header #outertopbar { background-color: #36353B; height: 50px; }
#header #topbar { width: 1264px; margin: 0px auto; position: relative; z-index: 40; }
#header #topbar #search { background: url('suche_bg.gif') no-repeat; float: left; width: 223px; height: 30px; position: relative;  top: 10px; margin-left: 500px; display: inline;  }
#header #topbar #search #search-input { position: absolute; top: 5px; left: 5px; border: 0px; font-size: 0.9em; background-color: transparent; margin: 0px; }
#header #topbar #search img { position: absolute; left: 150px; }
#header #topbar #search #search-button { position: absolute; top: 5px; right: 0px; border: 0px; width: 60px; margin: 0px 5px 0px 0px; }
#header #topbar #search form { margin: 0px; border: 0px; padding: 0px;  }
#header #topbar #languages { position: relative; float: left; top: 15px; margin-left: 10px; }
#header #topbar #languages img { margin: 3px; }
#header #headerbild { width: 1264px; margin: 0px auto; }
#header #slowfood { position: absolute; top: 10px; left: 900px; }
#header #slowfood a { background: url('slowfood.png') no-repeat;  }
#header #slowfood a div { width: 97px; height: 66px; }



/************************* NAVIGATION ****************************/

#outernavi { width: 100%; height: 416px; position: absolute; top: 0px; z-index: 20;}
#navi { width: 1264px; margin: 0px auto; left: 0px; position: relative;  }
#navi div { margin-left: 90px; }

#logo { height: 416px; }

#navi ul { list-style: none; padding: 0px; margin: 30px 0px 0px 120px; width: 230px; position: absolute; }
#navi ul li { padding: 0px; margin: 0px;  }
#navi ul li a { margin: 0px; padding: 0px 25px 0px 0px; line-height: 33px; font-size: 20px; font-weight: normal; color: #ffffff; text-decoration: none;}
#navi ul li a:hover,
#navi ul li.act a { color: #2C1A00;  }
#navi ul li.first a { background: url('home.gif') no-repeat right 5px; }
#navi ul li.first a:hover,
#navi ul li.first-act a { background: url('home_dark.gif') no-repeat right 5px; }
/* Level 2 */
#navi ul li.act ul { margin-left: 20px; margin-top: 0px; position: relative; }
#navi ul li.act ul li a { color: #ffffff; line-height: 1.5em; font-size: 16px;  }
#navi ul li.act ul li a:hover,
#navi ul li.act ul li.act a { color: #2C1A00;  }
#navi ul li.act ul li.first a { background: none; }
/* Level 3 */
#navi ul li.act ul li.act ul { }
#navi ul li.act ul li.act ul li a { color: #ffffff; font-size: 14px; }
#navi ul li.act ul li.act ul li a:hover,
#navi ul li.act ul li.act ul li.act a { color: #2C1A00;  }

#navi #buchungsanfrage { position: absolute; top: 265px; left: 30px; width: 210px; padding: 5px 10px 10px 10px; }
#navi #buchungsanfrage h2 { margin-top: 0px; }
#navi #buchungsanfrage label { display: block; width: 100px; font-size: 0.8em; margin-left: 2px; }
#navi #buchungsanfrage input { width: 100px; border: 1px solid #2C1A00; margin-top: 0px;  }
#navi #buchungsanfrage input#buchung_submit { display: block; width: auto; border: 0px; }
#navi #buchungsanfrage img { margin: 0px 0px 0px 3px; }


/***************************** CONTENT ******************************/

/* Kommentar zum braunen Balken:
	- #content #left hat eine Hintergrundfarbe, der benötigt wird, wenn der #content #middle und #content #right zu kurz ist.
	- #content #innercontent hat nen Border links, der benötigt wird, wenn der #content #middle oder #content #right länger als #content #left ist.
*/
#outercontent { position: relative; z-index: 10; }
#content { margin: 0px auto; width: 1264px; min-height: 415px; background: #ffffff url('ornament.png') no-repeat 770px 0px; }
#content #left { background-color: #925D37; float: left; width: 290px; height: 415px; margin-left: 90px; display: inline; margin-right: -290px; }
#content #innercontent { border-left: 290px solid #925D37; float: left; position: relative; #925D37; }
#content #innercontent #middle { float: left; width: 400px; padding: 25px 25px 25px 25px; }
#content #innercontent .incl-right { width: 700px !important; }
#content #innercontent #right { float: left; width: 150px; font-size: 0.8em; padding: 100px 25px 25px 25px; }
#content #innercontent #right #printlink { position: absolute; top: 10px; }



/***************************** FOOTER ******************************/

#outerfooter { background: url('footer_bg.png') repeat-x; height: 270px; clear: both; position: relative;}
#footer { margin: 0px auto; width: 1264px; clear: both; color: #ffffff; height: 270px; position: relative;}
#footer #brownblock { background-color: #925D37; width: 290px; height: 270px; float: left; margin-left: 90px; display: inline; }
#footer #servicenavi { position: absolute; bottom: 10px; left: 400px; }
#footer #servicenavi a { text-decoration: underline; color: #ffffff; }
#footer #servicenavi a:hover { text-decoration: none; }
#footer #servicenavi #copyright,
#footer #servicenavi ul { display: inline; float: left; list-style: none; padding: 0px; margin: 0px; }
#footer #servicenavi ul { margin-left: 5px; margin-right: 10px; }
#footer #servicenavi ul li { float: left; padding-left: 0px; margin: 0px 5px 0px 0px; }

#footer #footer-content-left { float: left; padding: 12px 25px 25px 25px; }
#footer #footer-content-normal { float: left; padding: 25px; }


/******************************** DATEPICKER ********************/
.ui-widget { font-family: Verdana, Arial, sans-serif; font-size: 0.8em;}
.ui-widget-content { background-color: white; border: 1px solid #AAA;color: #222; }
.ui-corner-all { border-bottom-left-radius: 4px 4px; border-bottom-right-radius: 4px 4px; border-top-left-radius: 4px 4px; border-top-right-radius: 4px 4px; }
.ui-datepicker { padding: 0.2em 0.2em 0px; width: 17em;}
.ui-datepicker .ui-datepicker-header { padding: 0.2em 0px; position: relative;}
.ui-widget-header { background: #CCC url('buchungsanfrage_datepicker_header_bg') repeat-x 50% 50%; border: 1px solid #AAA;}
.ui-datepicker .ui-datepicker-prev { left: 2px; }
.ui-datepicker .ui-datepicker-next { right: 2px; }
.ui-datepicker .ui-datepicker-prev, 
.ui-datepicker .ui-datepicker-next { height: 1.8em; position: absolute; top: 2px;width: 1.8em;}
.ui-datepicker .ui-datepicker-prev span, 
.ui-datepicker .ui-datepicker-next span { display: block; left: 50%; margin-left: -8px; margin-top: -8px; position: absolute; top: 50%;}
.ui-icon { background: url('buchungsanfrage_iconset.png') no-repeat; overflow: hidden; text-indent: -99999px; height: 16px; width: 16px; }
.ui-widget-header .ui-icon {}
.ui-icon-circle-triangle-w { background-position: -80px -192px; }
.ui-icon-circle-triangle-e { background-position: -48px -192px; }
.ui-datepicker .ui-datepicker-title { line-height: 1.8em;margin: 0px 2.3em;text-align: center;	}
.ui-datepicker table {border-collapse: collapse;font-size: 0.9em;margin: 0px 0px 0.4em;width: 100%;}
.ui-datepicker th {border: 0px; font-weight: bold; padding: 0.7em 0.3em; text-align: center;}
.ui-datepicker td {border: 0px;padding: 1px;}
.ui-state-default, .ui-widget-content .ui-state-default { background: #E6E6E6 url('buchungsanfrage_strich.png') repeat-x 50% 50%; border: 1px solid lightGrey;}
.ui-datepicker td span, .ui-datepicker td a { display: block;text-align: right; text-decoration: none;}
.ui-widget-content .ui-state-hover { border: 1px solid #777777;}
.ui-datepicker-header .ui-state-hover { border: 0px; background-color: #aaaaaa; }

/***************** Clearfix ****************/
.clearfix { display: inline-block; }
.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}