#weather-wrapper {
  height: auto;
  .row();
  margin-bottom: 10px;
}
#weather-board {
  .column(24);
  padding: 10px;
  color: @color-1;
  background: @color-bg;
  border-top: @color-3 1px solid;
  border-bottom: @color-3 1px solid;

  p {
    padding: 10px 0;
    text-transform: uppercase;
    letter-spacing: .3em;

    .weather-location {
      font-size: 1.2em;
    }
    .weather-temperature {
      font-size: 1.2em;
      color: @color-2;
    }
    .weather-icon {
      color: @color-2;
    }
    .weather-description {
      font-size: 0.9em;
      color: @color-2;
    }
  }

  i {
    .setFont-family("Weather");
    font-size: 60px;
    font-weight: normal;
    font-style: normal;
    line-height: 1.0;

    &.icon-0:before { content: ":"; }
    &.icon-1:before { content: "p"; }
    &.icon-2:before { content: "S"; }
    &.icon-3:before { content: "Q"; }
    &.icon-4:before { content: "S"; }
    &.icon-5:before { content: "W"; }
    &.icon-6:before { content: "W"; }
    &.icon-7:before { content: "W"; }
    &.icon-8:before { content: "W"; }
    &.icon-9:before { content: "I"; }
    &.icon-10:before { content: "W"; }
    &.icon-11:before { content: "I"; }
    &.icon-12:before { content: "I"; }
    &.icon-13:before { content: "I"; }
    &.icon-14:before { content: "I"; }
    &.icon-15:before { content: "W"; }
    &.icon-16:before { content: "I"; }
    &.icon-17:before { content: "W"; }
    &.icon-18:before { content: "U"; }
    &.icon-19:before { content: "Z"; }
    &.icon-20:before { content: "Z"; }
    &.icon-21:before { content: "Z"; }
    &.icon-22:before { content: "Z"; }
    &.icon-23:before { content: "Z"; }
    &.icon-24:before { content: "E"; }
    &.icon-25:before { content: "E"; }
    &.icon-26:before { content: "3"; }
    &.icon-27:before { content: "a"; }
    &.icon-28:before { content: "A"; }
    &.icon-29:before { content: "a"; }
    &.icon-30:before { content: "A"; }
    &.icon-31:before { content: "6"; }
    &.icon-32:before { content: "1"; }
    &.icon-33:before { content: "6"; }
    &.icon-34:before { content: "1"; }
    &.icon-35:before { content: "W"; }
    &.icon-36:before { content: "1"; }
    &.icon-37:before { content: "S"; }
    &.icon-38:before { content: "S"; }
    &.icon-39:before { content: "S"; }
    &.icon-40:before { content: "M"; }
    &.icon-41:before { content: "W"; }
    &.icon-42:before { content: "I"; }
    &.icon-43:before { content: "W"; }
    &.icon-44:before { content: "a"; }
    &.icon-45:before { content: "S"; }
    &.icon-46:before { content: "U"; }
    &.icon-47:before { content: "S"; }
  }


}
