/* CSS-Layout auf Grundlage von www.cssboxmania.com */

html {
	font-size: 62.5%;
	/* height: 100.5%; */
	overflow: auto;
}
body {
	font: 1.2em/1.8em Verdana, sans-serif;
	background: #BBBBD8 url(images/roback.gif);
}

* {margin: 0px; padding: 0px; border: 0px;}

/* Grundlayout mit Positionierung */
/* ############################## */

div#rahmenoben {
	top: 0px;
	left: 0px;
	right: 0px;
	width: 100%;
	height: 79px;
	overflow: hidden;
	text-align: right;
	background: transparent url(images/ropage.gif) no-repeat 20px 15px;
}

div#nav {
	font: 1.2em/1.8em Verdana, sans-serif;
	position: absolute;
	top: 65px;
	right: 40px;
	width: auto;
	/* height: 30px; */
	margin-right: 0px;
	z-index: 100;
}

div#rahmenlinks {
	float: left;
	width: 200px;
	overflow: hidden;
	/* background: green; */
}
div#menu { margin: 3.0em 10px 1.0em 20px; }

div#hauptrahmen {
	overflow: auto; 
	background: #FFFFFF;
	margin: 15px;
	border: 1px solid #000066;
}
div#maintext {
	margin: 3.0em; /* Sorgt für Randabstand der Texte*/
	margin-bottom: 0em;
}
p.breadcrumb {
	clear: both;
	margin: 0em;
	margin-top: 3em;
	padding: 0px;
	padding-left: 2em;
	border-top: 2px dotted #CCCCFF;

}
div#footer {
	clear: both;
	margin: 3.0em; /* Sorgt für Randabstand der Texte*/
	border-top: 2px dotted #CCCCFF;
	margin-bottom: 1.0em;
	margin-top: 0em;
}

body#bild div#hauptrahmen {
	background: #000033; /* Dunkler Hintergrund fuer Bildseiten */
	color: #EEEEFF; /* Helle Schriftfarbe fuer Bildseiten */
}
body#bild div#hauptrahmen a {
	color: #EEEEFF; /* Helle Linkfarbe fuer Bildseiten */
}

/* ENDE Grundlayout mit Positionierung */
/* ################################### */



/* Formatierung Kopfbereich */
/* ######################## */

div#rahmenoben h1 {
	border: 0px;
	margin: 0px;
	padding: 0px;
	margin-right: 50px;
	margin-top: 20px;
}
div#rahmenoben a {text-decoration: none;}

/* ENDE Formatierung Kopfbereich */
/* ############################# */



/* Allgemeine Schriftformatierung */
/* ############################## */

h1, h2, h3, h4, h5, h6 {
	font-family: Arial, sans-serif;
	font-weight: bold;
	margin: 1em 0em 0.3em 0em; 
	color: #000066;
	clear: both;
}
h1 {
	font-size: 2.3em;
	line-height: 150%;
	border-bottom: 2px dotted #CCCCFF; 
	padding-bottom: 0.2em;
}
h2 {font-size: 2.0em; padding-bottom: 0.3em;}
h3 {font-size: 1.8em;}
h4 {font-size: 1.6em;}
h5 {font-size: 1.4em;}
h6 {font-size: 1.2em;}

a { color:#0000FF; font-family: Arial, sans-serif; text-decoration: underline; }
a:link {}
a:visited { color:#000099; }
a:hover { color:#9900BB; }
a:active { color:#FF00FF; text-decoration: none; }

a.ext {font-style: italic;}

p {margin: 1em 0em;}

.clearboth {clear: both;}

p img {
	border: 1px solid #000066;
	margin: 20px;
	margin-top: 2px;
	padding: 10px;
	background: #DDDDEE;
}
.ohnerand {
	border: 0px;
	padding: 0px;
	margin: 2px 8px;
}

.rechts {float: right; margin-right: 0px;}
.links {float: left; margin-left: 0px;}
.center {text-align: center;}

p.bildtextrechts {
	float: right;
	text-align: center;
	font-size: 0.9em;
	line-height: 1.4em;
	padding: 0px;
	padding-bottom: 10px;
	margin: 20px;
	margin-right: 0px;
	margin-top: 0px;
	margin-bottom: 10px;
	border: 1px solid #000066;
	background-color: #DDDDEE;
}
p.bildtextrechts img {
	border: 0px;
	margin: 0px;
}

p.bildtextlinks {
	float: left;
	text-align: center;
	font-size: 0.9em;
	line-height: 1.4em;
	padding: 0px;
	padding-bottom: 10px;
	margin: 20px;
	margin-left: 0px;
	margin-top: 0px;
	margin-bottom: 10px;
	border: 1px solid #000066;
	background-color: #DDDDEE;
}
div.fotoblock .bildtextlinks {
	width: 270px;
}

p.bildtextlinks img {
	border: 0px;
	margin: 0px;
}

.fotoblock {
	/* background: red; */
	padding: 1em;
	margin: auto; /* Zentrierung nicht perfekt durch gesch&auml;tzte Breite */
	padding-left: 20px; /* Korrektur der gepfuschten Zentrierung */
	max-width: 590px;
}

div.zitatblock {
	background: #DDDDEE;
	padding: 1em;
	margin: auto; /* Zentrierung nicht perfekt durch gesch&auml;tzte Breite */
	padding-left: 20px; /* Korrektur der gepfuschten Zentrierung */
}

div.zitatblock p {
	text-align: center;
	background: #CCCCDD;
}

table.zitatblock {
	background: #DDDDEE;
}


blockquote {
	/* margin: 30px; */
	/* padding: 10px; */
	/* border: 1px solid #000066; */
}

blockquote {
	margin: 15px 60px;
	background: url(diverses/blockquote-raquo.gif) no-repeat;
	padding-left: 50px;
	border: 1px solid #000066;
}
blockquote p, blockquote li {
	padding-right: 50px;
	color: #000066;
}
blockquote ol {margin-bottom: 10px;}

blockquote .zitatende {
	background: url(diverses/blockquote-laquo.gif) no-repeat right bottom;
	padding-right: 50px;
}

q { quotes:'' '' '' ''; }

q, span.quote {
	color: #000066;
}

cite, blockquote cite {
	color: #333333;
	text-decoration: none;
	font-style: normal;
	font-size: 100%;
}


.bildbeschreibung {
	margin: 0px;
	margin-bottom: 10px;
	padding: 0px;
	width: 200px;
	/* trotzdem hor. Scrollbalken je nach Fensterbreite :( */
	float: left;
}

.bildbeschreibung cite {
	/* Ytterby Tafel, Zitatformatierung noch unvollst&auml;ndig */
	padding: 1em;
}

div#maintext ul {
	margin: 10px 0px;
	list-style-position: inside;
	/* list-style-type: none; */
	border-left: 8px solid #CCCCFF;
	padding-left: 20px;
}

em, strong {
	font-size: 100%;
	font-style: normal;
	font-weight: bold;
}
strong {background: #DDDDEE; padding: 2px;}

.lite {color: #666666;}

/* ENDE Allgemeine Schriftformatierung */
/* ################################### */



/* Formatierung Navigation und Menue */
/* ################################# */

div#nav li {display: inline; font-size: 1.0em;}
div#nav a {
	text-decoration: none; 
	font-weight: bold; 
	text-transform: uppercase;
	padding: 1px 8px; /* Ueber 1px schneidet IE die Button-Raender ab */
	border: 2px solid #9999FF;
	border-top: 2px solid #CCCCFF;
	border-right: 2px solid #CCCCFF;
	background: #FFFFFF;
}
div#nav a:hover {
	background: #DDDDEE;
	border: 2px solid #CCCCFF;
	border-top: 2px solid #9999FF;
	border-right: 2px solid #9999FF;
}

body#home li.navhome a,
body#persoenliches li.navpersoenliches a,
body#fotoseiten li.navfotoseiten a,
body#sonstiges li.navsonstiges a {
	background: #000099;
	color: #EEEEFF;
	border: 2px solid #CCCCFF;
	border-top: 2px solid #9999FF;
	border-right: 2px solid #9999FF;
}

div#menu ul {list-style-type: none;}
div#menu ul li {font-weight: bold; margin-top: 12px; margin-bottom: 8px;}
div#menu ul ul li {font-weight: normal; margin-left: 10px; margin-top: 0px; margin-bottom: 0px;}
div#menu ul ul ul li {line-height: 14px; font-weight: normal; margin-left: 30px; margin-top: 0px; margin-bottom: 0px;} /* 3. Ebene */
div#menu li a {text-decoration: none; font-weight: bold; text-transform: uppercase; border: 1px solid transparent; padding: 2px;}
div#menu li li a {text-decoration: none; font-weight: bold; text-transform: none;}

div#menu a:hover {color: #6666CC;}

/* Hervorhebung des aktiven Men&uuml;punkts */

body#home li.menustart, body#neu li.menuneu, body#kontakt li.menukontakt, body#impressum li.menuimpressum,
body#persoenliches li.menupersoenliches, body#wer li.menuwer, body#gb24-template li.menugb, body#editorial li.menueditorial, body#literatur li.menubuecher, body#poesie li.menupoesie, body#wt li.menuwt, body#wt-maerchen li.menuwt, body#wt-buecher li.menuwt, body#wt-buecher-borchers li.menuwt, body#wt-buecher-deppe li.menuwt, body#wt-buecher-jonsson li.menuwt, body#wt-buecher-suesskind li.menuwt, body#wt-rofrisch li.menuwt, body#wattwurm li.menuwt, body#web li.menuweb, body#faq li.menufaq,
body#fotoseiten li.menufotoseiten, body#reisefotos li.menureisefotos, body#heimatfotos li.menuheimatfotos, body#blechfotos li.menublechfotos, body#blechfotos-rheinuferbahn100jahre li.menublechfotos, body#bandfotos li.menubandfotos, body#bandfotos-wallisbird li.menubandfotos, body#fotokiste li.menufotokiste, body#fotogene li.menufotogene,
body#sonstiges li.menusonstiges, body#motherboard li.menumotherboard, body#tipp li.menutipp, body#sennso li.menusennso, body#turm li.menuturm, body#surftip li.menusurftip {
	color: #6666CC;
	background: #CCCCEE;
	border: 1px dotted #000099;
}



/* Ausblenden der jeweils nicht benoetigten Sprache und Rubriken: */

div#rubrik0d, div#rubrik1d, div#rubrik2d, div#rubrik3d, div#rubrik0e, div#rubrik1e, div#rubrik2e, div#rubrik3e { display: none; }

body#home.deutsch div#rubrik0d, body#home.deutsch div#rubrik1d,
body#home.deutsch div#rubrik2d, body#home.deutsch div#rubrik3d { display: block; }

body#home.english div#rubrik0e, body#home.english div#rubrik1e,
body#home.english div#rubrik2e, body#home.english div#rubrik3e { display: block; }

body#persoenliches.deutsch div#rubrik1d, body#persoenliches.english div#rubrik1e,
body#fotoseiten.deutsch div#rubrik2d, body#fotoseiten.english div#rubrik2e,
body#sonstiges.deutsch div#rubrik3d, body#sonstiges.english div#rubrik3e { display: block; }


p.inenglish {
	/* Faehnchen 'This page is also availible in english' */
	background: #DDDDEE url(images/xeng.gif) no-repeat 5px 4px;
	padding-left: 30px;
	margin-left: 100px;
	margin-right: 100px;
}

p.aufdeutsch {
	/* Faehnchen 'Diese Seite gibt es auch auf deutsch' */
	background: #DDDDEE url(images/xdeu.gif) no-repeat 5px 4px;
	padding-left: 30px;
	margin-left: 100px;
	margin-right: 100px;
}


/* ENDE Formatierung Navigation und Menue */
/* ###################################### */



/* Formatierungen bestimmter Seitenelemente */
/* ######################################## */


p.unterschrift {
	/* Unterschrift 'Euer Roland' in den Editorials */
	margin-left: 40px;
	margin-bottom: 40px;
	font-style: italic;
	font-weight: bold;
}

h3.pfeilrahmen {
	/* Angeschraegte blaue Box entsprechend Gifs im alten Layout */
	background: transparent;
	border: 0px;
	border-top: 35px solid #2200DD;
	border-right: 35px solid transparent;
	width: 180px;
	height: 0px;
}

h3.pfeilrahmen a {
	color: #EEEE00;
	position: relative;
	top: -28px;
	left: 10px;
	text-decoration: none;
	font-style: italic;
}
div.pfeilrahmen ul {
	/* Formatierung der Menueliste unter dem Pfeilrahmen */
	list-style-type: none;
	background: #DDDDEE;
	position: relative;
	left: 250px;
	top: -40px;
	width: 300px;
}


body#neu h3 {
	font: 1.2em/1.8em Verdana, sans-serif;
	font-weight: bold;
	padding-top: 0.3em;
	padding-bottom: 0em;
	margin-botom: 0em;
}
body#neu p { margin: 0em; }

p.kiste {
	/* Kiste 'Wie gefaellt dir? ... Gaestebuch' */
	clear: both;
	background: #DDDDEE;
	border: 1px solid #000066;
	margin: 20px;
	padding: 10px;
	font-weight: bold;
}

div.liste {
	/* Wrapper fuer Angebotslisten */
	background: url(images/verlauf-horizontal1.png) repeat-y;
	border: 1px solid #000066;
	padding: 1em;
	margin: 30px;
}
div.liste h2 {
	/* Listen-Name */
	border-bottom: 2px dotted #000066; 
	padding-bottom: 0.3em;
}

div.liste h3 {
	/* Stand (Versionsdatum) der Liste */
	font: 1.2em Verdana, sans-serif;
	font-weight: normal;
	font-size: 1.2em;
	padding-left: 50px;
	color: #000066;
}

div.liste strong {
	/* Zeile mit Links zu den Listen (.rtf und .pdf) */
	padding-left: 50px;
	font-weight: normal;
	font-size: 130%;
	background: transparent;
}

div.liste strong a {
	/* Links zu den Listen (.rtf und .pdf) */
	text-decoration: none;
	border-bottom: 1px solid;
	padding-bottom: 2px;
}

div.liste em {
	/* Anzahl der Seiten */
	background: transparent;
	padding-left: 50px;
	font-weight: normal;
	font-size: 100%;
	color: #000066;
}

div.liste p {
	/* Erklaerungstext zur Liste */
	background: transparent;
	padding-left: 50px;
	font-weight: normal;
	font-size: 100%;
}

div.liste .lite {
	/* Hinweis Dateigroesse */
	color: #000066;
}

div#adressbox {
	clear: both;
	width: 400px;
	margin: auto;
	border: 1px solid #000099;
	padding: 1em;
	/* background: #EEEECC; */
	background: url(images/verlauf-horizontal2.png) repeat-y right top;
}
div#adressbox p {
	padding: 0em;
	padding-left: 180px;
}
div#adressbox h5, div#adressbox h6 {
	position: absolute;
	margin-left: 5px;
	margin-top: 15px;
}
div#adressbox h6 {
	margin-top: 40px;
}

p.flageng {
	/* Faehnchen vor Absaetzen, die deutsch/englisch gekennzeichnet sind */
	background: transparent url(images/xeng.gif) no-repeat 5px 4px;
	padding-left: 30px;
}
p.flagdeu {
	background: transparent url(images/xdeu.gif) no-repeat 5px 4px;
	padding-left: 30px;
}

div#footer p {
	text-align: center;
}

div.printinfo {display: none;}

/* ENDE Formatierungen bestimmter Seitenelemente */
/* ############################################# */



/* Star-HTML-Hack fuer IE 5.5 und 6 */
/* ################################ */

* html body {
	padding: 120px 0 0 200px;
	/* Rückt den body-Bereich 120px weg von oben und 200px weg von links*/
}
* html #hauptrahmen {
	height: 100%; 
	width: 100%; 
}
* html #rahmenoben {
	width: 100%;
}

/* ################################ */