.password { height: 100vh; .clear-data-wrapper { margin: auto; .warning-info-area { display: flex; flex-direction: column; align-items: center; } .button-group { display: flex; justify-content: space-around; } } .password-prompt { &-wrapper { display: flex; justify-content: center; align-items: center; background-color: $session-color-black; width: 100%; height: 100%; padding: 3 * $session-margin-lg; } &-error-section { width: 100%; color: $session-color-white; margin: -$session-margin-sm 0px 2 * $session-margin-lg 0px; .session-label { &.primary { background-color: rgba($session-color-primary, 0.3); } padding: $session-margin-xs $session-margin-sm; font-size: $session-font-xs; text-align: center; } } &-container { font-family: $session-font-default; color: $session-color-white; display: inline-flex; flex-direction: column; align-items: center; justify-content: center; width: 600px; min-width: 420px; padding: 3 * $session-margin-lg 2 * $session-margin-lg; box-sizing: border-box; background-color: $session-shade-4; border: 1px solid $session-shade-8; border-radius: 2px; .warning-info-area, .password-info-area { display: inline-flex; justify-content: center; align-items: center; h1 { color: $session-color-white; } svg { margin-inline-end: $session-margin-lg; } } p, input { margin: $session-margin-lg 0px; } .button-group { display: inline-flex; } #password-prompt-input { width: 100%; color: #fff; background-color: #2e2e2e; margin-top: 2 * $session-margin-lg; padding: $session-margin-xs $session-margin-lg; outline: none; border: none; border-radius: 2px; text-align: center; font-size: 24px; letter-spacing: 5px; font-family: $session-font-default; } } } }