section.text-image {
    position: relative;
    overflow: hidden;
}

section .t-i--text {
    z-index: 3;
}

section .t-i--image--out img {
    position: absolute;
    width: auto;
    transform: translateY(-50%);
    top: 50%;
    max-height: 800px;
}
@media only screen 
  and (min-width: 1025px) 
  and (max-height: 1366px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 1.5) {
    section .t-i--image--out img {
        max-height: 500px;
    }
}
@media (min-width: 1025px) {
    section.image-left .t-i--image--out img {
        right: 2%;
    }
    section.image-right .t-i--image--out img {
        left: 2%;
    }
}

/* At LG breakpoint */
@media (max-width: 1025px) {
    section .t-i--image--out img {
        position: relative;
        height: auto;
        max-height: none;
        width: 100%;
        top: 0;
        transform: initial;
    }
}

@media screen and (max-width: 1025px) {
    section .text-image {
        padding: 0 30px;
    }
    section .t-i--image--out {
        min-height: 40vh;
    }
    section .t-i--image--out.mobile-center {
        min-height: auto;
    }
    section .t-i--image--out img {
        transform: translateX(-50%);
        position: absolute;
        top: 0;
        width: auto;
        max-height: 40vh;
    }
    section .t-i--image--out.mobile-center img {
        position: relative;
        height: auto;
        max-height: none;
        width: 100%;
        top: 0;
        transform: initial;
    }

    section .t-i--text {
        padding: 0 30px;
    }
    section.text-image.image-right .t-i--text {
        order: 2;
    }
}