main {
  margin-top: 2rem;
  margin-bottom: 4rem;
}

footer {
  margin-top: 2rem;
}

.pagination-container {
  margin-top: 2rem;
}

.main-navbar {
  background-color: #E0E0E0;
  /* background-color: #8CE8FF; */
}

.navbar-brand {
  /* font-family: 'Helvetica', 'Arial', sans-serif; */
  font-size: 12pt;
  /* text-transform: uppercase; */
  text-align: center;
}

.navbar-brand-img {
  max-height: 3.5rem;
}

.scrollable-menu {
  max-height: 320px;
  min-width: 300px;
  overflow-y: auto;
}

.hr-footer {
  height: 1px;
  border-width: 0;
  color: gray;
  background-color: gray;
}

[x-cloak] {
  display: none !important;
}


#scrollUpBtn {
  display: none;
  position: fixed;
  bottom: 20px;
  right: 30px;
  z-index: 99;
  font-size: 18px;
  padding: 15px;
  border-radius: 4px;
}

.wiggly {
  animation: wiggle 2s linear 1;
}

@keyframes wiggle {

  0%,
  7% {
    transform: rotateZ(0);
  }

  15% {
    transform: rotateZ(-15deg);
  }

  20% {
    transform: rotateZ(10deg);
  }

  25% {
    transform: rotateZ(-10deg);
  }

  30% {
    transform: rotateZ(6deg);
  }

  35% {
    transform: rotateZ(-4deg);
  }

  40%,
  100% {
    transform: rotateZ(0);
  }
}

.search-form {
  border-radius: 0rem 0.25rem 0.25rem 0rem;
}

.search-result {
  padding: 1.25rem;
  margin-top: 1.25rem;
  margin-bottom: 1.25rem;
  border-left: 0.25rem solid #0052e8;
  background-color: #e6eeff;
  border-radius: 0rem 0.25rem 0.25rem 0rem;
}

.article-body {
  overflow: hidden;
  transition: max-height 0.3s ease;
  position: relative;
}

.article-body.collapsed {
  max-height: 300px;
}

.article-body.collapsed::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 40px;
  background: linear-gradient(transparent, var(--bs-card-bg, #fff));
}