@charset "UTF-8";

/* Generell */

* {
  margin: 0; 
  padding: 0;
  border: 0;
  text-decoration: none;
}

html {
  background-color: #286ac4;
  background-image: url(../images/design/background.jpg);
  background-repeat: no-repeat;
  background-position: top center;
}

body {
  background-color: #286ac4;
  background-image: url(../images/design/background.jpg);
  background-repeat: no-repeat;
  background-position: top center;
}

a {
  color: #ffffff;
  text-decoration: underline;
}

/* Layout */

div#wrapper {
  position: relative;
  text-align: left;
  width: 1258px;
  height: 100%;
  margin: 0 auto;
}


/* -- Header */

div#header {
  background-image: url(../images/design/header-bg.png);
  position: absolute;
  top: 0px;
  width: 1251px;
  height: 143px;
}

div#header p.header-timedate {
  font: bold 13px Verdana, Arial, sans-serif; 
  color: #ffffff; 
  text-align: center;
  float: left;
  margin-left: 15px;
  margin-top: 110px;
  width: 184px;
}

div#header h1 {
  font: bold 18px Verdana, Arial, sans-serif; 
  margin-top: 83px;
  margin-right: 20px;
  float: right;
  color: #ffffff; 
  text-align: right;
}

div#header h2 {
  font: bold 18px Verdana, Arial, sans-serif; 
  margin-top: 110px;
  margin-left: 250px;
  color: #ffffff; 
  text-align: left;
}

div#header-logo {
  background-image: url(../images/design/header-logo.png);
  position: absolute;
  margin-left: 33px;
  margin-top: 0px;
  width: 151px;
  height: 65px;
}

div#header-logo a {
  display: block;
  text-decoration: none;
  width: 202px;
  height: 29px;
}


/* -- Main */

div#main {
  background-image: url(../images/design/main-bg.png);
  background-repeat: repeat-y;
  position: relative;
  top: 143px;
  width: 1251px;
}


/* -- Content */

div#content {
  width: 1010px;
  float: right;
  margin-right: 20px;
}


/* ---- Text */

p.text {
  background-image: url(../images/design/text-bg.png);
  background-repeat: repeat-y;
  width: 991px;
  margin-left: 13px;
  color: black;
  padding: 10px 10px 10px 5px;
  font: small/1.5 "Tahoma", "Bitstream Vera Sans", Verdana, Helvetica, sans-serif;
}

p.text a {
  color: black;
}

p.text-footer {
  background-image: url(../images/design/text-footer-bg.png);
  background-repeat: no-repeat;
  width: 991px;
  height: 18px;
  margin-left: 13px;
  color: black;
  padding: 10px;
  font: small/1.5 "Tahoma", "Bitstream Vera Sans", Verdana, Helvetica, sans-serif;
}

/* ---- Tables */

table,img {
  border: none;
}

table,td {
  border: 1px solid #CCC;
  border-collapse: collapse;
  font: small/1.5 "Tahoma", "Bitstream Vera Sans", Verdana, Helvetica, sans-serif;
}

table {
  width: 97%;
  margin: 0 auto;
  margin-bottom: 10px;
  border: none;
  text-align: center;
  border: 1px solid #CCC;
}

thead th,tbody th {
  background: url(../images/design/th_bck.gif) repeat-x;
  background-color: #ffffff;
  color: #666;
  font-size: 11px;  
  padding: 5px 10px;
  border-left: 1px solid #CCC;
}

thead th.th2 {
  border-top: 1px solid #CCC;
  background-image: none;
}

thead th.first {
}

tbody th {
  background: #fafafb;
  border-top: 1px solid #CCC;
  text-align: left;
  font-weight: normal;
}

tbody tr {
  background-color: #ffffff;
  padding: 5px 10px;
  color: #666;
}

tbody td {
  padding: 5px 10px;
  color: #666;
}

tbody tr:hover {
  background: #FFF url(../images/design/tr_bck.gif) repeat;
}

tbody tr:hover td {
  color: #454545;
}

tfoot td, tfoot th {
  border-left: none;
  border-top: 1px solid #CCC;
  padding: 4px;
  background: #FFF url(../images/design/foot_bck.gif) repeat;
  color: #666;
}

caption {
	text-align: left;
	font-size: 120%;
	padding: 10px 0;
	color: #666;
}

table a:link {
  color: #666;
}

table a:visited {
  color: #666;
}

table a:hover {
  color: #003366;
  text-decoration: none;
}

table a:active {
  color: #003366;
}


/* ---- Tables - Navigationsleiste */

table.bottommenu {
  position: relative;
  border: none;
  width: 980px;
  height: 50px;
  color: #fff;
  background: url(../images/design/table-menu-bg.png) top left no-repeat;
}

table.bottommenu tbody {
  color: #fff;
}

table.bottommenu a:link {
  color: #fff;
}

table.bottommenu a:visited {
  color: #fff;
}

table.bottommenu tbody tr {
	background:transparent;
  color: #fff;
}

td.bottomleft {
  border: none;
  width: 100px;
  height: 50px;
}

td.bottomleft:hover {
  background: transparent url(../images/design/table-menu-hover.png) 10px 5px no-repeat;
}

td.bottomcenter {
  border: none;
  margin-left: 106px;
  width: 745px; 
}

td.bottomright {
  border: none;
  width: 100px;
  height: 50px;
  margin-left: 865px;   
}

td.bottomright:hover {
  background: transparent url(../images/design/table-menu-hover.png) 10px 5px no-repeat;
}

a.btm {
  color: #fff;
}

table.bottommenu tr:hover {
}

table.bottommenu tr:hover td {
}

/* ---- Analoganzeiger */

div.analoganzeige-k {
  position: relative;
  float: left;
  background: url(../images/design/analoganzeige-k-bg.png) top left no-repeat;
  margin-bottom: 15px;
  margin-left: 40px;
  width: 275px;
  height: 340px;
  font: 14px Verdana, Arial, sans-serif; 
  color: #ffffff; 
}

div.analoganzeige-k p.name {
  position: absolute;
  top: 8px;
  left: 17px;
  width: 236px;
  text-align: center;
}

div.analoganzeige-k p.wert {
  position: absolute;
  top: 313px;
  left: 14px;
  width: 242px;
  text-align: center;
}

div.analoganzeige-k img {
  position: absolute;
  top: 42px;
  left: 16px;
  height: 243px;
  width: 243px;
  text-align: center;
}

div.analoganzeige-s {
  position: relative;
  float: left;
  background: url(../images/design/analoganzeige-s-bg.png) top left no-repeat;
  margin-bottom: 15px;
  margin-left: 40px;
  width: 244px;
  height: 349px;
  font: bold 14px Verdana, Arial, sans-serif; 
  color: #ffffff; 
}

div.analoganzeige-s p.name {
  position: absolute;
  top: 14px;
  left: 0px;
  width: 236px;
  text-align: center;
  color:#3476cd;
}

div.analoganzeige-s p.wert {
  position: absolute;
  top: 304px;
  left: 0px;
  width: 236px;
  text-align: center;
  color:#3476cd;
}

div.analoganzeige-s a {
  color:#3476cd;
    display:none;
}

div.analoganzeige-s img {
  position: absolute;
  top: 39px;
  left: 14px;
  height: 243px;
  width: 213px;
  text-align: center;
}

div.analoganzeige-g {
  position: relative;
  float: left;
  background: url(../images/design/analoganzeige-g-bg.png) top left no-repeat;
  margin-bottom: 10px;
  margin-left: 20px;
  width: 480px;
  height: 580px;
  font: bold 18px Verdana, Arial, sans-serif; 
  color: #ffffff; 
}

div.analoganzeige-g p.name-g {
  position: absolute;
  top: 6px;
  left: 8px;
  width: 457px;
  text-align: center;
}

div.analoganzeige-g p.wert-g {
  position: absolute;
  top: 523px;
  left: 5px;
  width: 457px;
  text-align: center;
}

div.analoganzeige-g img {
  position: absolute;
  top: 65px;
  left: 30px;
  height: 415px;
  width: 415px;
  text-align: center;
}

div.analoganzeige-k-wert {
  position: relative;
  float: left;
  background: url(../images/design/analoganzeige-k-wert-bg.png) top left no-repeat;
  margin-bottom: 5px;
  margin-left: 35px;
  width: 216px;
  height: 155px;
  font: bold 12px Verdana, Arial, sans-serif; 
  color: #ffffff; 
}

div.analoganzeige-k-wert p.name-a-k {
  position: absolute;
  top: 24px;
  left: 0px;
  width: 216px;
  text-align: center;
  color:#1d4985;
}

div.analoganzeige-k-wert p.wert-a-g {
  position: absolute;
  top: 60px;
  color: #1d4985;
  left: 0px;
  font: 30px Verdana, Arial, sans-serif; 
  width: 216px;
  text-align: center;
}

div.analoganzeige-k-wert p.wert-a-k {
  position: absolute;
  top: 117px;
  left: 0px;
  width: 216px;
  text-align: center;
  color:#1d4985;
}


/* ---- Skalen */

div.skala-k {
  position: relative;
  float: left;
  background: url(../images/design/skala-k-bg.png) top left no-repeat;
  margin-bottom: 5px;
  margin-left: 10px;
  width: 144px;
  height: 349px;
  font: bold 14px Verdana, Arial, sans-serif; 
  color: #ffffff; 
}

div.skala-k p.name {
  position: absolute;
  top: 14px;
  left: 5px;
  width: 125px;
  text-align: center;
  color:#3476cd;
}

div.skala-k p.wert {
  position: absolute;
  top: 304px;
  left: 3px;
  width: 125px;
  text-align: center;
  color:#3476cd;
}

div.skala-k img.skala {
  position: absolute;
  top: 64px;
  left: 30px;
  text-align: center;
}

div.skala-k img.skala-temp {
  position: absolute;
  top: 61px;
  left: 20px;
  text-align: center;
}

div.skala-k img.skala-druck {
  position: absolute;
  top: 67px;
  left: 20px;
  text-align: center;
}

div.skala-k img.skala-feuchte {
  position: absolute;
  top: 67px;
  left: 20px;
  text-align: center;
}

div.skala-k img.skala-regen {
  position: absolute;
  top: 67px;
  left: 20px;
  text-align: center;
}

div.skala-k img.skala-balken {
  position: absolute;
  border: 1px solid black;
  bottom: 64px;
  left: 80px;
  width: 22px;
  text-align: center;
}

div.skala-horizontal-long {
  position: relative;
  float: left;
  background: url(../images/design/skala-horizontal-bg.png) top left no-repeat;
  margin-bottom: 5px;
  margin-left: 90px;
  width: 825px;
  height: 120px;
  font: bold 12px Verdana, Arial, sans-serif; 
  color: #ffffff; 
}

div.skala-horizontal-long img.skala-balken-long {
  position: absolute;
  border: 1px solid black;
  top: 67px;
  left: 15px;
  height: 12px;
  text-align: center;
}

div.skala-horizontal-long img.skala-long {
  position: absolute;
  top: 50px;
  left: 12px;
  height: 16px;
  width: 800px;
  text-align: center;
}

div.skala-horizontal-long img.skala-long-ms {
  position: absolute;
  top: 84px;
  left: 12px;
  height: 16px;
  width: 800px;
  text-align: center;
}

div.skala-horizontal-long p.name-long {
  position: absolute;
  top: 24px;
  left: 330px;
  width: 125px;
  text-align: center;
  color: #3476cd;
}


/* ---- Diagramm */

div.diagramm-g {
  position: relative;
  float: left;
  background: url(../images/design/diagramm-g-bg.png) top left no-repeat;
  margin-bottom: 10px;
  margin-left: 90px;
  width: 825px;
  height: 521px;
  font: bold 12px Verdana, Arial, sans-serif; 
  color: #ffffff; 
}

div.diagramm-g img {
  position: absolute;
  top: 11px;
  left: 12px;
  text-align: center;
}

div.diagramm-g img.overlay-winddirection {
  position: absolute;
  top: 55px;
  left: 200px;
  text-align: center;
}

div.diagramm-g img.overlay-winddirection-hideie {
  position: absolute;
  top: 55px;
  left: 200px;
  text-align: center;
}

p.diagramm-legend {
  margin-left: 90px;
  width: 830px;
  color: #ffffff; 
  font: bold 12px Verdana, Arial, sans-serif; 
}

div.diagramm-k {
  position: relative;
  float: left;
  background: url(../images/design/diagramm-k-bg.png) top left no-repeat;
  margin-bottom: 10px;
  margin-left: 55px;
  width: 424px;
  height: 269px;
  font: bold 12px Verdana, Arial, sans-serif; 
  color: #ffffff; 
}

div.diagramm-k img {
  position: absolute;
  top: 11px;
  left: 12px;
  text-align: center;
}

/* -- Navigation */

div#navigation {
  padding-top: 20px;
  margin-left: 15px;
  padding-bottom: 5px;
  width: 184px;
}

ul#navigation-links {
  width: 184px; 
  list-style-type: none;
}

ul#navigation-links li.navigation-seperator {
  height: 2px;
  display:none;
}

ul#navigation-links li {
  height: 27px;
  background: url(../images/design/menubg.gif) bottom repeat-x;
  margin-bottom:2px;
}

ul#navigation-links li.navigation-dir {
  height: auto;
  background: url(../images/design/menubg.gif) no-repeat;
  background-position:0 2px;
}

ul#navigation-links a {
  width: 184px; 
  height: 20px;  
  font: bold 12px Verdana, Arial, sans-serif; 
  color: #ffffff; 
  text-decoration: none; 
  padding: 7px 0 0 8px; 
  display: block !important; 
  display: inline-block;
}

ul#navigation-links a:hover {
  background-color: transparent;
  background: url(../images/design/navigation-hover.gif) top no-repeat;
  background-position:0 2px;
  color: #fff;
}

/* ---- Subnavigation */

ul#navigation-links ul {
  background: url(../images/design/subnavigation-bg.png) left repeat-y;
  /* background-color: #36a2c2; */
  list-style-type: none;
  margin-top: 2px;
  margin-bottom: 2px;
  position: relative;
  width: 184px;
  z-index: 599;
}

ul#navigation-links ul a {
  width: 173px; 
  height: 20px; 
  border-left: none; 
  font: 11px Verdana, Arial, sans-serif; 
  color: #ffffff; 
  text-decoration: none; 
  padding: 5px 0 0 6px;
  margin-left:2px;
  display: block !important; 
  display: inline-block;
}

ul#navigation-links ul a:hover {
  background: url(../images/design/subnavigation-hover.png) center repeat-x;
}

ul#navigation-links ul li {
  height: 27px;
  background: none;
}

ul#navigation-links ul li.subnavigation-first {
  height: 27px;
  background: url(../images/design/subnavigation-first-bg.png) top left no-repeat;
}

ul#navigation-links ul li.subnavigation-last {
  height: 27px;
  background: url(../images/design/subnavigation-last-bg.png) bottom left no-repeat;
  margin-bottom:0;
}

/* -- Footer */

div#footer {
  background-image: url(../images/design/footer-bg.png);
  background-repeat: no-repeat;
  position: absolute;
  width: 1251px;
  height: 55px;
  z-index: 598;
}

div#footer a.copyright {
  display: block;
  text-decoration: none;
  font: bold 10px Verdana, Arial, sans-serif; 
  color: #fff; 
  margin-top: 55px;
  margin-left: 1105px;
}

div#footer a.printer {
float: left;
  display: block;
  text-decoration: none;
  font: bold 10px Verdana, Arial, sans-serif; 
  color: #fff; 
  margin-top: 55px;
  margin-left:3px;
}


p.footer-impressum {
  display: block;
  float: left;
  text-decoration: none;
  font: bold 10px Verdana, Arial, sans-serif; 
  color: #fff; 
  margin-top: 55px;
  margin-left: 310px;  
}

.mapoverlay {
  background-image: url(../images/design/mapoverlay.png);
  height:263px;
  width:215px;
  position:absolute;
  top:37px;
  left:13px;
}

.tendenz {
  position:absolute;
  bottom:75px;
  right:47px;
}
  
#designauswahl {
	color:#fff;
	font-family:Verdana, Geneva, sans-serif;
	font-size:8pt;
	margin-top:10px;
	margin-bottom:3px;
}
  
#fav_starbucks_drink {
	width:184px;
	padding:3px;
	font:Verdana, Geneva, sans-serif;
	font-size:10pt;
	color:#333;
	background:#eee;
  	-webkit-border-radius: 3px;
  	-moz-border-radius: 3px;
  	border-radius: 3px;
}
/* Layout End */