/*
Theme Name: SakhtoEjra

Adding support for languages written in a Right To Left (RTL) direction is easy,
it's just a matter of overwriting all the horizontal positioning attributes
of your CSS stylesheet in a separate stylesheet file named rtl.css.

https://codex.wordpress.org/Right-to-Left_Language_Support
*/
/*========================|Base Setting|=================================*/

@font-face {
	font-family: Sakht;
	font-style: normal;
	font-weight: normal;
	font-display:swap;
	src: url('fonts/IRANSansWeb(FaNum).eot');
	src: url('fonts/IRANSansWeb(FaNum).eot?#iefix') format('embedded-opentype'),  
		 url('fonts/IRANSansWeb(FaNum).woff2') format('woff2'),
		 url('fonts/IRANSansWeb(FaNum).woff') format('woff'),
		 url('fonts/IRANSansWeb(FaNum).ttf') format('truetype');
}

@font-face {
	font-family: kalameh;
	font-style: normal;
	font-weight: normal;
	font-display:swap;
	src: url('fonts/KalamehWebFaNumBold.woff2') format('woff2'),
		 url('fonts/KalamehWebFaNumBold.woff') format('woff'),
		 url('fonts/KalamehWebFaNumBold.ttf') format('truetype');
}

html {scroll-behavior: smooth;}

html, body, div, span, object, iframe, blockquote, pre, a, abbr, address, cite, code, del, dfn, em, 
img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, hr, 
dl, dt, dd, ol, ul, li, fieldset, form, label, legend, 
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figure, figcaption, hgroup, 
menu, footer, header, nav, section, summary, time, mark, audio, video, 
button, input, textarea, ::placeholder{
	margin: 0;
	padding: 0;
	border: 0;
	vertical-align: baseline;
	font-size: 100%;
	font-family: Sakht, sans-serif;
  	color:#111;
}

body{
	direction: rtl;
  	unicode-bidi: embed;
}

th{text-align: right;}
img,video {height: auto;max-width: 100%;}

a, a:active, a:focus {
   outline: none;
}

:root {
  --Main_color: #296fdd; /*#f9b535;*/
  --Active_btn:#1fb04f;
}

a:active{user-select:none !important;}
.screen-reader-text{ display:none; }

.wp-video{margin:auto;}



/*========================|Top Bar|========================*/
.top-bar-content{
  display: grid; grid-template-columns: 1fr max-content;
  padding: 0px 5%; margin: auto;
  background:#434343; color:#fff;
  align-items: center; min-height: 40px;
}

.top-bar-content a{color:#fff;}
.top-bar-left{text-align:left}
.top-bar-left img{filter:invert(1); user-select: none;}

.top-bar-bag{
  display: block; position: relative;
  top: 3px; user-select: none;
}
.top-bar-bag a{position: relative;}
.top-bar-bag span{
	position: absolute; font-size: 11px;
	bottom: 3px; right: -7px;
	width: 20px; height: 16px;
	background: var(--Main_color); color: #fff;
  	text-align: center;
	border-radius: 3px;
    line-height: 1.6;
  	z-index:1;
}

.top-bar-content div:first-child ul{
  list-style: none; display: flex;
  grid-gap: 20px; font-size:12px;
}

@media(max-width:480px){
  
}

@media(max-width:920px){
  .top-bar-content{padding: 0px 15px; display:none}
  .menu-info-sakhtoejra-container{display:none;}
  .top-brand-content{border-top:5px solid #464646;}
}

/*=====================|Logo Brand|========================*/

.top-brand-content{
  display: grid; grid-template-columns: 1fr max-content;
  padding: 0px 5%; margin: auto;
  align-items: center; height: 100px;
  border-bottom: 1px solid #ddd;
  position: relative;
}

@media(max-width:920px){
  .top-brand-content{
    border-bottom: 2px solid #ddd;
  }
}

.site-branding a {
	transition: opacity 0.2s;
	text-decoration: none;
	user-select:none;
  	display: inline-flex;
  	outline: none; 
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}
.site-branding a:hover,
.site-branding a:focus {opacity: 0.85;}
.site-branding a img {
  position: relative;
  user-select:none;
  object-fit:contain;
  height:100%;
}

.site-title, .site-description, .site-title a{
  font-size:0px;
  color:transparent;
}

.login-btn{
  display: grid; grid-template-columns: max-content 1fr;
  grid-gap: 10px; padding: 7px 10px;
  border-radius: 5px; align-items: center;
  background:#fff; 
  color:#var(--Main_color);
  border:2px solid #ccc; color:#717171;
  max-width:220px; cursor: pointer;
  user-select:none;
}
.login-btn:active{background:#f5f5f5}
.login-btn span, .login-menu:hover{color:inherit;}
.login-btn svg{color:inherit;}


.login-menu{
  display: grid; grid-template-columns: max-content 1fr;
  grid-gap: 10px; padding: 7px 10px;
  border-radius: 5px; align-items: center;
  border:2px solid #ccc; color:#fff;
  width: fit-content;
  min-width:220px; cursor: pointer;
  user-select:none;
}
.login-menu span:first-child{
  display: grid; align-items: center;
  padding: 3px 3px 3px 10px; margin-left: 5px;
  border-left: 1px solid #ddd; position:relative;
 }
.login-menu svg{color:#464646;}

/*------|Profile Menu top bar|------*/

#profile-menu-bar{position:relative;}

.Profile-Dropdown{
  display: none; position: absolute;
  margin-top: 10px;
  z-index: 9; background: #fff;  
  border-radius: 5px;
  width: 100%; 
  box-shadow: 0px 0px 4px #464646a8, 0px 19px 20px -15px #37373796;
  list-style: none; padding: 10px 0px;
  box-sizing: border-box;
}

.Profile-Dropdown li:hover{background:#f7f7f7;}
.Profile-Dropdown li a{
  padding:5px 15px;
  font-size: 15px;
  display:block;
}

.Profile-Dropdown li:nth-child(1) a::before{
  content: "☳"; font-size: 20px;
  position: relative; top: 2px;
  margin-left: 10px;
}

.Profile-Dropdown li:nth-child(2) a::before{
  content: "⌭"; font-size: 20px;
  position: relative; top: 2px;
  margin-left: 10px;
}

.Profile-Dropdown li:nth-child(3) a::before{
  content: "⌲"; font-size: 20px;
  position: relative; top: 2px;
  margin-left: 10px;
}

/*=====================|Mobile Brand|=====================*/

#mobile-header-right{display:none;}

#mobile-header-left{display:none;}

.mini-cart-mobile{
	position:relative;
	display:flex;
	min-width:25px;
}

.mini-cart-mobile > span{
	background: var(--Main_color);
  	border-radius:3px; padding-top: 3px;
    position: absolute;
    color: #fff;font-size: 11px;
    width: 20px; height: 16px;
    bottom: -7px; right: -7px;
    text-align: center;
}

#open-mobile-menu{
	font-size:22px; color: #000;
	padding: 5px 0px 5px 4px; 
	position: relative;
	top: 3px;
	min-width: 25px;
	text-align: end;
  	cursor: pointer;
  	display: inline-block;
	transition: all 0.5s; 
	rotate: 0deg; 
    user-select:none;
 	outline: none;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}

@media(max-width:480px){
  .login-menu,.login-btn{display:none;} 
  .site-branding{text-align:center;}
}

@media(max-width:920px){
  .login-menu,.login-btn{display:none;} 
  .site-branding {display: flex; align-items: center; justify-content: center;}
  .site-branding a img {max-height:50px; max-width:200px;}
  
  #mobile-header-left, #mobile-header-right{display:flex;}
  
  .top-brand-content{
    padding:0px 15px;
    height: 70px;
    display:grid;
    grid-template-columns: max-content 1fr max-content;
    justify-content: space-around;
    align-content: center;
  }
}

/*=====================|Mobile Menu|=====================*/
#Open_side{
	border-radius: 5px;
	border: 2px solid #ddd;
	color: #464646;
	text-align: center; 
	padding: 5px;
	line-height: 1.2;
	cursor: pointer;
	user-select: none;
	margin-top: 25px;
}

.sidenav{
  	display:none; 
    will-change: transform;
  	visibility:hidden;
    transform: translate(300px,0);
	height: 100%; width:300px;
	position: fixed; z-index: 90;
	top: 0; right: 0;
	background-color: #111;
	overflow-x: hidden;
	transition: all 0.5s;
	padding-top: 60px;
}

@media(max-width:920px){
   .sidenav{display:block;}
}

.sidenav .closebtn {
	position: absolute; 
	margin: 0 !important;
	width: 45px; height: 40px;
	background-color: #296fdd !important; color: #fff !important;
	font-size: 30px !important; font-weight: bold; line-height: 1.4;
	border-radius: 0 0 50px 0;
	box-shadow: 0 0 0 10px rgba(41,111,221,.58),0 0 0 20px rgba(41,111,221,.33) !important;
	padding: 0 8px 5px 0px !important;
	top: 0; left: 0;
	text-align: center; cursor: pointer;
    user-select:none; outline: none;
}

.sidenav a {
	display: block; transition: 0.3s;
	font-size: 14px; color: #fff;
	white-space: nowrap;overflow: hidden; 
  	text-decoration: none; text-overflow: clip;
	padding-top:10px; padding-bottom:10px;
  	user-select:none; outline: none;
}

.sidenav a:hover {background: #00a366;}

.sidenav ul{list-style: none; padding-right:0px;}

.sidenav ul ul {margin-right:20px;}

.sidenav li a {padding-right: 20px;}

.sidenav .menu-item-has-children > a{position: relative;}

.sidenav .menu-item-has-children > ul{
	border-right: 1px solid #424242;
}

.sidenav .menu-item-has-children > a::after{
	position: absolute; display: inline-block;
	content: "+"; 
	left: 15px; top: 10px;
	color: #d7d7d7; font-size: 15px;
}

/*------------*/

.sidenav > ul > li{border-top: 1px solid #222;}

.sidenav > ul > li:last-child{border-bottom: 1px solid #222;}

.sidenav .menu-item-has-children > ul{
	max-height: 0px;
	opacity: 0;
	visibility: hidden;
	transition: all 0.4s ease-in-out;
	margin-bottom:0px;
}

.sidenav .menu-item-has-children.active > ul{
	max-height: 1000px;
	opacity: 1;
	visibility: visible;	
	margin-bottom:8px;
}

/*-------|Search in Mobile Menu|-------*/

.Side_nave_search{width: 90%; margin: 20px auto;} 

.Side_nave_search > form {
  position:relative; width: 100%; display:block;
}

.Side_nave_search input {
  display: block; margin: auto;
  width: 100%; padding: 0 30px;
  box-sizing: border-box;
  border-radius: 50px; min-height: 40px;
  outline: none; border: none;
}

.Side_nave_search input::placeholder{
	font-size:14px; color:#797979;
}

.Side_nave_search button{
  position: absolute;
  background: 0 0; padding: 0;
  top: 8px; left: 15px;  
}

.Side_nave_search button img{filter: invert(0.5);}

/*=====================|Navigation|=====================*/
#container_top{
    display: grid; padding: 0px 5%; margin: auto;
    align-items: center; 
  	box-shadow: -7px 10px 10px -10px #32323242;
  	position:relative;
}

#top-menu{display:flex; grid-gap:20px; list-style:none; position: relative;}

#top-menu > li{display:flex; align-items: center; min-height:45px;}

#top-menu > li > a{ padding: 0px 10px; }

#top-menu > li:hover{border-bottom:2px solid var(--Main_color)}

#top-menu .menu-item-has-children > a::after
{
  content: '\276E'; display: inline-block;
  font-size: 12px; line-height: .9;
  color: #a2a2a2; margin-right: 10px;
  rotate:90deg;
}

.mega-menu .menu-item-has-children > a::before{
  content: '\276E'; display: inline-block;
  font-size: 12px; color: #a2a2a2;
  margin-left: 10px; rotate:180deg;
  position: relative;
}
.mega-menu .menu-item-has-children > a::after{content: '' !important;}

/*========|Simple tree menu|========*/

#top-menu .sub-menu{
  position: absolute; display: block;
  visibility: hidden; opacity: 0;
  top: 10px; 
  z-index: 10;
  list-style: none; box-sizing: border-box;
  background: #fff;
  transition: all 0.5s ease-in-out;
  border-radius: 5px;
  box-shadow: 0px 0px 5px #44444430, 0px 19px 20px -15px #0000000f;
  margin-right:0px; min-width:220px;
}

#top-menu > li > .sub-menu{
  top: 45px !important;
  border-radius: 0px 0px 5px 5px !important;
  box-shadow: 0px 3px 3px #44444430, 0px 19px 20px -15px #0000000f !important;
}

#top-menu > li > ul .sub-menu{right:calc(100% + 10px);}

#top-menu li.menu-item-has-children:hover > ul{
  visibility: visible;
  opacity: 1;
}

#top-menu > li > ul li a{
  display:block;  position:relative;
  padding: 10px 20px; font-size:14px;
}

#top-menu > li > .sub-menu li:not(:last-child)::after{
  content: ''; z-index:1;
  display: block;
  position: absolute;
  left: 20px; right: 20px;
  height: 1px;
  background-color: #e9ecef;
  transition:all 0.5s;
}

#top-menu > li > .sub-menu li a:hover{
	color: var(--Main_color);
  	background:#f9f9f9;
}

@media(max-width:820px){
  #container_top{display:none;}
}

/*========|Mega Menu|========*/

.mega-menu > ul {
  visibility: hidden;
  opacity:0;
  position: absolute;
  display: grid !important; grid-gap: 40px !important;
  grid-template-columns: 1fr 1fr 1fr 1fr !important;
  top: 45px; right: 0;
  width: 100%; padding: 20px 20px 50px 20px;
  background: #fff; z-index: 10;
  margin: 0px;
  box-shadow: 0px 3px 3px #44444430, 0px 19px 20px -15px #0000000f;
  border-radius:0px 0px 5px 5px;
  box-sizing: border-box;
  list-style: none;
  transition: all 0.3s;
}

.mega-menu > ul .sub-menu{
  position: relative !important;
  display: block;
  visibility: hidden; opacity: 0;
  top: 10px; 
  list-style: none; box-sizing: border-box;
  background: #fff;
  transition: all 0.5s ease-in-out;
  border-radius: 5px;
  box-shadow: none !important;
  margin-right:0px; min-width:220px;
}

#top-menu li.mega-menu:hover ul{
  visibility: visible;
  opacity: 1;
}

.mega-menu > ul .sub-menu{right:unset !important;}

.mega-menu > ul li:not(:last-child)::after{
  content: ''; z-index:1;
  display: none !important;
  position: absolute;
  left: 20px; right: 20px;
  height: 1px;
  background-color: #e9ecef;
  transition:all 0.5s;
}

.mega-menu > .sub-menu > li > a:hover {
  color: #464646 !important;
  background: #fff !important;
}

.mega-menu > ul > li > a {
  border-bottom:1px solid #464646;
  font-size:15px !important;
  padding:10px 2px !important;
}

.mega-menu > ul > li > ul {
  list-style: none;
  margin:0px
}

.mega-menu > ul > li > ul > li a:hover{
	color: var(--Main_color);
  	background:#f9f9f9;
}

.mega-menu > ul > li > ul li{
	border-bottom:1px solid #ddd;
}

@media(max-width:960px){
  #container_top{display:none;}
}

/*=====================|Home Search|=====================*/

#search-home{
  /*background: url("images/Header-6.png");*/
  height: 300px;
  object-fit: cover;
  background-position: center;
  background-position: center 50%;
  border-bottom: 2px solid #ddd;
  background-size: cover;
} 

#search-holder {
  width: 80%; margin: auto;
  top: 25%; display: block;
  position: relative;
}

#search-title{
  display: grid;
  /*grid-template-columns: 25px max-content;*/
  grid-gap: 10px; font-size: 22px;
  margin: auto; width: 95%;
  margin-bottom:15px;
  text-align: center;
  justify-content: center;
  align-items:center; color:#fff;
  font-family:kalameh;
}
/*------*/
.search-home-form > form {position:relative; width:100%; display:block;}

.search-home-form input {
  display: block; margin: auto; font-size: 18px;
  width: 100%; padding: 0 30px;
  box-sizing: border-box;
  border-radius: 50px; min-height: 45px;
  outline: none; border: none;
  text-align:center;
  border:2px solid #e9e9e9; background:#fff;
  /*box-shadow: 0 0 5px #ddd; background: #fff;*/
}

.search-home-form input::placeholder{font-size:17px; color:#454545;}

.search-home-form button{
  position: absolute;
  background: 0 0; padding: 0;
  top: 10px; left: 15px;  
}

#search-title svg{color:#fff;}

.Side_nave_search button img{filter: invert(0.5);}
/*------*/

@media(max-width:480px){
  #search-holder{width:85%; top: 10%;}
  #search-title{display:grid; /*grid-template-columns: 25px 1fr;*/ font-size:22px;}
}

/*=====================|Home Box Icon|=====================*/

#icon_box {
  padding: 40px 25%;  background:#f9f9f9;
  display:grid; position:relative;
  grid-gap: 20px;
  justify-content: center;
  grid-template-columns: repeat(4,minmax(50px,.25fr));
}

.icon_item {
  background: #fdfdfd; padding: 10px;
  cursor: pointer; min-height: 50px;
  border-radius: 10px;
  box-shadow: 0px 3px 5px #b6c5d9;
  text-align: center;
  transition: 0.5s;
  font-size: 16px;
}
.icon_item a{display:grid; grid-gap:10px; justify-items:center;}
.icon_item:hover {box-shadow: 0px 3px 20px #b6c5d9;}

@media(max-width:1200px){
  #icon_box{padding: 40px 5%;}
}

@media(max-width:480px){
  #icon_box{
    padding: 40px 5%;
    grid-template-columns: repeat(2,minmax(50px,.5fr));
  }
}

/*=====================|Box Size for blog|=====================*/
.box-content{
	padding: 40px 8%;
    background: #fff;
    position: relative;
}

.box-content-gray{
	padding: 40px 8%;
    background: #f8f8f8;
    position: relative;
}

@media(max-width: 480px){
  .box-content, .box-content-gray{
	padding: 10px 5% 40px 5%;
  }
}
  
/*=====================|Show Product Blog|=====================*/
/*-------------------|title|-------------------*/
.cards-title {
  display:block;
  position:relative;
  margin: 10px auto 30px auto;
}

.cards-title h2 {
  display: table; z-index:10;
  padding: 6px 0px 6px 0px;
  margin: auto;
  border: 2px solid var(--Main_color);
  border-radius: 5px;
  background: #fff;
  text-align: center;
  width: 300px;
  font-size: 18px; 
  position: relative;
  font-family:kalameh;
  color:#454545;
}

.cards-title::after {
  content: ''; z-index: 0;
  position: absolute;
  width: 100%;
  border-bottom: 2px solid var(--Main_color);
  top: 20px; right: 0;
}

.cards-title a{
  background: #fff; display: inline-block;
  padding: 5px 10px; margin-top: 15px;
  border-radius: 5px;
  border: 2px solid var(--Main_color);
  font-size: 14px;  
  display: inline-block;
  z-index: 8;
  position: relative;
  transition:all 0.3s;
}

.cards-title a:hover{box-shadow: 0 0 10px rgba(0,0,0,.2)}

.grid_card{
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-gap: 30px;
  justify-content: center;
  justify-items: center;
  padding: 0px 8%;
  z-index: 8;
  position: relative;
}

/*--------------|Carusel Setting|--------------*/

.Tabib_Carousel{
    overflow:hidden;
    position:relative;
    padding:15px 0px;
    border-radius:10px;
    background:#fff; max-height:390px;
}

.Tabib_Carousel_shadow{
  /*border: 1px solid rgb(221, 221, 221);*/
  box-shadow: rgb(223, 222, 222) 0px 0px 10px;
}

.Tabib_Row{
  display: flex; flex-direction: row;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  background:#fff;
  width: fit-content;
  margin: 0 5px;
  position: relative;
}

@media(max-width: 920px){
  .grid_card{ grid-template-columns:1fr 1fr; padding: 0px;}
}

@media(max-width: 480px){
  .Tabib_Carousel {overflow: auto !important; }
  .cards-title a{margin-top:20px;}
  .cards-title h4 {width:250px}  
  .grid_card{ grid-template-columns:1fr; padding: 0px 10px;}
}

.arrow:after{
	content: "❮";
    background: #ddd; color: #fff;
    width: 30px; height: 30px;
    border-radius: 50px; position: absolute;
    right: 6%; top: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
  	padding-top: 3px;
}

.arrow:before{
	content: "❯";
    background: #ddd; color: #fff;
    width: 30px; height: 30px;
    border-radius: 50px; position: absolute;
    left: 6%; top: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
  	padding-top: 3px; padding-right: 2px;
}

@media(max-width: 1200px){
  .arrow:after,.arrow:before{display:none;}
}

/*--------------|Card Setting|--------------*/  
.card {
  transition: .3s; flex-shrink:0;
  background: #fff; width: 290px;
  border-radius: 5px;
  box-shadow: 0 1px 4px 0 rgba(25,25,25,.3);
  margin: 0px 10px; min-width: 250px;
}

.card-archive{
  transition: .3s; 
  background: #fff; min-width: 250px;
  border-radius: 5px;
  box-shadow: 0 1px 4px 0 rgba(25,25,25,.3);
}

.card-for-grid{
  width:unset !important;
  margin:unset !important;
  box-shadow: 0 0 7px 0px rgba(0,0,0,.2) !important;
}

.card:hover { box-shadow: 0 8px 12px 0 rgba(0,0,0,0.2); transform: scale(1.025); z-index: 2; }
.card-archive:hover { box-shadow: 0 8px 12px 0 rgba(0,0,0,0.2); z-index: 2; }

.card img, .card-archive img {
  display: block; object-fit: cover;
  margin:0 auto;
  border-radius: 5px 5px 0px 0px;
  width: 100%; height: auto;
}

.Related_Posts .card img{max-height:170px;}

.card_title{
  color: #555; text-align: center;
  font-size: 15px; font-weight:bold;
  height: 70px; padding: 10px; line-height:1.8;
}

.card_price{
  width: 90%; text-align: center;
  background: #f5f5f5;
  margin: auto;
  padding: 5px 0px;
  border-radius: 5px;
}

.card_price ins{background: transparent;}
.card_price ins bdi, .card_price ins bdi span{color:#ff1c00;}

.card_price del{text-decoration-line: none; margin-left: 10px; position:relative;}
.card_price del span{color:#888;}
.card_price del::after{
  width: 100%; height: 1px;
  top: 47%; left: 3px;
  background: #6d6d6d;
  content: '';
  position: absolute;
  transform: rotate(-10deg);
  -webkit-transform: rotate(-10deg);
  -moz-transform: rotate(-10deg);
  -ms-transform: rotate(-10deg);
  -o-transform: rotate(-10deg);
}
.woocommerce-Price-currencySymbol{margin-right:5px;}


.card_info{
  display: grid; position: relative;
  grid-template-columns: 1fr 1fr;
  grid-gap: 0px;
  margin-top: 20px; padding: 10px 0;
  border-top: 1px solid #eee;
}

.card_info .attr_right {
  display: block; text-align: right;
  padding: 5px 15px; margin: auto 0px;
  font-size: 14px; color: #808080;
}

.card_info .attr_left {
  display: flex; align-items: center; justify-content: end;
  padding-left: 15px; margin: auto 0px;
  font-size: 14px; text-align: left; 
}

.card_info .attr_left img {
    width: 20px; margin: 0 5px 0 0;
    text-align: left; filter: invert(0.2);
    display: inline-block;
}

.card_info .attr_left .front-add-to-cart{
  background: #30bd64; color: #fff;
  user-select: none;
  border-radius: 3px;
  display: inline-block;
  box-sizing: border-box;
  padding: 6px 10px; margin-left: 5px;
  cursor: pointer;
}

.card_info_arch time{color:#bbb;}
.card_info_arch .attr_left{color:#bbb;}
.card_info_arch .attr_left img{filter: invert(0.7);}

/*---------|Pic Left and Right|----------*/

.grid-pic::before {
  content: '';
  position: absolute;
  background: url('css/icon/Left-parallax.png') no-repeat;
  height: 100%; width: 100%;
  z-index: 3; left: 0px; bottom: -750px;
}

.grid-pic::after {
  content: '';
  position: absolute;
  background: url('css/icon/Right-paralex.png') no-repeat;
  height: 100%; width: 162px;
  z-index: 3; right: 0px; bottom: 50px;
}

/*------|Mobile|------*/

@media(max-width: 480px){
  .card{width:270px}
  .grid-pic::before, .grid-pic::after {display:none;}
}

/*===============|Payment in front page|================*/

.payment{
  display: flex; grid-gap: 40px;
  padding: 40px 0px 10px 0px;
  justify-content: center;
  font-size: 18px;
}

.payment div{
  display: grid; grid-gap: 10px;
  width: 220px;
  justify-content: center;
  justify-items: center;
} 

.payment div span{color:#666;}

@media(max-width: 920px){
  .payment{width: fit-content;}
  .payment-cards{
    overflow-x: auto;
	position: relative;
    margin: 15px 20px;
  }
}

/*===============|Buyer in front page|================*/

.Buyer-comments-heading{margin-right:20px;}
.Buyer-comments-heading h4{ position:relative; z-index:0;}
.Buyer-comments-heading span{ position:relative; z-index:5;}
.Buyer-comments-heading h4::after{
    content: "❞"; z-index: -1;
    position: absolute;
    top: -60px; right: -5px;
    border-radius: 20px;
    font-size: 150px;
    color: #fff7e9;
}

.Buyer-comments-box{
  margin: 40px 0px 0px 0px;
  box-shadow: inset 0px 0px 5px #ddd !important;
  border: none !important;
}

.Buyer-comments{
  display: flex; flex-direction: row;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  background: transparent; width: fit-content;
  margin: 0 5px; position: relative;
}

.Buyer-comments div{
	width:420px; border-radius:5px;
    box-shadow: 0 1px 4px 0 rgba(25,25,25,.2);
  	padding:5px 15px; margin: 0px 10px;
    transition:all 0.3s;
    position: relative;
}

.Buyer-comments div::before{
	content: "❝"; position: absolute;
	left: 20px; top: 10px;
    height: 50px; color: #e6e6e6;
    font-size: 75px;
    display: flex;
}

.Buyer-comments div h5{ 
  font-size: 16px;
  font-weight: normal;
  margin-bottom: 10px;
}

.Buyer-comments div span{
  color: #ffffff;
  background: #1eb36f;
  padding: 5px 15px;
  display: inline-block;
  border-radius: 3px;
  font-size: 12px;
}

.Buyer-comments div p{
    line-height: 1.8; text-align: justify;
  	color: #888; font-size: 14px;
}

@media(max-width: 480px){
  .Buyer-comments div{width:280px;}
}

/*=====================|Footer|=====================*/

.inline-col{
  display: grid;
  grid-gap: 10px;
  grid-template-columns: max-content max-content max-content;
  margin: auto;
  margin-bottom: 5px;
  width: 100%;
}

.inline-col svg{color:#fff;}

.footer { position: relative; overflow: hidden; }

.footer-widgets{
  display: grid; grid-template-columns: 1fr 1fr;
  background: #282828; color: #fff;
  padding: 80px 10%; grid-gap: 400px;
}

.footer-widgets .widget-title{
  color: #eee; width: 250px;
  font-size: 16px; font-weight: normal;
  border-bottom: 1px solid #eee;
  padding-bottom: 15px;
  display: block; z-index:2;
  position:relative;
}

.footer-widgets .widget-title::before{
  content: "❞"; top: 6px;
  position: relative;  margin-left: 10px;
  font-size: 25px;
}

.footer-widgets .textwidget p{color:#ccc; margin:0px; line-height: 30px; text-align: justify;}
.site-copyright{background: #282828; text-align: justify; padding:20px;}
.site-copyright p{text-align:center; color:#ccc;}


@media(max-width: 1200px){
  .footer-widgets{grid-template-columns: 1fr 1fr; padding: 80px 50px; grid-gap:50px;}
}

@media(max-width: 480px){
  .footer-widgets{ grid-template-columns: 1fr; padding: 80px 25px; grid-gap:20px;}
  .footer-widgets .widget-title{margin:10px auto; }
}

#footer-slice{
	width: 70%; margin: auto; height: 3px;
	border: none; border-radius: 5px;
    margin-bottom: 10px;
    background: #8a8a8a;
    box-shadow: inset 0px 2px 5px #000;  
}

/*==================|title header|=====================*/

.htitle{
  display:grid;  position: relative; align-items:center;
  height:100px;
  overflow:hidden;
  /*box-shadow: inset 0px 0px 10px #aaa;*/
  /*background: #ece5e1;*/
  /*background: radial-gradient(at top, #f0d1e199 20%, #aebaee 100%);*/
  /*background: url('images/Header-title.jpg');*/
  /*background: radial-gradient(at top, #2f5c73 20%, #0a2635 100%);*/
  background: linear-gradient(-45deg,#ddd , #4ac0ce);
  border-bottom: 2px solid #fff;
  color:#454545;
}

.base { position: absolute; filter: blur(60px); opacity: 0.8; }

.one {
  border-radius: 100%;
  width: 600px; height: 600px;
  /*background-color: #F0E2DDA3;*/
  top:-300px; left:-100px;
  animation: fly 12s linear infinite;
  transform:rotate(0) translate(80px) rotate(0);
}

.two {
  width: 500px; height: 800px;
  background-color: #ffffff73;
  top:0px; left:35%;
  animation: fly 12s linear infinite;
  transform:rotate(0) translate(50px) rotate(0);
}

.three {
  border-radius: 100%;
  width: 500px; height: 400px;
  bottom:-80px; right:-100px;
  /*background-color: #F0E2DDA3;*/
  animation: flyPlus 8s linear infinite;
  transform:rotate(0) translate(100px) rotate(0);
}

@keyframes fly {
  100% { transform:rotate(1turn) translate(100px) rotate(-1turn); }
}

@keyframes flyPlus {
 /* 100% { transform:rotate(-1turn) translate(150px) rotate(1turn); }*/
}

.title-top{ 
    display: grid; position: relative; 
    justify-content: center; align-items: center;
    padding: 0px 30px; margin: auto;
    border-radius: 5px;
    box-shadow: 0px 5px 8px #a6d1d7;
    width: max-content; min-width: 280px;
    height: max-content;
    background: #ffffffc2;
    color:inherit;
}

.title-top h1{
    font-size:25px; font-family:kalameh;
    color:inherit;
    text-align:center;
    min-width: 280px;
    border-radius: 5px;
    padding:3px 20px; line-height:1;
}

.title-page h1{/*margin-top:25px;*/}

@media(max-width: 480px){
    .title-top{ box-shadow: none}
	.title-top h1{ font-size:20px; text-align:center; }
	.htitle{ display: grid; align-items: center; }
    .title-page h1{/*margin-top:25px;*/}
    .one, .two, .three { display: none; }
}

/*=====================|Sidebar|=======================*/
.sticky-sidebar{display:flex;}
.sidebar { width:100%; position: sticky; bottom: 50px; align-self: flex-end;}
.sidebar section{
  margin: 25px 15px 15px 15px;
  background: #fff;
  border-radius: 5px;
  box-shadow: 0px 0px 5px #cecece;
  overflow: hidden;
  z-index: 0;
  position: relative;
  box-sizing: border-box;
}

.sidebar section > :nth-child(2){ padding: 0px 15px 15px 15px; }

.sidebar-title{
    position: relative; padding: 5px 15px 0px 15px;
    display: flex; align-items: center;  
}

.sidebar-title::before{
	position: absolute; content: "";
    height: 30px; border-radius: 50px;
    border-right: 3px solid var(--Main_color);
    top: 16px; right: 0px;
}

.sidebar-title h3{
  display: block; width: 100%;
  border-bottom: 1px solid #ddd;
  padding-bottom: 10px; font-size:18px;
}

.sidebar-title span{
  color: #00a336;
  font-size: 30px;
  margin-left: 10px;
}

/*===================|Archive Blog|=====================*/
.Archive-content{
  display: grid;
  grid-template-columns:0.7fr 0.3fr;
  padding: 50px 10%;
  background: #f9f9f9;
}

.Archive-box{
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-gap: 30px;
  margin: 22px 20px;
}

.taxonomy-description {
	box-shadow: 0px 0px 5px #cecece;
	border-radius: 5px; line-height: 30px;
    background: #fff;
    text-align: justify; padding: 20px 25px;
  	box-sizing: border-box; margin: 0px 20px 25px 20px;
}


@media (max-width: 1700px){
	.Archive-content{ padding: 50px 5%;}
}

@media (max-width: 1360px){
	.Archive-content{ padding: 50px 1%;}
}

@media (max-width: 960px){
	.Archive-content{ grid-template-columns: minmax(0px,auto); padding: 20px 5%; }
    .Archive-box{ grid-template-columns: 1fr 1fr; }
}

@media (max-width: 480px){
   .Archive-content{ grid-template-columns: minmax(0px,auto); padding: 0px 10px; }
   .Archive-box{ grid-template-columns: 1fr; margin: 22px 10px; }
}

/*===================|Pagination|=====================*/

.pagination, .comments-pagination {
	border-top: 1px solid #e1e1e1; box-sizing: border-box;
	padding: 2em 0 3em; margin: 50px;
	text-align: center;
}

.pagination .nav-links > *, .comments-pagination .nav-links > * {
    display: inline-block; transition: all 0.3s;
    color: #fff; background: #686868;
    padding: 10px 12px; margin-left: 5px;
	border-radius: 5px; 
    line-height: 25px;
    font-size: 20px; min-width:35px;  
}

.pagination .nav-links > a:hover,
.comments-pagination .nav-links > a:hover{
  background:#06a23a; color:#fff;
}

.pagination .nav-links > .current,
.comments-pagination .nav-links > .current{
  color: #fff;
  background: #06a23a;
  text-decoration: none;
}

/*=============================================================*/
/*====================|Widjet Recent Post|=====================*/

.widget_recent_item{
  display: grid; grid-template-columns: max-content 1fr;
  grid-gap: 20px;
  border-bottom: 1px dashed #bbb;
  margin: 5px 0px; padding: 5px 0px;
}

.widget_recent_item:last-child{border-bottom: unset;}

.widget_recent_item > a img{
  width: 90px;
  height: 70px;
  border-radius: 5px;
  object-fit: cover;
}

.wgt_rcnt_attr {
  display: grid; grid-template-columns: 1fr 1fr;
  width: 100%;
  font-size: 12px; 
}

.wgt_rcnt_attr .attr_right{color:#a6a6a6;}
  
.wgt_rcnt_attr .attr_left, .wgt_prd_attr .attr_left{
  display: flex;
  grid-gap: 5px;
  align-items: center;
  justify-content: end;
  color:#a6a6a6;
}

.wgt_rcnt_attr .attr_left img{width: 15px; filter: invert(0.6); }
.widget_recent_item h3{font-size:14px;}

.wgt_prd_attr{
    display: grid;
    grid-template-columns: 1fr 20px;
    grid-gap:10px;
    font-size: 12px;
    align-items: baseline;
}

.wgt_prd_attr .attr_right h3{margin:0; line-height: 1.8;}
.wgt_prd_attr .attr_left img{width: 15px; filter: invert(0.6); }

/*=========================|Widjet List|=======================*/
/* widget lists */

.widget ul { list-style: none; margin: 0; }
.widget ul li, .widget ol li { padding: 0.5em 0; }

/* Widget lists of links */

.widget:not(.widget_tag_cloud) ul li + li { margin-top: -1px;}

.widget_top-posts ul li ul, .widget_rss_links ul li ul,
.widget-grofile ul.grofile-links li ul,
.widget_pages ul li ul, .widget_meta ul li ul {
	bottom: 0;
}

.widget_nav_menu ul li li,
.widget_top-posts ul li,
.widget_top-posts ul li li,
.widget_rss_links ul li,
.widget_rss_links ul li li,
.widget-grofile ul.grofile-links li,
.widget-grofile ul.grofile-links li li {
	padding-bottom: 0.25em; padding-top: 0.25em;
}

.widget_rss ul li { padding-bottom: 1em; padding-top: 1em; }

/*=========================|Widjet menu|=======================*/
.widget .menu a {
	display: block; transition: 0.3s;
	font-size: 14px;
	white-space: nowrap;overflow: hidden; 
  	text-decoration: none; text-overflow: clip;
  	user-select:none; outline: none;
    padding: 10px 0px;
}

.widget .menu a:hover {color: #00a366; background: linear-gradient(to left,#f9f9f9 40% ,#fff );}
.widget .menu{
  list-style: none;
  padding-right: 0px;
}

.widget .menu .sub-menu{list-style:none;}
.widget .menu ul {margin-right:20px;}
.widget .menu li {padding:0px;}
.widget .menu li a {padding-right: 20px;}
.widget .menu .menu-item-has-children > ul{ border-right: 1px solid #ddd;}
.widget .menu .menu-item-has-children > a{position: relative;}
.widget .menu .menu-item-has-children > a::after{
	position: absolute; display: inline-block;
	content: "+"; 
	left: 15px; top: 8px;
	color: #979797; font-size: 20px;
}

.widget .menu > li{border-top: 1px dashed #ddd;}
.widget .menu > li:first-child{border-top: none;}

.widget .menu .menu-item-has-children > ul{
	max-height: 0px;
	opacity: 0;
	visibility: hidden;
	transition: all 0.4s ease-in-out;
	margin-bottom:0px;
}

.widget .menu .menu-item-has-children.active > ul{
	max-height: 1000px;
	opacity: 1;
	visibility: visible;	
	margin-bottom:8px;
}

/*===========================|Error 404|========================*/
.error-404{ padding-top:50px; text-align:center; }
.error-404 h1{font-size:30px;}

/*======================|Article in Blog|======================*/
.main-content{
  display: grid; grid-template-columns: 70% 30%;
  padding: 20px 10%; background: #f4f4f4;
}

.article-content {
  position: relative; overflow: hidden; 
  background: #fff; margin: 24px 15px;
  border-radius: 5px; z-index: 0;  
  box-shadow: 0px 0px 5px #cecece;
}

.meta-content *{color:#aaa;}
.meta-content{
  display: grid; font-size:14px;
  grid-gap: 10px;
  grid-template-columns: 1fr 1fr;
  border-bottom: 1px solid #ddd;
  position: relative; padding: 15px 20px;  
}
.meta-content div:nth-child(2){text-align:left;}
.meta-content div:nth-child(1) a{margin:0px 8px;}

.meta-content div:nth-child(1){
   display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1; 
  overflow: hidden;
  text-overflow: ellipsis;
}

.body-content{padding: 25px 40px 20px 40px; line-height:2; text-align:justify; color:#111; font-size:16px;}

.body-content img{border-radius:5px; margin:25px auto;}

.body-content > ul{margin-top:10px; margin-bottom:30px;}
.body-content ul{ list-style-type: disc; margin-right:40px;}
.body-content ol{margin:10px 40px 30px 0px;}

.page-content ul{ list-style-type: disc; margin-right:40px; line-height:2;}

.soft-box{
  background: #fff;
  border-radius: 5px;
  box-shadow: 0px 0px 5px #cecece;
  margin: 32px 15px;  padding: 20px 30px;
}

.soft-content{
  background: #fff; margin: 32px 15px;  
  border-radius: 5px; overflow: hidden; z-index:0;
  box-shadow: 0px 0px 5px #cecece; position:relative;
}

.soft-box-grid{
  display: grid; grid-gap: 15px;
  grid-template-columns: max-content auto;
}

@media (max-width: 1700px){
	.main-content{ padding: 50px 5%;}
}

@media (max-width: 1360px){
	.main-content{ padding: 50px 1%;}
}

@media (max-width: 960px){
	.main-content{ grid-template-columns: minmax(0px,auto); padding: 50px 2%; }
}

@media (max-width: 480px){
   .main-content{ grid-template-columns: minmax(0px,auto); padding: 20px 0px; }
   .meta-content div:nth-child(2) span{display:none;}
   .body-content{padding: 30px 15px 20px 15px;}
   .soft-box-grid{ grid-template-columns: auto; }
}

/*---------|Copy to Clipboard - ShortLink|---------*/
#shortlink{
	padding: 10px 30px; 
	display: flex; grid-gap: 15px;
	align-items: center;
	border-top: 1px solid #ddd;
}

#short_link_copy{ position:relative; cursor: pointer; }

#short_msg{
	position:absolute;padding:7px 10px; right:-30px; font-size:14px;
	background:#4c4c4c; color:#fff; width:120px; text-align:center;
	border-radius:5px; top: -40px; display:none;
}
	
#short_msg:before{
	width: 0; height: 0; border: 0 solid transparent;
	border-left-width: 9px; border-right-width: 9px;
	border-top: 9px solid black; border-left-width: 5px;
	border-right-width: 5px; border-top: 5px solid #4c4c4c;
	content: ""; position: absolute; bottom: -5px; right: 50%;
}

#shortlink > svg{ margin-right:20px; color:var(--Main_color); cursor: pointer; }

/*=============|Star Rating and Tags|================*/

.soft-box-grid > div:nth-child(1){ display:flex; grid-gap:10px; align-items: center; margin-right: 20px; }
.soft-box-grid svg{ color:var(--Main_color);}
.soft-box-head svg{ color:var(--Main_color);}

.tagcloud a {
  padding: 5px 8px; margin: 5px;
  border: 1px solid var(--Main_color); border-radius: 5px;
  text-decoration: none; font-size: 14px;
  display: inline-block;
  background: #fff;
  transition: .3s;
}
.tagcloud a:hover { color: #fff !important; background: var(--Main_color); }

@media (max-width: 480px){
	#shortlink > svg{ margin-right:0px; }
    .soft-box-grid div:nth-child(1){ margin-right:0px; }
}

#namad-side svg{color:var(--Main_color);}

/*=================|Other Option Content|=================*/

.soft-content > div:nth-child(2){ margin: 20px 40px 30px 40px; }
.soft-title-content{ border-bottom: 1px solid #ddd; position: relative; }

.soft-title-content header{
  border-bottom: 3px solid var(--Main_color);
  margin-right: 25px; margin-bottom: -2px;
  display: inline-block; padding: 10px 20px;
}

.soft-title-content svg{ color:var(--Main_color); margin-left: 10px; }
.soft-title-content h3{ display: inline-block; margin:0; }

@media (max-width: 480px){
	.soft-content > div:nth-child(2){ margin: 20px 15px 30px 15px; }
}
/*=================|Comments|=================*/
#comments-taha{max-height:1500px;}
#comments img { border-radius: 5px; transition: 0.5s; }
#comments h3{
  background: #f6f6f6;
  border-top: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
  padding: 2px 20px; margin-bottom: 50px;
  position:relative;
  color: #8c8a85;
}

#comments h3 #cancel-comment-reply-link{
  font-size: 14px;
  position: absolute; margin-left: 10px;
  top: 5px; left: 10px; color: var(--Main_color);
}

.comment-respond{ margin-top:40px; }

.comment-list .avatar{ float: right; } 
.comment-list, .comment-list .children { list-style:none; margin:28px 0px 0px 0px; padding:0;}
.comment-list .comment{ margin-top:28px }
.comment-list .children, .comment-list .comment-content { margin-right: 75px; }

.comment-list{
  margin-bottom: 42px; padding: 0 10px;
  overflow-y: scroll; overflow-x: hidden;
  height: 700px;
}

.comment-box { display: flex; grid-gap: 5px; align-items:center; top: 3px; position: relative;}

.comment-list .comment-meta {
  color: #a6a6a6; background: #f5faff;
  padding: 10px;  margin-right: 10px;
  border-radius: 5px;
  width: max-content;
  border: 1px solid var(--Main_color);
  font-size: 12px;
}

.comment-meta .comment-author, .comment-meta a {
  margin: 0 0 0 2px;
  display: inline-block;
}

.verified {
  background: #1eb36f; color: #fff; font-size: 14px;
  border-radius: 5px; padding: 5px 10px;
  text-align: center; margin-right:10px;
}

.comment-author .says { font-size:10px; color:#ddd; }
.comment-list .comment-content p { margin-bottom: 0; }
.comment-list .comment-content {
  font-size: 13px; line-height: 1.8;
  position: relative; border-radius: 10px;
  margin-top: 14px; padding: 10px 15px 30px;
  background: #f2f2f2; 
}

.comment-content .reply {
  position: absolute; padding: 5px;
  bottom: 0; left: 15px;
  color: var(--Main_color); font-size: 14px;
  /*border-bottom: 2px solid #1eb36f !important;*/
  border-radius: 5px 5px 0 0;
  background: #fff;
  line-height: 0.5;
}
.comment-content .reply a { display: block; color: inherit; padding: 5px 0;}

.comment-respond form {
  margin-top: 30px; margin-bottom: 40px;
  padding: 20px;
  border-radius: 10px;
  border: 1px solid #ddd;
}

#comment { border-radius: 5px; font-size: 16px; width: 100%; padding: 20px;}

#nazar-submit{
  background: var(--Main_color); color: #fff;
  outline: none; border: none;
  padding: 10px; cursor: pointer;
  font-size: 15px;
}


@media (max-width: 480px){
	.comment-list .children, .comment-list .comment-content { margin-right: 15px; }
    .comment-box { display: grid; grid-template-columns: max-content; }
}

/*======================|Page in Blog|======================*/
.page-content{ padding: 20px 20%; background: #f4f4f4; }

.page-wide-content{ 
  padding: 30px 15%;
  background: #fff; text-align: justify;
}

.page-wide-content article p{line-height: 2;}

.page-content article{ 
  padding:30px 30px;
  overflow:hidden;
  text-align: justify;
}
.page-content article p{line-height: 2;}

@media (max-width: 1700px){
	.page-content{ padding: 20px 5%;}
    .page-wide-content{ padding: 30px 10%;}
}

@media (max-width: 1360px){
	.page-content{ padding: 20px 1%;}
    .page-wide-content{ padding: 30px 10%;}
}

@media (max-width: 960px){
	.page-content{ grid-template-columns: minmax(0px,auto); padding: 20px 3%; }
    .page-wide-content{ padding: 30px 5%;}
}

@media (max-width: 480px){
   .page-content{ grid-template-columns: minmax(0px,auto); padding: 20px 0px; }
   .page-wide-content{ padding: 30px 15px;}
}

/*=======================|Search Result|=======================*/
.search-box-not-found{
  position: relative; 
  overflow: hidden;
  background: #fff;
  margin: 24px 15px; padding:30px;
  border-radius: 5px;
  box-shadow: 0px 0px 5px #cecece;
}

.search-box-wg input{ width:300px; }

.search-box-wg .search-form{
  display: flex; grid-gap:10px;
  justify-content: center;
  align-items: center; 
  margin: 10px 0px;
}

.search-box-wg .search-submit{
  font-size: 28px;  cursor: pointer;
  background: var(--Main_color); color: #fff;  
  position: relative; 
  width: 60px;
  padding-top: 4px;
  border-radius: 5px;
}


/*==========================|Woocomerce|===========================*/
/*========================|Single Product|=========================*/

#tab-links{
    display: flex; grid-gap: 50px;
    border-bottom: 1px solid #ddd;
    position: relative;
    padding: 0px 30px;
    list-style: none;
}

#tab-links li a.active{border-bottom: 3px solid var(--Main_color);}
#tab-links li a span{color:#757575; padding-right:10px;}
#tab-links li a h2{color:#757575; padding-right:10px; margin: 0;}
#tab-links li a{
    display: flex;
    align-items: center;
    padding: 10px 5px;
    margin-bottom: -2px;
    color:#757575;
    user-select: none;
    outline: none;
}

.body-content > div{display: none;}
.tab_active{display: block !important;}

.prdc-content{
    display: grid;
    grid-template-columns: 70% 30%;
    padding: 20px 8%;
    background: #f4f4f4;
    min-height:4200px;
}

.prdc-content-side{
    padding: 20px 8%;
    background: #f4f4f4; display:none;
}

.prdc-card .attr_right text{color:#bbb;}
.prdc-card .chat-icon{
    width: 20px; margin: 0 5px 0 0;
    text-align: left;
    filter: invert(0.7);
    display: inline-block;
}

.prdc-card .attr_right {
    display: flex;
    align-items: center; justify-content: start;
    padding-left: 15px; margin: auto 0px;
    font-size: 14px;
}

@media (max-width: 1700px){
	.prdc-content{ padding: 20px 4%;}
}

@media (max-width: 1360px){
	.prdc-content{ padding: 20px 10px;}
}

@media (max-width: 960px){
	.prdc-content{ grid-template-columns: 100%; padding: 20px 0%; }
	/*.prdc-content > section:nth-child(1) { order: 2; }
	.prdc-content > section:nth-child(2) { order: 1; }*/
	
	.prdc-content-side{ padding: 1px 0%; display:block;}
}

@media (max-width: 480px){
   .prdc-content{ grid-template-columns: 100%; padding: 20px 0px;}
    #tab-links{padding: 0px 18px; font-size:15px; grid-gap: 30px;} 

}

/*--------|Side Product price|--------*/

.price-label{ display: block; color: #adb5bd; font-size: 18px; margin: 10px; }
.prdc-box .price{ text-align: center; font-size: 25px; margin: 15px 0px 15px 0px; }
.prdc-box .woocommerce-Price-currencySymbol { font-size: 18px; color: #aeaeae; }
.add-to-cart-label{ color:#fff; }


.prdc-box .price ins{background: transparent;}

.prdc-box .price del{text-decoration-line: none; margin-left: 10px; position:relative; font-size: 18px;}
.prdc-box .price del span{color:#888;}
.prdc-box .price del span span{font-size:14px;}

.prdc-box .price del::after{
  width: 100%; height: 1px;
  top: 47%; left: 3px;
  background: #6d6d6d;
  content: '';
  position: absolute;
  transform: rotate(-10deg);
  -webkit-transform: rotate(-10deg);
  -moz-transform: rotate(-10deg);
  -ms-transform: rotate(-10deg);
  -o-transform: rotate(-10deg);
}

.out-of-stock{
    background-color: #7b868a;
    border-radius: 3px; user-select:none;
    font-weight: 600;
    line-height: 44px;
    text-align: center;
    font-size: 19px;
    color: #fff; height: 50px;
    box-shadow: 0 2px 12px rgba(123, 134, 138, .4);
}

.single_add_to_cart_button {
    display: grid !important; grid-template-columns: 25px 1fr; 
    align-items:center;
    width: 80%;
    margin: auto !important;
    background: #00a336 !important;
}


/*--------|Side Product Page|--------*/

.prdc-box{
    margin: 25px 15px 15px 15px; padding:15px;
    background: #fff; border-radius: 5px;
    box-shadow: 0px 0px 5px #cecece;
    overflow: hidden; 
    position: relative;
    box-sizing: border-box;
}

.prdc-box-title{
    display:flex; grid-gap:10px;
    align-items: center;
}

.prdc-guide{
    display: grid; grid-column-gap: 20px;
    grid-template-columns: 1fr 1fr; margin: 20px;
}

.prdc-guide a{
  text-align: center; padding: 10px 8px;
  border-radius: 5px;
  /*color: #d1046c !important;*/
  border: 2px solid var(--Main_color);
  box-sizing: border-box;
}

.prdc-guide a:hover {
  color: #fff !important;
  background: linear-gradient(745deg,#296fdd,#41a88f);
  border: unset;
}

/*--------|Side Etera info|--------*/

.extera-info{
    list-style: none; line-height: 25px;
    font-size: 14px;
    background: #f8f8f8;
    border-radius: 5px;
    padding: 10px; margin: 20px auto 10px auto;
}

.extera-info ul{
    list-style: none;
    padding-right: 10px;
}

.extera-info li:before{
  content: "✦"; font-size: 20px;
  color: #00a336; margin-left: 10px;
  position: relative;
  top: 3px;
}

@media(max-width:480px){
    .prdc-guide{ margin: 20px 10px; }
}

/*--------|list Etera info|--------*/

.extera-btn span{color:#fff;}
.extera-btn{
    background: #e67070 !important;
    width: 90%; text-align: center;
    display: block; border-radius: 5px;
    margin: 20px auto; padding: 10px;
}
.prd-info{min-height:80px;}
.prd-info-item{
    display: grid;
    grid-template-columns: auto auto;
    align-items: center;
    padding: 8px 0px;
    border-bottom: 1px dashed #ddd;
    font-size: 15px;
}

.prd-info .prd-info-item:last-child{ border-bottom: none; }
    
.prd-info-item > span{ text-align:end;}
.prd-info-item > div{
    display: grid;
    grid-template-columns: max-content auto;
    align-items: center;
    grid-gap: 15px;
    align-content: center;
}

.prd-info-item svg{ scale: 0.9; color: #6a6a6a; }
.prd-info-item span{color: #6a6a6a; }



/*=====================|Discount Counter|=====================*/

.Discount-Box{
	margin: 25px 15px 15px 15px;; padding: 20px 10px;
	color: #fff; background: linear-gradient(30deg, #f9b535, #d0a02c);
	border-radius: 5px;
	box-shadow: 0px 0px 5px #c4c4c4;
	direction: ltr;
	font-size: 18px;
	position: relative;
}
.Discount-Box *{ color: #fff; }

.Discount-time{
	display: grid;
	grid-template-columns: repeat(7,max-content);
	grid-gap: 15px;
	align-content: center;
	justify-content: center;
}

.Discount-time > span{margin-top:10px;}
.Discount-time div{display:grid; grid-gap:10px; justify-items: center;}

.Discount-Box div span:nth-child(1){
	border-radius:5px; box-shadow: 0px 0px 10px #8a8a8a5e;
	width: 30px; padding: 5px;
	text-align: center;
	font-size:24px;
}

.Discount-msg{text-align: center; display: block; margin: 20px auto 0px auto;}

.Discount-Head{
    display: grid; 
	margin: 0px 20px 20px 20px;
    font-size: 15px; 
    direction: rtl;
}

.Discount-Head span:nth-child(2){text-align:left;}
.Discount-Head span:nth-child(2) > text:nth-child(1) {margin-left:10px;}
    
    
    
/*========================|Download Box|=======================*/

#download-container{padding: 1px 0px;}

#download-container a{
    background: #296fdd; color: #fff;
    width:fit-content; display: block;
    padding: 7px 20px; border-radius: 3px;
    transition: all 0.3s;
    display:grid; grid-gap: 15px;
    grid-template-columns: 1fr auto; line-height: 1.5;
    text-align: justify;
}

#download-container a span{color:#fff; position:relative;}

#download-container a:hover{margin-right:-10px; background: #8e1e5d;}

#download-container #paswd{ padding-top:10px;}

#download-container #paswd{
    border-top: 1px dashed  #ddd; font-size: 14px;
    margin: 30px 0px 0px 0px; padding: 15px 25px 0px 25px;
}

#download-container #paswd span{
    padding: 1px 5px; margin-right: 10px; 
    background: #eee; border-radius: 5px;
}

@media(max-width:480px){
    #download-container a{width:95%; margin:auto;}
}

/*========================|Video Box|=======================*/
.video-box{
   margin: 24px 15px; min-height:500px;
   padding: 20px;
   background-color: #fff; /*#3b4348;*/
   border-radius: 5px;
   /*box-shadow: 0 0 9.9px 0.1px rgba(0, 0, 0, 0.3);*/
   box-shadow: 0px 0px 5px #cecece;
}

.video-box video{max-width:100%; max-height:100%; width:100%; border-radius: 5px;}

@media(max-width:480px){
    .video-box{min-height:160px;}
}


/*=====================|justify woocomerce|=====================*/

.woocommerce table.shop_attributes tr:nth-child(2n) td,
.woocommerce table.shop_attributes tr:nth-child(2n) th {
  background: #fff !important;
}

.woocommerce table.shop_attributes th {
    font-weight:normal !important;
    width: 50% !important;
    border-bottom: 1px solid #eee !important;
    text-align: start;
}

.woocommerce table.shop_attributes td{
      font-style: normal !important;
      border-bottom: 1px solid #eee;
}

.woocommerce table.shop_attributes{
    border:none !important;
}

.woocommerce-Button{
    font-size:18px !important;
    font-weight:normal !important;
    padding: 12px 20px !important;
    color:#fff !important;
    background-color:#00a336 !important;
}

.payment_box{background:#eee !important; border-radius:5px !important;}
.payment_box::before{
  border: 1em solid #eee !important;
  border-left-color:transparent !important;
  border-right-color:transparent !important;
  border-top-color:transparent !important;
  padding: 5px 10px;
  border-radius: 3px;
  color: #fff;
}

/*--------------------|pagination|--------------------*/

.woocommerce-pagination{
    border-top: 1px solid #e1e1e1;
    box-sizing: border-box;
    padding: 2em 0 3em;
    text-align: center;
}

.woocommerce-pagination ul{ 
    border: none !important;
    display: flex !important;
    flex-wrap: wrap;
    justify-content: center;
}
.woocommerce-pagination ul li{
    border: none !important;
    float: unset !important;
}

.woocommerce-pagination ul li *{
    display: inline-block !important;
    transition: all 0.3s;
    color: #fff; background: #686868;
    padding: 10px 6px !important; margin:6px !important;
    border-radius: 5px; min-width: 38px !important;
    line-height: 25px !important;
    font-size: 18px !important;
}

.woocommerce-pagination ul li .current{ background: #06a23a !important; color: #fff !important; }
.woocommerce-pagination ul li a:hover{ background: #06a23a !important; color: #fff !important; }

/*--------------------|widjet filter|--------------------*/

.woocommerce-widget-layered-nav-list li{
    border-radius:5px;
    padding: 5px 10px !important;
    margin:10px 0;
    border: 1px dashed #ddd;
}

.woocommerce-widget-layered-nav-list li a::before{margin:0px 10px;}

/*--------------------|breadcrumb|--------------------*/

.htitle{height:110px;}

.woocommerce-breadcrumb{
    font-size:14px !important;
    color:inherit !important;
}

.woocommerce-breadcrumb a{ color:inherit !important; }
.woocommerce-breadcrumb i{margin:0px 10px; color:inherit; font-style: normal;}

/*--------------------|Checkout|--------------------*/

.woocommerce-error, .woocommerce-info, .woocommerce-message {margin-bottom:20px !important;}
.woocommerce-form-coupon-toggle{display:none;}
.woocommerce-cart-form .product-quantity{height:45px;}
.woocommerce-billing-fields #billing_phone{text-align:right;}

.woocommerce #payment #place_order,
.woocommerce-page #payment #place_order {
  float: unset;
  background: #00a362;
  width: 100%;
  margin: auto;
  display: block;
  padding: 8px;
  border-radius: 3px;
  cursor: pointer;
  color: #fff;
}

#add_payment_method #payment,
.woocommerce-cart #payment,
.woocommerce-checkout #payment {
  background: #fff !important;
  border-radius: 5px;
  border: 1px solid #ddd;
}

#coupon_code{width:200px;}
.woocommerce-cart-form button, .wc-backward{
    background: #00a362 !important;
    color: #fff !important;
    font-weight: normal !important;
    padding: 8px;
    border-radius: 3px;
}

.woocommerce-checkout table.cart img{
    width: 90px !important;
    box-shadow: none !important;
    border-radius: 5px !important;
}

.woocommerce-cart-form {
  margin-bottom: 0px !important;
  border: 2px solid #137650 !important;
  border-radius: 10px !important;
  padding: 5px;
}

.woocommerce table.shop_table{
    padding: 10px 20px !important;
    border:none !important;
}

.woocommerce-cart-form .actions{padding-top:20px !important;}

.woocommerce table.shop_table {border:unset;}
.woocommerce table.shop_table td {line-height:1.2;}

.woocommerce-billing-fields, .payment-box{
    border: 2px solid #137650 !important; border-radius: 10px !important;
    margin: 30px 0px; padding: 20px;
}

.woocommerce a.remove:hover {padding-top:2px;}

.payment_methods, .woocommerce-checkout-payment{border:none !important;}
.shop_table thead th, .woocommerce-cart-form thead th { border-bottom:unset !important;}

.woocommerce a.remove{line-height:1.2;}
.woocommerce-info {text-align: justify;}


@media(max-width:480px){
    .coupon button {width:100% !important; display:block !important; margin:15px 0px !important;}
    .woocommerce table.shop_table td {line-height:2;}
}

.woocommerce-message {
    border-top-color: #00a336 !important; 
    border-radius: 0px 0px 5px 5px;
}
.wc-forward { background: #00a336 !important; color: #fff !important; font-weight: normal !important; border-radius: 3px; padding: 5px 10px;}
.woocommerce-message::before { color: #00a336 !important;}
.woocommerce-info{border-radius: 0px 0px 5px 5px;}
button[name="apply_coupon"] {background: #00a336 !important; color: #fff !important; font-weight: normal !important;}

.woocommerce-error {border-top-color: #b81c23; margin: 20px 0px !important; border-radius: 0px 0px 5px 5px;}

@media(max-width:480px){
	.wc-forward{ width: 100%; text-align: center; margin-bottom:10px !important; }
}
 
.woocommerce-orders-table__cell-order-actions a{
	padding: 3px 10px !important;
  	margin: 3px 10px !important;
  	border-radius:3px !important;
    display: inline-block;
    color:#222 !important;
    font-size:14px !important;
} 
 

/*------------------|Checkout - After Payment|------------------*/

.woocommerce-thankyou-order-details,
.woocommerce-order-downloads,
.woocommerce-order-details{ 
    background: #fff;
    border: 2px solid #ddd;
    padding: 10px;
    border-radius: 5px;
    font-weight: normal;

}

.download-file a{ background-color: #00a336 !important; color: #fff !important; font-weight: normal !important; padding: 3px 10px; border-radius: 3px;}
.woocommerce-customer-details, .order-again{display:none;}
.woocommerce-notice--success{  font-size: 25px; color: var(--Main_color);}
.woocommerce-order-downloads__title{color: var(--Main_color);}

@media(max-width:480px){
    .woocommerce-thankyou-order-details{ display: grid; grid-gap: 10px; }
    .woocommerce-thankyou-order-details li{ border: none !important; }
}

/*------------------|login Page|------------------*/

.login-container{ display:grid; grid-template-columns:1fr 1fr;}

#tab-login{
    display: flex; grid-gap: 50px;
    border-bottom: 1px solid #ddd;
    position: relative;
    padding: 0px 30px;
    list-style: none;
}

#tab-login li a.active{border-bottom: 3px solid var(--Main_color);}
#tab-login li a h2{color:#757575; padding-right:10px; margin: 0;}
#tab-login li a{
    display: flex; align-items: center;
    padding: 10px 5px; margin-bottom: -2px;
    color:#757575;
    user-select: none; outline: none;
}

#customer_login > div{display: none;}
.tab_active{display: block !important;}

.woocommerce-form-login,
.woocommerce-form-register{padding:20px;}

.woocommerce-form-login button,
.woocommerce-form-register button{
    display: block !important;
    float:unset !important;
    margin: 15px auto !important;
    background: var(--Main_color) !important;
    color: #fff !important; 
    width: 80% !important;
    padding: 10px !important;
    font-size: 16px !important;
    cursor: pointer;
    border-radius: 3px;
}

.woocommerce-form-login button:hover,
.woocommerce-form-register button:hover{background: #347bea !important;}
#customer_login input{background:#fff !important; border:2px solid #ddd !important;}
#customer_login label{margin-bottom:5px;}

.login-container section:nth-child(1){ margin-top:30px; padding-left:30px; border-left:1px solid #ddd;}

.login-container section:nth-child(2){ margin-top:30px; padding-right:30px; }

.login-container section:nth-child(2) ul{
    list-style:none; margin: 20px 30px 20px 20px;
}

.login-container section:nth-child(2) ul li{
    position:relative; line-height: 2;
}

.login-container section:nth-child(2) ul li::before{
    content: "✔"; color: #00a362;
    position: absolute;
    font-size: 16px;
    right: -20px;
}



@media(max-width:480px){
  .login-container{ display:grid; grid-template-columns:1fr;}
  
  .login-container section:nth-child(1){
    padding-left:0px;
    border-left:none; border-bottom:1px solid #ddd;
      
  }
  .login-container section:nth-child(2){ padding-right:0px; }
}

/*------------------|Dashboard Page|------------------*/

.woocommerce-MyAccount-navigation{
    border-radius: 10px;
    box-shadow: 0 3px 8px rgba(9,32,77,0.12), 0 0 2px rgba(29,17,51,0.12);
    min-height: 200px; padding: 20px 40px;
    background: #fff; margin-bottom: 40px; 
}

.woocommerce-MyAccount-content{
    border-radius: 10px;
    box-shadow: 0 3px 8px rgba(9,32,77,0.12), 0 0 2px rgba(29,17,51,0.12);
    min-height: 200px; padding: 20px 40px;
    background: #fff; 
}

.wc-nav-dashboard{ list-style:none; } 
.wc-nav-dashboard li{margin:15px auto}
.wc-nav-dashboard li a{ display: flex; align-items: center;}

.wc-nav-dashboard li span:nth-child(1){
    font-size:26px; line-height:1;
    margin-left:10px;
}

.wc-nav-dashboard li .utf-icon{margin-top:5px;}
.wc-nav-dashboard li svg{ margin-left:10px; }
.wc-nav-dashboard .is-active{
    background: linear-gradient(65deg, #6da1e6 0%,#296fdd 66%);
    padding: 5px 10px; border-radius: 5px; 
    color: #fff;
}

.wc-nav-dashboard .is-active svg{color:#fff;}
.wc-nav-dashboard .is-active span{color:#fff;}

.login-dashboard{ position: relative; z-index: 90; margin-top: -120px;}

.edit-account > p:nth-child(1),
.edit-account > p:nth-child(2),
.edit-account > p:nth-child(3),
.edit-account > p:nth-child(4){ display:none !important; }

.edit-account button{
    background: var(--Main_color) !important;
    color:#fff !important; font-weight: normal !important;
    padding: 10px !important;
    border-radius: 3px;
    font-size: 16px !important;
    cursor: pointer;
}

tbody td.download-remaining{text-align:center !important;}

@media(max-width:480px){
    
    .login-dashboard{ position: relative; z-index: 90;  margin-top: -80px; }
    .woocommerce-MyAccount-navigation,
    .woocommerce-MyAccount-content{ padding:20px; }
}


/*------------------|Dashboard Content|------------------*/

#title-tab-dashboard{
    margin-bottom:40px;
    border-bottom:1px solid #ddd;
}

#title-tab-dashboard{ display: flex; align-items: center; padding: 0px 10px 7px 15px;}
#title-tab-dashboard .utf-icon{margin-top:5px;}
#title-tab-dashboard svg{ margin-left:10px; }
#title-tab-dashboard span:nth-child(1){
    font-size:26px; line-height:1;
    margin-left:10px;
}

/*=====================|Variable product|=====================*/

/*------------------------- checkbox woocommerce ---------------------*/

#listcheck span{margin-right:5px;}
#listcheck span:nth-child(1){color:#555;}
#listcheck ul{list-style: none; padding: 0px;}
#listcheck{
	border-radius: 10px; background: #fff;
	padding: 15px 15px 30px 15px; width:95%; margin:auto;
}

.buy_var{
	color: #fff; background: #1eac2d; padding: 10px;
	border-radius: 5px; display: inline-block; margin-top: 5px;
}

.buy_var:hover{background: #1e7127;}
.pricee{color: #4F9740; font-weight: bold;}
.subject-lable {padding:10px 0px !important;}

@media (max-width: 480px) {
  
    .listcheck_grid{margin-bottom:10px;line-height: 30px;}
    #listcheck{ padding: 15px 0px 30px 0px; width:100%; }
    .subject-lable {width: auto !important;}
} 

/*---------------------------*/

.chkb + label {
    cursor: pointer; line-height:2.2; 
    padding: 0.2em; margin: 0.2em; display: block;
    position:relative; padding-right: 45px;
    text-align: justify;
}
.chkb {display: none;}

.chkb + label:before {
  content: "\2714"; border: 0.1em solid #464646;
  border-radius:3px; display: inline-block;
  width: 2em; height: 2em;
  padding-right: 0.5em; padding-top: 0em;
  margin-right: 0.2em; vertical-align: bottom;
  color: transparent; transition: .2s; margin-left: 10px;
  position:absolute;
  right:0px; top:5px; line-height: 1.9;
}

.chkb + label:active:before {transform: scale(0);}

.chkb:checked + label:before {
  	border: 2px solid #1eac2d; -webkit-box-shadow: 0 0 9px #1eac2d;
    box-shadow: 0 0 3px #1eac2d; color: #065608; font-weight: bold;
}

.chkb:disabled + label:before {
  transform: scale(1);
  border-color: #aaa;
}

.chkb:checked:disabled + label:before {
  transform: scale(1);
  background-color: #bfb;
  border-color: #bfb;
}

/*=======================|Box Carusel gallery|========================*/
.box-gallery-container{
   border: 1px solid rgb(221, 221, 221);
    border-radius: 5px;
    padding: 10px 0px; 
}

.box-gallery img{
	display: block; object-fit: cover;
	width:300px; height:169px;
	margin:0px 10px; border-radius: 5px;
	min-width: 300px;
}

/*--------------*/

.canvas_gallery{
	position: fixed; display:none;
	top: 0; left: 0;
	overflow: hidden;
	background: rgba(0,0,0,.7);
	width: 100%; height: 100%;
}

.canvas-center{
	display: flex; justify-content: center;
	align-items: center; height: 100%;
	z-index: 100;
}
.canvas-box {max-width: 70%; z-index: 100; position: relative;}

.canvas-box img{
	position:relative; width:100%;
	max-height:90vh; border-radius:5px;
}

.close_gallery{
	position: absolute; color: #fff;
	top: 30px; right: 40px;
	cursor: pointer; display: block;
	transform: scale(3); user-select: none;
}

.forward_gallery{
	position: absolute; z-index: 150;
	color: #fff; top: 100px; right:0px;
	cursor: pointer; display: block;
	user-select: none;
	height:100%; width:50%; font-size: 35px;
	padding-top: 10%; padding-right: 3%;
}

.back_gallery{
	position: absolute; z-index: 150;
	color: #fff; 
	top: 100px; left:0px;
	cursor: pointer; display: block;
	user-select: none;
	height:100%; width:50%;
	font-size: 35px; text-align: end;
	padding-top: 10%; padding-left: 3%;
	
}

.slide-thumbs{
	position: absolute;
	display:flex; flex-direction: row-reverse;
	width: 100%; z-index: 101;
}

.slide-thumb-item.active::after {
	animation: thumb 5s forwards linear;
	background-color: #fff;
	border-radius: 3px;
	content: '';
	display: block;
	height: inherit;
	transform: translateX(-100%);
}

.slide-thumb-item {
	background-color: rgb(0,0,0,0.4);
	border-radius: 3px;
	display: block;
	flex: 1;
	height: 3px;
	margin: 5px 3px;
	overflow: hidden;
}

@media(max-width:480px){
	.canvas-box{max-width:95% !important;}
	.forward_gallery{ font-size: 0px; }
	.back_gallery{ font-size: 0px; }
}

@keyframes thumb {
	to {
		transform: initial;
	}
}	

/*==========================|Drop Down shortCode|===========================*/

.drp_box{
	background: #f5f7fa; position: relative;
	padding: 0px 20px 20px 20px; border-radius: 10px;
	margin:20px 0px;
}
	
.drp_box div{display:none; text-align: justify; padding-top: 10px;}
.drp_box > div + p{display:none;}
.drp_box > p:nth-child(1){margin:0; padding:15px 0px 15px 50px; 
                          cursor: pointer; border-bottom:1px solid #ddd; 
                          font-weight:bold; color:#296fdd;}

.drp_box > p:nth-child(1):before{
    content: "";
    width: 16px;
    height: 16px;
    position: absolute;
    z-index: -1;
    top: 20px;
    left: 30px;
    border-left: 2px solid #296fdd;
    border-bottom: 2px solid #296fdd;
    transform: rotate(-45deg);
    z-index: 12;transition: 0.3s;
}

.open_drp:before{transform: rotate(135deg) !important; top: 26px !important; left: 30px !important;}

/*==========================|FAQ|===========================*/

.faq_sec{position:relative;margin-right:55px;font-size: 16px; text-align:justify; line-height: 1.8;}

.faq-qs{background: #ebf1f9;; padding:10px; border-radius: 5px; /*outline: 2px solid #eaeef4; outline-offset: -2px;*/}
.faq-ans{background: #f5f5f5; padding:10px; border-radius: 5px;}

.faq-qs:after{
    content: "?"; position: absolute;
    border: 2px solid #296fdd;
    width: 35px; top: 3px; right: -50px;
    border-radius: 5px; background: #fafdff;
    text-align: center; font-size: 22px;
    line-height: 1.5;
}



/*==========================|Plugin|===========================*/
.su-list ul li {
  line-height: 30px !important;
}

.su-list ul li {
line-height:30px !important;
}
.su-list ul li>i {
line-height:30px !important;
}


@media (max-width: 480px) {
	.kk-star-ratings{ display: grid !important; grid-gap: 20px; justify-content: center; }
}

.wpcf7-form textarea{width:100%;}
.wpcf7-submit{
    background:var(--Main_color);
    color:#fff; border:none; width: 70%;
    display: block; margin: auto; cursor: pointer;
}


/*=====================|Defult Css|=====================*/


/* Typography */

input, select, textarea {
  background: #f9f9f9; color: #313131;
  border: 1px solid #d9d9d9; border-radius:5px;
  padding: 7px 14px;  max-width: 100%;
  outline: 0;
  font-size: 18px;
}

textarea {padding-right: 3px; overflow: auto;}

li > ul,
li > ol {
	margin-left: 0;
	margin-right: 1.5em;
}

th:first-child,
td:first-child {
	padding-left: 0.4em;
	padding-right: 0;
}

th:last-child,
td:last-child {
	padding-left: 0;
	padding-right: 0.4em;
}



/*-----|Widgets|-----*/

.widget_rss .widget-title .rsswidget:first-child:not(.rss-widget-title) {
	float: left;
}

.tagcloud ul li { float: right; margin: 4px 0 0 4px; }
.widget_text ul { margin: 0 1.5em 1.5em 0; }
.widget_text ul li ul { margin: 0 1.5em 0 0; }

/*==============================================================*/
/*=============================|ACF|=============================*/

/*---------------|Category-menu|----------------*/
.content_tag_box{
    background: #fff; padding: 20px 10%;
    justify-content: center; align-content: center;
    text-align:center;
    display: flex; flex-wrap:wrap; font-size:16px;
}

.content_tag_box a{
    padding:5px 10px; border-radius:5px; color: #153648;
    border:1px solid #ddd; font-family: kalameh;
    margin:10px; min-width: 150px; max-width: 220px;
    background: linear-gradient(45deg,#f6f6f6,white); transition: 0.3s;
}

.content_tag_box a:hover{box-shadow:0px 0px 15px #c0cae3ad; transform: rotateZ(3deg);}

@media(max-width: 480px) {
    .content_tag_box{padding: 20px 5px;}
    .content_tag_box a{min-width: 120px;max-width: 200px;}
}


/*---------------|Tools|----------------*/

.frm_pic{margin:15px;padding: 0px 10px;}
.frm_pic div img{
    object-fit:cover; height:200px; width:100%;
    border-radius:10px; transition:0.5s;
}
.frm_pic div img:hover{box-shadow:0px 0px 25px #b8afd7;}


.Frame_pic{margin:15px; }
.Frame_pic img{
    height: auto; width: 75%; margin:auto; display: block;
    overflow: hidden;
    border-radius: 10px;
    object-fit: cover;
    transition:0.5s;
}
.Frame_pic img:hover{box-shadow:0px 0px 20px #b8afd7;}

@media(max-width: 480px) {
    .Frame_pic img{width:100%};
    .frm_pic div img{height:auto};
    .frm_pic{padding: 0px 0px;}
}

/*---------------|Notification|----------------*/

.top-notification{
    background: #ffce5e;
    display: flex;
    justify-content: center;
    text-align: center;
    padding: 10px 0px; 
}
.top-notification a{ font-family: kalameh; font-size: 20px; }

/*--------------------|سرقصل|------------------*/

.rookesh2::before{ content: ""; position: absolute;
		width: 300px; height: 200px;
		background: #ffefc8; border-radius: 20px;
		z-index: 0; transform: rotateZ(-25deg);
		top: -110px; right: -10px;}		

.ch_number{
    margin: 30px 20px 20px 0;  padding: 10px;
    position: relative;
    border-right: 3px solid #296fdd;
    border-bottom: 1px dashed #296fdd;
    border-radius: 10px;
    color: #296fdd;
    font-size:18px;
    display: grid; font-family:kalameh;
    grid-template-columns: 0.95fr max-content;
}

.sarfasl{margin-bottom:20px;}

.first_title{font-size:16px; margin-bottom:4px;
		cursor: pointer; overflow: hidden;
		line-height: 2; transition: 0.5s;
		display: grid; grid-template-columns: max-content auto;}

.first_title{font-size:16px; margin-bottom:4px;
		cursor: pointer; overflow: hidden;
		line-height: 2; transition: 0.5s;
		display: grid; grid-template-columns: max-content auto;}
		
.first_title div:nth-child(1){width: 40px; height: 40px; margin-left: 20px;
		border-radius: 50%; border: 3px solid var(--Main_color);
		color: #2250db; background: #fff; position:relative;}	
		
.first_title div:nth-child(1)::after{ content: ""; 
    	border-bottom: 3px solid var(--Main_color); position: absolute;
    	width: 30px; top: 50%; right: 100%;}
	
.first_title div:nth-child(1) span{ margin: auto;
		display: block; padding: 5px; text-align: center;
		position: relative; color:#393939;}
		
.first_title div:nth-child(2){
    background: linear-gradient(to right, rgb(247, 247, 247) 0%, #eef9ff  100%);
    border-radius:10px; border-right:3px solid var(--Main_color); z-index: 2;
    display: grid; grid-template-columns: 0.95fr max-content;font-size: 16px;
}

.first_title div:nth-child(2) span:nth-child(1){display: inline-block; padding: 3px 20px 0px 0px;
                                                color:var(--Main_color);font-size: 16px;}
.first_title div:nth-child(2) span:nth-child(2){padding: 5px 0px 0px 10px; color: #5e5e5e;}
	
.sarfasl ul{ list-style:none; padding-right:0px; color:#323232;
		     position:relative; display:none;font-size: 16px;}
	
.sarfasl ul li{padding-top:10px; display: grid; grid-template-columns: max-content auto;}

.sarfasl ul li div:nth-child(1){ margin: 0px 0px 10px 5px; padding: 5px;
		background: #fff; border: 3px solid var(--Main_color);
		border-radius: 50%; width: 40px; height: 40px; display:inline-block; }
		
.sarfasl ul li div:nth-child(1) span{margin: auto; display: block;
		     font-size: 18px; text-align: center; color:var(--Main_color);
            top: 2px; position: relative;
}
		     
.sarfasl ul li div:nth-child(1)::before{
		content: ""; color: #fff;
		font-size: 1.5rem; font-weight: bold;
		position: absolute; right: 20px;
		line-height:2; top: 0px;
		text-align: center; border-left: 3px solid var(--Main_color);
		z-index: -1; display:block; height:100%;}
		
.sarfasl ul li div:nth-child(2){ margin: 0px 18px auto 0px; padding:10px;
		border-radius:10px; border: 1px dashed #a8a8a8;
		display: grid; grid-template-columns: 1fr 80px 80px; background:#f2f2f2;}		


.sarfasl ul li div:nth-child(2) span:nth-child(2),
.sarfasl ul li div:nth-child(2) span:nth-child(3){text-align:center; color: #4e4e4e;}

.dl_sarfasl{font-size:20px; color:#393939;}
	
@media (max-width: 480px) {

		.sarfasl ul li div:nth-child(2) span:nth-child(1) { grid-area: c1; }
		.sarfasl ul li div:nth-child(2) span:nth-child(2) { grid-area: c2; margin-top: 10px;}
		.sarfasl ul li div:nth-child(2) span:nth-child(3) { grid-area: c3; }
		
		.sarfasl ul li div:nth-child(2){ display: grid; grid-template-columns: auto;
			grid-template-areas:
			'c1 c1'
			'c2 c3';
			grid-gap: 10px;
		}
	}

#sarfasl_ha h3{font-family:kalameh; color: #4a4a4a;}

/*--------------------|table of Content|------------------*/	
.tbl_content{background:#f5f7fa; position:relative; padding:20px; border-radius:10px; margin-bottom: 50px;}
.tbl_content br{display:none;}
.tbl_content a{color:#111;}
#tbl-title {border-bottom:1px solid #ddd; display: grid; grid-template-columns: 1fr max-content; font-family:kalameh;}
.hamberic{margin-left: 7px; font-size: 20px; cursor: pointer; user-select: none;}  

.tbl_content nav{margin-top:20px;}

.tbl_content ul {list-style: none; padding: 0; margin-right:50px; position:relative; }

.tbl_content ul li{padding:5px 0px; list-style: none;
    text-align: justify; text-justify: inter-word; text-indent: -31px;}

.tbl_content ul li:before{
    content: '';
    display: inline-block; position:relative; top:5px;
    margin-left:10px;
    height: 20px; width: 20px;
    background-image: url('images/Content/tbl_icon.svg'); background-size: contain;
}

@media(max-width: 600px) {
    .tbl_content ul {margin-right:25px; font-size:14px; }
    .tbl_content ul ul ul {margin-right:0px;}
    .tbl_content ul li{padding:8px 0px;}
}


/*==============================================================*/
/*==============================================================*/
/*========================|Defult Css|==========================*/


/*--------------------------|Title Css|--------------------------*/

.body-content h2{ position: relative; display: block;
            padding: 7px 25px 15px 0px;
            margin-top: 20px;
            margin-bottom: 25px;
            width: auto; text-align: right; 
            border-bottom: 1px solid #d0d0d0;
            font-size:23px;
            color:#4a4a4a;
            font-family: Kalameh !important;
            width: max-content;
    }
            
.body-content h2:before{
    content: ""; width: 180px; height: 0;
    display: inline-block; border-bottom: 3px solid #296fdd;
    position: absolute; bottom: -2px; right: 40px;
    border-radius: 50px; 
}

.body-content h2:after{
    content: ""; width: 70px; height: 70px;
    background: #e7f0fbad; position: absolute;
    right: 0; top: -10px; transform: rotate(25deg); z-index: -1;
    border-radius: 20px;
}

/*--------------------*/

.body-content h3{ position: relative; display: block;
            padding: 7px 25px 15px 0px;
            margin-top: 20px;
            margin-bottom: 25px;
            width: auto; text-align: right;
            border-bottom: 1px solid #d0d0d0;
            font-size:21px !important;
            color:#4a4a4a;
            font-family: Kalameh !important;
            width: max-content;
}
            
.body-content h3:before{
    content: ""; width: 180px; height: 0;
    display: inline-block;
    /*border-bottom: 3px solid #41914d;*/
    border-bottom: 3px solid #f7bc33;
    position: absolute; bottom: -2px; right: 40px;
    border-radius: 50px; 
}

.body-content h3:after{
    content: ""; width: 60px; height: 60px;
    /*background: #43bf5624;*/
    background: #f7bc3329;
    position: absolute;
    right: 0; top: 0px; transform: rotate(25deg); z-index: -1;
    border-radius: 20px;
}
         
/*--------------------*/

.body-content h4{ position: relative; display: block;
            padding: 7px 25px 15px 0px;
            margin-top: 20px;
            margin-bottom: 25px;
            width: auto; text-align: right;
            border-bottom: 1px solid #d0d0d0;
            font-size:21px !important;
            color:#4a4a4a;
            font-family: Kalameh !important;
            width: max-content;
}
            
.body-content h4:before{
    content: ""; width: 180px; height: 0;
    display: inline-block;
    /*border-bottom: 3px solid #41914d;*/
    border-bottom: 3px solid #aaa;
    position: absolute; bottom: -2px; right: 40px;
    border-radius: 50px; 
}

.body-content h4:after{
    content: ""; width: 60px; height: 60px;
    /*background: #43bf5624;*/
    background: #f2f2f2;
    position: absolute;
    right: 0; top: 0px; transform: rotate(25deg); z-index: -1;
    border-radius: 20px;
}

.body-content .subhead{position:relative;}
.body-content .subhead:after{
    content: "";
    width: 150px; height: 40px;
    background: #f6f2fb;
    position: absolute;
    right: 10px; top: 0px;
    transform: rotate(-5deg);
    z-index: -1;
    border-radius: 71% 29% 22% 78% / 67% 62% 38% 33%;
}

/*----------|Title for page|----------*/

.title-atr{
    font-family: Kalameh !important;
    font-size:26px;
}


/*----------|blockquote|----------*/

.body-content blockquote{
     padding:50px 20px 15px; margin:20px 0px;
     border-radius:10px;
     overflow:hidden;
     background:#f2f2f2;
     transition:.3s;
     position:relative
}

.body-content blockquote:before{
    position: absolute;
    content: '\201C';
    transform: rotateZ(180deg);
    top: -40px;
    color: #717171;
    font-size: 80px;
    transition: .4s;
    line-height: 1;
}

.body-content blockquote:hover::before {
     color:#df1c78;
     filter:drop-shadow(0px 0px 10px #df1c787d)
}

.body-content blockquote p {
     margin-bottom:10px!important
}

.body-content blockquote>:first-child::before {
     content:'';
     position:absolute;
     width:300px;
     height:200px;
     background:#eee;
     border-radius:20px;
     z-index:-2;
     transform:rotateZ(-25deg);
     top:-110px;
     right:-25px
}

.body-content .pullquote {
     float:left;
     font-style:italic;
     font-size:1.1em;
     padding-right:14px;
     border-right:3px solid #d9d9d9;
     max-width:35%
}

@media (max-width:480px) {
 .body-content blockquote {
  margin-right:0
 }
}


/*-----------------------|List Style|---------------------------*/

ul.greylist {list-style: none; padding: 0;}

ul.greylist li{padding-top:5px; padding-bottom:5px;list-style: none;
    text-align: justify; text-justify: inter-word; text-indent: -11px;}

ul.greylist li:before {
  content:"✔";
  display: inline-block;
  margin-left:10px;
  color:#979797;
}
/*----------------------------------*/

ul.redlist {list-style: none; padding: 0;}

ul.redlist li{padding-top:5px; padding-bottom:5px;list-style: none;
    text-align: justify; text-justify: inter-word; text-indent: -11px;}

ul.redlist li:before{
 content:"✔";
 display: inline-block;
 margin-left:10px; color:#9f1247;
}

/*----------------------------------*/

ul.tick_list {list-style: none; padding: 0; margin-right:50px; }

ul.tick_list li{padding-top:5px; padding-bottom:10px; list-style: none; 
    line-height:2; text-align: justify;
    text-justify: inter-word; text-indent: -31px;}
    

ul.tick_list li:before{
    content: '';
    display: inline-block; position:relative; top:5px;
    margin-left:10px;
    height: 20px; width: 20px;
    background-image: url('images/Content/tick.svg');
}

/*----------------------------------*/

ul.downloadlist {list-style: none; padding: 0; margin-right:35px;}

ul.downloadlist li{padding-top:5px; padding-bottom:5px;list-style: none;
    line-height:2;
    text-align: justify;
    text-justify: inter-word;
    text-indent: -11px;}

ul.downloadlist li:before {
  content:"";
    display: inline-block; position:relative; top:5px;
    margin-left:15px;
    height: 20px; width: 20px;
    background-image: url('images/Content/download_icon.svg');
    scale: 1.5;
}

@media (max-width:480px){
    div ul.downloadlist {margin:15px;}
    div ul.downloadlist li{text-indent: 0px;}
}

/*-----------------------|دانلود باکس|---------------------------*/

ol.Box_download{
    counter-reset: my-awesome-counter;
    list-style: none;
    margin:20px 0px 20px 0px;
}

ol.Box_download > li{
 counter-increment: my-awesome-counter;
 position: relative; display:block;
 border-right: 2px solid #ddd;
 padding:20px 30px 5px 0px;
 margin-right:35px !important;
 text-align: justify !important;
}

ol.Box_download li:last-child{padding-bottom: 25px;}
		
ol.Box_download li a{color: #2d2d2d;text-decoration:none;}	
		
		
ol.Box_download li::before {
 content: counter(my-awesome-counter);
 color: #fff; font-size: 15px;
 font-weight: normal; position: absolute;
 right: calc(-1 * 40px + 20px);
 line-height: 1.9; width: 35px; height: 35px; top: 19px;
 background: #aaa; border-radius: 50%;
 text-align: center; border: 4px solid #fff;
}
		
ol.Box_download p{padding:15px; font-size:18px;}

@media (max-width:480px){
    ol.Box_download li{padding:20px 25px 5px 0px; margin-right:15px !important;}
}

/*----------Grey-------------*/
ol.kh_list{counter-reset: my-awesome-counter; list-style: none;margin:0px 0px 10px 0px;}

ol.kh_list > li{
 counter-increment: my-awesome-counter;
 position: relative; display:block;
 border-right: 2px solid #c6c6c6;
 padding:20px 40px 5px 0px;
 margin-right:30px !important;
 text-align: justify !important; line-height:2;
}

ol.kh_list li:last-child{padding-bottom: 25px;}
		
ol.kh_list li a{color: #2d2d2d;text-decoration:none;}	
		
		
ol.kh_list li::before {
 content: counter(my-awesome-counter);
 font-size: 17px; font-weight: normal;
 position: absolute;
 right: calc(-1 * 40px + 22px);
 line-height: 1.7;
 width: 30px; height: 30px; top: 19px;
 background: #fff;
 border-radius: 50%;
 text-align: center;
 border: 2px solid #c6c6c6;
}
		
ol.kh_list p{padding:15px; font-size:18px;}

@media (max-width:480px){
    
    ol.kh_list li{padding:20px 25px 5px 0px; margin-right:15px !important;}
}

/*----------blue-------------*/

.relatedd{
	counter-reset: my-awesome-counter; list-style: none;
	margin: 20px 10px !important; display: block;
}

.relatedd li {
	counter-increment: my-awesome-counter; position: relative;
	display: block; margin: auto; line-height:2;
	padding: 10px 60px 15px 0; font-size: 16px;
}

.relatedd li::before {
	content: counter(my-awesome-counter);
	color: #296fdd; background: #fff;
	font-size: 17px; position: absolute;
	top: 10px; right: 0;
	line-height: 1.7; width: 30px; height: 30px;
	border-radius: 50%; z-index: 2;
	text-align: center; border: 2px solid #296fdd;
}

.relatedd  li::after {
	content: ""; position: absolute;
	right: 15px; top: 0;
	text-align: center;
	border-left: 2px solid #296fdd;
	z-index: 0; height: 100%;
	display: block;
}

.relatedd li a{ color:#296fdd; }
.afc-related li a{ color:#454545; }


@media (max-width: 480px) {
	.relatedd{padding-right:5px !important;}
	.relatedd li {padding: 10px 50px 15px 0;}
	ul.iconlist{padding-right: 15px !important; text-align:justify;}
}

/*-----------------------|Column|---------------------------*/

.sotoon2 {display: grid; grid-gap: 60px; grid-template-columns: 1fr 1fr; margin: 8px 0px;}
.sotoon3{display: grid; grid-gap:40px; grid-template-columns: 1fr 1fr 1fr; margin:5px 0px; padding:0px 10px;}

@media(max-width: 480px) {
  .sotoon2{grid-template-columns: minmax(0px,auto);}
  .sotoon3{grid-template-columns: 1fr 1fr;}
  
}

/*-----------------------|Box Grey|---------------------------*/


.syntax{padding:10px; border-right: 3px solid #3D9970;
        border-radius:5px; background-color: #f1f1f1; }

.box_blue{padding:15px; border-radius:8px; background-color: #eaf5fe99; }
.box_green{padding:15px; border-radius:8px; background-color: #195359;}

.box_grey{
    text-align: justify; display: block;
    background: #f4f4f4; padding: 10px 25px;
    border-radius: 10px; border: 1px solid #ccc;
}

.box_content{
	margin: 25px 15px; background: #fff;
    border-radius: 5px; box-shadow: 0px 0px 5px #cecece;
    overflow:hidden; z-index: 0; position: relative;
}

.box_content > div:nth-child(2){padding: 25px 40px 20px 40px;}

@media (max-width: 480px) {
	.box_content > div:nth-child(2) {padding: 30px 15px 20px 15px;}
	.support_pr img{width:100%;}
	.box_sug::after{top: 14%;}
}

.box_hover:hover{transform: rotateZ(-2deg);filter: drop-shadow(0px 0px 25px #eeceda);}

/*----------box_sug-------------*/

.box_sug{
	background:#eee;
	border-radius: 5px;
	padding: 20px 90px 5px 20px;
	width: 100%; box-sizing: border-box;
	overflow:hidden;
	position:relative; z-index:0;
}

.box_sug::before{
	content: ""; position: absolute;
	width: 300px; height: 200px;
	background: #cc1c6f; border-radius: 20px;
	z-index: -2; transform: rotateZ(35deg);
	top: -39px; right: -237px;
	transition:1s;
}

.box_sug::after{
	content: "\f0f3";
	font-family: FontAwesome;
	z-index: 3;
	top: 24%; right: 24px;
	position: absolute;
	transform: scale(2.5);
    color: #fff;
    transition:0.5s;
}

.box_sug:hover::after{color: #df1c78;}
.box_sug:hover::before{background: #fff;}

/*-----------------------|Button|---------------------------*/

.bold {
	background: linear-gradient(90deg,#fce3ec,#ffe8cc);
	font-size: 90%; word-wrap: break-word;
	padding: .1rem .6rem .2rem; border-radius: .2rem;
	color: #222 !important;
}

.btn_bold {
  background: linear-gradient(745deg,#388c70,#23b181);
  word-wrap: break-word;
  cursor: pointer;
  padding: 5px 15px;
  transition: 0.5s;
  border-radius: 6px;
  color: #fff !important;
}

.btn_bold:active{background: linear-gradient(745deg,#23b181,#388c70);}

.center_heading{display:block !important; text-align:center !important;}

/*-----------------------|table|---------------------------*/

.negah-table {margin: 0 auto 40px auto; width: 100%; display:block; 
              max-width:max-content; overflow-x:auto;}

.negah-table th{padding:4px 2px; color: #fff;
                background: #27ae60; border: solid 1px #c1c1c1; 
                font-weight:normal; font-size: 0.9em;
                text-align:center;min-width: 70px;
                position: sticky;
                top: 0;z-index: 2;
                max-width:200px;}

.negah-table td{padding: 10px; margin: auto; text-align:center; font-size:14px;}

.negah-table tr:nth-child(2n+1){background: #f1f1f1;}

.negah-table tr:nth-child(2n) td{background: #f1f2f1;}

.negah-table tr:hover{background: #fff9ed;}

.negah-table_background_red th{background: #ea6153; border: solid 1px #ea6153;}

.negah-table_background_blue th{background: #2980b9; border: solid 1px #2980b9;}


@media only screen and (max-width: 760px),
(min-device-width: 768px) and (max-device-width: 1024px)  {
    
	.negah-table table { width: 100%; }
	/*table, thead, tbody, th, td, tr {display: block;}*/

	/*.negah-table thead tr {position: absolute; top: -9999px; left: -9999px;}*/

	.negah-table td { border: none; position: relative; }
   /* .negah-table td{border:1px solid #c1c1c1;}*/
    
	.negah-table td:before {position: absolute; top: 6px; left: 6px;
		width: 45%; padding-right: 10px; white-space: nowrap;
		/* Label the data */
		content: attr(data-column);
		color: #000;
		font-weight: bold;
	}

}