.skeleton-body.product-layout-grid .summary-before:before {
    background-image: linear-gradient(var(--porto-placeholder-color, #f4f4f4) 100%, transparent 0),
        linear-gradient(var(--porto-placeholder-color, #f4f4f4) 100%, transparent 0),
        linear-gradient(var(--porto-placeholder-color, #f4f4f4) 100%, transparent 0),
        linear-gradient(var(--porto-placeholder-color, #f4f4f4) 100%, transparent 0);
    background-size: calc(50% - 10px) calc(50% - 10px);
    background-position: 0 0, right 0, 0 bottom, right bottom;
}
@media (max-width: 575px) {
    .skeleton-body.product-layout-grid .summary-before { padding-top: 400%; }
    .skeleton-body.product-layout-grid .summary-before:before {
        background-size: 100% calc(25% - 15px);
        background-position: 0 0, 0 33.3333%, 0 66.6666%, 0 bottom;
    }
}

.skeleton-body.product-layout-sticky_info .summary-before { padding-top: 146%; }
.skeleton-body.product-layout-sticky_info .summary-before:before {
    background-size: 100% calc(33.3333% - 3px);
    background-position: 0 0, 0 50%, 0 bottom;
}
@media (max-width: 767px) {
    .skeleton-body.product-layout-sticky_info .summary-before { padding-top: 293%; }
}

.skeleton-body.product-layout-sticky_both_info .summary-before { order: 2; padding-top: 146%; }
.skeleton-body.product-layout-sticky_both_info .tab-content { order: 4; }
.skeleton-body.product-layout-sticky_both_info .summary + .summary { order: 3; }
.skeleton-body.product-layout-sticky_both_info .summary-before:before {
    background-size: 100% calc(33.3333% - 3px);
    background-position: 0 0, 0 50%, 0 bottom;
}
@media (max-width: 991px) {
    .skeleton-body.product-layout-sticky_both_info .summary-before { padding-top: 293%; }
}

.skeleton-body.product-layout-centered_vertical_zoom .summary-before { order: 2; padding-top: 40%; }
.skeleton-body.product-layout-centered_vertical_zoom .tab-content { order: 4; }
.skeleton-body.product-layout-centered_vertical_zoom .summary + .summary { order: 3; }
.skeleton-body.product-layout-centered_vertical_zoom .summary-before:before {
    background-size: 79% 100%, 19% 23%, 19% 23%, 19% 23%, 19% 23%;
    background-position: right top, 0 0, 0 33.3333%, 0 66.6666%, 0 100%;
}
@media (max-width: 991px) {
    .skeleton-body.product-layout-centered_vertical_zoom .summary-before { padding-top: 80%; }
}

.skeleton-body.product-layout-extended .summary-before { margin-bottom: 2rem; padding-top: 33.3333%; }
.skeleton-body.product-layout-extended .summary-before:before {
    background-image: linear-gradient(#f4f4f4 100%,transparent 0),linear-gradient(#f4f4f4 100%,transparent 0),linear-gradient(#f4f4f4 100%,transparent 0);
    background-size: 33.2% 100%,33.2% 100%,33.2% 100%;
    background-position: 0 0, 50% 0, 100% 0;
}