﻿:root {
    --primary-color: #33A8EB;
    --pr-green: #17AC1E;
    --pr-darkgreen: #1b9321;
    --pr-lightgreen: #3EFF46;
    --dark-text: #010101;
    --light-text: #646482;
    --white-text: #fff;
}

* {
    margin: 0px;
    padding: 0px;
    box-sizing: border-box;
}

html {
    font-size: 16px;
    height: 100%;
}

body {
    font-size: 1rem;
    font-family: 'Open Sans', sans-serif;
    color: var(--dark-text);
    min-height: 100%;
    position: relative;
}

ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

a, button {
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
}

    a, a:hover, a:focus, input:focus, button:focus, .form-control:focus, .form-select:focus {
        text-decoration: none;
        outline: none !important;
        box-shadow: none !important;
    }

img {
    max-width: 100%;
}

.container {
    max-width: 1450px;
    width: 95%;
}

.btn-primary {
    background: var(--pr-green);
    font-size: 0.9rem;
    border-radius: 4px;
    border-color: var(--pr-green);
    padding: 10px 25px;
}

    .btn-primary:hover, .btn-primary:focus {
        background: var(--pr-darkgreen);
        border-color: var(--pr-darkgreen);
    }

section {
    display: inline-block;
    width: 100%;
}

.modal {
    backdrop-filter: blur(4px);
}

.modal-content {
    border-radius: 20px;
}
/*================== Header ====================*/
header.main-header {
    position: relative;
    z-index: 1;
}

header.main-header {
    position: relative;
    z-index: 99;
    /*    background: #071819;*/
}

a.close-collapse, a.collapse-logo {
    display: none;
}

.headCot {
    width: 100%;
    display: inline-block;
    background: #071819;
    position: relative;
    margin-bottom: 20px;
}

    .headCot:before {
        content: '';
        position: absolute;
        left: 0;
        right: 0;
        width: 60%;
        height: 100%;
        background: url('../images/headerbg.png')no-repeat;
        background-size: 100%;
        z-index: 0;
    }

    .headCot:after {
        content: '';
        position: absolute;
        right: 0;
        bottom: 0;
        width: 30%;
        height: 100%;
        background: url('../images/homeBanner.png')no-repeat;
        background-size: 100%;
        z-index: 0;
        background-position: bottom center;
        filter: hue-rotate(75deg);
    }

nav.navbar {
    padding: 20px 0;
}

a.navbar-brand {
    width: 180px;
}

    a.navbar-brand img {
        max-height: 50px;
    }

ul.subNav {
    position: absolute;
    top: 90%;
    width: 160px;
    background: #1a3637;
    padding: 10px;
    border-radius: 6px;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
}

.nav-item:hover .subNav {
    top: 100%;
    opacity: 1;
    visibility: visible;
}

ul.subNav a {
    display: inline-block;
    width: 100%;
    padding: 5px 0;
    margin: 0 !important;
}

ul.subNav li + li a {
    border-top: 1px solid #2e494a;
}

.right-nav ul a, .main-header .nav-item {
    position: relative;
}

    .right-nav ul a:before, .main-header .nav-item:before {
        width: 0px;
        left: 0px;
        transition: all 0.3s ease-in-out;
        -webkit-transition: all 0.3s ease-in-out;
        -moz-transition: all 0.3s ease-in-out;
        height: 2px;
        background: var(--pr-lightgreen);
        position: absolute;
        content: '';
        bottom: 0;
    }

    .right-nav ul a:hover:before, .main-header .nav-item:hover:before {
        left: 20%;
        width: 60%;
    }

.main-header .navbar-nav a {
    font-weight: 500;
    color: var(--white-text);
    margin: 0 1rem;
    font-size: 0.9rem;
}

.navbar-nav {
    margin-left: auto;
}

.home-banner {
    display: inline-block;
    width: 100%;
    padding: 20px 0 100px;
    position: relative;
    z-index: 1;
}

    .home-banner:before {
        content: '';
        position: absolute;
        bottom: -10px;
        height: 20px;
        width: 100%;
        right: 0;
        background: #17ac1e70;
    }

    .home-banner .container {
        display: flex;
        align-items: flex-start;
    }

.bannerContent {
    flex: 1;
}

.right-nav a {
    font-size: 0.9rem;
    padding: 5px 20px;
}

.right-nav .btnOpc {
    background: #3EFF4620;
    color: var(--white-text);
    border: 1px solid #3EFF4640;
}

.right-nav .btn-blank {
    color: var(--white-text);
}

    .right-nav .btn-blank i {
        color: var(--pr-lightgreen);
        margin-right: 3px;
        margin-left: 0;
    }

.bannerContent h2 {
    font-size: 3rem;
    max-width: 500px;
    margin-top: 30px;
    color: var(--white-text);
}

ul.bannerCreds {
    display: flex;
    margin: 60px 0 20px;
    text-align: center;
}

    ul.bannerCreds li {
        min-width: 160px;
        color: var(--white-text);
        font-size: 0.8rem;
    }

        ul.bannerCreds li img {
            margin-bottom: 10px;
            height: 30px;
        }

        ul.bannerCreds li span {
            color: var(--pr-lightgreen);
        }

.bannerContent > p {
    font-size: 1.2rem;
    color: var(--white-text);
    opacity: 0.8;
    margin-bottom: 30px;
}

button.btnBanner {
    padding: 10px 20px;
    min-width: 220px;
    border-radius: 6px;
    background: #3EFF4620;
    color: var(--white-text);
    border: 1px solid var(--pr-lightgreen);
    ;
    text-align: left;
}

    button.btnBanner:hover {
        background: #3EFF4690;
    }

    button.btnBanner i {
        float: right;
        position: relative;
        top: 5px;
    }

.bannerForm {
    width: 400px;
    background: rgba(255,255,255,0.1);
    padding: 40px 20px;
    border-radius: 6px;
    backdrop-filter: blur(5px);
    margin: 30px 0 20px;
}

.formTitle {
    display: flex;
    justify-content: space-between;
    width: 100%;
    margin-bottom: 20px;
}

.bannerForm h3 {
    color: var(--white-text);
    font-size: 1.2rem;
    font-weight: 600;
}

    .bannerForm h3 span {
        color: var(--pr-lightgreen);
        font-size: 0.9rem;
        display: block;
    }

.bannerForm .form-group {
    display: inline-block;
    width: 100%;
    margin-bottom: 20px;
}

.bannerForm input, .bannerForm select {
    color: var(--white-text);
    height: 45px;
    background-color: #ffffff40;
    border: 1px solid #ffffff40;
}

.bannerForm .form-control::-webkit-input-placeholder {
    color: #fff !important;
}

.bannerForm .form-control:-ms-input-placeholder {
    color: #fff !important;
}

.bannerForm .form-control::placeholder {
    color: #fff !important;
}

.formBtn .btn {
    width: 100%;
    font-size: 1rem;
    color: #000;
    text-transform: uppercase;
    background: var(--pr-lightgreen);
    font-weight: 400;
}

/*=================== Mid Section =======================*/

.midHomeBlock {
    padding: 40px 0;
}

    .midHomeBlock .nav-link {
        background: #FBFBFB;
        border: 1px solid #fbfbfb;
        width: 100%;
        color: #7A7A7A;
        border-radius: 4px;
    }

    .midHomeBlock .nav-tabs {
        display: flex;
        margin: 0 -5px;
        border: none;
    }

    .midHomeBlock .nav-item {
        flex: 1;
        padding: 5px;
    }

    .midHomeBlock .nav-link.active {
        background: var(--pr-green);
        border: 1px solid var(--pr-green);
        color: #fff;
    }

    .midHomeBlock .accordion-header {
        padding: 0;
        border-radius: 4px;
        margin-bottom: 0px;
        border: none;
        background: none;
    }


        .midHomeBlock .accordion-header button:not(.collapsed) {
            background: #17ac1e20;
            border-color: #17ac1e50;
            color: #0a6b0e;
        }

        .midHomeBlock .accordion-header button {
            padding: 8px 15px 8px;
            text-decoration: none;
            width: 100%;
            text-align: left;
            color: #777;
            background: #f2f2f2;
            border-radius: 4px;
            box-shadow: none !important;
            position: relative;
        }

            .midHomeBlock .accordion-header button:before {
                content: '\f107';
                font-family: 'Font Awesome 5 Pro';
                width: 20px;
                height: 20px;
                float: right;
            }

            .midHomeBlock .accordion-header button:not(.collapsed):before {
                content: '\f106';
                font-family: 'Font Awesome 5 Pro';
                width: 20px;
                height: 20px;
                float: right;
            }

    .midHomeBlock .accordion-item {
        border: none;
        margin: 5px 0px 10px;
    }

    .midHomeBlock .accordion-body {
        padding: 5px;
    }

.fundList {
    max-height: 280px;
    overflow-y: auto;
}

    .fundList li {
        display: flex;
        width: 100%;
        padding: 10px 0;
        border-bottom: 1px dashed #ddd;
        justify-content: space-between;
    }

.fundDesc {
    display: flex;
    align-items: center;
}

    .fundDesc img {
        width: 30px;
    }

    .fundDesc h4 {
        font-size: 0.9rem;
        color: #111;
        margin-left: 15px;
    }

        .fundDesc h4 span {
            display: block;
            color: #888;
        }

.fundPerc {
    font-weight: 600;
}

    .fundPerc.high {
        color: #06B85F;
    }

    .fundPerc.low {
        color: #AC8417;
    }

.midTitle {
    font-size: 28px;
    font-weight: bold;
    margin-bottom: 5px;
}

    .midTitle span {
        color: var(--pr-green);
    }

.aboutMidBlock {
    display: inline-block;
    width: 100%;
    padding-left: 30px;
}

ul.listAngle {
    margin: 30px 0;
}

    ul.listAngle li {
        position: relative;
        margin-bottom: 10px;
    }

        ul.listAngle li:before {
            content: '\f105';
            font-family: 'Font Awesome 5 Pro';
            margin-right: 10px;
        }

    ul.listAngle.listAngleCircle li:before {
        content: '\f138';
        font-weight: 200;
        font-size: 0.8rem;
    }

ul.exList {
    display: flex;
    padding: 20px 0;
    margin: 0 -10px;
}

    ul.exList li .circle {
        width: 80px;
        height: 80px;
        margin: 0 auto 5px;
        border-radius: 100%;
        border: 10px solid;
        display: flex;
        align-items: center;
        justify-content: center;
        font-weight: 900;
        font-size: 26px;
        position: relative;
    }

    ul.exList li.greenli .circle {
        color: #17AC1E;
        border-color: #17AC1E70;
    }

    ul.exList li.blueli .circle {
        color: #17AC8E;
        border-color: #17AC8E70;
    }

    ul.exList li.brownli .circle {
        color: #AC8417;
        border-color: #AC841770;
    }

    ul.exList li.tealli .circle {
        color: #52AC17;
        border-color: #52AC1770;
    }

    ul.exList li {
        text-align: center;
        margin: 0 10px;
        font-size: 0.9rem;
    }

        ul.exList li .circle i {
            position: absolute;
            top: -11px;
            font-size: 0.6rem;
            right: -10px;
            width: 20px;
            height: 20px;
            border-radius: 100%;
            border: 2px solid;
            background: #fff;
            display: flex;
            align-items: center;
            justify-content: center;
        }

.midContact {
    display: flex;
    align-items: center;
    margin: 25px 0;
}

    .midContact h4 {
        font-size: 34px;
        font-weight: bold;
        margin-right: 25px;
        border-right: 1px dashed #ddd;
        padding-right: 20px;
        margin-bottom: 0;
        color: #17AC1E;
    }

        .midContact h4 span {
            display: block;
            font-size: 30px;
            color: #333;
        }

ul.contactList {
    display: flex;
}

    ul.contactList li {
        margin-right: 25px;
        font-size: 1.1rem;
    }

        ul.contactList li i {
            margin-right: 5px;
            opacity: 0.3;
            font-weight: 400;
        }

.serviceCot .container {
    position: relative;
    background: #194648;
    color: #fff;
    padding: 30px;
    border-radius: 20px;
    overflow: hidden;
}

    .serviceCot .container:before {
        content: '';
        position: absolute;
        bottom: 0;
        right: 0;
        width: 60%;
        height: 100%;
        background: url('../images/serviceBg.png')no-repeat;
        background-size: 100%;
        background-position: bottom;
        z-index: 0;
    }

.serviceCot {
    margin: 40px 0;
}

    .serviceCot .midTitle span {
        color: var(--pr-lightgreen);
    }

.blockTitle {
    font-size: 1.3rem;
    font-weight: bold;
}

.servLeft {
    border-right: 1px dashed #ffffff50;
}

.servRight, .servLeft {
    display: inline-block;
    padding: 40px;
    width: 100%;
    position: relative;
}

    .servRight .btn, .servLeft .btn {
        margin-top: 20px;
        min-width: 60%;
    }

    .servLeft h3, .servLeft .listAngle li:before {
        color: var(--pr-lightgreen);
    }

    .servLeft h3, .servLeft .listAngle li:before {
        color: #E3A53B;
    }

    .servLeft:before, .servRight:before {
        content: '';
        position: absolute;
        bottom: 0;
        right: 20px;
        width: 100px;
        height: 200px;
        background: url('../images/sicon-1.png')no-repeat;
        background-size: 100%;
        background-position: bottom;
        z-index: 0;
    }

    .servRight:before {
        background-image: url('../images/sicon-2.png');
    }

.btnIcon {
    display: flex;
    justify-content: space-between;
    align-items: center;
    float: left;
}

.btnOrange {
    background: #E3A53B;
    border-color: #E3A53B;
}

    .btnOrange:hover {
        color: #E3A53B;
        border-color: #E3A53B;
    }

.partnersBlock {
    margin: 30px 0;
}

a.btn-blank {
    font-size: 1rem;
    text-decoration: none;
    color: var(--pr-green);
    font-weight: normal;
}

.midTitle a.btn-blank {
    float: right;
    margin-top: 10px;
}

a.btn-blank i {
    margin-left: 20px;
}

.partnersBlock .container {
    padding: 30px 20px 10px;
    background: rgb(239,249,240);
    background: linear-gradient(180deg, rgba(239,249,240,1) 0%, rgba(255,255,255,1) 100%);
    border-radius: 6px;
}

.clientLogoList {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 50px 20px 30px;
}

footer.mainFooter {
    background: #061718;
    padding: 30px 0;
    color: #fff;
    font-size: 0.9rem;
}

a.footerLogo {
    width: 120px;
    display: inline-block;
}

.flexList {
    display: flex;
}

    .flexList li {
        margin-right: 15px;
    }

.socialList {
    font-size: 1rem;
}

    .socialList li i {
        color: #3EFF46;
    }

.mainFooter h4 {
    font-size: 1.2rem;
}

ul.contactList.footerContact li {
    font-size: 0.9rem;
    margin: 5px 0 10px;
}

ul.contactList.footerContact {
    flex-direction: column;
}

    ul.contactList.footerContact li i {
        color: var(--pr-lightgreen);
        opacity: 1;
    }

.newsletterForm {
    display: flex;
}

    .newsletterForm input {
        flex: 1;
        padding: 10px;
        border-radius: 6px;
        border: none;
        color: #fff;
        margin-right: 10px;
        background: #ffffff30;
    }

/*======== sign in modal =========*/
.loginModal .modal-dialog {
    max-width: 900px;
}

.loginModal
button.btn-close {
    position: absolute;
    right: 15px;
    top: 10px;
}

.signup-opt, .signup-fields {
    float: right;
    width: calc(50% - 1px);
    padding: 10px 50px;
}

.signup-opt {
    padding-top: 60px;
}

    .signup-opt h4 {
        display: none;
    }

    .signup-opt ul {
        width: 100%;
    }

        .signup-opt ul li {
            display: list-item;
        }

            .signup-opt ul li a {
                display: inline-block;
                width: 100%;
                border-radius: 18px;
                border: 1px solid #ddd;
                padding: 12px 20px;
                margin-bottom: 15px;
                position: relative;
                text-align: center;
                font-weight: bold;
                color: var(--dark-text);
                text-decoration: none;
            }

                .signup-opt ul li a img {
                    position: absolute;
                    left: 20px;
                    top: 10px;
                    max-height: 30px;
                    border: none;
                }

            .signup-opt ul li.signup-fb a {
                background: #1877f2;
                color: #fff;
            }

                .signup-opt ul li.signup-fb a img {
                    background: #fff;
                    border-radius: 100%;
                }

            .signup-opt ul li.signup-lkn a {
                color: #fff;
                background: #0077b5;
            }

.signup-fields {
    float: left;
    border-right: 1px solid #ddd;
}

    .signup-fields h4 {
        margin: 20px 0 40px;
    }

    .signup-fields .form-group {
        position: relative;
        margin: 0 0 15px;
    }

    .signup-fields p {
        margin-top: 40px;
        margin-bottom: 0;
    }

.form-group .show-psw {
    position: absolute;
    color: var(--dark-text);
    right: 15px;
    top: 14px;
    z-index: 2;
    border: none;
    background: none;
}

.signup-fields .form-control {
    height: 50px;
    background: #FAF9FC;
    border-color: #dddddd90;
}

.signup-fields .btn {
    width: 100%;
}

.signup-fields p a {
    text-decoration: none;
    color: var(--pr-green);
}

/*================= Comparison page  ======================*/
.innerPage {
    margin-bottom: 30px;
}

.navBottom {
    display: inline-block;
    width: 100%;
    position: relative;
    z-index: 1;
    padding: 40px 0 0;
    color: #fff;
}

    .navBottom p {
        margin: 0;
        color: var(--pr-green);
    }

    .navBottom h2 {
        font-size: 2rem;
        font-weight: 600;
        color: #fff;
        margin: 5px 0 20px;
    }

.compSearch {
    background: #66666630;
    display: flex;
    padding: 30px 20px;
    border-radius: 10px 10px 0 0;
    backdrop-filter: blur(4px);
    width: 100%;
}

.formSearch {
    flex: 1;
    padding: 0 10px;
}

    .formSearch .form-control::-webkit-input-placeholder {
        color: #fff !important;
    }

    .formSearch .form-control:-ms-input-placeholder {
        color: #fff !important;
    }

    .formSearch .form-control::placeholder {
        color: #fff !important;
    }

    .formSearch input, .formSearch select, .formSearch .form-control:focus, .formSearch select:focus {
        background-color: #ffffff00;
        color: #fff;
        font-size: 0.9rem;
        border-color: #ffffff60;
    }

    .formSearch option {
        color: #222;
    }

.comparisonCot .container {
    display: flex;
    align-items: flex-start;
}

.compareBlock {
    width: 300px;
    background: #f6f6f6;
    border-radius: 6px;
    padding: 20px;
}

.resultBlock {
    flex: 1;
    margin-left: 25px;
    padding: 20px;
}

.compareBlock p {
    text-align: center;
    padding: 15px 0;
    color: #008034;
}

.comparisonCot h3 {
    font-size: 1.4rem;
    font-weight: 600;
    position: relative;
    padding-bottom: 8px;
    margin-bottom: 10px;
}

    .comparisonCot h3:before {
        content: '';
        width: 70px;
        height: 2px;
        border-radius: 20px;
        background: var(--pr-green);
        position: absolute;
        bottom: 0;
    }

.compareBlock p {
    text-align: center;
    padding: 15px 0;
    color: #008034;
    margin: 0;
}

ul.compareList li {
    display: flex;
    width: 100%;
    background: #fff;
    padding: 10px;
    font-size: 0.9rem;
    border-radius: 6px;
}

    ul.compareList li a {
        margin-left: auto;
        color: #ca6f0e;
        padding-left: 20px;
    }

    ul.compareList li + li {
        margin-top: 10px;
    }

.invBlock {
    display: inline-block;
    width: 100%;
    background: #fff;
    margin: 10px 0;
    padding: 20px;
    border-radius: 6px;
    border: 1px solid #ddd;
    font-size: 0.9rem;
    position: relative;
}

    .invBlock h4 {
        color: #111;
        font-size: 1rem;
        max-width: 80%;
        font-weight: 600;
    }

    .invBlock ul li b {
        font-weight: normal;
        color: #666;
    }

    .invBlock ul {
        margin: 10px 0;
        display: flex;
    }

        .invBlock ul li {
            margin-right: 40px;
        }

            .invBlock ul li span {
                font-weight: 600;
                display: inline-block;
                margin-left: 3px;
            }

.btnCompare {
    width: 100%;
    margin-top: 15px;
    font-weight: normal;
}

.checkbox {
    display: inline-block;
    position: relative;
    padding: 4px 0;
    min-width: 20px;
}

    .checkbox .customRadio, .checkbox input[type=checkbox], .multiselect-container .checkbox input {
        position: absolute;
        left: 0;
        top: 0px;
        width: 100%;
        height: 100%;
        cursor: pointer;
        z-index: 99;
        opacity: 0 !important;
    }

        .checkbox .customRadio + label::before, .checkbox input[type=checkbox] + label::before, .multiselect-container .checkbox::before {
            content: "";
            position: absolute;
            left: 0px;
            background-color: #fff;
            top: 0;
            width: 20px;
            height: 20px;
            border: 2px solid #d5d9e2;
            border-radius: 3px;
        }

        .checkbox .customRadio + label, .checkbox input[type=checkbox] + label {
            margin: 0px;
            position: relative;
            padding-left: 25px;
            line-height: 1rem
        }

            .checkbox .customRadio + label::before {
                border-radius: 100%;
                top: 1px;
            }

        .checkbox .customRadio:checked + label::before, .checkbox input[type=checkbox]:checked + label::before, .multiselect-container .active .checkbox::before {
            border-color: var(--pr-green);
        }

        .checkbox .customRadio:checked + label::after, .checkbox input[type=checkbox]:checked + label::after, .multiselect-container .active .checkbox::after {
            content: "";
            font-family: 'Font Awesome 5 Pro';
            position: absolute;
            left: 5px;
            top: 3px;
            font-size: 11px;
            color: var(--pr-green);
            line-height: 15px;
        }

.invBlock .checkbox {
    position: absolute;
    right: 20px;
    top: 10px;
    font-size: 0.8rem;
}

    .invBlock .checkbox input[type=checkbox] + label::before {
        width: 17px;
        height: 17px;
    }

    .invBlock .checkbox input[type=checkbox] + label::after {
        left: 3px;
        top: 2px;
    }

.table-custom {
    border: 1px solid #ddd;
    margin-top: 20px;
    font-size: 0.9rem;
    background: #FCFCFC;
}

    .table-custom > :not(:first-child) {
        border-top: 2px solid var(--pr-green);
    }

.resultBlock .alert {
    padding: 10px 15px;
    margin-top: -20px;
    font-size: 0.9rem;
}

    .resultBlock .alert a {
        color: #111;
        text-decoration: underline;
    }

.userNoData .table-custom {
    position: relative;
}

.userNoData:not(.invTable) .table-custom tbody td {
    filter: blur(5px);
}

.invTable.userNoData .table-custom tbody td:nth-child(n + 5) {
    filter: blur(5px);
}

.gridView {
    float: right;
    margin-top: -40px;
    position: relative;
    top: -5px;
}

    .gridView a {
        color: #fff;
        background: #17ac1e10;
        padding: 5px 20px;
        border-radius: 20px;
        font-size: 0.9rem;
    }

        .gridView a i {
            color: #17ac1e;
            margin-right: 5px;
        }

.dvFlex {
    display: flex;
}

.tableSearch {
    display: flex;
    border: 1px solid #ddd;
    border-radius: 4px;
    min-width: 350px;
}

    .tableSearch input {
        flex: 1;
        border: none;
    }

    .tableSearch button {
        border: none;
        background: none;
        padding: 0 10px;
    }




/*=================================== Css 29/7/23 ================================*/

.signup-fields {
    width: 100%;
    border: none;
    text-align: center;
    padding: 10px 20px;
}

    .signup-fields .form-group {
        text-align: left;
    }

.loginModal .modal-dialog {
    max-width: 550px;
}

.loginModal .modal-content {
    border-radius: 10px;
}

.signup-fields h4 {
    margin: 10px 0 40px;
    position: relative;
    font-weight: 600;
}

    .signup-fields h4:before {
        width: 60px;
        border-radius: 10px;
        height: 4px;
        content: '';
        position: absolute;
        background: #17AC1E;
        bottom: -10px;
        left: calc(50% - 30px);
    }

.signup-fields label {
    font-weight: 600;
    margin-bottom: 10px;
    width: 100%;
}

.signup-fields .form-control {
    background: #fff;
    border-color: #ccc;
    min-height: 55px;
}

.signup-fields .form-group {
    margin-bottom: 25px;
}

.pswGroup {
    position: relative;
    width: 100%;
}

.signup-fields a {
    text-decoration: underline;
    color: #333;
}

.signup-fields .pull-right {
    float: right;
}

.signup-fields .btn {
    width: auto;
}

.loginBtn {
    display: flex;
    width: 100%;
    align-items: center;
}

    .loginBtn .btn {
        padding: 10px 60px;
    }

    .loginBtn .pull-right {
        margin-left: auto;
    }

.signup-fields .form-group a {
    color: #999;
}

.signup-fields hr {
    border: none;
    height: 0;
    border-bottom: 1px dashed #aaa;
    margin: 30px 0;
}

.signup-fields p {
    margin-top: 0;
}

.signup-fields .termText {
    margin-top: 30px;
    font-size: 0.8rem;
    padding: 0 50px;
    color: #777;
}

    .signup-fields .termText a {
        color: #000;
        font-weight: 600;
    }

.formbtn {
    min-width: 180px;
    text-align: right;
    margin-top: 30px;
}

.formSearch input, .formSearch select {
    min-height: 45px;
}

.formSearch label {
    margin-bottom: 5px;
}

.compSearch {
    margin-top: 30px;
}

.innerPage {
    padding-top: 15px;
}

    .innerPage .midTitle {
        font-size: 1.4rem;
        font-weight: 600;
        position: relative;
        padding-bottom: 8px;
        margin-bottom: 10px;
    }

        .innerPage .midTitle:before {
            content: '';
            width: 70px;
            height: 2px;
            border-radius: 20px;
            background: var(--pr-green);
            position: absolute;
            bottom: 0;
        }

.grayForm {
    width: 100%;
    padding: 20px 20px 30px;
    border: 1px solid #ddd;
    background: #FCFCFC;
    border-radius: 6px;
    display: inline-block;
    margin: 20px 0 10px;
}

    .grayForm h4 {
        font-size: 1.3rem;
        color: #718272;
        font-weight: 600;
        margin-bottom: 25px;
    }

    .grayForm label {
        font-weight: 600;
        margin-bottom: 10px;
        color: #222;
        font-size: 0.9rem;
    }

    .grayForm .form-group {
        margin-bottom: 20px;
    }

    .grayForm select, .grayForm input {
        min-height: 40px;
        color: #777;
    }

.centerBtn, .rightBtn {
    display: flex;
    margin: 20px 0;
    justify-content: center;
    align-items: center;
    width: 100%;
    gap: 10px;
}

.rightBtn {
    justify-content: flex-end;
}

.btnBorder {
    border: 1px solid var(--pr-green);
    color: var(--pr-green);
    padding: 10px 25px;
    font-size: 0.9rem;
}

.table-custom th, .table-custom td {
    padding: 12px;
}

.mainBlock {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    min-height: calc(100vh - 60px);
}

/*=================== Side nav ===================*/
.sideBar {
    width: 300px;
    padding: 20px 20px 20px 20px;
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    background: #071819;
    position: fixed;
    top: 10px;
    left: 10px;
    border-radius: 10px;
    height: calc(100% - 20px);
    z-index: 99;
    color: #fff;
}

    .sideBar.hideSidebar {
        width: 0;
        overflow: hidden;
        white-space: nowrap;
        visibility: hidden;
        opacity: 0;
        padding: 10px;
    }

    .sideBar .logoDash {
        width: 120px;
        display: table;
        margin: 15px 15px 30px;
        clear: both;
    }

    .sideBar h5 {
        text-transform: uppercase;
        font-size: 0.9rem;
        margin: 10px 0 0;
        opacity: 0.5;
    }

.sideNav {
    display: inline-block;
    white-space: nowrap;
    margin: 10px 0;
    width: 100%;
}

    .sideNav ul {
        display: none;
        padding-left: 10px;
    }

    .sideNav li {
        margin: 5px 0;
        line-height: normal;
    }

    .sideNav a {
        color: #fff;
        font-weight: 600;
        padding: 10px;
        display: inline-block;
        position: relative;
        text-overflow: ellipsis;
        overflow: hidden;
        line-height: 12px;
        width: 100%;
        font-size: 1.1rem;
        border-radius: 5px;
    }

        .sideNav a:hover, .sideNav a.active {
            background: var(--pr-green);
            color: #fff;
        }

    .sideNav .menu-icon {
        font-weight: lighter;
        font-size: 1rem;
        margin-right: 10px;
    }

.sideBar h4 {
    font-size: 1.2rem;
    font-weight: 600;
    margin-bottom: 15px;
}
/*============== Right Block===============*/
.rightBlock {
    flex: 1;
    padding: 20px 20px 20px 0;
    position: relative;
}

.wrapper-full {
    display: inline-block;
    width: 100%;
}

.bgWhite {
    display: inline-block;
    width: 100%;
    background: #fff;
    padding: 10px;
    border: 1px solid #eee;
    border-radius: 4px;
    margin-bottom: 15px;
}

.breadcrumb-item a {
    color: #222;
}

.dropdown-toggle::after {
    position: absolute;
    top: 15px;
    right: 0px;
    font-size: 1.2rem;
}

.toggleSidebar {
    border: none;
    background: none;
    color: #fff;
    width: 30px;
    height: 30px;
    border-radius: 30px;
    font-size: 1.4rem;
    position: absolute;
    left: 20px;
    top: -55px;
    z-index: 99;
}

    .toggleSidebar i:before {
        content: "\f0c9";
    }

.bgWhite h4 {
    font-size: 1.2rem;
    font-weight: 600;
}

.btnGroup {
    display: flex;
    width: 100%;
    margin: 10px 0;
    gap: 10px;
}

    .btnGroup .align-right {
        margin-left: auto;
    }

.btnBordered {
    border: 1px solid;
    padding: 5px 20px;
    border-radius: 4px;
}

    .btnBordered:hover {
        color: #fff;
        background: var(--primary-color);
    }

.innerTabs {
    border-bottom: none;
    margin-bottom: -10px;
}

    .innerTabs .nav-link {
        padding: 5px 10px;
        border: none;
        border-bottom: 2px solid transparent;
        color: #222;
        font-weight: 500;
        margin: 0 5px;
    }

        .innerTabs .nav-item.show .nav-link, .innerTabs .nav-link.active {
            color: var(--primary-color);
            background-color: #fff;
            border-bottom-color: var(--primary-color);
        }

/* Sidebar */
/*.sidebar {
    min-height: calc(100vh - 63px);
    background: linear-gradient(to top, #5768f3, #1c45ef);
    font-family: "roboto", sans-serif;
    padding: 0;
    width: 270px;
    z-index: 11;
    transition: width 0.25s ease, background 0.25s ease;
    -webkit-transition: width 0.25s ease, background 0.25s ease;
    -moz-transition: width 0.25s ease, background 0.25s ease;
    -ms-transition: width 0.25s ease, background 0.25s ease;
}

    .sidebar > .nav {
        overflow: hidden;
        flex-wrap: nowrap;
        flex-direction: column;
    }

        .sidebar > .nav .nav-item .collapse {
            z-index: 999;
        }

        .sidebar > .nav .nav-item:not(.hover-open) .collapse .sub-menu,
        .sidebar > .nav .nav-item:not(.hover-open) .collapsing .sub-menu {
            margin: 5px 0;
        }

            .sidebar > .nav .nav-item:not(.hover-open) .collapse .sub-menu .nav-item .nav-link,
            .sidebar > .nav .nav-item:not(.hover-open) .collapsing .sub-menu .nav-item .nav-link {
                padding: 10px 0px 10px 70px;
                position: relative;
                color: rgba(255, 255, 255, 0.8);
                font-size: calc(15px - 2px);
                font-weight: 500;
                transition-duration: 0.5s;
                transition-timing-function: "ease-in-out";
                transition-property: "background", "color", "box-shadow", "padding";
            }

                .sidebar > .nav .nav-item:not(.hover-open) .collapse .sub-menu .nav-item .nav-link:before,
                .sidebar > .nav .nav-item:not(.hover-open) .collapsing .sub-menu .nav-item .nav-link:before {
                    content: "";
                    position: absolute;
                    top: 0px;
                    left: 35px;
                    display: block;
                    height: 100%;
                    width: 2px;
                    background: #1026de;
                }

                .sidebar > .nav .nav-item:not(.hover-open) .collapse .sub-menu .nav-item .nav-link:hover,
                .sidebar > .nav .nav-item:not(.hover-open) .collapsing .sub-menu .nav-item .nav-link:hover {
                    color: #fff;
                }

                    .sidebar > .nav .nav-item:not(.hover-open) .collapse .sub-menu .nav-item .nav-link:hover:before,
                    .sidebar > .nav .nav-item:not(.hover-open) .collapsing .sub-menu .nav-item .nav-link:hover:before {
                        background: #fff;
                    }

            .sidebar > .nav .nav-item:not(.hover-open) .collapse .sub-menu .nav-item:first-child .nav-link,
            .sidebar > .nav .nav-item:not(.hover-open) .collapsing .sub-menu .nav-item:first-child .nav-link {
                padding-top: 0;
            }

            .sidebar > .nav .nav-item:not(.hover-open) .collapse .sub-menu .nav-item:last-child .nav-link,
            .sidebar > .nav .nav-item:not(.hover-open) .collapsing .sub-menu .nav-item:last-child .nav-link {
                padding-bottom: 0;
            }

        .sidebar > .nav .nav-item .nav-link {
            align-items: center;
            display: flex;
            padding: 15px 30px 15px 55px;
            white-space: nowrap;
            color: #fff;
        }

            .sidebar > .nav .nav-item .nav-link i.menu-arrow {
                margin-left: auto;
                margin-right: 0;
                transition-duration: 0.2s;
                transition-property: -webkit-transform;
                transition-property: transform;
                transition-property: transform, -webkit-transform;
                transition-timing-function: ease-in;
            }

                .sidebar > .nav .nav-item .nav-link i.menu-arrow:before {
                    content: "\F054";
                    font-family: "Material Design Icons";
                    font-size: 18px;
                    line-height: 1;
                    font-style: normal;
                    vertical-align: middle;
                    color: #bfccda;
                }

            .sidebar > .nav .nav-item .nav-link[aria-expanded="true"] i.menu-arrow {
                -webkit-transform: rotate(90deg);
                transform: rotate(90deg);
            }

            .sidebar > .nav .nav-item .nav-link .menu-icon {
                display: none;
                margin-right: 1.25rem;
                width: 16px;
                line-height: 1;
                font-size: 18px;
                color: #fff;
            }

            .sidebar > .nav .nav-item .nav-link .menu-title {
                color: inherit;
                display: inline-block;
                font-size: 15px;
                line-height: 1;
                vertical-align: middle;
                font-weight: 500;
            }

            .sidebar > .nav .nav-item .nav-link .badge {
                margin-left: auto;
            }

            .sidebar > .nav .nav-item .nav-link:hover {
                color: #f2f2f2;
            }

        .sidebar > .nav .nav-item.active > .nav-link {
            color: #fff;
        }

            .sidebar > .nav .nav-item.active > .nav-link .menu-title,
            .sidebar > .nav .nav-item.active > .nav-link i {
                color: inherit;
            }

        .sidebar > .nav .nav-item.nav-profile {
            max-width: 270px;
            margin-right: auto;
            margin-left: auto;
            margin-top: 30px;
            margin-bottom: 30px;
        }

            .sidebar > .nav .nav-item.nav-profile .nav-link {
                display: flex;
                border-radius: 3px;
                border: 1px solid rgba(255, 255, 255, 0.11);
                background-color: rgba(255, 255, 255, 0.1);
                color: #fff;
                padding: 15px 25px;
            }

                .sidebar > .nav .nav-item.nav-profile .nav-link .profile-image {
                    margin-right: 15px;
                    position: relative;
                }

                .sidebar > .nav .nav-item.nav-profile .nav-link .dot-indicator {
                    position: absolute;
                    bottom: 0px;
                    right: 0px;
                }

                .sidebar > .nav .nav-item.nav-profile .nav-link .profile-name {
                    margin-bottom: 5px;
                    font-weight: 500;
                    font-size: 15px;
                    color: #fff;
                }

                .sidebar > .nav .nav-item.nav-profile .nav-link .designation {
                    margin-bottom: 0;
                    font-weight: 400;
                    color: #fff;
                }

        .sidebar > .nav .nav-item.nav-category {
            color: rgba(255, 255, 255, 0.7);
            border-bottom: 1px solid rgba(255, 255, 255, 0.13);
            margin: 0 30px;
            font-size: 15px;
            font-weight: 500;
            padding: 10px 0px 15px 0px;
        }

        .sidebar > .nav > .nav-item > .nav-link {
            height: 52px;
        }

        .sidebar > .nav > .nav-item:not(.nav-profile) > .nav-link {
            position: relative;
        }

            .sidebar > .nav > .nav-item:not(.nav-profile) > .nav-link:before {
                content: "";
                position: absolute;
                left: 30px;
                right: 50%;
                width: 10px;
                height: 10px;
                border-radius: 100%;
                border: 2px solid #fff;
                display: block;
            }

        .sidebar > .nav:not(.sub-menu) > .nav-item > .nav-link {
            background: transparent;
            transition-duration: 0.3s;
            transition-timing-function: "ease-in-out";
            transition-property: "background", "color", "box-shadow", "padding";
        }

        .sidebar > .nav:not(.sub-menu) > .nav-item:hover:not(.nav-profile):not(.hover-open) > .nav-link:not([aria-expanded="true"]) {
            background: #0f25d5;
            padding-left: 65px;
        }

            .sidebar > .nav:not(.sub-menu) > .nav-item:hover:not(.nav-profile):not(.hover-open) > .nav-link:not([aria-expanded="true"]):before {
                border-color: #fff;
            }

            .sidebar > .nav:not(.sub-menu) > .nav-item:hover:not(.nav-profile):not(.hover-open) > .nav-link:not([aria-expanded="true"]) .menu-title {
                color: #fff;
            }

            .sidebar > .nav:not(.sub-menu) > .nav-item:hover:not(.nav-profile):not(.hover-open) > .nav-link:not([aria-expanded="true"]) .menu-arrow:before {
                color: #bfccda;
            }*/

/* style for off-canvas menu*/
/*@media screen and (max-width: 991px) {
    .sidebar-offcanvas {
        position: fixed;
        max-height: calc(100vh - 63px);
        top: 63px;
        bottom: 0;
        overflow: auto;
        right: -270px;
        transition: all 0.25s ease-out;
    }

        .sidebar-offcanvas.active {
            right: 0;
        }
}*/



/*======================= Dashboard CSs ============================*/
.modal button.close {
    background: none;
    border: none;
}

.modal .btn {
    padding: .375rem .75rem;
    font-size: 1rem;
}

.bodyDash {
    padding-left: 330px;
    background: #B5C2CA30;
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
}

    .bodyDash.noSidebar {
        padding-left: 20px;
        padding-left: 20px;
        transition: all 0.3s ease-in-out;
        -webkit-transition: all 0.3s ease-in-out;
        -moz-transition: all 0.3s ease-in-out;
    }

    .bodyDash .headCot {
        background: #071819;
        margin: 10px 0;
        width: calc(100% - 20px);
        border-radius: 10px;
    }

        .bodyDash .headCot .container {
            width: 100%;
            margin: 0;
            max-width: 100%;
        }

        .bodyDash .headCot:before, .bodyDash .headCot:after {
            display: none;
        }

    .bodyDash .navbar-brand {
        display: none;
    }
    /*  .bodyDash .headCot .btnOpc {
        background: var(--pr-green);
        color: #fff;
    }
    .bodyDash .right-nav .btn-blank {
        color: #111;
    }*/
    .bodyDash .right-nav .btn-blank i {
        margin-right: 5px;
        margin-left: 10px;
    }

footer.mainFooter.hide {
    display: none;
}

.sideFooter {
    position: absolute;
    bottom: 10px;
    width: calc(100% - 15px);
    left: 15px;
}

    .sideFooter ul.contactList.footerContact li {
        font-size: 0.8rem !important;
        margin: 10px 0 0 !important;
    }

    .sideFooter ul.contactList.footerContact {
        flex-direction: row;
        gap: 10px;
    }

.bodyDash .innerPage .container {
    width: 100%;
    margin: 0;
    max-width: 100%;
    padding: 0;
}

.bodyDash .bgWhite {
    display: inline-block;
    width: 100%;
    background: none;
    padding: 0;
    border: none;
    border-radius: 4px;
    margin-bottom: 0;
}

/*disable */
.dz-max-files-reached {
    pointer-events: none;
    cursor: default;
}
.disabled{
    pointer-events: none;
    opacity: 0.5; /* Optional: Makes the dropzone look disabled */
}
