#full-year {
    color: #999;
    margin: 0px;
}

@media only screen and (max-width: 767px) {
    .landing-img {
        position: relative;  /* This is important for the overlay positioning */
        background-image: url(../img/slider/21.png) !important;
    }
    
    .landing-img::before {
        content: "";         /* Necessary for the pseudo-element to show */
        position: absolute;  /* Absolute positioning relative to .bg-img */
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        /*background: linear-gradient(to top, white, rgba(255, 255, 255, .92) 40%); */
        background-color: #1e1e1e;
        opacity: 0.2;       /* Adjust this value to control the overlay transparency */
        pointer-events: none;  /* Ensures the overlay doesn't interfere with interactions */
        z-index: 1;         /* Ensures the overlay is above the background image */
    }
}

@media (min-width: 1200px){
    .container-nav {
        max-width: 100% !important;
        margin-left:40px !important;
        margin-right:40px !important;
    }
}

@media (min-width: 2000px){
    .container-nav {
        max-width: 1640px !important;
        margin:0 auto !important;
    }
}

@media only screen and (max-width: 599px) {
    .services .owl-carousel .owl-item {
        display: flex !important;
        justify-content: center;
        align-items: center;
        width: 100% !important;
    }
}

@media only screen and (max-width: 599px) {
    .services .owl-carousel .owl-item .item {
        width: 90%; /* or whatever width you prefer */
        margin: 0 auto;
    }
    .services .owl-stage, .projects .owl-stage {
        width: 100% !important;
    }
}

.animate-delay-1 {
    animation-delay: .4s !important;
}

.animate-delay-2 {
    animation-delay: .6s !important;
}

.animate-delay-3 {
    animation-delay: .7s !important;
}

.animate-delay-4 {
    animation-delay: .8s !important;
}

.animate-delay-5 {
    animation-delay: 1s !important;
}

.animate-delay-6 {
    animation-delay: 1.4s !important;
}

.animate-delay-7 {
    animation-delay: 1.6s !important;
}

.animate-delay-8 {
    animation-delay: 1.8s !important;
}

.team-details .content .info-list li:nth-last-child(1),
.team-details .content .info-list li:nth-last-child(2),
.team-details .content .info-list li:nth-last-child(3) {
    width: 100%;
}

.accent-color {
    color: #b19777 !important;
}

.admin-accent-color {
    color: #d5780e !important;
}

.select-wrapper {
    position: relative;
    max-width: 100%;
}

select, input[type="date"] {
    max-width: 100%;
    margin-bottom: 10px;
    padding: 10px 30px 10px 10px; /* Right padding to make room for the arrow */
    height: auto;
    background-color: transparent;
    -webkit-box-shadow: none;
    box-shadow: none;
    border: 1px solid #999; /* Border all around */
    display: block;
    width: 100%;
    line-height: 1.5em;
    font-family: 'Didact Gothic', sans-serif;
    font-size: 15px;
    font-weight: 400;
    color: #999;
    appearance: none; /* Remove default browser styling */
}

.select-wrapper::after {
    content: "\f0d7";
    font-family: 'FontAwesome';
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    font-size: 12px;
    pointer-events: none; /* Make sure this arrow doesn't interfere with select element functionality */
    color: #999;
}

select:focus {
    border-color: #b19777;
}

@media (max-width:992px){.desktop{display:none!important}}
@media (min-width:992px){.mobile{display:none!important}}

.nav-item.dropdown:hover .dropdown-menu {
    display: block;
}

@media (max-width: 991px){
    .v-middle {
        top: 53% !important;
    }
}

.apply-button {
    float: right;
    top: 10px;
}

@media (max-width: 991px){
    .apply-button {
        float: none;
        top: 10px;
        margin: 0 auto;
    }
}

.ready-button, .ready-text {
    float: right !important;
}

@media (max-width: 991px){
    .ready-button, .ready-text {
        float: none !important;
    }
}

.modal, .cta-modal {
    display: none;
    position: fixed;
    z-index: 1;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(0,0,0,0.4);
}

.modal-content {
    background-color: #fefefe;
    margin: 15% auto;
    padding: 20px;
    border: 1px solid #888;
    width: 20%;
}

@media (max-width: 991px){
    .modal-content {
        width: 90%;
    }
}

.close {
    color: #aaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
}

.close:hover,
.close:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
}

#confirmDelete, #cancelDelete {
    padding: 10px 20px;
    margin: 10px;
    cursor: pointer;
}

.button-flex-container {
    display: flex;
    justify-content: center;
    align-items: center;

    align-items: flex-start; /* Align items to the start of the container along the cross axis */
    flex-direction: row; /* This is default and may not need to be explicitly set */

    gap: 50px; /* Adjust the gap between buttons as needed */
}

.button-paragraph {
    text-align: center; /* Center align the text and button */
}

.button-paragraph p {
    max-width: 400px;
    font-size: 20px !important;
}

.button-paragraph a {
    width: 300px !important;
}

@media only screen and (max-width: 767px) { /* Adjust this breakpoint as needed */
    .button-flex-container {
        flex-direction: column;
        gap: 20px;
    }
    .button-paragraph p {
        max-width: 100%;
        font-size: 16px !important;
    }
}

@media screen and (max-width: 767px) {
    .header {
        overflow: visible;
        min-height: 150vh;
    }
    .v-middle {
        top: 87% !important;
    }
}

@media screen and (max-width: 767px) {
    .about-candidate {
        top: 48% !important;
    }
}

.mainImage {
    width: 100%; /* Makes the image responsive */
    object-fit: contain; /* Maintains aspect ratio within the given dimensions */
    display: block; /* Ensures the image does not have extra space below it */
}

.clickable-image {
    cursor: pointer; /* Indicates that images are clickable */
    transition: opacity 0.3s ease; /* Smooth transition for any opacity changes */
}


.clickable-image:not(.active) {
    opacity: 0.3; /* Dim non-active images for better visual feedback */
}

.staff-images {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: center;
    align-items: center;
}

form .accent-color, .project-page .accent-color, .project-bar a {
    color: #b19777 !important;
}

.team-details .list-description {
    color: #1e1e1e;
}

.team-details .list-description a {
    color: #b19777;
}

.green-accent {
    color: #00b074;
  }

.red-accent {
    color: #f71e3f;
}

.mw--20 {
    width: 20px !important;
}

.black-accent {
    color: #1e1e1e !important;
}

.no-upper-case {
    text-transform: none !important;
}

.division-services .position-category {
    flex-basis: 60% !important;
}

.division-services .position-title {
    flex-basis: 26% !important;
}

.division-services .position-icon {
    width: 70px;              /* Fixed width */
    height: 70px;             /* Fixed height to make it square */
    display: flex;            /* Flex to center the image (if needed) */
    justify-content: center;  /* Center content horizontally */
    align-items: center;      /* Center content vertically */
    overflow: hidden;         /* Hide parts of the image that overflow the container */
}

.division-services .position-icon img {
    min-width: 100%;          /* Minimum width at 100% of container */
    min-height: 100%;         /* Minimum height at 100% of container */
    width: auto;              /* Auto width for scaling */
    height: auto;             /* Auto height for scaling */
    max-width: none;          /* Override any max-width */
    object-fit: cover;        /* Cover the container without stretching */
    object-position: center;  /* Center the focus point of the image */
}

#selection-button {
    position: fixed !important;
    right: 0px;
    padding-left: 0px;
    padding-right: 0px;
    z-index: 98;  /* Make sure this is below the navbar's z-index when scrolled */
}

#selection-button.navbar-scrolled {
    top: 90px;  /* Height when navbar is scrolled */
}

#selection-button.navbar-top {
    top: 100px;  /* Initial height of the navbar */
}

#selection-button a {
    width: 100%;
    float: right;
    align-items: center;
}

@media (max-width: 767px) {
    #selection-button a {
        font-size: 15px;
    }
    
}

.color-dark-gray {
    color: #1e1e1e !important;
}

.color-white {
    color: #bebebe !important;
}


#start-date {
    padding-right: 0; /* Removes any right padding that might push the icon inward */
    position: relative; /* Helps with absolute positioning of the icon if needed */
}

#start-date::-webkit-calendar-picker-indicator {
    filter: invert(1);
    opacity: 0.5;
    position: absolute;
    right: 0; /* Pins it to the far right */
    margin: 0; /* Removes any default margins */
    padding: 8px; /* Removes any default padding */
}

.v-middle.caption {
    z-index: 1; /* Higher than overlay and video */
    color: #fff; /* Ensure text is visible against dark overlay */
}