.weather {
  display: flex;
  justify-content: center;
  align-items: center;
  border: 1px solid #ccc;
  border-radius: 4px;
}

.weather .twoWeather {
  display: flex;
  justify-content: center;
  align-items: center;
}

.weather span {
  display: inline-block;
  margin: 0 4px;
}

.weather .img {
  display: inline-block;
  width: 30px;
  height: 30px;
  background: url(../../static/img/weather.png);
  background-size: 1200% 1200%;
}

.weather .img-cloud {
  background-position: -86px -20px;
}

.weather .img-thunderstorm {
  background-position: -140px -20px;
}

.weather .img-rainstorm {
  background-position: -194px -20px;
}

.weather .img-snow {
  background-position: -238px -20px;
}

.weather .img-sunnytorainy {
  background-position: -40px -66px;
}

.weather .img-sunny {
  background-position: -140px -68px;
}

.weather .img-rainplussnow {
  background-position: -238px -66px;
}

.weather .img-night {
  background-position: -40px -118px;
}

.weather .img-smog {
  background-position: -140px -118px;
}

.weather .img-thunder {
  background-position: -194px -118px;
}

.weather .img-shower {
  background-position: -238px -118px;
}

.weather .img-gale {
  background-position: -288px -118px;
}

.weather .img-tornado {
  background-position: -288px -162px;
}

.weather .img-hail {
  background-position: -288px -214px;
}
