.home { display: flex; flex: 1; height: 100%; } .left, .right { display: flex; flex-direction: column; flex: 1; } .left { background-color: var(--bgColor2); } .centered { display: flex; flex-direction: column; flex: 1; width: 100%; max-width: 512px; min-width: 0; } .content { flex: 1; } .left .content { display: flex; flex-direction: column; padding-top: 113px; align-items: center; } .left .content form > * { margin-top: 0; margin-bottom: 24px; } .left .content form > :last-child { margin-bottom: 0; } .left .content hr { width: 100%; border: none; border-top: 1px solid var(--bgColor4); color: var(--textColor2); overflow: visible; text-align: center; height: 5px; font-weight: 600; font-size: 15px; line-height: 24px; } .left .content hr:after { background-color: var(--bgColor2); content: "OR"; padding: 0 12px; position: relative; top: -12px; } .left .content form { display: flex; flex-direction: column; align-items: center; padding: 92px; } .fieldRow { width: 100%; } .button { height: 40px; width: 100%; font-size: 15px; font-weight: 600; } .left .content form:first-child { padding-top: 0; } .left .content form:last-child { padding-bottom: 0; } .right .content { padding: 113px 40px 40px 40px; overflow-y: auto; } .right .content h3:first-child { margin-top: 0; } .roomList { display: flex; flex-wrap: wrap; justify-content: flex-start; gap: 24px; flex: 1; }