/* Adjust logo size for smaller screens */
@media (max-width: 768px) {
    .site-logo img {
        width: 80px; /* Adjust width for mobile */
        height: auto;
    }
}
@media (max-width: 768px) {
    .site-logo {
        display: block !important; /* Force logo visibility */
    }
}
.sticky-retina-logo img {
    display: block; /* Ensures image renders properly */
    width: 100px;
    height: auto;
    will-change: transform; /* Hints Safari to re-render the image */
    background-color: transparent; /* Ensures no background issue */
}
html, body {
    overflow-x: hidden;
}

.container, .site-logo {
    overflow: visible;
}


/* Default header style with opaque background */
.site-header {
    background-color: rgba(255, 255, 255, 0.8); /* Default background with opacity */
    transition: background-color 0.3s ease; /* Smooth transition */
    position: fixed; /* Fixed header */
    width: 100%;
    z-index: 1000; /* Ensure it's on top */
}

/* Transparent background on scroll */
.site-header.transparent {
    background-color: transparent !important;
}

/* Style for the header content to ensure it's not hidden by transparent background */
.site-header .container {
    transition: opacity 0.3s ease;
}
/* Make the header background blue */
.site-header {
    background-color: #43aecb; /* Adjust to the shade of blue you want */
    transition: background-color 0.3s ease;
    position: fixed; /* Keeps the header fixed at the top */
    width: 100%;
    z-index: 1000; /* Ensure it's on top */
}

/* When scrolling, the header can change to transparent (optional) */
.site-header.transparent {
    background-color: transparent;
}

/* Header and Navigation Improvements */
.site-header {
    padding: 15px 0 !important;
    height: auto !important;
}

.header-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}

.logo-title-container {
    display: flex;
    align-items: center;
    margin-right: 20px;
}

.site-logo {
    margin-right: 15px;
}

.site-logo img {
    max-height: 60px;
    width: auto;
}

.site-title {
    display: flex;
    flex-direction: column;
    color: white;
    font-size: large;
    line-height: 1.3;
}

.nav-container {
    display: flex;
    align-items: center;
}

.header-info-col {
    display: flex;
    align-items: center;
    margin-right: 20px;
    color: white;
}

.header-info-col i {
    margin-right: 5px;
}

/* Move the carousel slightly below */
.hero-area {
    padding-top: 70px;  /* Adjust the value to move it further down */
}

/* Adjust the height of the carousel */
@media (max-width: 768px) {.hero-slider1 {
    height: 350px;  /* Adjust this value to change the height of the carousel */

}
/* Ensure the text inside the carousel is centered properly */
.flex-caption-text {
    text-align: center;
    color: white; /* Adjust text color if needed */
}
}

/* Responsive adjustments */
@media (max-width: 991px) {
    .header-container {
        flex-direction: column;
        align-items: flex-start;
    }
    
    .logo-title-container {
        margin-bottom: 15px;
        width: 100%;
        justify-content: center;
    }
    
    .nav-container {
        width: 100%;
        justify-content: center;
    }
    
    .sf-menu.dd-menu {
        float: none !important;
        display: flex;
        justify-content: center;
        margin-top: 10px;
    }
}

@media (max-width: 767px) {
    .sf-menu.dd-menu {
        display: none;
    }
    
    #menu-toggle {
        display: block;
        position: absolute;
        right: 15px;
        top: 15px;
    }
}