@font-face {
    font-family: DINPro-Regular;
    src: url("/fonts/DINPro-Regular.otf") format('opentype');
}

.Body {
    position: relative;
    font-family: DINPro-Regular, Arial, Helvetica, sans-serif;
    margin: 0px;
}

#printHeader {
    display: none;
}

/* Alle Listen ohne padding, margin, list-style-type */

.Body ul,
.Body ol {
    margin: 0px;
    padding: 0px;
    list-style-type: none;
}

/* Standardverhalten aller Links */

a {
    color: #000;
    text-decoration: none;
}

/* Alle Bilder in Links ohne Rahmen darstellen */

a img {
    border: none;
}

/* Alle Ueberschriften ohne margin */

h1, h2, h3, h4, h5, h6 { margin: 0px; }

/* Ueberschriften im Inhaltsbereich */

.Document h1 { margin-bottom: 20px; }

.Document h2,
.Document h3,
.Document h4,
.Document h5,
.Document h6 {
    margin-bottom: 15px;
}

.Document p {
    margin-bottom: 10px;
}

.small {
    font-size: 0.8em;
}

#wrapper {
    color: #000000;
    font-size: 80%;
    line-height: 1.5em;
    position: relative;
    width: 1000px;
    margin: 0px auto;
}

/* ------------------------ Header --------------------------- */

#header {
    position: relative;
    width: 100%;
    height: 265px;
    padding: 10px 0px 0px 0px;
    z-index: 3;
}

#header .backgroundPic {
    position: absolute;
    left: 0px;
    bottom: 0px;
    height: 205px;
    text-align: center;
    width: 100%;
    overflow: hidden;
    z-index: 1;
}

#header .backgroundPic img {
    width: auto;
    height: 205px;
}

#logo {
    position: absolute;
    right: 30px;
    bottom: 30px;
    z-index: 3;
}

#logo a {
    background: url(/gfx/E-ON/eon-logo.png) no-repeat left top;
    height: 165px;
    width: 144px;
    overflow: hidden;
    text-indent: -5000px;
    display: block;
}

#topElements {
    position: relative;
    height: 30px;
    width: 100%;
}

/* ------------------- Wetterbox oben ------------------------ */

#wetterboxTop {
    right: 250px;
    top: 0px;
    position: absolute;
}

#wetterboxTop .icon {
    width: 30px;
    height: 30px;
    float: left;
}

#wetterboxTop .data {
    float: left;
    margin: 0px 0px 0px 10px;
}

#wetterboxTop .data .day {
    text-transform: uppercase;
    line-height: 14px;
}

#wetterboxTop .data .degree {
    background: url(/gfx/leafletArrow-off.gif) no-repeat left center;
    color: #343434;
    font-weight: bold;
    line-height: 14px;
    padding: 0px 0px 0px 20px;
}

/* -------------- Stichwortsuche / sitesearch ---------------- */

#sitesearch {
    position: absolute;
    right: 90px;
    top: 5px;
}

#sitesearch .query {
    background: url("/se_data/global/gfx/input_bg.gif") no-repeat scroll 0 0 transparent;
    border: none;
    color: #000;
    float: left;
    font-size: 10px;
    line-height: 17px;
    height: 17px;
    padding: 2px 0 0 5px;
    width: 105px;
}

#sitesearch p {
    margin: 0px;
}

/* ----------- fontSizer - Schriftvergroesserung ------------ */

#schrift {
    position: absolute;
    right: 10px;
    top: 8px;
    z-index: 3;
}

#schriftswitcher li {
    display: inline;
    padding: 2px;
}

.errormsg {
    background: #EFBFAE;
    border:2px solid #B1421B;
    padding: 20px;
    color: #000;
    font-size: 1em;
    position: absolute;
    top: 40px;
    left: -990px;
    width: 500px;
    z-index: 3;
}

/*--------------- Hauptnavigation / Menue - mainNav----------------------------*/

#mainNav {
    position: relative;
    margin-left: 45px;
    width: 955px;
}

#mainNav ul li {
    display: block;
    float: left;
    position: relative;
    z-index: 99;
}

#mainNav .break,
#mainNav ul li.break {
    height: 0px;
    width: 0px;
}

#mainNav ul {
    list-style-type:none;
    margin: 0px;
    padding: 0px;
}

#mainNav ul li a {
    display: block;
    color: #000;
    text-decoration: none;
    text-transform: uppercase;
    padding: 0px 10px;
    font-weight: bold;
    font-size: 1.2em;
    line-height: 1.9em;
    display: block;
}

#mainNav ul li.hover ul li a {
    background: none;
    color: #fff;
}

#mainNav ul li.open a,
#mainNav ul li.active a,
#mainNav ul li.open ul li.active a,
#mainNav ul li.open ul li.open a {
    background: #555;
    color: #e4e4e4;
}

#mainNav ul li.hover a,
#mainNav ul li.hover ul li.hover a,
#mainNav ul li a:hover {
    background: #ddd2a8;
    color: #000;
}

#mainNav ul li ul {
    display: none;
    left: 0px;
    position: absolute;
    top: 29px;
    width: 220px;
    padding-bottom: 10px;
}

#mainNav ul li ul li {
    background: #ddd2a8;
}

#mainNav ul li.hover ul {
    display: block;
}

#mainNav ul li ul li a {
    width: 200px;
    font-size: 1em;
}

#mainNav ul li.open a,
#mainNav ul li.active a,
#mainNav ul li.open ul li.active a,
#mainNav ul li.open ul li.open a,
#mainNav ul li.open a:hover,
#mainNav ul li.active a:hover,
#mainNav ul li.open ul li.active a:hover,
#mainNav ul li.open ul li.open a:hover {
    background: #000;
    color: #fff;
}

/* --------------------------- newsTicker (Teaser) Header----------------------- */

#newsTicker {
    position: relative;
    margin: 97px 0px 0px 45px;
    z-index: 2;
}

#ticker li {
    background: #ddd2a8;
    color: #fff;
    display: none;
    padding: 20px;
}

#ticker li a {
    color: #fff;
}

#ticker span {
    font-size: 1.5em;
}

/*------------------ Travel Schnellsuchmaske oben ---------------------- */

#travelSearchTop {
    position: relative;
    font-size: 11px;
    height: 21px;
    padding: 5px;
}

#treffersuchedatumfromTop_tr,
#treffersuchedatumtoTop_tr {
    background-color: #e4e4e4;
    border: 1px solid #000;
}

#treffersuchedatumzusatznaechteTop input,
#filter_personTop input,
#treffersuchekategorienTop {
    background: #e4e4e4;
    border: 1px solid #000;
}

#treffersuchekategorienTop {
    /* width: 140px; */

}

#treffersuchedatumfromTop_tr,
#treffersuchedatumtoTop_tr {
    width: 90px;
}

#treffersuchedatumzusatznaechteTop input,
#filter_person inputTop {
    /* width: 25px; */

}

#travelZeitraumTop,
#travelZeitraumTop .von,
#travelZeitraumTop .bis,
#treffersuchedatumzusatznaechteTop,
#filter_personTop,
#filter_kategorieTop {
    float: left;
    padding-right: 5px;
}

#travelSearchTop .button {
    float: left;
    padding: 0px;
}

#travelSearchTop .suchestarten .button {
    border: 1px solid #000;
    background: #e4e4e4;
    line-height: 11px;
    text-align: center;
}

#travelSearchTop .Calendar {
    left: 0px;
    position:absolute;
    bottom: 190px;
}

/* ---------------- Brotkruemelnavigation -------------- */

#breadcrumbs {
    padding: 5px;
    position: relative;
}

#breadcrumbs ul li {
    display: inline;
}

#breadcrumbs ul li a {
    background: url(/gfx/bg-breadcrumbs-white.gif) no-repeat left center;
    color: #000;
    font-size: 0.9em;
    padding: 0px 0px 0px 10px;
    text-decoration: underline;
}

#breadcrumbs ul li a:hover {
    text-decoration: none;
}

/* --------------------- Seiteninhalt ------------------------ */

#main {
    position: relative;
    width: 100%;
    padding: 10px 0px;
}

/* --------------------- linke Spalte ------------------------ */

#leftColumn {
    float: left;
    margin: 0px;
    visibility: visible;
    width: 31%;
}

#leftColumn .box {
    background: #e4e4e4;
    margin: 0px 0px 20px 0px;
}

#leftColumn .box .header {
    font-size: 1.2em;
    font-weight: normal;
    padding: 5px 10px;
}

/* ----------------- JQuery Accordion - Styling ---------------*/

.trigger {
    background: #555;
    cursor: pointer;
    color: #e4e4e4;
}

.trigger:hover {
    background: #343434;
}

.trigger_active,
.trigger_active:hover {
    background: #fff;
    color: #000;
}

/* ------- leftColumn subNav - Unternavigation - Start ------- */

#subNav,
#subNav ul,
#subNav ul li {
    position: relative;
}

#subNav ul li.break {
    height: 0px;
    width: 0px;
    display: none !important;
}

/* Standardaussehen der Links */

#subNav ul li a {
    border-bottom: 1px dashed #fff;
    color: #000;
    display: block;
    font-size: 1.2em;
    font-weight: normal;
    padding: 5px 10px;
}

/* Standardaussehen der Links in zweiter Ebene */

#subNav ul li.open ul li a,
#subNav ul li.active ul li a {
    background: none;
    color: #000;
    font-size: 1em;
    padding: 3px 15px;
}

/* Standardaussehen der Links in dritter Ebene */

#subNav ul li.open ul li.active ul li a,
#subNav ul li.open ul li.open ul li a {
    background: none;
    color: #000;
    font-size: 1em;
    padding: 3px 25px;
}

/* Aussehen im Hover / Aktiv Zustand*/

#subNav ul li a:hover,
#subNav ul li.active a:hover,
#subNav ul li.open a:hover,
#subNav ul li.open ul li a:hover,
#subNav ul li.active ul li a:hover,
#subNav ul li.open ul li.open a:hover,
#subNav ul li.open ul li.active a:hover,
#subNav ul li.active ul li.open a:hover,
#subNav ul li.active ul li.active a:hover,
#subNav ul li.open ul li.open ul li.active a:hover,
#subNav ul li.open ul li.open ul li.open a:hover {
    color: #e4e4e4;
    background: #343434;
}

/* spezielle Aktiv Darstellung auf zweiter Ebene */

#subNav ul li.active a,
#subNav ul li.open a,
#subNav ul li.open ul li.active a,
#subNav ul li.open ul li.open a {
    color: #e4e4e4;
    background: #555;
}

/* spezielle Aktiv Darstellung auf dritter Ebene */

#subNav ul li.open ul li.open ul li.active a,
#subNav ul li.open ul li.open ul li.open a {
    color: #e4e4e4;
    background: #555;
}

/* nicht benoetigte Ebenen ausblenden;
hier lassen sich auch die Menueebenen steuern;
*/

#subNav ul li ul,
#subNav ul li ul li.hover ul,
#subNav ul li ul li.off ul,
#subNav ul li ul li ul,
#subNav ul li.open ul li ul,
#subNav ul li.active ul li ul {
    display: none;
}

/* benoetigte Ebenen einblenden */

#subNav ul li.active ul,
#subNav ul li.open ul,
#subNav ul li.active,
#subNav ul li.active ul li,
#subNav ul li.active ul li a,
#subNav ul li.open,
#subNav ul li.open ul li,
#subNav ul li.open ul li a,
#subNav ul li ul li.on ul,
#subNav ul li ul li.active ul,
#subNav ul li ul li.open ul {
    display: block;
}

/* -------------------- leftTabset leftColumn  --------------------- */

/* Tabset allgemein */

#leftTabset {
    position: relative;
}

.Widget.Tabset .Captions {
    background: #fff;
    display: block;
    height: 30px;
    margin: 0;
    padding: 0;
    position: relative;
    z-index: 99;
}

.Widget.Tabset .Caption {
    display: block;
    float: left;
    margin: 0px ;
}

.Widget.Tabset .Caption a {
    border: none;
    display: block;
    float: left;
    font-size: 1em;
    line-height: 20px;
    padding: 8px 15px 2px 15px;
    font-weight: normal;
}

.Widget.Tabset .Caption a:hover,
.Widget.Tabset .Caption a.active {
    background: #e4e4e4;
    padding: 5px 15px;
    margin: 0px;
    position: relative;
    z-index: 100;
}

.Widget.Tabset .TabsetContent {
    padding: 15px 25px;
    font-size: 13px;
    clear: both;
    display: none;
    overflow: auto;
}

.Widget.Tabset .TabsetContent.active {
    display: block;
}

#leftTabset_0 .allegastgeber,
#leftTabset_1 .allegastgeber {
    margin-bottom: 10px;
}

/* spezielle Anpassungen leftTabset */

#treffersuchedatumoptionzeitraumLeft,
#treffersuchedatumoptionzeitraumPauschalen {
    float: left;
    margin-right: 10px;
}

#leftTabset_0 .allegastgeber .text,
#leftTabset_1 .allegastgeber .text {
    float: left;
    width: 140px;
}

#treffersuchedatumLeft_tr .left,
#pauschalenZeitraumPauschalen .left {
    width: 25px;
}

#treffersuchedatumLeft_tr .von,
#treffersuchedatumLeft_tr .bis,
#pauschalenZeitraumPauschalen .von,
#pauschalenZeitraumPauschalen .bis {
    margin-bottom: 5px;
    float: none;
}

#leftTabset input.Widget-Calendar-Date,
#leftTabset div.Widget-Calendar-Date input {
    background-color: #fff;
}

#treffersuchedatumzusatzexaktLeft,
#treffersuchedatumzusatzxtageLeft,
#treffersuchedatumzusatzexaktPauschalen,
#treffersuchedatumzusatzxtagePauschalen {
    float: left;
    margin: 5px 10px 0px 0px;
}

#treffersuchedatumzusatznaechteLeft,
#treffersuchedatumzusatznaechtePauschalen {
    width: 30px;
}

#leftTabset select {
    width: 170px;
}

#leftTabset .button {
    margin-top: 15px;
}

/* ------------------ Merkzettel / Leaflet ------------------ */

#leaflet.box {
    background: none;
}

#llabel {
    font-size: 1.2em;
    font-weight: normal;
    padding: 5px 10px;
}

#lltabcontainer {
    background: #E4E4E4;
    padding: 5px 25px 25px 25px;
}

#lltabcontainer li {
    /* background: url(/gfx/leafletArrow-off.gif) no-repeat left center; */

    border-bottom: 1px dashed #fff;
    cursor: pointer;
    display: block;
    padding: 2px 5px 2px 20px;
    font-size: 0.9em;
}

#lltabcontainer li a {
    display: block;
}

#lltabcontainer li:hover {
    /* background: url(/gfx/leafletArrow-on.gif) no-repeat left center; */

    background: #343434;
}

#lltabcontainer li:hover a {
    color: #e4e4e4;
}

#lltabcontainer li.active {
    /* background: url(/gfx/leafletArrow-on.gif) no-repeat left center; */

    background: #555;
}

#lltabcontainer li.active:hover {
    background: #343434;
}

#lltabcontainer li.active a {
    color: #e4e4e4;
}

#llcontent {
    color: #000;
    font-size: 0.9em;
}

#llcontent .container {
    background: #fff;
    display:none;
    padding: 10px;
}

#llcontent .container p {
    margin: 0px;
}

#llcontent a {
    font-weight: bold;
}

#llcontent .span {
    font-size: 11px !important;
}

#llcontent .lldelnotice {
    cursor: pointer;
    background: url(/se_data/global/gfx/travel/merkzetteleintrag_loeschen.gif) no-repeat scroll left top;
    display: block;
    float: left;
    height: 20px;
    width: 20px;
    position: relative;
}

#leafletOverview {
    background: #fff;
    padding: 10px 5px 5px 0px;
    text-align: right;
}

#leafletOverview a {
    background: url(/gfx/leafletArrow-on.gif) no-repeat left center;
    font-weight: bold;
    color: #000;
    padding-left: 25px;
}

.small {
    font-size: 0.8em;
}

/* -------------- wetterbox-tag - leftColumn - Start ------------------ */

#wetterMorgens,
#wetterMittags,
#wetterAbends {
    float: left;
    text-align: center;
}

#wetterMorgens,
#wetterMittags {
    padding-right: 45px;
}

#wetter_container {
    position: relative;
}

#wetterGrafiken {
    background: #FFFFFF;
    padding: 10px;
}

#wetterTag {
    padding: 5px 25px 25px 25px;
}

#wetterTagData {
    margin-bottom: 5px;
}

#wetterTagData .day {
    text-transform: uppercase;
}

#wetterTag .degree {
    text-align: center;
}

/* ----------------- Banner linke Spalte ------------------------ */

#bannerLeft {
    text-align: center;
    border: 1px solid #E4E4E4;
    padding: 10px 10px 5px 10px;
}

#bannerLeft h2 {
    color: #555;
    font-weight: normal;
    font-size: 1em;
    margin: 5px;
}

#bannerLeft .BannerContainer a {
    display: block;
    padding-bottom: 20px;
}

#bannerLeft .BannerContainer h3,
#bannerLeft .BannerContainer a a,
#bannerLeft .BannerContainer .weiter {
    display:none;
}

/* ------------------- Seiteninhalt ----------------------------- */

#rightColumn {
    float: right;
    margin: 0px;
    padding: 0 0 0 2%;
    width: 66%;
}

#content {
    color: #000000;
}

/* Seite merken */

.button,
.remember {
    position: relative;
    text-align: right;
    padding: 10px 15px;
}

.button a,
.remember a {
    background: url("/gfx/leafletArrow-on.gif") no-repeat scroll left center transparent;
    cursor: pointer;
    font-size: 1em;
    font-weight: bold;
    padding-left: 25px;
}

/* ----------------------- socialBookmarks ---------------------- */

#socialBookmarks {
    margin-bottom: 20px;
}

#socialBookmarks a {
    background-image: url("/se_data/global/gfx/lesezeichen/socialBookmarks.png");
    background-repeat: no-repeat;
    display: block;
    float: left;
    height: 0px;
    margin-right: 5px;
    outline: medium none;
    overflow: hidden;
    padding-top: 48px;
    width: 48px;
}

/* jedes Icon in der Gesamtgrafik ist 48px breit.;
Positionierung durch verschieben um +48px in x-Richung */

#delicious {
    background-position: 0 -48px;
}

#digg {
    background-position: -48px -48px;
}

#facebook {
    background-position: -96px -48px;
}

#furl {
    background-position: -144px -48px;
}

#studivz {
    background-position: -192px -48px;
}

#stumbleupon {
    background-position: -240px -48px;
}

#technorati {
    background-position: -288px -48px;
}

#twitter {
    background-position: -336px -48px;
}

#reddit {
    background-position: -384px -48px;
}

#wong {
    background-position: -432px -48px;
}

#yahoo {
    background-position: -480px -48px;
}

#yigg {
    background-position: -528px -48px;
}

#googleBookmark {
    background-position: -576px -48px;
}

/* hover Zustaende - top 0px */

#delicious:hover {
    background-position: 0px 0px;
}

#digg:hover {
    background-position: -48px 0px;
}

#facebook:hover {
    background-position: -96px 0px;
}

#furl:hover {
    background-position: -144px 0px;
}

#studivz:hover {
    background-position: -192px 0px;
}

#stumbleupon:hover {
    background-position: -240px 0px;
}

#technorati:hover {
    background-position: -288px 0px;
}

#twitter:hover {
    background-position: -336px 0px;
}

#reddit:hover {
    background-position: -384px 0px;
}

#wong:hover {
    background-position: -432px 0px;
}

#yahoo:hover {
    background-position: -480px 0px;
}

#yigg:hover {
    background-position: -528px 0px;
}

#googleBookmark:hover {
    background-position: -576px 0px;
}

/* -------------------------- Footer --------------------------- */

#footer {
    background: transparent url(/gfx/bg-footer.png) no-repeat -1px top;
    position: relative;
    padding-top: 35px;
    margin-top: -30px;
    color: #000;
    line-height: 2em;
}

#footer a {
    color: #000;
}

#footer a:hover {
    color: #000;
}

#footer p {
    margin: 0px;
}

#footer .leftColumn,
#footer .middleColumn,
#footer .rightColumn {
    width: 29%;
    padding: 2%;
}

#footer .leftColumn,
#footer .middleColumn,
#footer .rightColumn,
#copyright,
#realized {
    float: left;
}

.owner {
    color: #000;
}

#footer .bottom {
    border-top: 1px solid #ddd2a8;
}

#copyright,
#realized {
    width: 46%;
    padding: 2%;
}

#realized {
    text-align: right;
}

/* ----------------------- IE6Div ------------------------------- */

#ie6Div {
    background: #EFBFAE;
    border:2px solid #B1421B;
    display: none;
    padding: 20px;
    color: #000;
    font-size: 1em;
    position: absolute;
    top: 70px;
    left: 0px;
    z-index: 3;
}

#ie6Div a {
    border-bottom: 1px dotted #000;
    color: #000;
    font-weight: bold;
}

#ie6Div a:hover {
    border-bottom: 1px solid #000;
}

/* ------------------- Travel Allgemein --------------------------*/

.Calendar.ThemeDefault .Body {
    /* Fix f??r FontSizer */

    min-width: 141px;
    max-width: 141px;
    width: 141px;
}

.Calendar.ThemeDefault .Body ul.Buttons,
.Calendar.ThemeDefault .Body .Content {
    width: 141px;
}

/* ---------------------- Templates / Vorlagen ----------------- */

.Document .Template {
    margin: 0px 0px 20px 0px;
}

/* Template .s3 Bildergallerie - Darstellung Detail - Fileview */

.s3 li.detail {
    color: #000;
}

/* ------------------- DETAILSEITEN -----------------------------*/

/* Darstellung Tags */

#content .Tags span {
    background: url("/se_data/global/gfx/gui/widgets/tagselector/bg-tags-left.png") no-repeat left top;
    display: block;
    float: left;
    height: 22px;
    padding: 0px 10px 10px 12px;
}

#content .Tags span a {
    background: url("/se_data/global/gfx/gui/widgets/tagselector/bg-tags.png") no-repeat right top;
    color: #fff;
    display: block;
    font-size: 1em;
    line-height: 15px;
    padding: 5px 12px 5px 0px;
}

/* Allgemeine Darstellungsvorgaben Detailseiten / Suche / Artkel / Bilder / Keywordseiten */

.searchContentTemplate,
.artikelContentTemplate,
.bilderContentTemplate,
.tagContentTemplate {
    background: #FFFFFF;
    border: 2px solid #e4e4e4;
}

.searchContentTemplate .header,
.artikelContentTemplate .header,
.bilderContentTemplate .header,
.tagContentTemplate .header {
    background: #e4e4e4;
    border-bottom: none;
    margin: 0px;
    padding: 5px 0 5px 10px;
}

.searchContentTemplate .header h2,
.artikelContentTemplate .header h2,
.bilderContentTemplate .header h2,
.tagContentTemplate .header h2 {
    margin: 0px;
}

.searchContentTemplate .header .button,
.artikeldetailContentTemplate .header .buton,
.bilderContentTemplate .header .button,
.tagContentTemplate .header .button {
    margin: -2px 10px 0px 10px;
    padding: 0px 10px;
}

.searchContentTemplate .header .button a,
.artikeldetailContentTemplate .header .button a,
.bilderContentTemplate .header .button a,
.tagContentTemplate .header .button a {
    background: url("/gfx/backArrow-on.gif") no-repeat scroll left center transparent;
}

.searchContentTemplate .Nachrichten,
.artikelContentTemplate .Nachrichten,
.tagContentTemplate .Nachrichten {
    padding: 10px 0;
}

.searchContentTemplate .Nachricht,
.artikelContentTemplate .Nachricht,
.tagContentTemplate .Nachricht {
    margin-bottom: 10px;
    padding: 0px 8px;
}

/* -------------------- Artikeldarstellung --------------------- */

/* Tags in detailansicht */

.artikelContentTemplate .spalte {
    width: 48%;
    padding: 2%;
}

/* ---------------------- Keywordseiten ------------------------ */

.tagContentTemplate h1 {
    margin: 10px;
}

.tagContentTemplate p {
    margin: 10px;
}

/* ----------- Bilder Detailseite / imageContentTemplate ------- */

.imageContentTemplate .bild img {
    width: 100%;
}

/* ------------ Stichwortsuche Detailseite --------------------- */

.searchContentTemplate h3,
.searchContentTemplate form {
    display: block;
    margin: 10px;
}

.searchContentTemplate .Nachricht h3 {
    margin: 0px 0px 5px 0px;
}

.searchContentTemplate .Nachricht .kontaktData {
    color: #555;
    font-size: 0.9em;
}

.searchContentTemplate .Tags {
    padding: 10px 10px 0px 10px;
}

/* ------------------------ Fehlerseite 404 -------------------- */

.contentErrorSitemap ul {
    padding-left: 25px;
}

/* ----------------------- Wetter Detailseite ------------------ */

.dayBox {
    border-bottom: 1px solid #343434;
    margin-bottom: 15px;
    position: relative;
    padding-bottom: 5px;
}

#wetterseite .day {
    font-size: 1.2em;
    font-weight: bold;
}

.dayBox .day {
    margin-bottom: 10px;
    font-size: 1.7em;
}

.dayBox .wetterData {
    width: 40%;
    padding-right: 5%;
}

.dayBox .wetterData .key,
.dayBox .wetterData .value,
.dayBox .wetterData,
.dayBox .timeOfDay,
.dayBox .timeOfDay .leftColumn,
.dayBox .timeOfDay .middleColumn,
.dayBox .timeOfDay .rightColumn {
    float: left;
    font-size: 1em;
}

.dayBox .timeOfDay {
    width: 50%;
}

.dayBox .wetterData .key {
    width: 60%;
}

.dayBox .wetterData .value {
    width: 40%;
}

.dayBox .timeOfDay .leftColumn,
.dayBox .timeOfDay .middleColumn {
    padding-right: 5px;
}