/*************************************************************/
/*                                                           */
/*                  Hotel Petri                              */
/*            Stylesheet von C.Stetter                       */
/*        für Blueforest Design - und Medienbüro             */
/*               http://www.blueforest.ch                    */
/*                        									 */				
/*************************************************************/
* {
	margin: 0;
	padding: 0;
	border: 0;
	z-index: 0;
}
body {
	text-align: center;
	margin-bottom: 10px;
	z-index: 1;
	background: #FCFF;
	overflow-x:hidden;
	font: 12px Tahoma, Arial, Helvetica, sans-serif;
	color: #4e4e50;
}
img:focus {
	outline: 0;
	text-decoration:none;
	border:none;
}
a, a img, a:hover, img a:hover, img a:focus {
	outline: 0;
	text-decoration:none;
	border:none;
}
li, ul, a, li {
	text-decoration: none;
	list-style: none;
	list-style-type: none;
}
a {
	color:#c0c2c4;
	font-weight:bold;
}
a:hover {
	color:#333;
	font-weight:bold;
}
/* ----------CONTAINER---------------------------- */
#container {
	position: relative;
	width: 820px;
	margin-right: auto;
	margin-left: auto;
	z-index: 2;
}
#content {
	text-align: left;
	position: relative;
	z-index: 3;
}
body.gold { background: url(img/bg_gold.jpg) repeat-x top; }
body.silver { background: url(img/bg_silber.jpg) repeat-x top; }
#headline {
	position:relative;
	color:#c0c2c4 !important;
	font-size: 60px;
	left:290px;
	top:40px;
}
h1, h2, h1.sub, #headline {
	position:relative;
	color:#c0c2c4;
}
h1 {
	font-size: 30px;
	left:290px;
	top:40px;
}
h1.sub {
	font-size: 30px;
	top:40px;
	left:auto;
	right:0px;
	float:right;
}
h2 {
	font-size: 16px;
	top:40px;
	right:0px;
	float:right;
}
.white {
	color:#fff;
	font-weight: bold;
}
ul.sub span, ul.sub span a {
	color:#d4a464 !important;
	font-size:11px!important;
}
 ul.sub span a:hover {
	color:#000!important;
	font-size:11px!important;
}
/* ----------Anordnung Bars---------------------------- */
#weiss {
	font-size: 0px;
	line-height: 1px;
	position:absolute;
	top:17px;
	right:0px;
	height:2px;
	background-color:#FFF;
	width:500%;
}
#grau, #braun {
	font-size: 0px;
	line-height: 1px;
	position:absolute;
	top:17px;
	left:0px;
	height:2px;
	width:500%;
	z-index:300;
}
#grau { background-color:#beb8b5; }
#braun { background-color:#d6a96c; }
/* ----------Anordnung Design---------------------------- */
#oben {
	position: relative;
	height:240px;
}
#mitte {
	position: relative;
	height:330px;
}
#unten {
	position: relative;
	height:200px;
}
#oben img, #FlashID {
	position: absolute;
	bottom:0px;
	left:0px;
}
#adresse {
	position: absolute;
	top:35px;
	left:0px;
}
#adresse a {
	color:#4e4e50;
	font-weight:normal;
}
#adresse a:hover {
	color:#333;
	font-weight:normal;
}
body#galerie table td {
	padding: 0px 4px 4px 0px;
	width:138px;
}
body#galerie table { width:auto; }
body#preise table td { width:55%; }
body#preise table td.first { width:45%; }
/* --------------------------------Headlines--------------------------- */
body#start h1 {
	background: url(img/navi/start.gif) no-repeat;
	height: 108px;
	width: 550px;
}
body#buchung h1 {
	background: url(img/navi/buchung.gif) no-repeat;
	height: 130px;
	width: 550px;
}
body#fruehstueck h1 {
	background: url(img/navi/fruehstueck.gif) no-repeat;
	height: 130px;
	width: 550px;
}
body#galerie h1 {
	background: url(img/navi/galerie.gif) no-repeat;
	height: 108px;
	width: 550px;
}
body#hotel h1 {
	background: url(img/navi/garnihotel.gif) no-repeat;
	height: 130px;
	width: 550px;
}
body.hausa#hotel h1 {
	background: url(img/navi/hausa.gif) no-repeat !important;
	height: 110px;
	width: 550px;
}
body.hausb#hotel h1 {
	background: url(img/navi/hausb.gif) no-repeat left top !important;
	height: 150px;
	width: 550px;
}
body#impressum h1 {
	background: url(img/navi/impressum.gif) no-repeat left top;
	height: 108px;
	width: 550px;
}
body#lage h1 {
	background: url(img/navi/lage.gif) no-repeat left top;
	height: 130px;
	width: 550px;
}
body#preise h1 {
	background: url(img/navi/preise.gif) no-repeat left top;
	height: 130px;
	width: 550px;
}
body#service h1 {
	background: url(img/navi/service.gif) no-repeat left top;
	height: 130px;
	width: 550px;
}
h1 span { display:none; }
/* ------------------------------Navigation---------------------------- */
#navi {
	height:20px;
	width:600px;
	padding-left:230px;
	z-index:340;
}
#navi a, #navi li {
	font-size: 12px;
	height:19px;
	text-decoration: none;
	color:#000;
	font-weight:normal;
}
#navi a:hover {
	color:#333;
	text-decoration: none;
}
body.gold #navi a:hover {
	color:#997648;
	text-decoration: none;
}
body.silver #navi a:hover {
	color:#666260;
	text-decoration: none;
}
/*body.gold #navi ul.main li:hover,*/
body.gold #navi ul.main li.act {
	height:40px;
	background-color:#d6a96c;
	z-index:400;
	position:relative;
	bottom:22px;
	color:#fff !important;
	font-weight:bold;
}
body.gold #navi ul.main li.act a.act {
	color:#fff !important;
	font-weight:bold;
}
/*body.gold #navi ul.main li:hover,*/
body.silver #navi ul.main li.act {
	height:40px;
	background-color:#beb8b5;
	z-index:400;
	position:relative;
	bottom:22px;
	color:#fff !important;
	font-weight:bold;
}
body.silver #navi ul.main li.act a.act {
	color:#fff !important;
	font-weight:bold;
}
#navi ul.main { float:left; }
#navi ul.main li {
	float:left;
	padding-right:10px;
	padding-left:10px;
}
body.silver ul.main li.med { background-color:#e1dedc; }
body.silver ul.main li.light { background-color:#d0cbca; }
body.silver li.dark { background-color:#d8d4d2; }
body.gold ul.main li.med { background-color:#efdabf; }
body.gold ul.main li.light { background-color:#f3e3cf; }
body.gold ul.main li.dark { background-color:#e1be90; }
#navi ul.sub {
	position:absolute;
	top:-20px;
	left:350px;
	width:300px;
}
body#lage #navi ul.sub { left:470px; }
body#lage #navi ul.sub {top:-40px; }
#navi ul.sub li {
	float:left;
	width:50px;
}
#navi ul.sub li a {
	font-size:10px;
	font-weight:normal;
}
#navi ul.sub li a.act, #navi ul.sub li a:hover {
	font-size:10px;
	font-weight:bold;
}
/* ----------Inhalt---------------------------- */
#inhalt {
	padding-top:35px;
	padding-left:230px;
}
body#service #inhalt { padding-top:25px; }
#pix {
	position:absolute;
	top:2px;
	z-index:500;
}
body#galerie #pix { top:0px; }
#tp { position:relative; }
#bt { position:relative; }
body#start #tp {
	width:300px;
	top:180px;
	left:240px;
}
body#start #bt {
	width:300px;
	top:180px;
	left:270px;
}
body#fruehstueck #tp, body#hotel #tp {
	width:300px;
	top:130px;
	left:240px;
}
body#fruehstueck #bt, body#hotel #bt {
	width:500px;
	top:130px;
	left:52px;
}
body#lage #tp {
	width:250px;
	top:45px;
	left:310px;
}
body#lage #bt {
	width:538px;
	top:45px;
	left:52px;
}
body#impressum #tp {
	width:350px;
	top:25px;
	left:210px;
}
body#impressum #bt {
	width:600px;
	top:25px;
	left:0px;
}
/* -----------------------Kontakt---------------------------- */
.wort {
	width:200px;
	display:block;
	float:left;
}
#kontaktform input, #kontaktform select {
	display:block;
	float:left;
}
body#buchung table#tabli { margin-right:15px; }
body#buchung table td {
	font-size:11px;
	padding-bottom: 7px;
}
body#buchung table td.first { padding-left: 20px; }
body#buchung table#tabre input[type="text"], textarea, select {
	width:150px;
	border: 1px solid #666;
}
input[type="text"], textarea, select { border: 1px solid #666; }
input[type="checkbox"] {
	float:right;
	clear:both;
	margin-top:2px;
	margin-bottom:2px;
}
textarea {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #666;
}
input.sml{width:50px;}
div#button {
	position:absolute;
	width:82px;
	right:-90px;
	bottom:31px;
}
div#button input {
	width:80px;
	padding-bottom:2px;
	padding-top:2px;
	text-transform: uppercase;
	color: #d6a96c;
	border: 1px solid #d6a96c;
	-moz-border-radius:3px;
	background: #FFF;
	font-weight: bold;
	font-size: .7em;
}
div#button input:hover {
	background: #d6a96c;
	color: #FFF;
}
body#galerie table img{
	width:138px;
	height:94px;}