@font-face {
    font-family: 'IRANSans';
    src: url('/fonts/woff2/IRANSansWeb.woff2') format('woff2'), url('/fonts/woff2/IRANSansWeb.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap; /* Ensures text remains visible during load */
}

@font-face {
    font-family: 'IRANSans';
    src: url('/fonts/woff2/IRANSansWeb_Bold.woff2') format('woff2'), url('/fonts/woff2/IRANSansWeb_Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

.farsiFont {
    font-family: 'IRANSans', Tahoma, sans-serif !important;
}

.FarsiContent * {
    font-family: 'IRANSans', Tahoma, sans-serif !important;
}
body {
}

#h2Top {
    font-size: 1.2em !important;
    font-weight: 400 !important;
    line-height: 1.5em;
    padding-bottom: 50px;
    padding-top: 15px;
    padding-left: 30px;
    padding-right: 30px;
}

#DatabaseArticleWapper h2 {
   /* font-size: 2.2em !important;*/
    font-weight: 400 !important;
    padding-bottom: 20px;
}

#DatabaseArticleWapper h3 {
   /* font-size: 1.8em !important;*/
    font-weight: 400 !important;
    padding-bottom: 20px !important;
    padding-top: 20px !important;
    margin-top: 0 !important;
    padding-right: 20px;
}

#DatabaseArticleWapper h2,
#DatabaseArticleWapper h3, #keywordsTag {
    /* Critical: Makes the heading flow inline with text/elements before it */
    display: block;
    /* Important: Adds spacing to separate it from other content after it */
    margin-right: 5px;
    /* Optional: If you want to vertically align the icon with the heading text */
    align-items: center;
}

    #DatabaseArticleWapper span[class^="ns-shape-"],
    #keywordsTag span[class^="ns-shape-"] {
       /* display: inline-block;*/
        /* Optional: Add spacing after the icon */
        margin-right: 10px;
        clear: right;
    }

#keywordsWrapper .keywordsItem1 {
    display: inline !important;
    padding-left: 50px;
}

#ArticleLinkWrapper {
}

#keywordsWrapper h4 {
    padding-left: 80px;
}

.col-span-7 {
    grid-column: span 7 / span 7;
}

.col-span-8 {
    grid-column: span 8 / span 8;
}

.col-span-9 {
    grid-column: span 9 / span 9;
}

.col-span-10 {
    grid-column: span 10 / span 10;
}

#SearchFormWrapper {
}

#FSearchContentString {
    padding-left: 50px;
}
#SearchFormWrapper button {
   
}
.left-4 {
    left: calc(var(--spacing) * 4);
}

#keywordsTag {
    margin-top: 30px;
}

#authorAvatar {
    margin-top: 0 !important
}
:root, :host {
    --font-inter-tight: "IRANSans", sans-serif;
}
h1, h2, h3, h4, h5, p, strong {
    direction:rtl
}
h1 {
font-size: var(--text-heading-3);
padding-bottom:2em;
}
h2 {
    font-size: var(--text-heading-4);
    padding-bottom: 1.2em;
}
h3 {
    font-size: var(--text-heading-5);
    padding-bottom: 1.2em;
}
@media (max-width: 575.98px) {
    .min-h-\[480px\] {
        min-height: 620px;
    }

    #Mainavatarimg {
        right: -20px;
    }

    #transfersuccess {
        opacity: 0
    }

    #mainimg {
        right: 0px
    }

    #nearestimg {
        opacity: 0
    }

    #customersimg {
        top: 280px;
        left: -50px;
        opacity: 0
        /* width: 130px;*/
    }
    #headerLogo figure {
        padding: 0px;
    }

    #footerLogo figure {
        padding: 0px;
    }
}
@media (min-width: 576px) {

    #Mainavatarimg {
        right: -20px;
    }

    #transfersuccess {
        opacity:0
    }

    #mainimg {
        right: 0px
    }

    #nearestimg {
        opacity: 0
    }

    #customersimg {
        top: 280px;
        left: -50px;
        opacity: 0
        /* width: 130px;*/
    }
    #headerLogo figure {
        padding: 0px;
    }

    #footerLogo figure {
        padding: 0px;
    }
}

@media (min-width: 768px) {
    #Mainavatarimg {
        right: -222px;
    }

    #transfersuccess {
        right: -200px;
    }

  

    #nearestimg {
        opacity: 0
    }

    #customersimg {
        opacity: 0
    }
    #headerLogo figure {
        padding: 15px;
    }

    #footerLogo figure {
        padding: 25px;
    }
}
@media (min-width: 992px) {

    #Mainavatarimg {
        right: -222px;
    }

    #transfersuccess {
        right: -200px;
    }

    #mainimg {
        right: -109px
    }

    #nearestimg {
        left: 1px
    }

    #customersimg {
        left: -50px;
        top: 180px
    }
    #headerLogo figure {
        padding: 15px;
    }

    #footerLogo figure {
        padding: 25px;
    }
}
@media (min-width: 1200px) {
    #Mainavatarimg {
        right: -222px;
    }

    #transfersuccess {
        right: -223px;
    }

    #mainimg {
        right: -109px
    }

    #nearestimg {
        left: 1px
    }

    #customersimg {
        left: -80px;
        top: 150px
    }
    #headerLogo figure {
        padding: 15px;
    }

    #footerLogo figure {
        padding: 25px;
    }
}
@media (min-width: 1400px) {
    #Mainavatarimg {
        right: -222px;
    }

    #transfersuccess {
        right: -223px;
    }

    #mainimg {
        right: -109px
    }

    #nearestimg {
        left: 1px
    }

    #customersimg {
        left: -80px;
        top: 150px
    }
    #headerLogo figure {
        padding: 15px;
    }

    #footerLogo figure {
        padding: 25px;
    }
}

article h3 {
    padding-bottom: 0;
}
#mainPageH1, #mainPageSubHp {
    text-align: right
}
h1,h2,h3 {
    line-height:1.6em;
    direction:rtl;

}


#authorsImage {
    width: 48px !important;
    height: 48px !important;
    background-color: transparent !important;
    display: block
}

#authorsImageWrapper {
}


hr {
    opacity: .3;
}

#MainArticle p {
    font-size: 17px;
}

#MainArticle h2 {
    font-size: 28px;
    padding-top: 10px;
    padding-bottom: 20px;
}

#MainArticle h3 {
    font-size: 26px;
    padding-top: 10px;
    margin-top: 10px;
}

@supports (color: color-mix(in lab, red, red)) {
    #MainArticle p {
        color: color-mix(in oklab, var(--color-secondary) 90%, transparent) !important;
    }
}

@supports (color: color-mix(in lab, red, red)) {
    #MainArticle p:where(.dark, .dark *) {
        color: color-mix(in oklab, var(--color-accent) 90%, transparent) !important;
    }
}


#shareWrapper a {
    margin: 4px;
}
.half-line {
    /* Set the width to 50% */
    width: 90%;
    /* Optional: Center the line if it's not already */
    margin-left: auto;
    margin-right: auto;
    /* Optional: Adjust appearance */
    border: 1px solid #ccc; /* Set color and thickness */
}

#DatabaseArticleWapper {
    direction: rtl;
    text-align: left
}


.btn:before {
    content: "";
    top: 50%;
    left: 1.8rem; /* calc(var(--spacing) * .5) !important;*/
    right: unset !important;
    height: calc(var(--spacing) * 0);
    width: calc(var(--spacing) * 0);
    --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
    opacity: 0;
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-duration: .3s;
    --tw-ease: var(--ease-in-out);
    transition-duration: .3s;
    transition-timing-function: var(--ease-in-out);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='white' viewBox='0 0 256 256'%3E%3Cpath d='M181.66,133.66l-80,80a8,8,0,0,1-11.32-11.32L164.69,128,90.34,53.66a8,8,0,0,1,11.32-11.32l80,80A8,8,0,0,1,181.66,133.66Z'%3E%3C/path%3E%3C/svg%3E");
    background-position: center;
    background-repeat: no-repeat;
    position: absolute;
    transform: scaleX(-1);
}

.btn:hover:before {
    width: calc(var(--spacing) * 3);
    height: calc(var(--spacing) * 3);
    --tw-translate-x: calc(var(--spacing) * -4);
    translate: var(--tw-translate-x ) var(--tw-translate-y);
    opacity: 1;
}

.btn:hover span {
    --tw-translate-x: calc(var(--spacing) * 2);
    translate: var(--tw-translate-x) var(--tw-translate-y);
}