  html {
        scroll-behavior: smooth;
        /* Enable smooth scrolling */
    }

    * {
        font-family: "LindeDaxGlobal";
    }

    /* General Configuration for Container */
    .widget-container {
        width: 100%;
        /* Full width of the page */
        max-width: 1200px;
        /* Maximum width constraint for larger screens */
        margin: 0 auto;
        /* Center horizontally */
        padding: 20px;
        /* Space around widget */
        box-sizing: border-box;
        /* Padding included in widget dimensions */
    }

    /* Widget Layout */
    .text-image-widget {
        display: flex;
        /* Flexbox for layout */
        flex-direction: row;
        /* Text on the left, image on the right on larger screens */
        gap: 20px;
        /* Space between text and image */
        align-items: flex-start;
        /* Align items at the top */
    }

    /* Text Section */
    .widget-text {
        width: 52%;
        /* Text takes more space on larger screens */
        padding: 20px;
        /* Padding inside the text area */
        color: #003256;
        /* Dark blue text color */
        font-family: 'LindeDaxGlobal';
        /* Custom font applied */
        text-align: left;
        /* Align text to the left */
    }

    .widget-text h2 {
        font-size: 4rem;
        /* Headline font size */
        margin-bottom: 15px;
        /* Space below headline */
        margin-top: 0px;
        font-weight: bold;
    }

    .widget-text h3 {
        font-size: 2.5rem;
        /* Subheadline font size */
        margin-bottom: 15px;
        /* Space below subheadline */
        font-weight: bold;
    }

    .widget-text p {
        font-size: 1.8rem;
        /* Paragraph font size */
        line-height: 1.6;
        /* Improved readability for text */
        margin-bottom: 35px;
        /* Space between paragraphs */
        width: 90%;
    }

    .cta-button {
        display: inline-block;
        background-color: #0077CC;
        /* Button background color (blue) */
        color: #FFFFFF;
        /* Button text color (white) */
        padding: 12px 20px;
        /* Padding inside the button */
        font-size: 1.8rem;
        /* Button font size */
        text-decoration: none;
        /* Remove underline */
        border-radius: 5px;
        /* Rounded corners */
        transition: background-color 0.2s ease;
        /* Smooth hover effect */
        cursor: pointer;
        /* Change cursor to pointer */
        width: 100%;
        text-align: center;
    }

    /* Hover State for Button */
    .cta-button:hover {
        background-color: #005FA3;
        /* Slightly darker tint on hover */
        color: white;
    }

    /* Image Section */
    .widget-image {
        width: 46%;
        /* Image width on larger screens */
        display: flex;
        /* Keeps the alignment */
        align-items: flex-start;
    }

    .widget-image img {
        width: 100%;
        /* Make image fill its container */
        height: auto;
        /* Maintain aspect ratio */
        border-radius: 5px;
        /* Rounded corners for a polished look */
    }

    @media (max-width: 1200px) and (min-width: 768px) {
        .widget-text h2 {
            font-size: 1.7rem;
        }

        .widget-text h3 {
            font-size: 1.3rem;
        }

        .widget-text p {
            font-size: 1rem;
        }
    }

    /* Responsive Settings */
    /* For Tablet Screens */
    @media (max-width: 768px) {
        .text-image-widget {
            flex-direction: column;
            /* Stack text and image vertically */
            align-items: center;
            /* Center-align the content */
            gap: 15px;
            /* Space between text and image */
        }

        .widget-text {
            width: 100%;
            /* Text takes full width */
            padding: 20px;
            /* Maintain padding for full width */
            text-align: center;
            /* Center-align text for smaller screens */
        }

        .widget-image {
            width: 100%;
            /* Image stretches to full width */
            margin-bottom: 10px;
            /* Add space below image */
        }

        .widget-image img {
            width: 100%;
            /* Full width image */
            height: auto;
            /* Maintain aspect ratio */
        }
    }

    /* For Mobile Screens */
    @media (max-width: 480px) {
        .text-image-widget {
            flex-direction: column-reverse;
            /* Switch order: Text goes under the image */
            gap: 15px;
            /* Space between text and image */
        }

        .widget-text {
            width: calc(100% - 40px);
            /* Text occupies almost full width with padding */
            padding: 20px;
            /* Maintain padding for smaller screens */
            text-align: center;
            /* Center text for readability */
        }

        .widget-image {
            width: 100%;
            /* Image spans entire page width */
        }

        .widget-image img {
            width: 100%;
            /* Full width image */
            height: 300px;
            /* Smaller height to avoid excessive vertical space */
            object-fit: cover;
            /* Ensure image doesn't distort and fills height */
            border-radius: 5px;
            /* Rounded corners */
        }
    }



    /* Navigation Bar Background */
    .navigation-bar {
        width: 100%;
        /* Full width of the page */
        background-color: #002D54;
        /* Deep blue background */
        padding: 20px 0;
        /* Vertical padding */
    }

    /* Navigation Links Container */
    .navigation-links {
        max-width: 1200px;
        /* Restrict links within maximum width */
        margin: 0 auto;
        /* Center container on the page */
        display: flex;
        /* Flexbox for horizontal alignment */
        justify-content: space-between;
        /* Space links evenly across the container */
        align-items: center;
        /* Align items vertically */
        gap: 20px;
        /* Space between links */
        padding: 0px 40px;
    }

    /* Individual Link Styling */
    .nav-link {
        display: flex;
        /* Flexbox for icon and text alignment */
        align-items: center;
        /* Center align icon and text */
        gap: 10px;
        /* Space between icon and text */
        text-decoration: none;
        /* Remove underline */
        color: #FFFFFF;
        /* White text color */
        font-family: 'LindeDaxGlobal';
        /* Simple font for readability */
        font-size: 1.8rem;
        /* Link font size */
        transition: color 0.3s ease;
        /* Smooth color transition on hover */
    }

    /* Hover Effect for Links */
    .nav-link:hover {
        cursor: pointer;
        /* Pointer cursor on hover */
        color: white;
    }

    /* Icon Styling */
    .nav-link img {
        width: 16px;
        /* Fixed size for the icon */
        height: 16px;
        /* Fixed size for the icon */
    }

    /* Responsive Styling for Smaller Devices */
    @media (max-width: 768px) {
        .navigation-links {
            flex-wrap: wrap;
            /* Allow links to wrap onto multiple rows */
            justify-content: space-between;
            /* Center links on smaller screens */
            gap: 15px;
            /* Reduce spacing between links */
        }

        .nav-link {
            font-size: 1.2rem;
            /* Reduce font size for smaller screens */
        }
    }

    @media (max-width: 480px) {
        .navigation-links {
            flex-direction: column;
            /* Stack links vertically */
            align-items: center;
            /* Center align the links */
            gap: 10px;
            /* Adjust spacing between stacked links */
        }

        .nav-link img {
            width: 14px;
            /* Reduce icon size slightly */
            height: 14px;
            /* Reduce icon size slightly */
        }
    }


    /* The Main Widget (Container) */
    .image-grid-widget {
        display: flex;
        /* Use Flexbox for a row layout */
        flex-wrap: wrap;
        /* Allow items to wrap on smaller screens */
        gap: 20px;
        /* Space between image cards */
        max-width: 1200px;
        /* Restrict maximum width */
        margin: 0 auto;
        /* Center the widget */
        padding: 20px;
        /* Add padding */
        box-sizing: border-box;
        /* Include padding in measurements */
        font-family: 'lindeDaxGlobal';
    }

    /* Individual Image Cards */
    .image-card {
        flex: 1 1 calc(25% - 20px);
        /* Flex items take 25% width */
        max-width: calc(25% - 20px);
        /* Ensure proper width even with margins */
        box-sizing: border-box;
        /* Include padding in width */
        text-align: center;
        /* Center text alignment */
        padding: 10px;
        /* Add some spacing inside */
        border-radius: 8px;
        /* Optional rounded corners for a polished look */
        text-align: left;
        position: relative;
        height: 500px;
    }

    /* Images in Cards */
    .image-card img {
        width: 100%;
        /* Make image fill its container */
        height: 260px;
        /* Maintain aspect ratio */
        border-radius: 8px;
        /* Rounded corners for the image */
        object-fit: cover;
    }

    /* Headlines */
    .image-card h3 {
        font-size: 1.8rem;
        /* Headline font size */
        color: #003256;
        /* Dark blue text color */
        margin: 15px 0;
        font-weight: bold;
        /* Space above and below the headline */
    }

    /* Paragraphs */
    .image-card p {
        font-size: 1.8rem;
        /* Paragraph font size */
        line-height: 1.6;
        /* Improve readability */
        margin: 10px 0;
        /* Space above and below the paragraph */
        color: #555555;
        /* Optional: Light gray text for description */
        min-height: 130px;
        color: #003256;
    }

    /* CTA Button */
    .cta-button {
        display: inline-block;
        /* Button fits content naturally */
        background-color: #0077CC;
        /* Blue button background */
        color: #FFFFFF;
        /* White text color */
        padding: 10px 20px;
        /* Padding inside the button */
        font-size: 1.8rem;
        /* Adjust font size */
        text-decoration: none;
        /* Remove underline from button link */
        border-radius: 5px;
        /* Rounded corners */
        cursor: pointer;
        /* Mouse pointer on hover */
        transition: background-color 0.2s ease;
        /* Smooth hover effect */
    }

    #card-buttons {
        position: absolute;
        bottom: 20px;
        left: 50%;
        transform: translateX(-50%);
    }

    /* Button Hover Effect */
    .cta-button:hover {
        background-color: #005FA3;
        /* Slightly darker tint on hover */
        color: white;
    }

    /* Responsive Design for Smaller Screens (Tablet) */
    @media (max-width: 768px) {
        .image-card {
            flex: 1 1 calc(50% - 20px);
            /* Flex items take 50% width */
            max-width: calc(50% - 20px);
            /* Adjust maximum width in tablet screens */
        }
    }

    /* Responsive Design for Smaller Screens (Mobile) */
    @media (max-width: 480px) {
        .image-card {
            flex: 1 1 100%;
            /* Flex items take full width */
            max-width: 100%;
            /* Ensure proper width */
        }

        .image-card h3 {
            font-size: 1.2rem;
            /* Reduce headline size for smaller screens */
        }

        .image-card p {
            font-size: 1.2rem;
            /* Slightly smaller paragraph font for readability */
        }

        .cta-button {
            font-size: 1.2rem;
            /* Reduce button font size */
            padding: 8px 15px;
            /* Adjust button padding */
        }
    }

    /* Blue Background Block */
    .blue-background-block {
        width: 100%;
        /* Full width of the page */
        background-color: #002D54;
        /* Deep blue background */
        padding: 40px 20px;
        /* Add spacing */
        box-sizing: border-box;
        /* Include padding in measurement */
        text-align: center;
        /* Center heading and small text */
    }

    /* Heading */
    .block-heading {
        color: #FFFFFF;
        /* White text color */
        font-size: 2.5rem;
        /* Font size for the heading */
        margin-bottom: 30px;
        /* Space below the heading */
        font-weight: 300;
    }

    /* Image Row */
    .image-row {
        display: flex;
        /* Flexbox for horizontal layout */
        justify-content: space-around;
        /* Center images and arrows */
        align-items: center;
        /* Vertically align images and arrows */
        gap: 15px;
        /* Space between images and arrows */
        max-width: 1200px;
        margin: 0 auto;
    }

    /* Individual Image Wrapper */
    .image-wrap {
        display: flex;
        flex-direction: column;
        /* Stack image and description vertically */
        align-items: center;
        /* Center-align image and text */
        text-align: center;
    }

    /* Images */
    .image-wrap img {
        width: 280px;
        /* Adjust width of the images */
        height: auto;
        /* Maintain aspect ratio */
        border-radius: 7px;
        /* Rounded corners for images */
    }

    /* Image Descriptions */
    .image-description {
        color: #FFFFFF;
        /* White text */
        font-size: 1.3rem;
        /* Small description text */
        margin-top: 10px;
        /* Space above the description text */
        width: 280px;
        text-align: left;
    }

    /* UTF8 Arrow (between images) */
    .arrow-wrap {
        font-size: 2rem;
        /* Larger size for the arrow icon */
        color: #FFFFFF;
        /* White arrow color */
        display: flex;
        /* Align arrows */
        align-items: center;
        /* Center arrows vertically */
    }

    /* Responsive Design for Medium Screens */
    @media (max-width: 768px) {
        .image-row {
            flex-wrap: wrap;
            /* Wrap images and arrows to multiple rows */
            gap: 20px;
            /* Space between rows */
        }

        .arrow-wrap {
            font-size: 1.5rem;
            /* Reduce size of arrows */
        }
    }

    /* Responsive Design for Smaller Screens */
    @media (max-width: 480px) {
        .image-row {
            flex-direction: column;
            /* Stack images and arrows vertically */
            gap: 20px;
            /* Space between rows */
        }

        .image-wrap img {
            width: 100%;
            /* Make image full width on smaller screens */
            max-width: 300px;
            /* Restrict maximum image size */
        }

        .image-description {
            font-size: 1.2rem;
            /* Adjust description font size */
        }
    }

    /* Text and Image Block Container */
    .text-image-block {
        display: flex;
        /* Use Flexbox for horizontal layout */
        max-width: 1200px;
        /* Align width with other blocks */
        margin: 0 auto;
        /* Center the block */
        padding: 20px;
        /* Add spacing inside */
        gap: 20px;
        /* Space between text and image */
        box-sizing: border-box;
        /* Include padding in measurements */
        margin-top: 30px;
    }

    /* Text Section */
    .block-text {
        width: 50%;
        /* Make text container occupy 50% of the block width */
        color: #FFFFFF;
        /* Dark blue text color */
        text-align: left;
        /* Align text to the left */
    }

    .block-text h2 {
        font-size: 2.5rem;
        font-weight: 700;
    }

    .block-text p {
        font-size: 1.5rem;
        /* Paragraph font size */
        line-height: 1.6;
        /* Improve readability */
        margin-bottom: 0;
        /* Remove default margin spacing */
        width: 90%;
        color: #fff;
        margin-left: 20px;
    }

    /* Image Section */
    .block-image {
        width: 50%;
        /* Make image container occupy 50% of the block width */
        display: flex;
        /* Flexbox for image alignment */
        align-items: center;
        /* Center-align the image vertically */
        justify-content: center;
        /* Center-align the image horizontally */
    }

    .block-image img {
        width: 100%;
        /* Make image fill its container */
        height: auto;
        /* Maintain aspect ratio for the image */
        border-radius: 8px;
        /* Optional: Rounded corners for the image */
    }

    /* Responsive Design for Smaller Screens (Tablet) */
    @media (max-width: 768px) {
        .text-image-block {
            flex-direction: column;
            /* Stack text and image vertically */
        }

        .block-text {
            width: 100%;
            /* Make text full width */
            text-align: center;
            /* Center-align text for smaller screens */
        }

        .block-image {
            width: 100%;
            /* Make image full width */
        }
    }

    /* Responsive Design for Smaller Screens (Mobile) */
    @media (max-width: 480px) {
        .block-text {
            font-size: 1.2rem;
            /* Reduce text font size for smaller screens */
        }

        .block-image img {
            width: 100%;
            /* Ensure the image stretches fully inside its container */
            height: auto;
            /* Maintain aspect ratio */
        }
    }

    /* Accordion Block */
    .accordion-block {
        width: 100%;
        /* Full width of the block */
        max-width: 1200px;
        /* Align block width with other page content */
        margin: 0 auto;
        /* Center the block */
        padding: 20px;
        /* Block padding */
    }

    /* Heading */
    .accordion-heading {
        text-align: center;
        /* Center-align the heading */
        font-size: 2.5rem;
        /* Font size for heading */
        font-weight: 300;
        /* Lighter font weight */
        margin-bottom: 30px;
        /* Space between heading and accordion */
        color: #003256;
        /* Optional: Dark blue text color */
    }

    /* Accordion Container */
    .accordion {
        background-color: #F4F4F4;
        /* Light gray background for accordion */
        border-radius: 5px;
        /* Rounded corners for accordion */
        overflow: hidden;
        /* Prevent overlap when collapsing */
    }

    /* Accordion Item */
    .accordion-item {
        border-bottom: 1px solid #DDDDDD;
        /* Divider between questions */
    }

    /* Accordion Question (Button) */
    .accordion-question {
        width: 100%;
        /* Full width for the button */
        padding: 15px 20px;
        /* Space inside each question */
        background-color: white;
        /* Accordion background */
        border: none;
        /* Remove default button border */
        outline: none;
        /* Remove focus outline */
        text-align: left;
        /* Align question text to the left */
        cursor: pointer;
        /* Pointer cursor on hover */
        display: flex;
        /* Use Flexbox for aligning text and arrow */
        justify-content: space-between;
        /* Place question text on the left and arrow on the right */
        align-items: center;
        /* Center question text and arrow */
        font-size: 1.5rem;
        /* Font size for question text */
        color: #003256;
        /* Dark blue text for readability */
        transition: background-color 0.3s ease;
        /* Smooth color change on hover */
        box-shadow: 0px 4px 10px rgba(0, 119, 204, 0.11);
        /* Shadow under dropdown */

    }

    /* Arrow Icon Inside Question */
    .accordion-question .arrow {
        font-size: 1.5rem;
        /* Match size to question text */
        color: #003256;
        /* Dark blue color for arrow */
    }

    /* Accordion Hover Effect */
    .accordion-question:hover {
        background-color: rgba(0, 119, 204, 0.11);
        /* Or use #0077CC1C */
    }

    /* Accordion Answer Section */
    .accordion-answer {
        display: none;
        /* Initially hidden */
        padding: 15px 20px;
        /* Padding for answer content */
        background-color: #FFFFFF;
        /* White background for dropdown */
        color: #003256;
        /* Dark blue text color */
        font-size: 1.3rem;
        /* Slightly smaller font size */
        line-height: 1.6;
        /* Improved text readability */
        box-shadow: 0px 4px 10px rgba(0, 119, 204, 0.19);
        /* Shadow for dropdown */
    }

    /* Active Dropdown (Visible Answer) */
    .accordion-item.active .accordion-answer {
        display: block;
        /* Make the answer visible */
    }

    /* Rotate Arrow Icon on Active State */
    .accordion-item.active .accordion-question .arrow {
        transform: rotate(180deg);
        /* Rotate arrow to point up */
        transition: transform 0.3s ease;
        /* Smooth rotation */
    }


    /* Styles for the Circle */
    .circle-with-arrow {
        display: inline-flex;
        /* Center contents inside the circle */
        justify-content: center;
        /* Horizontally center the arrow */
        align-items: center;
        /* Vertically center the arrow */
        width: 30px;
        /* Circle diameter */
        height: 30px;
        /* Circle diameter */
        background-color: #FFFFFF;
        /* White background color */
        border-radius: 50%;
        /* Make it a perfect circle */
        border: 1px solid rgba(0, 160, 225, 0.11);
        /* Optional border with light opacity */
        box-shadow: 0px 4px 10px rgba(0, 119, 204, 0.11);
        /* Subtle shadow for the circle */
        margin: 0 auto;
        /* Center within the <p> */
        text-align: center;
        /* Center-align the content */
        box-sizing: border-box;
        /* Includes padding and borders within width/height */
    }

    /* Styles for Down Arrow */
    .circle-with-arrow .arrow {
        font-size: 16px;
        /* Size of the arrow */
        color: #00A0E1;
        /* Color of the downward-pointing arrow */
        line-height: 1;
        /* Ensure proper alignment of the arrow */
    }

    /* List Container */
    .important-list {
        text-align: center;
        /* Align contents to the center */
        margin: 0px auto;
        /* Center within the page and add spacing above/below */
        max-width: 800px;
        /* Constrain list width for readability */
        padding: 20px;
        /* Add inner padding for spacing */
        box-sizing: border-box;
        /* Account for padding within width calculations */
    }

    /* List Styling */
    .important-list ul {
        list-style-type: none;
        /* Remove default bullet points */
        margin: 0;
        /* Remove default margins */
        padding: 0;
        /* Remove default padding */
    }

    .important-list li {
        color: #FFFFFF;
        /* White text color for items */
        font-family: 'LindeDaxGlobal', sans-serif;
        /* Global font */
        font-size: 1.3rem;
        /* Set readable font size */
        line-height: 1.8;
        /* Improve readability with spacing */
        margin-bottom: 15px;
        /* Add spacing between the list items */
        text-align: center;
        /* Ensure readable alignment within large text */
    }


    /* Button Container */
    .bottom-button-container {
        position: relative;
        margin: 0px auto;
        text-align: center;
        margin-bottom: 40px;
    }

    /* Button Styling */
    .bottom-button {
        display: inline-block;
        /* Allows padding and ensures the button wraps */
        background-color: #0077CC;
        /* Blue button background */
        color: #FFFFFF;
        /* White text color */
        padding: 12px 24px;
        /* Button padding for proper size */
        font-size: 1.5rem;
        /* Standard font size */
        font-family: 'LindeDaxGlobal';
        /* Use global font */
        text-align: center;
        /* Center the text inside the button */
        text-decoration: none;
        /* Remove underline for link */
        border-radius: 5px;
        /* Add rounded corners */
        box-shadow: 0 4px 10px rgba(0, 119, 204, 0.2);
        /* Optional shadow effect */
        cursor: pointer;
        /* Change cursor on hover */
        transition: background-color 0.3s ease, box-shadow 0.3s ease;
        /* Smooth hover transition */
    }

    /* Button Hover Effect */
    .bottom-button:hover {
        background-color: #005FA3;
        /* Slightly darker blue on hover */
        box-shadow: 0 6px 12px rgba(0, 119, 204, 0.3);
        /* Larger shadow on hover */
        color: white;
    }

    /* Section Styles */
    .equipment-section {
        display: flex;
        justify-content: center;
        align-items: flex-start;
        gap: 20px;
        padding: 40px;
        color: #ffffff;
        max-width: 1200px;
        margin: auto;
    }

    .content-left,
    .content-right {
        width: 50%;
        /* Split the section to accommodate text and image equally */
        text-align: left;
    }

    /* Heading Styles */
    .section-heading {
        font-size: 2.5rem;
        display: flex;
        margin-bottom: 20px;
        font-weight: 400;
    }

    .decoration-line {
        display: inline-block;
        width: 8px;
        /* Thickness of the blue line */
        height: 50px;
        /* Height of the vertical line */
        background-color: #0077CC;
        /* Decorative line color */
        margin-right: 15px;
        /* Space between line and heading */
    }

    /* List Styles */
    .equipment-list {
        list-style: none;
        padding: 0;
        margin: 20px 0;
    }

    .equipment-item {
        font-size: 1.5rem;
        display: inherit;
        text-align: left;
        margin-bottom: 20px;
        /* Space between items */
        position: relative;
        padding-left: 20px;
    }

    .arrow-blue {
        margin-right: 10px;
        /* Space between arrow and text */
        color: #0077CC;
        position: absolute;
        left: 0;
        font-weight: lighter;
    }

    /* Button Styling */
    .cta-button-safety {
        padding: 10px 60px;
        font-size: 1.8rem;
        background: none;
        border: 2px solid #0077CC;
        /* Border color */
        color: #ffffff;
        /* White text */
        border-radius: 7px;
        /* Smooth rounded corners */
        cursor: pointer;
        transition: all 0.3s ease;
    }

    .cta-button-safety:hover {
        background-color: #0077CC;
        /* Change background on hover */
        color: #ffffff;
        /* Ensure text stays white */
    }

    /* Image Carousel Styling */
    .image-carousel {
        position: relative;
        overflow: hidden;
        /* Hide overflowing content for carousel effect */
    }

    .carousel-image-container {
        display: none;
        /* Hide all images except the one being shown */
        position: relative;
    }

    .carousel-image {
        width: 100%;
        border-radius: 8px;
        /* Smooth rounded corners */
    }

    .image-text {
        position: absolute;
        bottom: 10px;
        left: 5px;
        right: 5px;
        background-color: rgba(0, 45, 84, 0.6);
        /* Semi-transparent #0077CC background */
        color: #ffffff;
        /* White text */
        font-size: 1.5rem;
        padding: 5px 10px;
        border-radius: 5px;
        /* Rounded corners for the label box */
    }

    /* Carousel Arrow */
    .carousel-arrow {
        position: absolute;
        top: 50%;
        right: 10px;
        transform: translateY(-50%);
        font-size: 1.5rem;
        color: #ffffff;
        /* White arrow */
        background-color: #0077CC;
        /* Blue circle */
        border: none;
        cursor: pointer;
        width: 40px;
        /* Circle width */
        height: 40px;
        /* Circle height */
        border-radius: 50%;
        /* Make it a perfect circle */
        display: flex;
        align-items: center;
        justify-content: center;
        /* Center the arrow inside the circle */
        box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.2);
        /* Optional: Add shadow for a subtle 3D effect */
        transition: background-color 0.3s ease, color 0.3s ease;
    }

    .carousel-arrow:hover {
        background-color: #005FA3;
        /* Slightly darker blue on hover */
        color: #ffffff;
    }

    .colored-line {
        width: 8px;
        /* Thickness of the line */
        height: 50px;
        background-color: #0077CC;
        margin-right: 10px;
        /* Space between the line and heading */
    }

    .heading-wrapper {
        display: flex;
        align-items: center;
        margin-bottom: 30px;
        margin-left: 20px;
    }

    .myaga-breadcrumbs-list{
        list-style: none;
        display: flex;
        max-width: 1200px;
        margin: 0px 20px;
        gap: 10px;
    }

    .myaga-breadcrumbs-link {
        color: #00305c;
    }

    .myaga-breadcrumbs-separator {
        color: #888;
    }

    #myaga-breadcrumbs-current {
        color: #0077CC;
        
    }
    .myaga-breadcrumbs {
       max-width: 1000px; 
   }
   
   @media (max-width: 768px) {
        .equipment-section{
            display: block;
        }
        .content-left, .content-right{
            width: 100%;
        }
        .cta-button-safety{
            margin-bottom: 20px;
        }
        .image-text{
            margin-left: 2px;
        }
        .carousel-arrow{
            top: 35%;
        }
        .important-list {
            max-width: 100%;
            /* Remove constraints to fit within smaller screens */
            padding: 10px;
            /* Reduce padding for smaller screens */
        }

        .important-list li {
            font-size: 1.2rem;
            /* Smaller text size */
            line-height: 1.6;
            /* Adjust spacing */
        }
        .block-text p{
            text-align: left;
        }

    }
   @media (max-width: 480px) {
        .bottom-button {
            width: 90%;
            /* Make the button span most of the screen */
            font-size: 1.2rem;
            /* Reduce font size for smaller viewports */
            padding: 10px;
            /* Adjust padding on smaller devices */
        }

        .bottom-button-container {
            transform: none;
        }
        
        .image-card{
            height: auto;
        }
        .image-card p{
            min-height: 120px;

         }

        .image-card img{
            height: auto;
            object-fit: contain;
        }
        .equipment-section{
            display: block;
        }
        .content-left, .content-right{
            width: 100%;
        }
        .cta-button-safety{
            margin-bottom: 20px;
        }
        .image-text{
            margin-left: 2px;
        }
        .carousel-arrow{
            top: 35%;
        }
        .block-text p{
            text-align: left;
        }
        #card-buttons{
            width: 100%;
        }
    }
    #button-safety-link{
        text-decoration: none;
    }