/* @group Reset */

/*
Eric Meyers Reset Reloaded
http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/
 */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {
	outline: 0;
}
body {
	line-height: 1;
	color: black;
	background: white;
}
ol, ul {
	list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}
/* own additions */
a img { border: 0; }
form { display: inline; } /* necessary? Test it! */


/* @end */

/* @group Body */

body {
	background: white url('../img/body-bg.png') center 97px no-repeat;
	padding: 40px 0;
}

/* @end */

/* @group Font */

body { font-family: Helvetica, Arial, Sans-Serif; font-size: 11px; }

h3 { color: #666666; font-size: 17px; padding-bottom: 8px; }

/* @end */

/* @group Aufbau */

#panel { width: 910px; margin: 0 auto; }

#body { margin-bottom: 25px; }

#header { height: 43px; margin: 0 5px 15px 5px; }

#navigation { height: 35px; background: url('../img/navi-bg.png') repeat-x 0 0; margin: 0 0 28px 0; }

#content { float: left; margin-top: 2px; margin-right: 10px; width: 710px; }

#teaser { float: left; width: 190px; }

/* @end */

/* @group Carousel */

#carousel {	margin-bottom:  40px; margin-left: -11px;}

/* @end */

/* @group Header */

#header h1 { float: right; }

	#header h1 a { display: block; padding-right: 10px; }

	#aux-navigation { float: left; padding-top: 27px;}
	#aux-navigation li { float: left;}
	#aux-navigation a { border-left: 1px solid #ccc; color: #0071b7; text-decoration: none; font-size: 12px; padding: 0 10px; }
	#aux-navigation .first a { border-left: none; }
	#aux-navigation a:hover { text-decoration: underline; } 

#searchbar { float: right; background: url(../img/navi-bg_last.png) no-repeat right 0; padding: 4px 17px 10px; height: 32px;}
	#searchbar input { border: 1px solid #ddd; border-top: 1px solid #aaa; padding: 2px; margin-left: 4px; margin-right: 0; width: 110px; }
	#searchbar label { font-size: 12px; color: #ccc; }
	#searchbar .submit { background: url(../img/submit_bleu.png) no-repeat left; width: 25px; height: 25px; border: none; text-indent: -555em; cursor: pointer; }

/* @end */

/* @group Navigation */

#categories {
	float: left;
	height: 35px;
}
#categories li {
	display: block;
	float: left;
	height: 35px;
}
#categories li a {
	color: #424242;
	font-size: 12px;
	background: url('../img/navi-bg.png') repeat-x top;
	padding: 11px 15px;
	text-decoration: none;
	display: block;
}

#categories li.active a,
#categories li a:hover,
#categories li:hover a {
	background: url('../img/navi-bg-active.png') repeat-x top;
	color: white;
}

#categories li#first a { padding-left: 35px; padding-right: 25px; background: url(../img/navi-bg_left.png) no-repeat top left; }
#categories li#first a:hover,
#categories li#first_active a { padding-left: 35px; padding-right: 25px;background: url(../img/navi-bg-active_left.png) no-repeat top left; }

#categories li ul {
	background: transparent url('../img/categories-2-2-bg_ul.png') left top repeat-y;	
	//background:  url('../img/categories-2-3-bg_ul.png') 7px 0 no-repeat;
	
	display: none;
	float: none;
	margin-top: -1px;
	margin-left: -7px;
	/* margin-bottom: 10px; */
	padding: 0 0 0 0;
	position: absolute;
	width: 209px;
	z-index: 10;
	}
/* IE8+7 hack - ohne abschliessendes semikolon: reiner IE8 hack - WICHTIG immer nur eine Angabe zzt	 */
html	#categories li ul { background-image/*\**/: url('../img/categories-2-3-bg_ul.png')\9; } 
html	#categories li ul { background-repeat/*\**/: no-repeat\9; } 
html	#categories li ul { background-position/*\**/: 7px 0\9; } 	
 /* IE8 hack ende */

#categories li ul li {
	background: transparent url('../img/categories-2-2-bg_li.png') left repeat-y;	
	display: block;
	float: none;
	height: auto;
	padding: 0 7px;
	zoom:1;

}

html	#categories li ul li { background/*\**/: none\9; } 



	#categories li ul .last { padding-bottom: 10px; }
	#categories li ul .spacer {
		height: 12px;
		width: 100%;	
		background:  url('../img/categories-2-2-bg.png') left bottom no-repeat;
		position: absolute;
		bottom: -12px;
	}

html #categories li ul .spacer { background-image/*\**/: url('../img/categories-2-3-bg.png')\9; }
html #categories li ul .spacer { background-repeat/*\**/: no-repeat\9; }
html #categories li ul .spacer { background-position/*\**/: left bottom\9; }



#categories li ul li a {
	line-height: 16px;
}
#categories li ul li a,
#categories li.active ul li a,
#categories li:hover ul li a {
	background: none;
	border-bottom: 1px solid rgb(173, 173, 173);
	color: #424242;
	float: none;
	height: auto;
	padding: 8px 30px;
}

#categories li ul li.last a,
#categories li.active ul li.last a,
#categories li:hover ul li.last a {
	border-bottom: none;
}

#categories li ul li a:hover,
#categories li.active ul li a:hover  {
	background: #0073b8 url('../img/categories-2-bg_hover.gif') left top repeat-x;
	color: white;
}

/* @group test	*/

#carousel_image_mask {
	background-image: none;
	-ms-filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fileadmin/res/img/carousel-slide-mask.png');
}

#carousel_container {
	background-image: none;
	-ms-filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fileadmin/res/img/carousel_bg.png');
}

#carousel_navigation_mask {
	background-image: none;
	-ms-filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fileadmin/res/img/carousel-navigation-mask.png');
}

/* @end */




/* @end */

/* @group Content */

#content h2 { background: url(../img/content-top-bg.png) no-repeat; font-size: 30px; color: #999999; line-height: 40px; padding: 30px 25px 20px 205px;  }

#content #tainer { background: url(../img/content-bg.png) repeat-y top left; min-height: 300px; }

#content #bottom { height: 35px; background: url(../img/content-bottom-bg.png) left bottom repeat-y; }

/* @end */

/* @group Teaser */

#mein-willy-tel { width: 185px; height: 115px; background: url(../img/box_mywillytel.png) no-repeat top left; text-align: left; }
	#mein-willy-tel h3,
	#mein-willy-tel a { color: #fff; text-decoration: none; padding-left: 17px; }
	#mein-willy-tel h3 { padding-top: 14px; font-size: 18px; padding-bottom: 15px; }
		#mein-willy-tel h3 span { font-weight: bold; }
	#mein-willy-tel a { font-size: 12px; font-weight: bold; display: block; padding: 5px 0 5px 40px; background: url(../img/button_bleu.png) no-repeat 15px 3px ; }


#hotline { background: url(../img/tel_bg.png) no-repeat top left; width: 179px; height: 83px; margin: 2em 4px; line-height: 1.2; }
	#hotline h3 { font-size: 18px; font-weight: normal; padding: 10px 13px 0; }
	#hotline h3 strong { display: block; font-weight: bold; }
	#hotline p { color: #00738b; font-size: 18px; margin: 0; padding-left: 13px}

.teaser { width: 192px; height: 210px; float: left; padding: 0 20px 25px 20px; text-align: center; position: relative; overflow: hidden; background: url(../img/teaser_divider.png) no-repeat right 40px; }

#content .teaser h2 { font-size: 17px; background: none; padding: 0 0 10px; width: 110%; margin-left: -5%; }

.teaser .csc-textpic-imagewrap dt { width: 190px; padding-bottom: 10px; }
.teaser dl {  margin: 0 auto; display: block; }

.teaser p.bodytext { font-size: 11px; color: #666; line-height: 1.3; padding-bottom: 10px; text-align: center; }

	.teaser h3 a { color: #666; text-decoration: none; }

	.teaser .largeText { font-size: 14px; text-align: center; }

		.teaser .largeText b,
		.teaser .largeText strong { font-size: 24px; }

.teaser .bodytext b { color: #0070b7; font-weight: bold; }
.teaser .teaser_info { position: absolute; bottom: 0; left: 50px; }


.content-teaser { background: rgb(233, 233, 233) url('../img/content-teaser_bg.gif') top repeat-x; border: 1px solid rgb(193, 193, 193); float: left; padding: 20px; width: 188px; height: 220px; text-align: center; margin-right: 10px; margin-bottom: 10px; }

	.content-teaser h3 a { color: #666; text-decoration: none; }
	
	.content-teaser .csc-textpic-imagewrap { padding-bottom: 15px; }

	#text .content-teaser p.largeText { font-size: 14px; text-align: center; }

		.content-teaser .largeText b,
		.content-teaser .largeText strong { font-size: 24px; }


/* @end */

/* @group subnavigation */

#subnavigation { float: left; font-size: 12px; font-weight: bold; padding-left: 30px; width: 155px; }
	#subnavigation strong { color: #74b0d6; padding-bottom: 2px; }

#subnavigation ul { padding-top: 10px; }
#subnavigation li { padding-left: 10px; background: url(../img/subnav_bullet.png) no-repeat 0 5px; }
	#subnavigation a { display: block; padding-bottom: 10px; text-decoration: none; color: #666; }

		#subnavigation a:hover,
		#subnavigation li.active a { color: #74b0d6; }

/* @end */

/* @group Text */

#text { float: left; width: 480px; margin-left: 20px; }

	#text h3 { color: #797979; font-size: 18px; }
	
	#text p,
	#text ul { color: #797979; font-size: 12px; line-height: 16px; padding-bottom: 15px; }
	
	#text ul { padding-left: 25px; }
		#text li { list-style-type: disc; }
	
	#text a { color: rgb(0, 113, 183); }

	#text h3 a { color: #797979; }

/* @end */

/* @group Neuigkeiten */

#text .news-teaser h3 span {
	font-size: 12px;
	margin-bottom: 2px;
}



/* @end */

/* @group footer */

#footer { }

#bar { border-bottom: 0px; height: 35px; background: url('../img/navi-bg.png') repeat-x 0 -0px; overflow: hidden; position: relative; margin-bottom: 28px; }
	#news_start { position:  absolute; background: url(../img/navi-bg_left.png) no-repeat top left ; height: 35px;  padding: 12px 20px; font-size: 12px; }
	
	#news_start strong { display: block;position: absolute; font-weight: bold; color: #666; }
	#newsticker p { display: inline; } 
	#newsticker a { white-space: nowrap ;}
	.innerfade {  width: 240px; overflow: hidden; height: 2em; margin-left: 46px; }
	.innerfade a { text-decoration: none; color: #666;  }
	.innerfade a:hover { text-decoration: underline; }
	
	.allnews { text-decoration: none;   position: absolute; left:  300px; top: 12px; height: 1em; width: 150px; color: #0070b7; }
	a.allnews:hover { text-decoration: underline; }
	
	#metanav { background: url(../img/navi-bg_last.png) no-repeat right -0px; float: right;  padding: 12px 20px; font-size: 10px; color: #666}

		#metanav li { border-right: 1px solid #666; float: left; padding: 0 1em; }
		#metanav li.last { border: 0; }
		#metanav li.copy { border: 0; }

			#metanav a { color: #666; text-decoration: none; }
			#metanav a:hover { text-decoration: underline; }

	
	#partner { text-align: right; padding: 0 0 2em; color: #666; }
	#partner strong { vertical-align: top; font-weight: normal; text-transform: uppercase; font-size: 8px; }
	#partner a { padding: 0 1em; }
	
/* @end */

/* @group Clear */

/* Clearing Floats ohne extra html */
.clear:after {
	content: "."; 
	display: block; 
	height: 0; 
	font-size:0;	
	clear: both; 
	visibility:hidden;
}
	
   .clear { display: inline-block; } /* inline-block ist valides css2.1 */

    /* Hides from IE Mac */
    * html .clear { height: 1%; }
       .clear { display:block; }
       element { }
    /* End Hack */


/* @end */

/* @group Carousel */

#carousel_container { background: url("../img/carousel_bg.png") no-repeat; padding: 5px 0 0 10px; height: 350px; }

#carousel_floater { float: left; margin-top: 7px; width: 670px; }

#carousel { width: 675px; }

	#carousel li { width: 675px; }

		#carousel h2 { font-size: 22px; color: #999999; line-height: 28px; padding-top: 20px; padding-bottom: 25px; }
	
		#carousel li div.image { float: left; width: 420px; height: 290px; /*position: relative;*/ background-position: 20px 10px; background-repeat: no-repeat; padding-left: 10px;}
	
		#carousel li div.content { float: right; width: 215px; height: 290px; position: relative; padding-left: 30px;  }

			#carousel p { color: #797979; font-size: 12px; line-height: 16px; margin-bottom: 25px; }

			#carousel a.more { bottom: 30px; position: absolute; bottom: 10px; left: 23px; }

			#carousel_controls a { color: white; display: block; width: 200px; height: 104px; position: relative; text-decoration: none; }
		
			#carousel_controls img { margin-top: 0; margin-left: 1px; position: absolute; z-index:100;  }
		
			#carousel_controls a span {
				position: absolute;
				bottom: 8px;
				left: 10px;
				display: block;
				background: url("../img/t40.png"); 
				height: 16px;
				z-index: 90;
				width: 178px;
				text-align: center;
				text-decoration: none;
				padding: 3px 0; 
			}
		
#carousel_image_mask {
	background: url('../img/carousel-slide-mask.png') left top no-repeat;
	width: 420px;
	height: 290px;
}

#carousel_navigation_mask {
	background: url('../img/carousel-navigation-mask.png') left top no-repeat;
	width: 194px;
	height: 104px;
}

#carousel_control_wrapper {
	position: relative;
	float: left;
	margin-left: 30px;
	margin-top: -3px;
	overflow: hidden;
	height: 310px;
	width: 200px;
}

#carousel_controls {
	background-repeat: no-repeat; 
	background-position: 10px 8px; 
	margin-bottom: 0px;
	position:absolute;
	height: 20000em;
	width: auto;
}

#carousel_controls li{
	height: 103px;
	width: 195px;
	background-position: 10px;
	background-repeat: no-repeat;
	
}

#carousel_floater{
	position: relative;
	float: left;
	overflow: hidden;
	height: 300px;
		
}
ul#carousel{
	position:absolute;
	height: 20000em;
	width: auto;
	overflow: visible;
}

ul#carousel li{
	height: 300px;
}
							
/* @end */