/* Pattern fills the viewport; soft tints sit underneath */
body {
    background-color: #ffffff;
    background-image:
        url(/media/work_photos/background-elements.jpg),
        radial-gradient(ellipse 90% 55% at 12% -5%, rgba(43, 103, 246, 0.07), transparent 58%),
        radial-gradient(ellipse 75% 50% at 95% 0%, rgba(58, 141, 170, 0.08), transparent 55%);
    background-position: center top, center top, center top;
    background-size: cover, 100% 100%, 100% 100%;
    background-repeat: no-repeat;
    background-attachment: fixed;
    min-height: 100vh;
}

@media (max-width: 768px) {
    body {
        /* fixed backgrounds are janky on many mobile browsers */
        background-attachment: scroll;
        background-size: 100% auto, 100% 100%, 100% 100%;
    }
}