/*
-----------------------------------------------
mobulu.com Screen Style
Author:   Robert Hilbe
Version:  9 Dezember 2006
----------------------------------------------- */

* {
	margin: 0;
	padding: 0;
   }

body {
   margin: 0;
   padding: 0;
   font: small/1.5em georgia,times,'times new roman',serif;
   color: #222;
   background: #fff;
   text-align: center;
/* background: #fff url(/img/layout.png) no-repeat 50% 0; */
   }

hr {
   display: none;
   }

abbr, acronym, .help {
   border-bottom: dotted 1px #aaa;
   cursor: help;
   }

.clear {
   clear: both;
   }

/* =Links
----------------------------------------------- */
   
a {
   text-decoration: none;
   font-weight: bold;
   border-bottom: 1px solid #888;
   color: #222;
   }

a:hover {
   color: #555;
   border-bottom: 1px solid #333;
   }

a img {
   padding: 3px 0;
   border: none;
   text-decoration: none;
   }

a.next:after, .next a:after {
   content: "\2192";
   white-space: nowrap;
   padding-left: 2px;
   }

a.previous:before, .previous a:before {
   content: "\2190";
   padding-left: 0;
   padding-right: 2px;
   }

a.more:after, .more a:after {
   content:" \00BB";
   font-weight: bold;
   white-space: nowrap;
   padding-right: 2px;
   }

/* =Container
----------------------------------------------- */

#container {
   margin: 25px auto;
   width: 900px;
   font-size: 105%;
   text-align: left;
   position: relative;
   }

/* =Header
----------------------------------------------- */

#header {
   height: 117px;
   position: relative;
   }

#logo {
   position: absolute;
   top: 0;
   left: 40px;
   }

#header h1 {
   position: absolute;
   top: 35px;
   left: 230px;
   text-align: right;
   font: 30px/1em 'adobe jenson pro light',times,serif;
   color: #000;
   }

#header p {
   position: absolute;
   top: 70px;
   left: 230px;
   text-align: left;
   font: 18px/1em 'adobe jenson pro light',times,serif;
   }

#header a {
   color: #900;
   border: none;
   }

#header a:hover {
   color: #000;
   border-bottom: 1px solid #900;
   }

#header a:active {
   color: #900;
   }

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

#navigation {
   margin: 0 0 10px 0;
   padding: 0 0 0 230px;
   height: 40px;
   line-height: 40px;
   color: #000;
   list-style: none;
   background: url(/img/navigation-bg.png) repeat-x 0 35px;
   }

#navigation li {
   float: left;
   }

#navigation li a {
   padding: 0 30px 0 0;
   display: block;
   text-decoration: none;
   border: none;
   font: 20px/35px georgia,times,serif;
   background: url(/img/navigation-li-a-bg.png) no-repeat 85% 50%;
   }

li#nav-meisterschaft a {
   background: url(/img/navigation-li-a-bg.png) no-repeat 90% 50%;
   }

#navigation li a.last {
   background: none;
   }

#navigation li a:hover {
   color: #900;
   }

#navigation li ul {
   display: none; 
   position: absolute;
   text-indent: 2px;
   padding: 0 10px 11px 1px;
   position: absolute;
   overflow: hidden;
   list-style: none;
   width: 170px;
   background: url(/img/navigation-ul-ul-bg.png) no-repeat 0 100%;
   z-index: 100;
   }

#navigation li:hover ul, #navigation li.hover ul {
   display: block;
   }

#navigation li li a {
   height: 25px;
   padding: 0 0.5em;
   width: 142px;
   text-decoration: none;
   border: none;
   font: 110%/25px georgia,times,serif;
   background: none;
   }

#navigation li li a:hover {
   padding: 0 0.5em;
   background: #333;
   color: #fff;
   }

#navigation li li a:active {
   background: #000;
   color: #fff;
   }


/* =video
----------------------------------------------- */

#video {margin: 0 0 10px 0;
   padding: 0 0 0 230px;
	}
/*#video li {
   float: none;
   }
#video li a {
 /*  padding: 0 30px 0 0;
 /*  display: block;
   text-decoration: none;
   border: none;
   font: 20px/35px georgia,times,serif;
   background: url(/img/navigation-li-a-bg.png) no-repeat 85% 50%;
   }


/* =Content
----------------------------------------------- */

#content {
   margin: 0 20px 20px 0;
   padding: 20px;
   width: 600px;
   float: left;
   z-index: 50;
   min-height: 300px;
   }

#content h2 {
   margin: 0.7em 0;
   color: #900;
   font-weight: bold;
   }
 
 #content h3 {
   margin: 0.7em 0;
   color: #000;
   font-size: 130%;
   font-weight: bold;
   }

#content h4 {
   margin: 0.6em 0 0.6em 0;
   font-weight: bold;
   color: #222;
   font-size: 105%;
   }

#content p {
   margin: 0 0 0.7em 2em;
   }

#content ul {
   margin: 3px 0;
   padding: 0;
   list-style: none;
   }

#content ul li {
   margin: 0;
   padding: 0 0 0 20px;
   background: url(/img/content-li.gif) no-repeat;
   }
   
#content rot {
   color: #900;
   }

   
/* =Side
----------------------------------------------- */

#side {
   margin-top: 40px;
   width: 200px;
   float: left;
   }

#side h2 {
   margin: 0 0 0.5em;
   font-size: 120%;
   color: #333;
   }

#side rot {
	color: #900;
	}

#side ul {
   list-style: none;
   }

#side li a {
   padding: 1px 3px;
   border: none;
   display: block;
   }

#side li a:hover {
   color: #fff;
   background: #900;
   }

#side li a:active {
   background: #000;
   }

#side2 {
	margin-top: 40px;
	width: 150px;
	float: left;
	margin-left: 50px;
   }

/* =Footer
----------------------------------------------- */

#footer {
   margin: 10px;
   font-size: 90%;
   line-height: 1.2em;
   color: #555;
   text-align: center;
   clear: both;
   }

#footer a {
   color: #555;
   }

/* =Search
----------------------------------------------- */

#search {
   margin: 10px 0 20px 0;
   padding: 0;
   }

#search .button {
   background: #fff;
   color: #666;
   font-weight: bold;
   }

/* =Classes
----------------------------------------------- */

.underline {
   text-decoration: underline;   
   }

.message {
   padding: 4px 0;
   font-weight: bold;
   color: #a00;
   clear: both;
   }

.bild_text {
	align: absmiddle   
   }

.left {
   text-align: left;
   }

.right {
   text-align: right;   
   }
 
 .center {
   text-align: center;   
   }

.top {
   margin: 0;
   padding: 0 25px 0 0;
   height: 1em;
   line-height: 1em;
   display: block;
   font-size: 90%;
   font-weight: normal;
   text-align: right;
   color: #fff;
   background: url(/img/top.gif) no-repeat 100% 50%;
   border: none;
   }

.top:hover {
   border: none;
   }

/* Hide text on screen but not for screenreaders */

.screenreader {
   position: absolute;
   left: -9000px;
   width: 0;
   overflow: hidden;
   }

/* =Tables
----------------------------------------------- */

table {
	margin: 0 10px 10px 10px;
	empty-cells: show;
	border-collapse: collapse;
	border-top: 2px solid #900;
	border-left: 1px dotted #aaa;
   }

caption {
   font: bold 130%/2em georgia,'times new roman',times,serif;
   letter-spacing: 0.02em;
   color: #999;
   }

th, td {
   padding: 5px 8px;
   background: #fff;
   font-size: 90%;
   line-height: 1.2em;
   border-bottom: 1px solid #900;
   border-right: 1px dotted #aaa;
   overflow: hidden;
   }

tr:hover td {
   background: #f3f3ff;
   }

th {
   background: #f3f3ff;
   font-weight: bold;
   }
   
tr.rot {
	color:#900;
	}

tr.trenn {
	border-bottom: 3px solid #000000;
	}


/* =Forms
----------------------------------------------- */

fieldset {
   margin: 0;
   padding: 0;
   font-size: 105%;
   border: none;
   }

legend {
   text-transform: uppercase;
   letter-spacing: 0.02em;
   font-size: 110%;
   line-height: 2em;
   }

textarea {
   width: 80%;
   max-width: 80%;
   }

input, textarea {
   margin: 2px 0;
   padding: 2px;
   font: 95%/1.2em 'helvetica neue',helvetica,arial,sans-serif;
   background: #fff url(/img/input-bg.gif) 0 0 repeat-x;
   border-top: 1px solid #7c7c7c;
   border-right: 1px solid #c3c3c3;
   border-left: 1px solid #c3c3c3;
   border-bottom: 1px solid #ddd;
   }

form dl {
   margin: 0;
   }

form dd {
   margin: 0 0 1em;
   }

.button, .button:hover {
   margin: 0 5px;
   padding: 4px;
   font: 98% helvetica,arial,sans-serif;
   color: #fff;
   background: #678;
   border: none;
   }

/**-------------------------------------------------------------------------------------------

Stylesheet-Datei für das Gästebuch 

Bei manchen Elementen könnten die Pfade anzugleichen sein...
Momentan sind alle Hintergrundbilder wie folgt referenziert:
"images/bild.gif" 

*/


/* das "gaestebuch"-DIV */
#gaestebuch {
	margin: 100;
	padding: 1em 0 0 0;
	text-align: center;
}

/* Bilder immer vertikal mittig */
#gaestebuch img {
	vertical-align: middle;
}

/* verlinkte Bilder ohne Rahmen */
#gaestebuch a img {
	border: none;
}

/* die Menü-Zeile */
#gaestebuch p#menue {
	margin: 0 2em 1em 2em;
	border-top: 1px solid #c0c0c0;
	border-bottom: 1px solid #c0c0c0;
}

/* Das Formular */
#gaestebuch form {
	text-align: left;
	padding: 0;
	margin: 0 1em;
}

/* Textabsätze im Formular */
#gaestebuch form p {
	text-align: left;
}

/* betrifft Textabsätze mit class="zentriert" */
#gaestebuch form p.zentriert {
	text-align: center;
}

/* Das DIV um die Eingabefelder herum, beim ersten Eintragen */
#gaestebuch form #angaben {
	float: left;
	width: 50%;
}

#gaestebuch form #angaben p {
	text-align: left;
}

#gaestebuch form #angaben p img {
	padding-right: 5px;
}

/* diese Zeile versteht der IE nicht, daher sind bei ihm die Eingabefelder nicht über die verfügbare Länge */
#gaestebuch form #angaben p input[type=text] {
	width: 100%;
}

/* wieder der Eingabebereich, allerdings in der Vorschau */
#gaestebuch form #angaben2 {
	float: left;
	width: 50%;
}

#gaestebuch form #angaben2 p {
	text-align: right;
	margin: 0;
	padding: 0;
}

#gaestebuch form #angaben2 p img {
	padding-right: 5px;
}

#gaestebuch form #angaben2 p input[type=text] {
	width: 90%;
}

/* Die Eingabe-Box für die Nachricht */
#gaestebuch form textarea {
	width: 100%;
}

/* Das ist die Liste der Einträge (<dl>-Element). Sie besteht aus <dt>- und <dd>-Elementen. Im <dt> steht der Autor und seine Daten,
im <dd> steht seine Nachricht. */
#gaestebuch dl {
	font-size: 100%;
	font-family: sans-serif;
	margin: 0 2em;
	padding: 0;
}

/* Die "Kopfleiste" eines jeden Eintrags mit dem Namen des Autors, etc. */
#gaestebuch dt {
	text-align: left;
	margin: 0;
	padding: 1em 0 0.5em 4em;
	color: #204060;
	border: 1px solid #c0c0c0;
	border-bottom: none;
}

/* Dieses span umschließt den Autor. */
#gaestebuch dt span {
	font-weight: bold;
}

/* Icons in der Kopfleiste eines jeden Eintrags */
#gaestebuch dt img {
	vertical-align: middle;
}

/* Der eigentliche Text des Eintrags */
#gaestebuch dd {
	text-align: left;
	margin: 0;
	padding: 0.5em 2em 1em 2em;
	margin-bottom: 1em;
	border: 1px solid #c0c0c0;
	border-top: none;
}

/* Einstellungen für diverse Meldungs-Texte */

/* Fehlermeldung (<p>-Element) */
#gaestebuch .fehler {
	font-size: 100%; display: block;  margin: 0 auto; border: 1px solid red;
}

/* Warnung  (<p>-Element, beinhaltet das bewarnte <input>-Element) */
#gaestebuch .warnung {
	color: #ff0000;
}
#gaestebuch .warnung input {
	background-color: #fff0f0;
}

/* Erfolgsmeldung (<p>-Element) */
#gaestebuch .erfolg {
	display: block;
	border: 1px solid #00ff00;
	background: #eeffee;
	margin: 1em 2em;
	padding: 0.5em;
}

/* dieses <div> enthält den HTML-Code aus der Datei "scripts/meldung.html" */
#gaestebuch #hinweis {
	float: right;
	border: solid 1px #ff0000;
	width: 45%;
	text-align: left;
	margin: 0px auto 20px auto;
	padding: 0.5em;
	background-color: #ffdfdf;
}

#gaestebuch #hinweis h2 {
	margin: 0;
	padding: 0;
	font-size: 110%;
}

/* Smilies-Box (<div>) */
#smileys {
	display: none;
	float: right;
	width: 45%;
}

/* eine Klasse für den Link, der zur Eingabemaske führt */
.neues-posting {
	margin: 0;
	padding: 0 0 0 18px;
	background: url(../gaestebuch/images/edit.gif) no-repeat;
}

pre { display: block; position: absolute; top: 50px; right: 10px; width: 350px; padding: 10px; text-align: left; border: 2px solid red; background: #ffeeee; overflow: auto; }



/* =Debug 
-----------------------------------------------

div {
   border: 1px solid red;
   }
   
p {
   border: 1px solid green;
   }

ul, li, a {
   border: 1px solid blue;
   }
*/