body {
  margin: 2%;
  font-family: 'Poppins';
}

:root {
  --animate-delay: 1s;
}

.btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--bs-secondary);
  --bs-btn-border-color: var(--bs-secondary);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--bs-primary);
  --bs-btn-hover-border-color: var(--bs-primary);
  --bs-btn-focus-shadow-rgb: 217,226,238;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--bs-primary);
  --bs-btn-active-border-color: var(--bs-primary);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: var(--bs-dark);
}

.card-slide:hover + .card-title {
  background: blue;
}

.card-slide:hover & .slide {
  font-family: cursive;
}

.card-slide:hover > .slide-up {
  width: 100%;
  top: 0;
  height: 100%;
}

.slide-up {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  background-color: var(--bs-primary);
  overflow: hidden;
  width: 100%;
  height: 0%;
  transition: .5s ease;
}

.quote p:after, .quote p:before {
  font-family: Georgia;
  position: absolute;
  content: "”";
  color: var(--bs-primary);
  font-size: 8rem;
  margin: -2rem 0 0 -4rem;
}

.blockquote {
  font-family: Tahoma, sans-serif;
  font-size: 2rem;
  width: 80%;
  margin: 0 auto;
  color: var(--bs-light);
}

.blockquote p::before, blockquote p::after {
  content: "“";
  font-family: Georgia;
  font-size: 4rem;
  margin: -1rem 0px 0 -2rem;
  position: absolute;
  opacity: 0.5;
}

.blockquote p::after {
  content: "”";
  margin: -1rem -4rem 0 0;
}

.blockquote-footer {
  display: none;
}