.bg-black-section {
    --theme-btn-blue-bg: #57b846;
    --theme-btn-blue-color: #FFFFFF
}

header.redesign23 .btn-blue {
    background: #57b846;
    color: #FFFFFF
}

.s-chessboard__board-head {
    color: white;
}

.s-chessboard__description.active {
    color: darkblue;
    font-weight: bold;
}

.s-hero__container {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

.s-hero__content, .s-hero__media {
    flex: 1 1 50%;
    padding: 10px;
}

.s-hero__media {
    transition: flex-basis 0.5s ease;
}

@media (max-width: 800px) {
    .s-hero__media {
        flex: 1 1 30%;
    }
}

@media (max-width: 600px) {
    .s-hero__media {
        flex: 0 0 0%;
        overflow: hidden;
    }
}

/* FAQ */
/*.el-text {*/
/*    display: none;*/
/*}*/
/*.s-features__item {*/
/*    cursor: pointer;*/
/*}*/

.home-slider {
    position: relative;
    width: 100%;
    overflow: hidden;
    font-size: var(--H2-font-size);
    height: 50px;  /* Adjust the height based on your content */
}

.slider-item {
    position: absolute;
    white-space: nowrap;
    width: auto;
    left: 100%; /* Start offscreen to the right */
    animation: slideIn 12s linear infinite; /* Total duration matches with the delay pattern */
}

.text-slider {
    position: relative;
    width: 100%;
    overflow: hidden;
    font-size: var(--H2-font-size);
    height: 6rem;
    white-space: nowrap;
}

.text-track {
    position: absolute;
    white-space: nowrap;
    display: block;
    animation: scrollText 20s linear infinite;
}

@keyframes scrollText {
    from { transform: translateX(100%); }
    to { transform: translateX(-100%); }
}

.text-content {
    display: inline-block;
    padding-left: 100%;  /* Ensures there is a gap before text repeats */
}

@keyframes slideIn {
    0%, 100% { left: 100%; }     /* Reset to right side offscreen */
    25% { left: 10%; }          /* Move into view */
    50% { left: 10%; }          /* Stay in view */
    75% { left: -100%; }        /* Slide out to the left */
}

.contact, .contact a {
    color: #013CA4;
    text-align: justify;
    font-size: 22px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    text-decoration: none;
}

/* Modal styles */
.modal {
    font-family: inherit;
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1000; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%;
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content */
.modal-content {
    color: rgb(26, 37, 42); /* New text color */
    margin: 1% auto; /* Centered vertically with 1% margin */
    padding: 10px;
    border: none; /* Removing border */
    width: 550px; /* Fixed width for the form */
    box-shadow: 0 5px 15px rgba(0,0,0,0.5); /* Optional: adding some shadow for better visibility */
}

.demo-form {
    background-color: rgb(236, 237, 229); /* Light background color */
    color: rgb(26, 37, 42); /* New text color */
    padding: 20px;
    border: none; /* Removing border */
}

/* Close Button */
.close {
    color: rgb(26, 37, 42);
    float: right;
    font-size: 28px;
    font-weight: bold;
}

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

/* Input and Select styles */
input[type="text"],
input[type="email"],
input[type="tel"],
textarea,
select {
    width: 100%;
    padding: 8px;
    margin-top: 8px;
    margin-bottom: 16px;
    display: inline-block;
    background: none;
    border: none; /* No border */
    border-bottom: 1px solid rgb(169, 183, 189); /* Bottom border only */
    color: rgb(26, 37, 42); /* Text color for input */
    box-sizing: border-box;
    box-shadow: none;
}

.s-testimonial__media {
    display: flex;
    justify-content: center;
    align-items: center;
}

.s-testimonial__media picture {
    max-width: 75%;
    height: auto;
}

/* Enhance focus visibility */
input:focus,
textarea:focus,
select:focus {
    outline: none;
    border-bottom: 2px solid rgb(100, 149, 237); /* Change color on focus */
}

/* Placeholder styles to make them a lighter but still visible */
::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: rgb(90, 101, 106); /* Lighter shade of text color */
    opacity: 1; /* Full opacity to maintain color integrity */
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: rgb(90, 101, 106);
}

::-ms-input-placeholder { /* Microsoft Edge */
    color: rgb(90, 101, 106);
}

.footer.redesign23 .row {
    margin-left: revert;
    position: relative;
    margin-top: 9px;
    padding-left: 8.5rem;
}

@media screen and (max-width:1024px){
    .footer.redesign23 .row {
        padding-left: revert;
    }
}