.customrow {
  padding-bottom:20px;
}

.activelink {
  display: block;
  background:  #198754;
  color:white;
}

.gallery {
  width:18rem;
  padding:1rem;
  margin:1rem;
}

.slide3 {
  font-size: 2.5em;
}

.paraquote span {
  width: 60%;
  margin: auto;
  padding-bottom: 5%;
  padding-top: 5%;
  font-style: italic;
}

.photo-gallery img {
  width: 350px;
  height: 250px;
  object-fit: cover;
}

.catboxstyle {
  transition: box-shadow 0.3s ease;
}

.catboxstyle:hover {
 box-shadow: 10px 10px #67BD46;
 cursor: pointer;
}

.section-body {
  /* padding-top: 53px;padding-bottom: 53px; */
  padding-top:5em;padding-bottom:10em;
}

.mb-10 {
  padding-bottom:10vh;
}

.heading-main {
  font-size: 5vh;
}

/* On screens that are 992px wide or less */
@media screen and (max-width: 992px) {
  .benefit-list {
    font-size: 1em;
    margin-bottom: 19px;
    margin-right: -5px;
    padding-bottom: 8px;
    margin-top: -14px;
    padding-left: 58px;
    padding-right: 61px;
    padding-top: 15px;
  }

  .paraquote {
    width: 60%;
    margin: auto;
    padding-bottom: 5%;
    padding-top: 5%;
    font-style: italic;
  }

  h1.slide3 {
    font-size: 2.1em;
    padding-top: 0px;
    margin-top: -66px;
  }

  .section-body {
    /* padding-top: 53px;padding-bottom: 53px; */
    padding-top:3em;padding-bottom:3em;
  }
}

/* On screens that are 460px wide or less */
@media screen and (max-width: 460px) {
  .benefit-list {
    font-size: 1em;
    padding-left: 5px;
    padding-right: 5px;
  }

  .slide3 {
    font-size: 1.5em;
  }

  .section-body {
    /* padding-top: 53px;padding-bottom: 53px; */
    padding-top:1em;padding-bottom:1em;
  }

  .section-body {
    /* padding-top: 53px;padding-bottom: 53px; */
    padding-top:1em;padding-bottom:1em;
  }

  .navbar-toggler {
    margin-top:1em;
  }

  #navcol-2 {
    margin-top:1em;
  }
 


}


	/* Custom CSS for Continuous Sliding Logo Carousel */
.logo-carousel-container {
    width: 100%;
    /* You might want to define a max-height for the container or the images themselves */
    /* max-height: 100px; */ 
}

.logo-carousel-track {
    white-space: nowrap; /* Keep all items in a single line */
    animation: scrollLogos 30s linear infinite; /* Adjust time for speed */
}

.logo-item {
    display: inline-block; /* Ensure items are inline but have box model properties */
    vertical-align: middle; /* Align items nicely */
    width: calc(100% / 5); /* Show approx 5 logos at a time on larger screens */
    flex-shrink: 0; /* Prevent items from shrinking */
    padding: 0 15px; /* Spacing between logos */
}

.logo-item img {
    max-height: 70px; /* Adjust as needed - ensure all logos fit */
    width: auto; /* Maintain aspect ratio */
    filter: grayscale(100%); /* Optional: Make logos grayscale */
    opacity: 0.7; /* Optional: Tone down logos */
    transition: filter 0.3s ease, opacity 0.3s ease; /* Smooth hover effect */
}

.logo-item img:hover {
    filter: grayscale(0%); /* Optional: Color on hover */
    opacity: 1; /* Optional: Full opacity on hover */
}

.accordion-button {
            font-weight: bold;
            font-size: 1.15rem;
            padding: 1.25rem 1.5rem;
        }

/* Keyframe animation for continuous scrolling */
@keyframes scrollLogos {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(-260%); /* Moves exactly half the track width (one full set of logos) */
    }
}

/* Responsive adjustments for logo items */
@media (max-width: 991.98px) { /* Medium devices and below */
    .logo-item {
        width: calc(100% / 4); /* Show 4 logos */
    }
    @keyframes scrollLogos {
        from { transform: translateX(0); }
        to { transform: translateX(-50%); }
    }
}

@media (max-width: 767.98px) { /* Small devices and below */
    .logo-item {
        width: calc(100% / 3); /* Show 3 logos */
    }
    @keyframes scrollLogos {
        from { transform: translateX(0); }
        to { transform: translateX(-50%); }
    }

      .heading-main {
      font-size: 3vh;
    }
}

@media (max-width: 575.98px) { /* Extra small devices and below */
    .logo-item {
        width: calc(100% / 2); /* Show 2 logos */
    }
    .logo-item img {
        max-height: 60px; /* Smaller height for small screens */
    }
    @keyframes scrollLogos {
        from { transform: translateX(0); }
        to { transform: translateX(-50%); }
    }
}

@media (min-width: 768px) {
  #UNDER-HERO {
    transform: translateY(-10vw);
    height: 15em;

  }

  .card {
        box-shadow: 5px 10px rgba(190, 190, 190, 0.3);
        /*z-index:34;*/
  }

  .cardimg {
     height:13vw;
  }

   .card-text {
        min-height:10vh;
   }

  .expertise {
    padding-top:10vh;
  }
}

/* CUSTOM BOOTSTRAP CLASSES  */
.display-7 {
  font-size:1.2rem;
}

@media(min-width:768px){
  .display-7 {
  font-size:1.8rem;
  }
}
