:root {
    --tg-body-font-family: 'Inter', sans-serif;
    --tg-heading-font-family: 'Poppins', sans-serif;
    --tg-icon-font-family: "Font Awesome 5 Free";
    --tg-body-font-size: 14px;
    --tg-body-line-height: 1.75;
    --tg-heading-line-height: 1.3;
    --tg-body-color: #3a3a3a;
    --tg-heading-color: #3a3a3a;
    --tg-theme-primary: #f97316;
    --tg-theme-secondary: #18216b;
    --tg-common-color-blue: #050071;
    --tg-common-color-blue-2: #004f95;
    --tg-common-color-indigo: #9B51E0;
    --tg-common-color-purple: #8121FB;
    --tg-common-color-pink: #FF429D;
    --tg-common-color-red: #E11B24;
    --tg-common-color-orange: #fd7e14;
    --tg-common-color-yellow: #F8BC24;
    --tg-common-color-yellow-2: #FBE67B;
    --tg-common-color-yellow-3: #FCB428;
    --tg-common-color-green: #12BB6A;
    --tg-common-color-teal: #219653;
    --tg-common-color-cyan: #00AEE5;
    --tg-common-color-white: #fff;
    --tg-common-color-gray: #F7F7F9;
    --tg-common-color-gray-2: #FFF8F0;
    --tg-common-color-gray-3: #7F7E97;
    --tg-common-color-gray-4: #ACAACC;
    --tg-common-color-gray-5: #B2BBCC;
    --tg-common-color-gray-6: #d7d7df;
    --tg-common-color-gray-7: #f6f6f6;
    --tg-common-color-gray-8: #F5F5F4;
    --tg-common-color-gray-9: #F9F9F9;
    --tg-common-color-gray-10: #F8F8F8;
    --tg-common-color-gray-11: #F8F8FC;
    --tg-common-color-dark: #1C1A4A;
    --tg-common-color-black: #06042E;
    --tg-common-color-black-2: #161439;
    --tg-common-color-black-3: #000;
    --tg-border-1: #C9C9DD;
    --tg-border-2: #D0DAE9;
    --tg-border-3: #E2E2E2;
    --tg-border-4: #D7DCE3;
    --tg-border-5: #2F466A;
    --tg-border-6: #dfdfdf;
    --tg-border-7: #E7E7E7;
    --tg-fw-extra-bold: 800;
    --tg-fw-bold: 700;
    --tg-fw-semi-bold: 600;
    --tg-fw-medium: 500;
    --tg-fw-regular: 400;
    --tg-fw-light: 300;
}

/*=============================
    00. Preloader
===============================*/
#preloader {
    background-color: var(--tg-common-color-white);
    height: 100%;
    width: 100%;
    position: fixed;
    margin-top: 0px;
    top: 0px;
    z-index: 99999;
}

    #preloader .loader .loader-container {
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        -moz-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        -o-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        width: 100px;
        height: 100px;
        border: 3px solid var(--tg-common-color-gray);
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        -o-border-radius: 50%;
        -ms-border-radius: 50%;
        border-radius: 50%;
    }

        #preloader .loader .loader-container::before {
            position: absolute;
            content: "";
            display: block;
            top: 50%;
            left: 50%;
            -webkit-transform: translate(-50%, -50%);
            -moz-transform: translate(-50%, -50%);
            -ms-transform: translate(-50%, -50%);
            -o-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
            width: 100px;
            height: 100px;
            /*border-top: 3px solid var(--tg-theme-primary);*/
            border-top: 3px solid #494949;
            -webkit-border-radius: 50%;
            -moz-border-radius: 50%;
            -o-border-radius: 50%;
            -ms-border-radius: 50%;
            border-radius: 50%;
            animation: loaderspin 1.8s infinite ease-in-out;
            -webkit-animation: loaderspin 1.8s infinite ease-in-out;
        }

    #preloader .loader .loader-icon {
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        -moz-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        -o-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        width: 80px;
        text-align: center;
    }

        #preloader .loader .loader-icon img {
            animation: loaderpulse alternate 900ms infinite;
            width: 40px;
        }

@keyframes loaderspin {
    0% {
        transform: translate(-50%, -50%) rotate(0deg);
    }

    100% {
        transform: translate(-50%, -50%) rotate(360deg);
    }
}

@-webkit-keyframes loaderspin {
    0% {
        transform: translate(-50%, -50%) rotate(0deg);
    }

    100% {
        transform: translate(-50%, -50%) rotate(360deg);
    }
}

@keyframes loaderpulse {
    0% {
        transform: scale(1);
    }

    100% {
        transform: scale(1.2);
    }
}
/*=============================
    - Background color
===============================*/
.grey-bg {
    background: var(--tg-common-color-gray);
}

.grey-bg-two {
    background: var(--tg-common-color-gray-9);
}

.white-bg {
    background: var(--tg-common-color-white);
}

.black-bg {
    background: var(--tg-common-color-black);
}