.apbr-product-banner-stack {
    box-sizing: border-box;
    clear: both;
    display: block;
    position: relative;
    width: 100%;
    z-index: 2;
}

.apbr-product-banner-instance {
    box-sizing: border-box;
    display: block;
    margin: 0 0 14px;
    width: 100%;
}

.apbr-product-banner-instance:last-child {
    margin-bottom: 16px;
}

.apbr-product-banner-link,
.apbr-product-banner-image {
    box-sizing: border-box;
    display: block;
    max-width: 100%;
    width: 100%;
}

.apbr-product-banner-image {
    height: auto;
    margin: 0;
}

.apbr-product-banner-link {
    text-decoration: none;
}

.apbr-product-banner-link:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 3px;
}

/*
 * The7 and WooCommerce commonly position their zoom trigger against the outer
 * gallery container. The banner is also in that container, so v1.0.1 moves the
 * trigger down by the exact rendered banner-stack height. The inline top value
 * is calculated in frontend.js to preserve the theme's original offset.
 */
.apbr-gallery-with-banner .apbr-gallery-control-offset {
    z-index: 5;
}