@font-face {
    font-family: 'at9';
    src: url(fonts/at10.eot);
    src: url(fonts/at10.eot?#iefix) format("embedded-opentype"), url(fonts/at10.woff) format("woff"), url(fonts/at10.ttf) format("truetype"), url(fonts/at10.svg#at10) format("svg")
}

@font-face {
    font-family: "BNazanin";
    src: url("fonts/BNazanin.eot?") format("eot"), url("fonts/BNazanin.woff") format("woff"), url("fonts/BNazanin.ttf") format("truetype"), url("fonts/BNazanin.svg#BNazanin") format("svg");
}

@font-face {
    font-family: "Byekan";
    src: url("fonts/BYekan.ttf") format("truetype");
}

@font-face {
    font-family: "g700";
    src: url("fonts/geometria/700.woff2") format("woff");
}

@font-face {
    font-family: "g800";
    src: url("fonts/geometria/800.woff2") format("woff");
}

@font-face {
    font-family: morbold;
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url("fonts/shakeri/shakeri-bold.woff2") format("woff2"), url("fonts/shakeri/shakeri-bold.woff") format("woff"), url("fonts/shakeri/shakeri-bold.eot?#iefix") format("embedded-opentype"), url("fonts/shakeri/shakeri-bold.ttf") format("truetype")
}

@font-face {
    font-family: shakeriBold;
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url("fonts/peyda/PeydaWeb-Bold.woff2") format("woff2"), url("fonts/peyda/PeydaWeb-Bold.woff") format("woff"), url("fonts/peyda/Peyda-Bold.ttf") format("truetype")
}

@font-face {
    font-family: morRegular;
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("fonts/shakeri/shakeri-regular.woff2") format("woff2"), url("fonts/shakeri/shakeri-regular.woff") format("woff"), url("fonts/shakeri/shakeri-regular.eot?#iefix") format("embedded-opentype"), url("fonts/shakeri/shakeri-regular.ttf") format("truetype")
}

@font-face {
    font-family: shakeriRegular;
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("fonts/peyda/PeydaWeb-Regular.woff2") format("woff2"), url("fonts/peyda/PeydaWeb-Regular.woff") format("woff"), url("fonts/peyda/Peyda-Regular.ttf") format("truetype")
}

@font-face {
    font-family: morBlack;
    font-style: normal;
    font-weight: 900;
    font-display: swap;
    src: url("fonts/shakeri/shakeri-black.woff2") format("woff2"), url("fonts/shakeri/shakeri-black.woff") format("woff"), url("fonts/shakeri/shakeri-black.eot?#iefix") format("embedded-opentype"), url("fonts/shakeri/shakeri-black.ttf") format("truetype")
}

@font-face {
    font-family: shakeriBlack;
    font-style: normal;
    font-weight: 900;
    font-display: swap;
    src: url("fonts/peyda/PeydaWeb-Black.woff2") format("woff2"), url("fonts/peyda/PeydaWeb-Black.woff") format("woff"), url("fonts/peyda/Peyda-Black.ttf") format("truetype")
}

@font-face {
    font-family: shakeriExtraBold;
    font-style: normal;
    font-display: swap;
    src: url("fonts/peyda/PeydaWeb-ExtraBold.woff2") format("woff2"), url("fonts/peyda/PeydaWeb-ExtraBold.woff") format("woff"), url("fonts/peyda/Peyda-ExtraBold.ttf") format("truetype")
}

.smiloRegular {
    font-family: shakeriRegular;
}

.smiloBold {
    font-family: shakeriBold;
}

.smiloBlack {
    font-family: shakeriBlack;
}

.smiloExtraBold {
    font-family: shakeriExtraBold;
}

.instaStoryLogo{
    width:45px;height:45px;left: 15px; top: 20px; border-radius: 1000px; z-index: 9999;
}

.story-progress-container {
    position: absolute;
    top: 10px;
    left: 0;
    width: 100%;
    display: flex;
    flex-direction: row;
    direction: ltr;
    gap: 6px;
    padding: 0 10px;
    z-index: 9999;
}

.story-progress-bar {
    flex: 1;
    height: 3px;
    background: rgba(255,255,255,0.4);
    border-radius: 3px;
    overflow: hidden;
    direction: ltr;
}

.story-progress-fill {
    width: 0%;
    height: 100%;
    background: white;
    border-radius: 3px;
    transition: none;
    transform-origin: left; }