/* feste definitionen die alle Browser auf einen nenner
		bringen und grundsätzliches
*/
*
{	margin:0px;
	padding:0px;
	font-family: verdana, sans-serif;
	color:#232323;
}


body
{	font-size:12px;
	background-image:url(image/bn_body_back.png);
}

img
{	border-width:0px;
}

.my_clear
{	font-size:1px;
	height:1px;
	overflow:hidden;
	clear:both;
}

/* defniert die grösse des Layouts und beinhaltet den oberen balken */
#bn_layout
{	background-image:url(image/bn_top.png);
	background-repeat:no-repeat;
	padding-top:21px;
	position:relative;
	width:816px;
	overflow:visible;
	margin:auto;
}
/* der header bereich, in ihm können banner absolut positioniert werden */
#bn_header
{	background-image:url(image/bn_header.jpg);
	width:783px;
	margin:auto;
	height:149px;
	position:relative;
}

/* der verlauf von dunkel nach hell udn die eigentliche Layoutbreite */
#bn_box
{	background-image:url(image/bn_box.png);
	background-repeat:repeat-x;
	margin:auto 8px auto 7px;
	padding-top:9px;
}

/* das Menü unter dem Header sowie die links und die form */
ul#bn_header_menu
{	height:29px;
	margin:8px 7px 0px 7px;
	overflow:hidden;
	list-style-position:outside;
	list-style-type:none;
	background-image:url(image/bn_header_menu.png);
}


ul#bn_header_menu li
{	float:left;
	background-image:url(image/bn_header_menu_li.png);
	background-position:right top;
	background-repeat:no-repeat;
	height:29px;
}

ul#bn_header_menu li#bn_form
{	float:none;
	background-image:none;
	height:29px;
	display:block;
}


ul#bn_header_menu li#bn_form input#bn_search_text
{	height:16px;
	width:160px;
	background-image:url(image/bn_input.png);
	background-repeat:no-repeat;
	border-width:0px;
	margin:8px 0px 0px 10px;
	padding:0px 0px 0px 5px;
	float:left;
	display:inline;
}

ul#bn_header_menu li#bn_form input#bn_search_submit
{	width:51px;
	height:16px;
	border-width:0px;
	margin:8px 0px 0px 3px;
	float:left;
	display:inline;
}


ul#bn_header_menu li a,ul#bn_header_menu li a:link,
ul#bn_header_menu li a:visited,ul#bn_header_menu li a:active
{	text-decoration:none;
	line-height:30px;
	height:30px;
	color:#232323;
	padding:0px 14px;
	font-weight:bold;
	text-transform:uppercase;
	font-size:10px;
	float:left;
}

ul#bn_header_menu li a:hover
{	color:#b0dc01;
}

/* der verlauf der Box in der die google-werbung ist */
#bn_advert
{	position:relative;
	width:100%;
	clear:left;
	overflow:hidden;
	background-image:url(image/bn_advert.png);
}
/* die eigentliche google-werbung und das linke hintergrundbild */
#bn_google
{	background-image:url(image/gratisproben.png);
	background-position:20px 17px;
	background-repeat:no-repeat;
	text-align:right;
	height:65px;
	padding:4px 20px 0px 0px;
}

/* der contentbereich mit dem content und dem menü */
#bn_content
{	background-image:url(image/bn_content.png);
	background-repeat:no-repeat;
	background-position:center top;
	background-color:#ffffff;
	margin:auto 8px auto 7px;
	padding:40px 0px 0px 0px;
}


/* das linke Menü mit seinen links */
ul#bn_menu
{	list-style-type:none;
	list-style-position:outside;
	float:left;
	width:150px;
	overflow:hidden;
	margin:0px 0px 0px 19px;
	display:inline;
}

ul#bn_menu li
{	background-image:url(image/bn_menu_li.png);
	background-position:left bottom;
	background-repeat:no-repeat;
	height:25px;
}

ul#bn_menu li a,ul#bn_menu li a:link,
ul#bn_menu li a:visited,ul#bn_menu li a:active
{	line-height:25px;
	overflow:hidden;
	text-decoration:none;
	color:#C6C6C6;
	padding-left:5px;
	width:150px;
	display:block;
}

ul#bn_menu li a:hover
{	color:#949494;
}


/* der textbereich im content */
#bn_text
{	float:right;
	width:620px;
	padding-right:10px;
}

/* linke und rechte spalte im textbereich */
#bn_left_text
{	float:left;
	width:275px;
	margin-top:3px;
}

#bn_right_text
{	background-image:url(image/bn_right_text_back.png);
	background-repeat:no-repeat;
	background-position:left top;
	padding:265px 10px 0px 20px;
	float:right;
	width:305px;
}

/* verschiedene mögliche hintergrundbilder im rechten textbereich */
.smarties
{	background-image:url(image/bn_right_text_back.jpg);
}

/* definitionen für die html-tags im textbereich */
#bn_text p
{	text-align:justify;
	padding-bottom:28px;
}

#bn_text h1
{	font-size:14px;
	font-weight:bold;
	padding-bottom:8px;
}

#bn_text h2
{	font-size:12px;
	font-weight:bold;
	padding-bottom:8px;
}

#bn_text ul
{	list-style-position:outside;
	padding:0px 0px 10px 20px;
}
#bn_text ul li
{	margin-top:2px;
}


/* der footer als block-link */
#bn_footer,a#bn_footer:link,a#bn_footer:visited,a#bn_footer:active
{	background-image:url(image/bn_footer.png);
	background-repeat:no-repeat;
	width:816px;
	height:21px;
	margin:auto;
	display:block;
	text-align:center;
	line-height:21px;
	color:#c8c8c8;
	text-decoration:none;
	font-size:10px;
}

a#bn_footer:hover
{	color:#949494;
}
.right {
	float:right;
	padding:5px;
	background:#fff;
	margin:0 0 20px 20px;
	border:1px solid #eee;
}
.left {
	float:left;
	padding:5px;
	background:#fff;
	margin:20px 20px 0 0;
	border:1px solid #eee;
}