@charset "utf-8";



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

Stylesheet für die Website des Forums-Wimmis (www.forum-wimmis.ch)
Stand: Testlauf 
Datei: ../stylesheets/layout.css
Datum: 04.08.2012
Autor: Marc Rosset

Aufbau: 1. Kalibrierung und allgemeine Styles
		2. Styles für Layoutbereiche
		3. Sonstiges, v.a. Darstellung von Bildern, Aufzählungen und Tabellen

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


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

	1. Kalibrierung und allgemeine Styles

	================================in==========================*/

/* 	margin und padding 0, um unterschiedlichen Browser-Standardeinstellungen Rechnung zu tragen. */

* { padding: 0;
	margin: 0;
}

html {
	height: 101%;
}

/* Hyperlinks allgemein */

/* Unterstreichung entfernen */

a {
	text-decoration: none;
	outline: none;
	color:#9F3;
}

/* 	Ueberschriften, Schriften */

h1 {
	font-family: Verdana, Geneva, sans-serif;
	font-style: normal;
	font-weight: normal;
	font-size: 20px;
	position: absolute;
	left: 0px;
	top: 20px;
	width: 900px;
	color:#999;
}

/* h2 ist die Ueberschrift des maincontent */

h2 {
	font-family:Verdana, Geneva, sans-serif;
	font-size:  13px;
	color: #EEE;
	font-weight: normal;
	padding: 0px, 0px, 0px, 0px;
	line-height: 17px;
}

/* h3 ist die Ueberschrift eines Untermenues im sidebar */

h3 {
	font-family:Verdana, Geneva, sans-serif;
	font-size: 16px;
	color:#FFF;
	line-height: 36pt;
	font-weight: normal;
}

/* h4 ist eine Unter-Ueberschrift innerhalb des maincontent */

h4 {
	font-family:Verdana, Geneva, sans-serif;
	font-size: 12px;
	color:#999;
	line-height: 20px;
	font-weight: normal;
}

h5 {
	font-family:Verdana, Geneva, sans-serif;
	font-size:  11px;
	color: #666;
	font-weight: bold;
	padding: 0px, 0px, 0px, 0px;
	line-height: 17px;
}

/* h6 für Aktuelles, das zurückliegt */
h6 {
	font-family:Verdana, Geneva, sans-serif;
	font-size:  11px;
	color: #999;
	font-weight: bold;
	padding: 0px, 0px, 0px, 0px;
	line-height: 17px;
}

/* h7 für Wichtiges */
h7 {
	font-family: Verdana, Geneva, sans-serif;
	font-size: 12px;
	color:#F99;
	line-height: 15px;
	font-weight:normal;
}

hr {
 	height: 12px; border: 0; margin-top: 30px; box-shadow: inset 0 12px 12px -12px rgba(0, 0, 0, 0.5);
}

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

	2. Styles für Layoutbereiche

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

body  {
	font-family: Verdana, Geneva, sans-serif;
	font-size: 11px;
	color:#000;
	line-height: 15px;
	font-weight: normal;
	background-color:#333;
	background-position: center;
	text-align: center; /* Damit Container in IE 5*-Browsern zentriert. Text erhält im #container die Standardausrichtung left */
	border-bottom: thin;
}
#container {
	position: relative; /* damit sidebar aboslut positioniert werden kann */
	width: 1200px;
	height: 850px; /* ursprünglich 710 */
	margin-top: 20px;
	margin-left: auto;
	margin-right: auto;
	text-align: left;
} 
#container_endlos {
	position: relative; /* damit sidebar aboslut positioniert werden kann */
	width: 1200px;
	height: 8600px;
	margin-top: 20px;
	margin-left: auto;
	margin-right: auto;
	text-align: left;
} 
#container_bilder {
	position: relative; /* damit sidebar aboslut positioniert werden kann */
	width: 1200px;
	height: 1000px;
	margin-top: 20px;
	margin-left: auto;
	margin-right: auto;
	text-align: left;
}
#titlebar {
	position: relative; /* damit sidebar aboslut positioniert werden kann */
	width: auto;
	border:none;
	padding-top:10px;
	padding-bottom:0px;
	padding-left:0px;
	text-align: center;
	color:#CCC;
	height: 50px;
	font-size: 4em;
	letter-spacing: 13px;	
	font-family:"Courier New", Courier, monospace;
}
#header {
	position: relative; /* Trick aus Little Boxes, S. 217. Bezugspunkt, damit #header h1 abolut positioniert werden kann */
	width: auto;
	height: 400px;
	padding: 0px 0px 0px 0px;
	margin-bottom: 0px;
}
#mainmenu {
	postition: relative;
	padding-top: 5px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 500px;
	background-color:#333;
}
#mainmenu ul {
	border-top: 0px solid #999;
}
#mainmenu li {
	display: inline;
	list-style-type: none;
}
/* outline: none; entfernt die gepunktete Umrisslinie im Moment des Klicks bei focus & active */
#mainmenu a {
	text-decoration: none;
	outline: none;  
	font-family: Verdana, Geneva, sans-serif;
	font-size: 11px;
	padding: 0 20px 0 0;
	color: #999;
}

/* folgende Zeilen stellen sicher, dass im mainmenu die akutelle Seite nach dem Anklicken hervorgehoben wird. */
#mainmenu 
	a:hover, a:focus,
	#seite_home #navi01 a,
	#seite_spycher #navi02 a,
	#seite_bilder #navi04 a,
	#seite_lage #navi05 a,
	#seite_vermietung #navi06 a,
	#seite_belegungskalender #navi07 a,
	#seite_kontakt #navi08 a {		
	color:#9F6;
	font-weight: bold;
}
#mainmenu a:active {
	text-decoration: none;
	color: #FFF;
}
#mainContent {
	font-family: Verdana, Geneva, sans-serif;
	font-size:12px;
	position: relative;
	width: auto;
	height: auto;
	background-color:#333;
	color:#999;
	margin-bottom: 0px;
	padding-top: 50px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
} 
#mainContent img {
	margin-left:7px;

}

#footer {
	position: relative;
	width: auto;
	height: 30px;
	background-color:#333;
	padding-top;5px;
	padding-right:0px;
	color:#666;
	text-align:right;
} 
.clearfloat {
	clear: both;
}
.zurueck {
	margin-right: 20px;	
}
div.aufzaehlung_mit_kleinbildern_links img {
	float: left;
	width: 200px;
	height: 62px;
	padding: 5px 20px 10px 0;
}	
div.aufzaehlung_mit_kleinbildern_links_ohne_hoehenlimit img {
	float: left;
	width: 150px;
	padding: 5px 20px 10px 0;
}
.aufzaehlung_mit_kleinbildern_umbruch { /* damit die Box mit den Kleinbildern auf die Grösse des Bildes aufgedrückt wird */
	width: 100%;
	height: 1px;
	clear: both;
}

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

	3. Sonstiges, v.a. Darstellung von Bildern, Aufzählungen und Tabellen

	======================================================================*/
img:not(.belegungskalender) {
	border: thin solid #999;
}
.tabelle_aktuell {
	width: 90%;
	font-family: Verdana, Geneva, sans-serif;
	font-size: 10px;
	font-style: normal;
}
.tabelle_aktuell td {
	font-family: Verdana, Geneva, sans-serif;
	font-size: 10px;
	font-style: normal;
	border-bottom-style: solid;
	border-bottom-color: #999;
	line-height: 120%;
	padding-top: 4px;
	padding-bottom: 4px;
	border-bottom-width: 1px;
}
.tabelle_mietpreise {
	float:right;
	border: none;
	width: 300px;
	font-family: Verdana, Geneva, sans-serif;
	font-size: 10px;
	font-style: normal;
}
.tabelle_mietpreise td, table th {
padding: 1px 5px;
border: 0px solid #000;
}
.tabelle_mietpreise th {
background-color: #666;
color: #fff;
}
.tabelle_mietpreise tr:nth-child(1n+2) {
background-color: #CFC;
color: #000;
}
.tabelle_mietpreise tr:nth-child(2n+3) {
background-color: #999;
color: #000;
}
.tabelle_mietpreise tr:hover {
background-color: #c00;
color: #fff;
}

.tabelle_mietpreise td {
	text-align: center;
	border-bottom: thin;
	border-bottom-color: #F00;
}
.galerie {
	overflow: hidden;
}
.einzelbild {
	float: right;
	text-align: right;
	padding: 0 0 10px 10px;
  	margin: 0 0 30px 10px;	in
}
.einzelbild dd {
	font-size: 90%;
	margin: 0;
	padding: 0;
}
.einzelbild dt {
	font-size: 90%;
	margin: 0;
	padding: 0;
}

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

	KONTAKTFORMULAR

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

form#kontakt {
	padding: 0px;
	width: 800px;
	line-height: normal;
	margin: 0;
	font-family: Verdana, Geneva, sans-serif;
	font-size: 11px;
}
#kontakt fieldset {
	width: 730px;
	margin: 4px 0 0 0px;
	padding: 4px;
	border:0;
}
#kontakt input {
	max-width: 400px;
	size: 50;
}
#kontakt select {
	max-width: 400px;
	size: 50;
}
#kontakt fieldset label {
	position: relative;
	cursor: pointer;
}
label.davor {
	float: left;
	display: block;
	width: 75px;
	text-align: left;
	margin-right: 10px;
}
#kontakt #abschicken {
	position: absolute;
	top: 158px;
	left: 807px;
	width: 170px;
	padding: 5px;
	margin-top: 10px;
}
#kontakt #loeschen {
	position: absolute;
	top: 209px;
	left: 806px;
	width: 170px;
	padding: 5px;
	margin-top: 10px;
}
#kontakt fieldset input {
	height: 15px;
	margin: 0 0 5px 0;
	font-family: Verdana, Geneva, sans-serif;
	font-size: 10px;
}
#kontakt fieldset textarea {
	width: 600px;
	height: 50px;
	margin: 0 0 5px 0;
	font-family: Verdana, Geneva, sans-serif;
	font-size: 10px;
}
#kontakt fieldset input.textlang {
	width: 220px;
}
#kontakt fieldset #plz {
	width: 60px;	
}
#kontakt select {
	width: 225px;
	font-size: 12px;
}

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

	ENDE DES STYLESHEETS

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