/*.text-sm {
  font-size: .85em;
}
.text-lg {
  font-size: 1.15em;
}
.text-xl {
  font-size: 1.3em;
}
.text-xxl {
  font-size: 1.5em;
}

.scrollspy-main {
  width: 814px;
  padding-right: 48px;
}

@media (min-width: 992px){
  .scrollspy-nav {
    width: 250px;
      position: -webkit-sticky;
      position: sticky;
      top: 5rem;
      right: 0;
      z-index: 2;
      height: calc(100vh - 7rem);
      overflow-y: auto;
  }
}*/


    .spy-container {
      display: flex;
      width: 100%;
      max-width: 1200px;
      margin: 0 auto;
    }
    
    /* Main content column */
    .content-column {
      flex: 1;
      padding: 2rem;
      width: 100%;
    }
    
    section {    
    }
    
    .title-align {
      padding-top:200px; margin-top:-200px
    }

    .section-space-lg {
      height: 48px;
    }

    .section-space-sm {
      height: 25px;
    }

    /* Navigation column */
    .nav-column {
      width: 250px;
      padding: 2rem 1rem;
      position: sticky;
      top: 200px;
      overflow-y: auto;
    }
    
    .nav-title {
      font-size: 1.2rem;
      font-weight: 600;
      margin-bottom: 1.5rem;
      color: #000000;
    }
    
    .nav-links {
      list-style: none;
    }
    
    ul.nav-links{
      padding: unset;
      border-left: solid 1px #000000;
    }

    .nav-links li {
      margin-bottom: 0.75rem;
    }
    
    .nav-links a {
      font-weight: unset;
      display: block;
      padding-left: 10px;
      color: #00818F;
      text-decoration: none;
      border-left: 3px solid transparent;
      transition: all 0.3s ease;
    }
    
    .nav-links a:hover {
      
      color: #000000;
    }
    
    .nav-links a.active {
      color: #000000;
      font-weight: bold;
      border-left: 3px solid #000000;
    }

    .box {
      border: 1px solid #242424;
      border-radius: 5px;
      padding: 20px;
      min-height: 160px;
      width: 100%; 
      display: flex;
      justify-content: center;
      align-items: center;
    }

    .box-content {
      text-align: left;
    }

    /* Responsive adjustments */
    @media (max-width: 768px) {
      .spy-container {
        flex-direction: column;
      }
      
      .nav-column {
        display: none; /* Hide vertical navigation on mobile */
      }
      
      .content-column {
        width: 100%;
      }
    }
