*{ font-family: 'Times New Roman', Times, serif; margin: 0; padding: 0; box-sizing: border-box; } .wrapper{ background : url('https://wallpaperaccess.com/full/4893666.jpg') no-repeat; width: 100%; height: 100vh; padding: 15px; display: flex; justify-content: center; align-items: center; background-size: cover; background-position: center; } .container{ width: 500px; background-color: #fff; padding: 30px; border-radius: 16px; background:transparent; border: 2px solid rgba(255,255,255,.2); backdrop-filter: blur()20px; box-shadow: 0 0 10px rgba(0 ,0 , 0, .2); } .title-section{ margin-bottom: 30px; } .title{ color: #fff; font-size:25px ; font-weight: 500; text-transform: capitalize; margin-bottom: 10px; align-items: center; text-align: center; padding: 10px; font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; } .para{ color:#dbd5d5; font-size: 15px; font-weight: 400; line-height: 1.5; margin-bottom: 20px; text-transform:capitalize; font-family:'Nunito Sans', sans-serif; margin: 10px; } .input-group{ position: relative; } .input-group .label-title{ color: #fff; font-family:'Nunito Sans', sans-serif; font-size: 15px; margin: 10px; margin-bottom: 11px; display: block; font-weight: 500; } .input-group input{ width: 100%; background-color: transparent; color: #fff; height: 50px; font-size: 16px; font-weight: 300; border: 2px solid rgba(255,255,255,2); border-radius: 40px; padding: 9px 18px 9px 52px; outline: none; margin-bottom: 10px; } .input-group input::placeholder{ color:whitesmoke; font-family: 'Nunito Sans', sans-serif; font-size: 15px; font-weight: 300; } .input-group .icon{ position: absolute; color: #fff; left: 13px; top: calc(50% - 8px); text-align: center; font-size: 23px; } .input-group .submit-btn{ width: 100%; background-color: #dbd5d5; border: 1px solid transparent; border-radius: 40px; font-size: 16px; color: rgb(0, 0, 0); padding: 13px 24px; font-weight: 500; text-align: center; cursor: pointer; } .submit-btn:hover{ opacity: 0.95; } .back{ font-size: 14.5px; text-align: center ; margin: 20px 0 15px; margin-top: 10px; } .back a p{ color: #fff; text-decoration: none; font-weight: 600; margin-top: 10px; }