@font-face {
    font-family: 'IRANSansX';
    font-style: normal;
    font-weight: 200;
    src: local('IRANSansX'), url('/assets/css/fonts/IRANSansWeb\(FaNum\)_UltraLight.woff') format('woff');
    font-display: swap;
}
@font-face {
    font-family: 'IRANSansX';
    font-style: normal;
    font-weight: 300;
    src: local('IRANSansX'), url('/assets/css/fonts/IRANSansWeb(FaNum)_Light.woff') format('woff');
    font-display: swap;
}

@font-face {
    font-family: 'IRANSansX';
    font-style: normal;
    font-weight: 400;
    src: local('IRANSansX'), url('/assets/css/fonts/IRANSansWeb(FaNum).woff') format('woff');
    font-display: swap;
}

@font-face {
    font-family: 'IRANSansX';
    font-style: normal;
    font-weight: 500;
    src: local('IRANSansX'), url('/assets/css/fonts/IRANSansWeb(FaNum)_Medium.woff') format('woff');
    font-display: swap;
}

@font-face {
    font-family: 'IRANSansX';
    font-style: normal;
    font-weight: 600;
    src: local('IRANSansX'), url('/assets/css/fonts/IRANSansWeb(FaNum)_Bold.woff') format('woff');
    font-display: swap;
}

@font-face {
    font-family: 'IRANSansX';
    font-style: normal;
    font-weight: 700;
    src: local('IRANSansX'), url('/assets/css/fonts/IRANSansWeb(FaNum)_Bold.woff') format('woff');
    font-display: swap;
}

@font-face {
    font-family: 'IRANSansX';
    font-style: normal;
    font-weight: 800;
    src: local('IRANSansX'), url('/assets/css/fonts/IRANSansWeb(FaNum)_Bold.woff') format('woff');
    font-display: swap;
}


html, body {
    overscroll-behavior: none !important;
    font-family: IRANSansX !important;
}


.AboutUS {
    background-image: url("/assets/images/aboutus/pattern.png");
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    z-index:0 !important;
}

.Question .QuestionBac {
    background-image: url("/assets/images/question/BACK .png");
    background-size: cover !important;
    background-position: bottom !important;
    background-repeat: no-repeat !important;
    z-index: 0 !important;
    background-color: #e4f2f3;
}

.ContacUS {
    background-image: url("/assets/images/contactUs/background.png");
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    z-index: 0 !important;
}

.drawer-hidden {
    display: none; /* Hide the drawer initially */
}

.hidden {
    display: none;
}

.Social:hover .Points {

    transform: scale(.9) !important;
    filter: drop-shadow(2px 2px 5px #866CCB) !important;
    transition-property: all;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 1.5s;

}

.Social:hover img {

    transform: scale(.9) !important;
    filter: drop-shadow(2px 2px 5px #866CCB) !important;
    transition-property: all;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 1.5s;

}

#successMessage {
    color: white;
    position: fixed;
    left: 20px;
    bottom: 20px;
    width: auto;
    height: auto;
    background: green;
    text-align: center;
    padding: 20px;
    border-radius: 10px !important;
    display: none;
}

.shine-effect {
    position: absolute;
    top: -100%;
    left: -100%;
    width: 200%;
    height: 200%;
    background: linear-gradient(115deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.1));
    transform: rotate(30deg);
    opacity: 1;
    animation: shine-animation 4s linear infinite;
}


@keyframes shine-animation {
    0% {
        top: -100%;
        left: -100%;
    }

    25% {
        top: 100%;
        left: 100%;
    }

    100% {
        top: 100%;
        left: 100%;
    }
}

.shine-effect1 {
    position: absolute;
    top: -100%;
    left: -100%;
    width: 200%;
    height: 200%;
    background: linear-gradient(115deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.1));
    transform: rotate(30deg);
    opacity: 1;
    animation: shine-animation 4s linear infinite;
}


@keyframes shine-animation {
    0% {
        top: -100%;
        left: -100%;
    }

    25% {
        top: 100%;
        left: 100%;
    }

    100% {
        top: 100%;
        left: 100%;
    }
}

/*.horseshoe-bg {
    fill: none;
    stroke: #e0e0e0;
    stroke-width: 8;
}*/

.horseshoe-bar1, .horseshoe-bar2 {
    fill: none;
    stroke-linecap: round;
    /*stroke-dasharray: 200; /* Max path length 
    stroke-dashoffset: 0; /* Start empty */
    transition: stroke-dashoffset 1.5s ease-in-out;
}

.horseshoe-bar1 {
    stroke: url(#gradient1);
}

.horseshoe-bar2 {
    stroke: url(#gradient2);
}