EXTREMELY
ONLINE

:doodle { width: 100% !important; height: 90vmax !important; @grid: 15 / 100vmax; background: #0a0c27; font-family: sans-serif; overflow: hidden; mask: url('blobs/blob2.svg') top left/cover no-repeat; margin-top: 2em; } :after { content: \@hex(@rand(0x25a0, 0x25fc)); transform: scale(@r(1, 4.5)) rotate(@r(360deg)) translate(@r(30px), @r(30px)); color: hsla(@r(270), 90%, @r(50%, 70%), 1); font-size: 3vmax; } @media screen and (max-width: 600px) { :doodle { margin-top: -2em; } } :doodle { width: 100% !important; height: 500px !important; @grid: 10 / 100vmax; background: #0a0c27; font-family: sans-serif; overflow: hidden; mask: url('blobs/blob3.svg') top left/cover no-repeat; margin-top: 2em; } :after { content: \@hex(@rand(0x25a0, 0x25fc)); transform: scale(@r(1, 4)) rotate(@r(360deg)) translate(@r(30px), @r(30px)); color: hsla(@r(270), 90%, @r(50%, 70%), 1); font-size: 3vmax; }