.LoginFormWrapper{margin:auto;width:100%;max-width:400px}.LoginFormWrapper .MainContainer{padding:2rem}.LoginFormWrapper .MainContainer .TitleContainer{text-align:center;margin-bottom:2rem}.LoginFormWrapper .MainContainer .TitleContainer div{font-size:2rem;color:#fff;font-weight:500}.LoginFormWrapper .MainContainer .InputContainer{position:relative;margin-bottom:1.5rem;width:100%}.LoginFormWrapper .MainContainer .InputContainer .InputBox{width:100%;box-sizing:border-box;padding:12px;background:rgba(255,255,255,.1);border:2px solid rgba(255,255,255,.2);border-radius:8px;color:#fff;font-size:1rem;transition:all .3s ease}.LoginFormWrapper .MainContainer .InputContainer .InputBox::placeholder{color:#fff9}.LoginFormWrapper .MainContainer .InputContainer .InputBox:focus{outline:none;border-color:#ffffff80;background:rgba(255,255,255,.15)}.LoginFormWrapper .MainContainer .InputContainer .errorLabel{position:absolute;left:0;bottom:-20px;color:#ff6b6b;font-size:.85rem}.LoginFormWrapper .MainContainer .InputContainer .InputButton{width:100%;padding:12px;background:white;color:#000;border:none;border-radius:8px;font-size:1rem;font-weight:500;cursor:pointer;transition:all .3s ease}.LoginFormWrapper .MainContainer .InputContainer .InputButton:hover{background:rgba(255,255,255,.9);transform:translateY(-1px)}.LoginFormWrapper .MainContainer .InputContainer .InputButton:active{transform:translateY(1px)}.InputContainer+.InputContainer{margin-top:1.5rem}.OnboardingView{position:absolute;height:100vh;width:100vw;margin:0;padding:0;background-image:linear-gradient(to top right,#0057a5,#28225c);background-size:400% 400%;animation:backgroundAnimation 10s ease-in-out infinite;display:flex;flex-direction:row;flex-wrap:nowrap}.OnboardingView.InProgress .LeftColumn{width:280px;height:100%;transition:width .4s ease-out}.OnboardingView.InProgress .Slider{width:280px}.OnboardingView.InProgress #lower{transition:width .5s ease-out}.OnboardingView.InProgress #upper{transition:width .6s ease-out}.OnboardingView.InProgress .RightColumn .ImagesDropZone{animation-duration:.8s;animation-name:cssAnimationShow;animation-fill-mode:forwards}.OnboardingView.InProgress .LeftColumn .LoginView{animation-duration:.6s;animation-name:cssAnimationHide;animation-fill-mode:forwards}.OnboardingView.InProgress .LeftColumn .TextButton{box-shadow:#fff 0 0 0 2px inset;color:#fff;position:absolute;left:20px;bottom:20px}.OnboardingView.InProgress .LeftColumn .TextButton:hover{background-color:#fff;color:#000}.OnboardingView.Canceled .RightColumn .ImagesDropZone{animation-duration:.6s;animation-name:cssAnimationHide;animation-fill-mode:forwards}.OnboardingView.Canceled .LeftColumn .LoginView{animation-duration:1.5s;animation-name:cssAnimationShow;animation-fill-mode:forwards}.Slider{position:absolute;top:0;left:0;background-color:#0000004d;z-index:0;width:75%;height:100%}.Slider .TriangleVerticalContent{background-color:#0000004d}#lower{transition:width 1.2s ease-out}#upper{transition:width 1.4s ease-out}.LeftColumn{position:relative;background-color:#222831;padding:20px;z-index:100;box-sizing:border-box;transition:width 1.5s ease-out;min-width:260px;align-self:stretch;width:75%;display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center}.LeftColumn .LogoWrapper{align-self:stretch;display:flex;flex-direction:column;justify-content:space-between}.LeftColumn .LogoWrapper>img{width:220px;user-select:none}.LeftColumn .LoginView{flex:1;opacity:1;display:flex;flex-direction:row;flex-wrap:wrap}.RightColumn{padding:20px;align-self:stretch;flex:1;min-width:200px;z-index:100;display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:space-between;align-items:center;align-content:center}.RightColumn .TextButton{box-shadow:#fff 0 0 0 2px inset;color:#fff}.RightColumn .TextButton:hover{background-color:#fff;color:#000}.RightColumn .ImagesDropZone{overflow:hidden;width:0}.RightColumn>.TextButton{position:absolute;right:20px;bottom:20px}.TriangleVertical{width:200px;height:100%;position:absolute;top:0;right:-200px;background-color:transparent;overflow:hidden}.TriangleVerticalContent{width:200px;height:100%;position:absolute;left:0;top:0;transform:skew(-6deg) translate(-50%);background-color:#222831}.EditorFeaturesTiles{flex:1 0 26%;min-width:200px;height:200px;color:#fff;display:flex;flex-direction:column;flex-wrap:nowrap;justify-content:center;align-items:center}.EditorFeaturesTiles .EditorFeaturesTilesWrapper{display:flex;flex-direction:column;flex-wrap:nowrap;justify-content:center;align-items:center;transition:transform .2s}.EditorFeaturesTiles .EditorFeaturesTilesWrapper:hover{transform:scale(1.05)}.EditorFeaturesTiles .EditorFeaturesTilesWrapper .EditorFeatureLabel{width:150px;text-align:center;user-select:none}.EditorFeaturesTiles .EditorFeaturesTilesWrapper>img{filter:brightness(0) invert(1);max-width:60px;max-height:60px;margin-bottom:20px;user-select:none}@keyframes cssAnimationShow{0%{opacity:0;width:0}60%{opacity:0;width:400px}to{opacity:1;width:400px}}@keyframes cssAnimationHide{0%{opacity:1;width:400px}40%{opacity:0;width:400px}to{opacity:0;width:0}}@keyframes backgroundAnimation{0%{background-position:0 50%}50%{background-position:100% 50%}to{background-position:0 50%}}body{height:100vh;width:100vw;margin:0;padding:0;font-family:Saira Semi Condensed,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden;overflow-y:hidden}#root{width:100%;height:100%}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}