body {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:70%;
	background:#fff;
	color:#666666;
}

/* Header styles */

#header {
	background:#731124;
	height:90px;
	height:99px;
}
#logo {
	margin:0;
	padding-top:7px;
	padding-left:10px;
	float:left;
	width:250px;
}

/* Column styles */

.holygrail {
	background:#fff;					/* Right column background colour */
}
.holygrail .colmid {
	background:#fff;					/* Centre column background colour */
}
.holygrail .inhalt {
	background:#fff;					/* Farbe fuer die Mitte muß hier nochmals definiert werden damit die Ecken in der richtigen Farbe abgerundet werden */
	max-width:70em;
}
.holygrail .colleft {
	background:#fff;					/* Left column background colour */
}

/* Footer styles */

#footer {
	margin:3px 0 0 0;
	text-align:center;
/*	background:#731124; */
	color:#666666;
	font-style:italic;
	font-size:0.8em;
}
#footer p {
	padding:2px;
}

/* Allgemeines */

h1, h2, h3, h4, h5, h6 {
	color:#731124;
	margin:0 0 .6em 0;
	padding:0;
	font-weight:bold;
}

h1 {font-size:2.1em; background:#731124; padding:5px 10px 5px 10px; color:#FFFFFF; margin-bottom:30px;}
h2 {font-size:1.8em; border-top:1px solid #666666; border-bottom:1px solid #666666; padding: 8px 0 8px 0;}
h3 {font-size:1.5em;}
h6 {font-size:1.4em;}					/* h6 wird als Boxenueberschrift in den Spalten rechts und links verwendet */

p {
/*	font-size:1.1em; */
	padding:0 0 0.5em 0;
}
hr {
	color:#666666;
}

.cleaner {								/* beendet Floating */
	clear:both;
	height:1px;
	font-size:0px;
	border:0px none;
	margin:0;
	padding:0;
	background:transparent;
}
.abstand {								/* sorgt für Abstand z.B zwischen zwei Menus in den Spalten */
	height:15px;
}
.abstand_gross {								/* sorgt für Abstand z.B zwischen zwei Menus in den Spalten */
	height:40px;
}
.rahmen	{								/* bei Bildern, roter Rahmen, 3 px */
	border:3px solid #731124;
}
.eingerueckt {
	padding:0 3em;
}
.eingeruecktMediaContent {				/* für AGB, Datenschutz etc */
	padding:1em 2em;
}
.klein {
	font-size:.8em;
}
.gross {
	font-size:1.3em;
	font-weight:bold;
} 
.rot {
	color:#731124;
}
.fett {
font-weight:bold;
}
.schmal {
	max-width:400px;
}
.closed {								/* Begriffe */
	display:none;
	visibility:hidden;
}
.smallHeading {							/* kleine Überschrift, unterstrichen im Content Bereich */
	padding-bottom:3px;
	border-bottom:1px solid #666666;
	margin-bottom:0.8em;
	font-weight:bold;
}
.imagefloatleft {						/* Text umfließt Bild, links ausgerichtet */
	float: left;
	padding: 0px 25px 25px 0px;
}
.imagefloatright {						/* Text umfließt Bild, rechts ausgerichtet */
	float: right;
	padding: 0px 0px 25px 25px;
}
ul li {
	padding-bottom:1em;
	list-style-type:square;
}
ol li {
	padding-bottom:0.5em;
}

/* Twitter Blog in Sidebar */

#twitter_div {
	font-size:0.9em;
	margin-top:0px;
	padding-top:0px;
	padding-right:0px;
	padding-left:0px;
	border:none;
/*	max-height:200px;
	overflow:scroll; */
	width:150px;
}
 
#twitter_div ul li {
	color: #666666;
	border-bottom-style: solid;
	border-bottom-width: 1px;
	border-bottom-color: #731124;
	width:140px;
	text-align:left;
	padding:8px 0;
	margin:0 0 0 -25px;
}
 
#twitter_div ul li a {
	text-decoration: none;
	color: #731124;
}
 
#twitter_div ul li a:hover {
	text-decoration: none;
	color: #f05d13;
}
 
#twitter_div p {
	text-align: center;
	padding-top:5px;
	padding-bottom:5px;
}

#twitter_div a {
	color:#731124;
	font-weight:normal;
	text-decoration:none;
}
#twitter_div a:active {
	color:#862D2D;
	font-weight:normal;
	text-decoration:none;
}
#twitter_div a:hover {
	color:#f05d13;
	font-weight:normal;
	text-decoration:underline;
}

/* Definition Slideshow */

.slideshow {
    height:232px;
    width:232px;
    padding:0;
    margin:0;
	overflow:hidden;
}
.slideshow img {
    padding:13px;
    border:3px solid #731124;
    background-color: #e8e8e8;
    width:200px;
    height:200px;
    top:0;
    left:0;
}
/* Definition Slideshow ohne Rahmen */

.slideshow_or {
    height:233px;
    width:200px;
    padding:0;
    margin:0;
	overflow:hidden;
}
.slideshow_or img {
    padding:0px;
    border:0px solid #731124;
    background-color: #e8e8e8;
    width:200px;
    height:233px;
    top:0;
    left:0;
}

/* Definition Bilder Flyout */

/* Definition Bilder Flyout Variante 1, einfacher Rahmer der erst beim vergrößern auftaucht */

.flyout_gal_var_1 img {
	border:0;
} 
.flyout_gal_1 {
	position:relative;
	margin-top:20px;
	border:0;
}
.flyout_gal_1 img {
	position:relative;
	margin:20px;
	border:0;
}
#loader1 {
	background-color:#fff;
	border:2px solid #731124;
}

/* Definition Bilder Flyout Type 2, doppelter Rahmen, bei Thumb und beim großen Bild */
.flyout_gal_2 {
	position:relative;
	margin-top:20px;
	border:0;
}
.flyout_gal_2 img {
	position:relative;
	margin:20px;
	border:5px double #731124;
}
#loader2 {
	background-color:#FFF;
	border:8px double #731124
}

/* Definition Bilder Flyout Type 3, im Fließtext, ohne so großen Abstand */

.flyout_gal_3 {
	position:relative;
	margin-top:0px;
	border:0;
	float:left;
}
.flyout_gal_3 img {
	position:relative;
	margin:0 35px 25px 0;
	border:5px double #731124;
}
#loader3 {
	background-color:#FFF;
	border:8px double #731124
}

/* Definition Bilder Flyout ohne Rahmen */

.flyout_gal_var_or img {
	border:0;
} 
.flyout_gal_or {
	position:relative;
	margin:0;
	margin-top:-10px;
	border:0;
}
.flyout_gal_or img {
	position:relative;
	margin:0px;
	border:0;
}
#loader_or {
	background-color:#fff;
	border:0px solid #731124;
}


/* Definition von Listen in der Sitemap */

.sitemap_stufe1 ul {
	padding:0;
}
.sitemap_stufe1 li {
	padding:0;
}
.sitemap_stufe1 ul {
	padding:1em 0 1em 1em;
}
.sitemap_stufe2 li {
	padding-left:0;
}

.error {								/* Formatiert Fehlermeldungen im Content Bereich */
	border:2px solid #731124;
	padding:1em;
	margin:1em;
	text-align:center;
}
.errorklein {
	color:#731124;
}

/* Definition Highlightning der Suchergebnisse */

.searchword  {color: #000; background-color: #FF9900; border: 1px dotted #ccc;}
.searchword0 {color: #000; background-color: #FF9900; border: 1px dotted #ccc;}
.searchword1 {color: #000; background-color: #FF9900; border: 1px dotted #ccc;}
.searchword2 {color: #000; background-color: #FF9900; border: 1px dotted #ccc;}
.searchword3 {color: #000; background-color: #FF9900; border: 1px dotted #ccc;}
.searchword4 {color: #000; background-color: #FF9900; border: 1px dotted #ccc;}
.searchword5 {color: #000; background-color: #FF9900; border: 1px dotted #ccc;}
.searchword6 {color: #000; background-color: #FF9900; border: 1px dotted #ccc;}

/* Definition für Links allgemein */

.inhalt a {
	color:#731124;
	font-weight:bold;
	text-decoration:none;
}
.inhalt a:active {
	color:#862D2D;
	font-weight:bold;
	text-decoration:none;
}
.inhalt a:hover {
	color:#f05d13;
	font-weight:bold;
	text-decoration:underline;
}

/* Definition für Links in der rechten Spalte */

.rightcol a {
	color:#731124;
	font-weight:bold;
	text-decoration:none;
}
.rightcol a:active {
	color:#862D2D;
	font-weight:bold;
	text-decoration:none;
}
.rightcol a:hover {
	color:#f05d13;
	font-weight:bold;
	text-decoration:underline;
}

.boxleft {
	background:#731124;
	padding:3px;
	text-align:center;
}

/* Box mit Rahmen und Ueberschrift, z.B. fuer Collection oder Filme */

ul.box_rahmen, ul.box_rahmen li {
	margin:0;
	padding:0;
	list-style:none;
}
ul.box_rahmen li {	
	width:170px;
	text-align:center;					/* zentriert den Inhalt in den Boxen, p wird spaeter links ausgerichet */
}
ul.box_rahmen.links {					/* floated Box im Content Bereich nach links und setzt Abstände */
	margin:0 15px 15px 0;
	float:left;
}
ul.box_rahmen.rechts {					/* floated Box im Content Bereich nach rechts und setzt Abstände */
	margin:0 0 15px 15px;
	float:right;
}
ul.box_rahmen h6 {
	margin:0px;
	padding:5px 3px 1px 3px;
	text-align:center;
	color:#fff;
	background:#731124;
}
ul.box_rahmen p {
	margin:0;
	padding:5px 8px 15px;
	text-align:left;
}
ul.box_rahmen div {						/* Standardfuellfarbe weiss wenn keine Klasse fuer das div definiert wird */
	background:#fff;
	border:3px solid #731124;
}

/* Definition fuer Box mit Rahmen, Def. der Rahmen- und Fuellfarbe, Variante One */
li.box_rahmen_one h6 {background:#731124; color:#fff;}
li.box_rahmen_one div {border:3px solid #731124;}
ul.box_rahmen .box_rahmen_innen_one {background:#e8e8e8;}
/* Definition fuer Box mit Rahmen, Def. der Rahmen- und Fuellfarbe, Variante Two */
li.box_rahmen_two h3 {background:#FFBD00;}
li.box_rahmen_two div {border:3px solid #FFBD00;}
ul.box_rahmen .box_rahmen_innen_two {background:#ffffef;}
/* Definition fuer Box mit Rahmen, Def. der Rahmen- und Fuellfarbe, Variante Three */
li.box_rahmen_three h3 {background:#e3a1c4;}
li.Box_rahmen_three div {border:3px solid #e3a1c4;}
ul.box_rahmen .box_rahmen_innen_three {background:#ffffe5;}

/* Definition fuer Formulare und Buttons */

fieldset {
	width:45em;
	margin:1em auto;
	padding:1em;
	display:block;
	border:1px solid #666666;
	background:#fff;
	clear:both;
}
* html fieldset {
	padding:1em;
}
legend {
	background: #731124;
	padding:3px;
	border:1px solid #666666;
	font-weight:bold;
	color:#fff;
}
.allgemein {							/* setzt die Abstände für die Inhalte der Formulare */

}
.allgemein label {						/* Definition der Labels */
	display:block;
	width:15em;
	float:left;
	text-align:right;
	font-weight:bold;
	margin-right:1em;
}
label {									/* zentriert das Label in die vertikale Mitte der Eingabefelder */
	margin-top:7px;
}
select,input,textarea {					/* Definition für die Eingabefelder */
	margin:3px 0;
	border:1px solid #731124;
	background:#eeeeee;
	padding:2px 2px;
	width:auto;
}
input:active, input:focus, input:hover {						/* hebt die aktiven Felder farblich hervor */
	background:#cccccc;
}
.button input:active, .button input:focus, input:hover {		/* bei Buttons soll nichts hervorgehoben werden */
	background:#fff;
}

.buttons {								/* zentriert Buttons */
	text-align:center;
	margin:auto;
}
.buttons input {						/* nimmt den Rahmen von den Knöpfen */
	border:0;
	background:#fff;
	margin:0;
	padding:0;
	width:auto;
}
.radio input, .checkbox input {			/* nimmt den Rahmen der Radio-Buttons und Checkboxen raus */
	border:0;
	background:#fff;
	margin:0;
	padding:0;
}

/* Navigation - Navigation im Header */

#headermenu {
	float:left;
	width:100%;
	z-index:50;
}
ul.nav_header, ul.nav_header li {
	float:left;
	list-style-type:none;
	margin:0;
	padding:0;
}
ul.nav_header {
	margin-left:5px;					/* Abstand der Boxen vom linken Rand */
	margin-right:10px;					/* Abstand der Boxen vom rechten Rand */
	width:600px;
	float:right;
}
ul.nav_header li {
	float:right;
	margin-right:5px;					/* Abstand der Boxen voneinander */
	text-align:center;
}
ul.nav_header a {
	float:left;
	width:10em;
	padding:2px 0;
	text-decoration:none;
	background:#fff;					/* Hintergrundfarbe Box */
	color:#000;							/* Textfarbe */
}
ul.nav_header a:hover {
	background:#f05d13;	
	color:#fff;
}

/* Navigation - Aktuell angezeigte Seite hervorheben */

#home .nav_home, #kontakt .nav_kontakt, #sitemap .nav_sitemap, #impressum .nav_impressum, #suchen .nav_suchen {
	background:#aa1833;
	background:#8a142a;
	color:#fff;							/* faerbt in der aktuellen Seite den aktivierten TAB in etwas hellerem rot ein */
}
#tonc .nav_tonc, #montage .nav_montage, #merkmale .nav_merkmale, #individuell .nav_individuell, #collection .nav_collection, #bezugsquellen .nav_bezugsquellen, #meinungen .nav_meinungen, #agb .nav_agb, #presse .nav_presse, #events .nav_events, #fotowettbewerb .nav_fotowettbewerb, #tierheim .nav_tierheim, #gartentipp .nav_gartentipp, #links .nav_links {
	background:#731124;
	color:#fff;							/* faerbt in der aktuellen Seite den aktivierten Menupunkt in rot ein */
}

/* Ist deaktiviert - zur Zeit keine Untermenus 

#nav_tonc_charakterisierung  .nav_tonc_charakterisierung, #nav_tonc_montage .nav_tonc_montage {
	color:#fff;
	background:#731124;			 		faerbt in der aktuellen Seite den Menupunkt in etwas hellerem rot ein 
}

*/

/* Navigation in den Spalten */

ul.nav_columns, ul.nav_columns li {
	margin:0;
	padding:0 0 6px 0;
	list-style-type:none;
}
ul.nav_columns li {
	float:left;
	width: 100%;
}
ul.nav_columns a {
	display:block;
	width:100%;
	padding:4px 0;
    text-decoration:none;
	text-align:center;
	background:#e8e8e8;					/* Hintergrundfarbe Box */
	color:#000;							/* Textfarbe */
}
ul.nav_columns a:hover {
	background:#f05d13;
	color:#fff;
}

/* UnterNavigation in den Spalten schmaler machen und formatieren */

.subnav {
	width:85%;
	float:right;
}
.subnav ul.nav_columns a {				/* Andere Farben fuer die Subnavigation */
	background:#ccc;					/* Hintergrundfarbe Box */
	color:#000;							/* Textfarbe */
}
.subnav ul.nav_columns a:hover {		/* a:hover muß nochmals definiert werden */
	background:#f05d13;
	color:#fff;
}