form { width: 50%; margin-left: auto; margin-right: auto; padding: var(--main-size); background-image: radial-gradient(ellipse at 10% 10%, var(--bg3), var(--accent-blue)), url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgBAMAAACBVGfHAAAAElBMVEUAAACUkpSEhoSMioyMjoyEgoRr6djFAAAAAXRSTlMAQObYZgAAAAlwSFlzAAAOxAAADsQBlSsOGwAAAU1JREFUKJEVUcl1xTAIpAVLSgECXIAYUoCAX0Bi919LlCPLm5ValiOUUe2+ZRVFuYpKXFsUX9aIp0V6GtC8VRhNL0X2fikvswhKrNDhes7pbpPkufFAtI0B76LEjfc2bgdHDk6RX4A/sjt6LCylfoYpNYYJx/9COhIugsjluzN9VGZ/Hnl51jIH2ba+Ywsy2RJCFdoDe8Obw61TXGAv+ewExMRJs7gd7YcimPuk42uMqY2VJ1fK+bDL32rb7kwok/la/u7Mrz7Xf0DTssSP2Btp1ZS0zw35tM/SsJKgWNLcRh+/th1QqntwtM3Tx0LNosoBYbM3qjJFiMeLsMH2i5BcQdU3n9sJHOE1Hoqn1GA/bm4s0YkVB/y4r0PbltF32FpljXmdlOOwbDvFWkoDYLppSG4pnM6UxX3Src1lhXeU36FOu3o+R2vNaHME/wESUl9/3zMniwAAAABJRU5ErkJggg==); background-blend-mode: multiply; border-radius: var(--unit-size); } fieldset { display: flex; flex-direction: column; font-family: var(--display-font); font-size: var(--main-size); } fieldset legend { margin-bottom: var(--main-size); } br { margin-bottom: var(--unit-size); } label { font-family: var(--display-font); font-size: var(--medium-size); } input[type="text"]:hover, input[type="password"]:hover, input[type="email"]:hover, input[type="text"]:focus, input[type="password"]:focus, input[type="email"]:focus { background: var(--white) !important; color: var(--bg1) !important; transition: all 0.4s ease; } input[type="text"], input[type="password"], input[type="email"] { all: unset; background: var(--translucent); padding: var(--unit-size) var(--small-size); box-sizing: border-box; border-radius: var(--unit-size); font-size: var(--medium-size); width: 100%; } fieldset div:last-child { text-align: end; }