Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- * {
- box-sizing: border-box;
- }
- body {
- margin: 0;
- height: 100vh;
- width: 100vw;
- overflow: hidden;
- font-family: "Lato", sans-serif;
- font-weight: 700;
- display: flex;
- align-items: center;
- justify-content: center;
- color: #555;
- background-color: #ecf0f3;
- }
- .login-div {
- width: 430px;
- height: 700px;
- padding: 60px 35px 35px 35px;
- border-radius: 40px;
- background-color: #ecf0f3;
- box-shadow: 13px 13px 20px #cbced1, -13px -13px 20px #fff;
- }
- .logo {
- background: url("https://cdn.dribbble.com/users/24078/screenshots/15522433/media/e92e58ec9d338a234945ae3d3ffd5be3.jpg?compress=1&resize=100x120");
- width: 100px;
- height: 100px;
- border-radius: 50px;
- margin: 0 auto;
- box-shadow: 0px 0px 2px #5f5f5f, 0px 0px 0px 5px #ecf0f3, 8px 8px 15px #a7aaaf,
- -8px -8px 15px #fff;
- }
- .title {
- text-align: center;
- font-size: 28px;
- padding-top: 24px;
- letter-spacing: 0.5px;
- }
- .sub-title {
- text-align: center;
- font-size: 15px;
- padding-top: 7px;
- letter-spacing: 3px;
- }
- .fields {
- width: 100%;
- padding: 70px 5px 5px 5px;
- }
- .fields input {
- border: none;
- outline: none;
- background: none;
- font-size: 18px;
- color: #555;
- padding: 20px 10px 20px 5px;
- }
- .username,
- .password {
- margin-bottom: 30px;
- border-radius: 25px;
- background: none;
- box-shadow: 8px 8px 8px #cbced1, -8px -8px 8px #fff;
- }
- .fields svg {
- height: 25px;
- margin: 0 10px -3px 25px;
- }
- .signing-button {
- outline: none;
- border: none;
- cursor: pointer;
- width: 100%;
- height: 60px;
- border-radius: 30px;
- font-size: 20px;
- font-weight: 700;
- font-family: "Lato", sans-serif;
- background-color: #02c8db;
- box-shadow: 3px 3px 8px #fff;
- transition: all 0.5s;
- }
- .signing-button:hover {
- background-color: #50e5b9;
- }
- .signing-button:hover {
- background-color: #88ef9e;
- }
- .link a {
- text-decoration: none;
- color: #aaa;
- font-size: 15px;
- }
- .link {
- padding-top: 20px;
- text-align: center;
- }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement