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

	Add all your Custom Styled CSS here for New Styles or
	Overwriting Default Theme Styles for Better Handling Updates
-----------------------------------------------------------------*/
@-webkit-keyframes fadeInUp {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, 70px, 0);
        transform: translate3d(0, 70px, 0);
    }
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, 70px, 0);
        transform: translate3d(0, 70px, 0);
    }
}

.font-secondary {
    font-family: "Merriweather", serif !important;
}

/* Add this to your CSS file */
.customer-logo {
    height: 100px;
    /* Set height for images */
    width: auto;
    /* Automatic width */
    max-width: 100%;
    /* Ensure the image doesn't overflow its container */
    object-fit: contain;
    /* Maintain aspect ratio */
}

.product-container {
    max-width: 150px;
    /* Set a fixed width for the container */
    margin-bottom: 10px;
    /* Add consistent spacing between products */
}

.entry-image img {
    max-width: 100%;
    /* Ensure image does not exceed container width */
    max-height: 100px;
    /* Constrain height to 100px */
    width: auto;
    /* Adjust width while maintaining aspect ratio */
    height: auto;
    /* Adjust height while maintaining aspect ratio */
    object-fit: contain;
    /* Ensure the image fits within the container */
}

@media (min-width: 768px) {
    .product-container {
        margin-bottom: 50px;
        /* Increase spacing on larger screens */
    }
}

.circle-icon {
    display: inline-block;
    width: 100px;
    height: 100px;
    background-color: #f5f5f5;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
}

.fa-4x {
    color: #333;
}

.entry-title {
    font-size: 20px;
}

#job-hiring {
    padding: 50px 0;
    background-color: #f9f9f9;
}

#job-hiring h2 {
    font-size: 2.5rem;
    margin-bottom: 20px;
    color: #333;
}

#job-hiring p {
    font-size: 1.1rem;
    color: #555;
}

#job-hiring ul {
    margin-bottom: 20px;
    list-style-type: disc;
    padding-left: 20px;
}

#job-hiring ul li {
    margin-bottom: 10px;
    font-size: 1rem;
    color: #555;
}

.job-poster {
    max-width: 100%;
    height: auto;
}

.btn-primary {
    background-color: #007bff;
    color: #fff;
    padding: 10px 20px;
    text-transform: uppercase;
    border: none;
    border-radius: 5px;
    font-size: 1rem;
}

.btn-primary:hover {
    background-color: #0056b3;
}

.carousel-control-prev-icon,
.carousel-control-next-icon {
    background-color: #000;
}

.carousel-container {
    max-height: 500px;
    overflow: hidden;
    margin-bottom: 20px;
}

.carousel-container img {
    cursor: pointer;
}

.carousel-inner img {
    width: 50%; /* Set the image width to 50% of its container */
    height: auto; /* Maintain the aspect ratio */
    max-width: 800px; /* Limit the width to a maximum of 500px */
    margin: 0 auto; /* Center the image horizontally in the carousel */
    display: block; /* Ensures the image behaves as a block element */
}

/* .carousel-inner img {
    width: 50%; 
    height: auto; 
    max-width: 500px;
} */

#carouselExampleIndicators .carousel-indicators button {
    width: 12px !important;
    height: 12px !important;
    border-radius: 50% !important;
    background-color: #000 !important;
    opacity: 0.5 !important;
    border: none !important;
}

#carouselExampleIndicators .carousel-indicators button.active {
    background-color: #4d6ef2 !important;
    opacity: 1 !important;
}

/* a {
	color: black;
	text-decoration: none;
	font-weight: normal;
}

a:hover {
	color: #000000;
	text-decoration: none;
} */