#feature .content {

  border-radius: 0.375rem;

  padding: 1rem;

  background: rgba(0, 0, 0, 0.7);
}

#feature .item {

  cursor: pointer;

  overflow: hidden;
}

#feature .item.active {
  height: 600px;
}

@media screen and (min-width: 768px) {
  #feature .item.active {
    flex: 1;
  }
}

#feature .content .description {
  display: none;
}

#feature .active .content {
  position: absolute;
  left: 2rem;
  bottom: 2rem;
  right: 2rem;
  gap: 2rem;
}

@media screen and (min-width: 768px) {
  #feature .active .content {
    flex-direction: row;
  }

}

#feature .active .content .text {

  text-align: center;

  font-size: 1.5rem;

  line-height: 2rem;

  font-weight: 500;
}

@media screen and (min-width: 768px) {
  #feature .active .content .text {
    text-align: left;
  }
}

#feature .active .content .description {
  display: block;
}