* {
    box-sizing:border-box;
    font-size:18px;
}

body {
    margin:0;
    padding:0;
}

.form-container {
    width:100vw;
    display:flex;
    flex-direction:column;
    align-items:center;
    padding-top:4rem;
}

.form-container form {
    display:flex;
    flex-direction:column;
}

.form-container form .username-text {
    margin-right:1rem;
}

.form-container form .email-text {
    margin-right:2.5rem;
    
}

.form-container form input {
    margin-bottom:2rem;
    width:30vw;
    border:none;
    border-bottom:1px solid olivedrab;
}

.form-container form input:focus {
    outline:none;
}

.form-container form button {
    padding:0.75rem 3rem;
    border-radius:30px;
    border:none;
    background-color:olive;
    color:#eee;
    display:inline-block;
}

.form-container form button:hover {
    background-color:transparent;
    color:#eee;
    background-color:rgb(175, 175, 4);
}

.btn-div {
    text-align:center;
}

.error-msg {
    margin-top:1rem;
    color:red;
    font-weight:bold;
    text-align:center;
}

.success-msg {
    margin-top:1rem;
    color:green;
    font-weight:bold;
    text-align:center;
}

.container hr {
    width:40vw;
    margin-top:1.5rem;
}

.users-container {
    margin:0 auto;
    width:30vw;
    padding-top:1rem;
}

.users-container .users-count {
    display:flex;
    justify-content:space-between;
}

.users-container .users-count h3, .users-container .users-count span {
    font-size: 1.25em;
    color:olivedrab;
}

.users-container .users-count p {
    font-size: 1.25em;
    color:#333;
}

.users {
    margin-top:-1rem;
    color:#333
}