﻿.header-slogan {
    /*position: relative;*/
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}
.breadcrumb-title {
    margin-bottom: 10px;
    color: #086AD8;
}

.slide {
    position: absolute;
    opacity: 0;
    padding-bottom: 20px;
    text-align: center;
    transition: opacity 0.7s ease-in-out;
}

.slide.active {
    opacity: 1;
}

.slide h2 {
    font-size: 2em;
}
/* Responsive adjustments */
@media (max-width: 768px) {
    .header-slogan {
        height: 30vh;
    }
    .breadcrumb-title {
        margin-bottom: 95px;
    }
    .slide h2 {
        font-size: 1.6em;
    }

}

@media (max-width: 480px) {
    .header-slogan {
        height: 25vh;
        min-height: 200px;
    }
    .breadcrumb-title {
        margin-bottom: 95px;
    }
    .slide h2 {
        font-size: 1.3em;
    }
}

.testimonials {
    width: 70px;
    height: 70px;
}
.word-rotator {
    text-shadow: 0 2px 6px rgba(0,0,0,0.55), 0 10px 24px rgba(0,0,0,0.4);
    font-size: 2.5rem;
    display: inline-block;
    position: relative;
    width: max-content;
    min-width: 280px;
    height: 1.4em;
    overflow: hidden;
    vertical-align: bottom;
    color: #0066cc;
}


    .word-rotator span {
        position: absolute;
        inset: 0;
        opacity: 0;
        transform: translateY(12px);
        transition: opacity 0.4s ease, transform 0.4s ease;
    }


        .word-rotator span.active {
            opacity: 1;
            transform: translateY(0);
        }


.container-flex {
    display: flex;
    justify-content: center; /* Centers horizontally */
    align-items: center; /* Centers vertically */
    height: 100%; /* Set a height for the div to demonstrate vertical centering */
}
.job-name {
    font-size: 20px;
    font-weight: 600;
    color: #086AD8;
}}