html {
  position: relative;
  min-height: 100vh;
  width: 100vw;
  overflow-x: hidden;
}

.sidebar {
  display: flex;
  z-index: 3;
  height: max(100vh, 640px);
}

.sidebar-content {
  position: absolute;
  display: block;
}

.sidebar-content a {
  color: inherit;
  text-decoration: none;
}

.avatar {
  width: min(20vmin, 40%);
  height: min(20vmin, 40%);
  margin-block: min(5vmin, 5%);
}

.display-4 {
  font-size: 4rem;
}

.links i {
  color: inherit;
}

.nav-link {
  color: inherit;
}

.nav-link:hover {
  color: var(--bs-secondary);
}

.list-group-item:hover {
  color: var(--bs-secondary);
}

.content {
  margin-bottom: 96px;
}

.footer {
  position: absolute;
  bottom: 0;
  overflow: hidden;
  height: 96px;
  width: inherit;
  text-align: center;
  padding-left: 12px;
  padding-right: 12px;
}

#particles-js {
  background: #1a222c;
  background-repeat: no-repeat;
  background-size: contain;
  background-attachment: local;
}

#title {
  text-align: center;
}

/* lg */
@media (min-width: 992px) {
  #title {
    text-align: unset;
  }

  .display-4 {
    font-size: 4rem;
  }
}

/* Fix Name */
@media (min-width: 992px) and (max-width: 1028px) {
  .display-4 {
    font-size: 2.5rem;
  }
}

@media (min-width: 1028px) and (max-width: 1400px) {
  .display-4 {
    font-size: 3rem;
  }
}