/*===============================================
	[SASS DIRECTORY ]
	
	[1] MODULE DEFAULT
	[2] BLOCK SEARCH
	[3] SOCIAL FOOTER
	
==============================================*/

@media (min-width: 1400px){
	.layout-6 .container{
		width: 1615px !important;
	}
}

h1 {
  font-size: 36px; }

h2 {
  font-size: 30px; }

h3 {
  font-size: 24px; }

h4 {
  font-size: 18px; }

h5 {
  font-size: 14px; }

h6 {
  font-size: 12px; }

.h1, .h2, .h3, h1, h2, h3, .h4, .h5, .h6, h4, h5, h6 {
  margin: 0 0 15px 0;
  }
h1, h2, h3, h4, h5, h6 {
  font-weight: 600;
}
/************************************************************************************************
	ALL GARENAL HOME  
*************************************************************************************************/
.common-home{
	.typeheader-3 .megamenu-style-dev .horizontal ul.megamenu > li.menu-home > a { 
		color: #fff;
		background: darken($background,10%);
	}
	#content{padding-top: 30px; background: #f2f2f2; padding-bottom: 30px; }
	.module{ margin: 0; }
	.owl2-nav{
		> div{
			font-size: 16px;
			transition: all 0.3s ease 0s;
			display: block;
			height: 25px;
			width: 25px;
			line-height: 23px;
			border-radius: 50%;
			color: #222;
			background: #e1e1e1;
			text-align: center;
			overflow: hidden;
			&:hover{
				background: $background;
				color: #fff;
			}
		}
	}
	.block{
		margin-top: 30px;
		&.block_1{
			margin-top: 17px;
		}
	}
	.label-sale{
		position: absolute;
		display: block;
		width: 100%;
		text-align: center;
		text-transform: uppercase;
		color: #fff;
		font-size: 10px;
		font-weight: 400;
		width: 60px;
		height: 20px;
		line-height: 20px;
		top: 20px !important;
		z-index: 5;
		left: auto;
		right: 20px;
		background: #ff5722;
		border-radius: 3px;
		&:before{ display: none; }
	}
	.label-new{
		position: absolute;
		display: block;
		width: 100%;
		text-align: center;
		text-transform: uppercase;
		color: #fff;
		font-size: 10px;
		font-weight: 400;
		width: 60px;
		height: 20px;
		line-height: 20px;
		top: 20px !important;
		z-index: 5;
		right: auto;
		left: 20px;
		background: #63c54c;
		border-radius: 3px;
		&:before{ display: none; }
	}
	.products-list.grid .product-layout .product-item-container{ margin-bottom: 0; }
	.products-list .product-layout{ overflow: visible; }
	.products-list.grid .product-layout .product-item-container{
		transition: all 0.3s ease 0s;
		border-radius: 0;
		&:hover{
			.button-group2{
				z-index: 4;
				bottom: 10px;
			}
			.left-block .quickview{
				opacity: 1;
				transform: scale(1);
			-ms-transform: scale(1);
			-webkit-transform: scale(1);
			&:before{
				display: none;
			}
			}
		}
		.left-block .quickview{
			opacity: 0;
			display: inline-block;
			color: #fff;
			font-size: 14px;
			width: 35px;
			height: 35px;
			pointer-events: auto;
			line-height: 35px;
			border-radius: 50%;
			text-align: center;
			transform: scale(0);
			-ms-transform: scale(0);
			-webkit-transform: scale(0);
			transition: all 0.3s ease 0s;
			position: absolute;
			#{$left}: 50%;
			top: 40%;
			margin-#{$left}: -18px;
		}
		.left-block .product-image-container a:before{
			background: rgba(255, 255, 255, 0.6);
			border-radius: 0;
		}
		.rating, .ratings{     
			margin: 17px 0 3px;
			line-height: 100%; 
		}
		.price .price-new, .price span.price{ color: $linkColor; }
		.price .price-old{ display: inline-block; margin:side-values( 0 5px 0 0); }
		.right-block .caption h4{
			border: none;
			padding: 0;
			margin: 0px 0 6px;
		}
		.button-group2{
			position: absolute;
			top: auto;
			bottom: -60px;
			right: 0;
			left: 0;
			width: 100%;
			text-align: center;
			padding: 20px 0;
			z-index: -1;
			background: #fff;
			transition: 0.3s all ease 0s;
			display: block;
			text-transform: capitalize;
			.bt-cart{
				width: auto;
				padding: side-values(0 10px 0 40px);
				border-radius: 3px;
				font-weight: 400;
				height: 35px;
				line-height: 35px;
				vertical-align: top;
				font-size: 12px;
				border: none;
				display: inline-block;
				color: #fff;
				opacity: 1;
				transition: 0.3s all ease 0s;
				background: $background url("../image/icon/icon-cart-2.png") no-repeat $left 17px center;
			}
			.bt{
				width: 35px;
				height: 35px;
				background: #fff;
				line-height: 33px;
				font-size: 14px;
				display: inline-block;
				border-radius: 3px;
				text-align: center;
				margin: side-values(0 0 0 5px);
				color: $background;
				border: 1px solid $background;
				&:hover{
					border-color: $linkColor;
					background: $background;
					color: #fff;
				}
			}
		}
	}
	.container-megamenu.vertical .vertical-wrapper .container,
	.container-megamenu.vertical #menuHeading .megamenuToogle-wrapper  .container,{ width: 100%!important; }
}

.menu_vertical{
	@media (min-width: 1400px){
		width: 16.8%;
	}
}
.slider_container{
	@media (min-width: 1400px){
		width: 83.2%;
		.slider-layout-6 {
			width: 80%;
		}
		.deal-layout-6 {
			width: 20%;
			padding-#{$right}: 0;
		}
	}
}
@media (min-width: 1200px) and (max-width: 1400px) {
	.menu_vertical{ width: 22%; }
	.slider_container{ width: 78%; }
	.slider-layout-3{ width: 71% }
	.deal-layout-3{ width: 29%; }
	.module.sohomepage-slider .so-homeslider img{ height: 370px; }
	.module.home3_deal .products-list.grid .product-layout .product-item-container{ min-height: 370px; }
	.so-listing-tabs .ltabs-wrap .ltabs-tabs-container{ margin: 0; 
		.ltabs-tabs li{ width: 12.5%; }
	}
	.layout-6 .module.home3_listingtab .products-list.grid .product-layout .product-item-container .button-group2{ bottom: -25px!important; }
	.module.home3_listingtab .products-list.grid .product-layout .product-item-container .right-block{ padding: 50px 20px 20px !important; }
	.common-home .products-list.grid .product-layout .product-item-container .button-group2 .bt{  margin: side-values(0 0 0 2px)!important; }
	footer.typefooter-3 .section_1 .footer-social .socials a{ margin: side-values(0 1px 0 0) }
	footer.typefooter-3 .section_1 .footer-social .socials a .fa{ width: 21px!important; }
}
/************************************************************************************************
	MODULE HOME SLIDER  
*************************************************************************************************/
.module.sohomepage-slider{ margin: 0;
	&:hover{
		.owl2-controls .owl2-nav{
			div{
				transform: scale(1);
				-ms-transform: scale(1);
				-webkit-transform: scale(1);
			}
		}
	}
	.owl2-controls .owl2-nav{
		div{ 
			position: absolute;
			margin: 0; 
			top:45%; 
			@include transform(translateY(-50%)); 
			outline: 0; 
			width: 36px; 
			height: 36px;
			border-radius: 3px;
			font-size: 0; 
			z-index: 9; 
			transition: all 0.3s ease; 
			transform: scale(0);
			-ms-transform: scale(0);
		   -webkit-transform: scale(0);
			&.owl2-prev{ left: 20px;background: #222 url("../image/icon/arrow-slider-left.png")  no-repeat center; border: none;
				&:hover{ background-color: $background }
				&:before, &:after{ display: none; }
			}
			&.owl2-next{ right: 20px; background: #222 url("../image/icon/arrow-slider-right.png") no-repeat center;border: none;
				&:hover{ background-color: $background }
				&:before, &:after{ display: none; }
			}
		}
	}
	.owl2-dots{ position: absolute; bottom: 12px; width: 100%;  line-height: 100%; #{$left}: 50%; #{$right}: auto; margin-#{$right}: -25px;
		.owl2-dot{ display: inline-block; float: $left;
			span{ width: 9px; height:9px; background-color: transparent; border:2px solid #222; margin:0 4px; opacity: 1; 
				display: block;border-radius: 50%; -webkit-border-radius: 50%; @include transition(all .2s ease 0s);
			}
			&.active span{ border-color: $background; background-color: transparent;  }
			&:hover span{border-color: $background;background-color: transparent; }
		}
	}
}

/************************************************************************************************
	HTML CATEGORIES
*************************************************************************************************/
.cate-html{
	margin: 0;
	position: relative;
	overflow: hidden;
	max-height: 250px;
	.owl2-carousel .owl2-controls .owl2-nav .owl2-prev,
	 .owl2-carousel .owl2-controls .owl2-nav .owl2-next{
		display: none !important;
	 }
	.owl2-stage-outer{ direction: ltr; }
	li.item {
		text-align: center;
		position: relative;
		overflow: hidden;
		border: 2px solid #fff;
		z-index: 3;
		border-radius: 50%;
		box-shadow: 0px 0px 5px 0 rgba(0, 0, 0, 0.2);
		div.item-image a {
			display: block;
			img {
				border-radius: 50%;
			}
		}
		&:hover{ border: 2px solid $linkColor;}
		div.item-content {
			position: absolute;
			top: auto;
			left: 0px;
			right: 0px;
			bottom: 10px;
			z-index: 1;
			h4 {
				margin: 0;
				position: relative;
				&:before {
					content: "";
					position: absolute;
					width: 100%;
					height: 100%;
					top: 0;
					left: 0;
					right: 0;
					bottom: 0;
					pointer-events: none;
					transition: all 0.3s ease 0s;
					background: #ffd200;
				}
				a {
					font-weight: 400;
					font-size: 14px;
					padding: 11px 5px;
					display: block;
					font-weight: bold;
					color: #fff;
					text-transform: capitalize;
					position: relative;
				}
				@media (min-width: 1400px){
					a {
						font-size: 16px;
					}
				}
			}
		}
	}
	ul li.item:hover div.item-content h4 a {
		color: #222;
	}
}

/************************************************************************************************
	MENU
*************************************************************************************************/
.megamenu-style-dev{ 
	.container-megamenu.vertical{
		background: #fff;
		border-radius: 3px 3px 0 0;
		box-shadow: 0px -2px 3px rgba(0, 0, 0, 0.1);
	}
	.container-megamenu.vertical #menuHeading .megamenuToogle-wrapper .container{
		&:before{ display: none; }
	}
	.title-mega{
		color: #222;
		padding: 3px 8px 5px 3px;
		margin: 0 0 0;
		font-size: 14px;
		font-weight: bold;
		text-transform: uppercase;
		position: relative;
		display: block;
	}
	.container-megamenu.vertical .vertical-wrapper ul.megamenu{
		margin-top: 9px;
		> li > a{
			border: none;
			padding: 10px 0;
			border-bottom: 1px solid #efefef;
			line-height: 17px;
		}
		.loadmore{
			padding: 10px 20px;
			.more-view{ font-weight: normal; }
		}
	}
}
.trending-search{
	background: #fff;
	padding: 20px;
	margin: 0 ;
	box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
	border-radius: 3px;
	h3.title_block {
		color: #222;
		text-transform: uppercase;
		font-size: 14px;
		position: relative;
		padding: 0 0 10px;
		margin-bottom: 12px;
		&:before {
			content: "";
			position: absolute;
			height: 1px;
			width: 30px;
			background: $background;
			bottom: 0;
			top: auto;
			#{$left}: 0;
			#{$right}: auto;
		}
	}
	a {
		display: block;
		font-size: 13px;
		color: #666;
		line-height: 30px;
		&:hover{
			color: $linkColor;
		}
	}
}


.bn-shadow{
	padding-bottom: 0;
	border-radius: 3px;
	background: #fff;
	display: block;
	overflow: hidden;
	box-shadow: 1px 1px 5px 0 rgba(0, 0, 0, 0.1);
	-ms-box-shadow: 1px 1px 5px 0 rgba(0, 0, 0, 0.1);
	-moz-box-shadow: 1px 1px 5px 0 rgba(0, 0, 0, 0.1);
	-webkit-box-shadow: 1px 1px 5px 0 rgba(0, 0, 0, 0.1);
}

.testimonial-items{
	padding: 0 0 38px;
	.owl2-stage-outer{ direction: ltr; }
	.item{ text-align: center;
		.text {
			position: relative;
			border-radius: 3px 3px 0 0;
			margin: 0 0 -40px;
			background: $background;
			.t{
				position: relative;
				padding: 52px 20px 65px;
				color: #fff;
				font-size: 14px;
				line-height: 26px;
				&:before {
					content: "";
					display: block;
					height: 15px;
					width: 100%;
					background:  url("../image/icon/icon_quote.png") no-repeat center center;
					position: absolute;
					top: 20px;
					#{$left}: 0;
				}
			}
		}
		.img {
			display: inline-block;
			height: 80px;
			width: 80px;
			border: solid 2px #d2d2d2;
			border-radius: 50%;
			overflow: hidden;
			margin-bottom: 5px;
			z-index: 1;
			position: relative;
			img {
				width: 100%;
				height: 100%;
				border-radius: 50%;
			}
		}
		.name {
			font-size: 14px;
			font-weight: bold;
			color: #222;
			margin: 0 ;
			line-height: 20px;
		}
		.job {
			color: #666;
			font-size: 12px;
		}
	}
	&.owl2-carousel .owl2-dots .owl2-dot span{
		width: 25px;
		height: 5px;
		background: #ccc;
		margin: 0 2.5px;
		display: block;
		-webkit-backface-visibility: visible;
		-webkit-transition: opacity 300ms ease;
		-moz-transition: opacity 300ms ease;
		-ms-transition: opacity 300ms ease;
		-o-transition: opacity 300ms ease;
		transition: opacity 300ms ease;
		-webkit-border-radius: 2px;
		-moz-border-radius: 2px;
		border-radius: 2px;
	}
	&.owl2-carousel .owl2-controls .owl2-dots {
		position: absolute;
		bottom: 12px;
		left: auto;
		width: 100%;
		padding: 0 30px;
		text-align: center;
	}
   &.owl2-carousel .owl2-dots .owl2-dot{ float: none; display: inline-block; }
	&.owl2-carousel .owl2-dots .owl2-dot.active span, 
	&.owl2-carousel .owl2-dots .owl2-dot:hover span{
		background: $background;
	}
}










/************************************************************************************************
	HTML BANNER ALL HOME 
*************************************************************************************************/



/************************************************************************************************
   SO DEALS
*************************************************************************************************/
.module.home3_deal{
	padding: 0;
	margin: 0;
	position: relative;
	border-radius: 3px;
	overflow: hidden;
	box-shadow: 0px 0px 6px 0 rgba(0, 0, 0, 0.15);
	h3.modtitle{
		font-size: 14px;
		color: #fff;
		border: none;
		display: block;
		padding: 13px 35px;
		z-index: 4;
		text-transform: uppercase;
		margin: 0;
		font-weight: 700;
		background: $background;
		&:before {
			content: "\f0e7";
			font-family: fontawesome;
			position: absolute;
			font-size: 13px;
			color: #fff;
			top: 13px;
			left: 20px;
			right: auto;
			bottom: auto;
		}
	}
	.so-deal{ margin: 0; }
	.owl2-controls{
		float: none;
		margin-bottom: 0;
		.owl2-nav .owl2-next, 
		.owl2-nav .owl2-prev {
			font-size: 16px;
			color: #fff;
			background: transparent;
			line-height: 20px;
			text-align: center;
			margin: 0;
			cursor: pointer;
			display: inline-block;
			transition: 0.3s all ease 0s;
			position: absolute;
			z-index: 2;
			top: 10px;
			opacity: 1;
			&:hover{ opacity: 0.6; }
		}
		.owl2-nav .owl2-prev {
			left: auto;
			right: 25px;
		}
		.owl2-nav .owl2-next {
			right: 15px;
			left: auto;
		}
	}
   
	.products-list.grid .product-layout .product-item-container{
		
		transition: all 0.3s ease 0s;
		&:hover{
			.button-group2{
				z-index: 4;
				bottom: 0;
			}
		}
		.left-block .product-image-container a:before{
			background: rgba(255, 255, 255, 0.6);
			border-radius: 0;
		}
		.rating, .ratings{     
			margin: 17px 0 3px;
			line-height: 100%; 
		}
		.price .price-old{ display: inline-block; margin: 0 5px; }
		.right-block{ text-align: center; }
		.right-block .caption h4{
			border: none;
			padding: 0 15px;
			margin: 0px 0 6px;
		}
		.right-block{ padding: 0 0 10px }
		.button-group2{
			position: absolute;
			top: auto;
			bottom: -60px;
			right: 0;
			left: 0;
			width: 100%;
			text-align: center;
			padding: 20px 0;
			z-index: -1;
			background: #fff;
			transition: 0.3s all ease 0s;
			display: block;
			text-transform: capitalize;
			.bt-cart{
				width: auto;
				padding: side-values(0 10px 0 40px);
				border-radius: 30px;
				font-weight: 400;
				height: 33px;
				line-height: 33px;
				font-size: 12px;
				border: none;
				display: inline-block;
				color: #fff;
				opacity: 1;
				transition: 0.3s all ease 0s;
				background: $background url("../image/icon/icon-cart-2.png") no-repeat $left 17px center;
			}
		}
	}
	
	.item-time {
		background: $background;
		margin: 0;
		padding: 4px 0 1px;
		font-size: 0;
		z-index: 2;
		top: -15px;
		text-align: center;
		position: relative;
		> span {
			font-size: 14px;
			color: #fff;
			display: inline-block;
			position: relative;
			padding:side-values(0 18px 0 0);
			&:after {
				content: "";
				position: absolute;
				background: #fff;
				opacity: 0.4;
				height: 15px;
				width: 1px;
				top: 6px;
				#{$left}: auto;
				#{$right}: 7px;
				bottom: auto;
			}
		}
		.item-timer {
			display: inline-block;
			background: transparent;
			.time-item {
				display: inline-block;
				position: relative;
				float: none;
				background: transparent;
				border: none;
				font-size: 0;
				line-height: 26px;
				width: auto;
				min-width: 38px !important;
				.num-time {
					color: #fff;
					font-size: 12px;
					display: inline-block;
					font-weight: 600;
					margin: 0 3px;
					border: none;
				}
				.name-time {
					color: #fff;
					font-size: 12px;
					text-transform: uppercase;
					font-weight: 600;
					display: inline-block;
				}
			}
		}
	}
}

.module.home3_deal_style2{ margin: 0;
	.so-deal{ margin: 30px 0 0; }
	.head-title{
		padding: side-values(0 0 0 30px);
		margin-bottom: 20px;
		color: #222;
		height: 34px;
		font-size: 14px;
		text-transform: uppercase;
		position: relative;
		border-bottom: 2px solid $background;
		background:  url("../image/icon/hot-deal-2.png") no-repeat $left 0px top 3px;
		&:before{
			content: "";
			position: absolute;
			display: block;
			height: 5px;
			width: 5px;
			top: auto;
			bottom: -11px;
			border-right: 5px solid transparent;
			border-left: 5px solid transparent;
			border-bottom: 5px solid transparent;
			border-top: 5px solid $linkColor;
			#{$left}: 42px;
		}
	}
	h2.modtitle{
		float: $left;
		padding: 0;
		margin: 0;
		line-height: 26px;
		font-size: 14px;
		font-weight: 700;
		letter-spacing: 0;
		text-transform: uppercase;
	}
	.so-deal.modcontent{
		box-shadow: 0px 0px 3px 0 rgba(0, 0, 0, 0.1);
		background: #fff;
	}
	.cslider-item-timer{
		.product_time_maxprice{
			float: $right;
			position: relative;
			padding: side-values(3px 20px 3px 40px);
			border-radius: 3px 3px 0 0;
			background: $background;
			&:before {
				content: "\f017";
				font-family: fontawesome;
				position: absolute;
				font-size: 14px;
				top: 3px;
				bottom: auto;
				color: #fff;
				#{$left}: 10px;
				#{$right}: auto;
			}
			&:after {
				content: "";
				position: absolute;
				background: #fff;
				opacity: 0.4;
				height: 12px;
				width: 1px;
				top: 10px;
				#{$left}: 33px;
				#{$right}: auto;
				bottom: auto;
			}

			.time-item {
				float:$left;;
				font-size: 14px;
				font-weight: bold;
				color: #fff;
				text-transform: capitalize;
				color: #fff;
				margin-#{$left}: 5px;
				.num-time {
					float: $left;
					margin-#{$right}: 2px;
				}
				.name-time {
					float: $left;
				}
			}
		}
	}
	.item-time .item-timer{
		border: 1px dashed #df0024;
		font-weight: 600;
		height: 100%;
		line-height: 28px;
		display: inline-block;
		width: 100%;
		.time-item {
			float: $left;
			font-size: 92.3%;
			color: #383838;
			text-transform: capitalize;
			font-weight: 700;
			position: relative;
			width: 25%;
			line-height: 28px;
			border: none;
			.num-time {
				display: block;
			}
			.name-time {
				display: block;
			}
		}
		
	}
	.products-list.grid .product-layout .product-item-container{
		
		transition: all 0.3s ease 0s;
		&:hover{
			.button-group2{
				z-index: 4;
				bottom: 0;
			}
		}
		.left-block .product-image-container a:before{
			background: rgba(255, 255, 255, 0.6);
			border-radius: 0;
		}
		.rating, .ratings{     
			margin: 17px 0 3px;
			line-height: 100%; 
		}
		.price .price-old{ display: inline-block; margin:side-values( 0 0 0 5px); color: #999; }
		.right-block{ text-align: center; }
		.right-block .caption h4{
			border: none;
			padding: 0 15px;
			margin: 0px 0 6px;
			a{ font-weight: normal; color: #666; 
				&:hover{ color: $linkColor; }
			}
		}
		.right-block{ padding: 0 0 10px }
		.button-group2{
			position: absolute;
			top: auto;
			bottom: -60px;
			right: 0;
			left: 0;
			width: 100%;
			text-align: center;
			padding: 20px 0;
			z-index: -1;
			background: #fff;
			transition: 0.3s all ease 0s;
			display: block;
			text-transform: capitalize;
			.bt-cart{
				width: auto;
				padding: side-values(0 10px 0 40px);
				border-radius: 30px;
				font-weight: 400;
				height: 33px;
				line-height: 33px;
				font-size: 12px;
				border: none;
				display: inline-block;
				color: #fff;
				opacity: 1;
				transition: 0.3s all ease 0s;
				background: $background url("../image/icon/icon-cart-2.png") no-repeat $left 17px center;
			}
		}
	}
	
}
/************************************************************************************************
   SO EXTRA
*************************************************************************************************/
.module.home3_extra{
	h3.modtitle{
		padding: side-values(12px 10px 12px 50px);
		color: #fff;
		font-size: 16px;
		text-transform: capitalize;
		background: $background url("../image/icon/icon-special.png") no-repeat $left 20px center;
		span{     
			font-size: 16px;
			text-transform: capitalize;
			color: #fff; 
		}
	}
	.products-list.grid .product-layout .product-item-container .left-block{
		float: $left;
		width: 60px;
		margin-#{$right}: 15px;
		position: relative;
		img{ border-radius: 3px; }
	}
	.products-list.grid .product-layout .product-item-container .right-block{
		vertical-align: top;
		padding: 0;
		clear: none;
		width: auto;
		margin-#{$left}: 75px;
		.caption h4 a{
			font-size: 12px;
			color: #666;
			font-weight: 400;
			padding: 0;
			&:hover{ color: $linkColor; }
		}
	}
	.price .price-new, .price span.price{ font-size: 14px; }
	.price .price-old{ font-size: 12px; color: #999; }
	.so-extraslider .item{ padding: 10px 20px 20px; }
	.so-extraslider .owl2-controls{ float: none; }
	.products-list.grid .product-layout .product-item-container{ margin-top: 10px; }
}

.module.home3_extra_style2{
	h3.modtitle{
		padding: side-values(12px 10px 12px 50px);
		color: #fff;
		font-size: 16px;
		text-transform: capitalize;
		background: $background url("../image/icon/icon-recommend.png") no-repeat $left 20px center;
		span{     
			font-size: 16px;
			text-transform: capitalize;
			color: #fff; 
		}
	}
	.products-list.grid .product-layout .product-item-container .right-block .caption h4 a{
		padding-bottom: 0;
		font-weight: normal;
		color: #666;
	}
	.price .price-new, .price span.price{ font-size: 14px; }
	.price .price-old{ font-size: 12px; color: #999; }
	.so-extraslider .item{ padding: 10px 20px 20px; }
	.products-list.grid .product-layout .product-item-container .right-block{ padding: 5px 0; }
}

.module.home3_extra_style3{
	background: transparent;
	h3.modtitle{
		border-bottom: 2px solid $background;
		padding: 12px 25px;
		margin-bottom: 20px;
		color: #222;
		background: transparent;
		font-size: 14px;
		text-transform: uppercase;
		background: url("../image/icon/icon-featured.png") no-repeat $left 0px center;
		position: relative;
		&:before {
			content: "";
			position: absolute;
			display: block;
			height: 5px;
			width: 5px;
			top: auto;
			bottom: -11px;
			border-right: 5px solid transparent;
			border-left: 5px solid transparent;
			border-bottom: 5px solid transparent;
			border-top: 5px solid $linkColor;
			#{$left}: 42px;
		}
	}
	.modcontent{
		border-radius: 3px;
		box-shadow: 0px 0px 6px 0 rgba(0, 0, 0, 0.15);
		-ms-box-shadow: 0px 0px 6px 0 rgba(0, 0, 0, 0.15);
		-moz-box-shadow: 0px 0px 6px 0 rgba(0, 0, 0, 0.15);
		-webkit-box-shadow: 0px 0px 6px 0 rgba(0, 0, 0, 0.15);
		background: #fff;
	}
	.products-list.grid .product-layout .product-item-container{
		.right-block{ padding: 10px 20px 20px; }
		.right-block .caption h4 a{
			padding-bottom: 0;
			font-weight: normal;
			color: #666;
		}
		&:hover{
			box-shadow: 0px 3px 15px #ddd;
			-ms-box-shadow: 0px 3px 15px #ddd;
			z-index: 3;
		}
	}
}
/************************************************************************************************
   SO LISTINGTAB
*************************************************************************************************/
.module.home3_listingtab{
	position: relative;
   

	.head-title{
		display: block;
		clear: both;
		font-size: 20px;
		font-weight: bold;
		text-transform: uppercase;
		h3.modtitle{
			padding: 5px 25px 8px;
			margin-bottom: 23px;
			color: #222;
			font-size: 14px;
			text-transform: uppercase;
			border-bottom: 2px solid $background;
			background:  url("../image/icon/icon-fashion-2.png") no-repeat $left 0px top 4px;
			position: relative;
			&:before {
				content: "";
				position: absolute;
				display: block;
				height: 5px;
				width: 5px;
				top: auto;
				bottom: -11px;
				border-right: 5px solid transparent;
				border-left: 5px solid transparent;
				border-bottom: 5px solid transparent;
				border-top: 5px solid $linkColor;
				#{$left}: 42px;
			}
		}
	}
	.modcontent .wap-listing-tabs{
		border-radius: 3px;
		box-shadow: 0px 0px 6px 0 rgba(0, 0, 0, 0.15);
		-ms-box-shadow: 0px 0px 6px 0 rgba(0, 0, 0, 0.15);
		-moz-box-shadow: 0px 0px 6px 0 rgba(0, 0, 0, 0.15);
		-webkit-box-shadow: 0px 0px 6px 0 rgba(0, 0, 0, 0.15);
		background: #fff;
	}
	 @media (min-width: 1400px){
		.so-listing-tabs .ltabs-wrap .ltabs-tabs-container{
			width: 20%;
			float: $left;
			margin: 0;
		}
		.so-listing-tabs .ltabs-tabs-container .ltabs-tabs li {
			width: 50%;
		}
		.wap-listing-tabs {
			width: 80%;
			overflow: hidden;
			}
		.price{ display: inline-block; }
		wap-listing-tabs {
			width: 80%;
			overflow: hidden;
			}
		.products-list.grid .product-layout .product-item-container .right-block {
			padding: 79px 30px 40px!important;
		}
	}
	.products-list.grid .product-layout .product-item-container .button-group2{ bottom: 0!important; z-index: 1!important; padding: 0!important; background: transparent; }
	.so-listing-tabs .ltabs-tabs-container .ltabs-tabs li {
		float: $left;
		margin: 0;
		text-align: center;
		padding: 33px 0 15px;
		border-radius: 0;
		color: #222;
		background: transparent;
		line-height: 20px;
		display: inline-block;
		font-size: 12px;
		font-weight: bold;
		text-transform: capitalize;
		cursor: pointer;
		position: relative;
		transition: 0.3s all ease 0s;
		border: none;
		border-width: side-values( 0 1px 1px 0);
		border-style: solid;
		border-color: #ebebeb;
	}
	.so-listing-tabs .ltabs-tab-img {
		float: none;
		height: auto;

		width: 100%;
		text-align: center;
		overflow: hidden;
		position: relative;
		margin: 0;
		min-height: 78px;
	}
	.so-listing-tabs .ltabs-tabs-container .ltabs-tabs li.ltabs-tab > span {
		text-transform: uppercase;
		color: #666;
		margin: 0;
		padding: 0;
		cursor: pointer;
		font-size: 12px;
		vertical-align: middle;
		font-weight: 400;
		line-height: 22px;
	}
	.so-listing-tabs .ltabs-tabs-container .ltabs-tabs li.tab-sel.ltabs-tab > span {
		color: $linkColor;
	}
	.products-list.grid .product-layout .product-item-container .left-block {
		position: relative;
		width: 50%;
		text-align: center;
		float: $right;
		padding: 14px 0 20px;
	}
	.products-list.grid .product-layout .product-item-container .right-block {
		text-align: $left;
		clear: none;
		float: $left;
		width: 50%;
		padding: 20px;
		position: relative;
	}
	.products-list.grid .product-layout .product-item-container{
		border-bottom: 1px solid #ebebeb;
		border-#{$right}: 1px solid #ebebeb;
		@include breakpoint(lg){
			min-height: 298px;
		}
		.right-block .caption h4 a{
			padding-bottom: 0;
			font-weight: normal;
			color: #666;
			&:hover{
				color: $linkColor;
			}
		}
	}
	.wap-listing-tabs .owl2-controls .owl2-next {
		font-size: 20px;
		width: 35px;
		height: 35px;
		border-radius: 5px 5px 0 0;
		background: #222;
		color: #fff;
		text-align: center;
		line-height: 35px;
		margin: 0;
		cursor: pointer;
		display: inline-block;
		transition: 0.3s all ease 0s;
		position: absolute;
		z-index: 2;
		top: -7px;
		border: none;
		font-size: 20px;
		&:hover{
			background: $background !important;
			border: none !important;
		}
	}
	.wap-listing-tabs .owl2-controls .owl2-prev{
		font-size: 20px;
		width: 35px;
		height: 35px;
		border-radius: 5px 5px 0 0;
		background: #222;
		color: #fff;
		text-align: center;
		line-height: 35px;
		margin: 0;
		cursor: pointer;
		display: inline-block;
		transition: 0.3s all ease 0s;
		position: absolute;
		z-index: 2;
		top: -7px;
		border: none;
		font-size: 20px;
		&:hover{
			background: $background !important;
			border: none !important;
		}
	}
	.wap-listing-tabs .owl2-controls .owl2-prev {
		left: auto;
		right: 40px;
		@include if-rtl{
			left: 0;
			right: auto;
		}
	}
	.wap-listing-tabs .owl2-controls .owl2-next {
		left: auto;
		right: 0px;
		@include if-rtl{
			left: 40px;
			right: auto;
		}
	}
}
.module.home3_listingtab_style2{
	position: relative;
	.wap-listing-tabs .owl2-controls .owl2-next {
		font-size: 20px;
		width: 35px;
		height: 35px;
		border-radius: 5px 5px 0 0;
		background: #222;
		color: #fff;
		text-align: center;
		line-height: 35px;
		margin: 0;
		cursor: pointer;
		display: inline-block;
		transition: 0.3s all ease 0s;
		position: absolute;
		z-index: 2;
		top: -7px;
		border: none;
		font-size: 20px;
		&:hover{
			background: $background !important;
			border: none !important;
		}
	}
	.wap-listing-tabs .owl2-controls .owl2-prev{
		font-size: 20px;
		width: 35px;
		height: 35px;
		border-radius: 5px 5px 0 0;
		background: #222;
		color: #fff;
		text-align: center;
		line-height: 35px;
		margin: 0;
		cursor: pointer;
		display: inline-block;
		transition: 0.3s all ease 0s;
		position: absolute;
		z-index: 2;
		top: -7px;
		font-size: 20px;
		border: none;
		&:hover{
			background: $background !important;
			border: none !important;
		}
	}
	.wap-listing-tabs .owl2-controls .owl2-prev {
		left: auto;
		right: 40px;
		@include if-rtl{
			left: 0;
			right: auto;
		}
	}
	.wap-listing-tabs .owl2-controls .owl2-next {
		left: auto;
		right: 0px;
		@include if-rtl{
			left: 40px;
			right: auto;
		}
	}
	.head-title{
		display: block;
		clear: both;
		font-size: 20px;
		font-weight: bold;
		text-transform: uppercase;
		h3.modtitle{
			padding: 5px 25px 8px;
			margin-bottom: 23px;
			color: #222;
			font-size: 14px;
			text-transform: uppercase;
			border-bottom: 2px solid $background;
			background:  url("../image/icon/icon-electronic-2.png") no-repeat $left 0px top 6px;
			position: relative;
			&:before {
				content: "";
				position: absolute;
				display: block;
				height: 5px;
				width: 5px;
				top: auto;
				bottom: -11px;
				border-right: 5px solid transparent;
				border-left: 5px solid transparent;
				border-bottom: 5px solid transparent;
				border-top: 5px solid $linkColor;
				#{$left}: 42px;
			}
		}
	}
	.modcontent .wap-listing-tabs{
		border-radius: 3px;
		box-shadow: 0px 0px 6px 0 rgba(0, 0, 0, 0.15);
		-ms-box-shadow: 0px 0px 6px 0 rgba(0, 0, 0, 0.15);
		-moz-box-shadow: 0px 0px 6px 0 rgba(0, 0, 0, 0.15);
		-webkit-box-shadow: 0px 0px 6px 0 rgba(0, 0, 0, 0.15);
		background: #fff;
	}
	 @media (min-width: 1400px){
		.so-listing-tabs .ltabs-wrap .ltabs-tabs-container{
			width: 20%;
			float: $left;
			margin: 0;
		}
		.so-listing-tabs .ltabs-tabs-container .ltabs-tabs li {
			width: 50%;
		}
		.wap-listing-tabs {
			width: 80%;
			overflow: hidden;
		}
	}

	.so-listing-tabs .ltabs-tabs-container .ltabs-tabs li {
		float: $left;
		margin: 0;
		text-align: center;
		padding: 33px 0 15px;
		border-radius: 0;
		color: #222;
		background: transparent;
		line-height: 20px;
		display: inline-block;
		font-size: 12px;
		font-weight: bold;
		text-transform: capitalize;
		cursor: pointer;
		position: relative;
		transition: 0.3s all ease 0s;
		border: none;
		border-width: side-values( 0 1px 1px 0);
		border-style: solid;
		border-color: #ebebeb;
	}
	.so-listing-tabs .ltabs-tab-img {
		float: none;
		height: auto;
		width: 100%;
		text-align: center;
		overflow: hidden;
		position: relative;
		margin: 0;
		min-height: 78px;
	}
	.so-listing-tabs .ltabs-tabs-container .ltabs-tabs li.ltabs-tab > span {
		text-transform: uppercase;
		color: #666;
		margin: 0;
		padding: 0;
		cursor: pointer;
		font-size: 12px;
		vertical-align: middle;
		font-weight: 400;
		line-height: 22px;
	}
	.so-listing-tabs .ltabs-tabs-container .ltabs-tabs li.tab-sel.ltabs-tab > span {
		color: $linkColor;
	}
   
	.products-list.grid .product-layout .product-item-container{
		border-bottom: 1px solid #ebebeb;
		border-#{$right}: 1px solid #ebebeb;
		@include breakpoint(lg){
			min-height: 298px;
		}
		.right-block .caption h4 a{
			padding-bottom: 0;
			font-weight: normal;
			color: #666;
			&:hover{
				color: $linkColor;
			}
		}
		.right-block{
			.button-group2{
				#{$left: 20px;}
			}
		}
	}
}
/************************************************************************************************
	SHORT CODE CONTENT SLIDER BRAND
*************************************************************************************************/
.top-brand.arrow-default{
	direction: ltr;
	padding: 14px 20px;
	background: #fff;
	margin: 0;
	border-radius: 5px;
	background: #fff;
	box-shadow: 0px 0px 6px 0 rgba(0, 0, 0, 0.15);
	border-#{$left}: 2px solid $linkColor;
	@include breakpoint(lg){ padding: 20px 45px; }
	img{ 
		@include transition(all .2s ease 0s); 
		webkit-transform: rotate(0);
		-webkit-backface-visibility: hidden;
		opacity: 0.3;
		cursor: pointer;
		&:hover{
			opacity: 1; visibility: visible;
		}
	}
	.owl2-nav{
		display: none;
		div{ 
			font-size: 16px;
			width: 30px;
			height: 30px;
			border-radius: 50%!important;
			color: #fff;
			text-align: center;
			line-height: 30px;
			margin: 0;
			cursor: pointer;
			display: inline-block;
			transition: 0.3s all ease 0s;
			position: absolute;
			z-index: 2;
			top: 30%;
			background: #ccc;
			&:hover{
				background: $background;
				color: #fff;
			}
			&:before{
				display: inline-block;
				font-family: fontawesome;
			}
			&.owl2-prev{ left: 16px;  opacity: 1; 
				&:before{
					content: "\f104";
				}
			}
			&.owl2-next{ right: 16px; opacity: 1; 
				 &:before{
					content: "\f105";
					position: relative;
					left: -4px;
				}
			}
		}
	} 
}

/************************************************************************************************
   DEALS
*************************************************************************************************/
@media (min-width: 1400px){
	.so-feature-custom.special {
		-webkit-transform: translate3d(0, 0, 0)!important;
		transform: translate3d(0, 0, 0)!important;
		visibility: visible!important;
	}
	.so-feature-custom.special.active-special {
		visibility: hidden!important;
		-webkit-transform: translate3d(280px, 0, 0)!important;
		transform: translate3d(280px, 0, 0)!important;
	}
}
.so-feature-custom.special.active-special {
	visibility: hidden;
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
}
.so-feature-custom.special {
	border-top: none;
	width: 270px;
	z-index: 10;
	left: auto;
	right: 0;
	visibility: hidden;
	-webkit-transform: translate3d(280px, 0, 0);
	transform: translate3d(280px, 0, 0);
	-webkit-transition: all 0.3s ease-in-out 0s;
	transition: all 0.3s ease-in-out 0s;
	box-shadow: -2px 0px 8px 0 rgba(0, 0, 0, 0.25);
	-ms-box-shadow: -2px 0px 8px 0 rgba(0, 0, 0, 0.25);
	-moz-box-shadow: -2px 0px 8px 0 rgba(0, 0, 0, 0.25);
	-webkit-box-shadow: -2px 0px 8px 0 rgba(0, 0, 0, 0.25);
}
.button-close {
	position: absolute;
	top: 0;
	right: 0;
	left: auto;
	width: 30px;
	height: 30px;
	line-height: 30px;
	z-index: 99;
	cursor: pointer;
}

.button-close span.button-ex {
	border-radius: 0px 0px 0px 30px;
	position: relative;
	display: block;
	color: transparent;
	text-align: center;
	padding: 0;
	background: #ed3f46;
	transition: all 0.3s ease 0s;
}

.button-close span.button-ex:before {
	content: "\f101";
	font-size: 14px;
	position: absolute;
	top: -3px;
	left: 3px;
	right: auto;
	bottom: auto;
	font-family: fontawesome;
	color: #fff;
	font-weight: bold;
	width: 100%;
	height: 100%;
}
.button-close span.button-ex.active:before {
	content: "\f100";
}

.so-feature-custom.special {
	background: #fff;
	.title-module{
		display: block;
		clear: both;
		font-size: 20px;
		font-weight: bold;
		text-transform: uppercase;
		h3.block-title {
			border: none;
			padding: 13px 20px 0;
			margin: 0 0 15px;
			font-size: 14px;
			font-weight: 700;
			letter-spacing: 0;
			text-transform: uppercase;
			color: #222;
		}
	}
	.item{ padding: 20px; }
	.product-thumb{
		margin-bottom: 20px;
		.left-block{
			position: relative;
			float: $left;
			margin-#{$right}: 15px;
			.product-image{
				border: 1px solid #ebebeb;
				display: block;
				padding: 0;
				border-radius: 3px;
			}
		}
		.right-block{
			padding: 0;
			text-align: $left;
			.product-title{
				margin: 0 0 5px;
				border: none;
				a{
					font-size: 12px;
					color: #222;
					font-weight: 500;
					padding: 0;
					&:hover{ color: $linkColor; }
				}
			}
			.price{
				line-height: 22px;
				padding-top: 2px;
				margin: 0;
				color: #ff5621;
				.price-old{ display: inline-block; margin-#{$right}:5px;  }
			}
		}
	}
}
.megamenu-style-dev .container-megamenu.vertical{
	padding: 0 !important;
}
.so-deal,
.so-extraslider{
	margin-bottom: 0 !important;
	.extraslider-inner {
		border: none !important;
		padding-bottom: 0 !important;
	}                       
}
.so-extraslider,
.so-listing-tabs .ltabs-wrap .ltabs-tabs-container{
	margin: 0 !important;
}
.so-listing-tabs  .ltabs-items-container .ltabs-items .ltabs-item .item-inner{
	margin: 0 !important;
}
.so-listing-tabs,
.so-listing-tabs .ltabs-wrap,
.so-listing-tabs .ltabs-wrap .ltabs-items-container,
.so-listing-tabs .ltabs-items-container .ltabs-items,
.so-listing-tabs .ltabs-items-container .ltabs-items-inner{
	overflow: visible !important;
	position: static !important;
}
.so-listing-tabs .product-thumb .image a{
	display: block;
}
.container .container {
	width: auto !important;
}
.so-listing-tabs .ltabs-items-container .ltabs-items .ltabs-slider .ltabs-item { margin-bottom:0; width: inherit;}
.so_newletter_custom_popup .so-custom-popup .oca_popup .popup-content,.so-custom-default .modcontent{
	padding: 0;
}
.container-megamenu.vertical .vertical-wrapper ul.megamenu .loadmore {
	  text-align: left;
	  background-position: top left;
	  padding: 15px 20px;
	i.fa {
		padding: 0;
		width: 15px;
		color: #999;
		height: 15px;
		line-height: 13px;
		text-align: center;
		position: relative;
		top: 1px;
		left: 3px;
		}
}
	.container-megamenu.vertical .vertical-wrapper ul.megamenu .loadmore span.more-view {
	  font-weight: 600;
	  color: #222;
	  padding-left: 12px;
		&:hover {
				color: $linkColor; }
  }
@media (max-width: 1199px){footer.typefooter-3 .section_1 .module.news-letter .title-block .newsletter_promo {display: none;}}
.container-megamenu.vertical .vertical-wrapper ul.megamenu > li > a img {top: 14px;}

.h6-banner-1 {
	margin: 0 -10px;
	margin-left: -25px;
	.banners {
		float: left;
		width: 50%;
		padding: 0 10px ;
		margin-bottom: 24px;
		}
   

	}
	@media (max-width: 991px) {
	.h6-banner-1 {
		overflow-x: scroll;
		overflow-y: hidden;
		white-space: nowrap;
		margin: 0;
		.banners {
			display: inline-block;
			vertical-align: top;
			white-space: normal;
			width: 230px;
			float: none !important;
			}
		}
	}
.block-service-home6 {
	background-color: #fff;
	border: 1px solid #ebebeb;
	border-radius: 3px;
	margin: 20px 0 0;
	ul {
		margin: 0;
		list-style: none;
		overflow: hidden;
		padding: 20px 0;
		>li {
			float: left;
			width: 20%;
			border-right: 1px solid #ebebeb;
			text-align: center;
			.wrap {
				display: inline-block;
				overflow: hidden;
				margin-bottom: -8px;
				.icon {
					display: inline-block;
					width: 57px;
					height: 57px;
					float: left;
					margin-right: 20px; }
				.text {
					float: left;
					padding: 9px 0 0;
					h5 {
						margin: 0 0 3px;
						a {
						font-size: 14px;
						text-transform: capitalize; }
						}
					}
				p{
					margin-bottom: 0; }
				}
			&.free-ship .icon {
				background: url("../image/icon/free.png") no-repeat center center #fff; }
			&.support .icon {
				background: url("../image/icon/support.png") no-repeat center center #fff; }
			&.free-return .icon {
				background: url("../image/icon/free-turn.png") no-repeat center center #fff; }
			&.payment .icon {
				background: url("../image/icon/payment.png") no-repeat center center #fff; }
			&.big-saving .icon {
				background: url("../image/icon/big-save.png") no-repeat center center #fff; }
			}
		}
	}
  @media (max-width: 991px) {
.block-service-home6 ul {
	overflow-x: scroll;
	overflow-y: hidden;
	white-space: nowrap;
	margin: 0;
	li {
	  float: none !important;
	  display: inline-block;
	  vertical-align: top;
	  white-space: normal;
	  width: 350px; } }
	}

.qr-code-block {
	overflow: hidden;
	.item-image {
		float: left;
		margin-right: 20px; }
	.item-content{
		h4 {
		font-size: 12px;
		color: #222;
		text-transform: capitalize;
		margin-bottom: 10px; }
	a {
		font-size: 12px;
		color: #999;
		&:hover {
			color: #1d4c9e; }
		}
	p {
		margin-bottom: 0; }	
	}
}
.bt{ outline: unset}
.button, .btn {
  background: #555;
  color: #fff;
  border-radius: 3px;
  border: none;
  background: $linkColor;
  border-color: $linkColor;
  &:hover {
	background: #555;
	border-color: #555;}
  }
 .so-listing-tabs .item-sub-cat{ background: #fff}