div {
  display: block;
  padding: 0px 5px 0px 5px;
}

.weather-app {
  max-width: 600px;
  margin: 0 auto;
  padding: 20px;
  border: 1px solid #878787;
  border-radius: 3px;
  color: #878787;
  font-family: "Urbanist", sans-serif;
  background-color: #f2fcfc;
}

h1 {
  color: #424242;
  font-size: 28px;
  font-family: "Urbanist", sans-serif;
}
.btn-primary {
  background-color: #9fd3c7;
  border-color: #9fd3c7;
  display: inline-block;
  vertical-align: middle;
  line-height: 1;
}
.btn-primary:active {
  background-color: #9fd3c7;
  border-color: #9fd3c7;
  display: inline-block;
  vertical-align: middle;
  line-height: 1;
}
.btn-primary:focus {
  background-color: #9fd3c7;
  border-color: #9fd3c7;
  display: inline-block;
  vertical-align: middle;
  line-height: 1;
}
.btn-primary:disabled {
  background-color: #9fd3c7;
  border-color: #9fd3c7;
  display: inline-block;
  vertical-align: middle;
  line-height: 1;
}

.btn-primary:hover {
  background-color: #fff;
  border-color: #9fd3c7;
  color: #9fd3c7;
}

#city-form {
  display: inline-block;
  vertical-align: middle;
  width: 100%;
}

#date-footer {
  font-size: 60%;
  margin-top: 10px;
}

p {
  color: #403d56;
}

#cur-temp {
  color: #9fd3c7;
  font-size: 300%;
}

#different-font {
  font-family: Arial, Helvetica, sans-serif;
}

#cur-temp-symbol {
  color: #9fd3c7;
  font-family: "Gill Sans", "Gill Sans MT", Calibri, "Trebuchet MS", sans-serif;
  font-size: 250%;
  text-align: top;
}

#week-day,
#max-temp-forecast,
#cur-title {
  color: #424242;
}

.row {
  display: -webkit-flex;
  display: flex;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-right: -15px;
  margin-left: -15px;
}
img {
  max-width: 120px;
}

a {
  color: #6bc6d2;
  font-weight: 500;
  text-decoration: none;
}

a:hover {
  color: #9fd3c7;
  font-weight: 500;
  text-decoration: none;
}

a:focus {
  color: #878787;
  font-weight: 500;
  text-decoration: none;
}

.weather-forecast {
  margin-top: 20px;
  margin-left: 0px;
  margin-right: 0px;
  text-align: center;
  padding: 0;
}

.weather-forecast-date {
  text-align: center;
}

.weather-forecast-min-temp {
  font-size: 12px;
  text-align: center;
}

.weather-forecast-max-temp {
  font-size: 12px;
  text-align: center;
}