.pgi-background {
    box-sizing: border-box;
    width: min(100% - 40px, var(--pgi-container, 1800px));
    height: var(--pgi-background-height, auto);
    margin-inline: auto;
    background-color: var(--pgi-background-color, transparent);
    background-image: var(--pgi-background-image, none);
    background-position: center;
    background-repeat: no-repeat;
    background-size: var(--pgi-background-size, cover);
}

.pgi-background.has-parallax {
    background-attachment: fixed;
}

.pgi-background.is-full-width {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}

.wp-admin .pgi-background.is-full-width {
    width: 100%;
    margin: 0px;
}

.pgi-background.is-contained-width {
    max-width: var(--pgi-container, 1800px);
}

.pgi-background__inner {
    box-sizing: border-box;
    width: min(100% - 40px, var(--pgi-container, 1800px));
    margin-inline: auto;
}

.pgi-background.is-contained-width .pgi-background__inner {
    width: 100%;
    max-width: 100%;
}

.pgi-background.has-background-size-stretch {
    background-size: 100% 100%;
}

.pgi-background.is-preview {
    min-height: 80px;
    outline: 1px dashed rgba(var(--pgi-black-rgb, 43, 44, 39), 0.25);
    outline-offset: -1px;
}

.pgi-background.is-preview .block-editor-block-list__layout {
    min-height: 80px;
}
@media (max-width: 768px) {
    .pgi-background {
        height: var(--pgi-background-mobile-height, var(--pgi-background-height, auto));
    }

    .pgi-background.has-parallax {
        background-attachment: scroll;
    }
}

@media (min-width: 769px) and (max-width: 1499px) {
    .pgi-background__inner {
        width: min(100% - 25.6px, var(--pgi-container, 1440px));
    }
}