.kacheln--content-h2 {
    display: inline-block;
    padding: 40px 20px 20px;
}

.kacheln--content-text {
    background-color: #e3e3e3;
    text-align: left;
    padding: 20px;
}

.kacheln--content-text .leadtext {
    color: #e2001a;
    text-transform: uppercase;
}

.kacheln--content-text h3 {
    margin-top: 0;
    margin-bottom: 10px;
}

.kacheln--content-image {
    padding: 0;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    min-height: 350px;
}

.kacheln--content-image img {
    vertical-align: bottom;
}

@media screen and (min-width: 48em) {
    .kacheln {
        overflow: hidden;
        /*kachel positions*/
    }

    .kacheln > div {
        width: calc(100% / 2);
        min-height: 550px;
        position: relative;
        display: inline-block;
    }

    .kacheln > div > div {
        position: absolute;
    }

    .kacheln--content-h2 > div, .kacheln--content-text > div {
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        min-width: 300px;
    }

    .kacheln--content-image.triangle-animation:before {
        content: '';
        position: absolute;
        top: 0px;
        left: 0px;
        height: 90%;
        width: 100%;
        background-image: url(../images/triangle-left.svg);
        background-size: contain;
        mix-blend-mode: multiply;
        display: inline-block;
        background-repeat: no-repeat;
        background-position: left;
        z-index: 5;
    }

    .kacheln--content-image.triangle-animation:after {
        content: '';
        position: absolute;
        bottom: 0px;
        right: 0px;
        height: 90%;
        width: 100%;
        background-image: url(../images/triangle-right.svg);
        background-size: contain;
        mix-blend-mode: multiply;
        display: inline-block;
        background-repeat: no-repeat;
        background-position: right;
        z-index: 5;
    }

    .kacheln--content-image:hover {
        -webkit-transform: scale(1.1) !important;
        transform: scale(1.1) !important;
        overflow: hidden;
    }

    .kacheln--text-left .kacheln--content-text {
        float: left;
    }

    .kacheln--text-left .kacheln--content-image {
        float: right;
    }

    .kacheln--text-right .kacheln--content-text {
        float: right;
    }

    .kacheln--text-right .kacheln--content-image {
        float: left;
    }

    .kacheln--h2-right .kacheln--content-text {
        float: left;
    }

    .kacheln--h2-right .kacheln--content-h2 {
        float: right;
    }

    .kacheln--h2-left .kacheln--content-text {
        float: right;
    }

    .kacheln--h2-left .kacheln--content-h2 {
        float: left;
    }
}

.ie .kacheln--content-image.triangle-animation:before {
    left: -375px;
}

.ie .kacheln--content-image.triangle-animation:after {
    right: -375px;
}
