.wetter-widget{background-color:#333;background-size:cover;color:#fff;margin-bottom:16px;overflow:hidden;position:relative;width:100%}.wetter-widget .wetter-daten{display:table;margin-top:4em;width:100%;-webkit-transition:opacity .5s;-moz-transition:opacity .5s;-o-transition:opacity .5s;transition:opacity .5s;opacity:1}.wetter-widget .temprature .icon--wetter{font-size:5em;padding:16px 0;margin:auto}.wetter-widget .wetter-warnung{display:inline-block;float:right}.wetter-widget .wetter-daten-item.wetter-daten-col2 .wetter-warnung .icon--wetter{color:#f60940;font-size:20px;margin:0 5px 0 0;padding:0;vertical-align:baseline}.wetter-widget .temprature{position:relative;display:inline-block;text-shadow:1px 1px 2px rgba(0,0,0,.3);font-family:"Dosis Light"}.wetter-widget .wetter-daten-item.wetter-daten-col2 .temprature{width:75%}.wetter-widget .wetter-header{font-family:"Dosis Regular";padding:1em;z-index:1;position:relative}.wetter-widget .overlay{background:rgba(0,0,0,.3);width:100%;height:100%;position:absolute;transition:all .25s}.wetter-widget .overlay-animate{background:rgba(0,0,0,1)}.wetter-widget .wetter-headline{display:inline-block;float:left;font-size:24px;text-shadow:1px 1px 2px rgba(0,0,0,.3)}.wetter-widget .pos-absolute{width:100%;display:block;font-size:16px;font-weight:700}.wetter-widget .wetter--icon-compass-light,.wetter-widget .wetter--icon-wind{margin:0 8px}.wetter-widget .wetter-daten-item.wetter-daten-col2 .col1{display:inline-block}.wetter-widget .wetter-daten-item.wetter-daten-col2 .deg{font-size:4em;line-height:1.25em}.wetter-widget .wetter-daten-item.wetter-daten-col2 .col1-grid{float:left;text-align:left;margin-top:.5em;min-width:175px}.wetter-widget .wetter-daten-item.wetter-daten-col2 .col1-grid-column{width:100%}.wetter-widget .wetter-daten-item.wetter-daten-col2 .col1 .temprature .icon--wetter{float:left}.wetter-widget .wetter-daten-item.wetter-daten-col2 .col2 .icon--wetter{clear:both}.wetter-widget .wetter-daten-item.wetter-daten-col2 .col2{border-top:1px solid rgba(255,255,255,.2);clear:both}.wetter-widget .temprature .col2 .deg{font-size:4em;margin-top:.4em}.wetter-widget .wetter-daten-item.wetter-daten-col1 .temprature,.wetter-widget .wetter-daten-item.wetter-daten-col3 .temprature{font-size:10px;display:inline-block;top:25px}.wetter-widget .temprature .col2 .icon--wetter,.wetter-widget .temprature .col3 .icon--wetter{font-size:1em;font-weight:700;vertical-align:inherit;margin-right:8px}.wetter-widget .skala-time-col2{text-align:left}.wetter-widget .wetter-time-scala{border-left:2px solid #fff;border-right:2px solid #fff;height:20px;margin:0;padding:0}.wetter-widget .wetter-time-scala li{border-right:1px solid #fff;float:left;height:10px;list-style:none;margin-top:10px}.wetter-widget .wetter-time-scala li:nth-child(6n){height:20px;margin-top:0}.wetter-widget .pos-absolute .icon--wetter.wetter--icon-arrow-down,.wetter-widget .pos-absolute .icon--wetter.wetter--icon-arrow-up{font-size:.5em;font-weight:700;margin:0 8px 5px;vertical-align:middle}.wetter-widget .pos-absolute .icon--wetter.wetter--icon-arrow-down{margin-left:0}.wetter-widget .pos-absolute .icon--wetter.wetter--icon-arrow-up{margin-left:1em}.wetter-widget .wetterDropdowns{display:inline-block;position:absolute;right:1em;z-index:1}.wetter-widget .cityDropdown,.wetter-widget .districtDropdown{display:inline-block;float:left;font-size:14px;cursor:pointer}.wetter-navigation-list,.wetter-widget .cityDropdownList,.wetter-widget .districtDropdownList{margin:0;padding:0;list-style:none}.wetter-widget .cityDropdownList,.wetter-widget .districtDropdownList{color:#000;max-height:450px;overflow-y:scroll;-webkit-overflow-scrolling:touch}.wetter-widget .wetter-navigation{clear:both;display:inline-block;margin-top:2em;width:100%;-webkit-box-shadow:0 -2px 0 rgba(255,255,255,.5) inset;-moz-box-shadow:0 -2px 0 rgba(255,255,255,.5) inset;box-shadow:0 -2px 0 rgba(255,255,255,.5) inset;text-shadow:1px 1px 2px rgba(0,0,0,.3);-webkit-transition:opacity .5s;-moz-transition:opacity .5s;-o-transition:opacity .5s;transition:opacity .5s;opacity:1}.wetter-widget .wetter-daten-animate{opacity:0}.wetter-navigation-list li{transition:all .5s;float:left;border-bottom:2px solid transparent;display:inline-block;padding:0 .5em;cursor:pointer}.wetter-navigation-list li.active,.wetter-navigation-list li:hover{border-bottom:2px solid #fff}.wetter-widget .cityDropdownSelected,.wetter-widget .districtDropdownSelected{text-shadow:1px 1px 2px rgba(0,0,0,.3);margin-bottom:5px}.wetter-widget .cityDropdown .wetter--icon-arrow-down,.wetter-widget .districtDropdown .wetter--icon-arrow-down{font-size:.5em;margin-left:1em;font-weight:700}.wetter-widget .wetter-dayselect{font-size:12px;text-shadow:1px 1px 2px rgba(0,0,0,.3);text-align:center;width:100%}.wetter-widget .wetter-daten-col1,.wetter-widget .wetter-day-left{cursor:pointer;display:inline-block;float:left;min-height:1px}.wetter-widget .wetter-daten-col1{border-radius:0 10px 10px 0;position:relative;left:0;-webkit-transition:left 1s cubic-bezier(.515,.010,.095,1),color .2s,background 1s;-moz-transition:left 1s cubic-bezier(.515,.010,.095,1),color .2s,background 1s;-o-transition:left 1s cubic-bezier(.515,.010,.095,1),color .2s,background 1s;transition:left 1s cubic-bezier(.515,.010,.095,1),color .2s,background 1s}.wetter-widget .wetter-daten-col1.button-animate{left:-17%}.wetter-widget .wetter-day-left{padding-left:1em}.wetter-widget .wetter-daten-col1,.wetter-widget .wetter-daten-col3{background:rgba(0,0,0,.2)}.wetter-widget .wetter-daten-col1 .temprature .icon--wetter,.wetter-widget .wetter-daten-col3 .temprature .icon--wetter{font-size:4.5em}.wetter-widget .wetter-daten-col1 .temprature .deg,.wetter-widget .wetter-daten-col3 .temprature .deg{float:left;font-size:2.25em;margin-top:1.25em;min-width:45px}.wetter-widget .wetter-daten-col3,.wetter-widget .wetter-day-right{cursor:pointer;display:inline-block;float:right;min-height:1px}.wetter-widget .wetter-daten-col3{border-radius:10px 0 0 10px;position:relative;right:0;-webkit-transition:right 1s cubic-bezier(.515,.010,.095,1),color .2s,background 1s;-moz-transition:right 1s cubic-bezier(.515,.010,.095,1),color .2s,background 1s;-o-transition:right 1s cubic-bezier(.515,.010,.095,1),color .2s,background 1s;transition:right 1s cubic-bezier(.515,.010,.095,1),color .2s,background 1s}.wetter-widget .wetter-daten-col2 .current-time{font-size:16px;padding:3px;display:inline-block;border-bottom:1px solid rgba(255,255,255,.2);width:100%;clear:both;float:left}.wetter-widget .wetter--icon-arrow-left:before,.wetter-widget .wetter--icon-arrow-right:before{color:rgba(255,255,255,.5);font-size:2em;font-weight:700;line-height:1.4em;position:absolute;margin-top:-.5em;transition:all .2s;top:1.85em}.wetter-widget .wetter-daten-item.wetter-daten-col1:hover,.wetter-widget .wetter-daten-item.wetter-daten-col3:hover{color:rgba(255,255,255,1);background:rgba(0,0,0,.4)}.wetter-widget .wetter-daten-item.wetter-daten-col1:hover:before,.wetter-widget .wetter-daten-item.wetter-daten-col3:hover:before{color:rgba(255,255,255,1)}.wetter-widget .wetter--icon-arrow-right:before{right:10px}.wetter-widget .wetter--icon-arrow-left:before{left:10px}.wetter-widget .wetter-daten-col3.button-animate{right:-17%}.wetter-widget .wetter-daten-col1,.wetter-widget .wetter-daten-col3{color:rgba(255,255,255,.5);padding:.5em 0;text-align:center;width:17%;min-height:110px}.wetter-widget .skala-time{font-family:"Dosis Light";font-weight:700;font-size:16px;margin-top:50px;border-top:1px solid rgba(255,255,255,.2);display:inline-block;width:100%;padding:.5em .5em 0}.wetter-widget .wetter-daten-item .day{display:inline-block;float:left}.wetter-widget .meta-data{display:block;font-size:16px;width:100%}.wetter-widget .meta-data .icon--wetter{font-size:24px;margin:0 .2em 0 0;display:inline-block;padding:0;vertical-align:sub}.wetter-widget .wetter-daten-item.wetter-daten-col2 .temprature .col1 .meta-data .icon--wetter{float:none}.wetter-widget .wetter-daten-item.wetter-daten-col2 .temprature .col1 .meta-data .icon--wetter.wetter--icon-compass-light{margin-left:.5em}.wetter-widget .wetter-daten-item .time{display:inline-block;float:left}.wetter-widget .wetter-daten-item.wetter-daten-col1 .time,.wetter-widget .wetter-daten-item.wetter-daten-col3 .time{float:right}.wetter-widget .wetter-time-scala-first{border-left:2px solid #fff;height:20px;margin-left:2em;bottom:0;position:absolute}.wetter-widget .wetter-daten-col2,.wetter-widget .wetter-day-center{width:66%;float:left;text-align:center}.wetter-widget .cityDropdownList li,.wetter-widget .districtDropdownList li{background:rgba(255,255,255,.6);transition:all .5s;padding:.3em;margin-bottom:2px}.wetter-widget .cityDropdownList li:hover,.wetter-widget .districtDropdownList li:hover{background:rgba(255,255,255,1)}.wetter-widget .wetter-dayselect{opacity:1;transition:opacity .25s}.wetter-widget .temprature-animate{opacity:0}.wetter-daten-current-symbol{min-width:185px;float:left}.wetter-daten-prevNext-symbol{min-width:75px;float:left}@media screen and (max-width:767px){.wetter-widget .wetter-header{padding:16px}.wetter-widget .wetter-daten-col1.button-animate{left:-33%}.wetter-widget .wetter-daten-col3.button-animate{right:-33%}.wetter-widget .wetter-daten{margin-top:1em}.wetter-widget .wetter-daten-col2 .temprature{min-width:80%;width:100%;padding:0 16px}.wetter-widget .wetter-daten-col2{width:100%}.wetter-widget .temprature .col2 .deg{font-size:3em;margin-top:0}.wetter-widget .wetter-headline{display:none}.wetter-widget .temprature .col1{clear:both;display:inline-block}.wetter-widget .wetter-daten-col1,.wetter-widget .wetter-daten-col3{bottom:3em;position:absolute;width:33%}.wetter-widget .temprature .col3{width:100%}.wetter-widget .wetterDropdowns{left:0;right:initial;width:100%;padding:0 16px}.wetter-widget .wetter-day-left,.wetter-widget .wetter-day-right{width:30%}.wetter-widget .wetter-daten-item.wetter-daten-col2 .temprature{width:100%}.wetter-widget .wetter-daten-item.wetter-daten-col2 .col1{margin-top:12vw}}@media screen and (max-width:450px){.wetter-widget .temprature{font-size:12px}.wetter-daten-current-symbol{min-width:140px}.wetter-daten-prevNext-symbol{min-width:50px}.wetter-widget .skala-time{margin-top:0}.wetter-widget .wetter-daten-item.wetter-daten-col2 .col1{margin-top:6vw}.wetter-widget .wetter-daten-item.wetter-daten-col1 .temprature,.wetter-widget .wetter-daten-item.wetter-daten-col3 .temprature{top:0;font-size:8px}.wetter-widget .wetter-daten-col1.button-animate{left:-45%}.wetter-widget .wetter-daten-col3.button-animate{right:-45%}.wetter-widget .wetter-daten-col1,.wetter-widget .wetter-daten-col3{width:45%}.wetter-widget .wetter--icon-arrow-left:before,.wetter-widget .wetter--icon-arrow-right:before{top:1em}.wetter-widget .skala-time{font-size:14px}.wetter-widget .wetter-daten-col1 .temprature .deg,.wetter-widget .wetter-daten-col3 .temprature .deg{margin-top:1.35em}.wetter-widget .cityDropdownList,.wetter-widget .districtDropdownList{max-height:400px}}@media screen and (max-width:374px){.wetter-widget .cityDropdown,.wetter-widget .districtDropdown{font-size:12px}.wetter-widget .wetter-daten{margin-top:0}.wetter-daten-current-symbol{min-width:110px}.wetter-daten-prevNext-symbol{min-width:50px}.wetter-widget .wetter-daten-item.wetter-daten-col2 .col1{margin-top:.5em}.wetter-widget .cityDropdownList,.wetter-widget .districtDropdownList{max-height:300px}}@media screen and (max-width:340px){.wetter-widget .wetter-daten-item.wetter-daten-col2 .col1{margin-top:1em}.wetter-widget .skala-time{font-size:12px}.wetter-widget .wetter-daten-item.wetter-daten-col2 .temprature .col1 .icon--wetter{font-size:5em;padding:8px 0}.wetter-widget .wetter-daten-item.wetter-daten-col2 .deg{font-size:3em}.wetter-widget .wetter-daten-item.wetter-daten-col2 .temprature .meta-data .icon--wetter{font-size:16px;padding:0;vertical-align:inherit}.wetter-widget .cityDropdown,.wetter-widget .districtDropdown{font-size:11px}.wetter-widget .wetter-daten-col1,.wetter-widget .wetter-daten-col3{bottom:2em;min-height:85px}.wetter-widget .wetter-daten-col1 .temprature .icon--wetter,.wetter-widget .wetter-daten-col3 .temprature .icon--wetter{font-size:4em;padding:5px 0 8px}.wetter-widget .wetter--icon-arrow-left:before,.wetter-widget .wetter--icon-arrow-right:before{top:.65em}.wetter-widget .wetter-daten-col1 .temprature .deg,.wetter-widget .wetter-daten-col3 .temprature .deg{margin-top:.7em}.wetter-widget .wetter--icon-arrow-left:before{left:5px}.wetter-widget .wetter--icon-arrow-right:before{right:5px}.wetter-widget .cityDropdown .wetter--icon-arrow-down,.wetter-widget .districtDropdown .wetter--icon-arrow-down{font-size:.4em}}.wetter-widget.wetter-widget-sidebar .wetter-daten-col1,.wetter-widget.wetter-widget-sidebar .wetter-daten-col3,.wetter-widget.wetter-widget-sidebar .wetter-dayselect,.wetter-widget.wetter-widget-sidebar .wetter-navigation,.wetter-widget.wetter-widget-sidebar .wetterDropdowns{display:none}.wetter-widget.wetter-widget-sidebar .temprature .col1,.wetter-widget.wetter-widget-sidebar .temprature .col2,.wetter-widget.wetter-widget-sidebar .temprature .col3,.wetter-widget.wetter-widget-sidebar .wetter-daten-col2{width:100%}.wetter-widget.wetter-widget-sidebar .col1 .pos-absolute{float:left;position:relative;margin-top:15%;display:inline-block;width:auto;padding-left:1em}.wetter-widget.wetter-widget-sidebar .col1 .icon--wetter{float:left;font-size:6em;margin-left:16px}.wetter-widget.wetter-widget-sidebar .temprature,.wetter-widget.wetter-widget-sidebar .temprature .col1,.wetter-widget.wetter-widget-sidebar .temprature .col2,.wetter-widget.wetter-widget-sidebar .temprature .col3{height:auto}.wetter-widget.wetter-widget-sidebar .temprature .col3{margin-top:1em}.wetter-widget.wetter-widget-sidebar .temprature .col2 .deg{font-size:3em;margin-top:0;text-align:left;margin-left:16px}.wetter-widget.wetter-widget-sidebar .wetter-daten{position:absolute;left:0;bottom:.5em}.wetter-widget.wetter-widget-sidebar .wetter-header-meta{clear:both;display:inline-block;text-shadow:1px 1px 2px rgba(0,0,0,.3);width:100%}.wetter-widget.wetter-widget-sidebar .wetter-ort{display:inline-block;float:left}.wetter-widget.wetter-widget-sidebar .wetter-zeit{display:inline-block;float:right}.wetter-widget .two-col{-webkit-column-count:2;-moz-column-count:2;column-count:2}.wetter-warnung-infobox{background:rgba(0,0,0,.5);border:2px solid #f60940;color:#fff;font-size:12px;display:none;padding:1em;margin:1em auto auto;width:60%;position:relative;transition:opacity .5s}.wetter-warnung-infobox-event{margin-right:.25em}.wetter-warnung-infobox-headline{font-weight:700;margin-bottom:.5em}.wetter-warnung-infobox-button{height:25px;display:none;background:#f60940;position:relative;padding:0 1em;line-height:25px;text-transform:uppercase;width:100%}.wetter-warnung-infobox-button .icon--wetter{float:right;font-size:10px;font-weight:700;line-height:25px;transform:rotate(0);-webkit-transition:all .5s;-moz-transition:all .5s;-o-transition:all .5s;transition:all .5s}#wetter-warnung-infobox-checkbox{display:none}@media screen and (max-width:767px){.wetter-warnung-infobox{width:100%;position:absolute;bottom:0;padding:0;height:200px;border:none;-webkit-transition:bottom .5s;-moz-transition:bottom .5s;-o-transition:bottom .5s;transition:bottom .5s}.wetter-warnung-infobox-wrapper{height:167px;overflow-y:scroll;overflow-scrolling:touch;-webkit-overflow-scrolling:touch;margin-top:4px;padding:12px 0}.wetter-warnung-infobox-button{display:block}.wetter-warnung-infobox-headline{padding:0 1em;font-size:14px}.wetter-warnung-infobox-text{font-size:14px;padding:.5em 1em 0}#wetter-warnung-infobox-checkbox:checked~.wetter-warnung-infobox{bottom:-175px}#wetter-warnung-infobox-checkbox:checked~.wetter-warnung-infobox .icon--wetter{transform:rotate(180deg)}}.wetter-widget .wetter--icon-sonnig-tag{font-size:6em}.wetter-widget .wetter--icon-sonnig-nacht{font-size:4.5em}