Day 332

My second entry into the responsive CSS Grid realm...
#CodingPhase #TheCodingWay #365CodingPhaseChallenge

**********

.cta {
  background: var(--yellow);
  display: grid;
  align-items: center;
  justify-items: center;
  align-content: center;
}
.cta p {
  margin: 0;
}
.cta1 {
  grid-area: cta1;
}
.cta2 {
  grid-area: cta2;
}
.price {
  font-size: 60px;
  font-weight: 300;
}

/* Navigation */
.menu ul {
  display: grid;
  grid-gap: 10px;
  padding: 0;
  list-style: none;
  grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
}
.menu a {
  background: var(--yellow);
  display: block;
  text-decoration: none;
  padding: 10px;
  text-align: center;
  color: var(--black);
  text-transform: uppercase;
  font-size: 20px;
}
[aria-controls="menu-list"] {
  display: none;
}