.servicesBox {
    display: grid;
    overflow: hidden;
}
.split5050 {
    grid-template-columns: repeat(2, 1fr);
}
.split6040 {
    grid-template-columns: 6fr 4fr;
}
.split6633 {
    grid-template-columns: 2fr 1fr;
}
.split7525 {
    grid-template-columns: 3fr 1fr;
}
.split4060 {
    grid-template-columns: 4fr 6fr;
}
.split3366 {
    grid-template-columns: 1fr 2fr;
}
.split2575 {
    grid-template-columns: 1fr 3fr;
}
.noSplit {
    grid-template-columns: 1fr;
    grid-template-rows: 1fr 1fr;
}

.textArea {
    height: 100%;
    display: flex;
    flex-direction: column;
} 
.textArea h3 {
    margin-top: 0;
    margin-bottom: .5em;
    text-shadow: none;
    background-image: var(--gradient-head-links-01);
}
.textArea .button {
    margin-top: auto;
    margin-bottom: 0;
    text-shadow: none;

}



.imageArea {
    background-position:center center;
    background-repeat:no-repeat;
    background-size: cover;
}

.bgi_topleft {
    background-position:left top;
}
.bgi_topCenter {
    background-position:center top;
}
.bgi_topRight {
    background-position:right top;
}
.bgi_centerLeft {
    background-position:left center;
}
.bgi_centerRight {
    background-position:right center;
}
.bgi_bottomLeft {
    background-position:left bottom;
}
.bgi_bottomCenter {
    background-position:center bottom;
}
.bgi_bottomRight {
    background-position:right bottom;
}

@media screen and (max-width: 657px) {

    .servicesBox.textImg .imageArea {
        grid-area: imageArea;

    }
    .servicesBox.textImg .textArea {
        grid-area: textArea;
    }

    .split5050, .split6040, .split6633, .split7525, .split4060, .split3366, .split2575, .noSplit {
        grid-template-columns: 1fr;
        grid-template-rows: 1fr 1fr;
        grid-template-areas: 
                    "imageArea"
                    "textArea"
        ;
    }

}