.required-span {
    color: #dd4b39 ;
    font-weight: bold;
    font-size: 18px;
}

.title-section {
    padding-top: 20%;
}

h1 {
    color: #55ae9f;
    font-size: 50px;
}

.forgot-pasw-link {
    color: #a2a2a2;
    font-size: 17px;
    font-family: HelveticaNeueLTPro-Lt;
}

.sign-in-btn {
    background-color: #f92166;
    color: white;
    margin-right: 20px;
    margin-left: 5px;
    font-size: 15px;
    padding: 8px 50px 8px 50px;
    font-family: HelveticaNeueLTPro-Md;
}

a:hover {
    color: #adadad !important;
}

.input-field {
    margin-top: 20px;
    border-radius: 10px;
    font-size: 13px;
    font-family: HelveticaNeueLTPro-Lt;
    height: 46px;
    border: 0.5 solid #9f9f9f;
    color: #a4a4a4;
}

.input-field:focus {
    border: 1px solid #55ae9f;
    box-shadow: none;
    background-color: #f6f6f6;
}

::placeholder {
    color: #a4a4a4 !important;
}

@media screen and (max-width: 1440px) {
    .input-field {
        width: 100%;
    }
}

@media screen and (max-width: 450px) {
    .title-section {
        padding-top: 8%;
        transform: translate(0, 0);
        h1 {
            font-size: 25px;
        }
    }

    .form-section {
        padding-top: 3%;
    }

    #login-image {
        width: 60%;
    }

    .sign-in-btn {
        margin-right: 5px;
    }

    .input-field {
        width: 100%;
    }
}

.ng-invalid:not(form) {
    border-left: 5px solid red;
}

.ng-valid:not(form) {
    border-left: 5px solid green;
}
