/* ----------------------------------------------------------------
	Custom CSS

	Add all your Custom Styled CSS here for New Styles or
	Overwriting Default Theme Styles for Better Handling Updates
-----------------------------------------------------------------*/

/* Custom styles for the navigation background */
#header-wrap {
    background-color: #333; /* Change to your desired color */
}

/* Adjust font size for the main menu items */
.primary-menu .menu-container .menu-item .menu-link {
    font-size: 11px; /* Adjust to your preferred size */
	font-weight: 500;
}

/* Change the mouse-over color for the main menu items */
.primary-menu .menu-container .menu-item .menu-link:hover,
.primary-menu .menu-container .menu-item .menu-link:focus,
.primary-menu .menu-container .menu-item .menu-link:active {
    color: #ff6600; /* Change to your desired color */
}

/* Set the active page menu item to the same color as the mouse-over */
.primary-menu .menu-container .menu-item.current .menu-link,
.primary-menu .menu-container .menu-item .menu-link.active {
    color: #ff6600; /* Change to your desired color */
}
.slider-image {
    margin-right: 200px; /* Adjust the space between the image and text */
    max-width: 900px; /* Adjust the size of the image */
}
.glow-text {
    color: #FCC534; /* Your text color */
    text-shadow: 
        0 0 5px #383429,  /* First layer of shadow */
        0 0 10px #383429, /* Second layer of shadow */
        0 0 15px #383429, /* Third layer of shadow */
        0 0 20px #383429, /* Fourth layer of shadow, a bit brighter */
        0 0 25px #383429, /* Fifth layer of shadow, even brighter */
        0 0 30px #383429; /* Sixth layer of shadow, brightest */
}


.text-center {
    text-align: center;
}

.col-md-5 img {
    display: block;
    margin: 0 auto;
}

/* Slider Media query code to adjust slider for mobile devices */

@media (max-width: 768px) {
    .slider-caption p {
        font-size: 18px !important; /* Adjust font sizes for smaller screens */
        text-align: center; /* Center-align text */
    }
    .slider-caption h2 {
        font-size: 28px !important; /* Smaller headline */
        text-align: center; /* Center-align headline */
    }
    .slider-caption {
        padding: 20px; /* Add some padding for better readability */
    }
}

@media (max-width: 576px) {
    .slider-caption p {
        font-size: 16px !important; /* Further reduce font size for smaller devices */
        text-align: center; /* Ensure text is centered */
    }
    .slider-caption h2 {
        font-size: 20px !important; /* Adjust headline size */
        text-align: center; /* Center-align headline */
    }
    .slider-caption {
        padding: 15px; /* Increase padding for readability */
    }
}