:root {
    --bg-color: #f5f6f7;
    --primary-color: #0e75bd;
    --secondary-color: #eb2f2a;
    --green-color: #7fc343;
    --grey-color: #444444;
    --border-color: #ddd;
    --black-color: #000;
    --white-color: #fff;
    --step-bar-color: #D0E1F9;
}

html,
body {
    font-family: 'Poppins', sans-serif;
    color: var(--grey-color);
    background-color: var(--bg-color);
    margin: 0px;
    padding: 0px;
    font-size: 15px;
}

a {
    color: var(--primary-color);
    transition: all 0.3s;
    text-decoration: none;
}

a:hover {
    color: var(--primary-color);
    text-decoration: none;
}

ul {
    margin: 0px;
    padding: 0px;
}

ul li {
    list-style: none;
}

.bg-color {
    background-color: var(--bg-color)
}

.bg-blue {
    background-color: var(--primary-color);
}

.bg-white {
    background-color: var(--white-color);
}
.bg-green {
    background-color: var(--green-color);
}

.blue-text {
    color: var(--primary-color) !important;
}

.grey-text {
    color: var(--grey-color) !important;
}

.red-text {
    color: var(--secondary-color) !important;
}
.green-text {
    color: var(--green-color) !important;
}

.white-text {
    color: var(--white-color) !important;
}

.black-text {
    color: var(--black-color) !important;
}

.light-text {
    font-weight: 300;
}

.regular-text {
    font-weight: 400;
}

.medium-text {
    font-weight: 500;
}

.semibold-text {
    font-weight: 600;
}

.bold-text {
    font-weight: 700;
}

.font-12 {
    font-size: 0.75rem;
    /* 12px */
}

.font-13 {
    font-size: 0.815rem;
    /* 13px */
}

.font-14 {
    font-size: 0.875rem;
    /* 14px */
}

.font-15 {
    font-size: 0.94rem;
    /* 15px */
}

.font-16 {
    font-size: 1rem;
    /* 16px */
}

h1, h2, h3, h4, h5, h6, p, ul {
    margin: 0px;
    padding: 0px;
}

h1 {
    font-size: 2.5rem; /* 40px */
}

h2 {
    font-size: 2.189rem;  /* 35px */
}

h3 {
    font-size: 1.5rem;  /* 24px */
}

h4 {
    font-size: 1.375rem;  /* 22px */
}

h5 {
    font-size: 1.25rem;  /* 20px */
}

/* h6 {
    font-size: 1.125rem; 18px
} */

b {
    font-weight: 600;
}

.form-group {
    margin-bottom: 15px;
}


label.form-label {
    width: 100%;
    font-weight: 600;
}

.form-check-input:checked {
    background-color: var(--secondary-color);
    border-color: var(--secondary-color);
}
.form-check-input:focus {
    box-shadow:0 0 0 0.25rem rgb(235 47 42 / 22%);
}

.form-control:hover,
.form-control:focus {
    box-shadow: 0px 12px 20px rgb(0 0 0 / 6%) !important;
}


.btn-outline-secondary {
    color: var(--secondary-color);
    border-color: var(--secondary-color)
}

.btn-outline-secondary:hover {
    color: var(--white-color);
    background-color: var(--secondary-color);
    border-color: var(--secondary-color)
}

.btn-check:focus+.btn-outline-success,
.btn-outline-success:focus {
    box-shadow: 0 0 0 .25rem rgba(234, 47, 42, .5)
}

.btn-primary {
    color: var(--white-color);
    background-color: var(--green-color);
    border-color: var(--green-color)
}

.btn-primary:hover {
    color:  var(--green-color);
    background-color: var(--white-color);
    border-color: var(--green-color)
}

.btn-check:focus+.btn-primary,
.btn-primary:focus {
    color: var(--white-color);
    background-color: var(--primary-color);
    border-color: var(--primary-color);
    box-shadow: 0 0 0 .25rem rgba(49, 132, 253, .5)
}

.btn-secondary {
    color: var(--white-color);
    background-color: var(--secondary-color);
    border-color: var(--secondary-color);
}

.btn-secondary:hover {
    color: var(--secondary-color);
    background-color: var(--white-color); 
    border-color: var(--secondary-color);
}

.btn:focus {
    outline: none !important;
    box-shadow: none !important;
}


/*--------------------------------------------------------------
# Header
--------------------------------------------------------------*/
#header {
    box-shadow: 0px 0px 15px 0px rgb(0 0 0 / 10%);
    z-index: 997;
    transition: all 0.5s;
    background: var(--white-color);
    border-bottom: 2px solid #dfc28b;
}

#header .navbar-brand img {
    width: 180px;
}

#header .nav-link {
    color: var(--grey-color);
}


/*--------------------------------------------------------------
# Login
--------------------------------------------------------------*/
.login {
    background-image: url(../img/bg-login.jpg);
    background-repeat: no-repeat;
    background-size: contain;
    min-height: calc(100vh - 85px);
    padding: 60px 0px;
    background-attachment: fixed;
    display:flex;
    align-items:center;
    margin:auto;

}
/*.login {
    background-image: url(../img/bg-login.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    min-height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 30px 15px;
   // margin: auto;
}

    .login .login-wrapper {
        background-color: #fff;
        padding: 30px;
        border-radius: 8px;
        width: 100%;
        max-width: 450px;
        box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
        text-align: center;
    }
*/