button.nopadding { padding: 0; } .blur { display: block; visibility: visible; height: 100%; width: 50%; position: absolute; backdrop-filter: blur(8px) brightness(80%); top: 0; left: 0; } .signup.form { /* width: fit-content; */ max-width: 70%; } .signup.container { padding: 2em; display: flex; justify-content: center; align-items: center; width: 50%; } .signup.banner { display: block; visibility: visible; content: ''; width: 50%; height: 100vh; background: url(/assets/img/banner-tbz-tower-1600x879.jpg) no-repeat center; background-size: cover; } .content-container { display: flex; } .optional { margin-left: 0.2em; opacity: 0.75; } .required { margin-left: 0.2em; color: red; } .button-container { display: flex; gap: 0.5em; } @media screen and (max-width: 800px) { .content-container { flex-direction: column; flex-wrap: wrap; } .signup.content.container { width: 100%; } .blur { width: 100%; height: 25vh; } .signup.banner { width: 100%; height: 25vh; } .signup.form { min-width: min-content; max-width: max-content; } } .notice { margin: 1em 0 1em 0; padding: 0.5em !important; background-color: #ffbc2160; border-radius: 8px; border: 2px solid #ffbc21ac; }