.sp-slider .slick-prev{ left: 0 !important;}
.sp-slider .slick-next{ right: 0!important;}
.sp-slider .slick-slide {
    position: relative;
}
.mSlider .slick-prev {
    left: -45px;
}
.mSlider .slick-arrow {
    right: -45px !important;
}
.mSlider,.sp-slider{
    opacity: 0;
    visibility: hidden;
    transition: opacity 1s ease;
    -webkit-transition: opacity 1s ease;
}

.mSlider.slick-initialized, .sp-slider.slick-initialized{
    visibility: visible;
    opacity: 1;
}

.sp-text{
    position: absolute;
    top: 30%;
    left: 1%;
    color: white;
    font-size: 32px;
    text-transform: uppercase;
    width: 50%;
}
.sp-text span {
    background-color: #f00;
    padding: 5px;
    border-radius: 8px;
}
/*.sp-text-1{
    background-color: #f00;
    color: white;
    font-size: 16px;
    padding: 10px 15px 10px 15px;
}
.sp-text-1 span span{
    font-size: 22px;
    text-transform: uppercase;
}*/
.sp-text-1 {
    background-color: #ff0000; /* Bright red-orange for better visibility */
    color: white;
    font-size: 18px;
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2); /* Add a subtle shadow */
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 15px;
    animation: fadeIn 1s ease-in-out;
}
.sp-text-1 span span {
    font-size: 22px;
    text-transform: uppercase;
    font-weight: bold; /* Make the text more eye-catching */
}
.sp-text-1 span .highlight {
    color: yellow; /* Highlight specific text */
    margin-right: 5px;
    font-weight: bold;
    animation: blink 1s infinite;
}
.sp-text-1 .btn-primary {
    font-size: 18px;
    font-weight: bold;
    border: none;
    padding: 10px 20px;
    border-radius: 5px;
    transition: all 0.3s ease; /* Smooth hover effect */
}
.sp-text-1 .btn-primary:hover {
    transform: scale(1.1); /* Slight zoom effect */
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2); /* Add shadow on hover */
}
.bn-border{
    box-shadow: 0px 0px 4px 1px #192f92;
    border: 2px solid #192f92;
}

/* Add Fade-in Animation */
@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
.txt-slider .slick-prev, .slick-next{
    top: 40%;
}
.txt-slider button.slick-next.slick-arrow{
    right: -26px !important;
}
.txt-slider button.slick-prev.slick-arrow{
    left: -26px !important;
}

@keyframes blink {
    0%, 100% {
        opacity: 1; /* Fully visible */
    }
    50% {
        opacity: 0; /* Fully transparent */
    }
}
