:root {
    --error-border-color: #a94442;
    --anchor-color: #00A195;
    --anchor-hover-color: #185abc;
    --anchor-bg-hover-color: aliceblue;
    --btn-text-color: #fff;
    --main-heading-text-color: #000000;
    --btn-bg-color: #00A195;
    --error-text-color: #a94442;
}

.sign-in-vue {
    font-family: 'gt_walsheim_light', sans-serif;
}

.sign-in-vue .form-group {
    margin-bottom: 15px !important;
    display: flex;
}

.n-p-important,
.no-padding-l-r,
.n-p-l-r {
    padding: 0px !important;
}

.sign-in-vue .back-left {
    float: left;
    font-weight: 700;
    cursor: pointer;
}

.m-a {
    margin: auto;
    float: none;
}

.m-b-p-heading {
    margin-bottom: 25px;
}

.margin-top-button {
    margin-top: 15px;
}

.sign-in-vue .form-bottom-sperator {
    text-align: center;
    border-top: 2px solid #f1f1f1;
}

.sign-in-vue .form-bottom-sperator-cont {
    height: 50px;
    line-height: 2.5;
}

.sign-in-vue .vue-signin-padding {
    padding: 25px;
}

.sign-in-vue .vue-signin {
    border-radius: 8px;
    border: 1px solid #dadce0;
    display: block;
    height: auto;
    min-height: 200px;
    width: 450px;
    padding: 25px;
    background: #fff;
    box-shadow: 0 2px 4px rgb(0 0 0 / 7%), 0 4px 5px rgb(0 0 0 / 6%), 0 1px 10px rgb(0 0 0 / 10%);
}

.sign-in-vue .form-loading {
    opacity: 0.8;
    pointer-events: none;
}

.sign-in-vue .anchor-like-button.p-5 {
    padding: 5px !important;
}

.sign-in-vue .anchor-like-button {
    -webkit-border-radius: 4px;
    border-radius: 4px;
    color: var(--btn-bg-color);
    display: inline-block;
    font-weight: 500;
    letter-spacing: .25px;
    outline: 0;
    position: relative;
    background-color: transparent;
    cursor: pointer;
    font-size: inherit;
    padding: 0;
    text-align: left;
    border: 0;
    font-size: 15px;
    text-transform: capitalize;
}

.sign-in-vue .button-like-padding {
    padding: 10px 5px;
}

.sign-in-vue .margin-captcha {
    margin: 15px auto;
    text-align: center;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.sign-in-vue .create-account-hover:hover {
    background: var(--anchor-bg-hover-color);
    color: var(--anchor-hover-color);
}

input:-webkit-autofill,
input:-webkit-autofill:focus textarea:-webkit-autofill,
input:-webkit-autofill:hover,
select:-webkit-autofill,
select:-webkit-autofill:focus,
select:-webkit-autofill:hover,
textarea:-webkit-autofill:hover textarea:-webkit-autofill:focus {
    -webkit-box-shadow: inset 0 0 0 1000px #fff !important;
}

.sign-in-vue .has-error .form-control {
    border-color: var(--error-border-color) !important;
}

.sign-in-vue .form-control {
    background: transparent;
    min-height: 50px;
    margin: 0;
    border-radius: 0;
}

.sign-in-vue .button-boxshadow {
    border-radius: 10px;
    color: var(--btn-text-color);
    display: inline-block;
    font-weight: 700;
    overflow: hidden;
    text-align: center;
    text-decoration: none;
    transition-duration: .2s;
    transition-property: transform, box-shadow, width, height;
    transition-timing-function: ease;
    z-index: 1;
}

.sign-in-vue .mainHeading {
    text-align: center;
    color: var(--main-heading-text-color);
    margin: 0 0 50px 0;
    letter-spacing: 1px;
    position: relative;
    font-size: 2em !important;
}

.sign-in-vue .forget-password {
    color: var(--anchor-color);
}

.__inner-sliding-cont {
    position: relative;
    min-height: 350px;
    max-width: 450px;
    width: 450px;
}

.__inner-sliding-cont .sliding {
    transition: 1s;
}

.w3-animate-opacity {
    animation: opac 0.8s;
}

.w3-animate-left {
    position: relative;
    animation: animateleft 0.4s
}

@keyframes animateleft {
    from {
        left: -450px;
        opacity: 0
    }
    to {
        left: 0;
        opacity: 1
    }
}

.w3-animate-right {
    position: relative;
    animation: animateright 0.4s
}

@keyframes animateright {
    from {
        right: -450px;
        opacity: 0
    }
    to {
        right: 0;
        opacity: 1
    }
}

.sign-in-vue .help-block.help-block-error {
    color: var(--error-text-color) !important;
    margin-bottom: 0px;
}

.sign-in-vue .has-error .control-label {
    color: var(--error-text-color) !important;
}

.sign-in-vue .help-block.help-block-error:first-letter {
    text-transform: uppercase;
}

.sign-in-vue .inputIconRight {
    background: transparent;
    position: absolute;
    top: 0;
    right: 10px;
    height: 50px;
    width: 20px;
    line-height: 3em !important;
}

.sign-in-vue .alert-danger.inputIconRight {
    transition: transform .2s;
    transform: scale(0);
}

.sign-in-vue .input-block.has-error .alert-danger.inputIconRight {
    transform: scale(1);
    background: none;
}

.sign-in-vue .otp-input {
    width: 40px;
    height: 40px;
    padding: 5px;
    margin: 0 0px;
    font-size: 20px;
    border-radius: 0px !important;
    border: 1px solid rgba(0, 0, 0, 0.3);
    text-align: center;
}

.sign-in-vue .inputIconRight i.fa {
    cursor: pointer;
}


.sign-in-vue .password-req-msg span.fa {
    margin-right: 5px;
    font-size: 18px;
}

.sign-in-vue .valid-message span.fa-check-circle {
    color: green;
}

.sign-in-vue .valid-error-message span.fa-times-circle {
    color: red;
}

.sign-in-vue .tooltip.popover .popover-inner,
.sign-in-vue .popover {
    max-width: 100%;
}

.sign-in-vue .loginButton:HOVER {
    background: var(--btn-bg-color);
    color: var(--btn-text-color);
}

.sign-in-vue label {
    float: left;
    margin-bottom: 5px !important;
    padding-bottom: 0px !important;
    float: left;
    margin-bottom: 5px !important;
    padding-bottom: 0px !important;
    color: #333333;
    font-weight: 700;
}

.sign-in-vue .loginButton {
    padding: 17px 20px !important;
    border: 0px;
    color: var(--btn-text-color);
    font-size: 15px;
    text-transform: uppercase;
    background: var(--btn-bg-color);
    BORDER-RADIUS: 0PX;
}

.sign-in-vue .margin-0 {
    margin: 0px;
}

.sign-in-vue .p-format {
    color: #777777;
}

.sign-in-vue .margin-25-t-b {
    margin: 25px 0px;
}

.sign-in-vue .form-control-contact {
    color: black;
}

.sign-in-vue .margin-b-25 {
    margin: 0px 0px 25px 0px;
}

@media only screen and (max-width: 767px) {
    .__inner-sliding-cont,
    .sign-in-vue .vue-signin,
    .w-100-xs {
        width: 100%;
    }
}
