:root {
	--green-light: #38c206;
	--green-dark: #118305;
	--red-light: #ff0009;
	--red-dark: #ba0006;
	--khaki-light: #efece7;
	--khaki-dark: #ebe5df;
	--black: #000;
	--light: #fefefe;
    --black-s: #666666;
    --theme-black: #272839;
}
@font-face {
	font-family: BYekan;
	font-style: normal;
	font-weight: bold;
	src: url('../../fonts/BYekan.eot');
	src: url('../../fonts/BYekan.eot?#iefix') format('embedded-opentype'),  /* IE6-8 */
		 url('../../fonts/BYekan.woff') format('woff'),  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
		 url('../../fonts/BYekan.ttf') format('truetype');
}


@font-face {
  font-family: 'iranSans';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/iranSans/IRANSans.eot');
  src: url('../fonts/iranSans/IRANSans.eot?#iefix') format("embedded-opentype"),
       url('../fonts/iranSans/IRANSans.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/iranSans/IRANSans.svg') format("svg"), /* Legacy iOS */
       url('../fonts/iranSans/IRANSans.woff') format("woff"), /* Modern Browsers */
       url('../fonts/iranSans/IRANSans.woff2') format("woff2"); /* Modern Browsers */
}


body {
	/* font-family: BYekan  !important; */
    font-family: iranSans  !important;
	/* direction: rtl; */
    font-size: .85rem !important;
}
h1, h2, h3, h4, h5, h6,input, textarea {
	font-family: iranSans !important;
	/* font-weight: bold; */
}
.text-red-light {
	color: var(--red-light);
}
.text-red-dark {
	color: var(--red-dark);
}
.text-green-light {
	color: var(--green-light);
}
.text-green-dark {
	color: var(--green-dark);
}
.bg-black {
	background-color: var(--black);
}
.bg-khaki-light {
	background-color: var(--khaki-light);
}
.bg-khaki-dark {
	background-color: var(--khaki-dark);
}
.v-align-middle,
.table-cart td,
.table-order td {
	vertical-align: middle;
}

.top-nav .navbar-nav,
.menu-nav .navbar-nav {
	padding-right: 0;
    text-align: right;
}
.top-nav .navbar-toggler {
	border-color: var(--green-light);
}
.top-nav .navbar-toggler-icon {
	background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%2856, 194, 6, 0.5%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}
.top-nav .nav-link {
	font-weight: bold;
}
.top-nav .nav-item .icon {
	color: var(--green-light);
}
.top-nav .nav-item.active .icon {
	color: var(--red-light);
}
.top-nav .navbar-collapse .btn {
	position: relative;
}
.top-nav .navbar-collapse .btn>.badge {
	position: absolute;
	right: -8px;
	top: -8px;
}
.btn-green-light {
	color: #fff;
	background-color: var(--green-light);
	border-color: var(--green-light);
}
.btn-green-light:hover {
    color: #fff;
    background-color: var(--green-dark);
    border-color: var(--green-dark);
}
.bg-green-dark,
.btn-green-dark {
	color: #fff;
	background-color: var(--green-dark);
	border-color: var(--green-dark);
}
.btn-green-dark:hover {
    color: #fff;
    background-color: var(--green-light);
    border-color: var(--green-light);
}
.btn-red-light {
	color: #fff;
	background-color: var(--red-light);
	border-color: var(--red-light);
}
.btn-red-light:hover {
    color: #fff;
    background-color: var(--red-dark);
    border-color: var(--red-dark);
}
.btn-red-dark {
	color: #fff;
	background-color: var(--red-dark);
	border-color: var(--red-dark);
}
.btn-red-dark:hover {
    color: #fff;
    background-color: var(--red-light);
    border-color: var(--red-light);
}
.btn-khaki {
	color: #000;
	background-color: var(--khaki-light);
	border-color: var(--khaki-light);
}
.btn-khaki:hover,
.btn-khaki.active {
    color: #000;
    background-color: var(--khaki-dark);
    border-color: var(--khaki-dark);
}
.btn-khaki-dark {
	color: #000;
	background-color: var(--khaki-dark);
	border-color: var(--khaki-dark);
}
.btn-khaki-dark:hover,
.btn-khaki-dark.active {
    color: #000;
    background-color: var(--khaki-light);
    border-color: var(--khaki-light);
}

section#slider {
	/* border-bottom: 3px solid var(--green-light);*/
}
section#slider .carousel-caption {
	text-align: right;
	bottom: 100px;
}
section#slider .carousel-text {
    max-width: 350px;
    background-color: var(--khaki-light);
    color: var(--black);
	border-radius: 40px;
	padding: 20px 35px;
	font-weight: bold;
}
section#slider .btn-carousel {
	border-radius: 20px;
	margin-right: 30px;
}

.process-step{

/*
margin-bottom: 30px;
    padding-top: 40px;
    padding-bottom: 40px;
    border-style: solid;
    border-width: 1px;
    border-color: rgb(232, 232, 239);
    background-color: rgb(255, 255, 255);
    box-shadow: 0px 0px 30px 0px rgb(0 0 0 / 4%); */

    border-style: solid;
    border-color: rgb(232, 232, 239);
    box-shadow: 0px 0px 30px 0px rgb(0 0 0 / 4%);
    margin-bottom: 30px;
    padding-top: 40px;
    padding-bottom: 40px;
    max-height: 250px;
	max-width: 200px;
	border-width: 1px;
}

.process-step img {

max-width:70%;
}
@media(max-width:767px) {
	section#process .process-step > img{
		max-width:70%;
		height: auto;
	}
}
section#process > .process-container {
	background-color: var(--khaki);
}
section#process > .process-container img.logo {
	position: relative;
	top: -7px;
	max-width: 60px;
	height: auto;
}
section#process > .process-container h2 {
	color: black;
}
.process-step>p {
	text-align: center;
	font-weight: bold;
	color: black;
}



section#pros {
	/* border-top: 3px solid var(--green-light);
	border-bottom: 3px solid var(--green-light); */
}
section#pros img{
	width: 100px;
}
section#pros .card{
	border: none;
	border-radius: 2.5rem;
	box-shadow: 0 0 35px -10px #999;
}
section#pros .card-title{
	font-weight: bold;
	color: var(--red-light );
}
section#pros .card-text{
	font-weight: bold;
	color: var(--green-light);
}
section#pros .card-footer{
	background: none;
	border-top: none;
}
section#pros .btn {
	font-weight: bold;
	border-radius: 1rem;
}

.aparat {
	width: 28px;
	height: 28px;
	background-image: url("../images/icons/aparat-green.png");
	background-repeat: no-repeat;
	background-size: 28px 28px;
    position: absolute;
	right: 86px;
    margin: 2px 6px;
}
.socials>a:hover>.aparat {
	background-image: url("../images/icons/aparat-red.png");
}
.menu-nav {
	border-bottom: 5px solid var(--green-dark);
}
.menu-nav .navbar-nav .nav-link {
	font-weight: bold;
	font-size: 1.5rem;
	color: var(--black);
}
.menu-nav .navbar-nav .active>.nav-link,
.menu-nav .navbar-nav .nav-link.active,
.menu-nav .navbar-nav .nav-link.show,
.menu-nav .navbar-nav .show>.nav-link {
	color: var(--red-dark);
}
.filter-item {
	background-color: var(--white);
	color: var(--black);
}
.cart-side {
	border-radius: unset;
	background-color: var(--khaki-light);
}
.cart-side .badge {
	position: absolute;
	right: -8px;
	top: -8px;
	font-size: small;
}
.cart-side .table {
	border-collapse: separate; 
	border-spacing: 0 .5em;
}
.cart-side .table-striped tbody tr:nth-of-type(odd),
.modal .table-striped tbody tr:nth-of-type(odd) {
	background-color: var(--white);
}
.cart-side .table-striped tbody tr:nth-of-type(even),
.modal .table-striped tbody tr:nth-of-type(even) {
	background-color: var(--khaki-dark);
}
#priceList {
	background-color: var(--white);
}
#priceList p {
	border-bottom: 1px dashed var(--black);
}
.cart-side textarea {
	border: none;
	width: 100%;
}

.table-cart input,
.table-cart textarea,
.table-order input,
.table-order textarea {
  border: none;
  background-color: unset;
  box-sizing: border-box;
  margin: 0;
  outline: none;
  padding: 10px;
}

.table-cart input[type="button"],
.table-cart input[type="button"] {
  -webkit-appearance: button;
  cursor: pointer;
}

.table-cart input::-webkit-outer-spin-button,
.table-cart input::-webkit-inner-spin-button,
.table-order input::-webkit-outer-spin-button,
.table-order input::-webkit-inner-spin-button {
  -webkit-appearance: none;
}

.table-cart .input-group,
.table-order .input-group {
  clear: both;
  margin: 15px 0;
  position: relative;
}

.table-cart .input-group input[type='button'],
.table-order .input-group input[type='button'] {
  /* background-color: none; */
  min-width: 16px;
  width: auto;
  transition: all 300ms ease;
}

.table-cart .input-group .button-minus,
.table-cart .input-group .button-plus,
.table-order .input-group .button-minus,
.table-order .input-group .button-plus {
  font-weight: bold;
  height: 38px;
  padding: 0;
  width: 38px;
  position: relative;
  /* border: none; */
  /* background-color: none; */
}

.table-cart .input-group .quantity-field,
.table-order .input-group .quantity-field {
  position: relative;
  height: 38px;
  left: 0;
  text-align: center;
  width: 52px;
  display: inline-block;
  font-weight: bold;
  font-size: 20px;
  margin: 0 0 5px;
  resize: vertical;
  color: var(--red-dark);
  padding: 3px;
}

section.menu-cat .card {
	border: none;
}
section.menu-cat .card,
section.menu-cat .card .list-group-item {
	background-color: var(--light);
}
section.menu-cat .card .list-group {
	border-top: 1px solid var(--khaki-light);
}
section.menu-cat .card-footer p {
	font-weight: bold;
	font-size: .8rem;
}
section.menu-cat:not(:last-child) {
	border-bottom: 3px solid var(--green-light);
}
section.menu-cat:not(:first-child) > h2 {
	margin-top: 1.5rem;
}
#iranian .card-text,
#international .card-text,
#salad .card-text {
	height: 1.6rem;
    overflow: hidden;
}

.modal-header .close {
	margin-left: -1rem;
	margin-right: auto;
}

.recipe-hero {
	margin-top: 5rem;
	border-bottom: 3px solid var(--green-light);
}
.recipe-hero img{
	border-radius: 70px;
	margin-bottom: 2rem;
}
.recipe-hero h1 {
	font-size: 2rem;
}
.recipe-hero h1 {
	font-size: x-large;
}
#pros,
#testimonials0 {
	 /* background: url("../images/icons/bg-cook.png"); */
}
.recipe-hero .btn-red-dark,
#favorites .btn,
#similars .btn,
.recipe .card-img {
	border-radius: 30px;
}
.favorite-item,
.favorite-item:hover,
.similar-item,
.similar-item:hover {
	text-decoration: none;
}
.similar-item,
.similar-item:hover {
	color: var(--black);
}
.favorite-item {
	color: var(--green-light);
}
.favorite-item:hover {
	color: var(--red-light);
}
.testimonial-img,
.favorite-item>.favorite-item-img>img,
.similar-item>.similar-item-img>img {
	border-radius: 50%;
	padding: .25em;
	background-color: var(--khaki-light);
	border: 5px solid var(--green-light);
}
.favorite-item:hover>.favorite-item-img,
.similar-item:hover>.similar-item-img {
	border-color: var(--red-light);
}
/* .favorite-item>.favorite-item-img>img,
.similar-item>.similar-item-img>img {
	border-radius: 50%;
} */
.favorite-item>h5,
.similar-item>h5 {
	font-size: 1.2rem;
}
.recipe:last-child .card {
	border: none;
	border-top: 3px solid var(--khaki-light);
}
.recipe {
	border-bottom: 5px solid var(--khaki-light);
}
.recipe-hero .tag {
	position: absolute;
	width: 100px;
	height: 100px;
    top: -32px;
	left: 10px;
}
.recipe-hero .tag.tag-chef-suggestion {
	background-image: url("../images/chef-suggestion.png");
	background: url("../images/chef-suggestion.png") no-repeat top left 100px 100px fixed;
}
.ingredients h4 {
	border-bottom: 5px solid var(--green-light);
}
.ingredients .card-img {
	border-radius: 50%;
}
.no-border {
	border: none;
}
.border-radius-30 {
	border-radius: 30px;
}
.recipe-info h5 {
	background-color: var(--green-light);
	border-radius: 30px;
}
#testimonials ,#testimonials0 {
	border-top: 3px solid var(--green-light);
}
.ribbon {
	width:56px;
	height:65px;
	background-color: var(--green-light);
	position:absolute;
	left: 20px;
    color: var(--white);
    text-align: center;
    font-size: 1.5rem;
    padding-top: 15px;
}
.ribbon:before {
	content: '';
	position: absolute;
	z-index: 2;
	left: 0;
	bottom: -25px;
	border-left: 28px solid var(--green-light);
	border-right: 28px solid var(--green-light);
	border-bottom: 25px solid transparent;
}
.card .tag {
	position: absolute;
	top: 5px;
	right: 7px;
}
.card .tag.tag-chef-suggestion {
	width: 70px;
	height: 70px;
	background-image: url("../images/chef-suggestion.png");
	background-size: 70px;
	background-repeat: no-repeat;
}
.card .tag.tag-organic {
	width: 70px;
	height: 86px;
	background-image: url("../images/organic.png");
	background-size: 70px 86px;
	background-repeat: no-repeat;
}
#filter .btn-group .btn-khaki {
	padding-top: .6rem;
	padding-bottom: .6rem;
}
#filter .btn-group>.btn-group:not(:last-child)>.btn, .btn-group>.btn:not(:last-child):not(.dropdown-toggle) {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}
#filter .btn-group>.btn-group:not(:first-child)>.btn, .btn-group>.btn:not(:first-child) {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}
.btn-khaki-outline {
    color: var(--black);
    background-color: var(--white);
    border-color: var(--khaki-dark);
    border-width: 5px 3px;
}
.btn-khaki-outline:not(:disabled):not(.disabled).active, .btn-khaki-outline:not(:disabled):not(.disabled):active, .show>.btn-khaki-outline.dropdown-toggle {
    color: #fff;
    background-color: var(--red-dark);
    border-color: var(--khaki-dark);
}
.form-check {
	padding-left: unset;
	padding-right: 1.25rem;
}
.form-check-input {
    position: absolute;
    margin-top: .3rem !important;
    margin-right: -1.25rem !important;
}
.slick-prev, .slick-next {
	top: 40% !important;
}
.slick-prev:before, .slick-next:before {
	font-size: 35px !important;
	color: var(--red-light) !important;
}

/* ----- Navbar -----*/

div.navbar-set {
    width: 1300px !important;
}

div#navbarSupportedContent ul.navbar-nav li.nav-item {
    margin: 1rem 1.5rem !important;
    color: #fff !important;
}

div#navbarSupportedContent ul.navbar-nav li.nav-item a.nav-link {
    color: var(--black-s) !important;
}

div#navbarSupportedContent ul.navbar-nav li.nav-item a.nav-link {
  border-bottom: 1px solid #fff !important;
}

div#navbarSupportedContent ul.navbar-nav li.nav-item a.nav-link:hover {
  border-bottom: 1px solid var(--black-s) !important;
}

a.navbar-brand img {
    max-width: 130px;
}

.discount-section {
    padding: .8rem 5px 5px 5px
}

.discount-section p span {
    font-size: .95rem !important;
}

.top-nav {
	/* background-color: var(--white); */
	/* border-top: 6px solid var(--green-light);*/
	/* border-bottom: 3px solid var(--red-light);*/
    /* background-color: white !important; */
    /* background-color: #272839 !important; */
    /* background-color: #595959 !important; */
    background-color: #fff !important;
}


/* ----- Navbar -----*/

/* ----- Footer -----*/

ul.footer-nav-list li.nav-item {
    margin: 1rem .2rem;
}

ul.footer-nav-list li.nav-item a.nav-link {
    color: #fff !important;
}

ul.footer-nav-list li.nav-item a.nav-link {
  /* border-bottom: 1px solid #272839; */
}

ul.footer-nav-list li.nav-item a.nav-link:hover {
    /* border-bottom: 1px solid #fff; */
    /* font-size: 1rem; */
    color: var(--green-light) !important;
}

p.socials a {
    color: #fff;
}

.contact-sec p {
    color: #fff !important;
}

/* ----- Footer -----*/

/* -----Index ----- */

.introduce-sec {
    display: flex;
    flex-direction: row;
    justify-content: center;
    padding: 1rem 8.5rem;
}

.introduce-sec div {
    margin: 1rem 2rem;
   /* width: calc(20% - 4rem); */
    border-radius: 5px;
    box-shadow: 5px 2px 12px #aaaaaa;
    padding: 2.5rem .8rem;
}

.introduce-sec div:hover {
    box-shadow: 10px 3px 18px #aaaaaa;
}

.introduce-sec div p {
     margin-top: .8rem;
}

footer {
	border-top: 3px solid var(--green-light);
	/* background-color: var(--khaki-light); */
    background-color: var(--theme-black);
    padding: 5rem 1rem;
	color: var(--green-light);
	/* font-weight: bold; */
}

footer a {
	/* color: var(--green-light); */
	text-decoration: none;
    color: #fff;
}

footer a:hover {
	color: var(--red-light);
	text-decoration: none;
}

/* -----Index ----- */


ul {
    list-style-type: none;
}


/* The snackbar - position it at the bottom and in the middle of the screen */
#snackbar {
  visibility: hidden; /* Hidden by default. Visible on click */
  min-width: 250px; /* Set a default minimum width */
  margin-left: -125px; /* Divide value of min-width by 2 */
  background-color: #333; /* Black background color */
  color: #fff; /* White text color */
  text-align: center; /* Centered text */
  border-radius: 2px; /* Rounded borders */
  padding: 16px; /* Padding */
  position: fixed; /* Sit on top of the screen */
  z-index: 1; /* Add a z-index if needed */
  left: 50%; /* Center the snackbar */
  bottom: 30px; /* 30px from the bottom */
}

/* Show the snackbar when clicking on a button (class added with JavaScript) */
#snackbar.show {
  visibility: visible; /* Show the snackbar */
  /* Add animation: Take 0.5 seconds to fade in and out the snackbar.
  However, delay the fade out process for 2.5 seconds */
  -webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;
  animation: fadein 0.5s, fadeout 0.5s 2.5s;
}

/* Animations to fade the snackbar in and out */
@-webkit-keyframes fadein {
  from {bottom: 0; opacity: 0;}
  to {bottom: 30px; opacity: 1;}
}

@keyframes fadein {
  from {bottom: 0; opacity: 0;}
  to {bottom: 30px; opacity: 1;}
}

@-webkit-keyframes fadeout {
  from {bottom: 30px; opacity: 1;}
  to {bottom: 0; opacity: 0;}
}

@keyframes fadeout {
  from {bottom: 30px; opacity: 1;}
  to {bottom: 0; opacity: 0;}
}
/*kh*/
.chooseTime{
	width: 100%;
	margin-top: 130px;
}
.chooseTime .chooseTimeButtons{
	overflow: hidden;
}
.chooseTime .chooseTimeButtons > div{
	width: 50%;
	overflow:hidden ;
	float: right;
}

.chooseTime .chooseTimeButtons > div > div{
	width: 300px;
	height: 300px;
	min-height: 200px;
	margin: 0 auto;
	position: relative;
}
.chooseTime .chooseTimeButtons > div a{
	/* background-color: blue; */
	display: block;
	width: 100%;
	height: 100%;
	text-align: center;
	padding-top: 80px;
	color: #fff;
	text-decoration: none;
	-webkit-user-select: none; /* Safari */
	-moz-user-select: none; /* Firefox */
	-ms-user-select: none; /* IE10+/Edge */
	user-select: none;
	font-size: 1.5rem;
	/*filter: grayscale(100%);*/
	/*-webkit-filter: grayscale(100%);*/
	/*-webkit-transition: all 1s ease;*/
	-webkit-filter: brightness(80%);
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-o-transition: all 1s ease;
	-ms-transition: all 1s ease;
	transition: all 1s ease;
}
.chooseTime .chooseTimeButtons > div a:hover{
	/*filter: grayscale(0%);*/
	/*filter: gray;*/
	/*-webkit-filter: grayscale(0%);*/
	/*filter: none;*/
	/*transition: 0.7s ease;*/

	-webkit-filter: brightness(100%);
}
.chooseTime .chooseTimeButtons > div  span{
	position: absolute;
	bottom: 110px;
	z-index: 2;
	right: 33%;
	color: #fff;
	font-size: 0.7rem;
	-webkit-user-select: none; /* Safari */
	-moz-user-select: none; /* Firefox */
	-ms-user-select: none; /* IE10+/Edge */
	user-select: none;
}
.chooseTime .chooseTimeButtons > div a:hover{
	/* background-color: var(--blue); */
}

.chooseTime .chooseTimeTextBox .sombra {
	-webkit-box-shadow: 0px 10px 6px -6px #777;
	-moz-box-shadow: 0px 10px 6px -6px #777;
	box-shadow: 0px 10px 6px -4px #777;
}
.chooseTime .chooseTimeTextBox .box {
	width: 70%;
	color: white;
	padding: 25px;
	text-align: justify;
	background: #28B1C4; /* For browsers that do not support gradients */
	background: -webkit-linear-gradient(left top, #1e7e34, #38c206); /* For Safari 5.1 to 6.0 */
	background: -o-linear-gradient(bottom right, #1e7e34, #38c206); /* For Opera 11.1 to 12.0 */
	background: -moz-linear-gradient(bottom right, #1e7e34, #38c206); /* For Firefox 3.6 to 15 */
	background: linear-gradient(to bottom right, #1e7e34, #38c206); /* Standard syntax */
	margin: 40px auto;
	border-radius: 0px 50px 0px 50px;
}
@media screen and (max-width: 620px) {
	.chooseTime{
		margin-top: 60px;
	}
	.chooseTime .chooseTimeButtons > div{
		width: 100%;
		overflow:hidden ;
		float: right;
	}
	.chooseTime .chooseTimeButtons > div > div{
		margin-top: 10px;
	}
}
/*error message*/
.message p{
	background-color: var(--danger);
	padding: 7px 5px;
	color: var(--khaki-light);
}
.messageBox p{
	background-color: var(--red-light);
	color: var(--light);
	padding: 10px;
}