/* ? All Variables Of Colors, Fonts, Radius...  */
    /* ReUse This Vars In All Project */
    /*  ========VARIABLES CSS========   */

    :root {
        /*  ========Colors========   */
        --main-color: #00707E;
        --secondary-color: #39264F;
        /*  ========Hovers========   */
        --hover-main: #6561C2;
        --hover-secondary: #42C1C7;

        --bg: #e3e3e3ee;
        --color: #082635;
        --dark: #a4a4a4;
        --dark-light: #d5d5d5;
        --light: #efefef;
        /* Gradient Vars */
        /*  ========Vars Colors========   */
        --heading: var(--main-color);
        --text: var(--main-color);
        /*  ========Shadow========   */
        --Shadow: rgb(14 30 37 / 12%) 0px 2px 4px 0px, rgb(14 30 37 / 32%) 0px 2px 16px 0px;
        /*  ========Border========   */
        --radius: 30px;
        /*  ========Font and typography========   */
        /* IN RTL | LTR FILES */
    }

    /*  ========BASE========   */

    * {
        box-sizing: border-box;
        padding: 0;
        margin: 0;
    }

    html {
        scroll-behavior: smooth;
        overflow-x: hidden;
        /* scroll-padding-top: 9rem; */
        scroll-behavior: smooth;
        /* letter-spacing: normal !important; */
    }

    /* html::-webkit-scrollbar {
        width: 0.5rem;
    } */

    html::-webkit-scrollbar-track {
        background: transparent;
    }

    /* html::-webkit-scrollbar-thumb {
        background: radial-gradient(circle, var(--secondary-color) 0%, var(--secondary-color) 100%);

    } */

    body {
        background: var(--bg);
        text-transform: capitalize;
        overflow: hidden;
    }

    ::-moz-selection {
        background: var(--secondary-color);
        color: var(--color);
        font-weight: 600;
    }

    ::selection {
        background: var(--secondary-color);
        color: var(--color);
        font-weight: 600;
    }

    section {
        padding: 2% 2.5rem;
    }

    a {
        text-decoration: none !important;
        color: var(--main-color);
        word-break: break-word;
    }

    p {
        text-align: justify;
        line-height: 1.9 !important;
    }

    a,
    button {
        touch-action: manipulation;
        transition: all 0.3s;
    }

    .radius {
        border-radius: var(--radius);
    }

    .secText {
        color: var(--main-hover) !important;
        line-height: 1.7;
    }

    .text-dark-light {
        color: var(--dark-light) !important;
    }

    .text-dark {
        color: var(--dark) !important;
    }

    .bg-dark {
        background: var(--dark) !important;
    }

    .bg-primary {
        background: var(--main-color) !important;
        color: var(--main-hover);
    }

    .bg-secondary {
        background: var(--secondary-color) !important;
    }

    .text-primary {
        color: var(--main-color) !important;
    }

    .text-secondary {
        color: var(--secondary-color) !important;
    }


    .text-blue {
        color: var(--main-hover);
    }

    .bg-nav {
        background: var(--main-color);
    }

    /* .logo {
        color: var(--main-color);
        font-weight: 500;
    }

    .logo img {
        padding: 0;
        margin: 0;
        max-height: 40px;
        transform-origin: top left;
        transform: scale(0) rotate(0deg) translate(-50%, -50%);
        animation: cube 12s ease-in forwards infinite;
    } */

    /* heading */

    .heading {
        color: var(--heading) !important;
        font-family: var(--heading-font) !important;
    }

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

    /* Hover Classes */
    /* NavBar Start*/

    /* .navbar {
        z-index: 99;
    }

    .nav-icon {
        color: #fff !important;
        font-size: 1.2rem;
        font-weight: 600;
    } */

    /* .nav-item:hover,
    .nav-icon:hover {
        color: var(--secondary-color) !important;
    }

    .nav-link.active {
        color: var(--secondary-hover) !important;
    }

    .dropdown-item {
        color: var(--secondary-color) !important;
    }

    .dropdown-item:hover {
        color: var(--main-color) !important;
        cursor: pointer;
    } */

    /* .dropdown-item.active-item {
        color: white !important;
        background-color: var(--secondary-color) !important;
    }

    .dropdown-toggle::after {
        display: none;
    } */

    /* NavBar End*/




    /* Baisc Nave */

    /* @media screen and (min-width: 992px) {
        .nav-item {
            line-height: 80px;
        }
    } */

    /* Variable Declarations */


    /* Styling */
    /* Navbar Styling */


    /* Footer Style */