﻿
/*#region MainPage*/

body {
    font-family: IRANYekan;
    direction: ltr
}

:root {
    --Font_BlackHeader: bold 61px/98px Vazirmatn;
    --Font_Header1: bold 49px/79px Vazirmatn;
    --Font_Header2: bold 39px/63px Vazirmatn;
    --Font_Header3: bold 31px/50px Vazirmatn;
    --Font_Larger: bold 25px/43px Vazirmatn;
    --Font_Large: normal 20px IRANYekan;
    --Font_BodyBold: bold 16px IRANYekan;
    --Font_Body: normal 16px IRANYekan;
    --Font_Small: normal 13px IRANYekan;
    --Font_Tiny: normal 10px IRANYekan;
    --xsFont_BlackHeader_Header1: bold 25px/initial Vazirmatn;
    --xsFont_Header2: bold 21px/initial Vazirmatn;
    --xsFont_Header2_2: bold 19px/initial Vazirmatn;
    --xsFont_Header3: bold 15px/initial Vazirmatn;
}



/*#region TopNavbar*/

.header-area
{
    position:fixed;
}

@media screen and (min-width:768px) {
    .SectionContent {
        width: 100%;
        height: 800px;
        background-image: url(../../Images/Landing/TopBackground_lg.png);
        background-size: 100% 100%;
    }


    .TopRow {
        width: 100%;
        direction: rtl;
        height: auto;
        padding: 50px 56px;
        display: inline-flex;
    }

    .NavLinksDiv {
    }


    .NavLinks {
        display: inline-flex;
        float: right;
        direction: rtl;
    }

    .LinkDiv {
        cursor: pointer;
    }

    .NavLinks .LinkDiv:first-child {
        margin-right: 70px;
    }

    .LinkDiv a, .LinkDiv a:hover {
        color: #ffffff;
        opacity: 1 !important;
        text-decoration: none;
        width: 100%;
        height: 100%;
        padding: 10px 17px;
        font-family: IRANYekan !important;
        font-size: 14px;
        font-weight: bold;
        text-align: center;
        display: inline-flex;
    }



    .LeftOfNav {
        display: inline-flex;
        float: left;
        position: absolute;
        left: 56px;
        /*margin-top: 1.5%*/
    }

    .RegisterBtn {
        width: 140px;
        height: 40px;
        border-radius: 5px;
        box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2);
        background-color: #668eed;
        color: #485465;
        font-family: IRANYekan !important;
        font-size: 14px;
        font-weight: bold;
        cursor: pointer;
        padding: 10px;
        text-align: center;
        border: 1px solid white;
        border-radius: 8px;
    }
}


@media screen and (max-width:900px) and (min-width:768px) {

    .NavLinksDiv {
        height: 40px;
        margin-top: 70px;
    }


    .NavLinks {
        display: inline-flex;
        float: right;
        direction: rtl;
        position: absolute;
        left: 50%;
        transform: translate(-50%);
        width: 100%;
        background-color: rgba(255, 255, 255, 0.1);
    }

        .NavLinks .LinkDiv {
            cursor: pointer;
            position: relative;
            width: 25%;
            text-align: center;
        }


            .NavLinks .LinkDiv a, .NavLinks .LinkDiv a:hover {
                color: #ffffff;
                opacity: 1 !important;
                text-decoration: none;
                width: 100%;
                height: 40px;
                padding: 10px 17px;
                font-family: IRANYekan !important;
                font-size: 14px;
                font-weight: bold;
                text-align: center;
                display: grid;
            }


            .NavLinks .LinkDiv:first-child {
                margin-right: auto;
            }

    .LeftOfNav {
        margin-top: 3.5%
    }
}

@media screen and (max-width:1000px) and (min-width:901px) {
    .LeftOfNav {
        margin-top: 3%
    }
}

@media screen and (max-width:2000px) and (min-width:1001px) {
    .LeftOfNav {
        margin-top: 1.70%
    }
}

@media screen and (max-width:768px) and (min-width:300px) {



    .SectionContent {
        width: 100%;
        height: 550px;
        background-image: url(../../Images/Landing/TopBackground_xs.png);
        background-size: 100% 100%;
    }


    .TopRow {
        width: 100%;
        direction: rtl;
        height: auto;
        padding: 22px;
        display: inline-flex;
    }


    .NavLinksDiv {
        height: 40px;
        margin-top: 59px;
    }


    .NavLinks {
        display: inline-flex;
        float: right;
        direction: rtl;
        position: absolute;
        left: 50%;
        transform: translate(-50%);
        width: 100%;
        background-color: rgba(255, 255, 255, 0.1);
    }

        .NavLinks .LinkDiv {
            cursor: pointer;
            position: relative;
            width: 25%;
            text-align: center;
        }


    .LinkDiv a, .LinkDiv a:hover {
        color: #ffffff;
        opacity: 1 !important;
        text-decoration: none;
        width: 100%;
        height: 40px;
        padding: 12px 0;
        font-family: IRANYekan !important;
        font-size: 12px;
        font-weight: bold;
        text-align: center;
        display: grid;
    }


    .LeftOfNav {
        display: inline-flex;
        float: left;
        position: absolute;
        left: 56px;
        margin-top: 4.5%
    }

    .RegisterBtn {
        width: 140px;
        height: 40px;
        border-radius: 5px;
        box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2);
        background-color: #FFA500;
        color: #485465;
        font-family: IRANYekan !important;
        font-size: 14px;
        font-weight: bold;
        cursor: pointer;
        padding: 10px;
        text-align: center;
    }

    .LinkDiv a, .LinkDiv a:hover {
        color: #ffffff;
        opacity: 1 !important;
        text-decoration: none;
        width: 100%;
        height: 100%;
        padding: 10px 17px;
        font-family: IRANYekan !important;
        font-size: 14px;
        font-weight: bold;
        text-align: center;
        display: inline-flex;
    }

    .LeftOfNav .LinkDiv a, .LeftOfNav .LinkDiv a:hover {
        height: 29px;
        padding: 6px 17px;
    }
}


@media screen and (max-width:630px) and (min-width:300px) {
    /*.logo {
                visibility: hidden;
            }*/
}


@media (max-width: 1199px) {
    /*.header-area .menu-trigger {
                display: block !important;
            }*/
    /*.header-area .main-nav .nav {
                display: none !important;
            }*/
    /*.header-area .main-nav .logo {

                margin-right: 30%;
            }*/
    .header-area .main-nav .nav li:nth-child(6) a {
        color: #fff !important;
        padding: 0px 20px;
        display: inline-block;
        background-color: #FA84B4;
        font-size: 15px;
        font-weight: 400;
        color: #fff;
        text-transform: capitalize;
        padding: 12px 25px;
        border-radius: 0px;
        letter-spacing: 0.25px;
        background-image: none;
        width: 100%
    }
}



@media (max-width: 992px) {
    #Rahate {
        padding: 30px 70px
    }
}

/*#endregion MainPage*/


.InstagramIcon {
    background: linear-gradient(135deg,#e95076,#ba495e);
    font-size: 1.7rem;
    color: #e95076;
    -webkit-background-clip: text;
    color: transparent;
}

/*#Lk {
    color: white;
    font-weight: 200;
    cursor: pointer;
    font-weight: bold
}

    #Lk:hover {
        color: white;
        font-weight: 200;
        cursor: pointer;
        font-weight: bold
    }

#LKDiv {
    width: 250px;
    height: 100px;
    border: 1px solid #628FFC;
    padding: 15px;
    border-radius: 5px;
    background-color: limegreen;
}*/


/*#region Layout*/

@media screen and (min-width:768px) {


    .SectionContent {
        width: 100%;
        height: 800px;
        background-image: url(../../Images/Landing/TopBackground_lg.png);
        background-size: 100% 100%;
    }


    .TopRow {
        width: 100%;
        direction: rtl;
        height: auto;
        padding: 50px 56px;
        display: inline-flex;
    }

    .NavLinksDiv {
    }


    .NavLinks {
        display: inline-flex;
        float: right;
        direction: rtl;
    }

    .LinkDiv {
        cursor: pointer;
    }

    .NavLinks .LinkDiv:first-child {
        margin-right: 70px;
    }

    .LinkDiv a, .LinkDiv a:hover {
        color: #ffffff;
        opacity: 1 !important;
        text-decoration: none;
        width: 100%;
        height: 100%;
        padding: 10px 17px;
        font-family: IRANYekan !important;
        font-size: 14px;
        font-weight: bold;
        text-align: center;
        display: inline-flex;
    }



    .LeftOfNav {
        display: inline-flex;
        float: left;
        position: absolute;
        left: 56px;
        margin-top: 1.5%
    }

    .RegisterBtn {
        width: 140px;
        height: 40px;
        border-radius: 8px;
        box-shadow: 0 0px 0px 0 rgba(0, 0, 0, 0.2);
        background-color: #ffffff;
        color: #485465;
        font-family: IRANYekan !important;
        font-size: 14px;
        font-weight: bold;
        cursor: pointer;
        padding: 10px;
        text-align: center;
    }
}


@media screen and (max-width:900px) and (min-width:768px) {

    .NavLinksDiv {
        height: 40px;
        margin-top: 70px;
    }


    .NavLinks {
        display: inline-flex;
        float: right;
        direction: rtl;
        position: absolute;
        left: 50%;
        transform: translate(-50%);
        width: 100%;
        background-color: rgba(255, 255, 255, 0.1);
    }

        .NavLinks .LinkDiv {
            cursor: pointer;
            position: relative;
            width: 25%;
            text-align: center;
        }


            .NavLinks .LinkDiv a, .NavLinks .LinkDiv a:hover {
                color: #ffffff;
                opacity: 1 !important;
                text-decoration: none;
                width: 100%;
                height: 40px;
                padding: 10px 17px;
                font-family: IRANYekan !important;
                font-size: 14px;
                font-weight: bold;
                text-align: center;
                display: grid;
            }


            .NavLinks .LinkDiv:first-child {
                margin-right: auto;
            }

    .LeftOfNav {
        margin-top: 2%
    }
}


@media screen and (max-width:768px) and (min-width:300px) {



    .SectionContent {
        width: 100%;
        height: 550px;
        background-image: url(../../Images/Landing/TopBackground_xs.png);
        background-size: 100% 100%;
    }


    .TopRow {
        width: 100%;
        direction: rtl;
        height: auto;
        padding: 22px;
        display: inline-flex;
    }










    .NavLinksDiv {
        height: 40px;
        margin-top: 59px;
    }


    .NavLinks {
        display: inline-flex;
        float: right;
        direction: rtl;
        position: absolute;
        left: 50%;
        transform: translate(-50%);
        width: 100%;
        background-color: rgba(255, 255, 255, 0.1);
    }

        .NavLinks .LinkDiv {
            cursor: pointer;
            position: relative;
            width: 25%;
            text-align: center;
        }


    .LinkDiv a, .LinkDiv a:hover {
        color: #ffffff;
        opacity: 1 !important;
        text-decoration: none;
        width: 100%;
        height: 40px;
        padding: 12px 0;
        font-family: IRANYekan !important;
        font-size: 12px;
        font-weight: bold;
        text-align: center;
        display: grid;
    }



    .LeftOfNav {
        display: inline-flex;
        float: left;
        position: absolute;
        left: 22px;
        margin-top: 5%
    }

    .RegisterBtn {
        width: 101px;
        height: 29px;
        border-radius: 5px;
        box-shadow: 0 0px 0px 0 rgba(0, 0, 0, 0.2);
        background-color: #ffffff;
        color: #485465;
        font-family: IRANYekan !important;
        font-size: 12px;
        font-weight: bold;
        cursor: pointer;
        padding: 6px;
        text-align: center;
        border: 1px solid white;
        border-radius: 8px;
    }

    .LeftOfNav .LinkDiv a, .LeftOfNav .LinkDiv a:hover {
        height: 29px;
        padding: 6px 17px;
    }
}


@media screen and (max-width:400px) and (min-width:300px) {
    .logo {
        visibility: hidden;
    }
}


/*#endregion Layout*/


/*#region SomePages*/


@charset "UTF-8";
/*PEN STYLES*/
* {
    box-sizing: border-box;
}



.blog-card {
    display: flex;
    flex-direction: column;
    margin: 1rem auto;
    box-shadow: 0 3px 7px -1px rgba(0, 0, 0, 0.1);
    margin-bottom: 1.6%;
    background: #fff;
    line-height: 1.4;
    font-family: sans-serif;
    border-radius: 5px;
    overflow: hidden;
    z-index: 0;
}

    .blog-card a {
        color: inherit;
    }

        .blog-card a:hover {
            color: #5ad67d;
        }

    .blog-card:hover .photo {
        transform: scale(1.3) rotate(3deg);
    }

    .blog-card .meta {
        position: relative;
        z-index: 0;
        height: 200px;
    }

    .blog-card .photo {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background-size: cover;
        background-position: center;
        transition: transform 0.2s;
    }

    .blog-card .details,
    .blog-card .details ul {
        margin: auto;
        padding: 0;
        list-style: none;
    }

    .blog-card .details {
        position: absolute;
        top: 0;
        bottom: 0;
        left: -100%;
        margin: auto;
        transition: left 0.2s;
        background: rgba(0, 0, 0, 0.6);
        color: #fff;
        padding: 10px;
        width: 100%;
        font-size: 0.9rem;
    }

        .blog-card .details a {
            -webkit-text-decoration: dotted underline;
            text-decoration: dotted underline;
        }

        .blog-card .details ul li {
            display: inline-block;
        }

        .blog-card .details .author:before {
            font-family: FontAwesome;
            margin-right: 10px;
            content: "";
        }

        .blog-card .details .date:before {
            font-family: FontAwesome;
            margin-right: 10px;
            content: "";
        }

        .blog-card .details .tags ul:before {
            font-family: FontAwesome;
            content: "";
            margin-right: 10px;
        }

        .blog-card .details .tags li {
            margin-right: 2px;
        }

            .blog-card .details .tags li:first-child {
                margin-left: -4px;
            }

    .blog-card .description {
        padding: 1rem;
        background: #fff;
        position: relative;
        z-index: 1;
    }

        .blog-card .description h1,
        .blog-card .description h2 {
            font-family: Poppins, sans-serif;
        }

        .blog-card .description h1 {
            line-height: 1;
            margin: 0;
            font-size: 1.7rem;
        }

        .blog-card .description h2 {
            font-size: 1rem;
            font-weight: 300;
            text-transform: uppercase;
            color: #a2a2a2;
            margin-top: 5px;
        }

        .blog-card .description .read-more {
            text-align: right;
        }

            .blog-card .description .read-more a {
                color: #5ad67d;
                display: inline-block;
                position: relative;
            }

                .blog-card .description .read-more a:after {
                    content: "";
                    font-family: FontAwesome;
                    margin-left: -10px;
                    opacity: 0;
                    vertical-align: middle;
                    transition: margin 0.3s, opacity 0.3s;
                }

                .blog-card .description .read-more a:hover:after {
                    margin-left: 5px;
                    opacity: 1;
                }

    .blog-card p {
        position: relative;
        margin: 1rem 0 0;
    }

        .blog-card p:first-of-type {
            margin-top: 1.25rem;
        }

            .blog-card p:first-of-type:before {
                content: "";
                position: absolute;
                height: 5px;
                background: #5ad67d;
                width: 35px;
                top: -0.75rem;
                border-radius: 3px;
            }

    .blog-card:hover .details {
        left: 0%;
    }

@media (max-width: 950px) {
    .blog-card {
        margin-top: 10%
    }
}

@media (min-width: 640px) {
    .blog-card {
        flex-direction: row;
        max-width: 700px;
    }

        .blog-card .meta {
            flex-basis: 40%;
            height: auto;
        }

        .blog-card .description {
            flex-basis: 60%;
        }

            .blog-card .description:before {
                transform: skewX(-3deg);
                content: "";
                background: #fff;
                width: 30px;
                position: absolute;
                left: -10px;
                top: 0;
                bottom: 0;
                z-index: -1;
            }

        .blog-card.alt {
            flex-direction: row-reverse;
        }

            .blog-card.alt .description:before {
                left: inherit;
                right: -10px;
                transform: skew(3deg);
            }

            .blog-card.alt .details {
                padding-left: 25px;
            }
}

/*#endregion SomePages*/




/*#region PartOfBootstrap*/
.visible-xs, .visible-sm, .visible-md, .visible-lg {
    display: none !important;
}

.visible-xs-block,
.visible-xs-inline,
.visible-xs-inline-block,
.visible-sm-block,
.visible-sm-inline,
.visible-sm-inline-block,
.visible-md-block,
.visible-md-inline,
.visible-md-inline-block,
.visible-lg-block,
.visible-lg-inline,
.visible-lg-inline-block {
    display: none !important;
}

@media (max-width: 767px) {
    .visible-xs {
        display: block !important;
    }

    table.visible-xs {
        display: table;
    }

    tr.visible-xs {
        display: table-row !important;
    }

    th.visible-xs,
    td.visible-xs {
        display: table-cell !important;
    }
}

@media (max-width: 767px) {
    .visible-xs-block {
        display: block !important;
    }
}

@media (max-width: 767px) {
    .visible-xs-inline {
        display: inline !important;
    }
}

@media (max-width: 767px) {
    .visible-xs-inline-block {
        display: inline-block !important;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .visible-sm {
        display: block !important;
    }

    table.visible-sm {
        display: table;
    }

    tr.visible-sm {
        display: table-row !important;
    }

    th.visible-sm,
    td.visible-sm {
        display: table-cell !important;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .visible-sm-block {
        display: block !important;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .visible-sm-inline {
        display: inline !important;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .visible-sm-inline-block {
        display: inline-block !important;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .visible-md {
        display: block !important;
    }

    table.visible-md {
        display: table;
    }

    tr.visible-md {
        display: table-row !important;
    }

    th.visible-md,
    td.visible-md {
        display: table-cell !important;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .visible-md-block {
        display: block !important;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .visible-md-inline {
        display: inline !important;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .visible-md-inline-block {
        display: inline-block !important;
    }
}

@media (min-width: 1200px) {
    .visible-lg {
        display: block !important;
    }

    table.visible-lg {
        display: table;
    }

    tr.visible-lg {
        display: table-row !important;
    }

    th.visible-lg,
    td.visible-lg {
        display: table-cell !important;
    }
}

@media (min-width: 1200px) {
    .visible-lg-block {
        display: block !important;
    }
}

@media (min-width: 1200px) {
    .visible-lg-inline {
        display: inline !important;
    }
}

@media (min-width: 1200px) {
    .visible-lg-inline-block {
        display: inline-block !important;
    }
}

@media (max-width: 767px) {
    .hidden-xs {
        display: none !important;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .hidden-sm {
        display: none !important;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .hidden-md {
        display: none !important;
    }
}

@media (min-width: 1200px) {
    .hidden-lg {
        display: none !important;
    }
}



/**********************************************************Newer Bootstrap*/


.center-block {
    display: block;
    margin-right: auto;
    margin-left: auto;
}

.pull-right {
    float: right !important;
}

.pull-left {
    float: left !important;
}

.hide {
    display: none !important;
}

.show {
    display: block !important;
}

.invisible {
    visibility: hidden;
}

.text-hide {
    font: 0/0 a;
    color: transparent;
    text-shadow: none;
    background-color: transparent;
    border: 0;
}

.hidden {
    display: none !important;
}

.affix {
    position: fixed;
}

@-ms-viewport {
    width: device-width;
}

.visible-xs,
.visible-sm,
.visible-md,
.visible-lg {
    display: none !important;
}

.visible-xs-block,
.visible-xs-inline,
.visible-xs-inline-block,
.visible-sm-block,
.visible-sm-inline,
.visible-sm-inline-block,
.visible-md-block,
.visible-md-inline,
.visible-md-inline-block,
.visible-lg-block,
.visible-lg-inline,
.visible-lg-inline-block {
    display: none !important;
}

@media (max-width: 767px) {
    .visible-xs {
        display: block !important;
    }

    table.visible-xs {
        display: table !important;
    }

    tr.visible-xs {
        display: table-row !important;
    }

    th.visible-xs,
    td.visible-xs {
        display: table-cell !important;
    }
}

@media (max-width: 767px) {
    .visible-xs-block {
        display: block !important;
    }
}

@media (max-width: 767px) {
    .visible-xs-inline {
        display: inline !important;
    }
}

@media (max-width: 767px) {
    .visible-xs-inline-block {
        display: inline-block !important;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .visible-sm {
        display: block !important;
    }

    table.visible-sm {
        display: table !important;
    }

    tr.visible-sm {
        display: table-row !important;
    }

    th.visible-sm,
    td.visible-sm {
        display: table-cell !important;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .visible-sm-block {
        display: block !important;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .visible-sm-inline {
        display: inline !important;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .visible-sm-inline-block {
        display: inline-block !important;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .visible-md {
        display: block !important;
    }

    table.visible-md {
        display: table !important;
    }

    tr.visible-md {
        display: table-row !important;
    }

    th.visible-md,
    td.visible-md {
        display: table-cell !important;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .visible-md-block {
        display: block !important;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .visible-md-inline {
        display: inline !important;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .visible-md-inline-block {
        display: inline-block !important;
    }
}

@media (min-width: 1200px) {
    .visible-lg {
        display: block !important;
    }

    table.visible-lg {
        display: table !important;
    }

    tr.visible-lg {
        display: table-row !important;
    }

    th.visible-lg,
    td.visible-lg {
        display: table-cell !important;
    }
}

@media (min-width: 1200px) {
    .visible-lg-block {
        display: block !important;
    }
}

@media (min-width: 1200px) {
    .visible-lg-inline {
        display: inline !important;
    }
}

@media (min-width: 1200px) {
    .visible-lg-inline-block {
        display: inline-block !important;
    }
}

@media (max-width: 767px) {
    .hidden-xs {
        display: none !important;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .hidden-sm {
        display: none !important;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .hidden-md {
        display: none !important;
    }
}

@media (min-width: 1200px) {
    .hidden-lg {
        display: none !important;
    }
}

.visible-print {
    display: none !important;
}

@media print {
    .visible-print {
        display: block !important;
    }

    table.visible-print {
        display: table !important;
    }

    tr.visible-print {
        display: table-row !important;
    }

    th.visible-print,
    td.visible-print {
        display: table-cell !important;
    }
}

.visible-print-block {
    display: none !important;
}

@media print {
    .visible-print-block {
        display: block !important;
    }
}

.visible-print-inline {
    display: none !important;
}

@media print {
    .visible-print-inline {
        display: inline !important;
    }
}

.visible-print-inline-block {
    display: none !important;
}

@media print {
    .visible-print-inline-block {
        display: inline-block !important;
    }
}

@media print {
    .hidden-print {
        display: none !important;
    }
}
/*#endregion PartOfBootstrap*/



/*#region Negin*/
@font-face {
    font-family: IRANYekan;
    font-style: normal;
    font-weight: normal;
    src: url('../Font/IRANYekan/iranyekanwebregular(fanum).eot');
    src: url('../Font/IRANYekan/iranyekanwebregular(fanum).eot?#iefix') format('embedded-opentype'), /* IE6-8 */
    url('../Font/IRANYekan/iranyekanwebregular(fanum).woff2') format('woff2'), /* FF39+,Chrome36+, Opera24+*/
    url('../Font/IRANYekan/iranyekanwebregular(fanum).woff') format('woff'), /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
    url('../Font/IRANYekan/iranyekanwebregular(fanum).ttf') format('truetype');
}

@font-face {
    font-family: IRANYekan;
    font-style: normal;
    font-weight: bold;
    src: url('../Font/IRANYekan/iranyekanwebbold(fanum).eot');
    src: url('../Font/IRANYekan/iranyekanwebbold(fanum).eot?#iefix') format('embedded-opentype'), /* IE6-8 */
    url('../Font/IRANYekan/iranyekanwebbold(fanum).woff2') format('woff2'), /* FF39+,Chrome36+, Opera24+*/
    url('../Font/IRANYekan/iranyekanwebbold(fanum).woff') format('woff'), /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
    url('../Font/IRANYekan/iranyekanwebbold(fanum).ttf') format('truetype');
}

@font-face {
    font-family: IRANYekan;
    font-style: normal;
    font-weight: 300;
    src: url('../Font/IRANYekan/iranyekanweblight(fanum).eot');
    src: url('../Font/IRANYekan/iranyekanweblight(fanum).eot?#iefix') format('embedded-opentype'), /* IE6-8 */
    url('../Font/IRANYekan/iranyekanweblight(fanum).woff2') format('woff2'), /* FF39+,Chrome36+, Opera24+*/
    url('../Font/IRANYekan/iranyekanweblight(fanum).woff') format('woff'), /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
    url('../Font/IRANYekan/iranyekanweblight(fanum).ttf') format('truetype');
}


@font-face {
    font-family: Vazir;
    font-style: normal;
    font-weight: normal;
    src: url('../Font/Vazir/Vazir.eot') format('embedded-opentype');
    src: url('../Font/Vazir/Vazir.woff2') format('woff2'), /* FF39+,Chrome36+, Opera24+*/
    url('../Font/Vazir/Vazir.woff') format('woff'), /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
    url('../Font/Vazir/Vazir.ttf') format('truetype');
}


@font-face {
    font-family: Vazir;
    font-style: normal;
    font-weight: bold;
    src: url('../Font/Vazir/Vazir-Bold.eot') format('embedded-opentype');
    src: url('../Font/Vazir/Vazir-Bold.woff2') format('woff2'), /* FF39+,Chrome36+, Opera24+*/
    url('../Font/Vazir/Vazir-Bold.woff') format('woff'), /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
    url('../Font/Vazir/Vazir-Bold.ttf') format('truetype');
}


@font-face {
    font-family: Vazir;
    font-style: normal;
    font-weight: bold;
    src: url('../Font/Vazir/Vazir-Medium.eot') format('embedded-opentype');
    src: url('../Font/Vazir/Vazir-Medium.woff2') format('woff2'), /* FF39+,Chrome36+, Opera24+*/
    url('../Font/Vazir/Vazir-Medium.woff') format('woff'), /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
    url('../Font/Vazir/Vazir-Medium.ttf') format('truetype');
}

@font-face {
    font-family: Vazir;
    font-style: normal;
    font-weight: bold;
    src: url('../Font/Vazir/Vazir-Thin.eot') format('embedded-opentype');
    src: url('../Font/Vazir/Vazir-Thin.woff2') format('woff2'), /* FF39+,Chrome36+, Opera24+*/
    url('../Font/Vazir/Vazir-Thin.woff') format('woff'), /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
    url('../Font/Vazir/Vazir-Thin.ttf') format('truetype');
}


@font-face {
    font-family: Vazir;
    font-style: normal;
    font-weight: lighter;
    src: url('../Font/Vazir/Vazir-Light.eot') format('embedded-opentype');
    src: url('../Font/Vazir/Vazir-Light.woff2') format('woff2'), /* FF39+,Chrome36+, Opera24+*/
    url('../Font/Vazir/Vazir-Light.woff') format('woff'), /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
    url('../Font/Vazir/Vazir-Light.ttf') format('truetype');
}


@font-face {
    font-family: Vazir;
    font-style: normal;
    font-weight: bold;
    src: url('../Font/Vazir/Vazir-Medium.eot') format('embedded-opentype');
    src: url('../Font/Vazir/Vazir-Medium.woff2') format('woff2'), /* FF39+,Chrome36+, Opera24+*/
    url('../Font/Vazir/Vazir-Medium.woff') format('woff'), /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
    url('../Font/Vazir/Vazir-Medium.ttf') format('truetype');
}


body {
    font-family: IRANYekan !important;
    overflow-x: hidden !important;
    overflow-y: scroll;
    cursor: default;
    direction: rtl;
    direction: initial !important;
}

*, body {
    cursor: default;
}



@media screen and (max-width:299px) and (min-width:0px) {
    body {
        display: none !important;
    }
}

input, button, select, textarea {
    outline: none !important;
}


/*#region Scroll*/
/* width only for firefox */
* {
    /*scrollbar-width: thin !important;
        scrollbar-color: #628ffc transparent !important;*/
    scrollbar-width: none !important;
    scrollbar-color: transparent transparent !important;
}


/* width */
::-webkit-scrollbar {
    width: 0px; /*for vertical scrolls*/
    height: 1px; /*for horizontal scrolls*/
}

/* Track */
::-webkit-scrollbar-track {
    background: transparent;
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: transparent;
}

    /* Handle on hover */
    ::-webkit-scrollbar-thumb:hover {
        /*background: #628ffc;*/
        background: transparent;
        cursor: pointer;
    }


/* Hide scrollbar for Chrome, Safari and Opera */
*::-webkit-scrollbar {
    display: none !important;
}

/* Hide scrollbar for IE and Edge */
* {
    -ms-overflow-style: none !important;
    overflow: -moz-scrollbars-none !important; /* Old Versions */
}


/*#endregion Scroll*/


.header-area {
    background-color: #668eed !important;
    box-shadow: 0px 0px 10px rgba(0,0,0,0.15) !important;
}

.Voroud1 {
    display: inline-block !important;
    color: white !important;
    cursor: pointer !important;
}

.Voroud2 {
    display: none !important;
    color: white !important;
    cursor: pointer !important;
}

.RegisterBtn {
    background-color: #668eed;
}
/*
    .RegisterBtn a {
        color: white !important;
        cursor: pointer !important;
    }*/

.header-area .main-nav {
    min-height: 100%;
}


    .header-area .main-nav .nav li a {
        color: white;
        cursor: pointer;
        padding: 0;
    }

        .header-area .main-nav .nav li:hover a,
        .header-area .main-nav .nav li a.active {
            color: white !important;
            font-weight: bolder !important;
            font-size: 18px !important;
        }

    .header-area .main-nav .nav li,
    .header-area .main-nav .nav li:hover,
    .header-area .main-nav .nav li a,
    .header-area .main-nav .nav li:hover a {
        background-color: transparent !important;
    }

        .header-area .main-nav .nav li:first-child a {
            padding: 0 20px;
            background-color: #50E377 !important;
        }


            /*.header-area .main-nav .nav li:last-child:hover a,
    .header-area .main-nav .nav li:last-child a.active*/
            .header-area .main-nav .nav li:first-child:hover a,
            .header-area .main-nav .nav li:first-child a.active {
                font-size: 15px !important;
            }

.main-red-button a:hover {
    background-color: #FA84B4 !important;
}

.LeftOfNav {
    margin: 29.5px 0;
}

.header-area .main-nav .menu-trigger span,
.header-area .main-nav .menu-trigger span:before,
.header-area .main-nav .menu-trigger span:after,
.background-header .main-nav .menu-trigger span,
.background-header .main-nav .menu-trigger span:before,
.background-header .main-nav .menu-trigger span:after {
    background-color: white !important;
}

.header-area .main-nav .menu-trigger.active span {
    background-color: transparent !important;
}


.RegisterPrice {
    display: grid;
}

.glow {
    cursor: pointer;
    color: #668eed;
    color: white;
    -webkit-animation: glow 1s ease-in-out infinite alternate;
    -moz-animation: glow 1s ease-in-out infinite alternate;
    animation: glow 1s ease-in-out infinite alternate;
    margin-top: 20px;
}


@-webkit-keyframes glow {
    from {
        text-shadow: 0 0 1px #fff, 0 0 2px #fff, 0 0 3px #668eed, 0 0 4px #668eed, 0 0 5px #668eed, 0 0 6px #668eed, 0 0 7px #668eed;
    }

    to {
        text-shadow: 0 0 5px #fff, 0 0 6px #658fed, 0 0 7px #658fed, 0 0 8px #658fed, 0 0 9px #658fed, 0 0 10px #658fed, 0 0 11px #658fed;
    }
}

.main-banner .left-content h6, .main-banner .left-content h2, .RegisterPrice {
    margin-bottom: 30px;
}

.main-banner .left-content h2 {
    font-size: 40px;
    line-height: 55px;
}

.main-banner p,
.main-banner ul,
ul.myUL {
    margin: 30px 0px 70px !important;
    direction: rtl;
}

.main-banner p {
    text-align: justify
}

.main-banner .HasSub {
    margin-bottom: 40px !important;
}

.main-banner ul, ul.myUL {
    display: grid;
    /*justify-content: center;*/
    text-align: right;
    padding-right: 15px;
}

    .main-banner ul.insideUL {
        margin: -40px 0 0 !important;
    }

.main-banner {
    padding-top: 0;
    padding-bottom: 90px;
}

.LinksCol_LinksDiv {
    padding: 20px 0 35px;
}

    .main-banner.wow,
    .main-banner .MainContentCol,
    .LinksCol_LinksDiv > .TopPicture {
        padding-top: 170px;
    }

.blog-card {
    box-shadow: 0 0px 25px 0px rgba(0, 0, 0, 0.1) !important;
    margin-bottom: 70px !important;
}

    .blog-card .description {
        padding: 35px 25px !important;
    }

        .blog-card .description h2, .blog-card .description h3 {
            margin-top: 15px !important;
        }

    .blog-card p:first-of-type:before {
        width: 100% !important;
    }

    .blog-card p {
        padding: 30px 0 0 20px;
    }

.our-services .left-image {
    margin-left: 45px;
    margin-right: 0;
}

.myTitleTitle {
    display: flex;
    justify-content: center;
}

form#contact label {
    padding: 15px 20px;
    height: auto;
}

    form#contact label i {
        float: right;
        margin-left: 15px;
        color: #f73a87;
    }

    form#contact label b {
        font-weight: bold;
    }

    form#contact label.WhatsAppLabel:hover,
    form#contact label.TelephoneLabel:hover {
        cursor: pointer;
        -webkit-animation: change-color 3s linear 0s infinite normal;
        -moz-animation: change-color 3s linear 0s infinite normal;
        -ms-animation: change-color 3s linear 0s infinite normal;
        animation: change-color 3s linear 0s infinite normal;
    }

        form#contact label.WhatsAppLabel:hover a,
        form#contact label.TelephoneLabel:hover a,
        form#contact label.WhatsAppLabel:hover li,
        form#contact label.TelephoneLabel:hover li {
            cursor: pointer;
            color: white !important;
            animation-delay: 0.25s;
        }


@-webkit-keyframes change-color {
    0% {
        background-color: #d1f3ff;
    }

    100% {
        background-color: #03a4ed;
    }
}

@keyframes change-color {
    0% {
        background-color: #d1f3ff;
    }

    100% {
        background-color: #03a4ed;
    }
}

form#contact button a {
    cursor: pointer;
}

form#contact label:hover i {
    color: white !important;
}

form#contact .AddressLabel:hover i {
    color: #f73a87 !important;
}


.our-services .section-heading h2 {
    margin: 0 0 50px 0;
}

.our-services {
    padding-top: 70px;
}

.our-portfolio .showed-content {
    padding: 50px 0;
    min-height: 230px;
}


    .our-portfolio .showed-content h5 {
        white-space: nowrap;
    }


.inner-content ul {
    float: right;
    width: 100%;
    text-align: right;
    margin-bottom: 35px;
}

.our-portfolio {
    padding-top: 120px;
    padding-bottom: 120px;
}

.our-blog .row {
    display: flex;
    justify-content: space-between;
}

/*.our-blog .top-dec {
            text-align: center;
            position: relative;
        }

            .our-blog .top-dec img {
                max-width: 270px;
                position: absolute;
                margin-top: -70px;
                margin-right: -242px;
            }*/

.our-blog .section-heading h2 {
    margin: auto;
    text-align: center;
}

.our-blog {
    padding-top: 0;
}

.contact-us {
    padding: 260px 0px;
}

.our-portfolio .section-heading h2 {
    margin-bottom: 70px;
}

form#contact .contact-dec {
    position: initial;
    -moz-transform: scale(-1, 1);
    -webkit-transform: scale(-1, 1);
    -o-transform: scale(-1, 1);
    -ms-transform: scale(-1, 1);
    transform: scale(-1, 1);
}

#contact .section-heading {
    direction: rtl;
}

    #contact .section-heading h2, #contact .section-heading p {
        text-align: center !important;
    }

.main-blue-button a {
    box-shadow: 0 0px 5px 0px #fff;
    cursor: pointer;
}


.header-area .main-nav .logo {
    line-height: initial;
    height: 100%;
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
}

.jumbotron {
    color: white !important;
    /*background-color: #628FFC !important;*/
    /*background-color: #c1d2f7!important;*/
    /*background-color: #668eed !important;*/
    background: rgb(102,142,237);
    background: linear-gradient(180deg, rgba(102,142,237,1) 0%, rgba(193,210,247,1) 70%, rgba(255,255,255,1) 99%);
    text-align: center;
    margin-top: 100px !important;
    margin-bottom: 70px !important;
    padding: 60px 20px 85px !important;
    border-radius: 20px 20px 0 0 !important;
}

    .jumbotron h2 {
        margin: 0;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .jumbotron + .row {
        direction: rtl;
    }

.jumbotron_img {
    width: 70%;
    margin-top: 70px;
}

    .jumbotron_img:last-of-type {
        margin-bottom: 130px;
    }

footer p {
    white-space: nowrap;
}

.blog-card {
    box-shadow: 0 7px 12px 10px rgba(0, 0, 0, 0.1);
}


    .blog-card:last-of-type {
        margin-bottom: 100px;
    }

    .blog-card .description {
        text-align: right;
        direction: rtl;
    }


.LKDiv, .LKDiv:hover {
    border: 1px solid white;
    padding: 15px;
    border-radius: 5px;
    background-color: limegreen;
    color: white;
    font-weight: bold;
    margin: 20px auto 70px;
    text-align: center;
    display: table;
}


.LinksCol {
    text-align: right;
    float: right;
    display: grid;
    /*justify-content: center;*/
    align-content: flex-start;
    padding: 0 30px;
}


.SocialMediaDiv {
    display: flex;
    align-items: center;
    direction: rtl;
}

    .SocialMediaDiv * {
        cursor: pointer;
    }

.InstagramIcon {
    margin-left: 10px;
}

.main-banner p.RelatedLinks {
    display: grid;
    margin: 0px 0px 50px !important;
}

.RelatedLinks *, .MainColumnRow li {
    padding: 12px 0;
    line-height: 20px;
    text-align: right;
    font-size: 15px;
}

.RelatedLinks * {
    font-weight: bold;
}

a, a:hover, a *, a *:hover {
    cursor: pointer !important;
}

.MainColumnRow h1,
.MainColumnRow h2,
.MainColumnRow h3,
.MainColumnRow h4,
.MainColumnRow h5 {
    font-weight: bold;
    text-align: center;
    display: grid;
}

.MainColumnRow h1 {
    padding-bottom: 35px;
}

.MainColumnRow .LinksCol_LinksDiv h5 {
    text-align: right;
}

.MainColumnRow ul, .MainColumnRow li, ul.myUL, ul.myUL li {
    list-style-type: square !important;
}

    ul.myUL li {
        padding: 15px 0;
    }

.MainColumnRow li {
    color: #2a2a2a;
}

.main-banner, .main-banner:after, .main-banner:before {
    background-image: none !important;
}

.MainContentCol.PageSingleCol {
    background-image: url('../../assets/images/asemounCloud - Negin.png');
    background-size: 70%;
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-position: center;
}

.thumbnail {
    padding: 45px 25px !important;
    border: 3px dotted #658fed !important;
    display: grid !important;
    justify-content: center;
    justify-items: center;
    align-content: center;
    align-items: center;
    margin-bottom: 30px !important;
}

    .thumbnail .caption {
        padding: 0 !important;
        padding-top: 20px !important;
        white-space: nowrap;
    }

    .thumbnail:hover,
    .thumbnail *:hover {
        cursor: pointer !important;
    }

    .thumbnail:hover {
        cursor: pointer !important;
        box-shadow: 0 0 11px rgba(0,0,64,.2) !important;
        padding: 36px 25px !important;
    }

        .thumbnail:hover .caption,
        .thumbnail *:hover .caption {
            font-weight: bold !important;
            font-size: medium !important;
        }

        .thumbnail:hover img,
        .thumbnail *:hover img {
            width: 65px !important;
        }

@media screen and (max-width: 1400px) {
    .main-banner::after {
        position: relative !important;
    }
}

@media screen and (min-width:768px) {
    .RegisterPrice {
        white-space: nowrap;
    }

    .myTitleTitle {
        white-space: nowrap;
    }

    .MainColumnRow {
        direction: rtl;
    }
}


@media screen and (max-width: 1199px) and (min-width: 1162px) {
    .header-area .main-nav .nav {
        display: none !important;
    }
}

@media (max-width: 1199px) {
    .header-area .menu-trigger {
        display: block !important;
    }
}

.header-area .main-nav .menu-trigger span::before,
.header-area .main-nav .menu-trigger span::after {
    width: 100%;
}

@media screen and (min-width: 1200px) {

    .header-sticky, .header-area.header-sticky {
        min-height: 100px;
        height: 100px;
    }

    .header-area .main-nav .nav {
        margin: 0 !important;
        position: absolute;
        left: 50%;
        transform: translate(-50%, -50%);
        top: 50%;
        width: max-content;
    }

    .background-header .logo, .background-header .main-nav .nav li a {
        color: white !important;
    }

    .our-blog {
        padding-bottom: 300px !important;
    }

    .header-area .main-nav .logo {
        position: absolute;
        right: 56px;
    }


    .jumbotron {
        margin-top: 150px !important;
    }
}

@media screen and (min-width:1200px) {
    .our-portfolio .item:hover .hidden-content {
        top: -115px !important;
        opacity: 1;
        visibility: visible;
        padding: 30px 20px;
    }

    .container .FixedImg {
        max-width: calc(1140px / 2 - 60px);
    }
}

@media screen and (max-width:1199px) {

    .Voroud1 {
        display: none !important;
    }

    .Voroud2 {
        display: inline-block !important;
    }

    .header-area .main-nav {
        display: flex;
        justify-content: space-evenly;
    }

    .LeftOfNav {
        margin: 0;
        margin-top: initial !important;
        display: flex;
        align-content: center;
        align-items: center;
        align-self: center;
        float: none;
        left: 40px;
    }

    .header-area .main-nav {
        display: flex;
        justify-content: space-between;
        align-content: center;
        align-items: center;
        white-space: nowrap;
        /*width: 100%;
                    position: absolute;*/
        min-height: 100px;
    }

    /* .header-area .main-nav .menu-trigger span {
            transform: rotate(180deg);
        }
        */

    .header-area .logo {
        margin-left: initial;
        position: absolute;
        left: 50%;
        transform: translate(-50%,-50%);
        top: 50%;
    }


    .header-area.header-sticky, .header-area .main-nav {
        height: 70px;
        min-height: 70px;
    }

        .header-area .main-nav .menu-trigger {
            transform: translate(0, -50%);
            height: 35px;
            top: 50%;
        }

    .main-banner::before, .main-banner::after {
        top: 70px;
    }

    .header-area.header-sticky .nav {
        margin-top: 0 !important;
        position: absolute;
        top: 70px;
        left: 0;
        box-shadow: 0px 0px 10px rgba(0,0,0,0.15) !important;
        background: rgb(102,142,237);
        background: linear-gradient(180deg, rgba(102,142,237,1) 0%, rgba(101,143,237,1) 50%, rgba(209,243,255,1) 100%);
    }


    .header-area .main-nav .nav li a, .header-area .main-nav .nav li {
        background: none !important;
        background-image: none !important;
        color: white !important;
    }

        .header-area .main-nav .nav li a:hover {
            color: white !important;
        }

        .header-area .main-nav .nav li a, .main-red-button {
            width: 100%;
            background: none !important;
        }

            .header-area .main-nav .nav li a:hover {
                width: 100%;
                background: none !important;
                font-weight: bold !important;
                font-size: larger !important;
            }

            /*.header-area .main-nav .nav li:last-child a,*/
            .header-area .main-nav .nav li:first-child a,
            .main-red-button a {
                /*background-color: none !important;*/
                background-color: #50E377 !important;
                border-radius: 0 !important;
            }



    li.scroll-to-section {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 100%;
    }

    .scroll-to-section a:hover {
        font-weight: bold !important;
        font-size: larger !important;
        color: white;
        animation-name: focus-in-contract;
        animation-duration: 0.25s;
        animation-timing-function: ease;
        animation-delay: 0s;
        animation-iteration-count: 1;
        animation-direction: normal;
        animation-fill-mode: none;
    }

    /*.header-area .main-nav .nav li:last-child a:hover {*/
    .header-area .main-nav .nav li:first-child a:hover {
        /*font-size: 15px !important;*/
        font-size: larger !important;
        animation: none !important;
    }

    @keyframes focus-in-contract {
        0% {
            letter-spacing: 1em;
            filter: blur(12px);
            opacity: 0;
        }

        100% {
            filter: blur(0);
            opacity: 1;
        }
    }
}

@media screen and (max-width:1199px) and (min-width:992px) {
    .our-portfolio .item:hover .hidden-content {
        top: -140px;
        opacity: 1;
        visibility: visible;
        padding: 30px 20px;
    }

    .our-portfolio .item:hover .hidden-content4 {
        top: -140px !important;
    }

    .our-portfolio .item:hover .hidden-content3 {
        top: -170px !important;
    }

    .our-portfolio .item:hover .hidden-content2 {
        top: -140px !important;
    }

    .our-portfolio .item:hover .hidden-content1 {
        top: -140px !important;
    }
}

@media screen and (min-width:992px) {
    /*.our-blog .section-heading h2 {
                margin-right: 40px;
                max-width: 561px;
                text-align: right;
                float: right;
                margin-top: -100px;
                margin-bottom: 100px;
            }*/
    .our-blog {
        padding-bottom: 170px;
    }

    .TopPicture {
        z-index: 1;
        position: relative;
    }

    .FixedImg {
        opacity: 0.3;
        height: 100%;
        width: calc(50% - 60px); /*60 is sumation of this col paddings*/
        position: fixed;
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
        bottom: 35px;
    }

    .LinksCol_LinksDiv {
        z-index: 1;
        background-color: white;
        padding-right: 25px;
    }

    .container .FixedImg {
        max-width: calc(960px / 2 - 60px);
    }
}

@media screen and (min-width: 1400px) {
    .container .FixedImg {
        max-width: calc(1320px / 2 - 60px);
    }

    .main-banner .left-content h6, .main-banner .left-content h2, .RegisterPrice {
        margin-bottom: 55px;
    }

    .main-banner .left-content h2 {
        font-size: 35px;
        line-height: 45px;
    }

    .main-banner {
        position: relative;
        z-index: 1;
        padding: 0 25px 120px;
    }

        .main-banner.wow,
        .main-banner .MainContentCol {
            padding-top: 150px;
        }

    .our-services .left-image {
        margin: 0;
        margin-top: 45px;
    }

    .contact-us .section-heading {
        margin-bottom: 70px;
    }

    /*#about {
        margin-top: 70px;
    }*/

    .our-services {
        padding-top: 70px;
    }


    .our-portfolio .item:hover .hidden-content {
        top: -45px;
        opacity: 1;
        visibility: visible;
        width: 100%;
    }

    .our-portfolio .item:hover .showed-content {
        position: initial;
    }

    .our-services .section-heading h2 {
        margin: 250px 0 70px 0;
    }


    .about-us .left-image {
        bottom: -400px;
    }

    .about-us .services .item {
        width: 100%;
    }

    #Rahate {
        padding: 30px;
    }

    .TopPicture {
        position: fixed;
        z-index: auto;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        height: 110vh;
        object-fit: contain;
        opacity: 0.35;
    }

    /*.main-banner, .main-banner:after, .main-banner:before {
        background-image: none !important;
    }*/
}

@media screen and (max-width:767px) {
    .header-area .logo {
        right: 100px;
        transform: translate(0, -50%);
        top: 50%;
        left: initial;
    }

    .main-banner .left-content h2 {
        font: var(--Font_Larger);
        line-height: 35px;
    }

    .our-blog .left-image .info .inner-content {
        margin-top: -32px;
    }

    .our-portfolio .item:hover .hidden-content {
        top: -70px;
    }

    .our-portfolio .item:hover .hidden-content3 {
        top: -100px;
    }

    .jumbotron {
        padding: 40px 10px 65px !important;
    }

        .jumbotron h2 {
            font: var(--Font_Large);
        }


    .jumbotron_img {
        width: 100%;
        margin-top: 50px;
    }


    footer p {
        font-size: 11px;
    }
}

@media screen and (max-width:630px) {

    .header-area .main-nav .logo {
        right: 65px;
    }

    .LeftOfNav {
        left: 15px;
    }

    .header-area .main-nav .menu-trigger {
        right: 15px;
    }
}

@media screen and (max-width:575px) {
    .our-portfolio .item:hover .hidden-content {
        top: 10px;
    }

    .our-portfolio .item:hover .hidden-content3 {
        top: 15px;
    }
}

@media screen and (max-width:575px) and (min-width:398px) {
    .our-portfolio .item:hover .hidden-content {
        top: -15px;
    }

    .our-portfolio .item:hover .hidden-content3 {
        top: -42.5px;
    }
}

@media screen and (max-width:500px) {
    /*.header-area .main-nav .logo {
        right: 55px;
    }*/

    .RegisterBtn {
        width: 120px;
    }

    .our-blog .left-image .info .inner-content {
        margin-left: 30px;
        padding: 20px;
    }

    .inner-content ul {
        float: none;
        display: grid;
        justify-content: right;
        text-align: right;
    }

    .our-blog .left-image ul li {
        margin-right: 0;
        margin-bottom: 10px;
    }

    .about-us .services .item .icon {
        margin-right: 0 !important;
    }

    .about-us .services .item p {
        padding-right: 0px !important;
        padding-top: 20px !important;
    }

    .about-us .services .item h4 {
        margin-top: 25px !important;
    }
}

@media screen and (max-width:400px) {
    .RegisterBtn {
        width: 90px;
    }
}

@media screen and (max-width:397px) {
    .our-portfolio .item:hover .hidden-content {
        top: -45px;
    }
}

@media screen and (min-width: 640px) {
    .blog-card {
        margin-bottom: 50px;
    }
}

@media screen and (max-width: 950px) {
    .blog-card {
        margin-top: 70px;
        width: 90%;
    }
}
/*#endregion Negin*/
/*#region NewDesign*/
/*#region NewLayout*/

html, body {
    max-width: 100%;
    overflow-x: hidden;
}

.myRenderBody {
    background-color: white;
    max-height: 100%;
    padding-top: 70px;
    direction: rtl;
}


/*#region DemoDivision*/

.DemoDivision {
    padding: 72px 30px;
    background: #628FFC;
    display: grid;
    justify-items: center;
    text-align: center;
    margin-bottom: -72px;
}

.Middle_DemoDivision {
    margin-bottom: 0;
}

.second .Middle_DemoDivision {
    width: calc(100% + 60px);
    position: relative;
    right: -30px;
}

.DemoDivision span {
    font-weight: 700;
    color: #FFFFFF;
    margin-bottom: 16px;
}

.DemoDivision_Title {
    font: var(--Font_Header1);
}

.DemoDivision_Description {
    font: var(--Font_Body);
    line-height: 32px;
    max-width: 640px;
}

.DemoDivision_SmallTitle {
    font: var(--Font_Larger);
}

.DemoDivision_Btn {
    font: var(--Font_BodyBold);
    line-height: 28px;
    text-align: center;
    color: #2A323C;
    padding: 16px 24px;
    background: #50E377;
    box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.25);
    border-radius: 8px;
    margin-top: 16px;
}

    .DemoDivision_Btn:hover {
        color: white;
    }

@media screen and (max-width:767px) {

    .DemoDivision * {
        line-height: initial;
    }

    .DemoDivision_Title {
        font-size: 21px;
    }

    .DemoDivision_Description {
        font-size: 11px;
    }

    .DemoDivision_SmallTitle {
        font-size: 15px;
    }

    .DemoDivision_Btn {
        font-size: 12px;
        padding: 7px 14px;
    }
}

/*#endregion DemoDivision*/

/*#endregion NewLayout*/



div.first {
    width: 100%;
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: relative;
}

div.first {
    height: calc(100vh - 70px);
    max-height: 600px;
    min-width: 100%;
}

/*.first img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}*/

.first#CoffeShop_Resturant {
    background-image: url('../../images/landing/asnaf/New/کافی‌شاپ و رستوران.svg');
}

.first#Attari {
    background-image: url('../../images/landing/asnaf/New/rectangle 100.svg');
}

.first#Confectionery {
    background-image: url('../../images/landing/asnaf/New/Ghanadi.svg');
}

.first#CarSparePart {
    background-image: url('../../images/landing/asnaf/New/CarSparePart.svg');
}

.first#StreetSale {
    background-image: url('../../images/landing/asnaf/New/StreetSale.svg');
}

.first#dress {
    background-image: url('../../images/landing/asnaf/New/dress.svg');
}

.first#Petshop {
    background-image: url('../../images/landing/asnaf/New/Petshop.svg');
}

.first#bookshop {
    background-image: url('../../images/landing/asnaf/New/bookshop.svg');
}

.first#Cosmetics {
    background-image: url('../../images/landing/asnaf/New/Cosmetics.svg');
}

.first#jewelry {
    background-image: url('../../images/landing/asnaf/New/jewelry.svg');
}

.first#Carwash {
    background-image: url('../../images/landing/asnaf/New/Carwash.svg');
}

.first#mobile {
    background-image: url('../../images/landing/asnaf/New/mobile.svg');
}

.first#SuperMarket_HyperMarket {
    background-image: url('../../images/landing/asnaf/New/SuperMarket_HyperMarket.svg');
}

.first#HomeDevices {
    background-image: url('../../images/landing/asnaf/New/HomeDevices.svg');
}

.first#laundry {
    background-image: url('../../images/landing/asnaf/New/laundry.svg');
}

.first#photography {
    background-image: url('../../images/landing/asnaf/New/photography.svg');
}

.first#Hairdresser {
    background-image: url('../../images/landing/asnaf/New/Hairdresser.svg');
}

.first#computer {
    background-image: url('../../images/landing/asnaf/New/computer.svg');
}

.first#SaleLanding {
    background-image: url('../../images/landing/asnaf/New/SaleLanding.svg');
}

.first#CustomerClubLanding {
    background-image: url('../../images/landing/asnaf/New/CustomerClubLanding.svg');
}

.first#PaymentLanding {
    background-image: url('../../images/landing/asnaf/New/PaymentLanding.svg');
}

.first#AccountantLanding {
    background-image: url('../../images/landing/asnaf/New/AccountantLanding.svg');
}

.first#WarehousLanding {
    background-image: url('../../images/landing/asnaf/New/WarehousLanding.svg');
}

.first#BranchesLanding {
    background-image: url('../../images/landing/asnaf/New/BranchesLanding.svg');
}

.first#SaleWebsite {
    background-image: url('../../images/landing/asnaf/New/SaleWebsite.svg');
}

.first.BlueBanner {
    height: 245px;
    background-color: #628FFC;
    display: grid;
}

.BlueBannerOverlay {
    background: #628FFC;
    mix-blend-mode: color;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.TitleOnImage {
    /*display: flex;
    flex-direction: column;
    align-items: center;*/
    display: grid;
    text-align: center;
    padding: 60px 50px;
    gap: 16px;
    position: absolute;
    left: 50%;
    transform: translate(-50%);
    bottom: 0px;
    background: rgba(255, 255, 255, 0.3);
    backdrop-filter: blur(35px);
    white-space: nowrap;
}

    .TitleOnImage.TitleOnImage2 {
        padding: 60px;
    }

    .TitleOnImage * {
        color: #FFFFFF;
        font-weight: 700;
        text-shadow: 0px 1px 10px #000000;
    }

.TitleOnImage_1 {
    font: var(--Font_Header3);
}

.TitleOnImage_2 {
    font: var(--Font_BlackHeader);
}

.TitleOnImage_3 {
    font: var(--Font_Header1);
}

.TitleOnImage_4 {
    font: var(--Font_Larger);
}

.TitleOnImage_Icon {
    width: 68px;
    height: 68px;
    margin: 0 auto 16px;
}

.BlueBanner_TitleDiv {
    display: grid;
    justify-content: center;
    justify-items: center;
    justify-self: center;
    align-content: center;
    align-items: center;
    align-self: center;
}

    .BlueBanner_TitleDiv * {
        color: #FFFFFF;
        font-weight: 700;
    }

div.second {
    width: 100%;
    height: auto;
    padding: 70px 15px 0;
}

.BottomDivider2 + div.second {
    padding: 0 15px;
}

.myP {
    max-width: 780px;
    font: var(--Font_Body);
    line-height: 32px;
    text-align: justify;
    color: #2A323C;
    margin: auto;
}

.TopP {
    padding-bottom: 50px;
}

.BlueTxt {
    font: var(--Font_Larger);
    text-align: justify;
    color: #054BF5;
    text-align: center;
    margin: 0 auto 70px;
    max-width: 780px;
}

.gradiantBG_Row {
    position: relative;
    right: 0;
    width: calc(100% + 60px);
    margin-right: -30px;
}

.gradiantBGTop {
    margin-bottom: -2px;
    padding: 0;
}

.gradiantBGBottom {
    margin-top: -2px;
    padding: 0;
}

.gradiantBG {
    width: 100%;
    height: auto;
    background: linear-gradient(180deg, #668EED 0%, #5CC0F5 100%);
    padding: 35px 30px;
}

    .gradiantBG * {
        color: #FFFFFF;
    }

.gradiantBG_Title {
    font-weight: 700;
    font: var(--Font_Header2);
    text-align: center;
    padding-bottom: 25px;
}

.BoxesContainer {
    display: grid;
}

.Boxes {
    margin: 25px auto 15px;
    padding: 50px 100px;
    gap: 10px;
    max-width: 980px;
    background: #FFF;
    border-radius: 24px;
    display: grid;
    justify-content: right;
    justify-items: right;
    justify-self: right;
}

.BoxesContainer .Boxes {
    justify-items: center;
}

.Boxes:nth-of-type(2n) {
    background: #F7FAFF;
}

.Boxes img {
    width: 48px;
    height: 48px;
}

.BoxesTitle {
    padding: 8.5px 0 32px;
    font: var(--Font_Header3);
    text-align: right;
    color: #2A323C;
}

.HardwareItems img {
    width: 24px;
    height: 24px;
}

.Boxes .HardwareCol {
    max-width: initial;
    justify-content: space-between;
    width: 100%;
    padding: 0;
    margin: 0;
}

.Boxes .HardWareImage {
    width: 100%;
    height: auto;
    max-width: 360px;
    max-height: 262px;
}

.LightBlueBG {
    background: #F7FAFF;
    padding: 70px 0;
    gap: 48px;
}

    .LightBlueBG .second {
        padding: 0 0 50px;
    }

    .LightBlueBG .BlueTxt {
        text-align: right;
        margin-bottom: 50px;
        padding: 0 20px;
    }

ul.UlNewStyle {
    list-style: initial;
    margin: 0 auto;
    max-width: 780px;
    padding: 0 35px;
}

    ul.UlNewStyle li {
        list-style: initial;
        font: var(--Font_Large);
        font-weight: 400;
        line-height: 45px;
        text-align: right;
        color: #2A323C;
    }

    ul.UlNewStyle.UlNewStyle_SmallFont li {
        font: var(--Font_Body);
        line-height: 32px;
    }

.SoftWareRow {
    padding: 0 25px;
}

.SoftWareImage {
    height: 270px;
    width: 250px;
}

.FifthSectionTitle.SoftWareTitle {
    font: var(--Font_Header3);
    border-bottom: 4px solid #FF7A62;
    padding-bottom: 5px;
    width: fit-content;
    margin: 25px auto;
}

.HardwareItemsDiv.SoftWareItemsDiv {
    max-width: 300px;
    padding: 0 30px 0 15px;
}

.HardwareItemsDiv ul {
    gap: 16px;
    display: grid;
}

.HardwareItemsDiv ul, .HardwareItemsDiv li {
    list-style-image: url('../../images/landing/asnaf/new/vector (stroke).svg');
    font: var(--Font_Body);
    line-height: 32px;
}

.BottomDivider2 {
    margin: -2px auto 120px;
}

.TopDivider2 {
    margin: 120px auto -2px;
}

.TextImgContent {
    max-width: 780px;
    margin: auto;
    display: grid;
}

    .TextImgContent img {
        width: 100%;
        height: auto;
        border-radius: 10px;
    }

    .TextImgContent img,
    .TextImgContent .myP {
        margin: 0;
        margin-bottom: 50px;
    }

    .TextImgContent .TitleOnImage_3 {
        padding-bottom: 50px;
        font-weight: bold;
    }

.P_Title {
    font-weight: 700;
    font: var(--Font_Header2);
    text-align: right;
    margin: 50px 0 20px;
}

.TextImgContent .myP + .P_Title {
    margin-top: 0;
}

.P_Title + .FilterBtns_Container {
    margin-top: 25px;
}

.FilterBtns_Container {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 50px;
}

.FilterBtns {
    font: var(--Font_Small);
    font-weight: 700;
    line-height: 22px;
    padding: 10px;
    cursor: pointer;
    border-radius: 5px;
    border: none;
    background: #F7FAFF;
    color: #2A323C;
}

.ActiveFilterBtns {
    background: #628FFC;
    color: #FFFFFF;
}

ul.InnerLinks {
    list-style: url('../../images/landing/asnaf/new/rectangle 99.svg');
    margin: 0;
    max-width: 780px;
    padding: 0 20px;
}

    ul.InnerLinks li {
        list-style: url('../../images/landing/asnaf/new/rectangle 99.svg');
        font-weight: 400;
        font: var(--Font_Body);
        line-height: 28px;
        text-align: right;
        padding-right: 5px;
        margin-bottom: 16px;
    }

        ul.InnerLinks li a,
        ul.InnerLinks li:hover a,
        ul.InnerLinks li a:hover {
            color: #054BF5;
            text-decoration: underline !important;
        }

.BlogList_ContentDiv {
    max-width: 1160px;
    margin: auto;
}

@media screen and (min-width: 992px) {
}

@media screen and (max-width: 991px) {

    .Boxes .HardwareCol .HardwareItemsDiv {
        display: grid;
    }
}

@media screen and (min-width: 768px) and (max-width: 991px) {
}

@media screen and (min-width: 768px) {
}

@media screen and (max-width: 767px) {

    div.first {
        height: calc(30vh - 70px);
        min-width: 100%;
        min-height: 300px;
    }

    .TitleOnImage {
        display: grid;
        align-items: center;
        padding: 30px 20px;
        background: rgba(255, 255, 255, 0.3);
        backdrop-filter: blur(35px);
        justify-content: center;
        justify-items: center;
    }

        .TitleOnImage.TitleOnImage2 {
            font-size: 20px;
            padding: 15px 40px;
        }

    .first.BlueBanner {
        height: 170px;
        min-height: initial;
    }

    .TitleOnImage_1 {
        font: var(--xsFont_Header3);
    }

    .TitleOnImage_2, .TitleOnImage_3 {
        font: var(--xsFont_BlackHeader_Header1);
        line-height: initial;
    }


    .TitleOnImage_4 {
        font-size: 15px;
        line-height: initial;
    }

    .TitleOnImage_Icon {
        width: 48px;
        height: 48px;
        margin: 0 auto;
    }

    .myP {
        font-size: 13px;
    }

    .BlueTxt {
        font-size: 17px;
        line-height: initial;
    }

    .gradiantBG_Title {
        font: var(--xsFont_Header2);
    }

    .Boxes {
        padding: 25px 25px;
        gap: 0;
    }

        .Boxes img {
            width: 36px;
            height: 36px;
        }

    .BoxesTitle {
        padding: 8.5px 0;
        font: var(--xsFont_Header3);
    }

    .Boxes .HardWareImage {
        margin-bottom: 50px;
    }

    .LightBlueBG {
        padding: 70px 40px;
    }

        .LightBlueBG .BlueTxt {
            margin-bottom: 20px;
        }

    ul.UlNewStyle li {
        font-size: 12px;
        line-height: 30px;
    }

    .SoftWareRow {
        margin-top: -50px;
    }

    .P_Title {
        font: var(--xsFont_Header2_2);
        margin: 50px 0 7px;
    }

    .FilterBtns {
        font-size: 10px;
        line-height: 15px;
    }
}

.BlogPageFontFamily, .BlogPageFontFamily * {
    font-family: 'Vazirmatn' !important;
}





/*#endregion NewDesign*/
