.tile-row {
    display: flex;
    justify-content: space-between;
    margin: 0 80px 40px 80px;
}

.tile-row h3 {
    font-family: var(--family-crazy);
    font-size: var(--font-40);
    text-indent: -60px;
}

.tile-image {
    width: 50%;
    box-sizing: border-box;
    text-align: center;
}

.tile-image img {
    width: 100%;
    max-width: 800px;
}

.tile-text {
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 50%;
    text-align: left;
    box-sizing: border-box;
    padding-left: 11%;
    padding-right: 3%;
}

.tile-row:nth-of-type(even) {
    flex-direction: row-reverse;

    & .tile-text {
        padding-right: 11%;
        padding-left: 3%;
    }
}

.dobryvedet {

    .tile-row h3 {
        color: #fff;
    }

    .tile-text {
        color: #fff;
    }

    .tile-row:nth-of-type(odd) {
        flex-direction: row-reverse;

        & .tile-text {
            padding-right: 11%;
            padding-left: 3%;
        }
    }

    .tile-row:nth-of-type(even) {
        flex-direction: row;

        & .tile-text {
            padding-left: 11%;
            padding-right: 3%;
        }
    }
}

@media screen and (max-width: 1024px) {
    .tile-image {
        width: 100%;
    }
    .tile-text {
        width: 100%;
        padding-left: 0;
        padding-right: 0;
    }
    .tile-row:nth-of-type(2n) .tile-text {
        padding-right: 0;
        padding-left: 0;
    }

    .tile-row {
        flex-flow: row wrap;
        margin: 0 80px 40px 80px;
    }
    .tile-image img {
        max-width: 640px;
    }

    .dobryvedet .tile-row:nth-of-type(2n) .tile-text {
        padding-left: 0;
        padding-right: 0;
    }
    .dobryvedet .tile-row:nth-of-type(2n+1) .tile-text {
        padding-right: 0;
        padding-left: 0;
    }

}

@media screen and (max-width: 700px) {
    .tile-row h3 {
        font-size: var(--font-30);
        text-indent: 0;
    }
}

@media screen and (max-width: 500px) {
    .tile-row {
        flex-flow: row wrap;
        margin: 0 30px 40px 30px;
    }
}