@font-face{

    font-family: vazir;

    src:url('../fonts/Vazir.ttf');

}

@font-face{

    font-family: vazirbold;

    src:url('../fonts/Vazir-Bold.ttf');

}



html,body{

    font-family: vazir;
    background-color: #f5f5f5 !important;
    outline: none !important;

}

#preloader {

    position: fixed;

    width: 100%;

    height: 100%;

    z-index: 999999;

    flex-direction: column;

    justify-content: center;

    align-items: center;

}

a:hover{

    text-decoration: none;

}

.row{

    direction: rtl;

}



.header{

    background: white;

    padding: 10px;

    padding-bottom: 0px;

    position: fixed;

    top: 0px;

    width: 100%;

    z-index: 9900;

    box-shadow: 0 2px 4px 0 rgba(0,0,0,.1);

}

.web-name{

    font-family: vazirbold;

    color: #4dc488;

    text-align: right;

    display: flex;

    align-items: center;

    justify-content: start;

    font-size: 25px;

}

.search{

    width: 100%;

    border: none;

    background: #dfdfdf;

    color: dimgray;

    padding: 17px;

    padding-top: 7px;

    padding-bottom: 7px;

    border-radius: 50px;

    font-size: 14px;

    margin-right:19px;
    outline: none;

}



.bascket{

    width: 45px;

    height: 35px;

    border-right: 1px solid #4a4a4a;

    display: flex;

    justify-content: center;

    align-items: center;

}

.bascket > span{

    color: #4dc488;

    font-size: 15px;

}



.login {

    color: #4a4a4a;

    font-size: 11px;

    border: 1px solid #4a4a4a;

    padding: 10px;

    border-radius: 55px;

    padding-top: 7px;

    padding-bottom: 7px;

    margin-left: 20px;

    transition: 0.3s;

}

.login:hover{

    color: #4dc488;

}



.login-sm {

    color: #4a4a4a;

    font-size: 16px;

    padding: 10px;

    border-radius: 55px;

    padding-top: 7px;

    padding-bottom: 7px;

    margin-left: 4px;

    transition: 0.3s;

    display: none;

}

.login-sm:hover{

    color: #4dc488;

}



.nav-ul > ul{

    list-style: none;

    padding-right: 0px;

    padding-top: 20px;

    height: 45px;

    margin-bottom: 0px;

}

.nav-mob{

    display:none;

    direction: rtl;

    text-align: right;

    padding-top: 5px;

    font-size: 23px;

    padding-right: 26px;

    padding-bottom: 5px;

}

.nav-mob > span{

    cursor: pointer;

}

@media (max-width:991px){

    .nav-ul > ul{

        display:none;

    }

    .nav-mob{

        display:block;

    }

}

.nav-ul > ul > li{

    float: right;

    padding-left: 20px;

    padding-bottom: 10px;

    font-size: 14px;

    transition: 0.3s;

}

.nav-ul > ul > li > a{

    display: flex;

    align-items: center;

    color: #4a4a4a;

    transition: 0.3s;

}

.nav-ul > ul > li > a:hover{

    color: #4dc488;

}



.product-nav{

    width:1100px;

    min-height: 510px;

    min-height: 510px;

    background: white;

    position: absolute;

    top:30px;

    padding: 0px;

    padding-right: 0px;

    border-bottom-right-radius: 6px;

    border-bottom-left-radius: 6px;

    display: none;

    justify-content: flex-start;

    border: 2px solid #dedede;

    border-top: none;

}

@media (max-width:1160px){

    .product-nav{

        width:900px;

    }

}

li:hover .product-nav{

    display:flex;

}

.product-list{

    width:25%;

    height: 100%;

    height: 510px;

    overflow-y: auto;

    direction: ltr;

    

}

.product-list> ul{

    padding-right: 0px;

    padding-left: 0px;

}

.product-list> ul > li{

    list-style: none;

    text-align: right;

    padding: 13px 8px;

    color: #4a4a4a;

    border-radius: 0 5px 5px 0;

    border-top: 1px solid #ffffff;

    border-bottom: 1px solid #ffffff;

    cursor: pointer;

    font-family: vazir;

    font-size: 14px;

    border-left: 1px solid #f0f0f1;

    transition: 0.3s;

}

//.product-list> ul > li:hover{

    background: #f9f9f9;

    color: #4dc488;

    border-top: 1px solid #f0f0f1;

    border-bottom: 1px solid #f0f0f1;

}



.sub-list{

    width: 100%;

    max-height: 510px;

}

.sub-list> ul{

    padding-right: 0px;

    padding-left: 0px;
    min-height: 100%;
    max-height: 100%;

    display: none;

    -webkit-box-orient: vertical;

    -webkit-box-direction: normal;

    -ms-flex-direction: column;

    flex-direction: column;

    -ms-flex-wrap: wrap;

    flex-wrap: wrap;

}

.sub-list > ul:nth-child(1){

    display: flex;

}

.sub-font{

    font-family: vazirbold !important;

    font-size: 16px !important;

}

.sub-font::after{

    //content: '\f104';

}

.sub-list> ul > li{

    list-style: none;

    text-align: right;

    padding: 6px 10px;

    color: #4a4a4a;

    cursor: pointer;

    font-family: vazir;

    font-size: 14px;

    display: inline-flex;

    align-items: center;

    justify-content: flex-start;

    max-width: 100%;

    overflow: hidden;

    text-overflow: ellipsis;

    min-width: 180px;

    transition: 0.3s;

}

.sub-list> ul > li > a{

    color: #4a4a4a;

    transition: 0.3s;

}

.sub-list> ul > li > a:hover{

    color: #4dc488;

}



@media (max-width:770px){

    .login{

        display: none;

    }

    .login-sm{

        display: inline-block;

    }

}

@media (max-width:575px){

    .search{

        display: none;

    }

    .login{

        display: inline-block;

    }

    .login-sm{

        display: none;

    }

}





.products{

    width: 100%;

    margin-bottom: 100px;

}



.product-title{

    width: 90%;

    border-bottom:2px solid #4a4a4a;

    text-align: center;

    position: relative;

    display: flex;

    justify-content: center;

    margin: auto;

}



.product-title > h2{

    border-bottom: 3px solid #4dc488;

    margin-bottom: 0px;

    padding-bottom: 10px;

    display: inline-block;

    font-size: 17px;

    position: absolute;

    bottom: -2px;

}



.product-slide{

    width:100%;

    margin-top: 20px;

    /*box-shadow: 4px 4px 11px 0px #b7b7b7;*/

    box-shadow: 0 2px 4px 0 rgba(0,0,0,.1);

    border:1px solid rgba(0,0,0,.1);
    background-color: white !important;
    border-radius:30px;

}



.section{

    padding-top: 20px;

    padding-bottom: 17px;

}



.price{

    text-align: left;

    padding-left: 20px;

    direction: rtl;

    color: #4dc488;

    font-family: vazirbold;

}



.owl-prev{

    position: absolute;

    left: 0px;

    top: 100px;

    margin: 0px !important;

    height: 51px;

    display: flex !important;

    align-items: center;

    box-shadow: 0 0 4px 0 rgba(0,0,0,.1);

    border:1px solid rgba(0,0,0,.1);

    border-left: none;

    border-radius: 0px !important;

    border-top-right-radius: 11px !important;

    border-bottom-right-radius: 11px !important;

    background: white !important;

    color: #999 !important;

    opacity: 1 !important;

}

.owl-next{

    position: absolute;

    right: 0px;

    top: 100px;

    margin: 0px !important;

    height: 51px;

    display: flex !important;

    align-items: center;

    box-shadow: 0 0 4px 0 rgba(0,0,0,.1);

    border:1px solid rgba(0,0,0,.1);

    border-right: none;

    border-radius: 0px !important;

    border-top-left-radius: 11px !important;

    border-bottom-left-radius: 11px !important;

    background: white !important;

    color: #999 !important;

    opacity: 1 !important;

}



.owl-theme .owl-controls {

    margin-top: 0px;

}



@media (max-width:1200px){

    .shop-box{

        max-width: 1075px !important;

    }

}



.more-btn{

    direction: ltr;

    text-align: right;

}



.more-btn > h2 > a{

    color: #4dc488;

    font-size: 17px;

    font-family: vazir;

    display: block;


    padding-right: 30px;
    padding-left: 30px;

    padding-bottom: 17px;
    text-align: right;
    direction: ltr;

}



.news-b{

    display: flex;

    justify-content: center;

    align-items: center;

}



.news-p{

    width:140px; 

    height:140px;

}



.slick-dots {

	text-align: center;

  margin: 0 0 10px 0;

  padding: 0;

  li {

    display:inline-block;

    margin-left: 4px;

    margin-right: 4px;

    &.slick-active {

      button {

        background-color:black;

      }

    }

    button {

      font: 0/0 a;

      text-shadow: none;

      color: transparent;

      background-color:#999;

      border:none;

      width: 15px;

      height: 15px;

      border-radius:50%;

    }

		:hover{

			background-color: black;

		}

  }

}



/* Custom Arrow */

.prev,.prev2{

	color: #999;

	position: absolute;

	top: 68px;

    left: -12px;

    font-size: 35px;

    color: white;

    cursor: pointer;

}

.next,.next2{

	color: #999;

	position: absolute;

	top: 68px;

    right: -12px;

    font-size: 35px;

    color: white;

    cursor: pointer;

}



@media screen and (max-width: 800px) {

    .next {

        //display: none !important;

    }

}



.blog{

    background: white !important;

    animation-delay: 400ms; 

    box-shadow: 0 2px 4px 0 rgba(0,0,0,.1);

    border:1px solid rgba(0,0,0,.1);

    border-radius: 21px; 

    visibility: visible;

    overflow: hidden;

    margin-top: 5px;

    margin-bottom: 5px;   

}



.factor-footer{

    width: 100%;

    height:auto;

    position: fixed;

    bottom: 0px;

    display: flex;

    direction: rtl;

    justify-content: space-between;

    align-items: center;

    padding: 20px;

    box-shadow: 0 -3px 4px 0 rgba(0,0,0,.1);

    background: white;
    z-index: 11000;
}



.price-footer{

    text-align: right;

}

.price-1{

    color:#2d2d2d;

    font-size: 20px;

    font-family: vazirbold;

    

}

.price-2{

    color:black;

    font-size: 13px;

    color:#4a4a4a;

    padding-top:15px;

}

.btn-factor{



}



.continue-btn{

    padding: 7px;

    padding-left: 20px;

    padding-right: 20px;

    background: #4dc488;

    border: 2px solid #4dc488;

    color: white;

    border-radius: 10px;

    width: 130px;

    display: inline-block;

    text-align: center;

    margin: 5px;

    transition: 0.3s;

}

.continue-btn:hover{

    color: white;

    background: #3e9d6d;

    border: 2px solid #3e9d6d;

}

.cancell-btn{

    padding: 7px;

    padding-left: 20px;

    padding-right: 20px;

    background: white;

    border: 2px solid #ff4e4e;

    color: #ff4e4e;

    border-radius: 10px;

    width: 130px;

    display: inline-block;

    text-align: center;

    margin: 5px;

    transition: 0.3s;

}

.cancell-btn:hover{

    color: white;

    border: 2px solid #ff4e4e;

    background:#ff4e4e ;

}

@media (max-width:900px){

    .price-1{

        font-size: 17px;

    }

    .price-2{

        font-size: 11px;

    }

}

@media (max-width:800px){

    .continue-btn , .cancell-btn{

        font-size: 11px;

    }

}

@media (max-width:500px){

    .factor-footer{

        padding-top: 15px;

        padding-bottom: 15px;

    }

    .price-1{

        font-size: 14px;

    }

    .price-2{

        font-size: 10px;

    }

    .continue-btn , .cancell-btn{

        font-size: 10px;

        width: 110px;

    }

}



table{

    text-align: center;

    font-family: vazir !important;

    box-shadow: 2px 2px 4px 0 rgba(0,0,0,.1);

}

table>thead{

    background:#4dc488;

    color: white;

    border-radius: 10px;

}

table>tbody{

    background:white;

    color:#4a4a4a;

    border-radius: 10px;

}



.offcanvas-product-box {

    position: relative;

    display: flex;

    align-items: center;

    min-width: 0;

    background-color: #fff;

    border-radius: 8px;

    box-shadow: 0 2px 4px 0 rgba(0,0,0,.1);

    border: 1px solid rgba(0,0,0,.1);

    padding: 16px;

    margin: 8px 0;

    overflow: hidden;

}

.offcanvas-product-box_delete {

    position: absolute;

    top: 0;

    left: 0;

    background-color: rgba(224,224,224,.12);

    width: 36px;

    height: 36px;

    display: flex;

    border: none;

    align-items: center;

    justify-content: center;

    border-bottom-right-radius: 15px;

    border-right: 1px solid #ff7979;

    color: #ff7979;

    border-bottom: 1px solid #ff7979;

    padding: 5px;

    transition: 0.3s;

}

.offcanvas-product-box_delete:hover {

    background-color:#ff7979;

    color: rgba(224,224,224);

}



.offcanvas-product-box_image {

    margin-left: 16px;

    width: 90px;

    height: 90px;

    overflow: hidden;

    display: flex;

    flex-shrink: 0;

}

.offcanvas-product-box_image img {

    width: 100%;

    height: 100%;

    overflow: hidden;

    object-fit: contain;

    border-radius: .3rem;

}

offcanvas-product-box_content {

    flex-grow: 1;

    flex-basis: auto;

    overflow: hidden;

}

.offcanvas-product-box_title {

    text-align: right;

    font-weight: normal;

    font-size: .75rem;

    overflow: hidden;

    line-height: 1.5;

}

.text-truncate {

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: normal;

}

.align-items-end {

    align-items: flex-end !important;

}

.justify-content-between {

    justify-content: space-between !important;

}

.d-flex {

    display: flex !important;

}

.offcanvas-product-box_price {

    display: -ms-flexbox;

    display: flex;

    flex-direction: column;

    -ms-flex-wrap: wrap;

    flex-wrap: wrap;

    justify-content: flex-start;

    align-items: flex-start;

}

.offcanvas-product-box_price .offcanvas-product-box_price-value {

    width: 100%;

    color: #4dc488;

    letter-spacing: 0;

    font-weight: normal;

    font-size: 1.25rem;

    padding-top: 10px;

    line-height: 1.2;

    text-align: right;

    margin-top: auto;

}

.offcanvas-product-box_price .offcanvas-product-box_price-currency {

    font-weight: normal;

    font-size: .75rem;

    line-height: 1.2;

}

.handle-counter{

    direction:ltr;

}



.mobile-nav{

    width:100%;

    padding:8px;

    height: auto;

    position: fixed;

    bottom: 0px;

    display: none;

    direction: rtl;

    justify-content: space-around;

    align-items: center;

    box-shadow: 0 -3px 4px 0 rgba(0,0,0,.1);

    background: white;
    z-index: 10000;
}

.mobile-nav > a{

    color:#4a4a4a;

    transition: 0.3s;

    display:flex;

    flex-direction: column;

    justify-content: space-between;

    align-items: center;

}

.mobile-nav > a:hover{

    color:#363636;

}

.mobile-nav > a > span{

    padding-top: 3px;

    font-size: 9px;



}

.mobile-nav > span{

    color:#4a4a4a;

    transition: 0.3s;

    display:flex;

    flex-direction: column;

    justify-content: space-between;

    align-items: center;

}

.mobile-nav > span:hover{

    color:#363636;

}

.mobile-nav > span > span{

    padding-top: 3px;

    font-size: 9px;



}

.search-pro{
    width:100%;
    padding: 10px;
    padding-bottom: 6px;
    padding-top: 6px;
    background-color: white;
    color:#4e4e4e;
    box-shadow: 0 2px 4px 0 rgba(0,0,0,.19);
    border: 1px solid rgba(0,0,0,.19);
    border-radius:8px;
    margin-bottom: 29px;
}

.filter-pro{
    width:100%;
    background-color: white;
    color:#4e4e4e;
    box-shadow: 0 2px 4px 0 rgba(0,0,0,.19);
    border: 1px solid rgba(0,0,0,.19);
    border-radius:8px;
    overflow: hidden;
    margin-bottom: 29px;
}
.filter-pro > ul{
    margin:0;
    list-style: none;
    padding: 0;
    display: flex;
    overflow: hidden;
}
.filter-pro > ul > li{
    border-left: 1px solid rgba(0,0,0,.19);
    padding: 0;
}
.filter-hover-1{
    color: rgba(0,0,0,.53) !important;
    cursor: text;
    text-align: center;
    padding: 10px;
    cursor: text !important;
    font-size: 11px;
    background: white !important;
    border: none;
    width: 100%;
    
}
.filter-hover{
    transition: 0.3s;
    text-align: center;
    padding: 10px;
    cursor: pointer;
    font-size: 11px;
    background: white;
    border: none;
    width: 100%;
}
.filter-hover:hover{
    background: #4dc488;
    color: white;
    transition: 0.3s;
}
.filter-area{
    width: 100%;
    height: 338px;
    box-shadow: 0 2px 4px 0 rgba(0,0,0,.19);
    border: 1px solid rgba(0,0,0,.19);
    border-radius:8px;
    overflow-x: hidden;
    overflow-y: hidden;
    margin-bottom: 29px;
    background: white;
    display: inline-flex;
    flex-direction: column;
    
}
.filter-head{
    width: 100%;
    padding: 10px;
    text-align: center;
    color: white;
    background: #4dc488;
    font-size: 13px;
}
.product-area{
    width: 100%;
    box-shadow: 0 2px 4px 0 rgba(0,0,0,.19);
    border: 1px solid rgba(0,0,0,.19);
    border-radius:8px;
    overflow: hidden;
    margin-bottom: 29px;
    background: white;
}
.filter-mobile{
    width: 100%;
    display: none;

    padding-left: 5px;
    margin-bottom: 30px;
}
.filter-1{
    padding: 5px 11px;
    text-align: center;
    background: #dfdfdf;
    color: #424242;
    margin-left: 20px;
    border-radius: 7px;
    font-size: 13px;
    cursor: pointer;
}
.filter-1 > i{
    padding-right: 6px;
}

.product-box{
    border: 1px solid #ebebeb;
    z-index: 1;
    transition: 0.3s;
    padding: 0;
}
.product-box:hover{
    z-index: 2;
    box-shadow: 0 2px 17px 0 rgba(0,0,0,.09);
}

@media (max-width:991.5px){
    .filter-pro{
        display: none;
    }
    .main-filter{
        display: none;
        position: fixed;
        width: 100%;
        margin: 0px;
        top: 0px;
        z-index: 10000000;
        right: 0px;
        background: white;
        padding: 20px;
        overflow-y: scroll;
        height: 100vh;
        direction: ltr;
    }
    .filter-mobile{
        display:flex;
    }
}


#filter-back{
    display:none;
    width:100%;
    height:100vh;
    position:fixed;
    top:0px;
    background:#000000bd;
    z-index:1000;
}
#filter-box{
    width:400px;
    height:100vh;
    position:fixed;
    top:0px;
    right:0px;
    background:white;
    z-index:1001;
    overflow-x:hidden;
    overflow-y:auto;
    z-index: 9999;
}
#filter-btn{
    width:60px; 
    height:60px; 
    background:#82ae46;
    font-size:32px;
    position:fixed;
    bottom:20px;
    right:20px;
    border-radius:100%;
    color:white;
    cursor:pointer;
    display:flex;
    justify-content:center;
    align-items:center;
    z-index: 999;
}
#filter-rem{
    font-size:32px;
    position:fixed;
    top:5px;
    left:16px;
    color:red;
    cursor:pointer;
    z-index: 1002;
    display: none;
}
.main-ul {
    color: black;
    list-style: none;
    padding-right: 0px;
    cursor:pointer;
}
.main-li {
    width: 100%;
    border-bottom: 1px solid black;
    padding: 13px;
    font-weight: bold;
    display:block;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.sub-ul{
    list-style: none;
    padding-right: 0px;
    display: none;
    padding:10px;
    padding-top: 0px;
    padding-bottom: 0px;
    width: 100% !important;
}
.sub-li{
    width: 100%;
    border-bottom: 1px solid gray;
    padding: 13px;
    font-weight: normal;
    display: block;
    color: dimgray;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
@media (max-width: 768px) {
    #filter-box {
       width:100% !important;
    }
    #filter-back {
        display: none !important;
     }

     .cont-us{
        display: none !important;
     }
}

.address-check{
    border-bottom: 2px solid #4dc488;
    padding-bottom: 9px;
    display: inline-block;
    margin-bottom: 5px;
}
.address-select {
    width: 100%;
    direction: rtl;
    text-align: right;
    padding-top: 5px;
    border-bottom: 1px solid #dfdfdf;
    padding-bottom: 5px;
}

.order-count {
    position: absolute;
    background: #4dc488;
    border: 2px solid #f6f6f6;
    border-radius: 100%;
    width: 20px;
    height: 20px;
    font-size: 11px;
    font-weight: bold;
    display: flex;
    justify-content: center;
    align-items: center;
    top: -4px;
    right: 0px;
    color: white;
}


.footer{
	background-color: #e0e0e0;
	padding:50px;
	padding-bottom:20px;
	box-sizing:border-box;
	color: #4dc488 !important;
    font-family:vazir;
}

.clock{
	text-align:right;
	font-family:vazir;
	color:black;
	direction:rtl;
}
.clock > ul > li{
	font-size:15px;
	list-style: none;
    color: #4b4b4b;
    padding-bottom:10px;
}
.clock > h5{
    font-size:15px;
	font-family:vazir;
	color: #4a5f73;
    font-weight:bold;
    padding-bottom:10px;
}
.clock > ul > li > a{
	transition:0.3s;
	color: #4b4b4b;
    
}
.clock > ul > li > a:hover{
	color: #4dc488;
}

.color-clock{
	color:#4dc488;
	/*! font-weight: bold; */
}
.time{
	text-align:left;
}
.messenger{
	direction:rtl;
	color:#4dc488;
	font-family:vazir;
	padding:20px;
	box-sizing:border-box;
	border-top:2px solid #4dc488;
}
.message-footer > a > i{
	padding-left:15px;
	padding-right:15px;
	font-size: 27px;
	transition:0.3s;
	color: white;
}
.message-footer > a > i:hover{
	color:#4dc488;

}
.copyright{
	padding:20px;
	font-family:vazir;
	background:#e0e0e0;
	color:black;
	font-size:20px;
	padding-bottom: 15px;
    border-top:3px solid whitesmoke;
}

@media (max-width:800px){
    .footer{
        padding:30px;
        padding-bottom:20px;
    }
}

.search-area{
    width: 100%;
    height:100vh;
    position: fixed;
    top: 0px;
    left: 0px;
    background: white;
    display:none;
    padding: 20px;;
    z-index: 190000;
    overflow-y: auto;
}

.mob-search-input{
    width:100%;
    height:70px;
    position: fixed;
    left: 0px;
    top: 0px;
    padding-right: 20px;
    padding-left: 20px;
    
}

.mob-search-input > input{
    width:100%;
    height:100%;
    background: transparent;
    border: none;
    outline: none;
    border-bottom:1px solid #d8d8d8;
    transition: 0.3s;
    text-align: right;
    font-family: vazir;
    padding-right: 20px;
    padding-left: 20px;
    direction: rtl;
    color: #040d1a;
    background: white;
}
.mob-search-input > input:focus{
    border-bottom:1px solid #4dc488;
}

#saerch-2{
    display:none;
    position: absolute;
    left: 23px;
    top: 18px;
    color: #4dc488;
    font-size: 20px;
    cursor: pointer;
}

#close-search{
    position: absolute;
    left: 32px;
    top: 23px;
    font-size: 25px;
    color: gray;
    cursor: pointer;
}

.product-name-search {
    direction: rtl;
    text-align: right;
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 15px;
    margin-bottom: 15px;
    border-bottom: 1px solid #d8d8d8;
}
.product-name-search > a{
    color: #4a4a4a;
    font-size: 15px;
}

@media (max-width:800px){
    .product-name-search > a{
        font-size: 12px;
    }
}