body {
    margin: 0;
    padding: 0; /* Ensure no padding is added by default */
    font-family: Arial, sans-serif;
}

header {
    background-color: #333;
    color: #fff;
    padding: 10px 20px;
}

/* Hide notification header initially and show on scroll */
.notification-header {
    background-color: #ff9800; /* Example background color */
    color: #fff; /* White text color */
    padding: 10px 20px;
    border-bottom: 1px solid #ddd;
    position: sticky; /* Stick to the top of the viewport */
    top: 0; /* Start at the top of the viewport */
    z-index: 2000; /* Ensure it stays above the main header */
    transition: top 0.3s ease-in-out; /* Smooth transition */
}

body:not(:root) .notification-header {
    top: 0; /* Show when scrolled */
}

.new-top-header {
    background-color: #0277bd; /* Dark blue background for new header */
    color: #fff; /* White text color */
    padding: 10px 20px;
    border-bottom: 1px solid #ddd;
}

.new-top-header .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.new-top-header-left {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: flex-start; /* Align to the left */
}

.new-top-header-center {
    flex: 2;
    display: flex;
    align-items: center;
    justify-content: center; /* Center horizontally */
}

.new-top-header-right {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: flex-end; /* Align to the right */
}

.new-top-header-left, .new-top-header-center, .new-top-header-right {
    gap: 20px; /* Space between items */
}

.header-text {
    color: #fff; /* White color for header text */
    font-weight: bold;
    transition: color 0.3s ease; /* Smooth color transition */
}

.header-text:hover {
    color: #ffd54f; /* Highlight color on hover */
}

.contact-link {
    color: #fff; /* White color for contact links */
    text-decoration: none;
    display: flex;
    align-items: center;
    transition: color 0.3s ease; /* Smooth color transition */
}

.contact-link:hover {
    color: #ffd54f; /* Highlight color on hover */
    text-decoration: underline;
}

.icon {
    font-size: 20px; /* Adjust size as needed */
    margin-right: 5px; /* Space between icon and text */
    transition: color 0.3s ease; /* Smooth color transition */
}

.contact-link:hover .icon {
    color: #ffd54f; /* Highlight color on hover */
}

.new-top-header-right a {
    color: #fff; /* White color for links */
    text-decoration: none;
    transition: color 0.3s ease; /* Smooth color transition */
}

.new-top-header-right a:hover {
    color: #ffd54f; /* Highlight color on hover */
    text-decoration: underline;
}

.top-header {
    background-color: #f0f0f0; /* Light background color for top header */
    padding: 10px 20px;
    border-bottom: 1px solid #ddd;
}

.top-header .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.top-header-left img,
.top-header-right img {
    height: 50px; /* Adjust size as needed */
    transition: opacity 0.3s ease; /* Smooth opacity transition */
}

.top-header-left img:hover,
.top-header-right img:hover {
    opacity: 0.8; /* Slightly reduce opacity on hover */
}

.main-header {
    background-color: #333; /* Background color for main header */
    padding: 10px 20px;
    position: sticky; /* Make the header sticky */
    top: 43px; /* Adjust based on height of notification header */
    z-index: 1000; /* Ensure it stays below notification header */
}

.main-header .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.logo img {
    height: 50px; /* Adjust size as needed */
    max-width: 100%;
    transition: transform 0.3s ease; /* Smooth transform transition */
}

.logo img:hover {
    transform: scale(1.05); /* Slightly scale up logo on hover */
}

.nav-menu {
    display: flex;
    align-items: center;
    position: relative; /* Ensure dropdown menu is positioned relative to this container */
}

.nav-links {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
}

.nav-links li {
    margin: 0 10px; /* Reduced margin for spacing */
}

.nav-links a {
    position: relative;
    padding: 10px 20px;
    display: block;
    color: #fff;
    text-decoration: none;
    font-size: 0.85em; /* SMALLER SIZE */
    transition: color 0.3s ease, background-color 0.3s ease;
    border-radius: 4px;
}



.nav-links a:hover {
    color: #ffd54f; /* Highlight color on hover */
}

.dropdown-toggle {
    display: none; /* Hidden by default */
    background: none;
    border: none;
    color: #fff;
    font-size: 1.5em;
    cursor: pointer;
    padding: 0;
    position: relative; /* Ensure dropdown menu is positioned relative to this button */
    transition: color 0.3s ease; /* Smooth color transition */
}

.dropdown-toggle:hover {
    color: #ffd54f; /* Highlight color on hover */
    padding: 10px 10px 10px 10px blue;
}

.dropdown-menu {
    display: none; /* Hidden by default */
    position: absolute;
    top: 100%; /* Position below the button */
    right: 0;
    background-color: #333;
    box-shadow: 0 2px 5px rgba(0,0,0,0.2);
    width: 200px; /* Adjust width as needed */
    z-index: 1000; /* Ensure it is above other content */
}

.dropdown-menu a {
    display: block;
    padding: 10px 20px;
    color: #fff;
    text-decoration: none;
    transition: background-color 0.3s ease; /* Smooth background color transition */
}

.dropdown-menu a:hover {
    background-color: #444; /* Highlight background color on hover */
}

.nav-links a:hover {
    background-color: #444; /* Darker background on hover */
    color: #ffd54f; /* Highlight text color on hover */
}

@media (max-width: 768px) {
    .new-top-header .container {
        flex-direction: column;
        align-items: center; /* Center items vertically */
    }
    .new-top-header-left,
    .new-top-header-center,
    .new-top-header-right {
        width: 100%;
        justify-content: center; /* Center horizontally */
        text-align: center; /* Center text */
    }
    .new-top-header-center {
        margin-top: 10px; /* Space above the center section */
    }
    .new-top-header-right {
        margin-top: 10px; /* Space above the right section */
    }
    .nav-links {
        display: none; /* Hide links on small screens */
    }
    .dropdown-toggle {
        display: block; /* Show dropdown icon */
    }
    .dropdown-menu.show {
        display: block; /* Show dropdown menu */
    }
}


.slider-container {
    position: relative;
    max-width: 100%;
    overflow: hidden;
    margin: auto;
}

.slider-wrapper {
    display: flex;
    transition: transform 0.5s ease-in-out;
}

.slider-item {
    min-width: 100%;
    box-sizing: border-box;
}

.slider-item img {
    width: 100%;
    display: block;
}

.prev, .next {
    position: absolute;
    top: 50%;
    background: rgba(0, 0, 0, 0.5);
    color: white;
    border: none;
    padding: 10px;
    cursor: pointer;
    transform: translateY(-50%);
}

.prev {
    left: 0;
}

.next {
    right: 0;
}


