.banner .dandik {

	right: 30px

}

.banner {

	margin-bottom: 20px;

}

.banner .bamdik {

	left: 30px

}

.banner .slick-dots {

	bottom: 50px

}

.banner-part {

	padding: 50px 0px 60px;

	margin-bottom: 25px;

	position: relative;

	z-index: 1

}

.banner-part::before {

	position: absolute;

	content: "";

	top: 0px;

	left: 0px;

	width: 100%;

	height: 100%;

	z-index: -1;

	background: url(../../images/banner-shape.png);

	background-repeat: no-repeat;

	background-position: center;

	background-size: cover

}

.banner-1 {

	background: linear-gradient(to right, #45f76354, #ffc3d024)

}

.banner-2 {

	background: linear-gradient(to left, #45f76354, #ffc3d024)

}

.banner-2 .banner-content {

	text-align: right

}

.banner-content h1 {

	text-transform: capitalize;

	margin-bottom: 22px

}

.banner-content p {

	font-size: 18px;

	line-height: 28px;

	margin-bottom: 50px

}

.banner-btn .btn {

	margin-right: 15px

}

.banner-img img {

	width: 100%

}

@media (max-width: 767px) {

	.banner-content h1 {

		font-size: 38px;

		line-height: 48px

	}

	.banner-img {

		display: none

	}

	.banner-btn .btn {

		margin: 8px

	}

}

@media (min-width: 768px) and (max-width: 991px) {

	.banner-content h1 {

		font-size: 32px;

		line-height: 42px

	}

	.banner-btn .btn {

		padding: 14px 22px;

		margin-right: 10px

	}

}

.suggest-slider li {

	margin: 0px 10px

}

@media (max-width: 575px) {

	.suggest-slider li {

		margin: 0px 5px

	}

}

.promo-img {

	width: 100%;

	overflow: hidden;

	border-radius: 8px

}

.promo-img a {

	width: 100%

}

.promo-img a img {

	width: 100%;

	border-radius: 8px;

	transition: all linear .3s;

	-webkit-transition: all linear .3s;

	-moz-transition: all linear .3s;

	-ms-transition: all linear .3s;

	-o-transition: all linear .3s

}

.promo-img a img:hover {

	transform: scale(1.05)

}



.categ-img {

	width: 100%;

	position: relative;

	overflow: hidden;

	border-radius: 8px;

	    margin-bottom: 15px;

    margin-top: 15px;

}

.categ-img .cat-title{

	

    color: #000000;

    font-size: 18px;

    

    text-align: center;

  

    text-transform: capitalize;

 

    padding-top: 15px;

}

.categ-img  {

	width: 100%

}

.categ-img  img {

	/* width: 100%;



	border-radius: 8px;

	transition: all linear .3s;

	-webkit-transition: all linear .3s;

	-moz-transition: all linear .3s;

	-ms-transition: all linear .3s;

	-o-transition: all linear .3s */

	width: 100%;
    height: 300px;
    object-fit: cover

}

@media (max-width: 575px) {

	.categ-img  img {

		width: 100%;
    		height: 223px;
    		/* height: 345px; */
    		object-fit: cover;

	}

	
	
}

.categ-img:hover::before {

    background: rgba(17, 151, 68, 0.9);

}

.categ-img:hover::before {

    background: rgba(17, 151, 68, 0.9);

}

/* .categ-img::before {

    position: absolute;

    content: "";

    top: 0px;

    left: 0px;

    width: 100%;

    height: 100%;

    border-radius: 8px;

    background: rgba(0, 0, 0, 0.4);

    transition: all linear .3s;

    -webkit-transition: all linear .3s;

    -moz-transition: all linear .3s;

    -ms-transition: all linear .3s;

    -o-transition: all linear .3s;

}

.categ-img img:hover {

	transform: scale(1.05)

} */





@media (max-width: 767px) {

	.promo-img {

		margin: 12px 0px

	}

	.categ-img {

		margin: 12px 0px

	}

}

.new-slider li {

	margin: 0px 12px

}

@media (max-width: 575px) {

	.new-slider .product-card {

		width: 220px

	}

}

.brand-slider .dandik,

.brand-slider .bamdik {

	top: 35%

}

.blog-slider .blog-card {

	margin: 0px 15px 25px

}

.blog-slider .dandik,

.blog-slider .bamdik {

	top: 43%

}

@media (max-width: 767px) {

	.blog-slider .blog-card {

		margin: 0px 10px 25px

	}

}


/* category button css */

.image-button {
  position: absolute;
  bottom: 11px; /* adjust vertical position */
  left: 8px;
  /* transform: translateX(-50%); */
  padding: 1px 5px;
  background-color: #af304d;
  color: white;
  border: none;
  border-radius: 6px;
  font-size: 11px;
  cursor: pointer;
  box-shadow: 0 4px 6px rgba(0,0,0,0.2);
  transition: background-color 0.3s ease;
  height: 28px;
  width: 147px;
  /* text-align: left; */
  display: flex;
  justify-content: space-between;
}

@media (max-width: 575px){
	.image-button{
		
		width: 136px;
	}
}

.arrow{
	margin-top: 4px;
}

.image-title{
	    position: absolute;
    top: 8px;
    left: 8px;
    color: white;
    font-size: 16px;
    /* font-weight: bold; */
    background-color: rgba(0, 0, 0, 0.5);
    padding: 1px 8px;
    border-radius: 4px;
    /* float: left; */
}


.tags a{
	display: inline-flex !important;
	justify-content: space-between !important;
	background-color: rgb(208 176 112) !important;
	color: black !important;
}

.tags a svg{
	
	margin-right: 4px;
}