.service_container {
    display: flex;
    flex-flow: row wrap;
    justify-content: start;
    margin: 2rem auto;
}

.service_container_box {
    width: 18%;
    height: 30vh;
    margin: 1%;
    box-shadow: 2px 2px 5px gray;
}

.service_container_box_top {
    width: 100%;
    height: 65%;
}

.service_container_box_top img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    aspect-ratio: 1/1;
}

.service_container_box_bottom {
    width: 100%;
    height: 35%;
    position: relative;
}

.service_container_box_bottom h4,
.service_container_box_bottom h5 {
    margin: 0.5rem;
}

.service_container_box_bottom h5 {
    display: flex;
    align-items: last baseline;
}

.large_alpha {
    font-size: 4rem;
    display: inline-block;
}

.large_alphabet {
    font-size: 3rem;
    height: 40px;
}

.rest_sent {
    font-size: 1.5rem;
    position: absolute;
    top: 10%;
    margin-left: 3px;
}

.rest_sentence {
    font-size: 1.02rem;
    position: absolute;
    top: 10%;
    margin-left: 3px;
}

.rest_sentence_1 {
    font-size: 1.02rem;
    margin-left: 3px;
    height: 20px;
}

@media (max-width:480px) {
    .service_container_box {
        width: 100%;
        height: 30vh;
        margin: 3%;
        box-shadow: 2px 2px 5px gray;
    }
}

@media (min-width:480px) and (max-width:560px) {
    .service_container_box {
        width: 100%;
        height: 30vh;
        margin: 3%;
        box-shadow: 2px 2px 5px gray;
    }
}

@media (min-width:560px) and (max-width:768px) {
    .service_container_box {
        width: 44%;
        height: 30vh;
        margin: 3%;
        box-shadow: 2px 2px 5px gray;
    }

    .rest_sentence_1 {
        font-size: 0.85rem;
        margin-left: 3px;
        height: 20px;
    }
}

@media (min-width:768px) and (max-width:850px) {
    .service_container_box {
        width: 44%;
        height: 30vh;
        margin: 3%;
        box-shadow: 2px 2px 5px gray;
    }

    .rest_sentence_1 {
        font-size: 0.85rem;
        margin-left: 3px;
        height: 20px;
    }
}

@media (min-width:850px) and (max-width:992px) {
    .service_container_box {
        width: 27%;
        height: 30vh;
        margin: 3%;
        box-shadow: 2px 2px 5px gray;
    }

    .rest_sentence_1 {
        font-size: 0.8rem;
        margin-left: 3px;
        height: 20px;
    }
}

@media (min-width:992px) and (max-width:1200px) {
    .service_container_box {
        width: 21%;
        height: 30vh;
        margin: 2%;
        box-shadow: 2px 2px 5px gray;
    }

    .rest_sentence_1 {
        font-size: 0.8rem;
        margin-left: 3px;
        height: 20px;
    }
}

@media (min-width:1200px) and (max-width:1400px) {
    .rest_sentence_1 {
        font-size: 0.8rem;
        margin-left: 3px;
        height: 20px;
    }
}

@media (min-width:1400px) {
    .rest_sentence_1 {
        font-size: 0.8rem;
        margin-left: 3px;
        height: 20px;
    }
}

.expert-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
}

.service-box {
    width: 23%;
    padding: 10px;
    margin: 15px;
    border-radius: 10px;
    box-shadow: 2px 2px 5px gray;
}

.service-photo {
    width: 100%;
    height: auto;
}

.service-photo img {
    width: 100%;
    height: auto;
    aspect-ratio: 1/1;
}

.service-description {
    overflow: hidden;
    max-height: 110px;
    transition: max-height 0.3s ease;
    text-align: center;
}

.service-description p {
    font-size: 0.9rem;
}

.service-description h6 {
    font-size: 0.85rem !important;
    font-weight: 700 !important;
}

.service-box .show-more-btn {
    cursor: pointer;
    color: #0177b6;
    display: block;
    margin-top: 10px;
    font-size: 0.85rem;
    font-weight: 700;
    text-align: center;
}

@media(max-width: 480px) {
    .service-box {
        width: 100%;
        padding: 10px;
        margin: 10px;
        border-radius: 10px;
        box-shadow: 2px 2px 5px gray;
    }
}

@media(min-width: 480px) and (max-width:560px) {
    .service-box {
        width: 100%;
        padding: 10px;
        margin: 20px;
        border-radius: 10px;
        box-shadow: 2px 2px 5px gray;
    }
}

@media(min-width: 560px) and (max-width:768px) {
    .service-box {
        width: 45%;
        padding: 10px;
        margin: 2.5%;
        border-radius: 10px;
        box-shadow: 2px 2px 5px gray;
    }

    .service-description {
        overflow: hidden;
        max-height: 146px;
        transition: max-height 0.3s ease;
        text-align: center;
    }
}

@media(min-width: 768px) and (max-width:992px) {
    .service-box {
        width: 45%;
        padding: 10px;
        margin: 2.5%;
        border-radius: 10px;
        box-shadow: 2px 2px 5px gray;
    }
}

@media(min-width: 992px) and (max-width:1200px) {
    .service-box {
        width: 30%;
        padding: 10px;
        margin: 1.65%;
        border-radius: 10px;
        box-shadow: 2px 2px 5px gray;
    }
}

@media(min-width: 1200px) and (max-width:1400px) {
    .service-box {
        width: 23%;
        padding: 10px;
        margin: 1%;
        border-radius: 10px;
        box-shadow: 2px 2px 5px gray;
    }
}

@media(min-width: 1400px) and (max-width:1600px) {
    .service-box {
        width: 24%;
        padding: 10px;
        margin: 0.5%;
        border-radius: 5px;
        box-shadow: 2px 2px 5px gray;
    }

    .service-description {
        overflow: hidden;
        max-height: 148px;
        transition: max-height 0.3s ease;
        text-align: center;
    }
}

@media(min-width: 1600px) and (max-width:1800px) {
    .service-box {
        width: 22%;
        padding: 10px;
        margin: 1.5%;
        border-radius: 5px;
        box-shadow: 2px 2px 5px gray;
    }

    .service-description {
        overflow: hidden;
        max-height: 148px;
        transition: max-height 0.3s ease;
        text-align: center;
    }
}