
div.weather_result {color: #fff;padding: 40px 20px;text-align: left;max-width:400px;box-sizing:border-box;margin:0 auto;}
div.weather_result h1 { text-align:center !important; }
div.weather_result > .err { text-align:center; }
div.weather_main_wrap { transition: all 0.3s cubic-bezier(.94,.89,.56,1.13) 0s; -webkit-transition: all 0.3s cubic-bezier(.94,.89,.56,1.13) 0s; opacity:0;transform:translateY(150%);  }
div.weather_main_wrap.show { transform:translateY(0%);opacity:1;  }
div.weather_generalbox { padding:10px 20px;background-color:rgba(0,0,0,0.6);border-radius:5px;margin-bottom:20px; }
div.weather_head { margin-bottom:10px;text-align:center; }
div.darksky { margin:0 auto;margin-top:30px;margin-bottom:30px;background:url(../img/weather_icons/poweredby-darkbackground.png) center center no-repeat transparent;background-size:100% auto;max-width:130px; }
div.darksky::after { content:" ";display:block;position:relative;padding-bottom:40%; }

div.weather_box { min-height:30px;position:relative;padding-bottom:10px;padding-top:10px; }
div.weather_box > .icon { width:30px;height:30px;top:50%;margin-top:-15px;position:absolute;left:0px; }
div.weather_box.main { padding-left:80px;min-height:66px;}
div.weather_box.main > .icon { width:66px;height:66px;margin-top:-33px;background:url(../img/weather_icons/clear-day.svg) center center no-repeat transparent; }
div.weather_box.main h1 { text-align:left !important; margin-bottom:10px;margin-top:5px;padding:0px;font-size:22px;line-height:19px; }
div.weather_box.main.clear-day > .icon { background-image:url(../img/weather_icons/clear-day.svg); }
div.weather_box.main.clear-night > .icon { background-image:url(../img/weather_icons/clear-night.svg); }
div.weather_box.main.cloudy > .icon { background-image:url(../img/weather_icons/cloudy.svg); }
div.weather_box.main.fog > .icon { background-image:url(../img/weather_icons/fog.svg); }
div.weather_box.main.partly-cloudy-day > .icon { background-image:url(../img/weather_icons/partly-cloudy-day.svg);}
div.weather_box.main.partly-cloudy-night > .icon { background-image:url(../img/weather_icons/partly-cloudy-night.svg); }
div.weather_box.main.rain > .icon { background-image:url(../img/weather_icons/rain.svg); }
div.weather_box.main.sleet > .icon { background-image:url(../img/weather_icons/sleet.svg); }
div.weather_box.main.snow > .icon { background-image:url(../img/weather_icons/snow.svg);}
div.weather_box.main.wind > .icon { background-image:url(../img/weather_icons/wind.svg);}

div.weather_box.uv { padding-right:47px;}
div.weather_box.uv > .icon { background:url(../img/weather_icons/clear-day.svg) center center no-repeat transparent; left:unset;left:auto;right:0; }
div.weather_box.wind { padding-right:47px;}
div.weather_box.wind > .icon { background:url(../img/weather_icons/navigation.svg) center center no-repeat transparent;left:unset;left:auto;right:0; }
div.weather_box.rain_stuff { padding-right:47px;}
div.weather_box.rain_stuff > .icon { background:url(../img/weather_icons/rain.svg) center center no-repeat transparent;left:unset;left:auto;right:0;}
div.weather_box.sun { padding-left:0px;}
div.weather_box.sun > .icon { background:url(../img/weather_icons/navigation.svg) center center no-repeat transparent;left:unset;left:auto;right:0; }
div.weather_box > .icon {background-size:contain }

div.weather_box.sun .moon {width:40px;position:absolute;top:50%;margin-top:-20px;right:0;border-radius:50%;height:40px; }
div.weather_box.sun .moon-left,
div.weather_box.sun .moon-right { display:inline-block;width:20px;position:relative;margin:0; }
div.weather_box.sun .moon-left .bg,
div.weather_box.sun .moon-right .bg { stroke-width:0px; }
div.weather_box.sun .moon-right .fg { stroke-width:0px; }
div.weather_box.sun .moon-left .bg { fill:#0f324a; }
div.weather_box.sun .moon-left .fg { fill:rgba(255,255,255,1);transform-origin: 0% 0%; }
div.weather_box.sun .moon-right .fg { transform: scaleX(1); }
div.weather_box.sun .moon-left .fg { transform: scaleX(0) translateX(0); }

div.weather_generalbox table { margin-left:-5px;margin-right:-5px; }
div.weather_generalbox table tr td { padding:5px;color:#fff;font-size:14px; }
div.weather_generalbox table tr td:nth-child(2) { text-align:right; }
div.weather_generalbox table tr:nth-child(odd) td { background-color:rgba(255,255,255,0.05); }

.weather_popup {line-height: 25px;font-family: "Signika";font-weight: 600;font-size:14px;color:#2d3f53;border-radius:0px;position:absolute;left:0px;right:0px;bottom:0px;top:0px; }
.weather_popup.hidden { display:none; }
.weather_popup .popup_wrap {  opacity:0;transform:translateY(0px) scale(2);z-index:9998;background-color:rgba(25, 84, 123,0.85);padding:10px;position:absolute;left:0px;right:0px;bottom:0px;top:0px;transition: all 0.2s ease-in-out 0s; -webkit-transition: all 0.2s ease-in-out 0s; }

.weather_popup.show .popup_wrap { transform:translateY(0px) scale(1);opacity:1; }
.weather_popup .close { z-index:1;background:url("../img/svg/cancel.svg") center center no-repeat transparent !important;border:1px solid #fff;border-radius:50%;background-size:40% 40% !important;position:absolute;right:20px;box-sizing: border-box;top:20px;height:45px;width:45px;  }
.weather_popup .close.active-helper { background-color:rgba(0,0,0,0.3) !important; }
.weather_popup .inner { position:absolute;top:0;right:0;bottom:0;left:0;padding:0px 0px; }
.weather_popup h1 { margin-top:0px;margin-bottom:20px;color:#fff;text-align:center; }

.weather_popup .weather_popup_loader { width:100%;margin:0 auto;color:#fff;text-align:center;padding:40px 20px ;box-sizing:border-box;} 
.weather_popup .weather_popup_loader .dtwr {display:block;margin-left:-20px;margin-right:-20px;overflow:visible;position:relative; }
.weather_popup .weather_popup_loader .dtwr .wrap { display:block;transform-origin:50% 50%; }
.weather_popup .weather_popup_loader .dtwr .inner_wrap { display:flex;justify-content:center;position:relative; }
.weather_popup .weather_popup_loader .dtwr .forbidden {  display:flex;justify-content:center;position:relative; }
.weather_popup .weather_popup_loader .dtwr font,
.weather_popup .weather_popup_loader .dtwr span { border-radius:3px;display:inline-block;padding:10px;font-size:16px;background-color:rgba(0,0,0,0.6);transform:scale(1);color:rgba(25, 84, 123,1);margin-left:5px;margin-right:5px;margin-bottom:10px;transition: all 0.3s cubic-bezier(.55,-0.22,1,-0.13)  0s; -webkit-transition: all  0.3s cubic-bezier(.55,-0.22,1,-0.13)  0s; } 
.weather_popup .weather_popup_loader .dtwr span.now { background-color:#6ed8ff; }
.weather_popup .weather_popup_loader .dtwr span.aktive { border:0px solid red;transform:scale(1.3);background-color:#fff; }
.weather_popup .weather_popup_loader .txt { font-size: 2em;font-weight: bold;padding-bottom:20px;line-height: 32px; }
.weather_popup .weather_popup_loader .txt span { font-weight: 100;padding-left:7px; }
.weather_popup .weather_popup_loader .dtwr font { opacity:0.2; }
.weather_popup .weather_popup_loader .info { opacity:1;padding-bottom:5px;padding-bottom:20px;font-size:18px; }
.weather_popup .weather_popup_loader .dtwr.days { padding-top:30px;padding-bottom:20px; }
.weather_popup .weather_popup_loader .dtwr.hours { padding-bottom:30px;}
.weather_popup .weather_popup_loader .dtwr.days::after { content:" ";width:20px;margin-left:-10px;left:50%;top:-5px;position:absolute;height:20px;background:url("../img/svg/tinyarrow1.svg") center center no-repeat transparent !important;background-size:100% auto; display:block; }
.weather_popup .weather_popup_loader .dtwr.hours::after { content:" ";width:20px;margin-left:-10px;left:50%;bottom:5px;position:absolute;height:20px;background:url("../img/svg/tinyarrow2.svg") center center no-repeat transparent !important;background-size:100% auto;  display:block;}
.weather_popup .submit { cursor: pointer;padding: 10px 20px;position: relative;width: 160px;margin-left: -80px;left: 50%;bottom: 0px;box-sizing: border-box;color: #fff;text-align: center;font-family: "Signika";font-weight: bold;font-size: 16px;border: 3px solid #fff;margin-top:15px; }
.weather_popup .submit.active-helper:not(.off) {  background-color:rgba(0,0,0,0.3) !important;  }
.weather_popup .submit.off font { opacity:0; }
.weather_popup .submit.off  { background:url(../img/svg/blocked.svg) center center no-repeat transparent;background-size: auto 50%; }
.weather_popup .ort { opacity:0.6;display:none;position:relative;max-width:300px;margin:0 auto;text-align:center;padding-top:0px;padding-left:0px;background:none center left no-repeat transparent !important;background-size:80% auto;margin-bottom:14px;padding-top:10px;}
.weather_popup .ort span { display:block;  }
.weather_popup .request_infos { max-width:300px;padding-top:15px;margin:0 auto;opacity:0.5; }
.weather_popup  .weather_loader { display:none; }
.weather_popup.load .weather_popup_loader::after { content:" ";position:absolute;left:0;right:0;top:0;bottom:0;display:block; }
.weather_popup.load .weather_popup_loader { opacity:0.2; }
.weather_popup.load  .weather_loader  { display:block; }
.weather_popup  .weather_loader {width: 40px;height: 40px;position: absolute;margin-left:-20px;left:50%;top:50%;margin-top:-20px;}
.weather_loader .double-bounce1, .weather_loader .double-bounce2 {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background-color: #fff;
  opacity: 0.6;
  position: absolute;
  top: 0;
  left: 0;
  
  -webkit-animation:  weather-sk-bounce 2.0s infinite ease-in-out;
  animation:  weather-sk-bounce 2.0s infinite ease-in-out;
}
.weather_loader .double-bounce2 {
  -webkit-animation-delay: -1.0s;
  animation-delay: -1.0s;
}
@-webkit-keyframes  weather-sk-bounce {
  0%, 100% { -webkit-transform: scale(0.0) }
  50% { -webkit-transform: scale(1.0) }
}

@keyframes weather-sk-bounce {
  0%, 100% { 
  transform: scale(0.0);
  -webkit-transform: scale(0.0);
  } 50% { 
  transform: scale(1.0);
  -webkit-transform: scale(1.0);
  }
}