:root {
    --bs-primary: #50af46;
}

body, html{
    height:100%
}

body {
    font-weight: 400;
    font-size: 14px;
    margin: 0;
    padding: 0;
}

.main_box {
    height: calc(100% - 120px);
}

/*****new page css start******/
.confirm_form h3 {
    color: #0067b1;
}

.confirm_form input {
    border-width: 1.5px;
}

.confirm_form .btn-primary {
    background-color: #0067b1;
    border-color: #034d82;
}

.no-repeat {
    background-repeat: no-repeat;
}

.fixed-top{
    height:77px;
}
/* NEW LOGIN PAGE STYLE */
.rounded-4 {
    border-radius: 1.5rem !important;
}

.rounded-3 {
    border-radius: 1rem !important;
}

.sidebar-option {
    display: flex;
    gap: 15px;
}

    .sidebar-option .sidebar-indicator {
        width: 6px;
        border-top-right-radius: 12px;
        border-bottom-right-radius: 10px;
        position: absolute;
        left: -24px;
        height: 49px;
        top: 0;
    }

    .sidebar-option li {
        padding: 13px 10px;
        font-size: 14px;
    }

        .sidebar-option li svg {
            width: 30px;
        }

.text-primary {
    color: var(--bs-primary);
}

.sidebar-option.active {
    color: var(--bs-primary);
    font-weight: 600;
}

    .sidebar-option.active .sidebar-indicator {
        background-color: var(--bs-primary);
    }

.dropdown-item {
    border-radius: 10px !important;
}

.profile-img {
    width: 20px;
    height: 20px;
    object-fit: cover;
    border-radius: 50%;
}

.dz-clickable .fileUploadHandler{
    display:none
}

#dvProfilePicMain2 .profile-img {
    width: 100px;
    height: 100px;
}
    .dashboard {
    width: 100%;
    height: 100%;
    min-height: 100vh;
}

.main{
    flex:1
}
.main-content {
    flex: 1;
}

.sidebar-width {
    width: 220px;
}

.text-dark {
    color: #343C6A !important;
}

.sidebar {
    position: relative;
    background-color: #F5F7FA;
}

.bg-light-blue {
    background-color: #E6EFF5;
}

.navbar {
    background-color: #E6EFF5;
}

footer {
    background-color: #E6EFF5;
}

a {
    text-decoration: none;
    color: inherit;
}


/* fonts */

@font-face {
    font-family: 'Font';
    src: url('../webfonts/Poppins-Regular.ttf');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Font';
    src: url('../webfonts/Poppins-SemiBold.ttf');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'Font';
    src: url('../webfonts/Poppins-Bold.ttf');
    font-weight: 700;
    font-style: normal;
}

/* root styles */

html {
    font-size: 16px;
}

body {
    margin: 0;
    font-family: 'Font', sans-serif;
    font-size: var(--bs-body-font-size);
    font-weight: var(--bs-body-font-weight);
    line-height: var(--bs-body-line-height);
    color: #2F353D;
    text-align: var(--bs-body-text-align);
    background-color: var(--bs-body-bg);
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.normal {
    font-size: 1rem !important;
}

.small {
    font-size: 0.875rem !important;
}

.smaller {
    font-size: 0.75rem !important;
}

.large {
    font-size: 1.25rem !important;
}

.larger {
    font-size: 1.5rem !important;
}

.singleInput {
    position: relative;
}

    .singleInput .inputIcon {
        position: absolute;
        cursor: pointer;
        right: 1rem;
        top: 70%;
        transform: translate(0, -50%);
        -webkit-transform: translate(0, -50%);
        -moz-transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        -o-transform: translate(0, -50%);
    }

.googleLogin button {
    color: rgba(0, 0, 0, 0.54);
    font-family: "Roboto", sans-serif;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    padding: 15px 51px;
    border-radius: 20px;
    background: #FFF;
    box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.08), 0px 2px 3px 0px rgba(0, 0, 0, 0.17);
    text-align: center;
    max-width: 320px;
}

.googleLogin img {
    margin-right: 12px;
}

.orContainer {
    display: flex;
    align-items: center;
    text-align: center;
    padding-top: 12px;
}

    .orContainer::before,
    .orContainer::after {
        content: '';
        flex: 1;
        border-bottom: 1px solid #E2E1E1;
        margin: 0 10px;
    }

.orBar {
    display: inline-block;
    padding: 0 10px;
    color: #515C6B;
}
.btn-primary {
    color: #fff;
    background-color: #50AF46;
    border-color: #50AF46;
}

.sectionTitleBox {
    border-bottom: 2px solid #D9D9D9;
    padding-bottom: 11px;
    padding-left: 63px;
}

    .sectionTitleBox .sectionTitle {
        color: #50AF46;
        font-family: "Inter", sans-serif;
        font-size: 20px;
        font-style: normal;
        font-weight: 700;
        padding-bottom: 5px;
    }

.multiTabs {
    padding-top: 25px;
    padding-left: 63px;
    max-width: fit-content;
}
.row.multiTabs-content {
    padding-top: 0;
    padding-left: 27px;
}
    .multiTabs .nav-item a.nav-link {
        color: rgba(141, 141, 153, 0.75);
        font-family: "Inter", sans-serif;
        font-size: 20px;
        font-style: normal;
        font-weight: 700;
        padding: 23px 10px;
        padding-bottom: 15px;
        background: transparent !important;
        border-radius: 0;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        -ms-border-radius: 0;
        -o-border-radius: 0;
    }

    .multiTabs .nav-item a.nav-link.active {
        color: #01060F;
        border-bottom: 8px solid #50AF46;
    }

    .multiTabs .nav {
        border-radius: 10px;
        background: #E6EFF5;
        padding: 0 23px;
    }

    .multiTabs .nav-item {
        padding-right: 55px;
    }

        .multiTabs .nav-item:last-child {
            padding-right: 0;
        }

.multiTabs-content .singleInput {
    max-width: 464px;
    margin-bottom: 15px;
}

    .multiTabs form {
        padding-top: 20px;
    }

.multiTabs-content .singleInput .form-control {
    color: #000;
    padding: 18px 24px;
    border: 1px solid #000;
    background: #FFF;
    font-family: "Inter", sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
}

    .multiTabs-content .singleInput .form-control:read-only {
        border-radius: 12px;
        border: 1px #E2E1E1;
        background: #C5C5CF;
        cursor: not-allowed;
        color: #000;
    }

    .multiTabs-content .singleInput .form-control:focus {
        box-shadow: none;
    }

.multiTabs-content .singleInput label {
    color: #8D8D99;
    font-family: "Inter", sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    padding-bottom: 14px;
}

.multiTabs-content .singleInput .btn {
    color: #FFF;
    text-align: center;
    font-family: "Inter", sans-serif;
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    border-radius: 26px;
    border: 1px #E2E1E1;
    padding: 15px 25px;
    box-shadow: 0px 1px 10px 0px rgba(2, 202, 171, 0.36);
    -webkit-border-radius: 26px;
    -moz-border-radius: 26px;
    -ms-border-radius: 26px;
    -o-border-radius: 26px;
}

#deleteAccount .innerWarningTitle {
    color: #01060F;
    font-family: "Inter", sans-serif;
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: 29px;
    max-width: 443px;
    padding-bottom: 50px;
}

#deleteAccount .delteAccountBtn {
    margin-top: 107px;
    background: #EA4335;
}


@media (max-width: 960px) {
    /*tablet classes*/
    .sidebar {
        position: absolute;
    }

    .btn-dropdown {
        font-size: 14px;
    }

    .multiTabs {
        padding-top: 25px;
        padding-left: 0;
        max-width: fit-content;
    }

    .sectionTitleBox {
        padding-left: 0;
    }
}


/* END NEW PAGE STYLE */

/*****Login page css End******/
/*****footer css Start*******/
.footer {
    background: #b3b3b3;
}
/*****footer css end********/
.sidebar {
    background: #F5F7FA;
    width: 220px;
    height:100%;
}

    .sidebar ul li a {
        display: block;
        padding: 13px 10px;
        color: #2f353d;
        text-decoration: none;
    }

        .sidebar ul li a.active,
        .sidebar ul li a:hover {
            color:var(--bs-primary);
            text-decoration: none;
        }

.select-role {
    background: transparent;
    border: 1px solid #fff;
    color: #fff;
    border-radius: 4px;
    padding: 0 3px;
    min-height: 38px;
    line-height: 38px;
    margin-right: 10px;
}

    .select-role option {
        color: #000;
    }

.main-content {
}

@media(max-width:768px) {
    .navbar-nav .nav-item {
        border: 0 !important;
    }
}

@media(max-width: 767px) {
    .sidebar {
        position: absolute;
        padding: 0;
        z-index: 1031;
        transition: all 0.3s ease;
    }

    .select-role {
        width: 100%;
    }
}


/*
    For Top bar and Left Bar color
   
*/

.top-bar-color {
    background-color: #E6EFF5;
}

.left-menu-bar-color {
    background-color: #F5F7FA;
}

login_form .GoogleLogin a {
    color: #fff !important;
}


/*Google login Button*/
/*Reference link: https://codepen.io/mupkoo/pen/YgddgB */
.login-with-google-btn {
    transition: background-color 0.3s, box-shadow 0.3s;
    padding: 12px 16px 12px 42px;
    border: none;
    border-radius: 3px;
    box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.04), 0 1px 1px rgba(0, 0, 0, 0.25);
    color: #757575;
    font-size: 14px;
    font-weight: 500;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTgiIGhlaWdodD0iMTgiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBkPSJNMTcuNiA5LjJsLS4xLTEuOEg5djMuNGg0LjhDMTMuNiAxMiAxMyAxMyAxMiAxMy42djIuMmgzYTguOCA4LjggMCAwIDAgMi42LTYuNnoiIGZpbGw9IiM0Mjg1RjQiIGZpbGwtcnVsZT0ibm9uemVybyIvPjxwYXRoIGQ9Ik05IDE4YzIuNCAwIDQuNS0uOCA2LTIuMmwtMy0yLjJhNS40IDUuNCAwIDAgMS04LTIuOUgxVjEzYTkgOSAwIDAgMCA4IDV6IiBmaWxsPSIjMzRBODUzIiBmaWxsLXJ1bGU9Im5vbnplcm8iLz48cGF0aCBkPSJNNCAxMC43YTUuNCA1LjQgMCAwIDEgMC0zLjRWNUgxYTkgOSAwIDAgMCAwIDhsMy0yLjN6IiBmaWxsPSIjRkJCQzA1IiBmaWxsLXJ1bGU9Im5vbnplcm8iLz48cGF0aCBkPSJNOSAzLjZjMS4zIDAgMi41LjQgMy40IDEuM0wxNSAyLjNBOSA5IDAgMCAwIDEgNWwzIDIuNGE1LjQgNS40IDAgMCAxIDUtMy43eiIgZmlsbD0iI0VBNDMzNSIgZmlsbC1ydWxlPSJub256ZXJvIi8+PHBhdGggZD0iTTAgMGgxOHYxOEgweiIvPjwvZz48L3N2Zz4=);
    background-color: white;
    background-repeat: no-repeat;
    background-position: 12px 11px;
}

    .login-with-google-btn:hover {
        box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.04), 0 2px 4px rgba(0, 0, 0, 0.25);
    }

    .login-with-google-btn:active {
        background-color: #eeeeee;
    }

    .login-with-google-btn:focus {
        outline: none;
        box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.04), 0 2px 4px rgba(0, 0, 0, 0.25), 0 0 0 3px #c8dafc;
    }

    .login-with-google-btn:disabled {
        filter: grayscale(100%);
        background-color: #ebebeb;
        box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.04), 0 1px 1px rgba(0, 0, 0, 0.25);
        cursor: not-allowed;
    }

/*End Google loin button*/

.m-or-divider {
    width: 100%;
    margin: 5px 0;
    position: relative;
}

.m-or-divider--or {
    text-transform: uppercase;
    margin: 0 auto;
    display: block;
    height: 30px;
    width: 30px;
    border-radius: 15px;
    border: 1px solid #e6e6e6;
    text-align: center;
    padding: 10px 0;
    font-size: 10px;
    position: relative;
    z-index: 1;
    background: #fff;
    color: grey;
}

.m-or-divider--rule {
    width: 100%;
    height: 1px;
    background: #e6e6e6;
    position: absolute;
    left: 0;
    top: 50%;
    z-index: 0;
}


.form-control.is-valid, .was-validated .form-control:valid {
    /*border-color: #198754;
    padding-right: calc(1.5em + .75rem);*/
    /*background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23198754' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e");*/
    /*background-repeat: no-repeat;*/
    background-position: right calc(1.375em + .1875rem) center !important;
    /*background-size: calc(0.75em + .375rem) calc(8.75em + 11.375rem);*/
}

.form-control.is-invalid, .was-validated .form-control:invalid {
    background-position: right calc(1.375em + 0.1875rem) center !important;
}

.hideElement {
    display: none;
}

.disabled-bg-color {
    background-color: #e9ecef;
}

.icon-gray {
    color: #cccccc;
}

.top-home-link {
    position: absolute;
    top: 10px;
    background-color: transparent;
}