@charset "utf-8";

body {
	margin: 0;
	padding: 0;
	background: #888475;
	color: #333;
	font: 0.75em Verdana,Arial,Helvetica,sans-serif;
}

#wrapper {
	position: relative;
	margin: 0 auto;
	padding-bottom: 20px;
	width: 808px;
}

/*------------------------------------*/
/*---------->>> GLOBALS <<<-----------*/
/*------------------------------------*/

h1 {
	margin: 0;
	padding: 0;
	height: 135px;
	background: url(/gfx/sitelogo.gif) no-repeat center center;
	text-indent: -9999em;
}

h2, h3 { font-size: 1.0em; }

h2, h3, p {
	margin: 0 0 0.75em 0;
	padding: 0;
}

h2 { color: #000; }
h3 { color: #888475; }

table, th, td {
	border: 1px solid #ccc;
	border-collapse: collapse;
}

th, td { padding: 2px 3px; }

th {
	font-weight: normal;
	background: #eee;
}

/*-------------------------------------*/
/*---------->>> TOP MENU <<<-----------*/
/*-------------------------------------*/

#navigation {
	margin: 0;
	padding: 4px 0;
	height: 130px;
	background: #fff;
}

#navigation li {
	list-style: none;
	float: left;
	margin: 0 0 0 4px;
	width: 130px;
	height: 130px;
	background-color: #a39f93;
	background-position: 0 0;
	background-repeat: no-repeat;
}

#navigation .home { background-image: url(/gfx/nav-item1.gif); }
#navigation .angebot { background-image: url(/gfx/nav-item2.gif); }
#navigation .galerie { background-image: url(/gfx/nav-item3.gif); }
#navigation .referenzen { background-image: url(/gfx/nav-item4.gif); }
#navigation .person { background-image: url(/gfx/nav-item5.gif); }
#navigation .kontakt { background-image: url(/gfx/nav-item6.gif); }

#home #navigation .home, #angebot #navigation .angebot, #service #navigation .angebot, #kueche #navigation .angebot, #betreuung #navigation .angebot, #location #navigation .angebot, #galerie #navigation .galerie, #referenzen #navigation .referenzen, #person #navigation .person, #kontakt #navigation .kontakt, #formular #navigation .kontakt, #agb #navigation .kontakt, #impressum #navigation .kontakt {
	background-color: #ee817b;
}

#home #navigation .home { background-image: url(/gfx/nav-item1-on.gif); }
#angebot #navigation .angebot { background-image: url(/gfx/nav-item2-on.gif); }
#service #navigation .angebot { background-image: url(/gfx/nav-item2-on.gif); }
#kueche #navigation .angebot { background-image: url(/gfx/nav-item2-on.gif); }
#betreuung #navigation .angebot { background-image: url(/gfx/nav-item2-on.gif); }
#location #navigation .angebot { background-image: url(/gfx/nav-item2-on.gif); }
#galerie #navigation .galerie { background-image: url(/gfx/nav-item3-on.gif); }
#referenzen #navigation .referenzen { background-image: url(/gfx/nav-item4-on.gif); }
#person #navigation .person { background-image: url(/gfx/nav-item5-on.gif); }
#kontakt #navigation .kontakt { background-image: url(/gfx/nav-item6-on.gif); }
#formular #navigation .kontakt { background-image: url(/gfx/nav-item6-on.gif); }
#agb #navigation .kontakt { background-image: url(/gfx/nav-item6-on.gif); }
#impressum #navigation .kontakt { background-image: url(/gfx/nav-item6-on.gif); }

#navigation a {
	display: block;
	height: 35px;
	text-indent: -9999em;
	outline: 0;
}

/*-------------------------------------*/
/*---------->>> SUB MENU <<<-----------*/
/*-------------------------------------*/

#navigation ul {
	padding: 0;
	margin: 3px 0 0 0;
	list-style: none;
	display: none;
}

#home #navigation .home ul, #angebot #navigation .angebot ul, #service #navigation .angebot ul, #kueche #navigation .angebot ul, #betreuung #navigation .angebot ul, #location #navigation .angebot ul, #galerie #navigation .galerie ul, #referenzen #navigation .referenzen ul, #person #navigation .person ul, #kontakt #navigation .kontakt ul, #formular #navigation .kontakt ul, #agb #navigation .kontakt ul, #impressum #navigation .kontakt ul {
	display: block;
}

#navigation ul li {
	margin: 0;
	padding: 0;
	font-size: 0.75em;
	height: 2.2em;
	background: transparent;
}

#navigation ul a {
	display: inline;
	padding-left: 7px;
	text-indent: 0;
	text-decoration: none;
	color: #fff;
}

#navigation ul li.active a {
	font-weight: bold;
}

/*-----------------------------------------*/
/*---------->>> MAIN CONTENT <<<-----------*/
/*-----------------------------------------*/

#main {
	height: 402px;
	background-color: #fff;
	background-position: 6px 0;
	background-repeat: no-repeat;
	position: relative;
	z-index: 1;
}

#content {
	position: relative;
	margin: 0 4px;
	padding: 20px 20px 20px 266px;
	border: 2px solid #929187;
	height: 354px;
	overflow: auto;

	line-height: 1.6em;
	letter-spacing: 0.02em;
}

#content a {
	color: #33c;
	text-decoration: none;
}

#content a:hover {
	color: #ee817b;
	border-bottom: 1px dotted #ee817b;
}

/*-------------------------------------------*/
/*---------->>> ADMIN CONTROLS <<<-----------*/
/*-------------------------------------------*/

.edit-exit, .edit-img, .edit-page {
	position: absolute;
	display: block;
	outline: 0;
}

.edit-exit {
	top: 10px;
	height: 32px;
	line-height: 32px;
	color: #ddd;
	background: url(/gfx/edit-exit.png) no-repeat 0 0;
	padding-left: 40px;
	font-weight: bold;
	text-decoration: none;
}

.edit-img, .edit-page {
	font-size: 1px;
	width: 16px;
	height: 16px;
	top: 5px;
	padding: 2px;
	text-indent: -9999em;
	background-position: 2px 2px;
	background-repeat: no-repeat;
	background-color: #fff;
}

#content a.edit-img:hover, #content a.edit-page:hover {
	border: 0;
}

.edit-img {
	left: 5px;
	background-image: url(/gfx/edit-img.png);
}

.edit-page {
	right: 5px;
	background-image: url(/gfx/edit-page.png);
}

/*------------------------------------*/
/*---------->>> GALLERY <<<-----------*/
/*------------------------------------*/

#gallery {
	margin: 0;
	padding: 0;
}

#gallery li {
	position: relative;
	list-style: none;
	display: block;
	float: left;
	margin: 0 0 4px 4px;
	padding: 0;
	width: 130px;
	height: 130px;
}

#gallery img {
	display: block;
	border: 2px solid #929187;
	width: 126px;
	height: 126px;
	cursor: pointer;
}

#shade {
	position: absolute;
	top: 0;
	left: 4px;
	width: 800px;
	height: 398px;
	background: #fff;
	z-index: 10;
	display: none;
}

#hires {
	position: absolute;
	margin: 0 0 0 4px;
	z-index: 20;
	display: none;
	cursor: pointer;
}

#hires img {
	border: 2px solid #929187;
	width: 260px;
	height: 260px;
}

.img01, .img07, .img13,
.img02, .img08, .img14 { left: 0; }
.img03, .img09, .img15,
.img04, .img10, .img16 { left: 268px; }
.img05, .img11, .img17,
.img06, .img12, .img18 { left: 536px; }

.img01, .img02, .img03, .img04, .img05, .img06,
.img07, .img08, .img09, .img10, .img11, .img12 { top: 0; }
.img13, .img14, .img15, .img16, .img17, .img18 { top: 134px; }

/*---------------------------------*/
/*---------->>> FORM <<<-----------*/
/*---------------------------------*/

form table, form td {
	border: 0;
	margin: 0;
}

form table {
	margin-bottom: 1em;
}

form td {
	padding: 0 0 3px 0;
}

form .labels { width: 200px; }
form .fields { width: 270px; }

input.ipS, input.ipM, input.ipL, textarea {
	margin: 0 3px 0 0;
	border: 1px solid #929187;
	padding: 1px 2px;
	float: left;
}


input.ipS { width: 80px; }
input.ipM { width: 171px; }
input.ipL, textarea { width: 260px; }

textarea {
	font: 1em Verdana,Arial,Helvetica,sans-serif;
}

.help { font-size: smaller; }

input.invalid {
	border: 1px solid #f00;
	background-color: #fee;
}

.footnote {
	margin-top: 2em;
	border-top: 1px dotted #999;
}

/*-----------------------------------*/
/*---------->>> QUIRKS <<<-----------*/
/*-----------------------------------*/

#navigation li, #gallery li {
	display: inline; /* Fix for IE6 bug doubling a floated element's margin */
}