Elvar_Smari

I have this css code that animates the background colour of my page. I would like to alter it so that the position of the gradient is randomised every time I reload the page. How can I accomplish that? .section-background { background: linear-gradient(270deg, #8A90F9, #91F2F2, #92F492, #FFB64D, #FF5C5C, #FC92FC); background-size: 10000% 10000%; -webkit-animation: AnimationName 60s ease infinite; -moz-animation: AnimationName 60s ease infinite; animation: AnimationName 60s ease infinite; } @-webkit-keyframes AnimationName { 0%{background-position:0% 50%} 50%{background-position:100% 50%} 100%{background-position:0% 50%} } @-moz-keyframes AnimationName { 0%{background-position:0% 50%} 50%{background-position:100% 50%} 100%{background-position:0% 50%} } @keyframes AnimationName { 0%{background-position:0% 50%} 50%{background-position:100% 50%} 100%{background-position:0% 50%} } }

Works! Many thanks.

Site URL: https://www.elvarsmari.is/otl I've noticed that the Spotify widget cuts out the bottom when scaling. I've tried this on multiple devices and browsers and it's the same everywhere. Is there any custom CSS I can add to prevent this?