.blh-about {
    position: relative;
}

.blh-about .blha-img-wrapper {
    position: relative;
    height: 100%;
}

.blh-about .main-img {
    width: 100%;
    display: block;
    height: 100%;
    object-fit: cover;
}

.blh-about .blha-mini-img {
    position: absolute;
    top: 50%;
    right: 50%;
    transform: translate(50%, -20%);
    max-width: 350px;
    width: 100%;
    border: 4px solid #fff;
    box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.25);
}

.blh-about .blha-content-wrapper {
    padding: 80px 0px 20px 0px;
}

@media (min-width:768px) {
    .blh-about .blha-mini-img {
        transform: translate(50%, 28%);
    }
    .blh-about .blha-content-wrapper {
        padding: 80px 20px 20px;
    }
}

@media (min-width:992px) {
    .blh-about .blha-img-wrapper {
        border-right: 6px solid #000;
    }

    .blh-about .blha-content-wrapper {
        padding: 40px 20px 0;
    }

    .blh-about .blha-mini-img {
        max-width: 450px;
        transform: translate(60%, -50%);
    }

    .row-item-center {
        display: table-cell;
        vertical-align: middle;
        float: none;
    }
}

@media (min-width:1200px) {
    .blh-about .blha-mini-img {
        right: 0;
        transform: translate(34%, -50%);
    }

    .blh-about .blha-content-wrapper {
        margin-left: 120px;
    }
}

@media (min-width:1300px) {
    .blh-about .blha-img-wrapper {
        margin-right: 250px;
    }

    .blh-about .blha-mini-img {
        right: 0;
        transform: translate(67%, -50%);
    }

    .blh-about .blha-content-wrapper {
        max-width: 550px;
        width: 100%;
        margin-left: 80px;
        padding-right: 40px;
    }
}

/* Ensure the mini overlay image stacks on small screens instead of overlapping following sections */
@media (max-width: 767px) {
    .blh-about .blha-mini-img {
        position: relative;
        top: auto;
        right: auto;
        transform: none;
        margin: 16px auto 0;
        max-width: 100%;
        width: auto;
        border: 4px solid #fff;
        box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.15);
    }

    .blh-about .blha-img-wrapper {
        /* allow the wrapper to expand with its content on small screens */
        height: auto;
        overflow: visible;
    }

    /* Add extra top padding on mobile so following include doesn't sit under the image */
    .blackline-hhp-about.blh-about {
        padding-top: 20px;
    }
}