:root{--id-color-1:#28334a;--id-color-2:#28334a}.layout{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100vw;height:100vh}.login-box{display:flex;flex-direction:column;align-items:center;justify-content:center;height:90%;width:100%;padding:3.2rem 5.4rem;border-radius:.8rem;background-color:#fff;box-shadow:0 .1rem 1.6rem 0 #dadada}.alert{color:red;text-align:center;padding:1rem}.title-container{display:flex;flex-direction:column;align-items:center;margin-bottom:3.2rem}.logo{height:4.3rem;width:19.8rem}.title{padding-top:1.5rem;padding-bottom:1rem;color:var(--id-color-1);font-size:1.8rem;font-weight:bold;letter-spacing:0;line-height:1.5rem;text-align:center}.subtitle{padding:.5rem;color:var(--id-color-1);font-size:1.4rem;font-weight:bold;letter-spacing:0;line-height:1.3rem;text-align:center}.login-form{display:flex;flex-direction:column;width:100%}.button-container{display:flex;justify-content:center}.button{width:100%;border-radius:.4rem;font-size:1.3rem;font-weight:bold;line-height:1.4rem;text-align:center;outline:0;padding:1.3rem 2.3rem;cursor:pointer;background-color:var(--id-color-1);box-shadow:0 .5rem 1.2rem 0 rgba(0,0,0,0.12);color:white}.button:focus{outline:2px solid #55d3fd}.outside-text{margin:1rem;color:#636363;font-family:Arial;font-size:1.4rem;letter-spacing:0;line-height:1.6rem;text-align:center}.flex--center{border:2px solid red;display:flex;flex-direction:column;align-items:center;justify-content:space-around}@media only screen and (min-width:560px){.login-box{justify-content:space-around;min-height:43.3rem;height:auto;width:37.5rem;border-radius:.8rem;background-color:#fff;box-shadow:0 .1rem 1.6rem 0 #dadada}.outside-text{margin:2rem}.title-container{margin-bottom:1.6rem}}