@charset 'utf-8';
/* ----- generic ----- */


* { margin: 0px; padding: 0px; }

html {
	background: #FFF;
	color: #000;
	direction: ltr;
	font: normal 12px/16px verdana, arial, helvetica, sans-serif;
}

h1 {
	color: #000;
	font: bold 16px/21px verdana, arial, helvetica, sans-serif;	
	margin-bottom: 15px;
	padding-top: 10px;
}

h2 {
	font: bold 14px/18px verdana, arial, helvetica, sans-serif;
	margin: 15px 0 5px;
} 

h3 {
	font:bold 12px/16px verdana, arial, helvetica, sans-serif;
	margin: 15px 0 5px;
}

p {
	font:normal 12px/16px verdana, arial, helvetica, sans-serif;
	margin-bottom: 10px;
}


/* ----- Hypertext Module ----- */
a         { color:#14C; text-decoration:none; }
a:visited { color:#57F; }
a:hover   { text-decoration: underline; }
a:active  { text-decoration: none; }
a img     { border:0; }




/* ----- Auxiliary Module ----- */
#main    { 
	background:url(../img/main_bg.gif) repeat-y; 
	position:relative;
	margin: 0px 10px;
	padding:0px 13px 0px 12px;
	width: 790px;
}
* html #main {width /**/: 815px;} /* IE 5.x */

/* ----- Header Modul ----- */

#header {
	background: url(../img/header/topreiter_produkte.gif) top left no-repeat;
	height: 96px;
	margin: 0px 10px;
	position:relative;
	width: 815px;
}

#header-end { 
	background:url(../img/main_start.gif) no-repeat; 
	height:13px; 
	margin:0px 10px;
	overflow: hidden;
	width:815px; 
}

a#logo {
	left: 54px;
	position: absolute;
	top: 22px;
	z-index: 10;
}

a#service {
	border-right: 1px solid #97A3C0;
	display: block;
	height: 18px;
	left: 755px;
	position: absolute;
	top: 18px;
	width: 23px;
    	z-index: 10;
}
a#help {
	display: block;
	height: 18px;
	left: 779px;
	position: absolute;
	top: 18px;
	width: 23px;
    	z-index: 10;
}

a#portal {
	display:  block;
	height:   80px;
	left:     4px;
	position: absolute;
	top:      12px;
	width:    807px;
	z-index:  1;
}
a#portal span {display:none;}

/* ----- Advertisement Module ----- */

#adv-header {
	background: url(../img/bg-adv-header.gif) top left no-repeat;
	display: table;
	height: 106px;
	margin: 0px 10px ;
	position: relative;
	text-align: center;	
	vertical-align:middle;
	width: 815px;
}
/* ----- workaround fuer die Zentrierung des Banners ----- */
#adv-header .wrOuter { display:table-cell; vertical-align:middle; }
/* Hides from MacIE \*/
* html #adv-header   { display:block;}
* html #adv-header .wrOuter { display:inline; left:50%; top:50%; position:absolute; }
* html #adv-header .wrInner { left:-50%; top:-50%; position:relative; }
/* End hide */
#adv-header img { vertical-align:bottom; }



/* ----- Navigation Module (Top) ----- */
#nav-top ul {
	height: 33px; /* NN */
	left: 172px;
	list-style: none;
	margin: 0px;
	padding: 0px;
	position: absolute;
	top: 72px;
	width: 630px;
}

#nav-top li {
	float: left;
	font-size: 11px;
	font-weight: bold;
	height: 36px;
	margin-right:1px;
	overflow: hidden;
	width: 100px;
}

#nav-top li.start    { width: 73px; }
#nav-top li.dsl      { width: 120px; }
#nav-top li.product  { width: 98px; }
#nav-top li.topic    { width: 103px; }
#nav-top li.shopping { width: 98px; }
#nav-top li.entertainment { width: 132px; }

#nav-top a, #nav-top strong { 
	color: #000;
	display: block; 
	line-height: 35px;
	padding-top: 1px;
	text-align: center;
	width: 100%; 
}



/* ----- Navigation Module (Sub) ----- */
#nav-sub {
	float:left;
	position:relative;
	width:150px;
    padding-bottom:40px;
}
	
#nav-sub div div { padding:0px; }
#nav-sub div div div { padding:0px; }

#nav-sub ul { 	background-color:#FFF; list-style:none; margin:0px; padding:0px; }
#nav-sub li { 
	background-repeat:no-repeat; 
	font-size:11px;
	vertical-align:bottom; /* fixes the gaps in IE 5.0 */
	width:150px;	
}

#nav-sub a, #nav-sub strong {
	background-repeat:no-repeat;
	color:#000;
	display:block;
	font-size:11px;
	text-decoration:none;
}
* html #nav-sub a, * html #nav-sub strong {
	height:1%; /* fixes IE margin-Bug by giving "has_layout" to the links */
}
#nav-sub a:hover { text-decoration:underline; }

#nav-sub .l1 div.end { display:none; }
#nav-sub #nav-sub-bin div.end {
	height:4px;
	overflow:hidden;
	width:100%; /* fixes IE Mac to show the div as block */
}

/* ----- Level 1-4 Abstaende + Rahmen ----- */
#nav-sub .l1 a, 
#nav-sub .l1 strong  { border-bottom:1px solid #D8DFE5; line-height:23px; padding-left:5px; }
#nav-sub .l1 strong  { font-weight:bold; }

#nav-sub .l2         { border-top:1px solid #D8DFE5; margin-top:4px; }
#nav-sub .l2 a       { padding-left:15px; }
#nav-sub .l2 strong, 
#nav-sub .l2 .open   { font-weight:bold; padding-left:5px; }
#nav-sub .l2 a,
#nav-sub .l2 strong  { border-bottom:1px solid #D8DFE5; }

#nav-sub .l3 a, 
#nav-sub .l3 strong, 
#nav-sub .l3 .open   { font-weight:normal; padding-left:15px; }
#nav-sub .l3 a,
#nav-sub .l3 strong  { border-bottom:1px solid #D8DFE5; }
#nav-sub .l3 .open   { border-bottom:0px solid #D8DFE5; }

#nav-sub .l4         { background:#FFF; border-bottom:1px solid #D8DFE5; padding-bottom:1px; } 
#nav-sub .l4 a,
#nav-sub .l4 strong  { border-bottom:0px solid #D8DFE5; line-height:19px; padding-bottom:1px; padding-left:15px; }

#nav-sub .l5 a, 
#nav-sub .l5 strong  { padding-left:27px; }


/* ----- Level 1-4 Hintergrund Produkte + Fallback ----- */
#nav-sub .product strong { background:#EEF3F7; }
#nav-sub .product .l2 a  { 
    background: url(../img/navi/pfeil.gif) 5px 9px no-repeat;  
    position:   relative; 
}
#nav-sub .product .l2 a img.marker { 
    position:    absolute; 
    margin-left: 5px; 
    margin-top:  4px;
}
* html #nav-sub .product .l2 a img.marker { 
    margin-top: -1px; 
}

#nav-sub .product .l2 a.open { background:none; }
#nav-sub .product .l2 strong,
#nav-sub .product .l3 #focus { background:#EEF3F7; }
#nav-sub .product .l3 strong { background:url(../img/navi/pfeil.gif) 5px 9px no-repeat; }
#nav-sub .product .l3 a.open,
#nav-sub .product .l3 strong.open { background:url(../img/navi/pfeil_open.gif) 5px 9px no-repeat; }
#nav-sub .product .l4 #focus { background:#FFF !important; }
#nav-sub .product .l4 a,
#nav-sub .product .l4 a.open { background:none !important; } 
#nav-sub .product .l4 strong,
#nav-sub .product .l4 strong.open { background:#EEF3F7; }
#nav-sub .product .l5 a,
#nav-sub .product .l5 strong { background:url(../img/navi/punkt.gif) 20px 9px no-repeat !important; } 
#nav-sub .product .l5 #focus { background:#EEF3F7 !important; }

/* ----- Login-Box  ----- */
#nav-sub .login   {margin:10px 0px 10px 0px; background-color: #ffffff; width:150px;}
#nav-sub .login * {font:normal 11px/14px verdana, arial, helvetica, sans-serif;}
#nav-sub .login a {color:#1144CC !important; border:0px; display:inline; line-height:14px; padding:0px;}
#nav-sub .login .index {background:#EBF6FC url(../img/bg-top150.gif) no-repeat top left; border-width:0px; font-weight:bold; line-height:23px; margin:0; overflow:hidden; padding: 1px 8px 0px 8px;}
#nav-sub .login .index .help {float:right; padding: 3px 0px 0px 0px; } /* wird derzeit nicht verwendet */
#nav-sub .login .box {background:url(../img/bg-bottom150.gif) no-repeat bottom left; padding: 0px 1px 5px 1px;}
#nav-sub .login .box div      {margin:5px 7px;}
#nav-sub .login .box form     {background-color:#EBF6FC; margin:0; padding:5px 7px 5px;}
#nav-sub .login .box form div {margin:0 0 5px;}
#nav-sub .login .box form .error {padding:0px; color:#FF0000;}
#nav-sub .login .box .form-control a {line-height:18px;}
#nav-sub .login .box label {display:block;}
#nav-sub .login .box input {margin:0 0 5px;}
#nav-sub .login .box input.field {width:130px; font:normal 11px verdana, arial, helvetica, sans-serif; }
#nav-sub .login .box input.action {float:right; font-size:11px !important; line-height:12px; margin:0; padding:0; text-align:center;}
#nav-sub .login .box input.field {width:130px;}
* html #nav-sub .login .box input.field { width:133px; width/**/: /**/130px;}
#nav-sub .login .box input.field {width:133px#} /* for Safari*/

/* ----- Channels (Zusatznavigation links)  ----- */
#nav-sub .channels      {border-top:1px solid #D8DFE5; margin-top:40px;}
#nav-sub .channels span {
    border-bottom:1px solid #D8DFE5; 
    background:url(../img/navi/bg-channels.gif) top left repeat-x; 
    color:#888; 
    display:block;
    font-weight:bold; 
    line-height:23px; 
    padding-bottom:1px; 
    padding-left:5px;
}

#nav-sub .channels a { position:relative; }
#nav-sub .channels a img.marker { 
    float:    none;
    position: absolute; 
    margin:   5px 0px 0px 5px; 
    height:   auto;
    width:    auto;
}
* html #nav-sub .channels a img.marker { margin: -1px 0px 0px 5px; }

#nav-sub .channels li  {background:url(../img/navi/bg-channels.gif) top left repeat-x; border-bottom:1px solid #D8DFE5; height:26px;}
#nav-sub .channels li a     {border-bottom:0px solid #D8DFE5; font-weight:normal; line-height:25px; padding:0 0 1px 5px; color:#888;}
#nav-sub .channels li a:hover {color:#888;}
#nav-sub .channels .l2      {border-top:0px solid #D8DFE5; margin-top:0px;}
#nav-sub .channels .l2 img  {float:left; height:16px; margin:5px; width:16px;}
#nav-sub .channels .end     {background:#F6F8FA;}

/* ----- Content Module ----- */
#content-start  { float:right; width:630px; }
#content        { float:right; width:630px; }
#content-end    { float:right; width:630px; }

/* ----- Grid Module B (Unit pattern) ----- */
.x1 {width: 70px;}
.x2 {width: 150px;}
.x3 {width: 230px;}
.x4 {width: 310px;}
.x5 {width: 390px;}
.x6 {width: 470px;}
.x7 {width: 550px;}
.x8 {width: 630px;}

/* ----- Footer Module ----- */
#footer { 
	background:url(../img/footer/footer.gif) top left no-repeat; 
	clear: both;
	font-size:11px;
	height:55px; 
	margin:0px 10px; 
	padding-top:23px; 
	text-align:center;
	width:825px;
}
#footer li {display:inline;}
#footer a  { color:#000; }


/* Containing Floats */
/****************************************************************/
.clearfix:after {
	content: "."; /* This dot is the actual appended content */
	clear: both;
	height: 0;
	visibility: hidden;
	display: block;
	}
.clearfix {display: inline-block;} /* Fixes MacIE */
/* Hides from MacIE \*/
.clearfix {*height: 1%;}
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide */
