/* This page is developed an designed by e8media - agency for digital media, mailto:info@e8media
 * Contact: Oliver Meding, Goerreshof 152, D-53347 Alfter, Germany, Phone +49 2222 922568
 *
 * Development & source code & CSS-Styles by Tobias Kivelip (kivelip@e8media.de) | Marco NŠtlitz (naetlitz@e8media.de)
 * Screendesign by Stefan Weber, mailto: weber@e8media.ch
 *
 * Copyright: The copyright for any material created by the author is reserved.
*/

/*
 * Generell
 * --------------------------------------------------------
 */

/* delete all margin & padding */
*
{
    margin: 0;
    padding: 0;
}

img
{
	border: 0;
}

#large_box {
	width: 800px;
	height: 600px;
}

body
{
	background: #202020 url("/img/marginale.jpg") repeat-x 0 0;
	text-align: left;
	color: #2a270e;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	width: 100%;
}

html {
    height: 100%;
    margin-bottom: 1px;
}

/*
 * Grundstruktur
 * --------------------------------------------------------
 */

/* -------- header -------- */
div#head_left
{
	width: 568px;
	height: 137px;
	overflow: hidden;
	position: absolute;
	left: 0;
	top: 0;
}

/* logo */
div#head_left img
{
	margin: 20px 0 0 20px;
}

div#head_right
{
	width: 434px;
	height: 137px;
	overflow: hidden;
	background: url("/img/headright.png") repeat-x 0 0;
	position: absolute;
	left: 568px;
	top: 0;
	z-index: 10;
}

/* -------- mitte -------- */
div#main_cont
{
	position: relative;
	top: 167px;
	left: 0;
	background: #efefef url("/img/rightbar.jpg") repeat-y top left;
	width: 100%;
	overflow: hidden;
	z-index: 20;
}

/* layer fuer den baum rechts */
div#tree
{
	width: 1280px;
	background: url("/img/tree.png") no-repeat bottom right;
}

/* oberer verlauf */
div#verlauf_oben
{
	background: url("/img/verlauf_oben.jpg") repeat-x top left;
}

/* unterer verlauf */
div#verlauf_unten
{
	background: url("/img/verlauf_unten.jpg") no-repeat bottom left;
}

div#content
{
	width: 568px;
	overflow: hidden;
	float: left;
	padding-bottom: 50px;
}

/* content linke spalte */
div.splitLeft
{
	width: 264px;
	float: left;
	display: block;
}

/* content rechte spalte */
div.splitRight
{
	display: block;
	width: 300px;
	float: left;
}

* html div.splitRight
{
	width: 290px;
}

div#rightbar
{
	width: 434px;
	overflow: hidden;
	float: left;
	padding-bottom: 120px;
	background-color: #A21504;
}

img#picture_rightbar
{
	display: block;
	position: absolute;
	top: 138px;
	left: 568px;
	width: 434px;
	height: 435px;
	z-index: 30;
}


/**
 * Footer
 * --------------------------------------------------------
 */
div#foot
{
	height: 266px;
	overflow: hidden;
	width: 100%;
	background: url("/img/foot.jpg") repeat-x;
}

div#klammer
{
	width: 1001px;
	display: block;
	position: relative;
	overflow: hidden;
	height: 266px;
}


/**
 * Service Navigation
 * --------------------------------------------------------
 */
div#head_right ul
{
	list-style: none;
	position: absolute;
	top: 27px;
	right: 5px; /* 15 Abstand 10 durch Padding */
	font-size: 0.9em;
}

div#head_right ul li
{
	display: block;
	float: left;
}

div#head_right ul li a,
div#head_right ul li a:active,
div#head_right ul li a:focus,
div#head_right ul li a:visited
{
	font-size: 0.9em;
	display: block;
	float: left;
	color: #ffffff;
	border-right: 1px solid #000000;
	padding-right: 10px;
	padding-left: 10px;
	text-decoration: none;
	font-size: 0.9em;
}

div#head_right ul li a.last,
div#head_right ul li a.last:active,
div#head_right ul li a.last:focus,
div#head_right ul li a.last:visited
{
	border: none;
}

div#head_right ul li a:hover
{
	text-decoration: underline;
}

div#head_right ul li.act a,
div#head_right ul li.act a:active,
div#head_right ul li.act a:visited,
div#head_right ul li.act a:focus
{
	font-weight: bold;
}

/*
 * Sub Navigation (rechte Spalte)
 * --------------------------------------------------------
 */
div#rightbar ul
{
	margin-top: 406px;
	list-style: none;
	border-top: 1px solid #ffffff;
}

div#rightbar ul li
{
	display: block;
	margin-bottom: 1px;
}

div#rightbar ul li a,
div#rightbar ul li a:active,
div#rightbar ul li a:visited,
div#rightbar ul li a:focus
{
	font-size: 0.9em;
	text-decoration: none;
	display: block;
	line-height: 24px;
	height: 24px;
	color: #ffffff;
	background: #770f04 url('/img/subnavi_raquo.gif') no-repeat 14px center;
	text-indent: 25px;
}


div#tree div#rightbar ul li a:hover,
div#tree div#rightbar ul li.active a
{
	background-color: #570b03;
}

div#rightbar ul li.act a,
div#rightbar ul li.act a:visited,
div#rightbar ul li.act a:active,
div#rightbar ul li.act a:focus
{
	background: #570b03 url('/img/subnavi_act.gif') no-repeat left center;
	text-indent: 14px;
}


div#rightbar ul ul {
	margin-top: 1px;
	list-style: none;
	position: relative;
	display: block;
	border: none;
}

div#rightbar ul li ul li a,
div#rightbar ul li ul li a:visited,
div#rightbar ul li ul li a:active,
div#rightbar ul li ul li a:focus,
div#rightbar ul li.act ul li a,
div#rightbar ul li.act ul li a:visited,
div#rightbar ul li.act ul li a:active,
div#rightbar ul li.act ul li a:focus {
    padding-left: 20px;
    text-indent: 15px;
    display: block;
	background: #770f04 url("/img/subnavi_raquo.gif") no-repeat 20px center;
}

div#rightbar ul li ul li a:hover {
	background-color: #570b03;
}

div#rightbar ul li.act ul li.act a {
	background: #570b03 url("/img/subnavi_raquo.gif") no-repeat 20px center;
}

/*
 * Header Suche
 * --------------------------------------------------------
 */
div#head_right form
{
	position: absolute;
	right: 15px;
	top: 100px;
}

div#head_right form p
{
	margin: 0;
}

div#head_right form label
{
	font-size: 0.9em;
	width: 140px;
	float: left;
	color: #ffffff;
	line-height: 20px;
}

div#head_right form input
{
	font-size: 0.9em;
	float: left;
}

div#head_right form input.search_button
{
	margin: 2px 0 0 5px;
}

div#head_right form input.search_input
{
	width: 140px;
	height: 17px;
	border: 1px solid #89443d;
	padding: 1px;
}

/*
 * Footer Styles
 * --------------------------------------------------------
 */

div#footKontakt
{
	background: url('/img/marginale_footer_anschrift.jpg') no-repeat top left;
	width: 438px;
	height: 266px;
	float: left;
}

form#footNews
{
	padding-top: 20px;
	display: block;
	width: 270px;
	height: 266px;
	float: left;
}

form#footNews input
{
	margin-bottom:5px;
	display: block;
	width: 210px;
	padding: 3px;
	font-size: 0.9em;
	border: 1px solid #0f0f0f;
	background-color: #b3b3b3;
}

div.footPartner
{
	padding-top: 20px;
	display: block;
	width: 293px;
	float: left;
	height: 266px;
}

div#foot p,
div#foot h2,
div#foot ul
{
	color: #b2b2b2;
	margin-left: 20px;
	margin-right: 20px;
}

div#foot p,
div#foot ul
{
	font-size: 0.9em;
}

div#foot h2
{
	font-size: 1.09em;
}

div#foot ul
{
	list-style: none;
	border-top: 1px solid #2d2d2d;
	border-bottom: 1px solid #4c4c4c;
}

div#foot ul li
{
	border-bottom: 1px solid #2d2d2d;
	border-top: 1px solid #4c4c4c;
	background: url('/img/foot_li_bullet.gif') no-repeat 2px 8px;
	padding-left: 20px;
	line-height: 25px;
}

div#foot p.credits
{
	color: #666666;
	margin-top: 20px;
}

div#footKontakt h2
{
	color: #dfdfdf;
	margin-top: 20px;
}

div#footKontakt div
{
	width: 200px;
	float: left;
}

div#footKontakt p,
div#footKontakt ul
{
	color: #dfdfdf;
	font-size: 0.8em;
}

div#footKontakt ul li
{
	background-image: url('/img/footer_li_bullet_basis.gif');
}

div#footKontakt ul li a
{
	text-decoration: none;
}

div#footKontakt a
{
	color: #dfdfdf;
	text-decoration: underline;
}


/* ---------------- navigation ---------------- */
ul#navi
{
	position: absolute;
	top: 138px;
	width: 568px;
	height: 36px;
	z-index: 50;
	list-style: none;
}

ul#navi li
{
	position: relative;
	display: block;
	float: left;
}

/* 1. Navigations-Ebene */

ul#navi li a,
ul#navi li a:active,
ul#navi li a:visited,
ul#navi li a:focus,
ul#navi li a:hover
{
	padding: 0 10px 0 10px;
	display: block;
	height: 36px;					/* damit das Dreieck drunter passt */
	line-height: 29px; 				/* zentriert den Text innerhalb des sw Balken */
	text-align: center;				/* hor. zentrierung */
	text-decoration: none;
	color: #ffffff;
	text-transform: uppercase;
	font-size: 0.9em;
	position: relative;
	background: url('/img/navi_triangle_off.gif') no-repeat bottom center;
}

* html ul#navi li a,
* html ul#navi li a:focus,
* html ul#navi li a:active,
* html ul#navi li a:visited,
* html ul#navi li a:hover
{
	float: left;
}

* html ul#navi li ul li a,
* html ul#navi li ul li a:active,
* html ul#navi li ul li a:visited,
* html ul#navi li ul li a:focus,
* html ul#navi li ul li a:hover
{
	float: none !important;
}

ul#navi li.act a,
ul#navi li.act a:active,
ul#navi li.act a:visited,
ul#navi li.act a:focus,
ul#navi li a:hover
{
	color: #c31e0d;
}

ul#navi li.act a,
ul#navi li.act a:active,
ul#navi li.act a:focus,
ul#navi li.act a:visited
{
	background: url('/img/navi_triangle.gif') no-repeat bottom center;
}

/* Layernavi */

ul#navi li ul
{
	position: absolute;
	top: 29px;
	width: 174px;
	height: auto;
	padding-top: 7px;
	list-style: none;
	display: block;
	background-color: #2c2c2c;
	z-index: 99;
	/* aus dem sichtbaren Bereich schieben */
	left: -999em;
}

ul#navi li:hover ul,
ul#navi li.hoverIt ul
{
	left: auto;
}

* html ul#navi li.hoverIt ul
{
	left: -1px;
}

ul#navi li ul li
{
	position: relative;
	float: none;
	display: block;
	height: 25px;
}

ul#navi li ul li a,
ul#navi li ul li a:active,
ul#navi li ul li a:focus,
ul#navi li ul li a:visited,
ul#navi li ul li a:hover,
ul#navi li ul li.act a,
ul#navi li ul li.act a:focus,
ul#navi li ul li.act a:visited,
ul#navi li ul li.act a:active,
ul#navi li.act ul li a,
ul#navi li.act ul li a:active,
ul#navi li.act ul li a:focus,
ul#navi li.act ul li a:visited
{
	display: block;
	height: 23px;
	padding: 0;

	background: #434343 url('/img/layernavi_bullet.gif') no-repeat 5px center;

	border-top: 1px solid #505050;
	border-bottom: 1px solid #363636;

	font-size: 0.9em;
	text-transform: none;
	text-align: left;
	line-height: 23px;
	text-indent: 13px;
	color: #ffffff;
}

ul#navi li ul li a:hover,
ul#navi li.act ul li a:hover,
ul#navi li ul li.act a:hover
{
	color: #ffffff;
	background-color: #5a5a5a;
}

ul#navi li ul li.act a
{
	font-weight: bold;
}

ul#navi li.disable a.disable,
ul#navi li.disable a.disable:hover {
    cursor: default;
    color: #676767;
    outline: none;
    text-decoration: none;
}