/* -- damit HTML-ohne Fehler in Firefox funktioniert -- */
body { 
font-size: 12px; 
font-family: verdana, arial, helvetica, sans-serif; 
/*background-color: #333; */
background: url(../img/bg03.jpg) 0px 0px repeat;
}

body, p, td, li, ul h1, h2, h3 {margin: 0; padding: 0;}

h1 {font-size: 18px; margin: 6px 5px 2px 7px;}
h2 {font-size: 13px;}

.small {font-size: 9px; line-height: 115%; margin: 0; }

/* Kleine Schrift für Navigation */
.navig_small {
	font-size:7pt;
	font-weight:normal;
	}



tr {vertical-align: top;} /* damit Tabellen alle oben formatiert sind */

/* Editfenster */ 
.edit {background: url(../img/weiss.gif) 0px 0px repeat;}


/* Farben */

.rot {color: #e2242b;}
.gruen {color: #279e2f;}
.blau {color: #2f65a9;}
.grau {color: #6a717a;}

/* a {text-decoration: none;} */

/* ---------------- Position und Format der Layout-Elemente ------------------- */

#zentral {
	position:absolute;
	height:520px; width:730px;
	margin:-240px 0 0 -365px;
	top: 43%; 
	left: 50%;
	text-align: left;
	padding: 0;
	color: #fff; 
	/*background: url(../img/bgg_content.gif) 0px 0px no-repeat;*/
	/*border: solid 1px #333; */
	overflow: hidden;
	/*background-color: #fff;*/
		}


/* ---------------- Format der Mitte-Dokumente (ganzseitig - z.B. Texte)  ------------------- */
#mitte {
	position:absolute;
	width:680px;
	margin:0 0 0 -340px;
	left: 50%;
	text-align: left;
	padding: 0;
	color: #fff; 
}

/* Schriften für normale Texte - mittig angordnet */
#mitte p, #mitte h3 {font-size: 12px; line-height: 16px;}
#mitte p {margin-bottom: 5px;}
#mitte .small {font-size: 11px;}
#mitte img {border: 0;}


/* ---------------- Format des iFrame  ------------------- */
#iframe {
	padding: 0;
	margin: 0;
	border: 0;
	border: 0;
	width:100%;
	height: 270px;
	z-index:20;
	/*background-color: #333;*/
	}



/* ----- Adresse  ----------- */

#adresse {
	position:absolute;
	height:50px; 
	width:520px;
	top: 500px; 
	left: 40px;
	margin: 0;
	/*border: solid 1px #333; */
	text-align: right;
	z-index: 50;
}

#adresse p {margin: 0;}


/* ----- Logo  ----------- */

#logo {
	position:absolute;
	height:50px; 
	width:230px;
	top: 34px; 
	left: 10px;
	margin: 0;
	/*border: solid 1px #333; */
	z-index: 5;
}

#logo a {
	display: block;
	padding-top: 20px;
	height:50px; 
	width:230px;
	background: url(../img/logo_berg02.gif) 0px 0px no-repeat;
	color: #fff;
	}

#logo a:hover { 
	background: url(../img/logo_berg02_over.gif) 0px 0px no-repeat;
	/*color: #00f;*/
	}



/* ----- Inhalt  ----------- */

#inhalt {
	position: relative;
	left: 0px;
	top: 120px;
	height:270px; 
	width:724px;
	/*background-color: #333; */
	color: #fff;
	/*border: solid 1px #333; */
	overflow: hidden;
	}


#inhalt img {border: 0;}




.links {
	position: absolute;
	display: block;
	top: 4px;
	left:4px;
	width: 235px;
	height: 262px;
	/*background-color: #666; */
	/*border: solid 1px #fff; */
}

.mitte {
	position: absolute;
	display: block;
	top: 4px;
	left:244px;
	width: 235px;
	height: 262px;
	/*background-color: #666; */

}

.rechts {
	position: absolute;
	display: block;
	top: 4px;
	left:484px;
	width: 235px;
	height: 262px;
	/*background-color: #666; */
}


/* Farbdefinitionen für Unterschiedliche Sektionen */

/*
.hotel .links, .hotel .mitte , .hotel .rechts  {
	background-color: #333; }

.genoss .links, .genoss .mitte , .genoss .rechts  {
	background-color: #333; }

.info .links, .info .mitte , .info .rechts  {
	background-color: #333; }
*/

.hotel .links, .hotel .mitte , .hotel .rechts  {
	background-color: #444; }

.genoss .links, .genoss .mitte , .genoss .rechts  {
	background-color: #444; }

.info .links, .info .mitte , .info .rechts  {
	background-color: #444; }


/* Zum Testen von versch. Farben bei Genoss-Login */

/*
.login .links {
	background-color: #444449; }

.login .mitte {
	background-color: #444944; }

.login .rechts {
	background-color: #504444; }
*/




/* ------------------- Navigation ----------------------- */

#haupt_navig, #haupt_navig_it {
	font-family: "Trebuchet MS", Helvetica, Arial, Geneva, sans-serif;
	position:absolute;
	top: 420px;
	left: 0px;
	height:35px; 
	width:800px;
	color: #fff;
	z-index: 10; 
	}


/* -- Navigation formatieren --*/
#haupt_navig ul, #haupt_navig_it ul {
	margin: 0 0 0 0; 
	padding: 0px; 
	border: 0px;
	}

#haupt_navig li, #haupt_navig_it li {
	float: left; 
	left:0px;
	top: 0px;
	font-size: 14.3px;
	line-height: 27px;
	width: 239px;
	height: 27px;
	margin-right: 3px;
	position: relative; 
	/*border: 1px solid #333; */
	background-color: #bbb;
	text-align: center;
	list-style: none;
	}

#haupt_navig .str, #haupt_navig_it str { /* Strich formatieren */
	font-size: 12px;
	color: #fff;
	}

#haupt_navig a, #haupt_navig_it a { color: #333; font-weight: bold; text-decoration: none; }
/* NEU damit ganzes Kästchen aktiv ist wechselt */
#haupt_navig a, #haupt_navig_it a {display:block; }


/*#navig a { color: #596100; font-weight: bold; text-decoration: none; }*/
#haupt_navig a:hover, #haupt_navig_it a:hover {font-weight: bold; color: #fff; background-color:#999;}


/* ======================  NEU ======================= */

#sub_navig {
	font-family: "Trebuchet MS", Helvetica, Arial, Geneva, sans-serif;
	position:absolute;
	top: 450px;
	left: 0px;
	height:35px; 
	width:800px;
	color: #fff;
	z-index: 10; 
	}

/* -- Navigation formatieren --*/
#sub_navig ul {
	margin: 0 0 0 0; 
	padding: 0px; 
	border: 0px;
	}

#sub_navig li {
	float: left; 
	left:0px;
	top: 0px;
	font-size: 14.3px;
	line-height: 27px;
	width: 118px;
	height: 27px;
	margin-right: 3px;
	position: relative; 
	/*border: 1px solid #333; */
	background-color: #bbb;
	text-align: center;
	list-style: none;
	}

#sub_navig .str { /* Strich formatieren */
	font-size: 12px;
	color: #fff;
	}

#sub_navig a { color: #333; font-weight: bold; text-decoration: none; }
/* NEU damit ganzes Kästchen aktiv ist wechselt */
#sub_navig a {display:block; }


/*#navig a { color: #596100; font-weight: bold; text-decoration: none; }*/
#sub_navig a:hover {font-weight: bold; color: #fff; background-color:#999;}



/* ---------- Seitenwechsel-Navigation --*/
#seiten_navig { 
	font-family: arial, helvetica, geneva, "trebuchet ms", sans-serif;
	font-size: 11px;
	position: relative;
	text-align: right;
	right: 10px;
	color: #333; 
	/*border: 1px solid #333;*/
	}

#seiten_navig a { font-weight: bold; text-decoration: none; color: #000}
#seiten_navig a:hover { color: #000;}


#seiten_navig a, #navig_print a {color: #999;}


/* -------------  Sprachnavig  ----------------*/

#sprachnavi { font-family: arial, helvetica, geneva, "trebuchet ms", sans-serif; font-size: 11px; text-align: left; left: 10px; 
top: 308px; position: absolute; z-index: 15; visibility: visible; } 
#sprachnavi a { color: #999; font-weight: bold; text-decoration: none; } 
#sprachnavi a:hover { color: #000; }


.deutsch #sprachnavi #de, .francais #sprachnavi #fr, .english #sprachnavi #en { color: #000; }

/* -------------  Damit aktive Navigation aktiviert wird  ----------------*/

.haupt0 #logo a {
	background: url(../img/logo_berg02_over.gif) 0px 0px no-repeat;
	}

.haupt0 #haupt_navig .h00, .haupt1 #haupt_navig .h01,.haupt2 #haupt_navig .h02, .haupt3 #haupt_navig .h03 {
	color: #fff; background-color: #444;}

.sub1 #sub_navig .s01,.sub2 #sub_navig .s02, .sub3 #sub_navig .s03 {
	color: #fff; background-color: #444;}

.sub4 #sub_navig .s04,.sub5 #sub_navig .s05, .sub6 #sub_navig .s06 {
	color: #fff; background-color: #444;}






.page1 #seiten_navig .p1, .page2 #seiten_navig .p2, .page3 #seiten_navig .p3, .page4 #seiten_navig .p4 {
	color: #000; }




/* ------------------ Textformatierung -----------------------*/




/* 
h1, h2, h3 {font-family: arial, helvetica, geneva, "trebuchet ms", sans-serif; } */


h3, p, li, td {font-size: 11px; line-height: 15px; }
h3 {font-weight: bold}

p, h3, h2 {margin: 6px 5px 2px 7px;}
p+p, h3+p {margin-top: 0;}
p+h3, h3+h3 {margin-top: 12px ;}

#text h1+h2 {margin-top: 12px ;}
#text ul+h2 {margin-top: 22px ;}

#inhalt li {line-height: 14px; margin: 0 5px 0px 5px;} /* genau definiert, sonst gilt es auch für Fusszeile */
td {line-height: 13px; margin: 0 5px 5px 5px;}


/* ------- Aufzählungszeichen -------- */

#inhalt li, #inhalt ul, #inhalt ol {margin-top:0;margin-bottom: 0;}

#inhalt ul {margin-left:0em; padding-left:0; list-style-type:none }
#inhalt ol {margin-left:0.1em; padding-left:1.7em;}
#inhalt ul li {margin:3px 5px 3px 7px; line-height: 13px; padding-left:0.9em; background: transparent url(../css_js/strich_weiss.gif) 0px 4px no-repeat; }


#text li, #inhalt ul, #inhalt ol {margin-top:0;margin-bottom: 0;}

#text ul {margin-left:0em; padding-left:0; list-style-type:none }
#text ol {margin-left:0.1em; padding-left:1.7em;}
#text ul li {margin:3px 5px 8px 7px; line-height: 13px; padding-left:0.9em; background: transparent url(../css_js/strich_weiss.gif) 0px 4px no-repeat; }


a:link { color: #ccc;  }
a:visited { color: #aaa;  }
a:hover { color: #eee;}
a:active { color: #ccc;  }

/* ---------- Tabellen ------------- */

table {padding: 0; margin: 0; border: 0; 
	border-collapse:collapse;
	}



/* ---- Kursliste ---------- */
#kurse table {width: 260px; margin-top: 10px;}
#kurse td {border-top: solid 1px #333; border-bottom: solid 1px #333; line-height:17px;}
#kurse .spalte1 {width: 25px;}
#kurse .spalte2 {width: 80px;}

/* ---- Anmeldeformular ---------- */
input, textarea , select {font-family: verdana, arial, helvetica, sans-serif; font-size: 11px;}
form {padding: 0; margin: 0; border:0;}

#anmeldung table {width: 270px; margin-top: 5px;}
#anmeldung td {padding-top: 2px; line-height:18px; vertical-align:text-top;}
#anmeldung input {border: solid 1px #333; height:16px; width: 170px; padding: 0; margin: 0; }

#anmeldung .mittel {width: 119px;} /* mittlere länger für formular */
#anmeldung .kurz {width: 45px;} /* mittlere länger für formular */

#anmeldung textarea {border: solid 1px #333; height:90px; width: 170px;padding: 0; margin: 0; }
#anmeldung select {border: solid 1px #333; width: 170px;padding: 0; margin: 0; }
#anmeldung .spalte1 {width: 100px;}

.submit {position: relative; left: 100px; width: 70px; cursor:pointer; }



/* --------------  NEU ------------  */

.rot {color: red;}

/* kleiner Abstände bei den Aufzählungen */
#inhalt .langeliste li {margin:6px 0 0px 0; }


/* ----------- Bild-Navigation für Gallerie --------- */



.normal { 
	font-size: 13px; 
	font-family: verdana, arial, helvetica, sans-serif; 
	background-color: #444;
	background: url(../img/grau_444.gif) 0px 0px repeat;
}

#bild_gross {
	position: absolute;
	top: 90px;
}

#bild_gross img {border: 0px;}  /* Damit grosse Bilder keine Border haben */

/* Bild Text (für Gallerie) */
#bild_text {	
	position: absolute;
	top: 575px;
	width: 800px;
	}

#bild_text p {
	font-size: 14px;
	line-height: 130%;
	color: #fff;
	font-weight: bold; 
	}



#bild_navig { 
	position: absolute;
	text-align: left;
	width: 800px;
	top: 25px;
	left: 0px;
	/*border: 1px solid #333;*/
	}

#bild_navig ul {
	margin: 0 0 0 0; 
	padding: 0px; 
	border: 0px;
	}

#bild_navig li {
	float: left; 
	left:0px;
	top: 0px;
	/*line-height: 27px;
	width: 118px;*/
	height: 51px;
	margin-right: 3px;
	/*border: 1px solid #333; */
	background-color: #ccc;
	text-align: center;
	list-style: none;
	}

/* Verkleiner der Bilder als Thumbnails */
#bild_navig img {
	width: 72px;
	height: 51px;
	}




#bild img {border:0;}


#bild_navig img {
			border:0; padding: 0;
			-moz-opacity: 0.4; opacity: 0.4;} /* kein Rand bei Bilder */

#bild_navig img:hover {-moz-opacity: 1; opacity: 1;}

/* Damit aktive Bildnavigation dunkel ist */
.bild1 #bild_navig .b1 img, .bild2 #bild_navig .b2 img, .bild3 #bild_navig .b3 img {-moz-opacity: 1; opacity: 1;}
.bild4 #bild_navig .b4 img, .bild5 #bild_navig .b5 img, .bild6 #bild_navig .b6 img {-moz-opacity: 1; opacity: 1;}
.bild5 #bild_navig .b5 img, .bild6 #bild_navig .b6 img, .bild7 #bild_navig .b7 img {-moz-opacity: 1; opacity: 1;}
.bild8 #bild_navig .b8 img, .bild9 #bild_navig .b9 img, .bild10 #bild_navig .b10 img {-moz-opacity: 1; opacity: 1;}
.bild11 #bild_navig .b11 img, .bild12 #bild_navig .b12 img, .bild13 #bild_navig .b13 img {-moz-opacity: 1; opacity: 1;}


.weiss {background-color: #ccc; height:262px;}
#weiss {background-color: #ccc; }
#inhalt a:hover img {-moz-opacity: 0.5; opacity: 0.5; }

/* Damit Haupseite-Bild kein MausOver */
.haupt0 #inhalt a:hover img {-moz-opacity: 1; opacity: 1; }



/* ----------- Kontaktformular Error (eingebaut in formmail_vo.php --------- */
.error #text {padding-top: 200px; }
.error p {font-size: 11px;margin: 5px 0 5px 0; line-height: 15px; }

/* Kleine Navigation (Zurück / Drucken) */
.nav {position:relative;text-align: right;height:15px;z-index:30;/*border: 1px solid #fff;*/}