html {
          scroll-behavior: smooth;
}

.itemserv {
          max-height: 100vh;
          overflow-y: auto;
}

.itemserv .list-group-item {
          cursor: pointer;
}

.itemserv .list-group-item.active {
          background-color: #379e9e;
          color: white;
}

.itemserv {
          position: sticky;
          top: 100px;
          /* Adjust this based on your header height */
}

.content-section {
          margin-bottom: 50px;
          padding-top: 70px;
          /* Adjust according to the height of your sticky menu */

}

/* Style the menu */
#testservice-menu {
          background-color: #f8f9fa;
          /* Light background */
          border-radius: 8px;
          /* Rounded corners */
          padding: 15px;
          /* Padding around the items */
          transition: box-shadow 0.3s ease;
          /* Smooth shadow transition */
}

/* Style for individual menu items */
#testservice-menu .list-group-item {
          border: none;
          /* Remove default border */
          border-radius: 6px;
          /* Rounded corners for items */
          margin-bottom: 8px;
          /* Space between items */
          color: black;
          /* Bootstrap's primary color */
          font-weight: 500;
          /* Medium font weight */
          transition: background-color 0.3s ease, color 0.3s ease;
          /* Smooth color transition */
}

/* Hover effect for menu items */
#testservice-menu .list-group-item:hover {
          background-color: #379e9e;
          /* Change background on hover */
          color: #fff;
          /* Change text color on hover */
}

/* Active state for menu items */
#testservice-menu .list-group-item.active {
          background-color: #379e9e;
          /* Active background color */
          color: #fff;
          /* Active text color */
          font-weight: 600;
          /* Bold font for active item */
}

/* Shadow effect */
#testservice-menu.shadow-sm {
          box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
          /* Light shadow */
}

/* Sticky menu with a slight shadow on scroll */
.sticky-top {
          z-index: 1030;
          box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
          /* Light shadow when sticky */
}

/* Optional: Adjust the text alignment and padding */
#testservice-menu .list-group-item {
          text-align: center;
          /* Center align text */
          padding: 12px 20px;
          /* Increase padding */
}