@import url(https://fonts.googleapis.com/css?family=Nunito);
@import url(https://fonts.googleapis.com/css?family=Nunito+Sans);

body {
    margin: 0;
    padding: 0;
    height: 100vh;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    /* background: -webkit-gradient(linear, right top, left bottom, from(#216e93), color-stop(#21648a), color-stop(#1f5881), color-stop(#172d5b), to(#191c51));
    background: -webkit-linear-gradient(top right, #216e93, #21648a, #1f5881, #172d5b, #191c51);
    background: -o-linear-gradient(top right, #216e93, #21648a, #1f5881, #172d5b, #191c51);
    background: linear-gradient(to bottom left, #216e93, #21648a, #1f5881, #172d5b, #191c51); */
    background-color: #fff;
    /* background-color: #cdd6df60 !important; */
    overflow: auto;
    color: #fff;
}

@font-face {
    font-family: Nunito Sans Light;
    font-style: normal;
    font-weight: 300;
    src: local("Nunito Sans Light"), local("NunitoSans-Light"), url(https://fonts.gstatic.com/s/nunitosans/v3/pe03MImSLYBIv1o4X1M8cc8WAc5tU1ECVZl_.woff2) format("woff2");
    unicode-range: u+00??, u+0131, u+0152-0153, u+02bb-02bc, u+02c6, u+02da, u+02dc, u+2000-206f, u+2074, u+20ac, u+2122, u+2191, u+2193, u+2212, u+2215, u+feff, u+fffd
}

@font-face {
    font-family: Nunito Sans Regular;
    font-style: normal;
    font-weight: 400;
    src: local("Nunito Sans Regular"), local("NunitoSans-Regular"), url(https://fonts.gstatic.com/s/nunitosans/v3/pe03MImSLYBIv1o4X1M8cc8WAc5tU1ECVZl_.woff2) format("woff2");
    unicode-range: u+00??, u+0131, u+0152-0153, u+02bb-02bc, u+02c6, u+02da, u+02dc, u+2000-206f, u+2074, u+20ac, u+2122, u+2191, u+2193, u+2212, u+2215, u+feff, u+fffd
}

@font-face {
    font-family: Nunito Sans Semi-bold;
    font-style: normal;
    font-weight: 600;
    src: local("Nunito Sans Semi-bold"), local("NunitoSans-Semi-bold"), url(https://fonts.gstatic.com/s/nunitosans/v3/pe03MImSLYBIv1o4X1M8cc8WAc5tU1ECVZl_.woff2) format("woff2");
    unicode-range: u+00??, u+0131, u+0152-0153, u+02bb-02bc, u+02c6, u+02da, u+02dc, u+2000-206f, u+2074, u+20ac, u+2122, u+2191, u+2193, u+2212, u+2215, u+feff, u+fffd
}

@font-face {
    font-family: Nunito Sans Bold;
    font-style: normal;
    font-weight: 700;
    src: local("Nunito Sans Bold"), local("NunitoSans-Bold"), url(https://fonts.gstatic.com/s/nunitosans/v3/pe03MImSLYBIv1o4X1M8cc8WAc5tU1ECVZl_.woff2) format("woff2");
    unicode-range: u+00??, u+0131, u+0152-0153, u+02bb-02bc, u+02c6, u+02da, u+02dc, u+2000-206f, u+2074, u+20ac, u+2122, u+2191, u+2193, u+2212, u+2215, u+feff, u+fffd
}

.auth-title {
    font-size: 3rem;
    font-weight: bold;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}

.otp-title {
    font-size: 1.6rem;
    color: #004f95;
    font-weight: bold;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}

.card {
    margin-top: 50px;
    /* background-color: #001a77ef; */
    border-radius: 4px;
    overflow: hidden;
    border: none;
    /* color: #fff; */
}

.card-header {
    /* color: #fdfdfd; */
    background-color: #fff;
    color: #004f95;
    font-family: Nunito Sans Light;
    font-size: 17px;
    padding: 7px 15px;
    border: none;
    /* border-bottom: 2px solid rgba(0, 0, 0, .2) */
}

.img-fluid{
    height: 7rem;
}

input[type=text] {
    width: 100%;
    padding: 12px 20px;
    box-sizing: border-box;
    border: none;
    background-color: #e3dfdf;
    color: #004f95;
}

input[type=password] {
    width: 100%;
    padding: 12px 20px;
    box-sizing: border-box;
    border: none;
    background-color: #e3dfdf;
    color: #004f95;
}

input[type=text]:focus {
    background-color: #e3dfdf;
    color: #004f95;
}

input[type=password]:focus {
    background-color: #e3dfdf;
    color: #004f95;
}

.form-label {
    color: #004f95;
}

input[type=text]::placeholder {
    color: #004f95;
}

input[type=password]::placeholder {
    color: #004f95;
}

.btn-primary {
    margin-top: 1rem;
    background-color: #004f95 !important;
    width: 18rem;
}

.link {
    color: #004f95 !important;
}

.input-group-text{
    background-color: #e3dfdf;
}

form .input-field {
    flex-direction: row;
    column-gap: 10px;
}

.input-field input {
    height: 45px;
    width: 42px;
    border-radius: 6px;
    outline: none;
    font-size: 1.125rem;
    text-align: center;
    border: 1px solid #ddd;
}

.input-field input:focus {
    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1);
}

.input-field input::-webkit-inner-spin-button,
.input-field input::-webkit-outer-spin-button {
    display: none;
}

@media (min-width: 320px) and (max-width: 425px) {
    .btn-primary {
        margin-top: 1rem;
        background-color: #004f95 !important;
        width: 17rem;
    }
}