:root, body, .login-container { width: 100%; height: 100%; }
.login-container { display: flex; width: 100%; height: 100%; background: var(--primary-color); justify-content: center; align-items: center; }
.login-warpper { max-width: calc(100% - 50px); }
.login-logo { display: block; margin: 0 auto 25px; width: 200px; height: auto; fill: var(--primary-text-color); }
.login-form-container { display: flex; padding: 20px; width: 500px; max-width: 100%; background: #FFF; border-radius: 5px; flex-direction: column; box-sizing: border-box; }
.login-title { margin: 0 0 10px; font-size: 2rem; text-align: center; }
.login-abstract { margin: 0 0 30px; font-size: 1.25rem; text-align: center; }
.login-input { display: block; margin: 0 0 15px; padding: 10px; width: 100%; font-size: 1rem; border: 1px solid var(--black-color); outline: none; border-radius: 5px; box-sizing: border-box; }
.login-submit { display: inline; margin: 25px 0 0 auto; padding: 7.5px 15px; width: fit-content; color: var(--primary-text-color); text-transform: uppercase; background: var(--primary-color); border: none; border-radius: 3px; cursor: pointer; }