/* /Pages/OverlayPage.razor.rz.scp.css */
.edge-fade[b-utzqx7llj0] {
    -webkit-mask-image: linear-gradient(to bottom, transparent, black 20%, black 80%, transparent);
    mask-image: linear-gradient(to bottom, transparent, black 20%, black 80%, transparent);
}


.fade-all-sides[b-utzqx7llj0] {
    /* We layer a horizontal gradient and a vertical gradient */
    -webkit-mask-image: linear-gradient(to bottom, transparent, black 30%, black 70%, transparent), linear-gradient(to right, transparent, black 20%, black 80%, transparent);
    mask-image: linear-gradient(to bottom, transparent, black 30%, black 70%, transparent), linear-gradient(to right, transparent, black 20%, black 80%, transparent);
    /* This is the secret sauce: it tells CSS the image is only visible where masks overlap */
    -webkit-mask-composite: source-in;
    mask-composite: intersect;
    /* Ensures the image behaves like a block element */
    display: block;
}