<!--
@import url("php_jkalender.css");
@import url("global_css3.css");


/***** allgemein-gültige Einstellungen: *********************/

body {
	margin: 0;
	/* oben | rechts/links | unten */
	padding: 4.6em 6.6em 3.2em; /* (Internet-Explorer: bei %-Angaben KEINEN Url-Zusatz '.../loose.dtd' in der Dokumenttyp-Deklaration!) */
	vertical-align: middle;
	font-family: Verdana,Helvetica,Arial,sans-serif; 
	font-size: 0.82em;
	background-color: #DDE;
	}

ul li {
	list-style-image: url('../images/arrow-right.gif'); 
	list-style-position: outside;
	}

img {
	border: 0;
	}

textarea {
	white-space: pre-line;
	}

.zeilenabst {
	padding: 0 0 17px;
	}

.padd_top {
	line-height: 17px;
	padding: 17px 0 0;
	vertical-align: baseline;
	}


/* Titelzeile über Aufzählungen: */
.ListTitel {
	border-top: 1px solid;
	border-left: 1px solid;
	margin-top: 2.82em !important;
	padding: 0.28em 0.21em !important;
	}


/* background-color bei a:hover img entfernen:
 * 
 * Das kann nicht funktionieren, weil a:hover den Link anspricht, während
 * a:hover img das Bild selbst. Eine Möglichkeit, einen Link anhand seines
 * Inhalts zu selektieren, gibt es nicht.
 */

.figure p a:hover,
.KleinBild a:hover {
	background-color: transparent;
	text-decoration: none;
	}


/*** Vorschaubild vor einem Link: ***/

li.KleinBild {
	list-style: none !important;
	margin: 0.82em 0;
	}
.KleinBild img {
	width: 120px;
	max-width: 120px;
	height: auto;
	border: 1px solid #aa7;
	margin-right: 0.42em;
	}
.KleinBild span {
	white-space: nowrap;
	}


/* Cursor über Titel: */
[title] {
        border-bottom: 1px dotted;
        cursor: help;
      }
ul li[title], 
img[title],
a[title] { /* ('ul li[title]' betrifft nur Titel im li-Tag selbst, aber NICHT <li>...<span title="...) */
        border-bottom: none;
        cursor: pointer;
      }
#footLED [title] {
        cursor: progress;
	}


/*****Kopfzeile**********************************************/

#Headline {
	height: 60px;
	margin: 0;
	padding: 0 0.2em 0 0;
	background-color: white;
	background-image: url("../fotos/bg/bg_headline.jpg");
	background-repeat: repeat-x;
	background-position: 0 0;
	border: 1px solid black;
	border-left-color: #A0A0A0; 
	border-top-color: #A0A0A0;
	overflow: hidden;
	}
#Headline h1, #Headline p {
	font-size: 100.01%;
	margin-top: 100px;
	}

/* z.Zt. ohne Verwendung:
#Headline img {
	float: left;
	margin: 0;
	}
#Headline b {
	color: #CC0000;
	font-weight: 700;
	line-height: 1.82em;
	margin-left: 0.14em;
	}
#Headline span {
	float: right;
	font-family: Arial,Verdana,Helvetica,sans-serif;
	font-size: 82.01%;
	line-height: 2.41em;
	vertical-align: top;
	padding-right: 0.2em;
	}
*/


/*****Haupt-Navigation*(Kopfzeile)***************************/

* html ul#Navigation {
	padding-bottom: 4px; /* Korrektur bis IE6 */
	}

ul#Navigation li {
	list-style: none;
	display: inline; 
	padding: 0;
	}


/* rechtes Bild-Logo in der Navi-Zeile: */
ul#Navigation li#nav_logo {
	float: right;
	}
ul#Navigation #nav_logo img {
	margin: 0 0.1em 0 0;
	}


/* Zusatz für Link im Logo und Flaggen: */
ul#Navigation #nav_logo a {
	width: auto;
	height: auto;
	padding: 0;
	border: 0;
	background-image: none;
	background-color: transparent;
	}
/* Logo und Flaggen mit 3D-Effekt: */
ul#Navigation #nav_logo a img {
	border: 1px solid #666666;
	border-left-color: #C0C0C0; 
	border-top-color: #C0C0C0;
	}
ul#Navigation #nav_logo a:hover img {
	border: 1px solid #C0C0C0;
	border-left-color: #666666; 
	border-top-color: #666666;
	}
/* Flaggen-Link positionieren: */
ul#Navigation #nav_logo #nav_flagge a {
	position: relative;
	top: 3px; /* (bei 10px Flaggenhöhe zuzügl. je 1px Rand oben und unten) */ 
	left: -8px;
	}

/*****Ende/Haupt-Navigation*(Kopfzeile)**********************/


/************************************************************/
/*****Content-Box:*******************************************/

/***global:***/

#Content {
	min-height: 330px;
	background-color: white;
	margin: 0;
	padding: 0.1em;
	border: 1px solid black;
	border-left-color: #A0A0A0; 
	border-top-color: #A0A0A0;
	clear: both;
	}
/* Höhen-Korrektur bis IE6 */
* html #Content {
	height: auto;
	}
* html #Content #bg_Foto { /* ( <p> füllt den gesamten Content-Bereich durchgehend aus!) */
	height: 330px; /* (größere Höhen werden im IE6 autom. dargestellt!) */
	}

/* linker und rechter Überstand der Hintergrundfarbe beim Text-Hyperlink: */
#Content ul li a, .KleinBild a span, .highlight_as_link {
	padding: 0 0.21em;
	}

#Content h3 {
	font-size: 120.01%;
	text-align: left;
	line-height: 1.2em;
	color: #aa7;
	font-weight: 500;
	border-bottom: 1px solid;
	padding: 0 0 0.2em 0;
	text-transform: uppercase;
	/* clear: both; */
	margin-top: 3em;
	}

#Content h4, .h_tag_Txt {
	font-size: 110.01%;
	text-align: left;
	line-height: 1.1em;
	color: #aa7;
	font-weight: 500;
	padding: 0 0 0.2em 0;
	/* clear: both; */
	margin-top: 1.2em;
	}

#Content small {
	color: gray;
	}

#Content .smaller {
	font-size: smaller;
	}


/* Überschriften im Content verlinken: */
#Content h3 a, #Content h4 a {
	color: #aa7;
	font-weight: 500;
	text-decoration: none;
	background-color: transparent;
	}


/***Info-Box***(rechts in Content-Box)***/

#Content #IBox {
	font-size: 0.8em;
	float: right;
	width: 160px;
	min-width: 12em;
	margin: 1.1em 0.42em 1.1em 0.8em;
	padding: 0.1em 0.2em 1.02em;
	/* background-color: #eee; */  /* (deaktiviert wg. Farbverlauf in CSS3) */
	border: 1px solid #666666;
	border-left-color: #C0C0C0; 
	border-top-color: #C0C0C0;
	}
#Content #IBox ul li {
	clear: left; /* (wg. 'float:left' bei images im <li>-Tag!) */
	margin-left: -1.2em;
	}
#Content #IBox ul li img {
	list-style: none;
	padding: 0;
	float: left;
	margin: 0.21em 0 0.21em -1.62em;
	}

#IBox #TagDatUhr {
	font-size: 10px;
	line-height: 1.4em;
	color: #aa7;
	margin: 0 0 0.4em 0.82em;
	}
#IBox #TagDatUhr #UhrText {
	margin-left: 0.22em;
	display: none;
	}


/* Radio-Schriftzug: */

.radio {
    list-style: none;
    font-family: bauhaus 93, arial, verdana, helvetica;
    font-weight: 400;
    font-size: smaller;
    color: green;
    }
.radio span:first-child {
    margin-left: 0.21em;
    font-weight: 600;
    font-size: larger; 
    }

/***Ende/Info-Box***/


/***Unter-Navigation*(links in Content-Box)***/

ul#NaviBox {
	/* linksbündige Buttons: */
	float: left;
	width: 7.74em; /* Breite beschränken für vertikale Anordnung! */
	margin: 2.94em 0 0.2em 0.12em;
	padding: 0.82em 0.01em;
	/* background-color: #eee; */  /* (deaktiviert wg. Farbverlauf in CSS3) */
	border: 1px solid #666666;
	border-left-color: #C0C0C0; 
	border-top-color: #C0C0C0;
	}

/* Unter-Navi fixieren: nur für moderne Browser! ('html>body' schließt alle Internet Explorer für Windows bis Version 6 und Netscape 4 aus) */
html>body div#Content ul#NaviBox {
	position: fixed;
	}
/* 'nach-oben-Button' im Unter-Navi zunächst ausblenden: */
div#Content ul#NaviBox li.liTOP {
	display: none;
	}
/* und nur in modernen Browsern bei 'position:fixed' wieder einblenden: ('html>body' schließt alle Internet Explorer für Windows bis Version 6 und Netscape 4 aus) */
html>body div#Content ul#NaviBox li.liTOP {
	margin-top: 2.1em;
	display: inline;
	}

ul#NaviBox li {
	float: left; /* (für Firefox bis Vers. 2.x) */
	list-style: none;
	padding: 0;
	}

/***Ende/Unter-Navigation***/


/***Haupt-Box***(Mitte in Content-Box)***/

#Main {
	min-width: 200px;
	max-width: 640px;
	margin: 0 14.2em 1em 12.01em;
	padding: 0 1em;
	border: none;
	}

* html #Main {
	height: 1em;  /* Workaround gegen den 3-Pixel-Bug des Internet Explorers */
	}

/* bei ausgeblendeter Info-Box den rechten Rand der Main-Box reduzieren: */
.Main_fewo_S4 {
	margin-right: 1em !important;
	}

#Main table {
	font-size: 0.82em;
	}
#Main table th {
	background-color: #EEE;
	}

#Main p iframe {
	width: 100%;
	}

/***Ende/Haupt-Box***/


/*** Hintergrundbild und Innenabstand im Content: ***/

/* Startseite: */
#home #Content {
	height: 330px;
	padding: 0;
	}

/* (Hintergrundbild wird extern in 'bg_home.inc.php' mit Zufallsbild gesteuert, darum hier nicht erforderlich!
#home #Content #bg_Foto {
	background-image: url("../fotos/bg/bg_home.jpg"); 
	background-repeat: no-repeat; 
	background-position: 0 0;
	}
*/

#home #Content #bg_Foto {
	width: 65%;
	height: 330px; /* (Einstellung erforderlich bei deaktiviertem JavaScript!) */

	float: left;
	margin: 0;
	padding: 0;

	z-index: 1; /* Ein Layer mit der höheren Zahl liegt über dem Layer mit der niedrigeren Zahl. */
	}
#home #Content #bg_Intro {
	position: relative;
	width: 33%;
	margin-left: 65%;
	z-index: 9999; /* Ein Layer mit der höheren Zahl liegt über dem Layer mit der niedrigeren Zahl. */
	}

/* bei kleiner Fensterbreite einen unteren Abstand zum Jahreszeit-Link freihalten: */
#home #Content h4 {
	margin-bottom: 2.81em;
	}

/* Jahreszeit-Link auf der Startseite: */
#JZlnk_home {
	position: absolute;
	bottom: 0;
	right: 0.21em;
	}
#JZlnk_home, 
#JZlnk_home a {
	color: #aa7;
	padding: 0 0.6em;
	}


/*** Wohnung: ***/
/* (Download-Button) */
#fewo #Content .InpBtn {
	width: auto;
	min-width: 6.2em;
	padding: 0.1em 0.82em;
	}
#fewo #Content #Main p iframe {
	max-width: 510px; /* (Anpassung an max. Foto-Breite in '.figure') */
	}


/*** Anreise: ***/

#anrs #Content #Main h4,
#anrs #Content #Main img { /* Fläche des Hintergrundbildes frei halten */
	margin-top: 300px;
	}
#anrs #Content #Main img.scaled { /* nicht bei skalierten Bildern! */
	margin-top: auto;
	}


/*** Preise: ***/

table#Preise {
	table-layout: fixed; /* (gleichmäßige Spaltenbreite) */
	background-color: #FFFFFF; /* (bei evtl. Tabellen-Übergröße!) */
	border-right: 1px solid gray;
	border-bottom: 1px solid gray;
	border-spacing: 1px;
	}
/* Tabellenbreite bis IE6 anpassen (wg. 'table-layout: fixed;') */
* html table#Preise {
	width: 400px;
	}
table#Preise th {
	white-space: nowrap;
	}
table#Preise td {
	vertical-align: top;
	white-space: nowrap;
	padding: 0.1em 0.2em;
	border: 1px solid #F0FFFF;
	border-right-color: gray; 
	border-bottom-color: silver;
	}
table#Preise .c {
	text-align: center;
	}
table#Preise .r {
	text-align: right;
	}
table#Preise .minisize {
	font-size: 0.82em;
	color: gray;
	}
table#Preise .boldsize {
	font-size: 100.01%;
	font-weight: 700;
	text-align: center;
	}


/*** Anfrage: ***/

* html #anfr #Content {
	height: 330px; /* Korrektur bis IE6 */
	}
#anfr #Main {
	margin: 0 14.2em 1em 0.2em;
	}
#anfr #Content table {
	margin: 4px 0;
	padding: 2px;
	/* background-color: #F0F0F0; */  /* (deaktiviert wg. Farbverlauf in CSS3) */
	border: 1px solid silver;
	border-left-color: gray; 
	border-top-color: gray;
	}
#anfr #Content table td {
	padding-left: 4px;
	}
#anfr #Content strong {
	color: #E00000;
	}
#anfr #Content b {
	white-space: nowrap;
	}
#anfr #Content input, #anfr #Content textarea, .cellRe {
	width: 240px;
	margin: 1px 0;
	padding: 0;
	}
#anfr #Content .InpPLZ {
	float: left;
	width: 58px;
	margin: 1px 0;
	padding: 0;
	}
#anfr #Content .InpOrt {
	float: right;
	width: 173px;
	margin: 1px 0 1px 4px;
	padding: 0;
	}
#anfr #Content .InpFrZ {
	width: 2.82em; /* geringere Breite gegenüber den globalen input-Breiten! */
	font-size: 0.9em;
	background-color: #F0F0F0;
	border: none;
	margin: 0.22em 0;
	padding: 0;
	}

/* Text für freie Zeichen: */
#anfr #Content p.FrZ {
	white-space: nowrap;
	vertical-align: baseline;
	}

#anfr #Content textarea {
	height: 8.22em;
	}
#anfr #Content .InpBtn {
	width: auto;
	min-width: 6.2em;
	padding: 0.1em 0.82em;
	}

/* Hintergrund bei Mouseover: */
#anfr #Content input:focus {
    background-color: #EEFFCC;
    }
/* deaktiviert: ändert in den Browsern die runden Button-Ecken in eckige Form!
#anfr #Content input:hover {
    background-color: transparent;
    }
*/
#anfr #Content input:active {
    background-color: #EEFFCC;
    }
#anfr #Content input.InpFrZ {
    background-color: transparent;
    }


/*** (Extras und) Mehr (Foto positionieren): ***/

#mehr #Content {
	height: 330px; /* (wg. 100% in '.breakout_left') */
	}
#mehr #Content #Main {
	position: relative; /* (für <ul>-Tagausrichtung) */
	height: 100%;
	border: 1px solid transparent; /* (ohne Border wird der folgende <ul>-Tag erst unterhalb des Rahmens dargestellt!) */
	margin-left: 180px; /* (größerer linker Abstand wg. Bild mit Schatten!) */
	}
#mehr #Content #Main ul {
	position: absolute;
	left: 15px;
	bottom: 0;
	margin: 0 0 0.4em;
	}
#mehr #Content .breakout_left {
	float: left;
	width: 160px;
	height: 100%;
	position: relative; /* (für Bildausrichtung) */
	margin-left: 0.4em;
	}
#mehr #Content .breakout_left img {
	position: absolute;
	bottom: 0;
	margin-bottom: 0.4em;
	}


/*** Belegung: ***/

#belg #Content {
	padding: 0.82em;
	}


/*** Impressum: ***/

#impr #Main th {
	height: 4em;
	text-align: left;
	color: #aa7;
	background-color: transparent;
	}
#impr #Main th,
#impr #Main td {
	padding: 0 1.2em;
	}
/* + Zeichen: gilt hier für th-Elemente, die unmittelbar auf ein th-Element hin folgen (gleiches gilt bei td-Elementen): */
#impr #Main th + th,
#impr #Main td + td {
	border-left: 1px solid #aa7;
	}

#impr #Main td.tabOben {
	font-size: smaller;
	color: #aa7;
	padding-top: 3.4em;
	}
#impr #Main td.tabUnten {
	padding-bottom: 3.4em;
	}
#impr #IBox p a:hover {
	background-color: transparent;
	}


/*** Fotos in der Größe anpassen (liegend und vertikal): ***/

div.figure, div.figure_vert {
/*	float: right; */
	min-width: 25%;
	/* background-color: #F0FFFF; */  /* (deaktiviert wg. Farbverlauf in CSS3) */
	border: 1px solid #D0D0D0;
	border-left-color: #aa7; 
	border-top-color: #aa7;
	margin: 2.2em 0;
	padding: 0.5em;
	}
div.figure {
	max-width: 510px;
	}
div.figure_vert {
	max-width: 310px;
	width: 75%; /* (zusätzl. Einschränkung bei Hochformat: 480 = 640 x 75%) */
	}
div.figure p, div.figure_vert p {
	text-align: center;
/*	font-style: italic; */
	font-size: smaller;
	text-indent: 0;		/* (keine Text-Einrückung!) */
	margin: 1.12em 0;	/* (optional) */
	padding: 0;		/* (optional) */
	}
div.figure p img.scaled, div.figure_vert p img.scaled {
	width: 100%;
	margin: 1px;
	}

/*****Ende/Content-Box:**************************************/
/************************************************************/


/***** Fußzeile: ********************************************/

#FussZ {
	font-size: 82%;
	height: 19px;
	overflow: hidden;

	/* Ausrichtung: links oder zentriert? */
	/* text-align: left; */
	text-align: center;

	vertical-align: middle;
	margin: 4.6em 0 0.4em 0; /* (Internet-Explorer: bei %-Angaben KEINEN Url-Zusatz '.../loose.dtd' in der Dokumenttyp-Deklaration!) */
	padding: 0 0.4em;
	border: 1px solid #F0FFFF;
	border-left-color: black; 
	border-top-color: black;
	color: gray;
	background-color: transparent;
	}
#FussZ a {
	color: #404040;
	font-weight: 400;
	text-decoration: none;
	}
#FussZ a:hover {
	color: #0099CC;
	text-decoration: none;
	background-color: transparent;
	}
#FussZ #footButton { 
	float: left;
	margin: 2px 0.2em;
	}
#FussZ #footButton img {
	margin-right: 0.2em;
	}
#FussZ #footButton a:first-child {	
	display: none; /* Link für history.back() wird nur mit JavaScript angezeigt! */
	}
#FussZ noscript {
	float: left;
	padding: 2px 0.2em 0;
	}
#FussZ #footLED {
	float: left;
	margin: 0.3em 0.2em 0;
	display: inline;
	}
#FussZ #copyR, #FussZ .FussZTxt {
	margin-left: 0.30em;
	padding: 0 0.18em;
	position: relative;
	top: -3px;
	}
#FussZ img#AN {
	margin: 1px 0.2em 0;
	}
#FussZ a:hover .FussZTxt {
	background-color: #303030;
	padding: 0.2em 0.18em;
	}
#FussZ #Counter {
	float: right;
	margin: 3px 0;
	}
/* EUROCOUNTER: */
#FussZ #ImgCounter {
	float: right;
	margin: 0 -0.4em 0 0.4em;
	/* bereits global in '#FussZ' definiert!
	height: 10px;
	overflow: hidden;
	*/
	}
#FussZ #ImgCounter img {
	margin-top: -2px;
	}
#FussZ #ImgCounter em {
	font-size: 0.62em;
	}


/***** Seiten aus anderen Verzeichnissen: *******************/

/*** Wetter ***/

#InfoWetter {
	background-color: #eee !important;
	position: absolute;
	top: -6px;
	left: -6px;
	margin: 0;
	padding: 0;
	}

-->

