html, body {
        height:100%;
        }

body {
background-color: #33b2c3;
font-size: 11px;
font-family: Verdana, Arial, SunSans-Regular, Sans-Serif;
color:#222222;
padding:0;
margin:0;
}

div#outdated{
  height: 800px;
        width: 500px;
  position: absolute;
        top: 50%;
        left: 50%;
        margin: -400px 0px 0px -300px;
}
.uhrcenter {
text-align: center;
margin: 0;
padding: 0;
}
.center {
  position: absolute;
  background-color: #000000;
  top: 50%;
  left: 50%;
  margin-left: -400px; /*Zahl= halbe Breite des Bildes */
  margin-top: -250px; /* Zahl = halbe Höhe des Bildes */
}

.center1 {
  position: relative;
  top: 450px;
  left: 450px;


}
a {color: #222; text-decoration:none; font-weight: bold;}
a:visited {color:#222; text-decoration:none; font-weight: bold;}
a:hover {color: #222; text-decoration:none; font-weight: bold;}
a:active { color:#222; text-decoration:none; font-weight: bold;}

h1 {
font-size: 24px;
font-family: Lithos Pro, Copperplate-Gothic, Verdana;
text-transform:uppercase;
background-color: #004656;
border-top:1px solid #000;
border-bottom:1px solid #000;
padding:5px 10px;
margin:0;
color:#cbcbcb;
 }

h2 {
font-size:18px;
font-weight: normal;
padding: 5px 10px;
margin:0;
font-family: Lithos Pro, Copperplate-Gothic, Verdana;
color:#cbcbcb;
}

h2.cont {
font-size:14px;
font-weight: bold;
padding: 5px 10px;
margin:0;
font-family: Lithos Pro, Copperplate-Gothic, Verdana;
color:#222222;
}

h3 {
font-size: 11px;
font-family: Verdana, Arial, SunSans-Regular, Sans-Serif;
color:#222222;
font-weight: normal;
padding: 5px 10px;
margin:0;}

img.download {vertical-align:middle;}

/* ----------container zentriert das layout-------------- */
#container {
width: 1190px;
margin-bottom: 10px;
margin:0 auto;
background-color: #004656;
-webkit-border-radius: 15px;
        -khtml-border-radius: 15px;
        -moz-border-radius: 15px;
        border-radius: 15px;

}
#container1 {
width: 1190px;
margin-bottom: 10px;
margin:0 auto;
background-color: #000;
-webkit-border-radius: 15px;
        -khtml-border-radius: 15px;
        -moz-border-radius: 15px;
        border-radius: 15px;


}
 #kopf {
width: 1190px;
height: 70px;

margin:0 auto;
background-color: #004656;
-webkit-border-radius: 15px;
        -khtml-border-radius: 15px;
        -moz-border-radius: 15px;
        border-radius: 15px;
}
 #mitte {
 clear:both;
width: 1190px;
margin-bottom: 10px;
margin:0 auto;
background-color: #004656;

}
#mivoll {
        float: left;
 text-align: left;
padding: 0px;
margin: 10px;

}
#mili {
        float: left;
        width: 220px;

 text-align: left;
padding: 0px;
margin: 10px;

}
#mire {
float: right;

padding: 0px;
margin: 10px 10px 0 0;

}
div#wetter1{
 position: absolute;
 margin-left: 15px;
 margin-top: 145px;
 z-index:4;
}
div#wetter2{
 position: absolute;
 margin-left: 180px;
 margin-top: 145px;
 z-index:4;
}
div#wetter3{
 position: absolute;
 margin-left: 365px;
 margin-top: 145px;
 z-index:4;
}
div#verkehr1{
 position: absolute;
 margin-left: 15px;
 margin-top: 0px;
 z-index:6;
}
div#verkehr2{
 position: absolute;
 margin-left: 155px;
 margin-top: 0px;
 z-index:6;
}
div#phoenix{
 position: absolute;
 margin-left: 15px;
 margin-top: 475px;
 z-index:8;
}
div#vtext{
 position: absolute;
 margin-left: 15px;
 margin-top: 505px;
 z-index:10;
}
div#spiegel{
 position: absolute;
 margin-left: 15px;
 margin-top: 1360px;
 z-index:12;
}
div#sport{
 position: absolute;
 margin-left: 15px;
 margin-top: 1785px;
 z-index:14;
}
div#lotto{
 position: absolute;
 margin-left: 360px;
 margin-top: 1305px;
 z-index:14;
}
div#tele1{
 position: absolute;
 margin-left: 15px;
 margin-top: 1425px;
 z-index:18;
}
div#tele2{
 position: absolute;
 margin-left: 360px;
 margin-top: 1385px;
 z-index:18;
}
#homemili {
  display:inline-block;
  width:300px;
  vertical-align:top;
padding: 15px;
}
#homemire {
display:inline-block;
width: 300px;
padding:15px;
}
/* ----------banner for logo-------------- */
#banner {
        float: left;
        width: 670px;
        height: 70px;
background-color: #004656;
text-align: left;
padding: 0px;
margin: 10px;

}
#banner1 {
float: right;
height: 90px;
background-color: #004656;
text-align: right;
padding: 0px;
margin: 0 20px 0 0;

}

#kopfre {
        float: right;
        width: 200px;
        margin: 65px 8px 0 0;
        padding: 12px;
        background-color: #e2e1e1;
        color:#282828;
        -webkit-border-radius: 15px;
        -khtml-border-radius: 15px;
        -moz-border-radius: 15px;
        border-radius: 15px;

}
#banner img {padding:0px 0px;}

.rechtsbuendig {
text-align: right;
vertical-align: text-bottom;
font-size:9px;
}
/* -----------------Inhalt--------------------- */
#content {
background-color: #bdd6fa;
padding: 10px;
margin: 0 250px 0 220px;
-webkit-border-radius: 15px;
        -khtml-border-radius: 15px;
        -moz-border-radius: 15px;
        border-radius: 15px;
}

#kreis{
    width:250px;
    height:250px;
    background:#469DFA;
    border-radius:50%;
    -moz-border-radius:50%;
    -webkit-border-radius:50%;
}
div#content {
min-height:580px;
height:expression(this.scrollHeight > 580 ? "auto":"580px");
}
#contentstart {
background: url(../pict/vdr.png) no-repeat center center;
background-color: #bdd6fa;
padding: 10px;
margin: 0 250px 0 220px;
-webkit-border-radius: 15px;
        -khtml-border-radius: 15px;
        -moz-border-radius: 15px;
        border-radius: 15px;
}
div#contentstart {
min-height:580px;
height:expression(this.scrollHeight > 580 ? "auto":"580px");
}
p, pre{
padding: 5px 10px;
margin:10px;
}

/* --------------left navigavtion------------- */
#left {
clear:both;
float: left;
width: 200px;
margin: 0;
padding: 0 30px -10px -30px;
background-color: #004656;
        color:#ff8b03;
        -webkit-border-radius: 15px;
        -khtml-border-radius: 15px;
        -moz-border-radius: 15px;
        border-radius: 15px;

}
#right {
        float: right;
        width: 240px;
}
#miroben {
        float: right;
        width: 230px;
        margin: 15px 14px 0 -6px;
        padding: 0;


}
#roben {
        float: right;
        width: 200px;
        margin: 15px 14px 0 -6px;
        padding: 12px;
        background-color: #f3bb0c;
        color:#282828;
        -webkit-border-radius: 15px;
        -khtml-border-radius: 15px;
        -moz-border-radius: 15px;
        border-radius: 15px;

}
#runten {
        float: right;
        width: 216px;
        height: 110px;
        margin: 30px 7px 0 -6px;
        padding: 10px;
        background-color: #f3bb0c;
        color:#282828;
        -webkit-border-radius: 15px;
        -khtml-border-radius: 15px;
        -moz-border-radius: 15px;
        border-radius: 15px;

}
/* -----------footer--------------------------- */
#footer {
clear: both;
margin: 0px;
padding: 0px;
text-align: center;
height:80px;
}

#menu {
        width: 200px;
        margin: 65px 0 0 0;
        }

#menu li a {
        height: 32px;
          voice-family: "\"}\"";
          voice-family: inherit;
          height: 22px;
        text-decoration: none;
        }

#menu li a:link, #menu li a:visited {
        color: #000;
        display: block;
        background:  url(../pict/menu12.gif);
        padding: 10px 0 0 35px;
        }

#menu li a:hover {
        color: #fff;
        background:  url(../pict/menu12.gif) 0 -32px;
        padding: 10px 0 0 35px;
        }

label {
    width: 9em;
    display: block;
    float: left;
  }

 #inhalt {
        height: 500px;
        width: 800px;
  position: absolute;
        top: 50%;
        left: 50%;
        margin: -250px 0px 0px -400px;
        background-color: #000;
        border: 15px solid #000;
                -webkit-border-radius: 35px;
        -khtml-border-radius: 35px;
        -moz-border-radius: 35px;
        border-radius: 25px;

          }

          /* Gestaltung des Dokumentkörpers */
body {
        margin: 5px;  /* Außenabstand zum Browserrand */
        padding:0;  /* Innenabstand zum Browserrand */
}

/* Gestaltung des äußeren Formular-Bereichs */
#main {
    margin: 0;  /* Außenabstand */
        border: 1px solid #ddd;  /* Stärke, Kontur und Farbe des äußeren Formular-Rahmens */
        width: 381px;  /* Breite */
    min-height:150px;  /* Minimale Höhe */
        height: 428px; /* Höhe */
        background: #fff;  /* Hintergrund-Farbes */
    font-family: Verdana,Arial,Helvetica,sans-serif;  /* Standardschriftart */
    font-weight: bold;   /* Stärke der Standardschriftart */
    font-size : 12px;  /* Größe der Standardschriftart */
        color: #003468;  /* Schriftfarbe */
}

/* Gestaltung des Formulars */
form {
    margin-left: 10px;  /* Außenabstand zum äußeren Formular-Rahmen */
        border: 0px solid #ddd;  /* Stärke, Kontur und Farbe des Rahmens */


        background: #bdd6fa;  /* Hintergrundfarbe  */
    padding: 5px;  /* Innenabstand */
    margin-bottom: 10px;  /* Außenabstand nach unten */
}

/* Gestaltung der Danke Seite */
#ergebnisseite {
        color: #003468;  /* Schriftfarbe */
    margin-left: 10px;  /* Außenabstand nach links */
    margin-top: 40px;  /* Außenabstand nach oben */
        border: 1px solid #ddd;  /* Stärke, Kontur und Farbe des Rahmens */
        width: 350px;  /* Breite */
        background-color: #f5f4f9;  /* Hintergrundfarbe */
    text-align: center;  /* Horizontale Textausrichtung */
    padding: 5px;  /* Innenabstand */
}

/*Gestaltung der Fehlermeldung bei unzureichender oder falscher Eingabe */
.fehler {
    font-weight: normal;  /* Schriftgewicht */
    font-size : 10px;  /* Schriftgröße */
    color: #dd1111;  /* Schriftfarbe */
    padding: 5px;  /* Innenabstand */

}

/* Gestaltung der Text Label */
.text {
        width:230px;  /* Breite */
}

/* Gestaltung des Senden-Buttons */
input.submit {
        background-color: #ff7500;  /* Hintergrundfarbe */
        color: #fff;  /* Schriftfarbe */
        font-weight: bold; /* Schriftgewicht */
        font-size: 11px;  /* Schriftgröße */
        padding: 1px 4px; /* Innenabstand */
}

/* Gestaltung der Formular Elemente */
input, textarea, select {
    color: #666666;  /* Schriftfarbe */
        font-size: 10px;  /* Schriftgröße */
        margin: 3px 0 0;  /* Außenabstand */
        padding: 1px 0;  /* Innenabstand */
        background: #fff;  /* Hintergrundfarbe */
        -moz-border-radius-bottomleft: 3px;  /* Abrundung der unteren linken Rahmenecke */
        -moz-border-radius-bottomright: 3px;  /* Abrundung der unteren rechten Rahmenecke */
        -moz-border-radius-topleft: 3px;  /* Abrundung der oberen linken Rahmenecke */
        -moz-border-radius-topright: 3px;  /* Abrundung der oberen rechten Rahmenecke */
}

/* Gestaltung der Textarea */
textarea {
        width: 300px;  /* Breite */
}

/* Gestaltung des Formular Titels */
#titelschrift {
    font-weight: bold;  /* Schriftgewicht */
    margin: 10px;  /* Außenabstand */
    font-size : 16px;  /* Schriftgröße */
    color: #ff7500;  /* Schriftfarbe */
        line-height: 30px; /* Zeilenhöhe */
}

/* Gestaltung der CAPTCHA Rechenaufgabe */
.rechenaufgabe {
        font-size: 10px;  /* Schriftgröße */
        font-weight: bold;  /* Schriftgewicht */
}

/* Gestaltung der Sponsored-Zeile */
.sponsored {
        font-size: 9px;  /* S chriftgröße */
        color: silver;  /* Schriftfarbe */
        margin: 0;  /* Außenabstand */
        width: 381px;  /* Breite */
    font-weight: normal;  /* Schriftgewicht */
        line-height: 25px;  /* Zeilenhöhe */
        position: relative;  /* Positionierung */
        text-align: left;  /* Horizontale Textausrichtung */
        font-family: Verdana,Arial,Helvetica,sans-serif;  /* Standardschriftart */
}

/* Gestaltung des Sponsored-Logos */
.logo {
        display: inline;
        position: relative;  /* Positionsart */
        top: 8px;  /* Startposition von oben */
}