#wd {
  margin: auto;
  font-size: 30px;
  font-weight: bold;
}

.container-fluid {
  margin-top: 8px;
  height: 100%;
  width: 100%;
}

#left {
  height: 600px;
}
#right {
  height: 600px;
}
#today {
  height: 55%;
  margin: 20px;
}
#forecast {
  height: 40%;
  padding-left: 33px;
}
#today-info {
  background-color: grey;
  height: 70%;
}
#today {
  padding: 4px;
}
.future {
  height: 180px;
  width: 150px;
  margin: 12px;
  border: 1px solid blue;
  background-color: #027bff;
  color: white;
  padding-top: 5px;
  padding-left: 5px;
}

#city-list {
  width: 300px;
  height: 420px;
}
#city-form {
  margin-bottom: 10px;
}
.city-btn {
  width: 300px;
  text-align: left;
  border: 1px outset #027bff;
  background-color: #e3f2fd;
  margin-top: 1px;
  margin-bottom: 1px;
  font-weight: bold;
}
.safe {
  background-color: greenyellow;
  color: grey;
}
.danger {
  background-color: tomato;
  color: white;
}