app.css

/* 🚨🚫🙅  START OF THE NO TOUCHING ZONE 🙅🚫🚨 */
body {
  font-family: Arial, Helvetica, sans-serif;
  background-color: #263238;
}
h1 {
  text-align: center;
  color: white;
  font-weight: 100;
}
.card {
  position: relative;
  height: 16.5em;
  box-shadow: 0px 1px 13px rgba(0, 0, 0, 0.1);
  cursor: pointer;
  transition: all 120ms;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  padding: 0.5em;
  padding-bottom: 3.4em;
  margin: 0 5px;
}
.card .title {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 0.9em;
  position: absolute;
  left: 0.625em;
  bottom: 1.875em;
  font-weight: 400;
  color: #000;
}
.card .price {
  font-family: Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif;
  font-size: 0.9em;
  position: absolute;
  left: 0.625em;
  bottom: 0.625em;
  color: #000;
}

.image {
  background: rgb(241, 241, 241);
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
/* 🚨🚫🙅  END OF THE NO TOUCHING ZONE 🙅🚫🚨 */

/* ALL YOUR CODE GOES BELOW THIS LINE */
/* ================================== */

#container {
  margin: 0 auto;
  width: 900px;

  /* ⬇️⬇️⬇️ STYLE THE GRID CONTAINER HERE ⬇️⬇️⬇️ */

  /* ⬆️⬆️⬆️ STYLE THE GRID CONTAINER HERE ⬆️⬆️⬆️ */
}