/* sections-home.css */

/* banners */
.grid-row {
	margin: calc(-1 * var(--space-2));
	display: flex;
	flex-wrap: wrap;
	flex: 1;
	min-width: 100%;
}
.grid-col {
	padding: var(--space-2);
	display: flex;
	align-items: stretch;
}

.home-banners .banner a {
	text-decoration: none;
}
.home-banners .banner {
	background: var(--color-gray);
	border-radius: var(--radius);
	overflow: hidden;
	color: var(--color-white);
	display: flex;
	position: relative;
	align-items: stretch;
	width: 100%;
  transition: 0.15s all ease-in-out;
}
.home-banners .banner .btn:after {
	content: var(--icon-chevron-right);
	font-family: var(--font-icon);
	font-size: 10px;
	font-weight: 400;
	padding-left: var(--space-2);
}
.home-banners .banner .overlay {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	padding: var(--space-6);
	width: 100%;
	position: relative;
	border-radius: var(--radius);
}
.home-banners .banner .overlay.text-place-left {
	align-items: flex-start;
}
.home-banners .banner .overlay.text-place-right {
	align-items: flex-end;
}
.home-banners .banner .overlay.text-place-center {
	align-items: center;
}
.home-banners .banner .overlay.align-top {
	justify-content: flex-start;
}
.home-banners .banner .overlay.align-bottom {
	justify-content: flex-end;
}
.home-banners .banner .overlay.align-middle {
	justify-content: center;
}
.home-banners .banner .overlay.align-justify {
	justify-content: space-between;
}
.home-banners .banner .overlay.top-to-bottom {
	background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.59) 0%, rgba(0, 0, 0, 0) 33%, rgba(0, 0, 0, 0) 100%);
	background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.59)), color-stop(33%, rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0)));
	background: -o-linear-gradient(top, rgba(0, 0, 0, 0.59) 0%, rgba(0, 0, 0, 0) 33%, rgba(0, 0, 0, 0) 100%);
	background: linear-gradient(to bottom, rgba(0, 0, 0, 0.59) 0%, rgba(0, 0, 0, 0) 33%, rgba(0, 0, 0, 0) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#96000000',endColorstr='#00000000', GradientType=0);
}
.home-banners .banner .overlay.bottom-to-top {
	background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 66%, rgba(0, 0, 0, 0.59) 100%);
	background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), color-stop(66%, rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0.59)));
	background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 66%, rgba(0, 0, 0, 0.59) 100%);
	background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 66%, rgba(0, 0, 0, 0.59) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000',endColorstr='#96000000', GradientType=0);
}
.home-banners .banner .overlay.left-to-right {
	background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0.3) 60%, rgba(0, 0, 0, 0) 100%);
	background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.7)), color-stop(60%, rgba(0, 0, 0, 0.3)), to(rgba(0, 0, 0, 0)));
	background: -o-linear-gradient(left, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0.3) 60%, rgba(0, 0, 0, 0) 100%);
	background: linear-gradient(to right, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0.3) 60%, rgba(0, 0, 0, 0) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b3000000',endColorstr='#00000000', GradientType=1);
}
.home-banners .banner .overlay.right-to-left {
	background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.3) 40%, rgba(0, 0, 0, 0.7) 100%);
	background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0)), color-stop(40%, rgba(0, 0, 0, 0.3)), to(rgba(0, 0, 0, 0.7)));
	background: -o-linear-gradient(left, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.3) 40%, rgba(0, 0, 0, 0.7) 100%);
	background: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.3) 40%, rgba(0, 0, 0, 0.7) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000',endColorstr='#b3000000', GradientType=1);
}
.home-banners .banner .overlay.filling {
	background: rgba(0, 0, 0, 0.3);
}
.home-banners .banner .subtitle {
	font-size: .9em;
	text-transform: uppercase;
	font-weight: 700;
	letter-spacing: .2em;
	margin-bottom: 7px;
}
.home-banners .banner .title {
	font-size: 1.8em;
}
.home-banners .banner .title.with-timer {
	margin-bottom: var(--space-3);
}
.home-banners .banner .button {
	margin-top: var(--space-8);
	max-width: 100%;
}
.home-banners .banner .btn:hover:before {
	background-color: var(--color-primary-hover);
}
.home-banners.grid-v1 .grid-1 {
	width: 22%;
}
.home-banners.grid-v1 .grid-2 {
	width: 50%;
}
.home-banners.grid-v1 .grid-3 {
	width: 28%;
}
.home-banners.grid-v1 .banner-1 {
	height: 590px;
}
.home-banners.grid-v1 .banner-2,
.home-banners.grid-v1 .banner-3,
.home-banners.grid-v1 .banner-4,
.home-banners.grid-v1 .banner-5,
.home-banners.grid-v1 .banner-6 {
	height: 295px;
}
.home-banners.grid-v1 .banner-1 {
	width: 100%;
}
.home-banners.grid-v1 .banner-2 {
	width: 100%;
}
.home-banners.grid-v1 .banner-3,
.home-banners.grid-v1 .banner-4 {
	width: 50%;
}
.home-banners.grid-v1 .banner-5,
.home-banners.grid-v1 .banner-6 {
	width: 100%;
}
.home-banners.grid-v2 .grid-1 {
	width: 38%;
}
.home-banners.grid-v2 .grid-2 {
	width: 22%;
}
.home-banners.grid-v2 .grid-3 {
	width: 40%;
}
.home-banners.grid-v2 .banner-1,
.home-banners.grid-v2 .banner-2,
.home-banners.grid-v2 .banner-4,
.home-banners.grid-v2 .banner-5,
.home-banners.grid-v2 .banner-6 {
	height: 295px;
}
.home-banners.grid-v2 .banner-3 {
	height: 590px;
}
.home-banners.grid-v2 .banner-1,
.home-banners.grid-v2 .banner-2 {
	width: 100%;
}
.home-banners.grid-v2 .banner-3 {
	width: 100%;
}
.home-banners.grid-v2 .banner-4 {
	width: 100%;
}
.home-banners.grid-v2 .banner-5,
.home-banners.grid-v2 .banner-6 {
	width: 50%;
}
.home-banners.grid-v3 .grid-1 {
	width: 30%;
}
.home-banners.grid-v3 .grid-2 {
	width: 70%;
}
.home-banners.grid-v3 .banner-2,
.home-banners.grid-v3 .banner-3,
.home-banners.grid-v3 .banner-4,
.home-banners.grid-v3 .banner-5,
.home-banners.grid-v3 .banner-6 {
	height: 295px;
}
.home-banners.grid-v3 .banner-1 {
	height: 590px;
}
.home-banners.grid-v3 .banner-1 {
	width: 100%;
}
.home-banners.grid-v3 .banner-2,
.home-banners.grid-v3 .banner-3 {
	width: 50%;
}
.home-banners.grid-v3 .banner-4,
.home-banners.grid-v3 .banner-5,
.home-banners.grid-v3 .banner-6 {
	width: 33.3333%;
}
.home-banners.grid-second-block .banner-7,
.home-banners.grid-second-block .banner-8 {
	height: 350px;
	width: 50%;
}

.banner-6 .title {
	display: none;
}

@media (min-width: 1200px) {
	.home-banners .banner:hover {
  	transform: scale(1.01);
  }
}

@media (max-width: 1199px) {
	.home-banners.grid-v1 .banner-2,
	.home-banners.grid-v1 .banner-3,
	.home-banners.grid-v1 .banner-4,
	.home-banners.grid-v1 .banner-5,
	.home-banners.grid-v1 .banner-6 {
		height: 260px;
	}
	.home-banners.grid-v1 .banner-1 {
		height: 520px;
	}
	.home-banners.grid-v1 .grid-1 {
		width: 30%;
	}
	.home-banners.grid-v1 .grid-2 {
		width: 70%;
	}
	.home-banners.grid-v1 .grid-3 {
		width: 100%;
	}
	.home-banners.grid-v1 .banner-5, .home-banners.grid-v1 .banner-6 {
		width: 50%;
	}
	.home-banners.grid-v2 .grid-1 {
		width: 100%;
	}
	.home-banners.grid-v2 .grid-2 {
		width: 30%;
	}
	.home-banners.grid-v2 .grid-3 {
		width: 70%;
	}
	.home-banners.grid-v2 .banner-1, .home-banners.grid-v2 .banner-2 {
		width: 50%;
	}
	.home-banners.grid-v3 .banner-2,
	.home-banners.grid-v3 .banner-3,
	.home-banners.grid-v3 .banner-4,
	.home-banners.grid-v3 .banner-5,
	.home-banners.grid-v3 .banner-6 {
		height: 250px;
	}
	.home-banners.grid-v3 .banner-1 {
		height: 750px;
	}
	.home-banners.grid-v3 .grid-1 {
		width: 33.3333%;
	}
	.home-banners.grid-v3 .grid-2 {
		width: 66.6666%;
	}
	.home-banners.grid-v3 .banner-4 {
		width: 100%;
	}
	.home-banners.grid-v3 .banner-5, .home-banners.grid-v3 .banner-6 {
		width: 50%;
	}
	.home-banners .banner .button {
		margin-top: var(--space-4);
	}
	.home-banners .banner .title {
		font-size: 1.65em;
	}
}

@media (max-width: 991px) {
	.home-banners.grid-v1 .grid-1 {
		width: 35%;
	}
	.home-banners.grid-v1 .grid-2 {
		width: 65%;
	}
	.home-banners .banner .overlay {
		padding: var(--space-5);
	}
	.grid-row {
		margin: -7px;
	}
	.grid-col {
		padding: 7px;
	}
	.home-banners.grid-v1 .banner-2,
	.home-banners.grid-v1 .banner-3,
	.home-banners.grid-v1 .banner-4,
	.home-banners.grid-v1 .banner-5,
	.home-banners.grid-v1 .banner-6 {
		height: 240px;
	}
	.home-banners.grid-v1 .banner-1 {
		height: 480px;
	}
	.home-banners.grid-v2 .banner-1,
	.home-banners.grid-v2 .banner-2,
	.home-banners.grid-v2 .banner-4,
	.home-banners.grid-v2 .banner-5,
	.home-banners.grid-v2 .banner-6 {
		height: 240px;
	}
	.home-banners.grid-v2 .banner-3 {
		height: 480px;
	}
	.home-banners.grid-v2 .grid-2 {
		width: 35%;
	}
	.home-banners.grid-v2 .grid-3 {
		width: 65%;
	}
	.home-banners.grid-v3 .banner-2,
	.home-banners.grid-v3 .banner-3,
	.home-banners.grid-v3 .banner-4,
	.home-banners.grid-v3 .banner-5,
	.home-banners.grid-v3 .banner-6 {
		height: 230px;
	}
	.home-banners.grid-v3 .banner-1 {
		height: 690px;
	}
	.home-banners.grid-second-block .banner-7, .home-banners.grid-second-block .banner-8 {
		min-height: 300px;
		height: auto;
		width: 100%;
	}
	.home-banners .banner .title {
		line-height: 1.3em;
		max-height: 3.9em;
		overflow: hidden;
	}
}

@media (max-width: 767px) {
	.home-block-padding {
		padding-bottom: var(--space-6);
		margin-bottom: var(--space-6);
		border-bottom: var(--border-subtle);
	}
  .home-text .home-block-padding {
  	padding-bottom: 0;
    border-bottom: none;
  }
  .home-banners.grid-v1 .grid-1, .home-banners.grid-v1 .grid-2 {
		width: 100%;
	}
	.home-banners.grid-v1 .banner-1,
	.home-banners.grid-v1 .banner-2,
	.home-banners.grid-v1 .banner-3,
	.home-banners.grid-v1 .banner-4,
	.home-banners.grid-v1 .banner-5,
	.home-banners.grid-v1 .banner-6 {
		height: auto;
		min-height: 200px;
	}
	.home-banners.grid-v1 .banner-3,
	.home-banners.grid-v1 .banner-4,
	.home-banners.grid-v1 .banner-5,
	.home-banners.grid-v1 .banner-6 {
		width: 100%;
	}
	.home-banners.grid-v2 .grid-1,
	.home-banners.grid-v2 .grid-2,
	.home-banners.grid-v2 .grid-3 {
		width: 100%;
	}
	.home-banners.grid-v2 .banner-1,
	.home-banners.grid-v2 .banner-2,
	.home-banners.grid-v2 .banner-3,
	.home-banners.grid-v2 .banner-4,
	.home-banners.grid-v2 .banner-5,
	.home-banners.grid-v2 .banner-6 {
		height: auto;
		min-height: 200px;
	}
	.home-banners.grid-v2 .banner-1,
	.home-banners.grid-v2 .banner-2,
	.home-banners.grid-v2 .banner-3,
	.home-banners.grid-v2 .banner-4,
	.home-banners.grid-v2 .banner-5,
	.home-banners.grid-v2 .banner-6 {
		width: 100%;
	}
	.home-banners.grid-v3 .grid-1,
	.home-banners.grid-v3 .grid-2,
	.home-banners.grid-v3 .grid-3 {
		width: 100%;
	}
	.home-banners.grid-v3 .banner-1,
	.home-banners.grid-v3 .banner-2,
	.home-banners.grid-v3 .banner-3,
	.home-banners.grid-v3 .banner-4,
	.home-banners.grid-v3 .banner-5,
	.home-banners.grid-v3 .banner-6 {
		height: auto;
		min-height: 200px;
	}
	.home-banners.grid-v3 .banner-1,
	.home-banners.grid-v3 .banner-2,
	.home-banners.grid-v3 .banner-3,
	.home-banners.grid-v3 .banner-4,
	.home-banners.grid-v3 .banner-5,
	.home-banners.grid-v3 .banner-6 {
		width: 100%;
	}
	.home-banners.grid-second-block .banner-7, .home-banners.grid-second-block .banner-8 {
		min-height: 200px;
		height: auto;
		width: 100%;
	}
	.home-banners.home-banners .text-center,
	.home-banners.home-banners .text-right,
	.home-banners.home-banners .text-place-center {
		text-align: left;
		align-items: baseline !important;
	}
	.home-banners.home-banners .banner-6 .text-right {
		text-align: right;
		align-items: flex-end !important;
	}
  .home-banners .banner .overlay {
		padding: var(--space-3);
	}
}

/* text with image */
.home-text-image-block {
	display: flex;
	padding: 0;
	margin: 0;
}
.home-text-image-block .image {
	width: 40%;
	background-size: cover;
	background-repeat: no-repeat;
	border-radius: var(--radius);
	overflow: hidden;
}
.home-text-image-block .content {
	flex: 1;
	padding: var(--space-6);
	padding-right: 0;
	position: relative;
}
.home-text-image-block .content:after {
	content: '';
	position: absolute;
	bottom: var(--space-4);
	left: var(--space-6);
	width: calc(100% - 70px);
	height: 40px;
	background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);
	background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), to(rgba(255, 255, 255, 1)));
	background: -o-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);
	background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff',endColorstr='#ffffff', GradientType=0);
}
.home-text-image-block .content .inner {
	max-height: 100%;
	overflow-y: auto;
	padding-right: var(--space-2);
}

@media (max-width: 1199px) {
	.home-text-image-block {
		height: auto;
	}
	.home-text-image-block .content {
		padding: 0;
	}
	.home-text-image-block .content:after {
		display: none;
	}
	.home-text-image-block .content .inner {
		overflow-y: visible;
		max-height: unset;
	}
}

@media (max-width: 767px) {
  .home-blog,
  .home-brands,
  .home-categories,
  .home-products {
  	overflow: hidden;
  }
  .home-brands-wrap.app-style {
		margin-right: -25%;
	}
  .home-products-wrap.app-style .page .products {
		margin-right: 40%;
	}
  .home-products-wrap.app-style .owl-dots {
  	width: 166%;
  }
  .home-brands-wrap.app-style .brands-slider .owl-stage-outer,
  .home-cats-wrap.app-style .categories-slider .owl-stage-outer,
	.home-products-wrap.app-style .products-slider .owl-stage-outer {
		overflow: visible;
	}
  .home-cats-wrap.app-style .categories .category {
		padding: var(--space-3);
	}
  .home-cats-wrap.app-style .owl-dots {
		margin-right: 0;
	}
	.home-cats-wrap.app-style .owl-item {
		transition: all ease .25s;
		opacity: .5;
	}
	.home-cats-wrap.app-style .owl-item.active.center {
		transform: scale(1.1);
		opacity: 1;
	}
}

/* width */
.home-text-image-block .content .inner::-webkit-scrollbar {
	width: 7px;
	border-radius: 7px;
}

/* track */
.home-text-image-block .content .inner::-webkit-scrollbar-track {
	background: var(--color-gray-lighter);
	border-radius: 7px;
}

/* handle */
.home-text-image-block .content .inner::-webkit-scrollbar-thumb {
	background: #E2E2E2;
	border-radius: 7px;
}

/* handle on hover */
.home-text-image-block .content .inner::-webkit-scrollbar-thumb:hover {
	background: #D5D5D5;
	border-radius: 7px;
}