Login or signup code html with CSS
CSS *{ margin:0; padding:0; box-sizing:border-box; font-family:times new roman; outline:none; } body { background:#ececec; } .btn{ padding:10px; position:absolute; display:flex; align-items:center; justify-content:center; top:5%; right:3%; } .btn button{ padding:5px 10px; margin:0px 55px; border:none; color:#fff; border-radius:5px; box-shadow:2px 2px 3px rgba(0,0,0,0.2); } .btn button:nth-child(1){ background:#ff8787; } .btn button:nth-child(2){ background:#aa9eff; } .form{ padding:20px; margin:20% auto; background:#78ffc7; height:350px; width:300px; box-shadow:10px 10px 15px rgba(0,0,0,0.2), -10px 10px 15px rgba(0,0,0,0.2); border-radius:10px; text-align:center; display:block ; overflow:hidden; transition:all 500ms ease-in-out; } .form h2{ padding:15px 0; font-weight:500; color:#333; text-transform:uppercase; } .form .input{ width:90%; height:42px; margin:12px auto; background:#fff; border-radius:5px; display:flex; box-shadow:2px 2px 3px rgba(0,0,0,0.5); overflow:hidden; } .form .input i{ width:40px; height:100%; text-align:center; line-height:42px; color:#8c8c8c; } .form input{ width:80%; height:100%; border:none; } .form #name{ display:none; } .form button{ width:90%; padding:12px; border:none; background:#39f; box-shadow:3px 4px 6px rgba(0,0,0,0.2); color:#fff; border-radius:5px; margin-bottom:30px; } a{ display: block; background-color:#fff; width:90%; height:45px; color:black; line-height:20px; font-size:25px; font-family:fantasy; text-align: center; text-decoration: none; padding: 10px 0; left:20px; position:relative; bottom:55px; border-radius: 5px; box-shadow: inset -3px -3px 7px #AEAEC0, inset 2px 2px 5px #FFFFFF; }
Comments