/* Reset some default styling */ body { margin: 0; padding: 0; font-family: 'Arial', sans-serif; } /* Center the form on the page */ .wrapper { display: flex; align-items: center; justify-content: center; height: 100vh; background-image: linear-gradient(rgba(0,0,0,0.7),rgba(0,0,0,0.7)),url("../assets/images/background.png"); } /* Style the form container */ .formsignup { background-color: #fff; border-radius: 8px; box-shadow: 0 0 128px rgba(0, 0, 0, 0.1); width: 400px; padding: 30px; box-sizing: border-box; } /* Style the form header */ .formsignup header { font-size: 24px; font-weight: bold; text-align: center; margin-bottom: 20px; } /* Style the form elements */ .formsignup form { display: flex; flex-direction: column; } /* Style the individual form fields */ .field { margin-bottom: 20px; } .field-pass { margin-bottom: 20px; } .field label { font-size: 14px; margin-bottom: 5px; } .field-pass label { font-size: 14px; margin-bottom: 5px; } .field input { width: 100%; padding: 10px; border: 1px solid #ccc; border-radius: 4px; } .field-pass input { width: 100%; padding: 10px; border: 1px solid #ccc; border-radius: 4px; } /* Style the password field with eye icon */ .field-pass { position: relative; } .formsignup form .field-pass i{ position: absolute; right: 15px; color: #ccc; top: 70%; transform: translateY(-50%); cursor: pointer; } .formsignup form .field-pass i.active::before{ content: "\f070"; color: #333; } /* Style the file input separately */ .field input[type="file"] { padding: 5px; } /* Style the error message text */ .error-txt { color: #ff0000; background: #f8d7da; padding: 8px 10px; text-align: center; border-radius: 5px; margin-bottom: 10px; border: 1px solid #f5c6cb; display: none; } /* Style the login link */ .link { text-align: center; margin-top: 20px; } .link a { color: #007bff; text-decoration: none; } .link a:hover { text-decoration: underline; } /* Additional styling for the submit button */ .field-gochat-btn { display: flex; justify-content: center; font-size: 17px; font-weight: 400; } .field-gochat-btn input[type="submit"] { background-color: #007bff; /* Blue color */ color: white; cursor: pointer; padding: 10px 60px; /* Adjust padding for height and width */ border: none; border-radius: 4px; } .field-gochat-btn input[type="submit"]:hover { background-color: #0056b3; /* Darker blue on hover */ }