/* Standardformatierungen */
body { font: normal 12px/16px Arial,sans-serif; background: #7DB5D8 url(../images/bg.png) repeat-x 0 0; color: #005388; margin: 0; padding: 0; }
input[type="text"],
input[type="password"] { font: normal 12px/15px Arial,sans-serif; color: #333; padding: 1px 5px; margin: 0; border: 1px solid #336699; }

select { font: normal 12px/15px Arial,sans-serif; color: #333; border: 1px solid #336699; width: 165px; line-height: 20px; margin: 0 0 15px;  padding: 0 0 0 3px; }
option { font: normal 12px/15px Arial,sans-serif; color: #333; margin: 0; padding: 0 0 0 6px; }

#canvas { width: 960px; height: 536px; background: url(../images/logo.jpg) no-repeat 0 0; }

#header { background: url(../images/header.png) no-repeat right bottom; height: 121px; position: relative; }
	#logolink { position: absolute; top: 20px; left: 20px; width: 210px; height: 80px; text-indent: -999em; }
	
	#meta ul { float: right; }
  #meta li { float: left; padding: 6px 0; color: #fff; }
  #meta a { display: block; color: #fff; text-decoration: none; font-size: 11px; line-height: 11px; zoom: 1; border-left: 1px solid #fff; padding: 0 7px; }
  #meta a:hover { text-decoration: underline; }
  #meta li.account { padding: 0 5px; width: 93px; background: url(../images/meta_mein_konto.gif) no-repeat left top; text-indent: -999em; }
  #meta li.account:hover { background-position: left -24px; }
  #meta li.account a { height: 24px; border: 0; }
  #meta li:first-child a { border: 0; }
	
  #sunset { position: absolute; top: 0; left: 361px; width: 200px; height: 80px; padding: 41px 70px 0 0; background: url(../images/info_sunset.gif) no-repeat right bottom; text-align: right; color: #cef; }
	#sunset p { font-size: 11px; display: none; }
	
	#session a { position: absolute; color: #21578a; text-align: right; text-decoration: none; }
  #session a.notepad { display: block; width: 142px; height: 20px; top: 64px; left: 636px; padding: 4px 10px 0 0; background: url(../images/button/notepad.gif) no-repeat 0 top; border-bottom: 1px solid #c2c2c2; }
  #session a.comparison { display: block; width: 142px; height: 21px; top: 89px; left: 636px; padding: 3px 10px 0 0; background: url(../images/button/comparison.gif) no-repeat 0 top; }
  #session a.cart { display: block; width: 147px; height: 21px; top: 64px; left: 798px; padding: 28px 10px 0 0; background: url(../images/button/cart.gif) no-repeat 0 top; }
	#session a:hover { background-position: bottom; }
	#session_flag { zoom:1; }
  #session_flag div.flag { position: absolute; left: 882px; top: 33px; width: 99px; height: 50px; background: url(../images/cart_flags.png) no-repeat 0 0; text-indent: -999em; }
	#session_flag div.flag.discount { background-position: 0 top; }
	#session_flag div.flag.voucher { background-position: 0 -50px; }
	#session_flag div.layer { position: absolute; left: 720px; top: 33px; width: 265px; height: 116px; background: url(../images/cart_flags_mouseover.png) no-repeat 0 0; z-index: 10000; color: #fff; display: none; }
	#session_flag div.layer.discount { background-position: 0 top; }
	#session_flag div.layer.voucher { background-position: 0 -116px; }
	#session_flag div.layer p { margin: 60px 20px 20px; }

#sidebar { width: 210px; float: left; overflow:visible;}
	#search { margin-top:5px; background: url(../images/sidebar/search_footer.png) no-repeat 0 bottom; padding: 0 0 11px 0; height:78px; position:relative;  }
	#search h2 { margin: 0 0 10px 0; }
	#search input[type=text] { float: left; width: 123px; border: 1px solid #fff; border-top: 1px solid #369; border-left: 1px solid #369; }
	#search a { display: block; height: 12px; text-indent: -999em; background: url(../images/text/search_extended.gif) no-repeat 0 top; margin: 5px 0 0 0; }
	#search a.active { background-position: 0 bottom; }
	#search form { display: block; background: url(../images/sidebar/navi_header.png) no-repeat 0 0; padding: 10px 20px 0 22px; position:absolute; top:-5px; overflow:visible;}
	#search ul li:first-child { padding: 10px 0 0 0; }
	#search form li input[type=text] { float: none; display: block; margin: 2px 0 10px 0; }
	
	
	#searchSuggest                {margin-top:5px; background: url(../images/sidebar/search_footer.png) no-repeat 0 bottom; padding: 0 0 11px 0; height:78px; position:relative;  }
  #searchSuggest form > div         {margin: 0 0 10px 0; }
  #searchSuggest input[type=text]       {float: left; width: 123px; border: 1px solid #fff; border-top: 1px solid #369; border-left: 1px solid #369; height: 18px;}
  #searchSuggest form             {display: block; width: 168px; background: url(../images/sidebar/navi_header.png) no-repeat 0 0; padding: 10px 20px 0 22px; position:absolute; top:-5px; overflow:visible;}
  #searchSuggest #searchSuggestResults    {display: none; border: 1px solid #369; border-top: none; background: #fff; position: absolute; width: 166px; top: 0; left: 0;}
  #searchSuggest small {display:block; font-size:9px; margin:5px 0 0;}
  /* nmAG - Umstellung nach li, da der Link von JS generiert wird */
  #searchSuggest #searchSuggestResults li    {display: block; padding: 2px 5px; text-decoration: none; color: #21578a;}  
  #searchSuggest #searchSuggestResults li.current    {background: #21578a; color: #fff; cursor: pointer;}
  #searchSuggest #searchSuggestResults li span     {color: #666;}
  #searchSuggest #searchSuggestResults li span.ac_match    {color: #21578a;}
  #searchSuggest #searchSuggestResults li.current span     {color: #fff;}
  /* ENDE nmAG */
	
	#navi li { vertical-align: bottom; display: block;} /* display:inline-block fuer IE7 */
	#navi li a { display: block; background: url(../images/sidebar/navi_level1_bg.png) no-repeat 0 top; padding: 10px 10px 0 37px; height: 15px; }
	#navi li a.active { background-position: 0 bottom; }
	#navi > ul > li { background: url(../images/sidebar/navi_footer.png) no-repeat 0 bottom; padding: 0 0 8px 0; }
	#navi > ul > li > ul > li:first-child { background: url(../images/sidebar/navi_filler.png) repeat-y 0 top; padding-top: 10px; }
	#navi li li ul { background: url(../images/sidebar/navi_level3_ul_bottom.png) no-repeat 0 bottom; padding: 0 0 25px 0; }
	#navi li li a { height: 20px; background: url(../images/sidebar/navi_level2_bg.png) no-repeat 0 top; padding: 5px 0 1px 46px; color: #21578a; text-decoration: none; font: bold 12px/18px Arial; }
	#navi li li a:hover { background-position: 0 bottom; }
	#navi li li a.active { height: 23px; background: url(../images/sidebar/navi_active_bg.png) no-repeat 0 top; padding: 11px 0 0 46px; }
	#navi li li li a { height: 18px; background: url(../images/sidebar/navi_level3_bg.png) no-repeat 0 top; padding: 0 0 0 32px; color: #21578a; text-decoration: none; font: normal 12px/18px Arial; text-transform: none;}
	#navi li li li a.active { padding: 0 0 0 32px; margin: 0; background: url(../images/sidebar/navi_level3_bg.png) no-repeat 0 bottom; height: auto; }
	#navi li li li a:hover { background-position: 0 bottom; }
	#navi li li li a span { font-size: 10px; color: #666; }
	
	#navi li.reduce > a { display: block; background: url(../images/sidebar/navi_level1_bg_reduce.png) no-repeat 0 top; ; padding: 7px 10px 3px 19px; height: 15px; }
	#navi li.reduce ul li ul { background: url(../images/sidebar/navi_level3_ul_bottom_reduce.png) no-repeat 0 bottom; padding: 0 0 12px 0; }
	#navi li.reduce ul li a { height:15px; background: url(../images/sidebar/navi_level2_bg_reduce.png) no-repeat 0 top; font-weight:bold; color:#21578a; font-size:11px; text-transform:uppercase; text-decoration:none; padding:3px 0 3px 46px; }
	#navi li.reduce li a:hover { background-position: 0 bottom; }
	#navi li.reduce li a span { font-weight:normal; color:#666; }
	#navi li.reduce li a.active { height: 23px; background: url(../images/sidebar/navi_active_bg.png) no-repeat 0 top; padding: 11px 0 0 46px; font-weight:bold; color:#21578a; font-size:11px; text-transform:uppercase; text-decoration:none; }
	#navi li.reduce li li a { height: 18px; background: url(../images/sidebar/navi_level3_bg.png) no-repeat 0 top; padding: 0 0 0 32px; color: #21578a; text-decoration: none; line-height: 18px; font-size: 12px; text-transform:none; font-weight:normal; }
	#navi li.reduce li li a.active { padding: 0 0 0 32px; margin: 0; background: url(../images/sidebar/navi_level3_bg.png) no-repeat 0 bottom; height: auto; text-transform:none; font-weight:normal;  }
	#navi li.reduce li li a:hover { background-position: 0 bottom; }
	#navi li.reduce li li a span { font-size: 10px; color: #666; }

  #sidebar .box { margin: 10px 0 0 0; font-size: 11px; line-height: 14px; color: #333; }
	#sidebar div.box { padding: 0 0 8px 0; background: url(../images/sidebar/navi_box_bottom.png) no-repeat 0 bottom; }
	#sidebar .box div.headline { margin: 0 0 15px 0; }
	#sidebar .box > div { background: url(../images/sidebar/navi_box_top.png) no-repeat 0 top; padding: 10px 15px 4px 20px; }
	#sidebar .box ul { list-style-type: disc; margin: 0 0 0 1.5em; }
	#sidebar .box li { margin-top: 2px; }
	#sidebar .box a { color: #21578a; }
	#sidebar .box a:hover { color: #21578a; text-decoration: none; }
	#sidebar .box a:visited { color: #21578a; }
  #sidebar .box input[type=text] { width: 155px; margin: 0 0 10px 0; border: 1px solid #fff; border-top: 1px solid #369; border-left: 1px solid #369; font-size: 11px; }
  #sidebar .box input[type=image] { margin: 10px 10px 0 0; }
  #sidebar .box input[type=checkbox] { float: left; }
  #sidebar .box .checkboxIndent { padding: 2px 0 0 23px; }
	#sidebar div.img_box { margin: 0 0 0 10px; padding: 0 0 10px 0; height: 104px; position: relative; }
  #sidebar div.img_box img { position: absolute; top: 0; left: 0; }
  #sidebar div.img_box p { position: absolute; top: 60px; left: 10px; width: 115px; font-size: 11px; line-height: 13px; color: #000; }
  #sidebar div.img_box p a { display: inline-block; color: #21578a; margin: 5px 0 0 0; }
	
  #breadcrumb { background: #fff; padding: 0 5px; }
  #breadcrumb > div { color:#000;  padding: 10px 10px 6px; }
  #breadcrumb > div a { color: #21578a; text-decoration: none; }
  #breadcrumb > div > span { color:#21578a; padding:0 2px; display:inline-block; }
	
#page { width: 750px; float: left; }
  #page div.container { margin: 10px 0 0 0; padding: 0 0 10px 0; background: url(../images/content_container_bg_footer.png) no-repeat 0 bottom; }
  #page div.container > div { padding: 0 15px 0px 15px; font-size: 11px; line-height: 14px; color: #5883AD; background: url(../images/content_container_bg.png) no-repeat 0 top; overflow: auto; }
  #page div.container h1 {font-weight: bold; margin: 10px 0 3px 0; padding: 0 0 0 18px; background: url(../images/icons/icon_info.gif) no-repeat 0 -4px; }
  #page div.container#seo h2 {font-weight: bold; margin: 10px 0 3px 0; padding: 0 0 0 18px; background: url(../images/icons/icon_info.gif) no-repeat 0 -4px; }
  #page div.container div.h2 { display: block; font-weight: bold; margin: 10px 0; }
  #page div.container h3 {font-weight: bold; margin: 10px 0 3px 0; padding: 0 0 0 18px; background: url(../images/icons/icon_info.gif) no-repeat 0 -4px; }
  #page div.container a { color: #5883AD; text-decoration: none; }
  #page div.container a:hover { text-decoration: underline; }
  
  /* nmAG - alter Footer */
  #footer_small { height: 40px; background: url(../images/footer_bg.png) repeat-y 0 0; padding: 0 0 0 13px; margin: 15px 0; }
  #footer_small li { float: left; padding: 0 7px; background: url(../images/footer_divider.gif) no-repeat left center; color: #fff; }
  #footer_small li.first-child,
  #footer_small li:first-child { background: none; }
  #footer_small li a { display: block; color: #5883AD; text-decoration: underline; padding: 12px 0 12px; font-size: 11px; }
  #footer_small li a:hover { text-decoration: none; }
  #footer_small > a     { display: block; float: right; text-indent: -999em; background: url(../images/footer_logo.gif) no-repeat 0 0; width: 121px; height: 21px; margin: 9px 10px 0 0; }

  /* nmAG - neuer Footer */
  #footer .logo { display: block; width: 121px; height: 21px; float: right; background: url(../images/footer/logo.gif) no-repeat 0 0; text-indent: -999em; margin: 20px 0 0 0; }
  #footer strong { font-weight: bold; }
  #footer ul.last li { float: left; padding: 0 3px 0 0; }
  #footer ul.last li a {padding: 0 0 0 3px; }
  
  /* Social bookmarks */
    #social_icons { margin: 20px 0 0 0; zoom: 1; }
    #social_icons a { text-decoration: none; text-indent: -9999px; width: 25px; height: 25px; display: block; float: left; background: no-repeat top left; margin-top: 2px; margin-right: 5px; }
    #social_icons a.google { background-image: url(../images/footer/social_google.gif); }
    #social_icons a.mrwong { background-image: url(../images/footer/social_mrwong.gif); }
    #social_icons a.twitter { background-image: url(../images/footer/social_twitter.gif); }
    #social_icons a.facebook { background-image: url(../images/footer/social_facebook.gif); }
    #social_icons a.delicious { background-image: url(../images/footer/social_delicious.gif); }
  
/* base 2 */
#canvas_base2 { width: 960px; height: 536px; background: url(../images/logo.jpg) no-repeat 0 0; }
#canvas_base2 #page { background: url(../images/page_top_no_content.gif) no-repeat top left transparent; padding-top:23px;}
#canvas_base2 #search { background: url(../images/sidebar/navi_header_basket.png) no-repeat 0 bottom; }
#canvas_base2 #search form { background: url(../images/sidebar/navi_header_basket.png) no-repeat 0 0;}

#canvas_base2 div.content_border_top { background:url(../images/content_border_top_basket.png) top center no-repeat transparent !important;}

#canvas_base2 #container { background: url(../images/content_basket_top.png) no-repeat 0 0 #fff;}
#canvas_base2 #content_base2 { background: url(../images/content_basket_bottom.png) no-repeat bottom; height:100%; padding-bottom:20px;}

/* base 3 */
#canvas_base3 { width: 960px; min-height: 536px; background: url(../images/logo.jpg) no-repeat 0 0; }	
#canvas_base3 a { color:#21578a; text-decoration:none; }	

#canvas_base3 #meta { height: 121px; }	
#canvas_base3 #meta a { color:#fff; text-decoration:underline; }	
#canvas_base3 #head { width:950px; height:19px; margin-left:10px; background:url(../images/checkout/checkout_navi_bg_top.png) no-repeat left top; padding:5px 0 0 10px; position: relative; }
#canvas_base3 #head div { position: absolute; top: -5px; left: 200px; width: 381px; height: 20px; padding: 9px 0 0 10px; background:url(../images/checkout/checkout_page_header.png) no-repeat left top; }

#canvas_base3 #container_left {  width:960px; margin-left:10px; background:url(../images/checkout/checkout_navi_bg_left.png) no-repeat left top; padding-left:10px; overflow:visible; }
#canvas_base3 #container_right {  width:940px; padding-right:10px; min-height: 536px; background:url(../images/checkout/checkout_navi_bg_right_2.png) no-repeat right top;  }
#canvas_base3 #page_top {width:940px; background:url(../images/checkout/checkout_page_top.png) no-repeat top #fff;  }
#canvas_base3 #page { min-height:536px; width:100%; float:none; position:relative; bottom:-7px; background:url(../images/checkout/checkout_page_bottom.png) no-repeat center bottom; }

#canvas_base3 #sidebar { position:absolute; margin-top:30px; width:190px; margin-right:30px; background:url(../images/checkout/checkout_sidebar_bg.gif) repeat-y;}
#canvas_base3 #sidebar h2 { height:30px; padding:20px 0 0 15px; background:url(../images/checkout/checkout_sidebar_bg_top.png) 0 0 no-repeat;}
#canvas_base3 #sidebar ul { margin-left: 15px;}

/* Abweichende formatierung fuer IE 7 */
/* IE kann display:inline-block nicht auf li-Elemente andwenden. Opera kann li-Elemente nicht floaten */ 
/* daher fuer alle ausser IE display-inline und fuer IE float */
#canvas_base3 ul#progressbar { padding:30px 0 0 220px; background-color:transparent; height:39px; }
#canvas_base3 ul#progressbar li { display:inline-block; width:auto; height:39px; padding-left:39px; background-repeat:no-repeat; background-position:top left; float:none;}
#canvas_base3 ul#progressbar li + li { margin-left:10px; }
#canvas_base3 ul#progressbar li a { text-indent:0; display:block; padding: 13px 21px 12px 10px; height:14px;}
#canvas_base3 ul#progressbar li a:hover { background:none;}
#canvas_base3 ul#progressbar li a.active { background: url(../images/checkout_progressbar/progress_active.png) no-repeat top right; }
#canvas_base3 ul#progressbar li a.inactive { background: url(../images/checkout_progressbar/progress_inactive.png) no-repeat top right; }
#canvas_base3 ul#progressbar li a.done { background: url(../images/checkout_progressbar/progress_done.png) no-repeat top right; }

#canvas_base3 #footer { margin-left:210px;}
#canvas_base3 #footer > a { margin: 9px 20px 0 0;}

#canvas_base4 { width: 960px; height: 536px; background: url(../images/logo.jpg) no-repeat 0 0; }
#canvas_base4 #page { width: 940px; padding-left:20px; background:url(../images/page_back_left_base4.png) 10px 0 no-repeat transparent; }
#canvas_base4   #backlink { float:left; width: 190px; height:18px; padding:5px 0 0 0; background:url(../images/page_back_top_left_base4.png) 0 0 no-repeat transparent; }
#canvas_base4   #breadcrumb { padding: 0 0 0 7px; height: 23px; float: left; width: 378px; }
#canvas_base4   .filler { background: #F2D8A5; height: 22px; border-top: 1px solid #fff; border-right: 1px solid #fff; }
#canvas_base4   #content div.content_border_top { background:url(../images/content_border_top_base4.png) top center no-repeat transparent; width:940px; }
#canvas_base4   #content div.content_border_bottom { background:url(../images/content_border_bottom_base4.png) bottom center no-repeat transparent; position: relative; margin-top:-11px; left:0; height:12px; z-index:9999;}
#canvas_base4 #footer { margin-left:190px;}
#canvas_base4 #footer_small { margin-left:191px;}
#canvas_base4 #footer_small > a { margin: 9px 20px 0 0;}
#canvas_base4 #main_tab_top { background: url(../images/header_main_tab_top.png) no-repeat scroll center top transparent; bottom: 0; height: 5px; left: 210px; position: absolute; width: 385px; z-index: 999; }

/* Tables */
table.inline { margin: 0; padding: 0; border: 0; margin: 12px 0 0 0; width: 100%; border-bottom: 3px solid #BCCCDC; }
table.inline th,
table.inline td { padding: 3px 10px; border-top: 1px solid #BCCCDC; vertical-align: top; }
table.inline th { font-weight: bold; }
table.inline thead { background-color: #E3F0F8; }
table.inline thead th { border-bottom: 2px solid #BCCCDC; border-top: 0; }
table.inline tbody tr.odd th,
table.inline tbody tr.odd td { background-color: #fff; }
table.inline tbody tr th { background-color: #E3F0F8; width: 4em;}
table.inline tbody tr.odd th { background-color: #E3F0F8; }
table.inline td img.icon { vertical-align: top; }

/* Tooltip Styles */
#tooltip { position: absolute; display: none; width: 250px; z-index: 10004; background: url(../images/tooltip.png) no-repeat 0 top; }
#tooltip div.inner { background: url(../images/tooltip.png) no-repeat 0 bottom; position: relative; padding: 0 25px 35px 25px; bottom: -25px; }
#tooltip div.headline { font-weight: bold; padding: 0 0 0 18px; margin: 0 0 10px 0; background: url(../images/icons/icon_info.gif) no-repeat 0 -2px; }
#tooltip div.content { color: #000; }

/* Alter Tooltip Styles for display below link */
#tooltip.below {background: url(../images/tooltip2.png) no-repeat 0 top;}
#tooltip.below div.inner	{background: url(../images/tooltip2.png) no-repeat 0 bottom; padding: 10px 25px 25px 25px; bottom: -25px;}

/* Tinytip Styles */
#tinytip { position: absolute; display: none; width: 150px; z-index: 10004; background: url(../images/tinytip.png) no-repeat 0 top; }
#tinytip div.inner { background: url(../images/tinytip.png) no-repeat 0 bottom; position: relative; padding: 0 10px 20px 10px; bottom: -17px; }
#tinytip div.content { color: #000; margin-top: -7px; text-align: center; }

/* Alter Tinytip Styles for display below link */
#tinytip.below {background: url(../images/tinytip2.png) no-repeat 0 top;}
#tinytip.below div.inner { background: url(../images/tinytip2.png) no-repeat 0 bottom; padding: 10px 10px 10px 10px; bottom: -19px;}

/* Styles für modales Overlay */
.modalOverlay { position: absolute; visibility: hidden; z-index:10000; } 
.modalOverlay ul.newList{ z-Index: 10003; } 
.modalOverlay .close { position:absolute; right:-15px; top:-15px; cursor:pointer; height:35px; width:35px; }

/* Links */
a.info        {display: inline-block; background: url(../images/icons/icon_info.gif) no-repeat 0 top; padding: 0 0 0 18px; }
a.infoButton  {display: inline-block; background: url(../images/icons/icon_info.gif) no-repeat 0 center; padding: 0 0 0 18px; text-indent: -9999px;}
