/* @font-face {
    font-family: 'IranSans Bold';
    src: url('/fonts/IRANSans-Bold.woff2')}

@font-face {
    font-family: 'IranSansWeb Black';
    src: url('/fonts/IRANSansWeb_Black.woff2');
}
@font-face {
    font-family: 'IranSansWeb Bold';
    src: url('/fonts/IRANSansWeb_Bold.woff');
}
@font-face {
    font-family: 'IranSansWeb UltraLight';
    src: url('/fonts/IRANSansWeb_Bold.woff');
}
@font-face {
    font-family: 'IranSansWeb Web';
    src: url('/fonts/IRANSansWeb.woff2');
} */
@font-face {
    font-family: 'IranSans Expanded';
    src: url('/fonts/IRANSANSExpanded.woff2')}
@font-face {
    font-family: 'IranSans Black';
    src: url('/fonts/IRANSansWeb(FaNum)_Black.woff2');
}
@font-face {
    font-family: 'IranSans Bold';
    src: url('/fonts/IRANSansWeb(FaNum)_Bold.woff2');
}
@font-face {
    font-family: 'IranSans Light';
    src: url('/fonts/IRANSansWeb(FaNum)_Light.woff2');
}
@font-face {
    font-family: 'IranSans Medium';
    src: url('/fonts/IRANSansWeb(FaNum)_Medium.woff2');
}
@font-face {
    font-family: 'IranSans UltraLight';
    src: url('/fonts/IRANSansWeb(FaNum)_UltraLight.woff2');
}
@font-face {
    font-family: 'IranSans';
    src: url('/fonts/IRANSansWeb(FaNum).woff2');
}
body{
    direction: rtl;
    width: 100%;
    height: 100%;
    overflow-x: hidden}
.site-container{
    width: 100%;
    height: 100%;
    /* overflow-x: hidden; */
    /* border: 1px solid #000; */
}
*{
    margin: 0;
    padding: 0;
    scroll-behavior: smooth;
    box-sizing: border-box;
    font-family: 'IranSans'}
.row::after{
    content: "";
    clear: both;
    display: table}
.col-l-1{width: 8.33%}
.col-l-2{width: 16.66%}
.col-l-3{width: 25%}
.col-l-4{width: 33.33%}
.col-l-5{width: 41.66%}
.col-l-6{width: 50%}
.col-l-7{width: 58.33%}
.col-l-8{width: 66.66%}
.col-l-9{width: 75%}
.col-l-10{width: 83.33%}
.col-l-11{width: 91.66%}
.col-l-12{width: 100%}

[class*="col-"]{
    float: right}
.navbar-frontend{
    position: relative;
    top: 0;
    left: 0;
    right: 0;
    height: 100px;
    width: 100%;
    padding: 25px;
    /* overflow: hidden; */

    /* background: linear-gradient(to right, #017dcd, #004092); */
    z-index: 10000}
#nav{
    position: relative;
    width: 80%;
    height: 100%;
    margin: 0 auto}
.navbar{
    position: relative;
    width: auto;
    height: 100%;
    line-height: 60px;
    padding-top: 10px;
    padding-bottom: 10px}
.c-logo{
    position: relative;
    /* border: 1px solid #000; */
    float: right;
    width: 180px;
    height: 100%;
    margin-left: 20px;
    margin-top: 5px}
#logo-link{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1000}
.img-logo{
    width: 100%;
    height: auto}
.nav-item{
    position: relative;
    width: 90px;
    height: 100%;
    line-height: 30px;
    float: right;
    border-radius: 25px;
    text-align: center;
    font-size: 13.5px;
    list-style-type: none;
    margin-left: 5px;
    border-radius: 50px;
    opacity: .5;
    cursor: pointer;
    
    
    /* box-sizing: content-box; */
}
.bar-item{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 50px;
    z-index: 1;
    opacity: .3;
    transition: ease-out .3s}
.nav-item:hover{
    opacity: 1}
.tglsubmenu .nav-item:active{
    opacity: 1}
.nav-item:hover .bar-item{
    background-color: rgba(var(--fk-navy-rgb),0.06)}
.nav-link{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    text-decoration: none;
    color: var(--fk-navy);
    font-family: 'IranSans Bold';
    opacity: 1;
    z-index: 2;
    transition: 0s}
.user-detail{
    position: absolute;
    top: 0;
    left: 0;
    width: 150px;
    height: 100%;
    float: left}
.c-auth-items{
    width: 100%;
    height: 100%;
    /* border: 1px solid #000; */
}
.auth-item{    
    position: relative;
    top: 8px;
    bottom: 0;
    width: 130px;
    height: 35px;
    border: 2px solid var(--fk-line-solid);
    color: var(--fk-navy);
    float: left;
    margin-top: auto 0;
    text-align: center;
    font-size: 13.5px;
    line-height: 30px;
    transition:ease-out .2s}
.auth-item a{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    text-decoration: none;
    color: var(--fk-navy)}
.auth-item:hover{
    background-color: var(--fk-cream-soft)}
.auth-item:hover a{
    color: var(--fk-muted)}
.c-search-form{}
.c-user-name{
    position: relative;
    top: 8px;
    width: auto;
    height: auto;
    float: left;
    font-size: 13.5px;
    /* border: 1px solid #000; */
    text-align: left;
    line-height: 33px;
    cursor: pointer}
.c-user-name span{
    
    color: var(--fk-navy)}
.c-user-name span:hover{
    color: var(--fk-muted)}
.c-username-options{
    position: absolute;
    left: 0;
    top: 40px;
    width: 100px;
    height: 0px;
    padding: 5px;
    background-color: var(--fk-white);
    box-shadow: 1px 1px 5px rgba(var(--fk-navy-rgb),0.16);
    text-align: center;
    transition:all .3s;
    border-radius: 3px;
    overflow: hidden;
    opacity: 0;
    visibility: hidden;
    z-index: 10000}
.username-option{
    position: relative;
    list-style-type: none;
    width: 100%;
    height: 30px;
    border-radius: 3px;
    line-height: 28px}
.username-option a{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    text-decoration: none;
    font-size: 12px;
    color: var(--fk-navy)}
.username-option:hover{
    background-color: var(--fk-cream-soft);
    color: var(--fk-navy)}
.username-option:hover a{
    color: var(--fk-navy)}

#caret-down-icon{
    position: relative;
    top: 1px;
    left: 0}
.tgl-username-options .c-username-options{
    height: 70px;
    visibility: visible;
    opacity: 1;
    height: auto}
.tgl-username-options .c-user-name span{
    color: var(--fk-muted)}
.search-form{
    position: absolute;
    top: 10px;
    left: 170px;
    width: 200px;
    height: 30px;
    border-radius: 50px;
    /* border: 1px solid #000; */
    float: left;
    overflow: hidden;
    width: auto}
.inp-search{
    position: relative;
    width: 30px;
    height: 100%;
    border: none;
    border-radius: 50px;
    padding-right: 10px;
    float: left;
    background: none;
    transition: .3s;
    z-index: 3;
    font-size: 12px;
    color: var(--fk-navy);
    font-weight: bold;
    opacity: 0}
.btn-search{
    position: absolute;
    left: 0;
    top: 0;
    background-color: var(--fk-teal);
    /* background-color: rgb(51, 153, 201); */
    width: 30px;
    height: 30px;
    border-radius: 50%;
    /* float: left; */
    border: none;
    z-index: 2}
#i-search{
    position: absolute;
    left: 7.5px;
    top: 6.5px;
    color: var(--fk-navy);
    font-size: 16px}
.inp-search:focus{
    opacity: 1;
    width: 200px;
    z-index: 1;
    background-color: var(--fk-teal-dark)}
.inp-search::-webkit-input-placeholder{
    color: var(--fk-muted)}

/* Register & Login Form */
.c-form{
    position: relative;
    width: 100%;
    height: auto;
    padding-top: 100px;
    padding-bottom: 150px;
    overflow: hidden;
    background:var(--fk-teal)}


.form-box{
    position: relative;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 350px;
    height: auto;
    /* border: 1px solid #eee; */
    border-radius: 25px;
    background-color: var(--fk-white);
    box-shadow: 0px 20px 30px rgba(var(--fk-navy-rgb),0.16);
    overflow: hidden;
    z-index: 20}
.form-header{
    position: relative;
    width: 100%;
    height: 50px;
    /* border-bottom: 1px solid #eee; */
    background-color: #595959;
    /* background: linear-gradient(to right, #fff, #000); */
    border-top-right-radius: 0px;
    border-top-left-radius: 0px;
    margin-bottom: 10px}
.c-form-logo{
    position: relative;
    left: 0;
    right: 0;
    top: 7px;
    margin: 0 auto;
    width: 130px;
    height: 40px}
.c-form-logo img{
    width: 100%;
    height: auto}
.c-inp{
    position: relative;
    width: 100%;
    height: 43px;
    margin-bottom: 10px;
    border-radius: 5px;
    background-color: var(--fk-cream-soft);
    
    /* border: 1px solid #000; */
}
.inp-name{
    position: absolute;
    right: 10px;
    top: 11px;
    font-size: 13px;
    color: var(--fk-muted);
    z-index: 2;
    font-family: 'IranSans Light';
    transition: ease .2s}

.inp-form{
    position: relative;
    width: 100%;
    height: 43px;
    border-radius: 5px;
    padding-right: 10px;
    padding-top: 10px;
    
    color: var(--fk-navy);
    /* margin-bottom: 10px; */
    border: none;
    /* border: 1px solid #eee; */
    font-size: 13px;
    /* background-color: rgb(245, 245, 245); */
    transition: ease-out .2s;
    background: none;
    /* border: 1px solid #eee; */
    z-index: 3;
    outline: none}
.tgl-inp-name .inp-name{
    font-size: 9px;
    top: 4px;
    z-index: 10000}
.inp-form:focus ~ .inp-name{
    font-size: 9px;
    top: 4px;
    /* border-color: #0287D6; */
    /* box-shadow: 0px 0px 5px #0287D6; */
}
.c-left-bg-img{
    position: absolute;
    left: 0px;
    right: 0px;
    margin: 0 auto;
    top: 20px;
    width: 800px;
    height: auto;
    z-index: 1;
    opacity: 1}

.c-left-bg-img img{
    width: 100%;
    height: auto}
.c-right-bg-img{
    position: absolute;
    right: -40px;
    bottom: 10px;
    width: 500px;
    height: auto;
    opacity: .7;
    z-index: 1}
.c-right-bg-img img{
    width: 100%;
    height: auto}
#c-submit-btn{
    width:140px;
    height:auto;
    margin:0 auto;
    /* border: 1px solid #000; */
    margin-bottom: 10px;
    margin-top: 10px;
    outline: none}
.btn-submit{
    position: relative;
    left: 0;
    right: 0;
    width: 140px;
    float: none;
    height: 40px;
   
    border: none;
    background: none;
    border-radius: 50px;
    color: var(--fk-navy);
    text-align: center;
    line-height: 35px;
    overflow: hidden;
    font-size: 13.5px;
    
    margin: 0px auto;
    cursor: unset;
    outline: none}
.btn-bar{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: var(--fk-cream-soft);
    opacity: .5}
#submit-arrow-icon{
    position: absolute;
    left: 35px;
    top: 11px;
    color: var(--fk-navy);
    font-size: 20px;
    transition: .2s}
.btn-submit:hover #submit-arrow-icon{
    left: 30px}
#btn-text{
    position: relative;
    margin-left: 25px;
    z-index: 1000}
.tgl-btn-color .btn-submit{
    color: var(--fk-navy);
    cursor: pointer}
.tgl-btn-color .btn-bar{
    opacity: 1;
    background-color: var(--fk-white)}
.tgl-btn-color #submit-arrow-icon{
    color: var(--fk-navy)}
.tgl-btn-color #btn-text{
    color: var(--fk-navy)}
/* End Register & Login Form */
#error{
    font-family: 'IranSans Bold';
    position: relative;
    top: -5px;
    right: 10px;
    color: var(--fk-err);
    font-size: 8px}
#success{
    font-family: 'IranSans Bold';
    position: relative;
    top: -5px;
    right: 10px;
    color: var(--fk-teal-ink);
    font-size: 9px}
#remember-text{
    font-size: 11px;
    color: var(--fk-navy);
    margin-right: 10px}

.c-form-link{
    position: relative;
    top: -5px;
    
    /* border: 1px solid #000; */
    margin: 0 auto;
    width: 150px;
    text-align: center;
    margin-bottom: 10px}
.form-link{
    font-size: 11px}
.c-404{
    position: relative;
    width: 100%;
    height: 600px;
    background:var(--fk-teal);
    text-align: center;
    padding-top: 150px;
    overflow: hidden}
.c-404 h1{
    font-size: 100px;
    color: var(--fk-navy)}
.c-404 .not-found-404{
    font-size: 18px;
    color: var(--fk-navy)}
/* Index Header */

.bg-header-box{
    position: relative;
    left: 0;
    right: 0;
    top: -10px;
    height: 300px;
    width: 100%;
    /* border: 1px solid #000; */
    z-index: 1;
    /* width: 100%;
    height: 100%; */
    /* background-image: url('/images/header-bg.svg');
    background-position: bottom;
    background-size: cover;
    background-repeat: no-repeat;  */
    /* margin-bottom: 300px; */
    /* border: 1px solid #000;*/
    
}
.bg-header-box img{
    position: absolute;
    left: 0;
    right: 0;
    top: -200px;
    width: 100%;
    height: auto;
    z-index: 1}
.bg-color-header{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background:var(--fk-teal);
    z-index: 2}
.left-bg-header{
    position: absolute;
    left: -20px;
    top: 5px;
    width: 22%}
.left-bg-header img{
    width: 100%;
    height: auto}
.right-bg-header{
    position: absolute;
    right: -150px;
    width: 22%;
    top: 90px}
.right-bg-header img{
    width: 100%;
    height: auto}
.c-header-box{
    position: absolute;
    left: 0;
    right: 0;
    width: 80%;
    top: 45px;
    height: auto;
    margin: 0 auto;
    /* border: 1px solid #000; */
    /* height: 100px; */

}
.header-box{
    position: relative;
    /* width: 50%; */
    float: left;
    /* border: 1px solid #000; */
    /* border-left: 1px solid #eee; */
    /* padding: 10px; */
    padding-top: 0;
    /* height: 10rem; */
    padding-top: 50%}
#right-box{
    width: 35%}
#left-box{
    width: 65%}
.c-header-box-content-1{
    position: absolute;
    left: 10px;
    top: 0px;
    right: 25px;
    bottom: 10px;
    color: var(--fk-navy);
    font-size: 13px;
    padding-top:8.5vw}
.title-head-1{
    font-size: 33px;
    /* font-size: 2.2vw; */
    margin-bottom: 5px}
.title-head-2{
    font-size: 22.5px;
    /* font-size: 1.4vw; */
    margin-bottom: 15px}
.description-text{
    position: relative;
    color: var(--fk-muted);
    line-height: 30px;
    font-size: 13px;
    /* font-size: .85vw; */
    border-right: 5px solid #FAC23A;
    padding-right: 15px;
    /* border: 1px solid #000; */
    
}
.btn-buy-software{
    position: relative;
    width: 160px;
    height: 40px;
    text-align: center;
    border: none;
    outline: none;
    background:var(--fk-err);
    margin-top: 20px;
    line-height: 39px;
    float: right}
.link-buy-software{
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    text-decoration: none;
    color: var(--fk-navy)}
#call-detail{
    /* width: 150px; */
    display: inline-block;
    margin-top: 21px;
    margin-right: 30px;
    font-family: 'IranSans Light';
    font-size: 13px;
    /* float: right; */
    

}
#phone-number{
    /* font-family: 'IranSans Bold'; */
    font-weight: bold;
    font-size: 14px}

.c-header-box-content-2{
    position: absolute;
    top: 0;
    right: 50px;
    left: 0;
    bottom: 0;
    /* border: 1px solid #000; */
    

}
.c-product-icon{
    position: absolute;
    /* width: 370px; */
    /* width: 53%; */
    width: 60%;
    height: 56%;
    transition: all 1s ease 0s;
    /* border: 1px solid #000; */
    cursor: pointer;
    overflow: hidden}
.c-product-icon:hover{}

.c-product-icon img{
    /* position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0; */
    width: 100%;
    height: auto;
    
    /* transform: scale(); */
}
#erp{
    /* bottom: 50px; */
    bottom: 5%;
    
    right: 1.5%;
    transform: scale(1);
    
    z-index: 6}

#mobile{
    top: -23%;
    transform: scale(.8);
    z-index: 5;
    filter: blur(2px);
    transform:scale(.65);
    bottom:0%}
#crm{
    /* top: -70px; */
    top: -11%;
    /* left: 120px; */
    left: 15%;
    /* right: 0; */
    transform: scale(.55);
    z-index: 4;
    filter: blur(3px)}
#bpms{
    /* left: 10px; */
    left: 1%;
    top: 11%;
    transform: scale(.8);
    z-index: 5;
    filter: blur(1px)}
.frontitem{
    /* bottom: 50px; */
    /* bottom: 3%; */
    top: 41.5%;
    /* right: 0%; */
    left: 40%;

    transform: scale(1);
    
    z-index: 6;
    /* animation: 1s fadeshow; */
}
.rightitem{
    
    /* top: -130px; */
    /* right: -2%; */
    left: 64%;
    top: -15%;


    /* height: auto; */
    /* top: -10%; */
    transform: scale(.5);
    z-index: 5;
    filter: blur(1px);
    opacity: .9;
    /* animation: 1s fadeshow; */
}
.backitem{
     /* top: -70px; */
     top: -17%;
     /* left: 120px; */
     left: 16%;

     /* right: 0; */
     transform: scale(.6);
     z-index: 4;
     filter: blur(1px);
     opacity: .7;
     /* animation: 1s fadeshow; */
}
.leftitem{
     /* left: 10px; */
     left: -7.5%;
     top: 14%;


     transform: scale(.85);
     opacity: .9;
     z-index: 5;
     filter: blur(1px);
     /* animation: 1s fadeshow; */
}
@keyframes fadeshow {
    0%{
        opacity: 0;

    }
    50%{
        opacity: .5;
    }
    100%{
        opacity: 1;
    }
}
.main-icon{
    position: absolute;
    bottom: 4%;
    right: -16%;
    /* left: 20%; */
    width: 95%;
    height: 65%;
    /* border: 1px solid #000; */
    background-size: cover;
    background-position:center top;
    background-repeat: no-repeat}
.main-icon img{
    width: 100%;
    height: auto}
#main-icon-erp{
    /* background-image: url('/images/new-erp.svg'); */
}
#main-icon-crm{
    width: 28%;
    right: 17%;
    
    /* background-image: url('/images/new-crm.svg'); */
}
#main-icon-bpms{
    width: 90%;
    right: -17%;
    bottom: 5.5%;
    height: 80%;
    /* border: 1px solid #000; */
    /* background-image: url('/images/new-bpms.svg'); */
}


#mobile-icon{
    
    width: 30%;
    height: auto;
    
    /* width: 30%;
    height: auto;
    border: 1px solid var(--fk-line-solid); */
}
#mobile-icon-front-position{
    transform: scale(.7)}

/* End Index Header */

.nav-icon-navigation{
    display: none}
#ozv{
    display: none}
#pro{
    display: none}
.index-spacer{
    position: relative;
    width: 100%;
    height: auto;
    display: table}

.c-head-text-services{
    position: relative;
    margin: 0 auto;
    width: 100%;
    text-align: center;
    margin-top: 80px}
#text1{
    font-family: 'IranSans Black';
    font-size: 22px;
    color: var(--fk-navy)}
#text2{
    font-size: 14px;
    color: var(--fk-muted);
    font-family: 'IranSans Bold';
    margin-top: 5px}


#left-bg{
    position: absolute;
    left:-260px;
    width:330px;
    top: 0px}
#left-bg img{
    width: 100%;
    height: auto}

.c-service-img{
    position: absolute;
    top: -70px;
    width: 70%;
    height: 120px;
    left: 0;
    right: 0;
    margin: 0 auto}
.c-service-img img{
   width: auto;
   height: 100%}
#mobile-icon{
    width: 38%}
#crm-icon{
    width: 38%;
    top: -38%}
#erp-icon{
    top: -33%;
    width: 55%}
#bpms-icon{
    width: 70%}
.card-title{
    font-family: 'IranSans Bold';
    margin-top: 50px;
    font-size: 20px;
    color: var(--fk-muted)}
.card-text{
    text-align: center;
    font-size: 13.5px;
    color: var(--fk-muted);
    line-height: 30px;
    margin-top: 5px}

.c-show-more{
    position: relative;
    /* border: 1px solid #000; */
    margin-top: 10px;
    font-size: 16px}
.c-show-more a{
    text-decoration: none;
    color: var(--fk-teal-ink)}
.arrow-icon-left{
    position: relative;
    top: 4px;
    font-size: 20px;
    margin-right: 7px}
.c-btn-tgl-card{
    display: none}
.c-video-part{
    position: relative;
    top: 600px;
    
    width: 100%;
    height: 450px;
    /* border: 1px solid #000; */
    background-color: #fff;
    background-image:url('/images/bg-video.svg');
    background-position:left top;
    background-size:cover}
.bg-video-part{
    position: relative;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    height: 500px;
    
    z-index: 1}
.bg-video-part img{
    width: 100%;
    height: auto}

.left-video-box{
    position: relative;
    float: left;
    width: 50%;
    height: 100%;
    /* border: 1px solid #000; */
    z-index: 2;
    text-align: right;
    color: var(--fk-navy)}
.right-video-box{
    position: relative;
    float: left;
    width: 50%;
    height: 100%;
    /* border: 1px solid #000; */
    z-index: 2}
.title1-video-box{
    margin-top: 200px;
    font-size: 35px;
    font-weight: bold}
.title2-video-box{
    font-weight: bold;
    font-size: 25px}
.description-video-box{
    position: relative;
    margin-top: 20px;
    font-size: 13px;
    color: var(--fk-muted);
    padding-right: 30px;
    padding-left: 50%;
    border-right: 5px solid var(--fk-err);
    line-height: 30px}
.bottom-line{
    display: none}
.c-desk-img{
    position: absolute;
    left: 0;
    right: 0;
    width: 90%;
    bottom: 13px;
    margin: 0 auto;
    height: auto;
    /* background-image: url('/images/desk-with-img.svg');
    background-repeat: no-repeat;
    background-position: bottom;
    background-size: 100% auto; */
    /* border: 1px solid #000; */
}
#desk-product{
    width: 100%}

.c-img{
    position: relative;
    width: 100%;
    height: auto;
    /* border: 1px solid red; */
}
.c-img img{
    width: 100%;
    height: auto}
.c-video-player{
    position: absolute;
    top: 5%;
    bottom: 16.5%;
    left: 11.5%;
    right: 11.5%;
    /* border: 1px solid #FAC23A; */
}
#player-product{
    left: 14.5%;
    right: 15%;
    top: 3.5%}
.video-player{
    width: 100%;
    height: 100%}
.c-customer-comments{
    position: relative;
    top: 600px;
    width: 100%;
    height: 650px;
    border: 1px solid var(--fk-line-solid);
    margin-bottom: 600px;
    display: table;
    padding-bottom: 50px;
    overflow: hidden}
.customer-comments-box{
    position: relative;
    width: 40%;
    margin: 0 auto;
    min-height: 240px;
    height: auto;
    box-shadow: 0px 0px 35px rgba(var(--fk-teal-rgb),0.22);
    border-radius: 15px;
    margin-top: 100px;
    padding: 20px;
    padding-top: 40px;
    padding-bottom: 40px;
    z-index: 100;
    background-color: var(--fk-white)}
#customer-comment-text{
    position: relative;
    font-size: 13px;
    color: var(--fk-muted);
    line-height: 33px;
    text-align: center;
    z-index: 100}
.top-tab{
    position: absolute;
    width: 190px;
    height: 80px;
    box-shadow: 0px 0px 35px rgba(var(--fk-teal-rgb),0.22);
    top: -80px;
    left: 0;
    right: 0;
    margin: 0 auto;
    border-top-left-radius: 45px;
	border-top-right-radius: 45px}
.top-tab::before, .top-tab::after{
    position: absolute;
    content: '';
    height: 50px;
    width: 60px;
    bottom: -10px}
.top-tab::after{
    right: -60px;
    border-radius: 0 0 0 50px;
    box-shadow: -30px 0 0 0 rgba(var(--fk-white-rgb),1)}
.top-tab::before{
    left: -60px;
    border-radius: 0 0 50px 0;
    box-shadow: 30px 0 0 0 rgba(var(--fk-white-rgb),1)}
.bg-comment-box{
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    border-radius: 15px;
    background-color: var(--fk-white);
    z-index: 1}
.bg-top-tab{
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    border-top-left-radius: 45px;
    border-top-right-radius: 45px;
    background-color: var(--fk-white)}
.customer-comments-box::before{
    /* position: absolute;
    content: '';
    width: 200px;
    height: 100px;
    box-shadow: 0px 0px 35px rgba(var(--fk-teal-rgb),0.22);
    border-radius: 30px;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    top: -80px;
    left: 0;
    right: 0;
    margin: 0 auto;
    z-index: 1; */

    /* border-bottom-left-radius: -30px; */
}
.c-brand-icon{
    position: absolute;
    top: -70px;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 130px;
    height: 40px;
    /* border: 1px solid #000; */

}

.c-brand-icon img{
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: auto;
    height: 100%}
.c-social-icons{
    width: 100%;
    height: 30px;
    margin-top: 20px}
.social-icon{
    position: relative;
    width: auto;
    height: 35px;
    /* border: 1px solid #000; */
    font-size: 28px;
    color: var(--fk-muted);
    margin-left: 10px;
    display: inline-block;
    transition: ease-out .2s}
.social-icon:hover{
    color: var(--fk-navy)}
.c-btn-before-next{
    position: absolute;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    /* border: 1px solid #000; */
    top: 35%;
    text-align: center;

    font-size: 25px;
    line-height: 33px;
    cursor: pointer;
    z-index: 500;
    /* color: #d3d3d3; */
}
.active-icon{
    color: var(--fk-err)}
.disable-icon{
    color: var(--fk-muted)}
#btn-left{
    left: -80px;
    /* color: #F33B4A; */
}
#btn-right{
    right: -80px}
.frontend-footer{
    position: relative;
    left: 0;
    right: 0;
    top: 20px;
    width: 100%;
    
    padding-top: 20px;
    padding-bottom: 20px;
    height: auto;
    background:var(--fk-teal);
    display:table;
    overflow: hidden}
.c-footer-contents{
    position: relative;
    width: 90%;
    height: auto;
    right: 10%}
.footer-part{
    position: relative;
    width: 25%;
    float: right;
    height: auto;
    text-align: right;
    /* padding-right: 100px; */
    /* border: 1px solid #000; */
    
}
.c-brand-footer{
    position: relative;
    width: 180px;
    height: auto}
.c-brand-footer img{
    width: 100%;
    height: auto}
.footer-part h3{
    display: block;
    font-family: 'IranSans Bold';
    font-size: 15px;
    color: var(--fk-navy);
    margin-bottom: 20px}
.c-footer-links{
    display: block;
    width: 100%;
    height: 30px;
    margin-bottom: 7px;
    overflow: hidden}
.c-footer-links a{
    text-decoration: none;
    color: var(--fk-muted);
    font-size: 13px}
.c-footer-links a:hover{
   color: var(--fk-muted)}
.footer-rights{
    position: relative;
    left: 0;
    right: 0;
    bottom: -20px;
    width: 100%;
    height: 80px;
    padding-top: 20px;
    padding-bottom: 20px;
    background: var(--fk-teal);
    display: table;
    /* border: 1px solid #000; */
    overflow: hidden;
    padding-top: 0;
    padding-bottom: 0}
.c-fr-contents{
    position: relative;
    width: 80%;
    height: 100%;
    left: 0;
    right: 0;
    margin: 0 auto;
    /* line-height: 80px; */
    /* border: 1px solid #000; */
}
.footer-text{
    position: relative;
    width: 70%;
    float: right;
    height: 100%;
    font-size: 13px;
    font-family: 'IranSans Light';
    color: var(--fk-navy);
    line-height: 80px;
    /* line-height: 80px; */
    /* border: 1px solid #000; */
}
.c-footer-icons{
    position: relative;
    width: 30%;
    float: right;
    height: 100%;
    /* border: 1px solid #000; */
}
.footer-icon{
    position: relative;
    width: 60px;
    height: auto;
    float: left;
    top: 5px}
.footer-icon img{
    width: 100%;
    height: auto}
/* Sub Menu */
.c-submenu-content{
    position: absolute;
    top: 40px;
    right: 0;
    width: 500px;
    height: 300px;
    background-color: var(--fk-white);
    
    border-radius: 15px;
    z-index: 1000;
    /* transition: ease-out .3s; */
    visibility: hidden;
    opacity: 0;
    /* display: none; */
    /* border-top-right-radius: 0px; */
}
.tglsubmenu .c-submenu-content{
    visibility: visible;
    opacity: 1}
#product-item::after{
    position: absolute;
    content: '';
    width: 90px;
    height: 30px;
    /* background-color: red; */
    bottom: -25px;
    right: 0;
    /* display: none; */
}
.tglsubmenu #product-item::after{
    /* display: block; */
}
.c-submenu-content::before{
    position: absolute;
    content: '';
    width: 90px;
    height: 50px;
    /* border: 1px solid #000; */
    top: -10px;
    right: 0}
.submenu-content{
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 15px}
.bg-submenu{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 15px;
    /* background-color: #eee; */
    opacity: 1;
    /* opacity: .9; */
    /* border-top-right-radius: 0px; */
}
.c-right-items{
    position: relative;
    width: 35%;
    float: right;
    height: 100%;
    border-top-right-radius: 15px;
    border-bottom-right-radius: 15px;
    background-color: var(--fk-cream-soft);
    padding: 10px;
    padding-left: 0}


.c-left-items{
    position: absolute;
    left: 0;
    top: 0;
    width: 65%;
    float: right;
    height: 100%;
    border-top-left-radius: 15px;
    border-bottom-left-radius: 15px;
    background-color: var(--fk-white);
    text-align: right;
    padding-top: 15px}

.c-submenu-item{
    position: relative;
    width: 100%;
    height: 40px;
    color: var(--fk-navy);
    background-color: var(--fk-cream-soft);
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    line-height: 42px;
    text-align: center}

.c-submenu-item a{
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    text-decoration: none;
    color: var(--fk-navy);
    font-size: 13px;
    font-family: 'IranSans'}
.c-submenu-item:hover{
    background-color: var(--fk-white)}
.c-submenu-item:hover a{
    color: var(--fk-teal-ink)}
.c-submenu-link a{
    padding-right: 10px;
    color: var(--fk-navy);
    text-decoration: none;
    font-size: 13px;
    font-family: 'IranSans'}
.c-submenu-link a:hover{
    color: var(--fk-teal-ink)}
.c-submenu-icon{
    position: absolute;
    top: 14.5%;
    right: 5%;
    width: 25px;
    height: auto;
    /* float: right; */
    
}
.c-submenu-icon img{
    width: 100%;
    height: auto}

.c-submenu-item::after{
    /* content: '';
    position: absolute;
    left: -300px;
    top: -10px;
    width: 300px;
    height: 180px;
    background-color: var(--fk-white); */
    /* display: none; */
}
.tglcright .c-submenu-item::after{
    display: block}

/* #bpms-item::after{
    content: '';
    position: absolute;
    left: -300px;
    top: -10px;
    width: 300px;
    height: 180px;
    background-color: var(--fk-white);
    display: none} */



#bpms-links{
    
    display: none}
.tglbpms #bpms-links{
    display: block}
.tglbpms #bpms-item-sub{
    background-color: var(--fk-white)}
.tglbpms #bpms-item-sub a{
    color: var(--fk-teal-ink)}

#erp-links{
    display: none}
.tglerp #erp-links{
    display: block}
.tglerp #erp-item-sub{
    background-color: var(--fk-white)}
.tglerp #erp-item-sub a{
    color: var(--fk-teal-ink)}

#crm-links{
    display: none}
.tglcrm #crm-links{
    display: block}
.tglcrm #crm-item-sub{
    background-color: var(--fk-white)}
.tglcrm #crm-item-sub a{
    color: var(--fk-teal-ink)}

#mobile-links{
    display: none}
.tglmobile #mobile-links{
    display: block}
.tglmobile #mobile-item-sub{
    background-color: var(--fk-white)}
.tglmobile #mobile-item-sub a{
    color: var(--fk-teal-ink)}

#quality-links{
    display: none}
.tglquality #quality-links{
    display: block}
.tglquality #quality-item-sub{
    background-color: var(--fk-white)}
.tglquality #quality-item-sub a{
    color: var(--fk-teal-ink)}

#web-links{
    display: none}
.tglweb #web-links{
    display: block}
.tglweb #web-item-sub{
    background-color: var(--fk-white)}
.tglweb #web-item-sub a{
    color: var(--fk-teal-ink)}
#services-links{
    display: none}
.tglservices #services-links{
    display: block}
.tglservices #services-item-sub{
    background-color: var(--fk-white)}
.tglservices #services-item-sub a{
    color: var(--fk-teal-ink)}


#features-links{
    display: none}
.tglfeatures #features-links{
    display: block}
.tglfeatures #features-item-sub{
    background-color: var(--fk-white)}
.tglfeatures #features-item-sub a{
    color: var(--fk-teal-ink)}



#machine-links{
    display: none}
.tglmachine #machine-links{
    display: block}
.tglmachine #machine-item-sub{
    background-color: var(--fk-white)}
.tglmachine #machine-item-sub a{
    color: var(--fk-teal-ink)}

.c-public-submenu{
    position: absolute;
    top: 40px;
    right: 0;
    width: 200px;
    height: auto;
    padding: 10px;
    background-color: var(--fk-cream-soft);
    border-radius: 5px}
.c-public-submenu::before{
    position: absolute;
    content: '';
    width: 90px;
    height: 10px;
    top: -10px;
    right: 0;
    /* border: 1px solid #000; */
}
.c-a-links{
    position: relative;
    width: 100%;
    float: right;
    height: 40px;
    text-align: center;
    background-color: var(--fk-cream-soft);
    border-radius: 5px;
    line-height: 40px}
.c-a-links a{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    text-decoration: none;
    color: var(--fk-navy);
    font-size: 13px;
    font-family: 'IranSans Light'}
.c-a-links:hover{
    background-color: var(--fk-white)}
.c-a-links:hover a{
    color: var(--fk-teal-ink)}

#services-submenu{
    display: none}
.tglservices-sub #services-submenu{
    display: block}
#articles-submenu{
    display: none}
.tglarticles-sub #articles-submenu{
    display: block}

#news-submenu{
    display: none}
.tglnews-sub #news-submenu{
    display: block}

.header-show-product{
    position: relative;
    width: 100%;
    height: 600px;
    /* border: 1px solid #000; */
    /* background: linear-gradient(to right, #017dcd, #004092); */
    background-image: url('/images/header-bg.svg');
    background-size: cover;
    background-position: center bottom;
    background-repeat: no-repeat;
    z-index: 1}
.c-header-content{
    position: relative;
    width:80%;
    height: 100%;
    padding: 20px;
    margin: 0 auto;
    display: table;
    /* border: 1px solid #000; */
    text-align: center}
.c-product-heading{
    width: 70%;
    margin: 0 auto;
    text-align: center}
.top-line-heading{
    position: relative;
    display: block;
    width: 33%;
    height: 7px;
    border-radius: 5px;
    background-color: var(--fk-gold);
    margin: 0 auto;
    margin-top: 100px;
    margin-bottom: 5px}
.c-product-heading h1{
    font-size: 40px;
    color: var(--fk-navy);
    display: block;
    /* font-family: 'IranSans Bold'; */
    
}
.c-description-product{
    width: 35%;
    font-size: 14px;
    color: var(--fk-muted);
    display: block;
    margin: 0 auto;
    margin-top: 10px;
    line-height: 35px}
.buy-btn-header{
    position: relative;
    width: 160px;
    height: 40px;
    text-align: center;
    background-color: var(--fk-gold);
    color: var(--fk-navy);
    line-height: 40px;
    margin: 0 auto;
    font-size: 14px;
    margin-top: 25px;
    box-shadow: 0px 0px 20px rgba(var(--fk-gold-rgb),0.5);
    transition: .3s}
.buy-btn-header:hover{
    box-shadow: 0px 0px 20px 3px rgba(var(--fk-gold-rgb),0.5)}
.buy-btn-header a{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0}
.top-img{
    position: absolute;
    top: 0px;
    left: -200px;
    width: 100%;
    height: 100%;
    background-image: url('/images/bgproduct2.svg');
    background-repeat: no-repeat;
    background-position: bottom left;
    background-size: 190% auto}
.bottom-img{
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 50%;
    background-image: url('/images/bgproduct.svg');
    background-repeat: no-repeat;
    background-position: bottom left;
    background-size: 180% auto;
    /* border: 1px solid #000; */
}
.c-product-video{
    position: absolute;
    bottom: -25%;
    /* top: 100px; */
    width: 100%;
    height: auto;
    /* border: 1px solid #000; */
    display: table;
    /* margin-top: 48%; */
}
#video-product{
    float:none;
    left:0;
    right:0;
    margin:0 auto;
    /* border:1px solid #000; */
}

.spacer-bottom{
    position: relative;
    width: 100%;
    height: 300px}
#heading-text-1{
    font-size:45px}

.c-product-detail{
    position: relative;
    width: 100%;
    height: 200px;
    /* border: 1px solid #000; */
    display: table}
.c-bg-detail-img{
    position: absolute;
    left: 0%;
    right:0%;
    top: 0;
    bottom: 0;
    height: 600px;
    background-image: url('/images/bg-product-detail.svg');
    background-repeat: no-repeat;
    background-position:bottom left;
    background-size: cover;
    /* border: 1px solid #000; */
}
.pack-detail{
    position: relative;
    width: 80%;
    height: auto;
    display: table;
    margin: 0 auto}
.c-pro-cat-icon{
    position: relative;
    width: auto;
    height: 160px;
    left: 0;
    right: 0;
    margin: 0 auto;
    /* border: 1px solid #000; */
}

/* .pro-cat-icon{
    position: absolute;
    width: 70%;
    height: 120px;
    left: 0;
    right: 0;
    margin: 0 auto;
    border: 1px solid var(--fk-line-solid)} */
.pro-cat-icon img{
    position: absolute;
    width: auto;
    height: 100%;
    left: 0;
    right: 0;
    margin: 0 auto}
.another-products{
    
    width: 100%;
    min-width: 100%;
    height: auto;
    /* border: 1px solid #000; */
    display: flex;
    margin-top: 25px;
    justify-content: center;
    justify-self: center}
.c-pro-cat{
    position: relative;
    width: 180px;
    float: right;
    height: 190px;
    border: 1px solid var(--fk-line-solid);
    padding: 15px;
    padding-top: 18px;
    border-radius: 10px;
    background-color: var(--fk-white);
    cursor: pointer;
    bottom: 0;
    transition: all ease-out .3s}
.c-pro-cat:hover{
    border: 1px solid var(--fk-line-solid);
    z-index: 10;
    box-shadow: 0px 0px 10px rgba(var(--fk-teal-rgb),0.22);
    bottom: 10px}
.activeproduct{
    border: 1px solid var(--fk-line-solid);
    z-index: 10;
    box-shadow: 0px 0px 10px rgba(var(--fk-teal-rgb),0.22);
    bottom: 10px}
.pro-cat{
    position: relative;
    width: 100%;
    height: 110px}
.pro-cat img{
    position: absolute;
    width: auto;
    height: 100%;
    left: 0;
    right: 0;
    margin: 0 auto}
.c-pro-cat h3{

    font-size: 14px;
    text-align: center;
    color: var(--fk-muted);
    font-family: 'IranSans Bold'}
.c-software-features-header{
    position: relative;
    top: -80px}
.small-header{
    position: relative;
    width: 250px;
    height: 60px;
    line-height: 55px;
    border-radius: 20px;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    box-shadow: 0px 0px 15px rgba(var(--fk-teal-rgb),0.22);
    left: 0;
    right: 0;
    margin: 0 auto;
    font-size: 13px;
    color: var(--fk-teal-ink);
    text-align: center;
    z-index: 1;
    background-color: var(--fk-white)}
.big-header{
    position: relative;
    width: 600px;
    height: auto;
    left: 0;
    right: 0;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    /* border: 1px solid #000; */
}
.main-content-header{
    position: relative;
    width: 100%;
    height: 65px;
    
    /* border: 1px solid #000; */
    left: 0;
    right: 0;
    margin: 0 auto}
.c-big-header-items{
    position: relative;
    width: 100%;
    height: 100%;
    box-shadow: 0px 0px 30px rgba(var(--fk-teal-rgb),0.22);
    left: 0;
    right: 0;
    margin: 0 auto;
    font-size: 15px;
    z-index: 6;
    overflow: hidden;
    background-color: var(--fk-white)}
.big-header-items{
    position: relative;
    height: 100%;
    width: 600px;
    margin-right: 20px;
    /* border: 1px solid #000; */
}
.c-option-item{
    position: relative;
    width: auto;
    height: 100%;
    float: right;
    /* border: 1px solid #000; */
    padding: 15px;
    padding-top: 12px;
    padding-bottom: 12px}
.option-item{
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 25px;
    /* border: 1px solid #000; */
    margin: 0 auto;
    text-align: center;
    line-height:1.3;
    padding: 10px;
    padding-right: 15px;
    padding-left: 15px;
    color: var(--fk-muted);
    cursor: pointer;
    transition: ease-out .2s}
.option-item:hover{
    box-shadow: 0px 0px 15px rgba(var(--fk-gold-rgb),0.5);
    background-color: var(--fk-gold);
    color: var(--fk-navy)}
.active-option{
    box-shadow: 0px 0px 15px rgba(var(--fk-gold-rgb),0.5);
    background-color: var(--fk-gold);
    color: var(--fk-navy);
    transition: .1s}
.p-f-btn{
    position: absolute;
    width: 80px;
    height: 80px;
    top: -7px;
    border-radius: 50%;
    /* border-radius: 50%; */
    
    background-color: #f6f9fc;
    /* box-shadow: 0px 0px 30px #eee; */
    /* border: 1px solid #000; */
    z-index: 7;
    /* visibility: hidden; */
}
#p-f-right{
    right: -59px}
#p-f-left{
    left:-59px}
.p-f-main-btn{
    position: absolute;
    width: 55px;
    height: 55px;
    border-radius: 50%;
    background-color: var(--fk-white);
    box-shadow: 0px 0px 30px rgba(var(--fk-teal-rgb),0.22);
    top: 5px;
    z-index: 8;
    font-size: 20px;
    line-height: 59px;
    text-align: center}
#p-f-right-main{
    right: -44px;
    color: var(--fk-gold-ink)}
#p-f-left-main{
    left: -44px;
    color: var(--fk-muted)}
.c-item-contents{
    position: relative;
    width: 100%;
    height: 700px;
    left: 0;
    right: 0;
    margin: 0 auto;
    overflow: visible;
    /* overflow-x: hidden; */
    /* border: 1px solid #000; */
    /* display: table; */
}
.item-contents{
    position: relative;
    width: 100%;
    height: auto;
    /* border: 1px solid #000; */
    left: 0;
    right: 0;
    margin: 0 auto;
    display: table;
    /* overflow-x: scroll; */

}
.package-content{
    position: absolute;
    width: 100%;
    height: auto;
    /* border: 1px solid #000; */
    /* overflow-x: scroll;
    overflow-y: visible; */
    white-space: nowrap;
    display: flex;
    justify-content: center;
    flex-grow: 1}
.c-package-item-box{
    position: relative;
    width: 280px;
    height: 470px;
    float: right;
    padding: 13px}
.package-item-box{
   position: relative;
   width: 100%;
   height: 100%;
   border-radius: 10px;
   background-color: var(--fk-white);
   padding: 20px;
   box-shadow: 0px 0px 20px 1px rgba(var(--fk-teal-rgb),0.22);
   transition: ease-out .4s;
   /* transform: scale(1); */
}
.package-item-box:hover{
    transform: scale(1.05);
    /* transform: ; */
    /* top: 30px; */
}
.package-item-box:hover .btn-buy-pack{
    background-color: var(--fk-err);
    color: var(--fk-navy);
    border-radius: 0}
.c-pack-item-img{
    position: relative;
    width: 100%;
    height: 115px}
.c-pack-item-img img{
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: auto;
    height: 100px}
.pack-title{
    position: relative;
    width: 100%;
    height: auto;
    text-align: center;
    margin-bottom: 5px}
.pack-title h3{
    font-size: 18px;
    color: var(--fk-navy);
    font-family: 'IranSans Bold'}
.c-pack-features{
    position: relative;
    width: 100%;
    height: auto}
.pack-feature-item{
    position: relative;
    width: 100%;
    height: 20px;
    font-size: 16px;
    color: var(--fk-teal-ink);
    margin-bottom: 5px;
    padding-right: 20px}
.pack-feature-item span{
    color: var(--fk-muted);
    margin-right: 10px;
    font-size: 11px}
.pack-feature-item a{
    color: var(--fk-muted);
    margin-right: 10px;
    font-size: 11px;
    text-decoration: none;
    cursor: pointer}
.pack-feature-item a:hover{
    color: var(--fk-teal-ink);
    text-decoration: underline}
.c-pack-price{
    position: relative;
    width: 100%;
    height: 30px;
    margin-top: 15px;
    color: var(--fk-teal-ink);
    font-size: 14px;
    text-align: center}
.btn-buy-pack{
    position: relative;
    width: 150px;
    height: 35px;
    border: 1px solid var(--fk-err);
    color: var(--fk-err);
    border-radius: 5px;
    left: 0;
    right: 0;
    margin: 0 auto;
    margin-top: 10px;
    margin-bottom: 10px;
    cursor: pointer;
    text-align: center;
    line-height: 2;
    transition: .3s}
.btn-buy-pack:hover{
    background-color: var(--fk-err);
    color: var(--fk-navy);
    border-radius: 0}





.feature-content{
    display: none}
.c-des-packages{}
.des-packages{
    position: relative;
    width: 60%;
    min-height: 200px;
    max-height: 500px;
    left: 0;
    right: 0;
    margin: 0 auto;
    background-color: var(--fk-white);
    box-shadow: 0px 0px 25px 1px rgba(var(--fk-teal-rgb),0.22);
    border-radius: 10px}
.pack-des-text{
    padding: 30px;
    padding-right: 40px;
    padding-left: 40px;
    font-size: 14px;
    color: var(--fk-navy)}
.c-feature-text{
    position: relative;
    width: 60%;
    height: auto;
    top: -300px;
    left: 0;
    right: 0;
    margin: 0 auto;
    background-color: var(--fk-white);
    font-size: 14px;
    box-shadow: 0px 5px 20px rgba(var(--fk-teal-rgb),0.22);
    z-index: 100;
    padding: 50px;
    padding-top: 40px;
    border-radius: 20px;
    color: var(--fk-navy)}

.edit-btn-profile {
    position: absolute;
    width: 120px;
    height: 35px;
    line-height: 33px;
    text-align: center;
    cursor: pointer;
    color: var(--fk-white);
    border-radius: 25px;
    background: -webkit-gradient(linear, right top, left top, from(var(--fk-teal)), to(var(--fk-teal)));
    background:var(--fk-teal);
    left: 0;
    right: 0;
    bottom: -20px;
    margin: 0 auto;
    -webkit-transition: .3s;
    transition: .3s;
    font-size: 13.5px}
  
  .edit-btn-profile:hover {
    -webkit-box-shadow: 0px 0px 10px #006eb8;
            box-shadow: 0px 0px 10px rgba(var(--fk-teal-rgb),0.22)}

  .c-avatar-edit-form {
    position: relative;
    width: 100%;
    height: 70px;
    margin-bottom: 10px}
  
  .c-avatar-img {
    position: relative;
    width: 70px;
    height: 70px;
    border-radius: 50%;
    border: 1px solid var(--fk-line-solid);
    left: 0;
    right: 0;
    margin: 0 auto;
    overflow: hidden}
  
  .c-avatar-img img {
    width: 100%;
    height: auto}
  
  .c-avatar-bar {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    line-height: 70px;
    cursor: pointer;
    opacity: 0;
    -webkit-transition: .2s;
    transition: .2s}
  
  .c-avatar-bar:hover {
    opacity: 1}
  
  .avatar-bar {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: var(--fk-cream);
    opacity: .3;
    z-index: 3}
  
  .camera-icon {
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    top: 37%;
    color: var(--fk-teal-ink);
    font-size: 17px}
  
/* Profile Styles ------------- */

.c-profile-content {
    position: relative;
    width: 80%;
    height: auto;
    display: table;
    top: -150px;
    left: 0;
    right: 0;
    margin: 0 auto}
  
  @media only screen and (max-width: 780px) {
    .c-profile-content {
      width: 100%}
  }
  
  .profile-right-side {
    position: relative;
    width: 300px;
    float: right;
    height: auto;
    display: table}
  
  @media only screen and (max-width: 780px) {
    .profile-right-side {
      float: none;
      left: 0;
      right: 0;
      margin: 0 auto}
  }
  
  .c-profile-box {
    position: relative;
    width: 300px;
    height: auto;
    -webkit-box-shadow: 0px 0px 30px #e2e0e0;
            box-shadow: 0px 0px 30px rgba(var(--fk-teal-rgb),0.22);
    border-radius: 10px;
    background-color: var(--fk-white);
    overflow: hidden}
  
  @media only screen and (max-width: 780px) {
    .c-profile-box {
      float: none;
      left: 0;
      right: 0;
      margin: 0 auto}
  }
  
  .profile-box-header {
    position: relative;
    width: 100%;
    height: 250px;
    overflow: hidden;
    top: -55px}
  
  .profile-box-header img {
    position: relative;
    width: 100%;
    height: auto}
  
  .profile-box-body {
    position: relative;
    width: 100%;
    height: auto;
    padding-right: 30px;
    top: -30px;
    padding-bottom: 30px}
  
.profile-box-item {
    width: 100%;
    height: 35px;
    line-height: 35px}
  
.lbl-profile {
    font-size: 13.5px;
    font-family: "IranSans Light";
    color: var(--fk-navy);
    margin-left: 7px}
  
  .profile-data-text {
    font-size: 13.5px;
    font-family: "IranSans Light";
    color: var(--fk-navy)}
  
  #data-text-number {
    color: var(--fk-teal-ink);
    font-family: "IranSans Bold"}
  
  .c-credit-detail {
    position: relative;
    width: 100%;
    height: 190px;
    display: table;
    -webkit-box-shadow: 0px 0px 30px #e2e0e0;
            box-shadow: 0px 0px 30px rgba(var(--fk-teal-rgb),0.22);
    border-radius: 10px;
    margin-top: 10px;
    background-color: var(--fk-white);
    overflow: hidden}
  
  .header-credit-detail {
    position: relative;
    width: 100%;
    height: 120px;
    background: -webkit-gradient(linear, right top, left top, from(var(--fk-gold)), to(var(--fk-gold)));
    background:var(--fk-gold)}
  
  #credit-text {
    position: relative;
    width: 100%;
    height: 30px;
    font-size: 15px;
    font-family: "IranSans Light";
    color: var(--fk-navy);
    padding-right: 30px;
    top: 15px}
  
  .c-credit-amount {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    width: 100%;
    text-align: center;
    line-height: 120px}
  
  .credit-amount {
    position: relative;
    color: var(--fk-navy);
    text-align: center;
    font-size: 30px;
    font-family: "IranSans Bold"}
  
  #rial-txt-profile {
    color: var(--fk-navy);
    font-size: 15px}
  
  .c-credit-btn {
    position: relative;
    width: 100%;
    height: 50px;
    top: 105px;
    display: table}
  
  .btn-credit {
    position: absolute;
    width: 100px;
    height: 40px;
    line-height: 40px;
    border-radius: 25px;
    text-align: center;
    background: var(--fk-gold);
    color: var(--fk-navy);
    cursor: pointer;
    -webkit-box-shadow: 0px 0px 10px #ffcc53;
            box-shadow: 0px 0px 10px rgba(var(--fk-gold-rgb),0.5);
    font-family: "IranSans Bold";
    font-size: 12.5px;
    -webkit-transition: .4s;
    transition: .4s}
  
  .btn-credit:hover {
    -webkit-box-shadow: 0px 0px 15px #ffc02c;
            box-shadow: 0px 0px 15px rgba(var(--fk-gold-rgb),0.5)}
  
  #cash-out {
    right: 30px}
  
  #cash-in {
    left: 30px}
  
  #cash-in-icon {
    position: relative;
    -webkit-transform: rotate(90deg);
            transform: rotate(90deg);
    top: 1.5px}
  
  #cash-out-icon {
    position: relative;
    -webkit-transform: rotate(-90deg);
            transform: rotate(-90deg);
    top: 1.5px}
  
  .c-profile-options {
    position: relative;
    width: 100%;
    height: auto;
    background: var(--fk-white);
    border-radius: 10px;
    overflow: hidden;
    -webkit-box-shadow: 0px 0px 30px #e2e0e0;
            box-shadow: 0px 0px 30px rgba(var(--fk-teal-rgb),0.22);
    margin-top: 10px;
    padding-right: 30px;
    padding-left: 30px;
    padding-bottom: 10px}
  
  .header-options {
    position: relative;
    width: 100%;
    height: 50px;
    line-height: 50px;
    font-size: 15px;
    font-family: "IranSans Light";
    color: var(--fk-navy)}
  
  .profile-option-item {
    position: relative;
    width: 100%;
    height: 40px;
    border-radius: 25px;
    line-height: 40px;
    margin-bottom: 5px;
    cursor: pointer;
    color: var(--fk-navy);
    font-family: "IranSans Light";
    text-align: center;
    font-size: 14px}
  
  .profile-option-item:hover {
    background: -webkit-gradient(linear, right top, left top, from(var(--fk-teal-dark)), to(var(--fk-teal-dark)));
    background:var(--fk-teal-dark);
    color: var(--fk-white)}
  
  .active-profile-option {
    background: -webkit-gradient(linear, right top, left top, from(var(--fk-teal)), to(var(--fk-teal)));
    background:var(--fk-teal);
    color: var(--fk-white)}
  
  .profile-left-side {
    position: relative;
    width: 73.5%;
    left: 0;
    height: auto;
    float: left;
    border-radius: 10px}
  
  @media only screen and (max-width: 780px) {
    .profile-left-side {
      position: relative;
      width: 100%;
      left: 0;
      right: 0;
      float: right;
      margin: 0 auto;
      margin-top: 50px}
  }
  
  .left-side-header {
    position: relative;
    right: 0;
    left: 0;
    height: 60px;
    -webkit-box-shadow: 0px 0px 10px #e2e0e0;
            box-shadow: 0px 0px 10px rgba(var(--fk-teal-rgb),0.22);
    border-radius: 5px;
    margin: 0 auto;
    background-color: var(--fk-white);
    color: var(--fk-navy);
    font-size: 15px;
    line-height: 60px;
    font-family: "IranSans Light";
    padding-right: 30px}
  
  .left-side-main-box {
    position: relative;
    width: 100%;
    height: auto;
    display: table;
    margin-top: 10px;
    border-radius: 5px;
    background-color: var(--fk-white);
    color: var(--fk-navy);
    -webkit-box-shadow: 0px 0px 10px #e2e0e0;
            box-shadow: 0px 0px 10px rgba(var(--fk-teal-rgb),0.22);
    padding-bottom: 30px}
  

  .register-form-modal {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 100;
    line-height: 20px}
  
  .bg-black-bar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: var(--fk-cream);
    opacity: .3}
  
  .form-error {
    position: relative;
    margin-top: 7px;
    width: 100%;
    height: 10px;
    color: red;
    font-family: 'IranSans Bold';
    font-size: 10px;
    padding-right: 10px;
    display: block}
  
.profile-header{
    background:var(--fk-teal)}
.c-propaid{
    width: 100%;
    height: 500px;
    background-color: var(--fk-white);
    box-shadow: 0px 0px 10px rgba(var(--fk-teal-rgb),0.22);
    margin-top: 10px;
    border-radius: 10px}
/* End Profile Styles ------------- */
/* Article pages styles ----*/
.c-articles-list{
    position: relative;
    width: 60%;
    height: auto;
    margin: 0 auto;
    left: 0;
    right: 0;
    
 
    padding: 20px;
    /* display: table; */
}

.article-item{
    width: 100%;
    height: 150px;

    background-color: var(--fk-white);
    box-shadow: 0px 0px 10px rgba(var(--fk-teal-rgb),0.22);
    
    border-radius: 10px;
    /* padding: 20px; */
    overflow: hidden;
    margin-top: 20px}
.c-article-img{
    position: relative;
    width: 30%;
    height: 100%;
    float:right;
    overflow: hidden;
    /* border: 1px solid #000; */
}
.article-img{
    position: absolute;
    right: 0;
    width: auto;
    height: 100%}
.c-article-content{
    position: relative;
    width: 70%;
    height: 100%;
    float: right;
    /* padding-right: 20px; */
    padding: 20px}
.c-article-content a{
    color: var(--fk-navy);
    text-decoration: none}
.c-article-content a:hover{
    color: var(--fk-teal-ink)}
.c-article-content p{
    font-size: 13.5px}
.img-link{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 5}
/* End Article pages styles ----*/
.btn-dl-demo{
    position: relative;
    width: 150px;
    height: 40px;
    background-color: var(--fk-teal);
    text-align: center;
    line-height: 40px;
    border-radius: 5px;
    transition: ease-in .3s;
    box-shadow: 0px 1px 3px rgba(var(--fk-teal-rgb),0.22)}
.btn-dl-demo:hover{
    box-shadow: 0px 0px 7px rgba(var(--fk-teal-rgb),0.22)}
.btn-dl-demo a{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    text-decoration: none;
    color: var(--fk-navy);
    font-size: 13.5px;
    padding-right: 10px;
    padding-left: 10px}

@media only screen and (max-width:1450px){
    .c-services-part{
        top: 500px}
    .c-video-part{
        top: 500px}
    .c-customer-comments{
        top: 500px;
        margin-bottom: 500px}

}
@media only screen and (max-width:1300px){
    .c-services-part{
        top: 400px}
    .c-video-part{
        top: 400px}
    .c-customer-comments{
        top: 400px;
        margin-bottom: 400px}
}
@media only screen and (max-width:1200px){
    .c-services-part{
        top: 300px}
    .c-video-part{
        top: 300px}
    .c-customer-comments{
        top: 300px;
        margin-bottom: 300px}
    
}
@media only screen and (max-width:1100px){
    .c-services-part{
        top: 250px}
    .c-video-part{
        top: 250px}
    .c-customer-comments{
        top: 250px;
        /* margin-bottom: 250px; */
    }
}

@media only screen and (max-width: 1024px)
{
    .col-m-0{width: 0}
    .col-m-1{width: 8.33%}
    .col-m-2{width: 16.66%}
    .col-m-3{width: 25%}
    .col-m-4{width: 33.33%}
    .col-m-5{width: 41.66%}
    .col-m-6{width: 50%}
    .col-m-7{width: 58.33%}
    .col-m-8{width: 66.66%}
    .col-m-9{width: 75%}
    .col-m-10{width: 83.33%}
    .col-m-11{width: 91.66%}
    .col-m-12{width: 100%}
    .bg-header-box img{
        top: -100px}
    .c-services-part{
        /* top: 150px; */
    }
    .c-header-content{
        width: 100%}
    .c-description-product{
        width: 100%}
    .top-line-heading{
        width: 100%}
    .another-products{
        width: 100%;
        display: block}
    .c-pro-cat{
        width: 25%}
    .big-header{
        width: 65%}
    
}

@media only screen and (max-width: 768px)
{
    .col-m-0{width: 0}
    .col-s-1{width: 8.33%}
    .col-s-2{width: 16.66%}
    .col-s-3{width: 25%}
    .col-s-4{width: 33.33%}
    .col-s-5{width: 41.66%}
    .col-s-6{width: 50%}
    .col-s-7{width: 58.33%}
    .col-s-8{width: 66.66%}
    .col-s-9{width: 75%}
    .col-s-10{width: 83.33%}
    .col-s-11{width: 91.66%}
    .col-s-12{width: 100%}
    /* .c-header-box{
        top: 0px} */
    .c-header-box{
        width: 100%;
        top: 0}
    .header-box{
        padding-top: 80%}
    /* .bg-header-box{
        top: 0} */
    /* .c-header-box-content-1{
        width: 100%}
    .c-header-box-content-2{
        width: 100%} */
    #right-box{
        width: 100%;
        text-align: center}
    #left-box{
        width: 100%}
    .title-head-1{
        font-size: 33px}
    .title-head-2{
        font-size: 14px}
    .index-header{
        height: 600px}

    .navbar-frontend{
        overflow: visible;
        padding-right: 5px;
        padding-left: 10px}
    #nav{
        width: 100%}
    .c-logo{
        width: 130px;
        float: left;
        margin-left: 0px;
        top: 5px}
    .navbar{
        position: absolute;
        right: 0;
        top: 50px;
        width: 100px;
        height: 0;
        
        /* background-color: rgb(46, 152, 201); */
        background-color: #eee;
        border-radius: 5px;
        z-index: 1000;
        padding-top: 0;
        padding-bottom: 0;
        /* overflow: hidden; */
        opacity: 0;
        visibility: hidden;
        transition: .3s}
    .navbar a{
        color: var(--fk-navy)}
    .tglnav .navbar{
        height: 250px;
        opacity: 1;
        visibility: visible}
    
    .nav-item{
        display: block;
        width: 100%;
        height: 30px;
        font-size: 12px;
        margin-right: 0;
        margin-left: 0;
        margin-top: 0;
        line-height: 30px}
    .nav-item a{
        font-family: 'IranSans Light'}
    .nav-icon-navigation{
        position: relative;
        display: block;
        right: 10px;
        top: 5px;
        /* width: 100px;
        height: 100px; */
        /* top: 0; */
        float: right;
        cursor: pointer;
        color: var(--fk-navy);
        font-size: 28px}
    .search-form{
        right: 60px;
        float: right;
        /* border: 1px solid #000; */
        width: 130px}
    .btn-search{
        /* position: absolute; */
        right: 0px}
    .c-auth-items{
        display: none}
    .inp-search{
        float: right;
        /* right: 120px; */
        right: 0;
        padding-right: 30px;
        /* width: 100px; */
    }
    .inp-search:focus{
        /* width: 1; */
        /* width: 200px; */
    }
    .user-detail{
        display: none}
    .right-bg-header{
        display: none}
    .left-bg-header{
        width: 400px;
        left: -310px;

        top: 30px}
    .title-head-1{
        font-size: 30px}
    .title-head-2{
        font-size: 18px}
    .description-text{
        border-right: none;
        padding-right: 0}
    .btn-buy-software{
        float: none;
        margin: 0 auto;
        margin-top: 15px}
    #call-detail{
        float: none;
        margin: 0 auto;
        display: block;
        margin-top: 10px}
    .c-header-box-content-2{
        position: absolute;
        top: 5%;
        right: 60px;
        left: 60px;
        bottom: 80px}
    .c-header-box-content-1{
        top: -80px;
        left: 25px;
        right: 25px;
        margin: 0 auto;
        /* border: 1px solid #000; */
        
    }
    .c-services-part{
        top: 0}
    #left-bg{
        opacity: .2;
        top: 30%;
        left: -280px}
    .c-service-boxes{
        width: 100%;
        margin-top: 10px;
        /* overflow-wrap: break-word; */
        /* overflow: auto; */
        overflow-x: scroll;
        height: 500px;
       
        overflow-y: visible !important;
        /* border: 1px solid #000; */
        scrollbar-width: 0;
        overflow: -moz-scrollbars-none}
    .c-service-boxes::-webkit-scrollbar{
        width: 0}

    .c-service-items{
        width: 1215px;
        height: 300px;
        margin-top: 130px;
        padding-right: 20px;
        /* overflow-x: scroll; */
    }
    .card-title{
        margin-top: 30px}
    .main-service-item{}
    .c-btn-tgl-card{
        position: relative;
        display: block;
        width: 70px;
        height: 40px;
        margin: 0 auto;
        margin-top: 60px;
        /* border: 1px solid #000; */
        padding-right: 5px;
        padding-left: 5px}
    .btn-tgl{
        position: relative;
        width: 6px;
        height: 6px;
        border-radius: 50%;
        background-color: rgba(var(--fk-navy-rgb),0.06);
        display: inline-block;
        overflow: hidden;
        cursor: pointer}
    .btn-tgl a{
        position: absolute;
        top: 0;
        right: 0;
        left: 0;
        bottom: 0}
    .active-btn-tgl{
        transform: scale(1.1);
        box-shadow: 0px 0px 1px 1px rgba(var(--fk-teal-rgb),0.22);
        background-color: var(--fk-err)}
    #tgl-mobile{
        margin-left: 5px}
    #tgl-crm{
        margin-left: 5px}
    #tgl-erp{
        margin-left: 5px}

    .c-video-part{
        top: -100px;
        height: 600px}
    .bg-video-part{
        /* width: ; */
        height: 500px}
    .bg-video-part img{
        /* width: 100%; */
        position: absolute;
        left: 0;
        
        height: 100%}
    .left-video-box{
        width: 100%;
        height: 50%;
        text-align: center}
    .right-video-box{
        width: 100%;
        height: 50%}
    .title1-video-box{
        margin-top: 100px;
        font-size: 32px}
    .title2-video-box{
        /* margin-top: 80px; */
        font-size: 20px}
    .description-video-box{
        width: 80%;
        padding-left: 0;
        border-right: none;
        /* border-bottom: 5px solid #F33B4A; */
        
        margin: 0 auto;
        padding-bottom: 20px;
        font-size: 12px;
        padding-right: 0}
    .bottom-line{
        display: block;
        position: absolute;
        width: 50%;
        height: 5px;
        background-color: var(--fk-err);
        left: 0;
        right: 0;
        bottom: 0;
        margin: 0 auto}
    .c-desk-img{
        bottom: 0}
    .c-customer-comments{
        top:-100px;
        margin-bottom: 0}
    .customer-comments-box{
        width: 90%;
        padding-top: 20px;
        padding-bottom: 20px}
    #customer-comment-text{
        line-height: 25px;
        font-size: 12px}
    #btn-left{
        left: -50px}
    #btn-right{
        right: -50px}
    .footer-part{
        width: 50%}
    .footer-text{
        width: 100%;
        height: auto;
        line-height: 30px;
        text-align: center}
    .c-footer-icons{
        width: 100%;
        height: auto}
    #part-2{
        display: none}
    #part-3{
        /* display: none; */
    }
    #part-4{
        display: none}
    #footer-icon{
        display: none}
    #social-icon{
        text-align: center;
        width: auto;
        left: 0;
        right: 0;
        margin: 0 auto;
        /* border: 1px solid #000; */
    }
    #footer-brand{
        margin: 0 auto}
    .c-submenu-content{
        top: 0;
        right:90px;
        width: 220px;
        opacity: 1;
        height: 500px;
        overflow: scroll;
        padding-top: 0;
        border-radius: 10px}
    .c-submenu-link{
        width: 50%;
        float: right;
        margin-bottom: 5px}
    .c-right-items{
        width: 100%;
        border-top-left-radius: 10px;
        border-bottom-left-radius: 10px;
        padding: 10px;
        height: auto}
    .c-right-items a{
        text-align: left;
        padding-left: 5px;
        font-size: 12px}
    .c-left-items{
        position: relative;
        width: 100%;
        padding: 10px;
        border-radius: 0;
        line-height: 17px;
        height: auto;
        text-align: center}
    .c-left-items a{
        position: relative;
        width: auto;
        height: auto;
        font-size: 11px;
        padding-right: 0;
        
        /* line-height: 10px; */
    }
    .c-submenu-item:hover{
        background-color: var(--fk-cream-soft)}
    .bar-item{
        display: none}
    .nav-item{
        opacity: 1}
    .tglsubmenu .nav-item{
        opacity: 1}
    #bpms-item-sub{
        /* height: 100px; */
    
        padding-bottom: 150px;
        /* border: 1px solid #000; */
    }
    #bpms-item-sub .c-submenu-icon{
        top: 7px}
    #bpms-links{
        position: absolute;
        top: 50px;
        display: block;
        /* padding-right: 0; */
        /* border: 1px solid #000; */
    }
    #erp-item-sub{
        padding-bottom: 270px}
    #erp-item-sub .c-submenu-icon{
        top: 7px}
    #erp-links{
        position: absolute;
        top: 200px;
        display: block}


    #crm-item-sub{
        padding-bottom: 130px}
    #crm-links{
        display: block;
        position: absolute;
        top: 470px}
    #mobile-item-sub{
        /* padding-bottom: 70px; */
    }
    .bg-bar{
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        opacity: .5;
        z-index: 1002;
        /* display: none; */
        opacity: 0;
        visibility: hidden;
        transition: .3s}
    #ozv{
        display: block}
    #pro{
        display: block}

    .c-public-submenu{
      
        top: 0;
        right: 90px}

    .tglservices-sub-click #services-submenu{
        display: block}
    .tglsubmenu-click .c-submenu-content{
        visibility: visible;
        opacity: 1}
    .tglarticles-sub-click #articles-submenu{
        display: block}
    .tglnews-sub-click #news-submenu{
        display: block}
    .c-header-content{
        width: 100%}
    .c-description-product{
        width: 100%}
    .top-line-heading{
        width: 100%}
    .c-product-heading h1{
        font-size: 35px}
    #heading-text-1{
        font-size: 35px}
    .c-product-video{
        position: absolute;
        bottom: -10%;
        left: 0;
        right: 0}
    .another-products{
        width: 100%;
        /* border: 1px solid #000; */
        display: block}
    .c-pro-cat{
        width: 50%}
    .small-header{
        width: 170px;
        font-size: 12px}
    .c-package-item-box{
        width: 100%}
    .c-item-contents{
        /* border: 1px solid #000; */
        
        overflow-x: scroll}
    .item-contents{
        overflow-x: scroll}
    .package-content{
        width: 1000px;
        overflow-x: scroll}
    .package-item-box:hover{
        transform: scale(1);
        /* transform: ; */
        /* top: 30px; */
    }
    .c-big-header-items{
        position: relative;
        width: 100%;
        overflow-x: scroll}
    .big-header-items{
        position: absolute;
        width: 600px}
    #p-f-left{
        left: 0}
    .p-f-btn{
        display: none}
    .site-container{
        overflow-x: hidden}
    .c-left-bg-img{
        width: 100%}
    .c-feature-text{
        width: 99%;
        padding-right: 15px;
        padding-left: 15px}
    .c-articles-list{
        width: 100%}

}


@media only screen and (max-width: 480px)
{
    [class*="col-"]{
        width: 100%}
    .form-box{
        width: 97%}
    .c-services-part{
        top: -150px}
    .footer-part{
        width: 100%}
    #heading-text-1{
        font-size: 30px}
    .c-product-heading h1{
        font-size: 30px}
    .c-pro-cat{
        width: 100%}
 
    
    
}



.cd-nugget-info {
    text-align: center;
    position: absolute;
    width: 100%;
    height: 50px;
    line-height: 50px;
    top: 0;
    left: 0}
  .cd-nugget-info a {
    position: relative;
    font-size: 14px;
    color: var(--fk-teal-ink);
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    transition: all 0.2s}
  .no-touch .cd-nugget-info a:hover {
    opacity: .8}
  .cd-nugget-info span {
    vertical-align: middle;
    display: inline-block}
  .cd-nugget-info span svg {
    display: block}
  .cd-nugget-info .cd-nugget-info-arrow {
    fill: var(--fk-teal-ink)}
  
  /* -------------------------------- 
  
  Basic Style
  
  -------------------------------- */
  .cd-breadcrumb, .cd-multi-steps {
    width: 90%;
    max-width: 768px;
    padding: 0.5em 1em;
    margin: 1em auto;
    background-color: var(--fk-cream-soft);
    border-radius: .25em}
  .cd-breadcrumb::after, .cd-multi-steps::after {
    clear: both;
    content: "";
    display: table}
  .cd-breadcrumb li, .cd-multi-steps li {
    display: inline-block;
    float: left;
    margin: 0.5em 0}
  .cd-breadcrumb li::after, .cd-multi-steps li::after {
    /* this is the separator between items */
    display: inline-block;
    content: '\00bb';
    margin: 0 .6em;
    color: var(--fk-muted)}
  .cd-breadcrumb li:last-of-type::after, .cd-multi-steps li:last-of-type::after {
    /* hide separator after the last item */
    display: none}
  .cd-breadcrumb li > *, .cd-multi-steps li > * {
    /* single step */
    display: inline-block;
    font-size: 16px;
    color: var(--fk-navy)}
  .cd-breadcrumb li.current > *, .cd-multi-steps li.current > * {
    /* selected step */
    color: #96c03d}
  .no-touch .cd-breadcrumb a:hover, .no-touch .cd-multi-steps a:hover {
    /* steps already visited */
    color: #96c03d}
  
  .cd-breadcrumb.custom-icons li:not(.current):nth-of-type(2) > *::before, .cd-multi-steps.custom-icons li:not(.current):nth-of-type(2) > *::before {
    /* change custom icon using image sprites */
    background-position: -20px 0}
  .cd-breadcrumb.custom-icons li:not(.current):nth-of-type(3) > *::before, .cd-multi-steps.custom-icons li:not(.current):nth-of-type(3) > *::before {
    background-position: -40px 0}
  .cd-breadcrumb.custom-icons li:not(.current):nth-of-type(4) > *::before, .cd-multi-steps.custom-icons li:not(.current):nth-of-type(4) > *::before {
    background-position: -60px 0}
  .cd-breadcrumb.custom-icons li.current:first-of-type > *::before, .cd-multi-steps.custom-icons li.current:first-of-type > *::before {
    /* change custom icon for the current item */
    background-position: 0 -20px}
  .cd-breadcrumb.custom-icons li.current:nth-of-type(2) > *::before, .cd-multi-steps.custom-icons li.current:nth-of-type(2) > *::before {
    background-position: -20px -20px}
  .cd-breadcrumb.custom-icons li.current:nth-of-type(3) > *::before, .cd-multi-steps.custom-icons li.current:nth-of-type(3) > *::before {
    background-position: -40px -20px}
  .cd-breadcrumb.custom-icons li.current:nth-of-type(4) > *::before, .cd-multi-steps.custom-icons li.current:nth-of-type(4) > *::before {
    background-position: -60px -20px}
  #pheadtitle{
    width:50%;float:right
  }
  #pheadtutimg{
    width: 50%;height:auto;border-radius:10px;float:right
  }
  
  
  .fixed-box-description{
    position: fixed;
    top: 200px;
    left: 120px;
    border-radius: 10px;
    width: 250px;
    display: table;
    height: auto;
    background: var(--fk-gold);
    padding: 20px;
    padding-top: 30px;
    padding-bottom: 50px;
    box-shadow: 0px 20px 20px -15px rgba(var(--fk-navy-rgb),0.16)}
  .fixed-box-description p{
    font-size: 10px;
    line-height: 1.5}
  
  
  
  @media only screen and (min-width: 768px) {
    .cd-breadcrumb, .cd-multi-steps {
      padding: 0 1.2em}
    .cd-breadcrumb li, .cd-multi-steps li {
      margin: 1.2em 0}
    .cd-breadcrumb li::after, .cd-multi-steps li::after {
      margin: 0 1em}
    .cd-breadcrumb li > *, .cd-multi-steps li > * {
      font-size: 16px}
  }
@font-face{font-family:"IranSans Expanded";src:url("/fonts/IRANSANSExpanded.woff2")}@font-face{font-family:"IranSans Black";src:url("/fonts/IRANSansWeb(FaNum)_Black.woff2")}@font-face{font-family:"IranSans Bold";src:url("/fonts/IRANSansWeb(FaNum)_Bold.woff2")}@font-face{font-family:"IranSans Light";src:url("/fonts/IRANSansWeb(FaNum)_Light.woff2")}@font-face{font-family:"IranSans Medium";src:url("/fonts/IRANSansWeb(FaNum)_Medium.woff2")}@font-face{font-family:"IranSans UltraLight";src:url("/fonts/IRANSansWeb(FaNum)_UltraLight.woff2")}@font-face{font-family:"IranSans";src:url("/fonts/IRANSansWeb(FaNum).woff2")}*{font-family:"IranSans" !important}.container{position:relative;height:auto;display:block;box-sizing:border-box;left:0;right:0;margin:0 auto}@media only screen and (min-width: 1400px){.container{width:1200px}}@media only screen and (max-width: 1400px){.container{width:1200px}}@media only screen and (max-width: 1300px){.container{width:1100px}}@media only screen and (max-width: 1200px){.container{width:950px}}@media only screen and (max-width: 1100px){.container{width:950px}}@media only screen and (max-width: 1000px){.container{width:850px}}@media only screen and (max-width: 900px){.container{width:700px}}@media only screen and (max-width: 800px){.container{width:93%}}@media only screen and (max-width: 700px){.container{width:93%}}@media only screen and (max-width: 600px){.container{width:93%}}.w-100{width:100%;height:auto;display:block}.w-90{width:90%}.w-80{width:80%}.w-70{width:70%}.w-60{width:60%}.w-50{width:50%}.w-40{width:40%}.w-30{width:30%}.w-20{width:20%}.w-10{width:10%}.h-auto{height:auto}.relative{position:relative}.flex{display:flex}.flex-row{flex-direction:row}.flex-column{flex-direction:column}.flex-end{justify-content:flex-end}.flex-start{justify-content:flex-start}.flex-col{flex-direction:column}.flex-responsive{flex-direction:row}@media only screen and (max-width: 700px){.flex-responsive{flex-direction:column}}.align-items-center{align-items:center}.gap-5{gap:5px}.gap-10{gap:10px}.gap-15{gap:15px}.gap-20{gap:20px}.text-center{text-align:center}.text-right{text-align:right}.text-left{text-align:left}.text-justify{text-align:justify}.ltr{direction:ltr}.rtl{direction:rtl}.regular{font-family:"IranSans"}.bold{font-family:"IranSans Bold"}.extra-bold{font-family:"IranSans Extra Bold"}.black{font-family:"IranSans Black"}.light{font-family:"IranSans light"}.thin{font-family:"IranSans thin"}.flex-center{justify-content:center;justify-items:center;align-items:center;align-content:center}.justify-content-center{justify-content:center}.justify-items-center{justify-items:center}.align-content-center{align-content:center}.align-items-center{align-items:center}.space-between{justify-content:space-between}.space-around{justify-content:space-around}.flex-wrap{flex-wrap:wrap}.flex-nowrap{flex-wrap:nowrap}.d-block{display:block}.d-table{display:table}.d-flex{display:flex}.d-flex-row{flex-direction:row}.d-flex-column{flex-direction:column}.gap-10{gap:10px}.space-between{justify-content:space-between}.flex-nowrap{flex-wrap:nowrap}.blue-dark{color:var(--fk-teal-ink)}.blue-light{color:var(--fk-teal-ink)}.bg-blue-dark{background:var(--fk-teal)}.bg-blue-light{background:var(--fk-teal)}.color-white{color:var(--fk-navy)}.align-center{text-align:center}.align-right{text-align:right}.align-left{text-align:left}.align-justify{text-align:justify}.rtl{direction:rtl}.ltr{direction:ltr}.gray-dark{color:var(--fk-navy)}.bg-gray-dark{background:var(--fk-cream)}.white{color:var(--fk-navy)}.bg-white{background:var(--fk-white)}.weight-bold{font-weight:900}.weight-medium{font-weight:500}.weight-light{font-weight:300}.weight-thin{font-weight:100}@media only screen and (max-width: 780px){#nav{z-index:10000}}@media only screen and (max-width: 900px){.navbar{border-radius:3px;transition:.1s;font-weight:bold;text-align:right;padding:20px;width:150px;transition:0;padding-top:100px}}#bg-header{position:absolute;bottom:0;left:0;right:0;width:100%}@media only screen and (max-width: 780px){#bpms-links{display:block}}@media only screen and (max-width: 780px){#erp-links{display:block}}@media only screen and (max-width: 780px){#crm-links{display:block}}@media only screen and (max-width: 780px){#bpms-item-sub{padding-bottom:0}}@media only screen and (max-width: 780px){#crm-item-sub{padding-bottom:0}}@media only screen and (max-width: 780px){#erp-item-sub{padding-bottom:0}}@media only screen and (max-width: 780px){.nav-link{position:relative}}@media only screen and (max-width: 780px){.c-public-submenu{position:relative;right:auto;width:100%;padding:0;height:auto;display:table}}@media only screen and (max-width: 780px){.c-public-submenu::before{position:relative}}@media only screen and (max-width: 780px){.c-a-links{float:none}}@media only screen and (max-width: 780px){.c-right-items{width:100%;display:table}}@media only screen and (max-width: 780px){.c-left-items{display:none !important;width:100%;height:auto;position:relative}.c-left-items .c-submenu-link{width:100%;height:40px;line-height:40px}}@media only screen and (max-width: 900px){.nav-item{min-height:40px;height:auto;border-radius:0;text-align:right;font-size:14px;font-weight:light}}.tglnav .navbar{transition:0}@media only screen and (max-width: 780px){.tglnav .navbar{position:fixed;top:0;right:0;width:250px;height:100%;transition:0;overflow-y:scroll;background:var(--fk-white)}}.c-text-box{position:relative;width:100%;height:auto;display:table}.text-box-content{position:relative;width:50%;height:auto;display:table;padding-top:50px;padding-bottom:50px;line-height:30px;left:0;right:0;margin:0 auto}.text-box-content p,.text-box-content span,.text-box-content table,.text-box-content tr,.text-box-content td{font-size:14px;color:var(--fk-navy)}.text-box-content h1{position:relative;text-align:center;margin-bottom:20px;color:var(--fk-navy);padding-bottom:20px}.line-bottom{position:absolute;left:0;right:0;margin:0 auto;bottom:0;width:120px;height:6px;border-radius:10px;background-color:var(--fk-teal)}.software-panel-link{position:absolute;right:0px;bottom:-50px;width:150px;height:28px;border-radius:30px;background-color:var(--fk-gold);line-height:28px;text-align:center;transition:.3s;background:var(--fk-gold);box-shadow:0px 0px 10px rgba(var(--fk-gold-rgb),0.5)}@media only screen and (max-width: 480px){.software-panel-link{width:110px;left:0;right:auto;bottom:-40px}}.software-panel-link:hover{box-shadow:0px 0px 15px -1px rgba(var(--fk-gold-rgb),0.5)}.software-panel-link a{font-size:11px;color:var(--fk-navy);font-family:"IranSans Bold"}.link{position:absolute;top:0;left:0;right:0;bottom:0;text-decoration:none}.c-software-app{position:relative;width:100%;height:auto;display:table;padding-top:50px;padding-bottom:50px}.c-software-content{position:relative;width:80%;left:0;right:0;margin:0 auto;display:flex}.c-software-sidebar{position:relative;width:200px;float:right;height:auto;display:table;padding:10px}.c-software-options{position:relative;width:100%;height:100%;border-radius:10px;background:var(--fk-teal);padding:15px}.software-option-item{position:relative;width:100%;height:30px;font-size:12px;color:var(--fk-navy);text-align:center;line-height:30px;margin-bottom:5px;border-radius:25px;box-sizing:content-box;transition:ease-out .1s;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none}.software-option-item:hover{background-color:var(--fk-cream-soft);color:var(--fk-navy)}.c-option-content{position:relative;width:82%;height:auto;display:table;float:right}.c-app-form{position:relative;width:300px;height:auto;left:0;right:0;margin:0 auto;padding:15px;border-radius:20px;background:var(--fk-teal);padding-bottom:20px}.app-form-content{position:relative;width:100%;height:100%}.app-form-header{position:relative;width:100%;height:40px;border-bottom:1px solid var(--fk-line-solid);line-height:28px;font-size:14px;text-align:center;margin-bottom:20px;color:var(--fk-navy)}.inp-app-form{position:relative;width:100%;height:40px;line-height:30px;background-color:var(--fk-white);color:var(--fk-navy);padding:15px;padding-top:15px;padding-bottom:15px;border:none;border-radius:5px;margin-bottom:10px;font-size:13.5px}.app-form-submit-btn{position:relative;width:100px;height:35px;line-height:32px;left:0;right:0;margin:0 auto;background:var(--fk-cream-soft);box-shadow:0px 0px 5px rgba(var(--fk-teal-rgb),0.22);border:none;border-radius:20px;text-align:center;font-size:13px;color:var(--fk-navy);cursor:pointer;font-family:"IranSans Black";margin-top:10px;transition:.1s;margin-bottom:10px}.app-form-submit-btn:hover{box-shadow:0px 0px 10px -1px rgba(var(--fk-teal-rgb),0.22)}.app-form-error{font-size:12px;color:var(--fk-muted);display:block}.c-option-content{position:relative;width:100%;height:auto;padding:15px}.p-detail-item{position:relative;width:100%;height:40px}.p-detail-item label{font-size:14px;color:dimgray;font-family:"IranSans Bold";width:150px;display:inline-block}.p-detail-item span{font-size:13px;color:var(--fk-navy)}.app-options__submenu{position:relative;width:100%;height:auto;display:table;border:1px solid var(--fk-line-solid);border-radius:5px;margin-bottom:5px;overflow:hidden}.app-options__submenu-item{position:relative;width:100%;height:30px;line-height:30px;text-align:center;font-size:12px;box-sizing:content-box;color:var(--fk-navy);cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none}.app-options__submenu-item:hover{color:var(--fk-navy);background-color:var(--fk-cream-soft)}.h-submenu{margin-bottom:5px}.active-option-app{background-color:var(--fk-cream-soft);color:var(--fk-navy)}.c-services-part{position:relative;left:0;right:0;width:100%;height:700px;background-color:var(--fk-white);border:1px solid var(--fk-line-solid);top:0}@media only screen and (max-width: 780px){.c-services-part{margin-top:0;top:0}}@media only screen and (max-width: 480px){.c-services-part{margin-top:0;top:0}}.c-video-part{margin-top:0px;top:0}@media only screen and (max-width: 480px){.c-video-part{top:0;margin-top:0}}.c-customer-comments{top:0;margin-bottom:0}.app-header{position:relative;top:0;width:100%;height:70px;box-shadow:0px 0px 10px rgba(var(--fk-teal-rgb),0.22)}.app-header-contents{position:relative;width:80%;height:100%;left:0;right:0;margin:0 auto;line-height:70px}.app-header-name{font-size:12px;color:var(--fk-navy);margin-right:10px;position:absolute;right:60px;top:0}.app-header-profile-icon{position:absolute;right:10px;top:17px;width:37px;height:37px;border-radius:50%;border:1px solid var(--fk-line-solid)}.c-app-table{position:relative;width:100%;height:600px;overflow-x:scroll;border:1px solid var(--fk-line-solid);border-radius:10px}.c-app-table table{border-spacing:unset}.c-app-table th{position:relative;text-align:center;width:auto;font-size:14px;color:var(--fk-navy);padding-right:10px;padding-left:10px;padding-top:10px;padding-bottom:10px;white-space:nowrap;cursor:pointer}.c-app-table th span{width:auto}.c-app-table tr:nth-child(even){background-color:var(--fk-cream-soft)}.c-app-table tr td{position:relative;text-align:center;font-size:12px;padding:10px;white-space:nowrap}.app-table{position:absolute;display:flex;right:0;left:auto;top:0;bottom:auto;border-radius:10px}.app-thead{position:sticky;top:0;background-color:rgba(var(--fk-navy-rgb),0.06);z-index:100}.app-thead th,.app-thead td{color:var(--fk-navy)}#sticky-table-header{border-bottom:2px solid var(--fk-line-solid)}.hr-list{height:2px}.active-sort{position:absolute;top:0;left:0;right:0;bottom:0;background:var(--fk-teal);color:var(--fk-white);line-height:38px}.c-support-page{position:relative;width:100%;height:auto;display:table}.support-page{position:relative;width:82%;height:400px;left:0;right:0;margin:0 auto}@media only screen and (max-width: 480px){.support-page{width:100%}}.support-page-sidebar{position:relative;width:50%;float:right;padding:50px}@media only screen and (max-width: 480px){.support-page-sidebar{width:100%;padding:5px}}.lbl-support{display:block;margin-bottom:5px}.inp-support{position:relative;width:100%;padding:10px;border:none;border:1px solid var(--fk-line-solid);border-radius:5px;margin-bottom:10px;background:var(--fk-cream-soft)}.inp-support:focus{background:var(--fk-white)}.c-public-submenu{display:none;height:auto}.c-submenu-content{height:450px;opacity:0;visibility:hidden}.p-menu{position:relative;width:900px;height:500px;background:var(--fk-white);border-radius:10px;top:40px;display:none;padding:20px;direction:rtl;text-align:right}@media only screen and (max-width: 1400px){.p-menu{width:800px;height:500px}}@media only screen and (max-width: 1300px){.p-menu{width:700px}}@media only screen and (max-width: 1200px){.p-menu{width:650px;height:600px}}@media only screen and (max-width: 1100px){.p-menu{width:600px;height:700px}}@media only screen and (max-width: 1000px){.p-menu{width:200px;height:400px;padding-bottom:20px;overflow-y:scroll;background:var(--fk-cream-soft);top:0;padding:5px;margin-bottom:10px}}.p-menu ul{height:100%;flex-direction:column;display:flex;flex-wrap:wrap}@media only screen and (max-width: 1000px){.p-menu ul{width:100%;flex-wrap:nowrap}}.p-menu ul li{display:flex;flex-grow:1;padding:5px;padding-right:0;max-height:35px !important;padding-bottom:0}.p-menu ul li a{height:30px !important;font-weight:bold;padding-right:0;color:var(--fk-err)}.p-menu ul a{text-decoration:none;font-size:14px;text-decoration:none;color:var(--fk-navy);padding-right:10px;padding-left:3px}@media only screen and (max-width: 1200px){.p-menu ul a{font-size:12px}}.p-menu ul a:hover{color:var(--fk-teal-ink)}.c-pricing-list{position:relative;width:100%;height:auto;display:table}@media only screen and (max-width: 1000px){.c-pricing-list{height:auto}}.c-price-items{width:50%;float:right;height:100%;padding:5px}@media only screen and (max-width: 1000px){.c-price-items{width:100%}}.price-item-right{width:50%}@media only screen and (max-width: 1000px){.price-item-right{width:100%}}.price-item-left{width:50%}@media only screen and (max-width: 1000px){.price-item-left{width:100%}}.price-lbl-box{width:100%;display:flex;line-height:40px;background:rgba(var(--fk-navy-rgb),0.05);border-radius:10px;padding:10px;padding-top:0;padding-bottom:0;height:auto;margin-bottom:5px;justify-content:space-between;flex-wrap:wrap}.price-lbl-box input{margin-left:5px}.pricing-item-title{padding:10px;background:var(--fk-white);display:block;width:100%;color:var(--fk-navy);margin-bottom:10px}.c-final-price{position:fixed;bottom:0;width:100%;text-align:center;z-index:1000;left:0;right:0;height:50px}.total-p{background:var(--fk-cream-soft);border-radius:10px;padding-top:5px;padding-bottom:5px;width:300px}.p-s-head a{font-size:14px;text-decoration:none;color:var(--fk-navy);display:flex;flex-grow:1}.p-s-head a:hover{color:var(--fk-teal-ink)}.nav-item:hover .p-menu{display:block}.nav-item:hover .c-public-submenu{display:block}.nav-item:hover .c-submenu-content{visibility:visible;opacity:1}.navbar-frontend{background:var(--fk-teal);background:var(--fk-teal)}.index-header{position:relative;width:100%;height:100px;z-index:2}.c-whatsapp-box{position:fixed;right:20px;bottom:20px;width:250px;height:60px;z-index:1000000}.c-wa-button{position:relative;display:flex;width:100%;height:100%}.c-circle-wa{position:relative;width:50px;height:50px;border-radius:50%;overflow:hidden;background:var(--fk-teal);box-shadow:0 6px 8px -2px rgba(var(--fk-teal-rgb),0.22);float:right;margin-left:10px;cursor:pointer}.c-circle-wa center img{position:relative;width:35px;height:auto;-o-object-fit:contain;object-fit:contain;top:6px}.wa-btn-caption{position:relative;height:55px;padding:10px;width:75%;float:right;background:var(--fk-cream-soft);color:var(--fk-navy);font-size:12px;padding-right:15px;padding-top:9px;border-radius:5px;cursor:pointer;visibility:visible;opacity:1;top:0;transition:.3s}.wa-btn-caption span{font-weight:bold;top:0;position:relative}.tglwa .wa-btn-caption{top:200px;visibility:hidden;opacity:0}.wa-chat-box{position:absolute;bottom:-100px;width:350px;height:280px;box-shadow:0px 5px 5px -2px rgba(var(--fk-teal-rgb),0.22);border-radius:5px;background:var(--fk-white);padding:30px;padding-top:0;padding-right:0;padding-left:0;overflow:hidden;visibility:hidden;opacity:0;transition:.3s}@media only screen and (max-width: 480px){.wa-chat-box{width:310px}}.tglwa .wa-chat-box{visibility:visible;opacity:1;bottom:70px}.wa-chat-header{position:relative;width:100%;height:110px;background:var(--fk-teal);padding:20px;color:var(--fk-white)}.wa-header-title{font-size:18px;margin-bottom:10px}.wa-header-des{font-size:12.5px;color:var(--fk-muted);line-height:20px;width:80%}@media only screen and (max-width: 480px){.wa-header-des{width:95%}}.wa-chat-box-main{position:relative;width:100%;height:auto;padding:20px}.wa-sub-des{color:var(--fk-muted);margin-bottom:20px;position:relative;display:block;font-size:12px}.wa-box-item{position:relative;width:100%;height:70px;background:var(--fk-cream-soft);border-radius:3px;border-right:2px solid rgba(var(--fk-teal-rgb),0.5);margin-bottom:15px;cursor:pointer;transition:.3s}.wa-box-item a{text-decoration:none}.wa-box-item:hover{background:var(--fk-white);box-shadow:0px 5px 5px -2px rgba(var(--fk-teal-rgb),0.22)}.wa-icon-img-item{position:relative;width:50px;float:right;height:100%;padding-top:10px;padding-right:5px}.wa-box-item-name{position:relative;right:10px;top:10px;line-height:1.5;font-size:15px;color:var(--fk-navy);padding-top:4px}.wa-box-item-sub-name{display:block;color:var(--fk-muted);font-size:11.5px}.c-services-part{height:auto}@media only screen and (max-width: 780px){.c-services-part{width:100%}}@media only screen and (max-width: 480px){.c-services-part{width:100%}}.service-item{margin-bottom:50px}@media only screen and (max-width: 780px){.service-item{width:300px}}.c-service-boxes{position:relative;width:100%;margin:0 auto;height:auto;display:table;margin-top:150px}.c-service-items{width:100%;height:100%}.service-item{position:relative;width:250px;height:100%;float:right;padding-bottom:0;transform:scale(0.9)}.main-service-item{position:relative;width:100%;height:100%;background-color:var(--fk-white);border-radius:15px;box-shadow:0px 0px 35px rgba(var(--fk-teal-rgb),0.22);padding:20px;text-align:center;transition:.4s;bottom:0}.main-service-item:hover{bottom:20px;box-shadow:0px 0px 35px rgba(var(--fk-teal-rgb),0.22)}.bg-header-box{border:1px solid var(--fk-line-solid);position:relative}.bg-header-box img{height:500px;width:100%;position:absolute;left:0;right:0;border:1px solid var(--fk-line-solid)}.c-product-icon{height:60%;overflow:visible}.c-submenu-content{transition:.1s;display:none}.tglsubmenu .c-submenu-content{display:block}.tglsubmenu-click .c-submenu-content{display:block}.tglnav .bg-black-bar-nav{display:none}@media only screen and (max-width: 780px){.tglnav .bg-black-bar-nav{position:fixed;top:0;right:0;left:0;bottom:0;background:var(--fk-cream);opacity:.5;z-index:-1;display:block}}@media only screen and (max-width: 780px){.c-submenu-content{position:relative;right:auto;top:20px}}@media only screen and (max-width: 780px){.erp-item-sub{padding-bottom:0}}@media only screen and (max-width: 780px){#webpstyle{display:none}}#mobilepstyle{display:none}@media only screen and (max-width: 780px){#mobilepstyle{display:block}}.auth-form{position:relative;width:500px;padding:30px;padding-bottom:70px;left:0;right:0;margin:0 auto;z-index:1000;border-radius:5px}@media only screen and (max-width: 1000px){.auth-form{width:100%}}.auth-input{height:60px;border:1px solid var(--fk-line-solid);border-radius:5px;background:var(--fk-cream-soft);font-size:20px;text-align:center;margin-top:5px;margin-bottom:10px}.auth-input:focus{background:var(--fk-cream-soft);border:3px solid rgba(var(--fk-navy-rgb),0.2)}.auth-btn{height:60px;padding:10px;border-radius:8px;outline:none;transition:.1s;border:none;color:var(--fk-gold-ink)}.auth-btn:hover{background:var(--fk-white)}.hr{height:1px;border-top:1px solid var(--fk-line-solid);margin-top:30px;margin-bottom:20px}.form-title{font-family:"IranSans black";color:var(--fk-navy);font-size:18px}.btn-resend{position:relative;display:block;width:100px;height:30px;background:var(--fk-teal);border-radius:3px;color:var(--fk-white);cursor:pointer}.btn-resend:hover{background:var(--fk-white)}.btn-sm-form{position:relative;width:auto;height:30px;font-size:12px;background:var(--fk-cream-soft);color:var(--fk-navy);border-radius:3px;left:0;right:0;margin:0 auto;display:inline-block;text-align:center;padding-right:3px;padding-left:3px;line-height:30px;cursor:pointer;margin-top:10px}.btn-sm-form:hover{color:var(--fk-teal-ink)}.c-des-box{width:100%;display:flex;text-align:center;justify-content:center;justify-items:center}@media only screen and (max-width: 780px){.c-des-box{display:table}}.outer-box{position:relative;padding:10px;float:right;display:table;max-width:33.33%;min-width:33.33%}@media only screen and (max-width: 780px){.outer-box{min-width:100%;max-width:100%}}.blue-box-des{position:relative;min-width:100%;border-radius:10px;min-height:240px;background:var(--fk-teal);padding:20px;box-shadow:0px 20px 20px -15px rgba(var(--fk-navy-rgb),0.16)}.yellow-box-des{position:relative;min-width:100%;border-radius:10px;min-height:240px;background:var(--fk-gold);padding:20px;box-shadow:0px 20px 20px -15px rgba(var(--fk-navy-rgb),0.16);margin-top:30px}@media only screen and (max-width: 780px){.yellow-box-des{margin-top:0}}.red-box-des{position:relative;min-width:100%;border-radius:10px;min-height:240px;background:var(--fk-err);padding:20px;box-shadow:0px 20px 20px -15px rgba(var(--fk-navy-rgb),0.16);margin-top:30px;color:var(--fk-navy)}@media only screen and (max-width: 780px){.red-box-des{margin-top:0}}.c-pro-cat{height:240px}.img-thumbnail{float:left;width:60%;height:auto;padding-right:20px}@media only screen and (max-width: 780px){.img-thumbnail{width:100%;padding-right:0}}.carousel-box-item{width:100%;height:250px;display:inline-block;border:1px solid var(--fk-line-solid);border-radius:10px;overflow:hidden;transition:.3s}.carousel-box-item a{text-decoration:none;color:var(--fk-navy);font-size:13px}.carousel-box-item a:hover{color:var(--fk-teal-ink)}.carousel-box-item h3{padding-right:10px;padding-left:10px}.box-item-slider-img{width:100%;height:180px}.box-item-slider-img img{width:100%;height:auto;-o-object-fit:cover;object-fit:cover;-o-object-position:center;object-position:center}.owl-item{display:inline-block !important}.d-padding{padding-top:30px;padding-bottom:30px}.owl-stage-outer{overflow:hidden}.c-cart-count{width:30px;position:absolute;top:18px;left:130px}@media only screen and (max-width: 700px){.c-cart-count{left:0;right:0;margin:0 auto}}.price-detail-box{background:var(--fk-cream-soft);border:1px solid rgba(var(--fk-navy-rgb),0.18);padding:10px;border-radius:14px}.preview-order{position:relative;background:var(--fk-cream-soft);width:350px;border:1px solid rgba(var(--fk-navy-rgb),0.18);border-radius:18px;padding:18px;height:-moz-fit-content;height:fit-content;position:sticky;top:200px}@media only screen and (max-width: 780px){.preview-order{width:100%}}.pd-30{padding:30px}.pd-20{padding:12px}.square-sm{border-radius:5px;padding-right:4px;padding-left:4px;padding-top:1px;width:18px;height:18px;font-size:13.5px}.square-sm-images{position:absolute;right:30px;bottom:10px}.shopping-bag-item{border:1px solid rgba(var(--fk-navy-rgb),0.18);padding:15px;border-radius:12px;min-height:120px}.shopping-bag-image{width:200px;height:100px;-o-object-fit:cover;object-fit:cover;margin-right:10px;-o-object-position:center;object-position:center}.count-changer{border:1px solid rgba(var(--fk-navy-rgb),0.18);border-radius:6px;padding:1px 5px;padding-top:3px}.plus-btn{cursor:pointer;font-size:20px}.minus-btn{cursor:pointer;font-size:20px}.custom-radio-btn{width:18px;height:18px;border-radius:50%;outline:1px solid rgba(var(--fk-navy-rgb),0.18);border:3px solid var(--fk-line-solid);background:var(--fk-white)}.date-text{word-spacing:10px}.color-gray-tab{color:var(--fk-muted) !important}.py-25{padding-top:25px;padding-bottom:25px}.detail-box-p{width:600px;border:1px solid rgba(var(--fk-navy-rgb),0.2);background:var(--fk-cream-soft);padding:25px 20px;border-radius:20px}@media only screen and (max-width: 700px){.detail-box-p{width:100%}}.color-gray-field{color:var(--fk-muted)}.d-field{font-size:18px !important}.paralax-contact{background-attachment:fixed;background-position:center;background-size:cover;background-repeat:no-repeat;height:100vh;overflow:hidden}@media only screen and (max-width: 700px){.paralax-contact{height:70vh}}.align-items-center{align-items:center}.c-contact-head{padding-top:90px;padding-right:7vw;position:fixed;top:20vh}@media only screen and (max-width: 700px){.c-contact-head{top:10vh}}a{text-decoration:none}.contact-form-container{border-bottom:1px solid var(--fk-line-solid)}.c-contact-form{padding:80px 170px;width:50vw}@media only screen and (max-width: 700px){.c-contact-form{width:100%;padding:10px;padding-top:50px;padding-bottom:50px}}.custom-attach-inp{border:1px dashed var(--fk-line-solid);height:100px;border-radius:12px;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;overflow:hidden}.custom-attach-inp:hover .contain-box{opacity:.3}.attach-icon{-webkit-user-select:none !important;-moz-user-select:none !important;user-select:none !important;user-drag:none}.inp-contact{background:none;border:none;outline:none;border-bottom:1px solid var(--fk-line-solid);color:var(--fk-navy);padding-bottom:7px}.inp-contact::-moz-placeholder{color:var(--fk-muted)}.inp-contact::placeholder{color:var(--fk-muted)}.contain-box{position:absolute;top:0;left:0;right:0;bottom:0;background:var(--fk-white);opacity:0;z-index:2;transition:.3s}.img-message{border-radius:12px;height:100px;min-width:100px !important}.custom-contact-btn{width:125px;height:27px;background:var(--fk-teal);border-radius:8px;font-size:14px;cursor:pointer;transition:.3s}.custom-contact-btn:hover{background:var(--fk-teal-dark);color:var(--fk-cream)}.profile-option-item:hover{background:var(--fk-teal-dark)}.active-profile-option{background:var(--fk-teal)}.bg-primary{background:var(--fk-teal) !important}.pd-9{padding:9px}.pd-bottom-10{padding-bottom:10px !important}.radius-9{border-radius:9px}.cursor-pointer{cursor:pointer}.order-btn{transition:.3s}.text-right{text-align:right}.text-left{text-align:left}.shadow-none{text-shadow:none !important;box-shadow:none !important}/*# sourceMappingURL=main.min.css.map */