div#slider-animation.carousel.slide { margin-bottom:15px; margin-top:0; }

div#slider-animation.carousel.slide .bs-slider-overlay {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}

/*---------- LEFT/RIGHT ROUND CONTROL ----------*/
div#slider-animation.carousel.slide {}
div#slider-animation.carousel.slide .carousel-control-prev{left:60px;}

div#slider-animation.carousel.slide .carousel-control-next{right:60px;}

div#slider-animation.carousel.slide .carousel-control-next, div#slider-animation.carousel.slide .carousel-control-prev {position:absolute; top:45%; bottom:0; z-index:1; display:-ms-flexbox; display:flex; -ms-flex-align:center; align-items:center; -ms-flex-pack:center; justify-content:center; width:60px; height:60px; line-height:60px; color: #000; font-size:15px; text-align:center; opacity:.6; transition:opacity .15s ease; background: #fff; border-radius:var(--border-radius-50);  box-shadow: 0 3px 6px rgb(0 0 0 / 16%), 0 3px 6px rgb(0 0 0 / 23%); /*opacity: .8;*/}

div#slider-animation.carousel.slide .carousel-control-next:focus, div#slider-animation.carousel.slide .carousel-control-next:hover, div#slider-animation.carousel.slide .carousel-control-prev:focus, div#slider-animation.carousel.slide .carousel-control-prev:hover{ color: white; text-decoration:none; outline:0; opacity:1; background: #4d0d0d; box-shadow: 0 3px 6px rgb(0 0 0 / 16%), 0 3px 6px rgb(0 0 0 / 23%);}
/*---------- LEFT/RIGHT ROUND CONTROL ----------*/

div#slider-animation.carousel.slide .carousel-indicators{position:absolute; right:0; bottom:0; left:0; z-index:15; display:-ms-flexbox; display:flex; -ms-flex-pack:center; justify-content:center; padding-left:0; margin-right:15%; margin-left:15%; list-style:none;}
div#slider-animation.carousel.slide .carousel-indicators li{ box-sizing:content-box; -ms-flex:0 1 auto; flex:0 1 auto; width:30px; height:3px; margin-right:3px; margin-left:3px; text-indent:-999px; cursor:pointer; background-color:var(--white-color); background-clip:padding-box; border-top:10px solid transparent; border-bottom:10px solid transparent; opacity:1; transition:opacity .6s ease;}
div#slider-animation.carousel.slide .carousel-indicators .active { box-sizing:content-box; -ms-flex:0 1 auto; flex:0 1 auto; width:30px; height:3px; margin-right:3px; margin-left:3px; text-indent:-999px; cursor:pointer; background-color:var(--primary-color); background-clip:padding-box; border-top:10px solid transparent; border-bottom:30px solid transparent; opacity:1;transition:opacity .6s ease;}

/*----- SLIDER TEXT -----*/
.text-box {position: absolute; top: 45%; left: 0; right: 0; text-align: -webkit-center; text-align: center;  transform: translateY(-50%); font-family:'jost'; }

.text-box > h1 { background:none; padding: 0; margin:0 0 15px 0; color:var(--primary-color); font-size:54px; font-style: normal; line-height:60px; display: inline-block; -webkit-animation-delay:0.3s; animation-delay: 0.3s; position: relative; font-family:'jost'}

.text-box > a.btn-default{ font-size:16px; font-weight:var(--font-weight-600); text-transform: capitalize; padding:15px 35px; line-height:30px; color: white; background: #E73D12; letter-spacing:var(--letter-spacing-1); margin-top:15px; margin-bottom:0; margin-left:0; margin-right:0; border: none; -webkit-animation-delay:0.5s; animation-delay: 0.5s; border-radius:var(--border-radius);}
.text-box > a.btn-default:hover, .text-box > a.btn-default:active {background:var(--third-color); color:var(--white-color); }
/*----- SLIDER TEXT -----*/


@media only screen and ( min-width: 1299px) and (max-width: 2399px) {

}


@media only screen and ( min-width: 768px) and ( max-width: 980px ) {

/*---------- LEFT/RIGHT ROUND CONTROL ----------*/
div#slider-animation.carousel.slide .carousel-control-prev{left:30px;}

div#slider-animation.carousel.slide .carousel-control-next{right:30px;}

div#slider-animation.carousel.slide .carousel-control-next, div#slider-animation.carousel.slide .carousel-control-prev {
width:50px; height:50px; line-height:50px; font-size:13px;}
/*---------- LEFT/RIGHT ROUND CONTROL ----------*/

/*----- SLIDER TEXT -----*/
.text-box {left:10%; width:70%;}
.text-box > h1 {font-size:50px; line-height:55px;}
.text-box > a.btn-default{ font-size:15px; padding:15px 30px; line-height:30px;}
/*----- SLIDER TEXT -----*/

}


@media only screen and ( min-width: 600px) and ( max-width: 765px ) {

/*---------- LEFT/RIGHT ROUND CONTROL ----------*/
div#slider-animation.carousel.slide .carousel-control-prev{left:30px;}

div#slider-animation.carousel.slide .carousel-control-next{right:30px;}

div#slider-animation.carousel.slide .carousel-control-next, div#slider-animation.carousel.slide .carousel-control-prev {
width:50px; height:50px; line-height:50px; font-size:14px;}
/*---------- LEFT/RIGHT ROUND CONTROL ----------*/

/*----- SLIDER TEXT -----*/
.text-box {left:10%; width:75%;}
.text-box > h1 {font-size:30px; line-height:35px;}
.text-box > a.btn-default{ font-size:14px; padding:15px 25px; line-height:20px;}
/*----- SLIDER TEXT -----*/

}


@media only screen and ( min-width: 481px) and ( max-width: 599px ) {

/*---------- LEFT/RIGHT ROUND CONTROL ----------*/
div#slider-animation.carousel.slide .carousel-control-prev{left:15px;}

div#slider-animation.carousel.slide .carousel-control-next{right:15px;}

div#slider-animation.carousel.slide .carousel-control-next, div#slider-animation.carousel.slide .carousel-control-prev {
width:40px; height:40px; line-height:40px; font-size:12px;}
/*---------- LEFT/RIGHT ROUND CONTROL ----------*/

/*----- SLIDER TEXT -----*/
.text-box {left:5%; width:90%;}
.text-box > h1 {font-size:20px; line-height:25px;}
.text-box > a.btn-default{ font-size:13px; padding:10px 20px; line-height:25px; margin-top: 0;}
/*----- SLIDER TEXT -----*/

}


@media only screen and ( min-width: 320px) and ( max-width: 480px ) {

/*---------- LEFT/RIGHT ROUND CONTROL ----------*/
div#slider-animation.carousel.slide .carousel-control-prev{left:15px;}

div#slider-animation.carousel.slide .carousel-control-next{right:15px;}

div#slider-animation.carousel.slide .carousel-control-next, div#slider-animation.carousel.slide .carousel-control-prev {
width:30px; height:30px; line-height:30px; font-size:11px;}
/*---------- LEFT/RIGHT ROUND CONTROL ----------*/

/*----- SLIDER TEXT -----*/
.text-box {left:5%; width:90%;}
.text-box > h1 {font-size:20px; line-height:25px;}
.text-box > a.btn-default{ font-size:13px; padding:7px 8px; line-height:19px; margin-top: 0;}
/*----- SLIDER TEXT -----*/

}


.features {
    display: flex;
    justify-content: center;
    gap: 67px;
    /*margin-top: -170px;*/
    position: relative;
}

.feature-box {
    background: white;
    padding: 20px;
    width: 342px;
    margin-top: -97px;
    text-align: center;
    border-radius: 15px;
    box-shadow: 0 10px 10px rgba(0, 0, 0, 0.1);
    transition: 0.3s ease-in-out;
}

.feature-box.dark {
    background: #4D0B04;
    color: white;
}

.feature-box .icon {
    font-size: 30px;
    color: #E73D12;
    margin-bottom: 10px;
}

.feature-box.dark .icon {
    color: white;
}

.feature-box h3 {
    font-size: 18px;
    color: #E73D12;
    font-family: 'jost';
    margin-top: 15px;
}

.feature-box.dark h3 {
    color: white;
    font-family: 'jost';
}

.feature-box p {
    font-size: 14px;
    color: #555;
    font-family: 'jost';
}

.feature-box.dark p {
    color: #ddd;
}

.feature-box:hover {
    transform: translateY(-5px);
}

/* Responsive Feature Box */
@media (max-width: 767px) {
    .features {
        flex-direction: column;
        align-items: center;
        gap: 20px; /* Reduce gap for better spacing */
    }

    .feature-box {
        width: 90%; /* Adjust width for responsiveness */
        max-width: 342px; /* Maintain max width */
        margin-top: 0; /* Reset margin */
    }
}

