.cms-designed-block {
    box-sizing: border-box;
    background-color: var(--cms-block-bg-color);
    padding-top: var(--cms-block-padding-top);
    padding-right: var(--cms-block-padding-right);
    padding-bottom: var(--cms-block-padding-bottom);
    padding-left: var(--cms-block-padding-left);
    margin-top: var(--cms-block-margin-top);
    margin-right: var(--cms-block-margin-right);
    margin-bottom: var(--cms-block-margin-bottom);
    margin-left: var(--cms-block-margin-left);
    min-height: var(--cms-block-min-height);
    max-width: var(--cms-block-max-width);
    text-align: var(--cms-block-text-align);
    overflow: var(--cms-block-overflow);
    border-width: var(--cms-block-border-width);
    border-style: var(--cms-block-border-style);
    border-color: var(--cms-block-border-color);
    border-radius: var(--cms-block-border-radius);
    box-shadow: var(--cms-block-border-shadow);
}

.cms-designed-block--has-background-layers {
    background-image: var(--cms-block-bg-overlay), var(--cms-block-bg-gradient), var(--cms-block-bg-image);
    background-position: var(--cms-block-bg-position);
    background-size: var(--cms-block-bg-size);
    background-repeat: var(--cms-block-bg-repeat);
    background-attachment: var(--cms-block-bg-attachment);
}

.cms-designed-block--width-full { width: 100%; }
.cms-designed-block--width-container {
    width: min(calc(100% - 2rem), var(--cms-content-width, 1200px));
    margin-left: auto;
    margin-right: auto;
}
.cms-designed-block--width-custom {
    width: min(calc(100% - 2rem), var(--cms-block-max-width, 1200px));
    margin-left: auto;
    margin-right: auto;
}
.cms-designed-block > :first-child { margin-top: 0; }
.cms-designed-block > :last-child { margin-bottom: 0; }

@media (min-width: 1025px) {
    .cms-block-hide-desktop { display: none !important; }
}

@media (min-width: 768px) and (max-width: 1024px) {
    .cms-designed-block {
        padding-top: var(--cms-block-padding-top-tablet, var(--cms-block-padding-top));
        padding-right: var(--cms-block-padding-right-tablet, var(--cms-block-padding-right));
        padding-bottom: var(--cms-block-padding-bottom-tablet, var(--cms-block-padding-bottom));
        padding-left: var(--cms-block-padding-left-tablet, var(--cms-block-padding-left));
        margin-top: var(--cms-block-margin-top-tablet, var(--cms-block-margin-top));
        margin-right: var(--cms-block-margin-right-tablet, var(--cms-block-margin-right));
        margin-bottom: var(--cms-block-margin-bottom-tablet, var(--cms-block-margin-bottom));
        margin-left: var(--cms-block-margin-left-tablet, var(--cms-block-margin-left));
    }
    .cms-block-hide-tablet { display: none !important; }
}

@media (max-width: 767px) {
    .cms-designed-block {
        padding-top: var(--cms-block-padding-top-mobile, var(--cms-block-padding-top-tablet, var(--cms-block-padding-top)));
        padding-right: var(--cms-block-padding-right-mobile, var(--cms-block-padding-right-tablet, var(--cms-block-padding-right)));
        padding-bottom: var(--cms-block-padding-bottom-mobile, var(--cms-block-padding-bottom-tablet, var(--cms-block-padding-bottom)));
        padding-left: var(--cms-block-padding-left-mobile, var(--cms-block-padding-left-tablet, var(--cms-block-padding-left)));
        margin-top: var(--cms-block-margin-top-mobile, var(--cms-block-margin-top-tablet, var(--cms-block-margin-top)));
        margin-right: var(--cms-block-margin-right-mobile, var(--cms-block-margin-right-tablet, var(--cms-block-margin-right)));
        margin-bottom: var(--cms-block-margin-bottom-mobile, var(--cms-block-margin-bottom-tablet, var(--cms-block-margin-bottom)));
        margin-left: var(--cms-block-margin-left-mobile, var(--cms-block-margin-left-tablet, var(--cms-block-margin-left)));
    }
    .cms-block-hide-mobile { display: none !important; }
}