body {
    background-image: url('/static/homepage/back.svg');
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-size: 100%;
}

h1.fa-homepage-header {
    font-size: 48px;
    margin-top: 5rem;
}

h1.fa-homepage-subheader {
    font-size: 22px;
    margin-top: 1.8rem;
    line-height: 1.4;
}

.fa-website-section {
    margin-bottom: 90px;
}

.fa-website-section.fa-two-columns {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 30px;
    row-gap: 30px;
}

#fa-website-first-section {
    height: 90vh;
}

img.fa-website-img {
    margin-top: 3rem;
}

img.fa-website-img-second {
    margin-top: -1rem;
}

.table-responsive-wrapper {
    overflow-x: auto;
    width: 67%;
}

#sla-table {
    min-width: 500px;
}

/* Scroll down arrow */
.scroll-arrow {
    position: absolute;
    bottom: 30px; /* Adjust the space from the bottom */
    cursor: pointer;
    animation: bounce 1s infinite; /* Adds the bouncing effect */
    left: 50%;
  }
  
  .scroll-arrow > .bi-chevron-down {
    font-size: 44px;
    color: #fff; /* Arrow color */
    text-shadow: 0 0 10px rgba(80, 158, 227, 0.7), 0 0 20px rgba(80, 158, 227, 0.7), 0 0 30px rgba(80, 158, 227, 0.7); /* Glowing blue effect */
  }
  
  /* Bouncing animation and horizontal centering */
  @keyframes bounce {
    0%, 100% {
      transform: translateX(-50%) translateY(0); /* Center + no vertical movement */
    }
    50% {
      transform: translateX(-50%) translateY(-10px); /* Vertical bounce */
    }
  }

@media screen and (max-width: 992px) {
    .fa-website-section.fa-two-columns {
        grid-template-columns: 1fr;
    }

    img.fa-website-img {
        margin-top: 0rem;
    }

    .fa-website-section.fa-two-columns.fa-reverse-order>div:first-child {
        order: 2;
    }

    .fa-website-section.fa-two-columns.fa-reverse-order>div:last-child {
        order: 1;
    }

    .w-50 {
        width: 100% !important;
    }

    .table-responsive-wrapper {
        width: 100%;
    }
    #fa-website-first-section {
        height: unset
    }
}