style.css

@import url("https://fonts.googleapis.com/css?family=Montserrat&display=swap");

.avatar img {
  border-radius: 50%;
}

.article {
  position: relative;
  background: linear-gradient(
    90deg,
    rgba(255, 230, 250, 0.4) 0%,
    rgba(191, 217, 254, 0.4) 100%
  );
  border-radius: 15px;
}

.article::before {
  position: absolute;
  content: "";
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-image: linear-gradient(
    90deg,
    rgb(255, 230, 250) 0%,
    rgb(191, 217, 254) 100%
  );
  z-index: -1;
  transition: opacity 0.35s linear;
  opacity: 0;
  border-radius: 15px;
}

.article:hover::before {
  opacity: 1;
  border-radius: 15px;
}

.footer {
  position: fixed;
  bottom: 5;
}

.body {
  display: flex;
  justify-content: space-between !important;
  height: 100vh !important;
}