body {
  font-family: courier serif;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
}

main {
  height: 420px;
  margin: 5% 0;
}

header {
  background-color: #C5C5C5;
  height: 100px;
}

.googleMap {
  height: 400px;
}

.ratingBox {
  height: 400px;
  width: 480.33px;
  display: flex;
  justify-content: space-between;
}

.hipsterImage {
  height: 100%;
  width: 338px;
}

.hipsterRating {
  display: flex;
  align-items: flex-end;
  background-color: #c5c5c5;
  height: 100%;
  width: 90.06px;
}

.rankingBar {
  width: 90.06px;
}

.overload {
  background-color: black;
  color: yellow;
}

.overload1 {
  background-color: yellow;
  color: black;
}

@media (min-width: 1153px) {
  footer {
    margin-top: 3%;
    background-color: #C5C5C5;
    height: 100px;
  }
}

.search {
  display: flex;
  justify-content: center;
  align-items: flex-end;
  height: 50px;
}