.feature-online {
    background: #FFF8F0;
    margin-bottom: 5%;
    padding: 5% 0%;
}

.feature-online .main-class-card {
    position: relative;
}

.feature-online .main-class-card .feature-bg-card {
    background: #FFFFFF;
    background: #FFFFFF;
    box-shadow: 0px 1px 6px #00000029;
    border-radius: 15px;
    padding: 12% 6% 0% 6%;
    height: 155px;
}

/* .feature-online .main-class-card:hover .feature-bg-card {
   border-top: 4px solid #FF8600;
} */
.feature-online .mySwiper {
    padding: 5% 0px;
}

/* .feature-online .swiper-wrapper {
    padding: 5%;
} */

.feature-online .main-class-card .feature-bg-card .feature-text {
    font-size: 16px;
    color: #000000B2;
    text-align: center;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    -webkit-line-clamp: 4;
}

.feature-online .main-class-card:hover .feature-bg-card .feature-text {
    text-decoration: underline;
}

.feature-online .main-class-card .feature-bg-card .graduate-cap-image .feature-img {
    width: 55px;
    height: 55px;
    position: absolute;
    top: -24px;
    left: 42%;
    background: #000000B2;
    box-shadow: 0px 0px 5px #00000029;
    border-radius: 50%;
    padding: 5px;
}

.feature-online .main-class-card:hover .feature-bg-card .graduate-cap-image .feature-img {
    background: #FF8600;
}

.feature-online .main-class-card .orange-border-bg {
    border-bottom: 4px solid #FFF8F0;
    margin: 0% 4% 0% 4%;
    transform: translate(-50%);
    border-bottom: 4px solid #FF8600;
    transition: width 0.5s ease-in-out;
    width: 0%;
    position: absolute;
    left: 46%;
}


.feature-online .main-class-card:hover .orange-border-bg {
    /* border-bottom: 4px solid #FF8600; */
    width: 95%;
}


@media(min-width:0px) and (max-width:576px) {
    .feature-online .main-class-card {
        margin-top: 13%;
    }

    .feature-online .main-class-card .feature-bg-card .feature-text {
        font-size: 14px;
    }
}

@media(min-width:577px) and (max-width:768px) {
    .feature-online .main-class-card {
        margin-top: 14%;
    }

    .feature-online .main-class-card .feature-bg-card .feature-text {
        font-size: 14px;
    }
}

@media(min-width:769px) and (max-width:992px) {
    .feature-online .main-class-card {
        margin-top: 9%;
    }

    .feature-online .main-class-card .feature-bg-card .feature-text {
        font-size: 16px;
    }
}

@media(min-width:992px) and (max-width:1200px) {
    .feature-online .main-class-card {
        margin-top: 9%;
    }
}