@charset "utf-8";

@font-face {
	font-family: 'shabnam';
	src: url('../fonts/shabnam/Shabnam-Bold.eot') format('eot'),  /* IE6–8 */
url('../fonts/shabnam/Shabnam-Bold.woff2') format('woff2'),  /* Chrome36+, Opera24+*/
url('../fonts/shabnam/Shabnam-Bold.woff') format('woff');  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
	font-weight: bold;
}

@font-face {
	font-family: 'shabnam';
	src: url('../fonts/shabnam/Shabnam.eot') format('eot'),  /* IE6–8 */
url('../fonts/shabnam/Shabnam.woff2') format('woff2'),  /* Chrome36+, Opera24+*/
url('../fonts/shabnam/Shabnam.woff') format('woff');  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
	font-weight: 500;
}


@font-face {
	font-family: 'shabnam';
	src: url('../fonts/shabnam/Shabnam-Light.eot#') format('eot'),  /* IE6–8 */
url('../fonts/shabnam/Shabnam-Light.woff2') format('woff2'),  /* Chrome36+, Opera24+*/
url('../fonts/shabnam/Shabnam-Light.woff') format('woff');  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
	font-weight: 300;
}
h1, h2, h3, h4, h5, a{
    font-family: 'shabnam' !important;
}

@font-face {
  font-family: 'icomoon';
  src:  url('../fonts/icomoonfd/icomoonfd1d.eot?6shkfr');
  src:  url('../fonts/icomoonfd/icomoonfd1d.eot?6shkfr#iefix') format('embedded-opentype'),
    url('../fonts/icomoonfd/icomoonfd1d.ttf?6shkfr') format('truetype'),
    url('../fonts/icomoonfd/icomoonfd1d.woff?6shkfr') format('woff'),
    url('../fonts/icomoonfd/icomoonfd1d.svg?6shkfr#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
}

[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-checked:before {
  content: "\e901";
}
.icon-instagram:before {
  content: "\e902";
}
.icon-linkedin:before {
  content: "\e903";
}
.icon-telegram:before {
  content: "\e904";
}
.icon-twitter:before {
  content: "\e905";
}
.icon-arrow-bold:before {
  content: "\e906";
}



body {
    position: relative;
    font-family: 'shabnam';
    font-size: 14px;
    color: #888888;
    margin: 0;
    word-spacing: -1px;
}
p {
    margin: 0;
}
ul{
    list-style: none;
    padding: 0px;
    margin: 0px;
}
h1, h2, h3, h4, h5, h6 {
    font-family: 'shabnam';
    margin: 0px;
    line-height: unset;
}

h1 {
    font-size: 35px;
}

h1 {
    font-size: 35px;
    font-weight: bold;
}
a{
    text-decoration: none !important;
    color: #fff;
    transition: all 0.3s ease;
}
a:hover{
    transition: all 0.3s ease;
}
img {
    max-width: 100%;
    display:  block;
    margin:  auto;
}
*,
*:hover,
*:active{
    font-family: 'shabnam';
    outline: 0px !important;
}
.owl-carousel{
    position: relative;
}
.owl-carousel .owl-nav{
    position: absolute;
    left: 0;
    right: 0;
    top: calc(50% - 10px);
}
.owl-carousel .owl-nav .owl-prev{
    position: absolute;
    right: -7px;
}
.owl-carousel .owl-nav .owl-next{
    position: absolute;
    left: -7px;
}
.owl-carousel .owl-nav .owl-prev i,
.owl-carousel .owl-nav .owl-next i{
    display: block;
    color: #fff;
    font-size: 18px;
}
.owl-carousel .owl-nav .owl-next i{
    transform: rotate(180deg);
}
.p_main_title{
    font-size: 21px;
    color: #202020;
    text-align: center;
    font-weight: bold;
    margin-bottom: 30px;
    line-height: 38px;
    word-spacing: -2px;
}   
.fa_font{
    font-family: 'shabnam';
}
.pattern_bg{
    background-image: url('../images/pattern.png');
    background-repeat:  repeat;
    background-position:  right top;
}

/* header */
    header{
        position: absolute;
        top: 0;
        right: 0;
        left: 0;
        padding: 15px 0;
        z-index: 1000;
    }
    header .container{
        position: relative;
    }
    header .logo{
        float: right;
    }
    .main_menu{
        float: left;
    }
    .main_menu li{
        display: inline-block;
        vertical-align: middle;
    }
    .main_menu li a{
        display: block;
        font-size: 12px;
        color: #fff;
        padding: 14px 15px;
    }
    .main_menu li a:hover{
        text-shadow: 0px 0px 3px;
    }
    .hamburger{
        display: none;
        float: left;
        padding: 12px 0;
        height: 22px;
        cursor: pointer;
    }
    .hamburger-inner, .hamburger-inner:after, .hamburger-inner:before{
        background: #fff;
    }

/* top banner */
    .top_banner{
        position: relative;
        width: 100%;
        padding: 90px 0 90px;
    }
    .top_banner .static_banner{
        display: none;
        max-width: 94%;
    }


    .top_banner .text_box{
        width: 823px;
        max-width: 100%;
        margin: 0 auto;
    }
    .top_banner .text_box .desc{
        text-align: justify;
        font-size: 16px;
        color: #fff;
        line-height: 33px;
        margin-bottom: 25px;
        margin-top: 50px;
    }
    .top_banner .text_box .link_holder{
        position: relative;
        width: 310px;
        max-width: 100%;
        padding: 6px;
        margin: auto;
        text-align: center;
        border-radius: 33px;
        overflow: hidden;
    }
    .top_banner .text_box .link_holder a{
        position: relative;
        display: block;
        padding: 12px 0px;
        border-radius: 30px;
        z-index: 10;
        overflow: hidden;
    }
    .top_banner .text_box .link_holder a h3{
        position: relative;
        display: inline-block;
        vertical-align: middle;
        color:#103a30;
        font-size: 18px;
        font-weight: bold;
        text-shadow: 0px 0px 0px;
        z-index: 100;
    }
    .top_banner .text_box .link_holder a i{
        position: relative;
        display: inline-block;
        vertical-align: middle;
        font-weight: bold;
        text-shadow: 0px 0px 0px;
        font-size: 13px;
        margin-left: -5px;
        margin-right: 5px;
        z-index: 100;
        transform: rotate(180deg);
    }

/* Steps */
    .steps{
        padding: 90px 0;
    }
    .steps .secDesc{
        font-size: 15px;
        color: #202020;
        text-align: center;
    }
    .steps .item_holder{
        background: url('../images/steps_numbers.png') no-repeat top center;
        margin-top: 40px;
        padding: 44px 0;
    }
    .steps .item_holder .item_box{
        width: 100%;
        text-align: right;
        margin: -10px 0;
    }
    .steps .item_holder .item_box:nth-child(odd){
        text-align: left;
    }
    .steps .item_holder .item_box .item{
        display: inline-flex;
        align-items: center;
        position: relative;
        width: 46%;
        max-width: 100%;
        min-height: 172px;
        padding: 0px 35px;
        background: #fff;
        border-radius: 20px;
        text-align: justify;
    }
    .steps .item_holder .item_box .item:before{
        content: '';
        position: absolute;
        top: calc(50% - 24px);
        right: calc(100% - 24px);
        width: 47px;
        height: 47px;
        background: #fff;
        border-radius: 0px 0px 0px 6px;
        transform: rotate(45deg);
        z-index: -1;
    }
    .steps .item_holder .item_box:nth-child(odd) .item:before{
        right: auto;
        left: calc(100% - 24px);
        border-radius: 0px 6px 0px 0px;
    }
    .steps .item_holder .item_box .item .title{
        font-size: 19px;
        color: #202020;
        font-weight: bold;
        margin-bottom: 7px;
    }
    .steps .item_holder .item_box .item .desc{
        font-size: 16px;
        color: #202020;
        text-align: justify;
        line-height: 27px;
    }

/* Use Card */
    .use_card{
        padding: 90px 0;
        text-align: center;
    }
    .use_card .img_box{
        display: inline-block;
        vertical-align: middle;
        width: 37%;
        padding: 0 25px;
        text-align: left;
    }
    .use_card .img_box img{
        display: inline-block;
    }
    .use_card .text_holder{
        display: inline-block;
        vertical-align: middle;
        width: 50%;
        padding: 0 21px;
        text-align: justify;
    }
    .use_card .text_box .p_main_title{
        text-align: right;
    }
    .use_card .text_box .desc{
        font-size: 15px;
        text-align: justify;
        color: #202020;
        line-height: 30px;
        margin: 11px 0;
    }
    .use_card .text_box .desc.list{
        padding-right: 30px;
    }
    .use_card .blue_box{
        display: inline-block;
        font-size: 17px;
        background: #2874f0;
        color: #fff;
        border-radius: 25px;
        padding: 14px 36px;
        margin-top: 25px;
        line-height: 30px;
    }

/* Stores */
    .stores{
        padding: 90px 0px;
    }
    .stores .p_main_title{
        margin-bottom: 30px;
    }
    .stores .items_holder{
        text-align: center;
        margin-bottom: 45px;
    }
    .stores .item{
        display: inline-block;
        vertical-align: middle;
        max-width: calc(100% - 25px);
        margin: 4px auto 10px;
    }
    .stores .item .img_box{
        display: block;
        width: 100%;
        border-radius: 8px;
        overflow: hidden;
    }
    .stores .item .img_box img{
        width: auto;
    }
    .stores .item .title{
        margin: 0; 
    }
    .stores .item .title a{
        font-size: 15px;
        color: #202020;
        white-space: nowrap;
    }
    .stores .link_holder{
        position: relative;
        width: 310px;
        max-width: 100%;
        padding: 6px;
        margin: auto;
        text-align: center;
        border-radius: 33px;
        overflow: hidden;
    }
    .stores .link_holder a{
        position: relative;
        display: block;
        padding: 12px 0px;
        border-radius: 30px;
        z-index: 10;
        overflow: hidden;
    }
    .stores .link_holder a h3{
        position: relative;
        display: inline-block;
        vertical-align: middle;
        font-size: 18px;
        font-weight: bold;
        color: #ffffff;
        z-index: 100;
    }
    .stores .link_holder a i{
        position: relative;
        display: inline-block;
        vertical-align: middle;
        font-weight: bold;
        font-size: 13px;
        color: #ffffff;
        margin-left: -5px;
        margin-right: 5px;
        z-index: 100;
        transform: rotate(180deg);
    }

/* Documents */
    .documents{
        padding: 90px 0;
    }
    .documents .item{
        display: inline-block;
        vertical-align: top;
        width: calc(100% - 30px);
        max-width: 100%;
        padding: 35px 30px;
        margin: 0px 15px;
        background: #fff;
        border-radius: 12px;
    }
    .documents .item .head_box{
        margin-bottom: 25px;
        text-align: center;
    }
    .documents .item .head_box img{
        display: inline-block;
        vertical-align: middle;
        width: auto;
    }
    .documents .item .head_box .txt{
        display: inline-block;
        vertical-align: middle;
        text-align: right;
        margin-right: 7px;
    }
    .documents .item .head_box .txt .title{
        font-size: 22px;
        font-weight: bold;
        color: #322f80;
    }
    .documents .item .head_box .txt .sub_title{
        font-size: 12px;
        color: #9b99c5;
     line-height: 25px;
    }
    .documents .item .head_box .txt .sub_title span{
        color: #f72e59;
    }
    .documents .item .middle_box {
        display: flex;
        align-items: center;
        text-align: center;
        min-height: 185px;
    }
    .documents .item .middle_box .holder{
        width: 100%;
    }
    .documents .item .middle_box .holder img{
      width: auto
    }
    .documents .item .middle_box .box{
        display: inline-block;
        vertical-align: top;
        width: 121px;
        margin: 0px 0px 15px;
    }
    .documents .item .middle_box .box img{
        margin-bottom: 7px;
    }
    .documents .item .middle_box .box .txt{
        font-size: 13px;
    }
    .documents .item .middle_box .box .txt span{
        font-size: 11px;
    }
    .documents .item .middle_box .box.rectangle{
        width: 49%;
    }
    .documents .item .footer_box{

    }
    .documents .item .footer_box img{
        margin-bottom: 10px;
        width: auto;
    }
    .documents .item .footer_box .txt{
        color: #9b99c5;
        line-height: 25px;
        min-height: 100px;
        text-align: justify;
    }
    .documents .item .footer_box .txt b{
        color: #353887;
    }

/* Faq */
    .faq{
        padding: 90px 0;
    }
    .faq .item_holder .item{
        position: relative;
        text-align: right;
        background: #fff;
        padding: 27px 27px;
        border-radius: 10px;
        box-shadow: 0px 0px 17px -7px #a2a2a2;
        cursor: pointer;
        margin-bottom: 25px;
    }
    .faq .item_holder .item .counter{
        display: inline-block;
        vertical-align: middle;
        width: 38px;
        height: 38px;
        text-align: center;
        color: #202020;
        font-size: 24px;
       padding: 10px 0px 15px 0px;
        background: #fff;
        border-radius: 50%;
        border: solid 1px #202020;
        margin-left: 8px;
        text-shadow: 0px 0px 0px;
        line-height: 20px;
    }
    .faq .item_holder .item .title{
        display: inline-block;
        vertical-align: middle;
        width: calc(100% - 82px);
        color: #202020;
        font-size: 14px;
        text-shadow: 0px 0px 0px;
    }
    .faq .item_holder .item i{
        float: left;
        font-size: 20px;
        font-weight: bold;
        margin: 9px 0;
        transform: rotate(90deg);
        transition: all 0.3s ease;
    }
    .faq .item_holder .item.active i{
        transform: rotate(270deg);
    }
    .faq .item_holder .item .answer_box{
        display: none;
        position: absolute;
        top: calc(100% - 11px);
        right: 0;
        left: 0;
        min-height: 128px;
        padding: 10px 75px 20px 23px;
        background: #fff;
        box-shadow: 0px 4px 17px -7px #a2a2a2;
        border-radius: 0px 0px 10px 10px;
        z-index: 100;
    }
    .faq .item_holder .item .answer_box p{
        font-size: 15px;
        line-height: 33px;
    }
    .faq .link_holder{
        position: relative;
        width: 310px;
        max-width: 100%;
        padding: 6px;
        margin: 30px auto 0;
        text-align: center;
        border-radius: 33px;
        overflow: hidden;
    }
    .faq .link_holder a{
        position: relative;
        display: block;
        padding: 12px 0px;
        border-radius: 30px;
        z-index: 10;
        overflow: hidden;
    }
    .faq .link_holder a h3{
        position: relative;
        color: #103a30;
        display: inline-block;
        vertical-align: middle;
        font-size: 18px;
        font-weight: bold;
        text-shadow: 0px 0px 0px;
        z-index: 100;
    }
    .faq .link_holder a i{
        position: relative;
        display: inline-block;
        vertical-align: middle;
        font-weight: bold;
        text-shadow: 0px 0px 0px;
        font-size: 13px;
        margin-left: -5px;
        margin-right: 5px;
        z-index: 100;
        transform: rotate(180deg);
    }

/* Footer */
    footer{
        padding: 30px 0px;
    }
    footer .menu{
        float: right;
        margin-top: 10px;
    }
    footer .menu li{
        display: inline-block;
        vertical-align: middle;
        margin-left: 65px;
    }
    footer .menu li:last-child{
        margin-left: 0;
    }
    footer .menu li a{
        display: block;
        font-size: 13px;
        color: #fff;
    }
    footer .menu li a:hover{
        text-shadow: 0px 0px 3px #103a30;
    }
    footer .social_networks{
       float: left;
       margin-top: 7px;
    }
    footer .social_networks a{
        display: inline-block;
        vertical-align: middle;
        margin: 0 9px;
    }
    footer .social_networks a i{
        font-size: 21px;
        color: #fff;
        vertical-align: middle;
        transition: all 0.3s ease;
    }
    footer .social_networks a:hover i{
        text-shadow: 0px 0px 3px #103a30;
    }
    footer .contact{
        float: left;
        color: #fff;
        padding: 5px 15px 8px 0;
        margin: 2px 5px 0 0;
        border-right: solid 1px #fff;
    }

/* Sub Footer */
    .sub_footer{
        padding: 40px 0px;
        text-align: center;
        background: #fff;
    }
    .sub_footer .namad{
        display: inline-block;
        vertical-align: middle;
        padding: 0px 30px;
        width: 525px;
    }
    .sub_footer .namad a{
        display: inline-block;
        vertical-align: baseline;
        margin: 0px 8px;
    }
    .sub_footer .namad a img{
        
    }
    .sub_footer .txt_box{
        display: inline-block;
        vertical-align: middle;
        width: calc(100% - 629px);
        padding: 0px 30px;
        font-size: 14px;
        color: #8a8a8a;
        text-align: justify;
        line-height: 30px;
    }



    body.pars_rtl{
        background: rgba(36,155,125,1);
        background: -moz-linear-gradient(top, rgba(36,155,125,1) 0%, rgba(150,208,194,1) 54%, rgba(238,247,245,1) 100%);
        background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(36,155,125,1)), color-stop(54%, rgba(150,208,194,1)), color-stop(100%, rgba(238,247,245,1)));
        background: -webkit-linear-gradient(top, rgba(36,155,125,1) 0%, rgba(150,208,194,1) 54%, rgba(238,247,245,1) 100%);
        background: -o-linear-gradient(top, rgba(36,155,125,1) 0%, rgba(150,208,194,1) 54%, rgba(238,247,245,1) 100%);
        background: -ms-linear-gradient(top, rgba(36,155,125,1) 0%, rgba(150,208,194,1) 54%, rgba(238,247,245,1) 100%);
        background: linear-gradient(to bottom, rgba(36,155,125,1) 0%, rgba(150,208,194,1) 54%, rgba(238,247,245,1) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#249b7d', endColorstr='#eef7f5', GradientType=0 );
    }
    body.pars_rtl .main_menu li a:hover {
        text-shadow: 0px 0px 3px #103a30;
    }
    body.pars_rtl .top_banner .text_box .link_holder,
    body.pars_rtl .faq .link_holder{
        background: rgba(66, 223, 185, 0.27058823529411763);
    }
    body.pars_rtl .top_banner .text_box .link_holder a,
    body.pars_rtl .faq .link_holder a{
        background: #42dfb9;
    }
    body.pars_rtl .top_banner .text_box .link_holder a:hover,
    body.pars_rtl .faq .link_holder a:hover{
        background: #24d8ac;
    }
    body.pars_rtl .top_banner .text_box .link_holder a span,
    body.pars_rtl .top_banner .text_box .link_holder a i,
    body.pars_rtl .faq .link_holder a span,
    body.pars_rtl .faq .link_holder a i{
        color: #fff;
    }
    body.pars_rtl .stores .link_holder{
        background: #7dc4b3;
    }
    body.pars_rtl .stores .link_holder a{
        background: #239a7d;
    }
    body.pars_rtl .stores .link_holder a:hover{
        background: #199073;
    }
    body.pars_rtl .faq .item_holder .item i{
        color: #269c7f;
    }
    body.pars_rtl .faq .item_holder .item .answer_box p{
        color: #269c7f;
    }
    body.pars_rtl footer{
        background: #239a7d;
    }
    

    /* Animate Banner*/
        body.pars_rtl .top_banner .animate_banner{
            text-align: center;
            overflow: hidden;
            width: 100%;
        }
        body.pars_rtl .top_banner .animate_banner .core{
            position: relative;
            display: inline-block;
        }
        body.pars_rtl .top_banner .animate_banner .core [id^="layer"]{
            position: absolute;
        }
        body.pars_rtl .top_banner .animate_banner .core #layer_1{
            position: relative;
        }
      
        body.pars_rtl .top_banner .animate_banner .core #layer_3{
            top: 96px;
            left: calc(100% - 43px);
            z-index: -1;
        }
        body.pars_rtl .top_banner .animate_banner .core #layer_4{
            bottom: 170px;
            right: calc(100% - 60px);
            z-index: -1;
        }
        body.pars_rtl .top_banner .animate_banner .core #layer_5{
            width: 333px;
            top: calc(50% - 10px);
            left: calc(100% + 50px);
        }
        body.pars_rtl .top_banner .animate_banner .core #layer_5 h1{
            font-size: 30px;
            color: #e1db54;
            word-spacing: -5px;
            margin-bottom: 10px;
        }
        body.pars_rtl .top_banner .animate_banner .core #layer_6{
            top: calc(15% - 10px);
            right: 100%;
        }
    

/* Red Theme */
    body.red_theme{
        background: rgba(206,19,19,1);
        background: -moz-linear-gradient(top, rgba(206,19,19,1) 0%, rgba(255,255,255,1) 100%);
        background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(206,19,19,1)), color-stop(100%, rgba(255,255,255,1)));
        background: -webkit-linear-gradient(top, rgba(206,19,19,1) 0%, rgba(255,255,255,1) 100%);
        background: -o-linear-gradient(top, rgba(206,19,19,1) 0%, rgba(255,255,255,1) 100%);
        background: -ms-linear-gradient(top, rgba(206,19,19,1) 0%, rgba(255,255,255,1) 100%);
        background: linear-gradient(to bottom, rgba(206,19,19,1) 0%, rgba(255,255,255,1) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ce1313', endColorstr='#ffffff', GradientType=0 );
    }
    body.red_theme .main_menu li a:hover {
        text-shadow: 0px 0px 3px #ffdede;
    }
    body.red_theme .top_banner .text_box .link_holder,
    body.red_theme .faq .link_holder{
        background: rgba(158, 0, 0, 0.34);
    }
    body.red_theme .top_banner .text_box .link_holder a,
    body.red_theme .faq .link_holder a{
        background: #ab0000;
    }
    body.red_theme .top_banner .text_box .link_holder a:hover,
    body.red_theme .faq .link_holder a:hover{
        background: #ff0000;
    }
    body.red_theme .top_banner .text_box .link_holder a span,
    body.red_theme .top_banner .text_box .link_holder a i,
    body.red_theme .faq .link_holder a span,
    body.red_theme .faq .link_holder a i{
        color: #f7f7f7;
    }
    body.red_theme .stores .link_holder{
        background: #cf181840;
    }
    body.red_theme .stores .link_holder a{
        background: #cf1818;
    }
    body.red_theme .stores .link_holder a:hover{
        background: #ff0808;
    }
    body.red_theme .faq .item_holder .item i{
        color: #F44336;
    }
    body.red_theme .faq .item_holder .item .answer_box p{
        color: #F44336;
    }
    body.red_theme footer{
        background: #cf1616;
    }


.icon-arrow-bold{
    color: #fff; 
}

