.merits {
    position: relative;
    top: -100px;
}

.merits-grid {
    max-width: 1100px;
    margin-left: auto;
    margin-right: auto;
    display: grid;
    grid-template-columns: 0.8fr 1fr;
    grid-template-rows: 400px;
    grid-gap: 20px;
    align-items: start
}

.merits-content {
    background: #182c20;
    padding: 20px;
    color: #FCFCFB;
}

.merits-content h4 {
    font-weight: 600;
    font-size: 1.125rem;
    margin-top: 10px;
    margin-bottom: 10px;
}

.merits-content a {
    margin-top: 20px;
    display: grid;
    max-width: max-content;
    padding: 10px;
    border-radius: 50%;
    background: #fcce01;
    transition: .3s;
}

.merits-items {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 20px;
    align-items: start
}

.merits-grid > figure, .merits-grid > figure img {
    height: 100%;
    object-fit: cover;
}

.merits-content a:hover {
    scale: 1.1;
}

@media only screen and (min-width: 650px) and (max-width: 1060px) {
    .merits-grid {
        grid-template-columns:1fr;
        max-width: 900px;
    }

    .merits-items {
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-gap: 20px;
        align-items: start
    }

    .merits-grid > figure img {
        margin-left: auto;
        margin-right: auto;
    }
}

@media only screen and (min-width: 501px) and (max-width: 649px) {
    .merits-grid {
        grid-template-columns:1fr;
        max-width: 900px;
    }

    .merits-items {
        grid-template-columns: 1fr;
        margin-left: 10px;
        margin-right: 10px;
    }

    .merits-grid > figure img {
        margin-left: auto;
        margin-right: auto;
    }
}

@media only screen and (max-width: 500px) {
    .merits-grid {
        grid-template-columns:1fr;
        max-width: 900px;
    }

    .merits-items {
        grid-template-columns: 1fr;
        margin-left: 10px;
        margin-right: 10px;
    }

    .merits-grid > figure img {
        margin-left: auto;
        margin-right: auto;
    }

}