/* Define IRANSans fonts */
@font-face {
    font-family: IRANSans;
    font-style: normal;
    font-weight: bold;
    src: url('../fonts/iransans/IRANSansWeb_Bold.eot');
    src: url('../fonts/iransans/IRANSansWeb_Bold.eot?#iefix') format('embedded-opentype'),  /* IE6-8 */
    url('../fonts/iransans/IRANSansWeb_Bold.woff2') format('woff2'),  /* FF39+,Chrome36+, Opera24+*/
    url('../fonts/iransans/IRANSansWeb_Bold.woff') format('woff'),  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
    url('../fonts/iransans/IRANSansWeb_Bold.ttf') format('truetype');
}
@font-face {
    font-family: IRANSans;
    font-style: normal;
    font-weight: normal;
    src: url('../fonts/iransans/IRANSansWeb.eot');
    src: url('../fonts/iransans/IRANSansWeb.eot?#iefix') format('embedded-opentype'),  /* IE6-8 */
    url('../fonts/iransans/IRANSansWeb.woff2') format('woff2'),  /* FF39+,Chrome36+, Opera24+*/
    url('../fonts/iransans/IRANSansWeb.woff') format('woff'),  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
    url('../fonts/iransans/IRANSansWeb.ttf') format('truetype');
}

@font-face {
    font-family: Vazir;
    font-style: normal;
    font-weight: bold;
    src: url('../fonts/vazir/Vazir-Bold.eot');
    src: url('../fonts/vazir/Vazir-Bold.eot?#iefix') format('embedded-opentype'),  /* IE6-8 */
    url('../fonts/vazir/Vazir-Bold.woff2') format('woff2'),  /* FF39+,Chrome36+, Opera24+*/
    url('../fonts/vazir/Vazir-Bold.woff') format('woff'),  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
    url('../fonts/vazir/Vazir-Bold.ttf') format('truetype');
}
@font-face {
    font-family: IRANSans;
    font-style: normal;
    font-weight: normal;
    src: url('../fonts/vazir/Vazir.eot');
    src: url('../fonts/vazir/Vazir.eot?#iefix') format('embedded-opentype'),  /* IE6-8 */
    url('../fonts/vazir/Vazir.woff2') format('woff2'),  /* FF39+,Chrome36+, Opera24+*/
    url('../fonts/vazir/Vazir.woff') format('woff'),  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
    url('../fonts/vazir/Vazir.ttf') format('truetype');
}



:root {
    --background-image: url('../images/background.webp');

    /* fonts */
    --font-family-default: 'Vazir', 'IRANSans', arial, helvetica, sans-serif;
    --font-size-default: 0.9em;
    --line-height-default: 1.5;

    --h1-font-size: 1.7em;
    --h1-font-weight: normal;
    --h1-line-height: 1.2;
    --h1-height: calc(
            var(--h1-font-size) *
            var(--h1-line-height)
    );

    /* Layout */

    --flow-max-width: 50em;
    --inner-gap: 1.5em;


    --wrapper-min-width: 1.5em;
    --wrapper-max-width: 80em;
    --wrapper-width: max(
            var(--wrapper-min-width),
            calc((100% - var(--wrapper-max-width)) / 2)
    );

    --header-padding-vertical: 2em;
    --header-padding-horizontal: var(--wrapper-width);
    --header-padding: var(--header-padding-vertical) var(--header-padding-horizontal) calc(var(--header-padding-vertical) + 1em);
    --header-height: calc(
            var(--h1-height) +
            var(--header-padding-vertical) * 2
    );

    --footer-paddoing-vertical: 2em;
    --footer-padding: calc(var(--footer-paddoing-vertical) + 1em) var(--wrapper-width) var(--footer-paddoing-vertical);

    --menu-gap: 3em;

    --outer-max-width-oneBar: calc(
            var(--flow-max-width)
    );
    --outer-max-width-twoBar: calc(
            var(--outer-max-width-oneBar)
    );

    --smallscreen-outer-gap: 0.5em;
    --smallscreen-inner-gap: 1em;

    --section-padding: 1.5em;
    --section-border-width: 0;
    --section-inner-radius: 0.3em;
    --section-outer-radius: calc(
            var(--section-padding) +
            var(--section-border-width)
    );

    --card-radius: 1em;
    --card-max-width: 20em;
    --card-gap-between: 0.5em;
    --card-gap-bottom: calc(var(--card-gap-between) * 2);
    --card-pricing-max-width: 18em;
    --card-users-max-per-line: 3;
    --card-users-max-width: 12em;
    --card-users-calc-width: calc(
            var(--card-users-max-width) +
            var(--card-gap-between) +
            var(--card-gap-between)
    );
    --card-users-content-max-width: calc(
            var(--card-users-calc-width) *
            var(--card-users-max-per-line)
    );
    --card-icon-size: 10em;
    --card-fa-size: 8em;

    --default-border-radius: 0.3em;


    --body-background: #FFFBF2;
    --body-color: rgb(51, 33, 29);

    --header-background: linear-gradient(rgba(51, 33, 29, 0.9), rgba(51, 33, 29, 0.9));
    --header-color: #fff;


    --footer-background: var(--header-background);
    --footer-color: var(--header-color);


    --menu-color: var(--header-color);
    --menu-hover-color: rgb(218, 159, 91);
    --menu-current-color: var(--header-color);


    --default-box-shadow: 0 0.2em 0.3em 0.2em #0001;
    --radial-box-shadow: 0 0 0.3em 0.2em #000;


    --h2-color: rgb(51, 33, 29);
    --h3-color: var(--h2-color);
    --h4-color: var(--h2-color);


    --link-color: rgb(51, 33, 29);
    --link-visited-color: rgb(51, 33, 29);
    --link-hover-color: rgb(218, 159, 91);


    /*--logo-image:url();*/
}

/* :root */