@import url(https://fonts.googleapis.com/css?family=Roboto:400,400italic,500,500italic,700,700italic,900,900italic,300italic,300,100italic,100); html { font-family: 'Roboto', sans-serif; font-size: 16px; color: #46535B; } body { font-size: 16px; padding: 0; margin: 0; } h1 { font-size: 30px; font-style: normal; font-weight: 300; line-height: 35px; color: #006CB7; } h2 { font-size: 18px; font-style: normal; font-weight: 300; line-height: 21px; text-transform: uppercase; color: #006CB7; } h3 { font-size: 18px; font-style: normal; font-weight: 300; line-height: 21px; } em { font-weight: 300; } .btn { border: none; line-height: 2.5rem; padding: 0 2.5rem; color: white; background: #006CB7; border-radius: 20px; font-size: 1.125rem; font-weight: 400; cursor: pointer; transition: opacity 0.3s ease-out; } .btn:hover { opacity: 0.8; } .btn:disabled { cursor: default; opacity: 0.5; } .panel { background: #F5F5F5; padding: 40px 60px; border-radius: 20px; max-width: 30rem; } .panel .panel-logo { position: absolute; top: -60px; left: 0; right: 0; display: block; margin: auto; background: #F5F5F5; padding: 20px 30px; width: 100px; border-radius: 100%; text-align: center; } .line { background: #C4C4C4; height: 2px; width: 200px; margin: auto; } .a-right { display: block; text-align: right; font-size: 10px; text-decoration: none; color: #006CB7; text-transform: uppercase; } .alert { position: relative; color: #8D3D3D; margin-bottom: 2rem; } .alert.alert-success { color: #88B52F; } .alert img { position: relative; top: 0.25rem; width: 1.8rem; } .alert p { position: absolute; display: flex; flex-direction: column; justify-content: center; align-items: center; height: 2rem; left: 3rem; top: 0; margin: 0; text-transform: uppercase; } .submit-alert { background: white; border: 2px solid #B7DB70; box-sizing: border-box; border-radius: 8px; } .submit-alert .btn { margin-top: 0.5rem; background: #88B52F; border-radius: 4px; } .background { background: #848C90; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; overflow-y: scroll; height: 200vh; width: 100%; } .login-panel { position: absolute; width: 50%; left: 25%; top: 100px; box-shadow: 0 0 2.5rem 0 rgba(0, 0, 0, 0.25); } .register-button { position: relative; margin-top: 2rem; display: block; text-decoration: none; color: #848C90; } .register-button img { width: 2rem; } .register-button h3 { position: absolute; left: 3rem; top: 0; margin: 0; } .register-button p { position: absolute; left: 3rem; bottom: 0; margin: 0; font-size: 0.875rem; font-weight: 300; } .input-wrapper { position: relative; height: 4rem; } .input-wrapper .input-icon { position: absolute; left: 0; top: 0.5rem; display: block; width: 1.5rem; } .input-wrapper .input-floating-label { position: absolute; left: 3rem; right: 0; display: block; } .input-wrapper .input-floating-label input, .input-wrapper .input-floating-label select { padding: 0.25rem 0; background: none; border: none; display: block; width: 100%; border-bottom: 2px solid #C4C4C4; } .input-wrapper .input-floating-label input:focus, .input-wrapper .input-floating-label select:focus { outline: none; } .input-wrapper .input-floating-label label { font-size: 10px; color: #46535B; } .input-wrapper .input-floating-label label.input-hint { color: #848C90; } .back-to-login { position: relative; height: 2rem; } .back-to-login img { position: absolute; top: 0.25rem; left: 0.5rem; } .back-to-login a { position: relative; top: 0; left: 3rem; text-decoration: none; color: #46535B; } /*# sourceMappingURL=login-styles.css.map */