@charset "UTF-8";

/****************************************************************************

	wbz.css
	CSS-Klassen für wetter.bz.it und teilweise für m.wetter.bz.it.
	Für m.wetter.bz.it:
		wbz.css muss eingebunden werden, da mwbz.css darauf basiert 
		und diese modifiziert.
	
	Autor: Bettr.info

	$Revision: 1279 $
	$LastChangedDate: 2010-08-23 17:10:14 +0200 (Mo, 23 Aug 2010) $
	$LastChangedBy: Klaus_Delueg $
	
****************************************************************************/

/* stripping default browser styling */
:link,:visited { text-decoration: none; }

ul,ol { list-style: none; }

h1, h2, h3, h4, h5, h6, pre, code { font-size:1em; }

ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, body, html, blockquote, fieldset, input
{ margin: 0px; padding: 0px; } /*p,*/ 

/** { margin: 0; padding: 0; }*/

a img, :link img, :visited img { border:none; }

address { font-style: normal; }

select, input, p, textarea {
	font-family: Verdana, Arial, Helvetica, sans-serif;
}

/***********************************************/
/* Layout Divs                                 */
/***********************************************/

body {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #666666;
	font-style: normal;
}

#body {
	background: url(../images/wbz_bg.gif) top left repeat-x #A9BF00;
}

#Header {
	/*padding: 30px 15px 0px 15px;*/
	padding: 0px;
	margin: 0px;
	background-color:#FFFFFF;
	/*width: 100%;*/
	/*background: url(../images/wbz_header_bg.png) top left no-repeat #FFFFFF;*/
	height: 145px;
}

#HeaderBG {
	padding: 30px 15px 0px 15px;
	margin: 0px;
	/*width: 100%;*/
	background: url(../images/wbz_header_bg.png) top left no-repeat;
	height: 145px;
}

/* gelbe Linie, die rechts oben den contentbereich abschliesst */
.HeaderLineRight {
	width: 5px;
	height:45px;
	margin-top: -47px;
	margin-left:800px;
	/*float: right; funktioniert nicht im IE */
	background-color:#FFD400;
	color:#FFD400;
	border: none;
	position: relative;
	z-index: 2;
}

#Logo {
	padding: 0px;
	float: left;
	position: absolute;
	z-index: 3;
}

.BetaLink {
	position: absolute;
	margin: 0px;
	padding: 0px;
	width: 80px;
	height: 20px;
	z-index: 2;
}

.BetaLink:hover {
	background: url(../images/wbz_beta_hover.png) no-repeat scroll 0px 0px;
}

#Main {
	padding: 0px;
	margin: 0px auto 0px auto;
	width: 805px;
	/*max-width: 805px;*/ /* damit auf mobile 100% */
}

#BreadCrumbs {
	color: #888F98;
	float: left;
	font-size: 12px;
	height: 29px;
	/*padding: 0px 60px 10px 60px;*/
}

#BreadCrumbs a {
	border-bottom: 1px dotted #888F98;
	color: #888F98;
	padding: 0px 2px 1px 2px;
	text-decoration: none;
}

#BreadCrumbs a:hover {
	color: #FFFFFF;
	border-bottom: none;
	text-decoration: none;
	background-color: #A9BF00;
}

#Content {
	color: #666666;
	padding: 20px 5px 5px 5px;
	text-align: left;
	margin: auto;
	margin-top: 0px;
	background-color: #FFFFFF;
	border-left: 5px solid #FFD400;
	border-right: 5px solid #FFD400;
	min-height: 280px;
	height: auto !important;
	height: 300px;  /*für den IE 6 */
	line-height: 20px;
}

.Col1_1 {
	padding: 0px 60px 20px 60px;
}

.Col1_2 {
	float: left !important;
	margin: 0px;
	padding: 0px;
}

.Col2_2 {
	margin-left: 395px;
}

.Col1_1 p {
	margin-bottom: 20px;
}

#TabNav {
	height: 26px;
	position: relative;
	z-index: 2;
	font-size: 11px;
}

#TabNav li {
	border-right: 1px solid #FFFFFF;
	border-bottom: 1px solid #FFFFFF;
	float: left;
	cursor: pointer;
}

#TabNav a {
  display: block;
  color: #666666; 
  background: #E6E6E6; 
  text-align: center; 
  padding: 2px 4px; 
  text-decoration: none; 
  float: left;
  border: 1px dotted #B2B2B2;
}

#TabNav a:hover, #TabNav a.Sel {
  background: #FFFFFF;
  border-bottom: 1px solid #FFFFFF;
  position: relative;
  z-index: 2;
}

.TabContent {
	border: 1px dotted #B2B2B2;
	display: block;
	min-height: 240px;
	height: auto;
	padding: 15px 8px 0px 8px;
	position: relative;
	top: -1px;
	z-index: 1;
}

#DetailLinks {
	background-color: #FFFFFF;
	border-left: 5px solid #FFD400;
	border-right: 5px solid #FFD400;
	color: #666666;
	height: auto !important;
	line-height: 20px;
	margin: 0 auto auto;
	padding: 5px 10px 20px;
	text-align: left;
	font-size: 11px;
}

#DetailLinks p {
	margin-top: 5px;
	padding-top: 0px;
}

#BottomNav { 
	height: 85px;
	background-color: #FFD400;
	margin: 0px;
	padding: 0px;
}

#BottomDistance { /* dient zum horiz. zentrieren */
	float: left;
	height: 50%;
	margin-bottom: -23px;
	width: 1px;
}

.BottomNavBox { /* Notwendig um BottomNav richtig ausrichten zu können. */
	clear: left; /* wegen distance */
	width: 710px;
	margin-left: auto;
	margin-right: auto;
	position: relative;
	z-index: 20; /* !!! für IE */
	text-align: center; /* für IE */
}

.BottomNavBox .BottomNavItem{
	float: left;
	text-align: left;
	position: relative;
	z-index: 30; /* !!! für IE */
	padding: 0px 10px 0px 10px;
	height:25px;
}

.BottomNavBox .Line2{ /* Zweite Zeile */
	z-index: 20;
}

.BottomNavBox .BottomNavItem a.BottomMenue {
	font-size: 17px;
	color: #666666;
	font-weight: normal;
	text-decoration: none;
}

.BottomNavBox .BottomNavItem a.BottomMenue:active, 
.BottomNavBox .BottomNavItem a.BottomMenue:hover {
	color: #FFFFFF;
}

/************* # BOF Slider styles ***************/
.FeedMenue {
	/*margin: 5px 0px 0px 0px;*/
	margin: 0px;
}

.FeedbackMenue {
	margin: 5px 0px 0px 0px;
}

/* DROP-DOWN-MENU	*/
.SliderContainerBox {
	position: relative;
	z-index: 100;
	margin-top: -14px;
	margin-bottom: 10px;
}

.SliderContainer {
	clear: both;
	position: absolute;
	left: 16px;
	top: 15px;
	z-index: 1000;
}

.SliderListBM {
	background-color: #FFF2B2;
	padding: 10px;
	height: 95px;
	width: 300px;
	line-height: 25px;
	z-index: 1000;
}
.SliderSubList {
	display: none;	
}

.SliderUL, .SliderSubUL { 
	padding: 10px;
	background-color: #FFF2B2;
}

.SliderLI, .SliderSubLI {
	height: 25px !important;
}


.SMList { /* Sitemap-Listen */
	line-height: 25px;
}

.SubSliderContainer {
	 margin: 0px 0px 0px 240px;
}

.FeedList {
	border: 1px dotted #DE7000;
	/*clear: both;*/
	color: #DE7000;
	background-color: #F2C699;
	display: none;
}
* html .FeedList {
	width: 90px;
}
.FeedList ul, .FeedList ul li {
	padding: 0px; 
	margin: 0px;
	list-style: none;
	background-color: #F2C699;
}
.FeedList ul {
	/*clear: both;*/
	padding: 4px 8px 8px 8px;
}
.FeedList li a {
	display: block;
	padding: 1px;
	text-decoration: none;
	color: #DE7000;
}

.FeedList li a:hover {
	color: #FFFFFF;
	background-color: #DE7000;
}

.FeedList li a:hover {
	color: #FFFFFF;
	background-color: #DE7000;
}

/************* # EOF Slider styles ***************/

/************* # BOF BookmarkStyles styles ***************/

.TextBM {
	font-size: 11px;
}

.BoxBM {
	width: 300px;
	padding: 8px 0px 0px 0px;
	height: 30px;
	overflow: hidden;
	margin: 0px;
}

.BoxBM ul{
	width: 400px;
	text-align: left;
	padding: 0px;
	margin: 0px;
}
	
.BoxBM ul li{
	display: inline;
	list-style-type: none;
	width: 30px;
	float: left;
}

.ImgBM {
	background-color: #FFFFFF;
	border: 1px solid #000000;
	padding: 1px;
}

.ImgBM:hover {
	background-color: #FFFFFF;
	border: 1px solid #A9BF00;
	padding: 0px;
}

/************* # EOF BookmarkStyles styles ***************/

#Footer {
	padding-top: 15px;
	text-align: center;
	vertical-align: middle;
	color: #666666;
	font-size: 12px;
	overflow: hidden;
	position: relative;
	z-index: 2; /* !!! für IE */
	width:805px;/*must have for any value*/; 
}

#Footer a {
	color: #FFFFFF;
	text-decoration: none;
}

#Footer a:hover {
	text-decoration: underline;
}
/* see BOF: http://www.cssplay.co.uk/menus/centered.html */

#Footer ul {
	float: left;
	left: 50%;
	list-style-type: none;
	margin: 0 auto;
	padding: 0;
	position: relative;
	z-index: 2; /* !!! für IE */
}

#Footer li {
	float: left;
	position: relative;
	z-index: 2; /* !!! für IE */
	right: 50%;
	padding: 0px 10px 0px 10px;
}

#Footer ul.Copyright {
	font-size: 11px;
}

#Footer ul.Copyright a {
	font-size: 11px;
	color: #666666;
	text-decoration:underline;
}

/* see EOF: http://www.cssplay.co.uk/menus/centered.html */

/************* #TopNavs style:  #TopLangNav uebergeordnet  **************/
#TopNavs {
	padding-top: 5px;
	height: 28px;
	color: #FFFFFF;
	font-size: 13px;
	position: relative;
	z-index: 2;
}

#TopNavs ul {
	color: #FFFFFF;
	font-weight: bold;
	display: block;
	list-style: none;
	overflow: hidden;
	width: auto;
	margin: 0px;
	padding: 0px;
}

#TopNavs ul li {
	float: left;
	list-style: none;
}

#TopNavs a {
	color: #FFFFFF;
	text-decoration: none;
	padding: 2px;
}

#TopNavs a:hover {
	color: #FFD400;
	text-decoration: none;
	background: #FFFFFF;
}

/************* #TopLangNav style: Sprachnavigation **************/
#TopLangNav {
	float: right;
}

/************* #LINKS styles ***************/

a.ArrowForward, a.ArrowForwardGreen, a.ArrowTopGreen, a.FeedGreen {
	background-repeat: no-repeat;
	background-position: 0px 2px; 
	margin: 0px; 
	padding: 0px 2px 0px 18px;
	text-decoration: none;
	border-bottom: 1px dotted #888f98;
	color: #888f98;
	line-height: 15px;
}

a.ArrowForwardGreen {
	background-image: url( ../images/arrow_green_forward.png );
}

a.ArrowForward {
	background-image: url( ../images/arrow_red_forward.png );
}

a.ArrowTopGreen {
	background-image: url( ../images/arrow_green_top.png );
	float: right;
}

a.FeedGreen {
	background: #FFFFFF url(../images/feed_green.png) no-repeat scroll 0px 2px;
}

a.ArrowForwardGreen:hover {
	background: #A9BF00;
	background-image: url( ../images/arrow_green_forward_o.png );
}

a.ArrowForward:hover {
	background: #B31939;
	background-image: url( ../images/arrow_red_forward_o.png );
}

a.ArrowTopGreen:hover {
	background: #A9BF00;
	background-image: url( ../images/arrow_green_top_o.png );
}

a.FeedGreen:hover {
	background: #A9BF00 url(../images/feed_green_o.png) no-repeat scroll 0px 2px;
}

a.ArrowForward:hover, a.ArrowForwardGreen:hover, 
a.ArrowTopGreen:hover, a.FeedGreen:hover {
	background-repeat: no-repeat;
	background-position: 0px 2px; 
	color: #FFFFFF;
}

a.ArrowEMail, a.ArrowEMailGreen {
	background-repeat: no-repeat;
	background-position: 0px 2px; 
	margin: 0px; 
	padding: 0px 2px 0px 18px;
	text-decoration: none;
	border-bottom: 1px dotted #888f98;
	color: #888F98;
}

a.ArrowEMail {
	background-image: url( ../images/arrow_red_email.png ); 
}

a.ArrowEMailGreen {
	background-image: url( ../images/arrow_green_email.png ); 
}

a.ArrowEMail:hover {
	background: #B31939;
	background-image: url( ../images/arrow_red_email_o.png );
}

a.ArrowEMailGreen:hover {
	background: #A9BF00;
	background-image: url( ../images/arrow_green_email_o.png );
}

a.ArrowEMail:hover, a.ArrowEMailGreen:hover {
	background-repeat: no-repeat;
	background-position: 0px 2px; 
	color: #FFFFFF;
}

a.ArrowExternal, a.ArrowExternalGreen {
	background-repeat: no-repeat;
	background-position: 0px 2px; 
	margin: 0px; 
	padding: 0px 2px 0px 18px;
	text-decoration: none;
	border-bottom: 1px dotted #888F98;
	color: #888F98;
}

a.ArrowExternal {
	background-image: url( ../images/arrow_red_external.png ); 
}

a.ArrowExternalGreen {
	background-image: url( ../images/arrow_green_external.png ); 
}

a.ArrowExternal:hover {
	background: #B31939;
	background-image: url( ../images/arrow_red_external_o.png );
}

a.ArrowExternalGreen:hover {
	background: #A9BF00;
	background-image: url( ../images/arrow_green_external_o.png );
}

a.ArrowExternal:hover, a.ArrowExternalGreen:hover {
	background-repeat: no-repeat;
	background-position: 0px 2px; 
	color: #FFFFFF;
	border-bottom: 1px dotted #888F98;
}

a.PlusOrange, a.MinusOrange, a.PlusYellow, a.MinusYellow, 
a.PlusGreen, a.MinusGreen, a.FeedYellow {
	background-repeat: no-repeat;
	background-position: 0px 2px; 
	margin: 0px; 
	padding: 0px 2px 0px 18px;
	text-decoration: none;
	border-bottom: 1px dotted #888F98;
}

a.PlusOrange, a.MinusOrange {
	color: #DE7000;
}

a.PlusGreen, a.MinusGreen {
	color: #A9BF00;
}

a.PlusYellow, a.MinusYellow, a.FeedYellow {
	color: #666666;
	white-space:nowrap;
}

a.PlusOrange:hover, a.MinusOrange:hover,
a.PlusYellow:hover, a.MinusYellow:hover,
a.PlusGreen:hover, a.MinusGreen:hover,
a.FeedYellow:hover {
	background-repeat: no-repeat;
	background-position: 0px 2px; 
	color: #FFFFFF;
	border-bottom: 1px dotted #888F98;
}

a.PlusOrange:hover, a.MinusOrange:hover {
	background-color: #DE7000;
}
a.PlusGreen:hover, a.MinusGreen:hover {
	background-color: #A9BF00;
}
a.PlusYellow:hover, a.MinusYellow:hover, 
a.FeedYellow:hover {
	background-color: #FFD400;
}

a.PlusOrange {
	background-image: url( ../images/plus_orange.png ); 
}

a.PlusOrange:hover {
	background-image: url( ../images/plus_orange_o.png ); 
}

a.MinusOrange {
	background-image: url( ../images/minus_orange.png );
}

a.MinusOrange:hover {
	background-image: url( ../images/minus_orange_o.png );
}

a.PlusYellow {
	background-image: url( ../images/plus_yellow.png );
}

a.PlusYellow:hover {
	background-image: url( ../images/plus_yellow_o.png );
}

a.MinusYellow {
	background-image: url( ../images/minus_yellow.png );
}

a.MinusYellow:hover {
	background-image: url( ../images/minus_yellow_o.png );
}

a.FeedYellow, a.FeedYellow:hover {
	background-position: 0px 0px;
	background-image: url( ../images/feed_yellow.png );
}

/************* #GoogleMaps styles ***************/

#BettrMap {
	width: 388px;
	height: 280px;
	background: #FFD400;
	border: 1px #FFD400 dotted;
}

/************* Einfache ToolTips-Styles ***************/

.SimpleTooltip-tip, .Header-tip {
	padding: 0px 9px 5px 9px;
	background-color: #FFF2B2; /*FDF6CC*/
	border: 1px dotted #FFD400;
	text-align: left;
	width: auto;
	max-width: 240px;
	font-size: 12px;
	cursor: pointer;
	z-index: 20;
}

.SimpleTooltip-title {
	color: #666666;
	font-weight: bold;
	border-bottom: 1px dotted #666666;
	padding-bottom: 5px;
	padding-top: 5px;
}

.SimpleTooltip-text, .Header-text {
	color: #666666;
	padding-top: 5px;
}

/* Sonstiges */

.Clear {
	clear: both;
    height: 0;
    font-size: 1px;
    line-height: 0px;
}

h3 {
	color: #666666;
	font-size: 17px;
	margin-bottom: 12px;
}

h4, h3.SubHL {
	color: #A9BF00;
	font-size: 15px;
	margin: 30px 0px 5px 0px;
}

/************* #WEATHER-Forecast-PseudoTable styles ***************/

div.FourRowsCentered {
    text-align: center;
    float: left; 
	width: 25%;
    margin: 0px; 
	padding: 0px;
}

div.ThreeRowsCentered {
    text-align: center;
    float: left; 
	width: 33%;
    margin: 0px; 
	padding: 0px;
}

div.FourRowsCentered p, div.ThreeRowsCentered p {
	margin: 0px;
	padding: 0px;
}

div.FourRowsCentered p.FirstCol, div.ThreeRowsCentered p.FirstCol {
	height: 30px;
	line-height: 14px;
}

/* BOF Formatierung der Mountainsgrafiken */
div.MountainsBox {
	float: left;
}

div.MountainsBox .MountainsBoxInner {
	/*width: 320px;
	margin: 0 auto;*/
}

div.MountainsBox h3 {
	font-weight: bold;
	font-size: 11px;
	color: #3B3B3B;
	margin-bottom: 0px;
}

div.MountainsBox .MouBoxOut h3 {
	margin-bottom: 21px;
}

div.MountainsBox .WindBox {
	width: 110px;
	text-align: center;
	float: left;
}
div.MountainsBox .WindBox div {
	padding-top: 10px;
}
div.MountainsBox .MouBoxOut {
	text-align: center;
	float: left;
	width: 210px;
}

div.MountainsBox .MouBoxOut .MouBox {
	margin: auto;
	height: 60px;
	width: 205px;
}

.WeatherMountainList {
	list-style: none outside;
	padding: 0px;
	color: #848F99;
	margin: 8px 0px 0px 0px;
	line-height: 13px;
	float: left;
}

/* EOF Formatierung der Mountainsgrafiken */

/* Styling Tabelle Detailwetter */
.WDetTbl {
	width: 100%;
	border: 0px;
	background-color: #eeeeee;
	padding: 15px;
	margin-bottom: 20px;
}

.WDetTdIcon {
	text-align: center;
	vertical-align: top;
	width: 110px;
}

h3.WDetHL {
	color: #A9BF00;
	font-size: 15px;
}

/************* #ELabel Styles ***************/

.ELabel {
	width: 45px;
	text-align: center;
	font-family: Verdana, Helvetica, Arial, sans-serif;
	font-size: 9px;
	font-weight: bold;
	color: #828f98;
	background-color: #FFFFFF;
	border: 1px #a6a6a6 solid;
	cursor: default;
}
.ELabelLT {
	color: #3399ff;
}
.ELabelHT {
	color: #b31939;
}

/************* #ExtInfoWindow Styles ***************/
/* 	#ExtInfoWindow = normale InfoWindows
	#ExtInfoWindowSmall = kleine InfoWindows z.b. wetter */


#ExtInfoWindow {
  /*width: 233px;*/
  width: 263px;
}

#ExtInfoWindowSmall, #DetWeatherInfoWin_contents{
  /*width: 195px;*/
  width: 225px;
}

#ExtInfoWindow_contents, #ExtInfoWindowSmall_contents, #DetWeatherInfoWin_contents {
  background-color: #FFFFFF;
  color: #3B3B3B;
}

#ExtInfoWindow_contents div {
  /*width: 220px;*/
  width: 250px;
  padding: 5px 5px 10px 5px;
  font-size: 10px;
  font-family: Verdana, Helvetica, Arial, sans-serif;
}

#ExtInfoWindowSmall_contents div, #DetWeatherInfoWin_contents div {
  padding: 12px 5px 12px 5px;
  font-size: 10px;
  font-family: Verdana, Helvetica, Arial, sans-serif;
}

#ExtInfoWindow_br, #ExtInfoWindow_bl, 
#ExtInfoWindowSmall_br, #ExtInfoWindowSmall_bl {
  width: 0px;
  height: 0px;
}

#ExtInfoWindow_tl, #ExtInfoWindow_tr, 
#ExtInfoWindowSmall_tl, #ExtInfoWindowSmall_tr {
  width: 1px;
  height: 1px;
}

/*#ExtInfoWindow_b, entfernt*/
#ExtInfoWindow_t, #ExtInfoWindowSmall_t {
  background-color: #a6a6a6; /* ok */
}

/*#ExtInfoWindow_b, #ExtInfoWindowSmall_b {
	background-color: #ffffff;
}*/

#ExtInfoWindow_l, #ExtInfoWindow_r, #ExtInfoWindowSmall_l, #ExtInfoWindowSmall_r {
  background-color: #A6A6A6; /* ok */
  width: 1px;
}

#ExtInfoWindow_close, #ExtInfoWindowSmall_close, #DetWeatherInfoWin_close {
  width: 15px;
  height: 12px;
  background: url('../images/close_infowin.png') top left no-repeat transparent;
  cursor: pointer;
}

#ExtInfoWindow_beak {
  /*width: 235px;
  background: url('../images/arrow_infowin.png') top left no-repeat transparent;
  */
  width: 265px;
  height: 17px;
  background: url('../images/arrow_infowin265px.png') top left no-repeat transparent;
  
}

#ExtInfoWindowSmall_beak {
  /*width: 197px;
  background: url('../images/arrow_infowin_small.png') top left no-repeat transparent;
  */
  width: 227px;
  height: 17px;
  background: url('../images/arrow_infowin_small227px.png') top left no-repeat transparent;
  
}

.LineBackground {
	background-color: #DDDDDD;
}