@media screen {
  /* u-Weather
   * ========================================================================== */
  .u-Weather {
    display: block;
    height: 5.8em;
    position: relative;
    z-index: 2;
  }

  .u-WeatherTab {
    display: block;
    left: 0;
    padding: 1.5em 1em;
    position: absolute;
    top: 0;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    width: 100%;
    z-index: 999;
  }

  .u-Weather__forecastLink {
    display: block;
    float: right;
  }

  .u-Weather__current--temp {
    font-size: 1em;
  }

  .u-Weather__forecastLink--text {
    display: none;
  }

  .u-WeatherTab.u-Weather__noCurrent h3 {
    background: url(../images/css/sun-icon.png) no-repeat 0 0;
    float: none;
    height: 1.6em;
    margin: .4em 0 0;
    padding: 0 0 0 1.5em;
  }

  .u-WeatherTab.u-Weather__noCurrent h3:after {
    content: "Report";
    display: inline-block;
    margin: 0 0 0 .25em;
  }

  .u-WeatherTab.u-Weather__noCurrent h3:before {
    content: "";
    display: inline-block;
    margin: 0 .35em 0 0;
  }

  .u-Weather__current {
    position: absolute;
    margin: 0;
    left: 4.2em;
    top: 1.2em;
  }

  .u-Weather__current--temp {
    margin-right: .25em;
  }

  .u-WeatherTab img {
    float: left;
    margin: 0 1em 0 0;
  }

  .u-Weather:hover .u-WeatherTab {
    background: #eee;
    -webkit-box-shadow: none;
    box-shadow: none;
    opacity: 1;
  }

  .u-WeatherForecast {
    background: #fff;
    background: -moz-linear-gradient(top, white 0%, #e5e0de 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, white), color-stop(100%, #e5e0de));
    background: -webkit-linear-gradient(top, white 0%, #e5e0de 100%);
    background: -o-linear-gradient(top, white 0%, #e5e0de 100%);
    background: -ms-linear-gradient(top, white 0%, #e5e0de 100%);
    background: linear-gradient(to bottom, white 0%, #e5e0de 100%);
    width: 100%;
  }

  .u-Weather:hover .u-WeatherForecast {
    clip: auto;
    opacity: 1;
    visibility: visible;
    z-index: 999;
  }

  .u-WeatherForecast li {
    float: left;
    list-style: none;
    padding: 2%;
    width: 100%;
  }

  .u-WeatherForecast .u-WeatherNow {
    border-bottom: 1px solid #d9d7d7;
    width: 100%;
  }

  .u-WeatherNow .u-Weather__temperature {
    float: left;
  }

  .u-WeatherNow .u-Weather__description {
    margin: 0 0 3% 38%;
    width: 60%;
  }

  .u-WeatherNow .u-Weather__description b {
    display: block;
  }

  .u-WeatherForecast .u-WeatherLater {
    border-left: 1px solid #d9d7d7;
    width: 33%;
    min-height: 250px;
  }

  .u-WeatherForecast .u-WeatherLater:nth-child(2) {
    border-left: none;
  }

  .u-WeatherLater .u-Weather__temperature {
    margin: 0 0 .25em;
  }

  .u-Weather__temperature b {
    display: block;
  }

  .u-WeatherForecast img {
    float: left;
    margin: 0 1em 1em 0;
  }

  .u-Weather__date {
    display: block;
    margin: 0 0 .5em;
  }
}
@media screen and (min-width: 36em) {
  /* u-Weather
   * ========================================================================== */
  .u-Weather {
    display: block;
    height: auto;
    left: 4%;
    position: absolute;
    top: 87px;
    width: 92%;
  }

  .u-WeatherTab {
    background: none;
    -webkit-border-radius: 5px 5px 0px 0px;
    border-radius: 5px 5px 0px 0px;
    left: auto;
    padding: .75em 1em .6em;
    position: absolute;
    right: 0;
    top: 0;
    width: 14em;
  }

  .u-Weather__current--description {
    display: inline;
    visibility: visible;
  }

  .u-Weather__forecastLink {
    font-size: 1.5em;
  }
}
@media screen and (min-width: 42em) {
  .u-Weather {
    top: 84px;
  }

  .u-WeatherForecast {
    margin: 0;
    padding: 0;
  }
}
@media screen and (min-width: 56em) {
  .u-Weather__current--description {
    display: inline;
    visibility: visible;
  }

  .u-Weather__forecastLink {
    font-size: .6em;
  }

  .u-Weather__forecastLink--text {
    display: inline;
    display: none;
  }
}
@media screen and (min-width: 70em) {
  .u-WeatherTab {
    width: 14em;
    top: -2px;
  }
}