.image-animation {
    max-width: 100%;
    position: relative;
    width: 100%;
}

.image-sec {
    display: grid;
    grid-gap: 40px;

    margin: 0;
    grid-auto-flow: column;
    place-content: center;
}

.image-sec img {
    --color: #78A540;
    /* the border color */
    --border: 10px;
    /* the border thickness*/
    --offset: 20px;
    /* control the offset*/
    --gap: 5px;
    /* the gap on hover */

    --_c: var(--color) var(--border), #0000 0 calc(100% - var(--border)), var(--color) 0;
    --_o: calc(3*var(--offset));
    padding:
        calc(var(--gap) + var(--border)) calc(var(--gap) + var(--border) + var(--offset)) calc(var(--gap) + var(--border) + var(--offset)) calc(var(--gap) + var(--border));
    background:
        linear-gradient(var(--_c)) var(--_o) var(--_o),
        linear-gradient(90deg, var(--_c)) var(--_o) var(--_o);
    background-size: calc(100% - var(--_o)) calc(100% - var(--_o));
    background-repeat: no-repeat;
    filter: grayscale(.4);
    transition: .5s;
    cursor: pointer;

}

.image-sec img:hover {
    background-position: 0px 0px;
    background-size: calc(100% - var(--offset)) calc(100% - var(--offset));
    filter: grayscale(0);
}


.news {
    background: rgba(0, 0, 0, 45%)url(assets/images/homeimg3.webp) no-repeat;
    background-size: cover;
    background-position: center;
    margin-top: 2rem;
    background-blend-mode: darken;
}

.news form {
    max-width: 45rem;
    margin: auto;
    text-align: center;
    padding: 4rem 0 8rem 0;
}

.news form h3 {
    font-size: 2rem;
    color: #fff;
    padding-bottom: 3rem;
    font-weight: bold;
}

.news form p {
    color: #E1D8D8;
    font-size: 1.4rem;
    padding: 1rem 0 3rem 0;
}


.reviews {
    padding: 5rem 9%;

}


.reviews .review-slider .box {
    border: .2rem solid #9ec799;
    padding: 1rem;
    text-align: center;
}

.reviews .review-slider .box:hover {
    border: .1rem solid #e9f0e9;
}

.reviews .review-slider .box img {
    height: 7rem;
    width: 7rem;
    border-radius: 50%;
    object-fit: cover;
}

.reviews .review-slider .box h3 {
    color: #ded1ce;
    font-size: 1.8rem;
    padding: .5rem 0;
}

.reviews .review-slider .box p {
    color: #ded1ce;
    font-size: 1rem;
    padding: .5rem 0;
    line-height: 1.4;
}