#wrapper{padding: 0;}
.w1{@include transition (all, 0.4s, linear);}
a:focus,
a:hover{
	border: 0;
	outline: none;
	outline-offset: 0;
	text-decoration: none;
}
/*------------------------------------------------------------------
3. Mt Header / #mt-header
-------------------------------------------------------------------*/
#mt-header{
	z-index: 4;
	position: relative;
	a:hover{text-decoration: none;}
	.icon-heart{position: relative; top: 2px;}
	.icon-magnifier{position: relative; top: 2px;}
	&.style2{
		.mt-logo{
			float: none;
			margin: 0 auto;
			display: block;
		}
		#nav{
			margin: 0;
			float: none;
			ul{float: none;}
		}
	}
	&.style3{
		.mt-top-bar{
			padding: 0;
			background: $color4;
		}
		.tel{
			color: $color5;
			font-size: 12px;
			padding: 9px 12px;
			margin: 0 22px 0 0;
			.fa{
				font-size: 12px;
				margin: 0 4px 0 0;
			}
			&.active,
			&:hover{background: $color6;}
		}
		.mt-bottom-bar{padding: 31px 0;}
		#nav{margin: 10px 0 0;}
	}
	&.style4{
		.mt-bottom-bar{padding: 18px 19px 19px 18px;}
		#nav{margin: 9px -12px 0 0;}
		.tel{
			float: left;
			color: $color2;
			letter-spacing: 1px;
			margin: 10px 0 0 39px;
			font: 700 12px/19px $font-family-base-2;
			.fa{
				font-size: 14px;
				margin: 0 9px 0 0;
			}
		}
	}
	&.style5{
		.mt-bottom-bar{padding: 0;}
		#nav{
			margin: 17px 0 0;
			text-transform: capitalize;
			> ul >li{
				margin: 0 18px 0 2px;
				&.drop{margin: 0 9px 0 0;}
			}
			.mt-dropmenu{top: 68px;}
		}
		.mt-icon-list li{margin: 13px 27px 0 0;}
		.icon-magnifier{
			width: 25px;
			height: 25px;
			color: $color2;
			display: block;
			font-size: 11px;
			border-radius: 50%;
			padding: 6px 0 0 6px;
			border: 1px solid $color2;
			&:hover{
				color: $color1;
				border-color: $color1;
			}
		}
		.mt-logo{margin: 32px 0 0;}
		.tel{
			float: left;
			color: $color2;
			letter-spacing: 1px;
			margin: 42px 0 0 19px;
			font: 700 12px/19px $font-family-base-2;
		}
	}
	&.style6{
		background: $white;
		.mt-top-bar{
			color: $color5;
			padding: 12px 0 4px;
			background: transparent;
			border-bottom: 1px solid $color11;
			a{
				color: $color5;
				&:hover{color: $color1;}
			}
		}
		.tel{margin: 0 53px 0 0;}
		.mt-top-lang{border-color: $color12;}
		.mt-logo{
			float: none;
			margin: 0 auto;
			display: block;
		}
		.mt-bottom-bar{padding: 33px 0 28px;}
		.mt-icon-list{
			li{margin-top: -6px;}
			a{
				color: $color5;
				&:hover{color: $color1;}
			}
		}
		.cart-opener .num{background: #7e7e7e;}
		.bar-opener{
			border-color: $color5;
			.bar{
				float: left;
				background: $color5;
			}
			&.active,
			&:hover{
				border-color: $color1;
				.bar{background: $color1;}
			}
		}
	}
	&.style7{
		.mt-top-bar{padding: 0;}
		.tel{
			color: $color5;
			font-size: 12px;
			padding: 9px 12px;
			margin: 0 22px 0 0;
			.fa{
				font-size: 12px;
				margin: 0 4px 0 0;
			}
			&.active,
			&:hover{background: $color6;}
		}
		.mt-bottom-bar{padding: 22px 0;}
		.mt-icon-list{margin: 0 13px 0 0;}
		#nav{margin: 9px 40px 0 0;}
	}
	&.style8{
		.mt-top-bar{
			color: $color5;
			padding: 12px 0 4px;
			background: transparent;
			border-bottom: 1px solid $color12;
			a{
				color: $color5;
				&:hover{color: $color1;}
			}
		}
		.tel{margin: 0 53px 0 0;}
		.mt-top-lang{border-color: $color12;}
		.mt-icon-list{
			li{margin-top: -6px;}
			a{
				color: $color5;
				&:hover{color: $color1;}
			}
		}
		.cart-opener .num{background: #7e7e7e;}
		.bar-opener{
			border-color: $color5;
			.bar{background: $color5;}
			&.active,
			&:hover{
				border-color: $color1;
				.bar{background: $color1;}
			}
		}
		.mt-logo{
			float: none;
			margin: 0 auto;
			display: block;
		}
		#nav{
			margin: 0;
			float: none;
			> ul{
				float: none;
				> li{
					> a{
						color: $color13;
						&:hover{color: $color1;}
					}
					&:hover > a{color: $white;}
				}
			}
		}
		.mt-top-social{
			font-size: 14px;
			padding: 2px 0 0;
			a{
				color: $color5;
				&:hover{color: $color1;}
			}
		}
		.mt-bottom-bar{
			padding: 36px 0 25px;
			background: transparent;
			border-bottom: 1px solid $color12;
		}
		.mt-nav-holder{padding: 30px 0;}
	}
	&.style9{
		background: $white;
		.mt-logo{
			float: none;
			margin: 0 auto;
			display: block;
		}
		.mt-bottom-bar{padding: 33px 0 28px;}
		.mt-icon-list li{margin-top: -6px;}
		.mt-icon-list.right{margin: -5px 0 0;}
		#nav{
			float: left;
			margin: 5px 0 0 34px;
			.mt-dropmenu{padding: 25px 0 0;}
		}
	}
	&.style10{
		.mt-top-bar{
			color: $color14;
			background: transparent;
			padding: 23px 28px 5px 33px;
			border-bottom: 1px solid rgba(238, 238, 238, 0.22);
			a{
				color: $color14;
				&:hover{color: $color1;}
			}
		}
		.mt-bottom-bar{
			background: transparent;
			padding: 33px 16px 36px 30px;
			border-bottom: 1px solid rgba(238, 238, 238, 0.22);
		}
		.mt-top-lang{border: 0;}
		.mt-top-social{
			padding: 4px 0 0;
			a{
				color: $white;
				&:hover{color: $color1;}
			}
		}
		.mt-icon-list{
			margin-top: -5px;
			li{margin: 0 0 0 21px;}
			a{
				color: $white;
				&:hover{color: $color1;}
			}
		}
		.bar-opener{
			border-color: transparent;
			.bar{background: $white;}
			&.active .bar,
			&:hover .bar{background: $color1;}
		}
		.mt-logo{
			float: none;
			margin: 0 auto;
			display: block;
		}
		#nav{
			margin: 0;
			float: none;
			> ul{
				float: none;
				> li{
					> a{
						color: $white;
						&:hover{color: $color1;}
					}
					&:hover > a{color: $white;}
				}
			}
		}
		.mt-nav-holder{padding: 34px 0;}
	}
	&.style11{
		.mt-bottom-bar{
			background: transparent;
			padding: 70px 16px 70px 30px;
		}
		.mt-icon-list{
			margin-top: -5px;
			li{margin: 0 0 0 21px;}
			a{
				color: $white;
				&:hover{color: $color1;}
			}
		}
		.bar-opener{
			border-color: transparent;
			.bar{background: $white;}
			&.active .bar,
			&:hover .bar{background: $color1;}
		}
	}
	&.style12{
		.mt-top-bar{
			color: $color14;
			background: transparent;
			padding: 23px 28px 5px 33px;
			border-bottom: 1px solid rgba(238, 238, 238, 0.22);
			a{
				color: $color14;
				&:hover{color: $color1;}
			}
		}
		.mt-bottom-bar{
			background: transparent;
			padding: 35px 35px 36px 30px;
			border-bottom: 1px solid rgba(238, 238, 238, 0.22);
		}
		.mt-top-lang{border: 0;}
		.mt-top-social{
			margin: 0;
			font-size: 13px;
		}
		.tel{
			float: left;
			color: $white;
			margin: 6px 0 0 5px;
			letter-spacing: 1px;
			font: 700 14px/20px $font-family-base-2;
			.fa{
				font-size: 14px;
				margin: 0 12px 0 0;
			}
		}
		.mt-icon-list{
			margin-top: -5px;
			li{margin: 0 0 0 15px;}
			a{
				color: $white;
				&:hover{color: $color1;}
			}
		}
		.bar-opener{
			border-color: transparent;
			.bar{background: $white;}
			&.active .bar,
			&:hover .bar{background: $color1;}
		}
		.mt-logo{
			float: none;
			margin: 0 auto;
			display: block;
		}
		#nav{
			margin: 0;
			float: none;
			> ul{
				float: none;
				> li{
					> a{
						color: $white;
						&:hover{color: $color1;}
					}
					&:hover > a{color: $white;}
				}
			}
		}
		.mt-nav-holder{padding: 34px 0;}
	}
	&.style13{
		.mt-bottom-bar{padding: 48px 26px 43px 47px;}
		#nav{margin: 12px -3px 0 0;}
		.mt-icon-list li{margin: 5px 0 0 17px;}
		.bar-opener.big{
			border-color: $white;
			padding: 3px 4px 0 0;
		}
		.tel{
			float: left;
			color: $color2;
			letter-spacing: 1px;
			margin: 10px 0 0 23px;
			font: 700 12px/19px $font-family-base-2;
			.fa{
				font-size: 14px;
				margin: 0 9px 0 0;
			}
		}
	}
	&.style14{
		top: 0;
		left: 0;
		right: 0;
		position: absolute;
		.mt-top-bar{
			padding: 14px 0 9px;
			background: transparent;
		}
		.mt-bottom-bar{
			float: left;
			width: 100%;
			z-index: 1;
			position: relative;
			padding: 28px 11px 33px 20px;
			&:after{
				top: 0;
				bottom: 0;
				left: -14px;
				z-index: -1;
				content: "";
				right: -9999px;
				background: $white;
				position: absolute;
			}
		}
		.mt-logo{margin: 5px 0 0;}
		#nav{
			margin: 12px -3px 0 0;
			.mt-dropmenu{top: 55px;}
		}
		.mt-icon-list li{margin: 5px 2px 0 18px;}
		.bar-opener.big{
			border-color: $white;
			padding: 3px 4px 0 0;
		}
	}
	&.style15{
		.mt-top-bar{
			background: transparent;
			padding: 24px 21px 4px 54px;
		}
		.mt-bottom-bar{
			background: transparent;
			padding: 8px 10px 42px 67px;
		}
		.tel{
			float: right;
			color: $color13;
			.fa{
				font-size: 12px;
				margin: 0 12px 0 28px;
			}
		}
		.mt-top-lang{
			border-left: 0;
			color: $color13;
			margin: 3px 0 8px;
			padding: 0 25px 1px 0;
			border-right: 1px solid $color13;
			.lang-opener{
				color: $color13;
				&:hover{color: $color1;}
			}
		}
		.mt-icon-list{
			li{
				margin: 1px 6px 0 17px;
			}
			a{
				color: $white;
				&:hover{color: $color1;}
			}
		}
		#nav{
			margin: 9px 0 0;
			> ul > li{
				> a{
					color: $white;
					&:hover{color: $color1;}
				}
				&:hover > a{color: $white;}
			}
		}
		.bar-opener{
			border-color: transparent;
			.bar{background: $white;}
			&.active .bar,
			&:hover .bar{background: $color1;}
		}
	}
	&.style16 .mt-top-bar{ background: none;}
	&.style17{
		color: $color5;
		.mt-top-bar{
			padding: 10px 0;
			background: $clr-19;
			.tel{
				color: $color5;
				margin: 0 46px 0 0;
				font-family: $source-sans-pro;
				&:hover{color: $color1;}
				.fa{
					font-size: 12px;
					margin: 0 3px 0 0;
				}
			}
		}
		.mt-bottom-bar{
			padding: 26px 0 34px;
			.mt-logo{margin: 6px 0 0;}
			.mt-icon-list{padding: 0 12px 0 0;}
		}
		.container-fluid{
			margin: 0 auto;
			max-width: 1485px;
		}
	}
	&.style18{
		background: $white;
		.mt-top-bar{
			color: #e6e6e6;
			padding: 9px 0 4px;
			background: #3d3d3d;
			a{
				color: #e6e6e6;
				&:hover{color: $color1;}
			}
		}
		.tel{margin: 0 53px 0 0;}
		.mt-top-lang{border-color: $color12;}
		.mt-logo{
			float: none;
			margin: 0 auto;
			display: block;
		}
		.mt-bottom-bar{padding: 33px 0 28px;}
		.mt-icon-list{
			li{
				margin-top: -6px;
				&.drop.open > a{ color: $white;}
			}
			a{
				color: #7e7e7e;
				&:hover{color: $color1;}
			}
			.btn-type3{
				color: $white;
				&:hover{color: $black;}
			}
			.btn-type2{
				color: $black;
				&:hover{color: $white;}
			}
		}
		.cart-opener .num{background: #7e7e7e;}
		.bar-opener{
			border-color: #7e7e7e;
			.bar{
				float: left;
				background: #7e7e7e;
			}
			&.active,
			&:hover{
				border-color: $color1;
				.bar{background: $color1;}
			}
		}
	}
	&.style19{
		.mt-top-bar{
			color: $color5;
			padding: 9px 0 7px;
			background: $color11;
			a{
				color: $color5;
				&:hover{color: $color1;}
			}
		}
		.tel{margin: 0 41px 0 0;}
		.mt-top-lang{border-color: $color12;}
		.mt-icon-list{
			margin: -12px 4px 0 0;
			li{margin-top: -6px;}
			a{
				color: #7e7e7e;
				&:hover{color: $color1;}
			}
		}
		.cart-opener .num{background: #7e7e7e;}
		.bar-opener{
			border-color: $color5;
			.bar{background: $color5;}
			&.active,
			&:hover{
				border-color: $color1;
				.bar{background: $color1;}
			}
		}
		.mt-logo{
			float: none;
			margin: 0 auto;
			display: block;
		}
		#nav{
			margin: 0;
			float: none;
			> ul{
				float: none;
				> li{
					> a{
						color: $color13;
						&:hover{color: $color1;}
					}
					&:hover.drop > a{color: $white;}
				}
			}
			.mt-dropmenu{padding: 21px 0 0;}
		}
		.mt-top-social{
			font-size: 14px;
			padding: 2px 0 0;
			a{
				color: #7e7e7e;
				&:hover{color: $color1;}
			}
		}
		.mt-bottom-bar{
			padding: 36px 0 25px;
			background: transparent;
			border-bottom: 1px solid $color12;
		}
		.mt-nav-holder{padding: 30px 0;}
	}
	&.sticky{
		.mt-bottom-bar{
			top: 0;
			left: 0;
			right: 0;
			position: fixed;
			box-shadow: 0 0 20px 10px rgba(0, 0, 0, 0.1);
		}
		&.style19{
			.mt-bottom-bar{position: static;}
			.mt-nav-holder{
				top: 0;
				left: 0;
				right: 0;
				position: fixed;
				background: $white;
			}
		}
	}
}
/*------------------------------------------------------------------
4. Mt Top Bar / .mt-top-bar
-------------------------------------------------------------------*/
.mt-top-bar{
	color: $white;
	background: $black;
	padding: 12px 30px 4px 54px;
	a{
		color: $white;
		@extend %transition;
		&:hover{color: $color1;}
	}
	.tel{
		float: left;
		letter-spacing: 1px;
		font: 700 12px/19px $font-family-base-2;
		.fa{
			font-size: 14px;
			margin: 0 9px 0 0;
		}
	}
	.mt-top-social{
		padding: 0;
		float: left;
		list-style: none;
		margin: 0 0 0 44px;
		li{
			float: left;
			margin: 0 10px 0 3px;
		}
	}
	.account{
		float: right;
		letter-spacing: 1px;
		font: 11px/20px $font-family-base-2;
		a{font-weight: 700;}
	}
	.mt-top-lang{
		float: right;
		position: relative;
		z-index: 3;
		padding: 0 0 1px 16px;
		margin: 3px 0 8px 16px;
		border-left: 1px solid #808080;
		font: 11px/14px $font-family-base-2;
		&:hover{
			.drop{ display: block; }
		}
		.lang-opener{
			letter-spacing: 1px;
			.fa{
				font-size: 13px;
				margin: 0 0 0 2px;
			}
		}
		.drop{
			top: 100%;
			right: 0;
			width: 84px;
			display: none;
			position: absolute;
		}
		ul{
			overflow: hidden;
			margin: 0;
			text-align: left;
			padding: 10px 10px 10px 18px;
			background: #3d3d3d;
			li{ display: block; }
		}
	}
	.mt-top-list{
		margin: 0;
		padding: 0;
		float: right;
		list-style: none;
		letter-spacing: 1px;
		font: 700 11px/20px $font-family-base-2;
		li{
			float: left;
			&.active a{background: $color6;}
		}
		a{
			color: $color5;
			display: block;
			padding: 9px 19px;
			&:hover{background: $color6;}
		}
	}
	.mt-top-list2{
		margin: 0;
		padding: 0;
		width: 100%;
		float: right;
		list-style: none;
		letter-spacing: 1px;
		font: 700 11px/18px $source-sans-pro;
		li{
			float: right;
			padding: 0 11px;
			margin: 0 0 0 4px;
			border-left: 1px solid $color9;
			&:last-child{border: 0;}
		}
		a{
			color: $color5;
			&:hover{color: $color1;}
		}
	}
}
/*------------------------------------------------------------------
5. Mt Bottom Bar / .mt-bottom-bar
-------------------------------------------------------------------*/
.mt-bottom-bar{
	background:  $white;
	padding: 42px 31px 42px 48px;
	@include transition (all, 0.4s, linear);
	a{@extend %transition;}
	.mt-holder{
		float: left;
		width: 100%;
	}
	.mt-top-social{
		margin: 0;
		float: left;
		font-size: 19px;
		padding: 9px 0 0;
		list-style: none;
		li{
			float: left;
			margin: 0 12px 0 3px;
		}
		a{
			color: $color3;
			&:hover{
				color: $color1;
				text-decoration: none;
			}
		}
	}
	.mt-logo{
		float: left;
		img{display: block;}
	}
	.mt-icon-list{
		margin: 0;
		padding: 0;
		float: right;
		font-size: 24px;
		list-style: none;
		li{
			position: relative;
			margin: 5px 0 0 15px;
			display: inline-block;
			vertical-align: middle;
			> a{
				color: $color3;
				&:hover{
					color: $color1;
					text-decoration: none;
				}
			}
			&.drop.open >a{
				z-index: 5;
				color: $white;
				&:after {
					width: 0;
					top: 83%;
					left: 50%;
					height: 0;
					content: " ";
					margin-left: -13px;
					position: absolute;
					pointer-events: none;
					border: solid transparent;
					border-color: rgba(255, 255, 255, 0);
					border-bottom-color: #fff;
					border-width: 13px;
				}
			}
			&.open .mt-drop{opacity: 1; visibility: visible;}
			&.open .mt-mdropover{opacity: 1; visibility: visible;}
		}
		&.right{
			float: left;
			.bar-opener .bar{float: left;}
		}
		.mt-drop{
			top: 100%;
			z-index: 2;
			opacity: 0;
			width: 380px;
			right: -49px;
			position: absolute;
			visibility: hidden;
			.mt-drop-sub{
				margin: 18px 0 0;
				background: $white;
			}
			.mt-side-widget{padding: 52px 24px 45px 37px;}
		}
	}
	.cart-opener{
		display: block;
		position: relative;
		.num{
			width: 22px;
			right: -12px;
			bottom: -2px;
			height: 22px;
			color: $white;
			text-align: center;
			background: $color2;
			position: absolute;
			border-radius: 50%;
			border: 2px solid $white;
			font: 11px/15px $font-family-base-1;
		}
	}
	.bar-opener{
		width: 24px;
		height: 24px;
		display: block;
		font-size: 23px;
		text-align: right;
		border-radius: 50%;
		padding: 6px 4px 0 0;
		border: 2px solid $black;
		.bar{
			height: 2px;
			width: 11px;
			float: right;
			background: $black;
			margin: 0 0 1px 5px;
			@extend %transition;
			&.small{width: 7px;}
		}
		&.active,
		&:hover{
			border-color: $color1;
			.bar{background: $color1;}
		}
		&.big{
			.bar{
				width: 20px;
				margin: 0 0 3px 5px;
				&.small{width: 17px;}
			}
		}
	}
	.mt-sh-cart{
		width: 180px;
		float: right;
		color: $black;
		margin: 0 0 0 31px;
		position: relative;
		letter-spacing: 1px;
		padding: 2px 0 0 42px;
		font: 11px/15px $font-family-base-1;
		.icon-handbag{
			top: 5px;
			left: 5px;
			font-size: 24px;
			position: absolute;
		}
		strong{
			display: block;
			margin: 0 0 2px;
			font-size: 12px;
		}
		span{
			display: block;
		}
	}
	.mt-sh-cart2{
		float: right;
		width: 103px;
		height: 85px;
		color: $white;
		padding: 22px 0 0;
		text-align: center;
		background: $color7;
		letter-spacing: 1px;
		font: 700 11px/25px $font-family-base-2;
		span{display: block;}
		.icon-handbag{font-size: 24px;}
	}
	.mt-top-list{
		margin: 0;
		padding: 0;
		width: 100%;
		float: right;
		list-style: none;
		letter-spacing: 1px;
		font: 700 11px/18px $font-family-base-2;
		li{
			float: right;
			margin: 0 9px 0 3px;
			padding: 0 10px 0 15px;
			border-left: 1px solid $color9;
			&:last-child{border: 0;}
		}
		a{
			color: $color8;
			&:hover{color: $color1;}
		}
	}
	.mt-nav-box{
		width: 68%;
		float: right;
		padding: 18px 0 0 0;
	}
	.mt-search-box{
		width: 52.5%;
		float: right;
		position: relative;
		border-radius: 14px;
		margin: 4px 3.1% 0 0;
		border: 2px solid $black;
		padding: 5px 50px 4px 23px;
		@include placeholder{color: #919191;};
		input{
			border: 0;
			margin: 0;
			padding: 0;
			width: 100%;
			float: left;
			height: 20px;
			outline: none;
			color: #919191;
			background: transparent;
			font: 12px/20px $source-sans-pro;
		}
		.fa {
			top: 6px;
			border: 0;
			right: 10px;
			color: $black;
			font-size: 16px;
			background: none;
			position: absolute;
			@extend %transition;
			&:hover{color: $color1;}
		}
	}
}
/*------------------------------------------------------------------
6. Nav / #nav
-------------------------------------------------------------------*/
#nav{
	float: right;
	margin: 12px 0 0;
	text-transform: uppercase;
	font: 14px/20px $font-family-base-1;
	> ul{
		margin: 0;
		padding: 0;
		float: right;
		list-style: none;
		> li{
			position: relative;
			vertical-align: top;
			margin: 0 36px 0 7px;
			display: inline-block;
			.mt-mdropover{pointer-events:none;}
			> a{
				color: $color2;
				position: relative;
				letter-spacing: 1px;
				&:hover{
					color: $color1;
					text-decoration: none;
				}
			}
			&.drop{
				position: static;
				margin: 0 29px 0 0;
				> a:after {
					width: 0;
					top: 100%;
					left: 50%;
					height: 0;
					opacity: 0;
					content: " ";
					visibility: hidden;
					margin-left: -13px;
					position: absolute;
					@extend %transition;
					pointer-events: none;
					border: solid transparent;
					border-color: rgba(255, 255, 255, 0);
					border-bottom-color: #fff;
					border-width: 13px;
				}
				&:hover >a{
					z-index: 5;
					color: $white;
					&:after {visibility: visible; opacity: 1;}
				}
			}
			&:hover{
				.mt-dropmenu{opacity: 1; visibility: visible;}
				.mt-mdropover{opacity: 1; visibility: visible;}
				.s-drop{opacity: 1; visibility: visible; top: 100%;}
			}
			&.dark{
				> a:after{border-bottom-color: $black !important;}
				.mt-frame{background: $black !important;}
				.title{
					color: $color19;
					a{
						color: $color19;
						&:hover{color: $color1;}
					}
					&:after{background: $color19;}
				 }
				.mt-dropmenu a{
					color: $color18;
					&:hover{color: $color1;}
				}
			}
		}
	}
	.mt-dropmenu{
		top: 24px;
		z-index: 5;
		opacity: 0;
		left: -9999px;
		right: -9999px;
		padding: 30px 0 0;
		visibility: hidden;
		position: absolute;
		@extend %transition;
		.sub-dropcont{
			overflow: hidden;
			margin: 0 0 31px;
		}
		.sub-drop{overflow: hidden;}
		.title{
			display: block;
			color: $color15;
			margin: 0 0 18px;
			padding: 0 0 4px;
			position: relative;
			pointer-events: none;
			font: 16px/20px $font-family-base-1;
			a{
				color: $color15;
				&:hover{color: $color1;}
			}
			&:after{
				left: 0;
				bottom: 0;
				height: 2px;
				width: 68px;
				content: "";
				position: absolute;
				background: $color17;
			}
			&.small:after{width: 34px;}
		}
		ul{
			margin: 0;
			padding: 0;
			overflow: hidden;
			list-style: none;
			text-transform: lowercase;
			font: 300 14px/20px $source-sans-pro;
			li{
				margin: 0 0 4px;
				text-transform: capitalize;
			}
			a{
				color: $color16;
				&:hover{color: $color1;}
			}
		}
		.mt-frame{
			margin: 0 auto;
			overflow: hidden;
			max-width: 1200px;
			background: $white;
			background-size: cover;
			padding: 69px 72px 26px;
			background-repeat: no-repeat;
			background-position: 50% 100%;
			.mt-f-box{overflow: hidden;}
		}
		.mt-col-3{
			float: left;
			width: 23.3%;
			&.promo{
				width: 30%;
				padding: 0 0 0 1.9%;
			}
			&.coll5{width: 20%;}
		}
		.mt-promobox-h{
			overflow: hidden;
			padding: 30px 0 20px;
			.mt-promobox{
				float: left;
				padding: 0 0 20px;
				&:nth-child(even){float: right;}
			}
		}
	}
	.s-drop {
		left: 0;
		top: 140%;
		margin: 0;
		opacity: 0;
		width: 220px;
		list-style: none;
		text-align: left;
		padding: 28px 0 0;
		visibility: hidden;
		position: absolute;
		@extend %transition;
		font: 300 12px/35px $source-sans-pro;
		ul{
			margin: 0;
			padding: 0;
			list-style: none;
			> li{
	  			padding: 0 15px;
	  			position: relative;
	  			border-bottom: 1px solid #eee;
	  			&.drop:before{
					top: 7px;
					right: 10px;
					color: $color2;
					font-size: 11px;
					content: "\f105";
					position: absolute;
					font-family: "FontAwesome";
				}
				&:hover .s-drop {opacity: 1 !important; visibility: visible !important; top: 0 !important;}
				&:last-child{border-bottom: 0;}
			}
		}
		> ul{
			padding: 5px 0;
			background: $white;
			border: 1px solid #eee;
		}
		a{
			display: block;
			color: $color2;
			position: relative;
			letter-spacing: 1px;
		}
		.s-drop {
			left: 100%;
			background: $white;
			top: 140% !important;
			opacity: 0 !important;
			border: 1px solid #eee;
			visibility: hidden !important;
		}
	}
}
/*------------------------------------------------------------------
7. Mt Nav Holder / .mt-nav-holder
-------------------------------------------------------------------*/
.mt-nav-holder{
	padding: 21px 0;
	a{@extend %transition;}
}
.marginzero{margin: 0 !important;}
.bgblack{background:  $black !important;}
.mt-mdropover{
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	opacity: 0;
	z-index: 1;
	position: fixed;
	visibility: hidden;
	@extend %transition;
	background: rgba(0, 0, 0, 0.5);
}
/*------------------------------------------------------------------
8. Mt Side Over / .mt-side-over
-------------------------------------------------------------------*/
.mt-side-over{
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	opacity: 0;
	z-index: 5;
	position: fixed;
	visibility: hidden;
	@extend %transition;
	background: rgba(0, 0, 0, 0.5);
	&.active{
		opacity: 1;
		visibility: visible;
	}
}
/*------------------------------------------------------------------
9. Mt Side Menu / .mt-side-menu
-------------------------------------------------------------------*/
.mt-side-menu{
	top: 0;
	right: 0;
	bottom: 0;
	width: 385px;
	z-index: 9999;
	position: fixed;
	overflow-y: auto;
	background: $color20;
	transform: translateX(385px);
	-ms-transform: translateX(385px);
	-webkit-transform: translateX(385px);
	@include transition (all, 0.4s, linear);
	.side-close{
		top: 38px;
		right: 40px;
		width: 16px;
		height: 16px;
		position: absolute;
		span{
			height: 2px;
			width: 16px;
			display: block;
			@extend %transition;
			background: #9d9d9d;
			transform     : rotate(45deg);
			-o-transform   : rotate(45deg);
			-moz-transform  : rotate(45deg);
			-ms-transform   : rotate(45deg);
			-webkit-transform : rotate(45deg);
			+span{
				margin: -2px 0 0;
				transform     : rotate(-45deg);
				-o-transform   : rotate(-45deg);
				-moz-transform  : rotate(-45deg);
				-ms-transform   : rotate(-45deg);
				-webkit-transform : rotate(-45deg);
			}
		}
		&:hover span{background: $color1;}
	}
	.mt-side-title{
		color: #777;
		display: block;
		margin: 0 0 20px;
		background: $color21;
		text-transform: uppercase;
		padding: 30px 50px 24px 34px;
		font: 18px/20px $font-family-base-1;
	}
}
.side-col-active .mt-side-menu .mt-mdropover{opacity: 1; visibility: visible;}
.side-col-active .w1{
	transform: translateX(-383px);
	-ms-transform: translateX(-383px);
	-webkit-transform: translateX(-383px);
}
.right-side.side-col-active .w1{
	transform: translateX(383px);
	-ms-transform: translateX(383px);
	-webkit-transform: translateX(383px);
}
.right-side .mt-side-menu{
	left: 0;
	right: auto;
	transform: translateX(-385px);
	-ms-transform: translateX(-385px);
	-webkit-transform: translateX(-385px);
}
.mt-side-widget{
	color: #7d7d7d;
	overflow: hidden;
	padding: 43px 32px 37px 34px;
	font: 300 14px/20px $source-sans-pro;
	&.borderbottom{border-bottom: 1px solid #e6e6e6;}
	.mt-side-subtitle{
		display: block;
		margin: 0 0 10px;
		text-transform: uppercase;
		font: 18px/20px $font-family-base-1;
	}
	p{margin: 0;}
	header{
		overflow: hidden;
		margin: 0 0 35px;
	}
	form{
		overflow: hidden;
		position: relative;
		margin: 0 0 0 -6px;
		@include placeholder{color: #909090;};
		.checkbox{
			top: 0;
			left: 0;
			opacity: 0;
			z-index: -9;
			visibility: hidden;
			position: absolute;
		}
		.box{
			float: left;
			width: 100%;
			margin: 0 0 16px;
			padding: 5px 9px 0 7px;
		}
		.left{
			float: left;
			position: relative;
			label{
				margin: 0;
				color: #9a9a9a;
				position: relative;
				padding: 0 0 0 18px;
				font: 11px/18px $font-family-base-2;
				&:after{
					left: 0;
					top: 3px;
					content: "";
					width: 10px;
					height: 10px;
					position: absolute;
					background: #dadada;
				}
				&:before{
					top: -1px;
					left: 1px;
					z-index: 2;
					display: none;
					font-size: 8px;
					color: $color1;
					content:"\f00c";
					position: absolute;
					font-family:'FontAwesome';
				}
			}
			.checkbox:checked+ label:before{display: block;}
		}
		.help{
			float: right;
			color: #9a9a9a;
			font: 12px/18px $font-family-base-2;
			&:hover{color: $color1;}
		}
	}
	.input{
		border: 0;
		float: left;
		width: 100%;
		height: 38px;
		outline: none;
		color: #909090;
		margin: 0 0 11px;
		padding: 9px 22px;
		background: #f0f0f0;
		border-radius: 30px;
		font: 300 14px/20px $source-sans-pro;
	}
	.fa-search{
		border: 0;
		top: 14px;
		right: 16px;
		color: #909090;
		font-size: 12px;
		background: none;
		position: absolute;
		@include transition (all, 0.3s, linear);
		&:hover{color: $color1;}
	}
	.cart-row{
		overflow: hidden;
		margin: 0 0 17px;
		position: relative;
		.close{
			top: 10px;
			right: 15px;
			color: $color1;
			font-size: 14px;
			position: absolute;
			@include transition (all, 0.4s, linear);
			&:hover{
				color: $black;
				text-decoration: none;
			}
		}
		.img{
			width: 74px;
			float: left;
			margin: 0 13px 0 9px;
		}
		.cart-btn-row{overflow: hidden;}
		.mt-h{
			overflow: hidden;
			padding: 6px 0 0;
		}
	}
	.mt-h-title{
		display: block;
		color: #757575;
		font: 600 14px/20px $source-sans-pro;
		a{
			color: #757575;
			@include transition (all, 0.4s, linear);
			&:hover{
				color: $color1;
				text-decoration: none;
			}
		}
	}
	.price{
		color: #010101;
		font: 600 15px/20px $source-sans-pro;
		a{
			color: #757575;
			@include transition (all, 0.4s, linear);
			&:hover{
				color: $color1;
				text-decoration: none;
			}
		}
	}
	.cart-row-total{
		color: #757575;
		overflow: hidden;
		margin: 0 0 20px;
		padding: 16px 21px 0 10px;
		border-top: 1px solid #eee;
		font: 600 14px/26px $source-sans-pro;
	}
	.mt-total{float: left;}
	.mt-total-txt{
		float: right;
		color: #010101;
		font: 600 15px/20px $source-sans-pro;
	}
	.cart-btn-row{
		overflow: hidden;
		padding: 22px 0 0;
		border-top: 1px solid #eee;
		a{margin: 0 16px 0 10px;}
	}
	.btn-type3{
		padding: 5px 22px;
		font: 14px/20px $font-family-base-1;
	}
}
.or-divider{
	color: #808080;
	overflow: hidden;
	position: relative;
	text-align: center;
	text-transform: uppercase;
	font: 700 14px/20px $font-family-base-1;
	.txt{
		width: 46px;
		height: 46px;
		margin: 0 auto;
		display: block;
		padding: 10px 0 0;
		border-radius: 50%;
		position: relative;
		background: #f8f8f8;
		border: 1px solid #e6e6e6;
		&:after{
			top: 50%;
			z-index: -1;
			height: 1px;
			content: "";
			left: -9999px;
			right: -9999px;
			position: absolute;
			border-top:1px solid #e6e6e6;
		}
	}
}
.mt-side-nav{
	overflow: hidden;
	text-transform: uppercase;
	font: 18px/20px $font-family-base-1;
	.drop{
		max-height: 0;
		font-size: 15px;
		overflow: hidden;
		@include transition (all, 0.4s, linear);
		ul{padding: 10px 15px;}
		li{margin: 0 0 10px;}
		&.open{max-height: 999px;}
	}
	ul{
		margin: 0;
		padding: 0;
		list-style: none;
		li{margin: 0 0 5px;}
	}
	a{
		color: #7d7d7d;
		@include transition (all, 0.3s, linear);
		&:hover{
			color: $color1;
			text-decoration: none;
		}
	}
	&.small{
		text-transform: lowercase;
		text-transform: capitalize;
		font: 16px/20px $font-family-base-1;
	}
}
.mt-search-popup{
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 4;
	opacity: 0;
	position: fixed;
	visibility: hidden;
	text-align: center;
	background: $color20;
	@include transition (all, 0.4s, linear);
	.mt-holder{
		width: 100%;
		height: 100vh;
		display: table;
		vertical-align: middle;
	}
	.mt-frame{
		display: table-cell;
		vertical-align: middle;
		form{
			width: 770px;
			margin:0 auto;
			position: relative;
			border-left: 1px solid #bdbdbd;
		}
	}
	.icon-microphone{
		top: 20px;
		right: 43px;
		color: #9d9d9d;
		font-size: 23px;
		position: absolute;
		@include transition (all, 0.4s, linear);
		&:hover{color: $color1;}
	}
	.icon-magnifier{
		border: 0;
		top: 19px;
		right: 5px;
		padding: 0;
		outline: none;
		color: #9d9d9d;
		font-size: 23px;
		position: absolute;
		background: transparent;
		@include transition (all, 0.4s, linear);
		&:hover{color: $color1;}
	}
	input{
		margin: 0;
		border: 0;
		float: left;
		width: 100%;
		height: 60px;
		outline: none;
		color: #9d9d9d;
		background: none;
		padding: 15px 73px 15px 23px;
		font: 300 25px/30px $source-sans-pro;
		@include placeholder{color: #9d9d9d;};
	}
	.search-close{
		right: 50%;
		width: 16px;
		height: 16px;
		bottom: 100px;
		position: fixed;
		span{
			height: 2px;
			width: 16px;
			display: block;
			@extend %transition;
			background: #9d9d9d;
			transform     : rotate(45deg);
			-o-transform   : rotate(45deg);
			-moz-transform  : rotate(45deg);
			-ms-transform   : rotate(45deg);
			-webkit-transform : rotate(45deg);
			+span{
				margin: -2px 0 0;
				transform     : rotate(-45deg);
				-o-transform   : rotate(-45deg);
				-moz-transform  : rotate(-45deg);
				-ms-transform   : rotate(-45deg);
				-webkit-transform : rotate(-45deg);
			}
		}
		&:hover span{background: $color1;}
	}
}
.search-active .mt-search-popup{
	opacity: 1;
	visibility: visible;
}
.btn-type1{
	border: 0;
	outline: none;
	color: $white;
	padding: 8px 22px;
	background: #808080;
	@extend %transition;
	border-radius: 18px;
	vertical-align: top;
	display: inline-block;
	font: 300 14px/20px $source-sans-pro;
	&:hover{background: $color1;}
}
.btn-type2{
	outline: none;
	color: $black;
	padding: 5px 22px;
	@extend %transition;
	border-radius: 18px;
	vertical-align: top;
	display: inline-block;
	background: transparent;
	border: 1px solid $black;
	text-transform: uppercase;
	font: 14px/20px $font-family-base-1;
	&:focus,
	&:hover{
		color: $white;
		background: $black;
		border: 1px solid $black;
	}
}
.btn-type3{
	outline: none;
	color: $white;
	padding: 9px 20px;
	background: $black;
	@extend %transition;
	border-radius: 21px;
	vertical-align: top;
	display: inline-block;
	border: 1px solid $black;
	text-transform: uppercase;
	font: 300 14px/20px $source-sans-pro;
	&:focus,
	&:hover{
		color: $black;
		background: transparent;
		border: 1px solid $black;
	}
}
.btn-type4{
	color: #aaa;
	outline: none;
	padding: 5px 22px;
	@extend %transition;
	border-radius: 21px;
	vertical-align: top;
	display: inline-block;
	background: transparent;
	border: 1px solid #d1d1d1;
	text-transform: uppercase;
	font: 700 12px/20px $source-sans-pro;
	&:focus,
	&:hover{
		color: $white;
		background: $black;
		border: 1px solid $black;
	}
}