@font-face {
  font-family: Lato;
  font-weight: 400;
  font-style: normal;
  src: url("//mapplegems.com/cdn/fonts/lato/lato_n4.c3b93d431f0091c8be23185e15c9d1fee1e971c5.woff2") format("woff2"),
       url("//mapplegems.com/cdn/fonts/lato/lato_n4.d5c00c781efb195594fd2fd4ad04f7882949e327.woff") format("woff");
}

@font-face {
  font-family: "Josefin Sans";
  font-weight: 400;
  font-style: normal;
  src: url("//mapplegems.com/cdn/fonts/josefin_sans/josefinsans_n4.70f7efd699799949e6d9f99bc20843a2c86a2e0f.woff2") format("woff2"),
       url("//mapplegems.com/cdn/fonts/josefin_sans/josefinsans_n4.35d308a1bdf56e5556bc2ac79702c721e4e2e983.woff") format("woff");
}

@font-face {
  font-family: "Josefin Sans";
  font-weight: 600;
  font-style: normal;
  src: url("//mapplegems.com/cdn/fonts/josefin_sans/josefinsans_n6.afe095792949c54ae236c64ec95a9caea4be35d6.woff2") format("woff2"),
       url("//mapplegems.com/cdn/fonts/josefin_sans/josefinsans_n6.0ea222c12f299e43fa61b9245ec23b623ebeb1e9.woff") format("woff");
}

@font-face {
  font-family: "Josefin Sans";
  font-weight: 500;
  font-style: normal;
  src: url("//mapplegems.com/cdn/fonts/josefin_sans/josefinsans_n5.72427d78743bbf3591b498f66ad0f8361904dc4d.woff2") format("woff2"),
       url("//mapplegems.com/cdn/fonts/josefin_sans/josefinsans_n5.15e133f4dfd3ea9ee7de5283759b87e9708721ae.woff") format("woff");
}


$blue: #007bff;
$indigo: #6610f2;
$purple: #6f42c1;
$pink: #e83e8c;
$red: #f00;
$orange: #fd7e14;
$yellow: #ffc107;
$green: #28a745;
$teal: #20c997;
$cyan: #17a2b8;
$white: #fff;
$black: #000;
$gray: #6c757d;
$gray-dark: #343a40;
$nocolor: transparent;
$error: #dc3545;
$shadow: 0px 6px 15px rgba(0, 0, 0, .12);

$theme-color: #cb8161;
$secondary: #a0a0a0;
$text-color: #868686;
$gray-dark: #000000;
$body-bg: #ffffff;
$border-color: #e7e7e7;

$header-color: #000000;
$header-bg: #ffffff;
$footer-color: #868686;
$footer-color-hover: #cb8161;

$menu-bg: #ffffff;
$menu-color: #000000;
$menu-hover-color: #cb8161;
$menu-dropdown-bg: #ffffff;
$menu-dropdown-color: #868686;
$menu-dropdown-hover-color: #cb8161;
$menu-dropdown-shadow: $shadow;


	$font-family-second: Jost;

$heading-font-weight: 400;
$heading-font-weight-bold: 600;
$heading-font-weight-medium: 500;
$heading-font-weight-light: 300;
$heading-font-style: normal;
$heading-font-size: 30px;


	$font-family-base: Jost;

$body-font-weight: 400;
$body-font-weight-bold: 700;
$body-font-style: normal;
$font-size-base: 14px;

$font-family: $font-family-base;
$font-size: $font-size-base;
$text-color: $text-color;
$color-blankstate: rgba($text-color, .35);
$color-blankstate-background: rgba($text-color, .10);
$sold-out: #d62122;
$star-empty-color: #444;
$star-color: #f7bc3d;
$qoutations-color: rgba(237, 29, 36, .1);
$toast-error-bg: #ff3547;
$overlay-black: rgba(0, 0, 0, .4);
$overlay-white: rgba(255, 255, 255, .4);

$font-icon: 'FontAwesome';

$gutter-width: 30px;

// MIXIN /////////////////////////////
@mixin rtl-margin-left($value){
	
		margin-left: $value;
	
}
@mixin rtl-margin-right($value){
	
		margin-right: $value;
	
}
@mixin rtl-margin($t, $r, $b, $l){
	
		margin: $t $r $b $l;
	
}
@mixin rtl-padding-left($value){
	
		padding-left: $value;
	
}
@mixin rtl-padding-right($value){
	
		padding-right: $value;
	
}
@mixin rtl-padding($t, $r, $b, $l){
	
		padding: $t $r $b $l;
	
}
@mixin rtl-border-left($value){
	
		border-left: $value;
	
}
@mixin rtl-border-right($value){
	
		border-right: $value;
	
}
@mixin rtl-left($value){
	
		left: $value;
	
}
@mixin rtl-right($value){
	
		right: $value;
	
}
@mixin rtl-float-left(){
	
		float: left;
	
}
@mixin rtl-float-right(){
	
		float: right;
	
}
@mixin rtl-text-align-left{
	
		text-align:left;
	
}
@mixin rtl-text-align-right{
	
		text-align:right;
	
}
@mixin rtl-justify-content-left{
	
		justify-content:left;
	
}
@mixin rtl-justify-content-right{
	
		justify-content:right;
	
}
// Box Size
// -------------------------
@mixin box-size($background, $padding-top,$padding-bottom){
    background: $background;
    padding-top: $padding-top;
    padding-bottom: $padding-bottom;
}

// Button
// -------------------------
@mixin button-outline($color, $background, $border, $background-hover, $color-hover, $border-hover) {
    color: $color;
    background-color: $background;
    border: $border;
    @include border-radius(4px);
    &:hover,
    &:focus,
    &:active,
    &.active {
        color: $color-hover;
        background-color: $background-hover;
        border: $border-hover;
    }
    .fa,.icon{
        font-size: $icon-font-size-base;
        margin: 0;
    }
}

// Block
// -------------------------
@mixin block-variant($border, $heading-text-color, $heading-bg-color, $heading-border) {
    border-color: $border;
    background: $heading-bg-color;
    & .#{$block-heading-selector} {
        & span:before, & span:after{ background:$white; }
        color: $heading-text-color;
        background-color: $heading-bg-color;
        border-color: $heading-border;
        + .#{$block-prefix}-collapse .#{$block-content-selector} {
            border-top-color: $border;
        }
    }
    & > .#{$block-prefix}-footer {
        + .#{$block-prefix}-collapse .#{$block-prefix}-body {
            border-bottom-color: $border;
        }
    }
}

@mixin block-elements-styles($border, $heading-text-color, $heading-bg-color, $heading-border, $text-color, $text-color-primary){
    border-color: $border;
    background: $heading-bg-color;
    & .#{$block-heading-selector} {
        color: $heading-text-color;
        background-color: $heading-bg-color;
        border-color: $heading-border;
        + .#{$block-prefix}-collapse .#{$block-content-selector} {
            border-top-color: $border;
        }
    }
    & > .#{$block-prefix}-footer {
        + .#{$block-prefix}-collapse .#{$block-prefix}-body {
            border-bottom-color: $border;
        }
    }
}

/****/
@mixin container-layout-variant($color, $background, $linkcolor,  $topbar-link-color-hover ){
    background: $background;
    color: $color;
    a{
        color:$linkcolor;
    }
    a:hover{
        color: $topbar-link-color-hover;
    }
}

//== Inline block
//==========================================
@mixin inline-block ($haslayout : true){
    display: inline-block;
    vertical-align: middle;
    @if $haslayout == true {
        .lt-ie8 & {
            display: inline;
            zoom: 1;
        }
    }
}

//== vertical block
//==========================================
@mixin vertical-center( $width: 100px, $height: 100px) {
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    margin: auto;
    width: $width;
    height: $height;
    position: absolute;
}

//== Translate X - Y - Z
//==========================================
@mixin translateX($x) {
    -webkit-transform: translateX($x);
    -ms-transform: translateX($x); // IE9 only
    -o-transform: translateX($x);
    transform: translateX($x);
}

@mixin translateY($y) {
    -webkit-transform: translateY($y);
    -ms-transform: translateY($y); // IE9 only
    -o-transform: translateY($y);
    transform: translateY($y);
}

@mixin translateZ($z) {
    -webkit-transform: translateZ($z);
    -ms-transform: translateZ($z); // IE9 only
    -o-transform: translateZ($z);
    transform: translateZ($z);
}

//== Transform
//==========================================
@mixin transform($argument){
    -webkit-transform: ($argument);
    -moz-transform: ($argument);
    -ms-transform: ($argument);
    -o-transform: ($argument);
    transform: ($argument);
}

//== Transform
//==========================================
@mixin transition-delay($time1,$time2){
    -webkit-transition-delay: ($time1,$time2);
    -moz-transition-delay: ($time1,$time2);
    -ms-transition-delay: ($time1,$time2);
    -o-transition-delay: ($time1,$time2);
    transition-delay: ($time1,$time2);
}

//== Background Size
//==========================================
@mixin background-size($size1,$size2) {
    -webkit-background-size: ($size1,$size2);
    -moz-background-size: ($size1,$size2);
    -ms-background-size: ($size1,$size2);
    -o-background-size: ($size1,$size2);
    background-size: ($size1,$size2);
}

//== Background origin
//==========================================
@mixin background-origin($value1,$value2){
    -webkit-background-origin: ($value1,$value2);
    -moz-background-origin: ($value1,$value2);
    -ms-background-origin: ($value1,$value2);
    -o-background-origin: ($value1,$value2);
    background-origin: ($value1,$value2);
}

//== Border radius
//==========================================
@mixin border-radius($radius) {
    border-radius         : $radius;
    -webkit-border-radius : $radius;
    -moz-border-radius    : $radius;
    -ms-border-radius     : $radius;
    -o-border-radius      : $radius;
}

//== Text Shadow
//==========================================
@mixin text-shadow($shadow) {
    text-shadow         : $shadow;
    -webkit-text-shadow : $shadow;
    -moz-text-shadow    : $shadow;
    -ms-text-shadow     : $shadow;
    -o-text-shadow      : $shadow;
}

//== Transform Origin
//==========================================
@mixin transform-origin($originX,$originY) {
    -webkit-transform-origin : $originX $originY;
    -moz-transform-origin    : $originX $originY;
    -ms-transform-origin     : $originX $originY; // IE9 only
    transform-origin         : $originX $originY;
}

//== appearance
//==========================================
@mixin appearance() {
    -webkit-appearance : none;
    -moz-appearance    : none;
    -o-appearance      : none;
    -ms-appearance     : none;
    appearance         : none;
}

//== selection
//==========================================
$prefixes: ("-moz-", "");
@mixin selection($color, $background) {
    @each $prefix in $prefixes {
        ::#{$prefix}selection {
            color: $color;
            background: $background;
        }
    }
}

//== animation fill mode
//==========================================
@mixin animation-fill-mode($fill) {
    -webkit-animation-fill-mode: $fill;
    -moz-animation-fill-mode: $fill;
    -o-animation-fill-mode: $fill;
    animation-fill-mode: $fill;
}

//== filter
//==========================================
@mixin filter($argument){
    filter         : $argument;
    -webkit-filter : $argument;
    -moz-filter    : $argument;
    -o-filter      : $argument;
    -ms-filter     : $argument;
}

// Clear Lists
// -------------------------
@mixin clear-list(){
    padding    : 0;
    list-style : none;
}

// Formart lists widget
// -------------------------
@mixin lists-style() {
    ul,ol{
        @include clear-list();
        li{
            &:first-child{

            }
            .children{
                > li{
                    &:before{
                        top: 24px;
                    }
                }
            }
        }
        ul{
            li:first-child{
                padding-top: 14px;
                background-position: 0 24px;
            }
        }
    }
}
@mixin box-shadow-market(){
    @include box-shadow(0 2px 2px -1px rgba(0, 0, 0, 0.1));
    border-bottom: rgba(0, 0, 0, 0.3);
}

// Position mixin
//==========================================
// @param [string] $position: position type
// @param [list] $args: list of offsets and values
//==========================================
@mixin position($position, $args) {
    @each $o in top right bottom left {
        $i: index($args, $o);
        @if $i
            and $i + 1 <= length($args)
            and type-of( nth($args, $i + 1) ) == number {
            #{$o}: nth($args, $i + 1);
        }
    }
    position: $position;
}


// Absolute positioning mixin
//==========================================
// @param [list] $args: list of offsets and values
//==========================================
@mixin absolute($args) {
    @include position(absolute, $args);
}

// Arrow mixin
//==========================================
// @param [string] $direction: arrow direction
// @param [list] $position: list of offsets and values
// @param [color] $color (inherit): arrow color
// @param [number] $size (1em): arrow size
//==========================================
@mixin triangle($direction, $position, $color: currentColor, $size: 1em) {
    // Make sure the direction is valid
    @if not index(top right bottom left, $direction) {
        @warn "Direction must be one of top, right, bottom or left.";
    }

    @else {
        @include absolute($position); // Position
        @include square(0); // Size
        content: '';
        z-index: 2;

        border-#{opposite-position($direction)}: $size * 1.5 solid $color;
        $perpendicular-borders: $size solid transparent;

        @if $direction == top or $direction == bottom {
            border-left:   $perpendicular-borders;
            border-right:  $perpendicular-borders;
        }

        @else if $direction == right or $direction == left {
            border-bottom: $perpendicular-borders;
            border-top:    $perpendicular-borders;
        }
    }
}


// Font size - rem
//==========================================

@function parseInt($n) { /* 2 */
  @return $n / ($n * 0 + 1);
}

@mixin font-size($property, $values) {
	#{$property}: $values;
}


//== Border
//==========================================
@mixin border( $coordinates: 0 0 0 0, $colour: $border-color, $style: solid ) {
    $top: nth($coordinates, 1);
    $right: nth($coordinates, 2);
    $bottom: nth($coordinates, 3);
    $left: nth($coordinates, 4);
    @if not(unitless($top)) {
        border-top: $top $style $colour;
    }
    @if not(unitless($right)) {
        border-right: $right $style $colour;
    }
    @if not(unitless($bottom)) {
        border-bottom: $bottom $style $colour;
    }
    @if not(unitless($left)) {
        border-left: $left $style $colour;
    }
}

// State and hover
//==========================================
@mixin state-hover-default($time, $background, $border-color){
    @include transition(all $time);
    &:hover{
      background: $background!important;
      border-color: $border-color!important;
    }
}

@mixin state-hover($time,$height,$color){
    @include box-shadow(inset 0 0 0 0 $color);
    @include transition(all $time cubic-bezier(0.8,0,0,1));
    &:hover{
        @include transition(all $time cubic-bezier(0.8,0,0,1));
        @include box-shadow(inset 0 (-$height) 0 0 $color);
    }
}

@mixin state-hover-2($background){
    position: relative;
    z-index: 10;
    &:after{
        content: "";
        display: block;
        z-index: -50;
        background-color: $background;
        visibility: hidden;
        @include scale(0);
        @include vertical-center(100%,100%);
        @include opacity(0);
        @include transition-delay(0.3s,0s);
        @include transition(transform 0s cubic-bezier(0.19,1,0.22,1) 0.3s,opacity 0.3s cubic-bezier(0.19,1,0.22,1));
    }
    &:hover{
        &:after{
            visibility: visible;
            @include scale(1);
            @include opacity(1);
            @include transition(transform 0.6s cubic-bezier(0.19,1,0.22,1),opacity 0.5s cubic-bezier(0.19,1,0.22,1));
        }
    }
}



//== Flexible Layout
//==========================================

@mixin flexbox {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    display: flex;
}

%flexbox {
    @include flexbox;
}

@mixin inline-flex {
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
}

%inline-flex {
    @include inline-flex;
}



// Retina Sprite Mixins

@mixin retina-sprite-background($url,$position,$width,$height){
    background-repeat: no-repeat;
    background-image: url($url);
    background-position: $position;
    width:$width;
    height:$height;
}

// Product image Ratio
// OVERRIDE BOOTSTRAP
body {
  color: $text-color;
  background-color: $body-bg;
  font-family: $font-family;
  font-size: $font-size-base;
  font-weight: $body-font-weight;
  font-style: $body-font-style;
  line-height:1.7;
}

.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: $font-family-second;
	font-weight: $heading-font-weight-medium;
	color:$gray-dark;
}
img{
	max-width:100%;
	height:auto;
}
a {
	color:$gray-dark;
	&:hover,
	&:focus {
		outline: 0;
		color:$theme-color;
		text-decoration:none;
	}
}
.hidden,.visually-hidden{
	display:none;
}
button:focus,.btn:focus{
	outline: unset;
	box-shadow: unset;
}
button, input, optgroup, select, textarea{
	&:focus-visible {
		outline: unset;
	}
}
.container {
	@media (min-width: 576px){
		max-width: 100%;
	}
	@media (min-width: 768px) {
		max-width: 100%;
	}
	@media (min-width: 1440px) {
		max-width: 1440px;
	}
	&.container-full-image{
		max-width:100%;
		padding:0;
	}
	@media (max-width: 1510px) and (min-width: 1200px){
		padding-left:30px;
		padding-right:30px;
	}
}
.rtl {
    direction: rtl;
	text-align: right;
}
.bwp-container{
	margin-left:auto;
	margin-right:auto;
	padding-left:15px;
	padding-right:15px;
}
@media (min-width: 1200px){
	.hidden-lg{
		display: none !important;
	}
}
@media (min-width: 992px) and (max-width: 1199px){
	.hidden-md{
		display: none !important;
	}
}
@media (min-width: 768px) and (max-width: 991px){
	.hidden-sm{
		display: none !important;
	}
}
@media (max-width: 767px){
	.hidden-xs{
		display: none !important;
	}
}
.col-2-5{
	flex: 20%;
	max-width: 20%;
}
@media (min-width: 576px){
	.col-sm-2-5{
		flex: 20%;
		max-width: 20%;
	}
}
@media (min-width: 768px){
	.col-md-2-5{
		flex: 20%;
		max-width: 20%;
	}
}
@media (min-width: 991px){
	.col-lg-2-5{
		flex: 20%;
		max-width: 20%;
	}
}
@media (min-width: 1200px){
	.col-xx-2-5{
		flex: 20%;
		max-width: 20%;
	}
}
@media (min-width: 1440px){
	.col-xl-2-5{
		flex: 20%;
		max-width: 20%;
	}
}
.btn {
  display: block;
  padding: 10px 30px;
  border-radius: 0;
  font-family: $font-family-base;
  font-size: 12px;
  text-transform: uppercase;
  transition: all .3s ease;
}

.btn-primary {
  color: $white;
  background-color: $theme-color;
  border: 1px solid $theme-color;

  &:hover,
  &:active,
  &:focus {
    color: $white;
    background-color: darken($theme-color, 5%);
    border-color: darken($theme-color, 5%);
  }
}

.btn-secondary {
	color: $gray-dark;
	background-color: $white;
	border: 1px solid $border-color;
	&:hover,
	&:active,
	&:focus {
		color: $gray-dark;
		background-color: $border-color;
		border-color: $border-color;
	}
}

.form-control {
	height: 44px;
	border-radius: 0;
	padding: 11px 20px 12px;
	color: $text-color;
	font-family: $font-family;
	font-size: $font-size;
	line-height: 20px;
	&:focus {
		border-color: $gray-dark;
		box-shadow: none;
	}
}

.table {
	color: $text-color;
}

.alert,.dropdown-menu {
	border-radius: 0;
}

// PREVIEW BAR

iframe#preview-bar-iframe{
	display: none !important;
}
html{
	height:100%;
}

// BASE ELEMENT
.pre-loading-image{
	z-index:-1;
	opacity:0;
    display:none;
	.preload-img-product{
		position:absolute;
		top:50%;
		left:50%;
		@include transform(translate(-50%,-50%));
		//text-transform: uppercase;
		background-image: linear-gradient(-225deg,#f5f5f5 0%,#f5f5f5 15%,#ccc 60%,#ccc 100%);
		background-size: 200% auto;
		color: $white;
		-webkit-background-clip: text;
		-webkit-text-fill-color: transparent;
		animation: textclip 1s linear infinite;
		display: inline-block;
		font-size: 20px;
		font-weight: 500;
	}
}
.pre-loading {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999;
	width:100%;
	> div {
		position: absolute;
		top: 0;
		width: 0;
		height: 3px;
		background: $theme-color;
		
	}
	&.load-product{
		> div {
			transition: width 0.25s ease-in-out;
		}
	}
	&.loading-page{
		>div{
			-webkit-animation-name: loading-page;
			animation-name: loading-page;
			-webkit-animation-duration: 0.5s;
			animation-duration: 0.5s;
			-webkit-animation-timing-function: linear;
			animation-timing-function: linear;
			-webkit-animation-iteration-count: 1;
			animation-iteration-count: 1;
			animation-fill-mode: forwards;
		}
	}
	&.loading-done{
		>div{
			-webkit-animation-name: loading-page-done;
			animation-name: loading-page-done;
			-webkit-animation-duration: 1s;
			animation-duration: 1s;
			-webkit-animation-timing-function: linear;
			animation-timing-function: linear;
			-webkit-animation-iteration-count: 1;
			animation-iteration-count: 1;
			animation-fill-mode: forwards;
		}
	}
}

#shopify-section-blog-sidebar:empty {
	display: none;
}

.hidden-desktop {
	@media (min-width: 768px) {
		display: none;
	}
}

.hidden-mobile {
	@media (max-width: 767px) {
		display: none;
	}
}

.fade-in {
	transform: scale(1.1);
    opacity: 0;
    transition: transform .8s cubic-bezier(.215,.61,.355,1),opacity .8s cubic-bezier(.215,.61,.355,1);
	transition-delay:0.5s;
	&.lazyloaded {
		opacity: 1;
		transform: scale(1);
	}
}

.placeholder-svg {
	fill: $color-blankstate;
	background-color: $color-blankstate-background;
	width: 100%;
	height: 100%;
	max-width: 100%;
	max-height: 100%;
}

.wpbingo-banner {
	position: relative;
	overflow: hidden;
	img {
		max-width: 100%;
		transition: all .3s ease;
		&:hover {
			transform: scale(1.1);
		}
	}
}

.wpbingo-loading {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999;
	display: block;
	width: 100vw;
	height: 100vh;
	background-color: rgba($white, .9);
}

@keyframes line-scale {
	0%,100% {
		transform: scale(1);
	}
	50% {
		transform: scale(.4);
	}
}

.wpbingo-loading__icon {
	position: absolute;
	top: 50%;
	left: 50%;
	display: flex;
	transform: translate(-50%, -50%);
	> span {
		margin: 0 2px;
		display: block;
		width: 4px;
		height: 25px;
		background-color: $theme-color;
		&:nth-child(1) {
			animation: line-scale 1s -.4s infinite cubic-bezier(.2, .68, .18, 1.08);
		}
		&:nth-child(2) {
			animation: line-scale 1s -.3s infinite cubic-bezier(.2, .68, .18, 1.08);
		}
		&:nth-child(3) {
			animation: line-scale 1s -.2s infinite cubic-bezier(.2, .68, .18, 1.08);
		}

		&:nth-child(4) {
			animation: line-scale 1s -.1s infinite cubic-bezier(.2, .68, .18, 1.08);
		}
	}
}

.rte {
	margin-bottom: $gutter-width / 2;
	line-height: 2em;
	&:after {
		content: '';
		display: block;
		clear: both;
	}
	p,ul,ol,table {
		margin-bottom: 20px;
	}
	ul {
		ul {
			margin-bottom: 0;
		}
	}

	h1, h2, h3, h4, h5, h6 {
		padding-top: 10px;
		color: $gray-dark;
		&:first-child {
			margin-top: 0;
		}
		a {
			text-decoration: none;
		}
	}
	li {
		margin-bottom: 0;
	}
	> p:last-child {
		margin-bottom: 0;
	}
	table {
		table-layout: fixed;
	}
	img {
		display: block;
		max-width: 100%;
	}
}
.btn--secondary-accent {
	width: 50%;
}
.scroll-to-fixed-fixed {
	z-index: 8 !important;
}

.shopify-challenge__container {
	padding: 100px 0 80px;
}
.shopify-challenge__button {
	display: block;
	padding: 10px 30px;
	color: $white;
	background-color: $theme-color;
	border: 1px solid $theme-color;
	border-radius: 0;
	font-family: $font-family-second;
	font-size: $font-size;
	font-weight: $heading-font-weight-medium;
	text-transform: uppercase;
	transition: all .3s ease;
	&:hover,
	&:active,
	&:focus {
		color: $white;
		background-color: darken($theme-color, 5%);
		border-color: darken($theme-color, 5%);
	}
}
.shopify-policy__container {
	padding-top: 80px;
	padding-bottom: 50px;
}
.shopify-policy__title {
	margin: 0 0 30px;
	color: $gray-dark;
}
.form-button {
	~ .form-button {
		margin-top: 15px;
	}
}
// SLICK
.slick-slider {
	position: relative;
	display: block;
	user-select: none;
	touch-action: pan-y;
	.slick-track,
	.slick-list {
		transform: translate3d(0, 0, 0);
	}
}
.slick-list {
	position: relative;
	display: block;
	margin: 0 -15px;
	padding: 0;
	overflow: hidden;
	&:focus {
		outline: none;
	}
	&.dragging {
		cursor: pointer;
		cursor: hand;
	}
	@media (max-width:1199px){
		margin: 0 -7.5px;
		.slick-slide{
			padding:0 7.5px;
		}
	}
}

.slick-track {
	position: relative;
	left: 0;
	top: 0;
	display: block;
	margin-left: auto;
	margin-right: auto;
	&:before,
	&:after {
		content: '';
		display: table;
	}
	&:after {
		clear: both;
	}
	.slick-loading & {
		visibility: hidden;
	}
}

.slick-slide {
	display: none;
	float: left;
	height: 100%;
	min-height: 1px;
	padding:0 15px;
	[dir="rtl"] & {
		float: right;
	}
	img {
		display: block;
	}
	&.slick-loading {
		img {
			display: none;
		}
	}
	&.dragging {
		img {
			pointer-events: none;
		}
	}
	.slick-initialized & {
		display: block;
	}
	.slick-loading & {
		visibility: hidden;
	}
	.slick-vertical & {
		display: block;
		height: auto;
		border: 1px solid transparent;
	}
	&:focus {
		outline: 0;
	}
}
.slick-dotted {
	margin-bottom: 50px;
}
.slick-arrow {
    font-size: 0;
    top: 35%;
    position: absolute;
    z-index: 1;
    transition: all .3s ease;
    font-family: feather;
    border: 0;
	opacity:0;
	visibility:hidden;
	width:30px;
	height:30px;
	line-height:30px;
	padding:0;
	background:$white;
	color:$gray-dark;
	text-align:center;
	box-shadow: 0 5px 10px 5px rgba($gray-dark,0.04);
	&:before{
		font-size:20px;
		@media (max-width:767px){
			font-size: 16px;
		}
	}
	&:hover{
		color:$white;
		background:$theme-color;
	}
	@media (max-width:767px){
		width:25px;
		height:25px;
		line-height:25px;
		padding:0;
		background:$white;
		color:$gray-dark;
		text-align:center;
		opacity:1;
		visibility:visible;
		box-shadow: 0 5px 10px 5px rgba($gray-dark,0.04);
	}
}

.slick-prev {
	left: -40px;
	&::before {
		content: "\e92f";
	}
	@media (max-width:1500px){
		left:-15px;
	}
	@media (max-width:767px){
		left:0;
	}
}

.slick-next {
	right: -40px;
	&::before {
		content: "\e930";
	}
	@media (max-width:1500px){
		right:-15px;
	}
	@media (max-width:767px){
		right:0;
	}
}

.slick-dots {
	position: absolute;
	left: 0;
	width: 100%;
	bottom: 30px;
	display: flex;
	flex-wrap: row wrap;
	justify-content: center;
	margin: 0;
	padding: 0;
	list-style: none;
	li {
		padding: 0 8px;
		&.slick-active {
			button {
				background-color: $gray-dark;
				@media (max-width:767px){
					background-color: $gray-dark !important;
				}
			}
		}
	}
	button {
		display: block;
		width: 8px;
		height: 8px;
		padding: 0;
		border: 0;
		border-radius: 50%;
		background-color: $border-color;
		font-size: 0;
		&:hover,
		&:focus {
			outline: 0;
			box-shadow: none;
		}
		@media (max-width:767px){
			background-color: $border-color !important;
		}
	}
}
main.designMode_active{
	.slick-carousel {
		display: block;
	}
	.wpbingo-slideshow .slideshow-caption{
		opacity:1;
	}
	.wpbingo-slideshow:not(.slick-initialized) .wpbingo-slideshow__item {
		display: block;
	}
}
.slick-carousel {
	display: none;
	overflow:hidden;
	&.slick-initialized {
		display: block;
	}
	.slick-carousel__item {
		padding-left: $gutter-width / 2;
		padding-right: $gutter-width / 2;
		@media screen and (max-width: 1199px) {
			padding-left: 7.5px;
			padding-right: 7.5px;
		}
		&.slick-slider-collection{
			@media screen and (max-width: 767px) {
				padding-left: 15px;
				padding-right: 15px;
			}
		}
		
	}
}
.bwp_slider-carousel{
	position:relative;
	&:hover{
		.slick-arrow{
			opacity:1;
			visibility:visible;
		}
	}
}

// HEADER
@media (max-width:991px){
	.hide_ipad{
		display:none !important;
	}
}
@media (max-width:767px){
	.hide_mobile{
		display:none !important;
	}
}
.social-icons{
	padding:0;
	margin:0;
	list-style:none;
	display: flex;
    flex-wrap: wrap;
	li{
		margin:0 10px;
		&:first-child{
			margin-left:0;
		}
		&:last-child{
			margin-right:0;
		}
	}
	a{
		color:$text-color;
		&:hover{
			color:$theme-color;
		}
		span{
			display:none;
		}
	}
}
.currencies.bwp_currency{
	position:relative;
	&.have-flags{
		.flags_bwp-VND:before {
			background-image: url(vnd.svg?19041994);
		}
		.flags_bwp-USD:before {
			background-image: url(usd.svg?19041994);
		}
		.flags_bwp-AUD:before {
			background-image: url(aud.svg?19041994);
		}
		.flags_bwp-GBP:before {
			background-image: url(gbp.svg?19041994);
		}
		.flags_bwp-CAD:before {
			background-image: url(cad.svg?19041994);
		}
		.flags_bwp-DKK:before {
			background-image: url(dkk.svg?19041994);
		}
		.flags_bwp-EUR:before {
			background-image: url(eur.svg?19041994);
		}
		.flags_bwp-HKD:before {
			background-image: url(hkd.svg?19041994);
		}
		.flags_bwp-JPY:before {
			background-image: url(jpy.svg?19041994);
		}
		.flags_bwp-NZD:before {
			background-image: url(nzd.svg?19041994);
		}
		.flags_bwp-SGD:before {
			background-image: url(sgd.svg?19041994);
		}
		.current{
			display: flex;
			align-items: center;
			&:before{
				content:"";
				display:inline-block;
				width: 23px;
				height: 13px;
				background-size: contain;
				background-repeat: no-repeat;
			}
		}
		.bwp-currency{
			li{
				a{
					display: flex;
					align-items: center;
					&:before{
						content:"";
						display:inline-block;
						width: 25px;
						height: 15px;
						background-size: contain;
						background-repeat: no-repeat;
					}
				}
			}
		}
	}
	.bwp-currency{
		position:absolute;
		top:100%;
		@include rtl-right(0);
		padding:0;
		list-style:none;
		background:$white;
		padding:20px;
		box-shadow: 0 5px 10px 5px rgba($gray-dark,0.04);
		z-index:10;
		margin:0;
		min-width:120px;
		li{
			line-height:18px;
			margin-bottom:8px;
			padding-bottom:8px;
			border-bottom:1px solid rgba(#e5e5e5,0.5);
			&:last-child{
				margin-bottom:0;
				padding-bottom:0;
				border-bottom:0;
			}
			a{
				color:$gray-dark;
				font-size:$font-size - 2;
				&:hover{
					color:$theme-color;
				}
			}
		}
	}
}
.bwp-header-topbar {
	position:relative;
	&.active-index{
		z-index:-1 !important;
	}
	.content-topbar{
		justify-content:space-between;
		&.text-center{
			justify-content:center;
		}
		>div{
			flex:1;
			padding: 0 15px;
			&:nth-child(2){
				text-align: center;
				.item{
					justify-content:center;
				}
			}
			&:nth-child(3){
				text-align: center;
				.item{
					justify-content:center;
				}
			}
			&:last-child{
				@include rtl-text-align-right();
				.item{
					@include rtl-justify-content-right();
				}
			}
		}
	}
	.language-currency{
		display:flex;
		align-items: center;
		display: flex;
		>*{
			display:flex;
			&:before{
				content:"";
				width:1px;
				height:20px;
				background:rgba($gray-dark,0.2);
				margin:0 15px;
				display:inline-block;
			}
			&:first-child{
				&:before{
					display:none;
				}
			}
		}
	}
	.content-item-custom-text a{
		display: initial;
		border-bottom:1px solid var(--color-link);
	}
	.content-item-text-with-icon{
		.custom-text{
			display:flex;
			flex-wrap:wrap;
			i{
				@include rtl-margin-right(10px);
			}
			>*{
				display:flex;
				align-items: center;
				&:before{
					content:"";
					width:1px;
					height:20px;
					background:rgba($gray-dark,0.2);
					margin:0 15px;
					display:inline-block;
				}
				&:first-child{
					&:before{
						display:none;
					}
				}
			}
			.text-icon1{
				color:var(--color1);
				a{
					color:var(--color1);
				}
			}
			.text-icon2{
				color:var(--color2);
				a{
					color:var(--color2);
				}
			}
		}
	}
	@media (max-width:1050px){
		.content-topbar{
			>div{
				flex:0 0 100%;
				max-width:100%;
				margin:5px 0;
				text-align:center;
				.item{
					justify-content:center !important;
				}
				.social-icons{
					justify-content:center;
				}
			}
		}
	}
}
.bwp-header-campar{
	&.hide_mobile{
		@media (max-width:767px){
			display:none !important;
		}
	}
	.content-campbar{
		overflow:hidden;
		text-align:center;
		position:relative;
	}
	ul{
		padding:5px 0;
		list-style:none;
		display:flex;
		white-space: nowrap;
		margin:0;
		li{
			-webkit-animation-name: marquee;
			animation-name: marquee;
			-webkit-animation-timing-function: linear;
			animation-timing-function: linear;
			-webkit-animation-iteration-count: infinite;
			animation-iteration-count: infinite;
			a{
				padding:0 15px;
			}
		}
		&:hover{
			li{
				animation-play-state: paused;
			}
		}
	}
	.close-campbar{
		cursor: pointer;
		position: absolute;
		top: calc(50% - 10px);
		right: 80px;
		text-align: center;
		z-index: 1;
		display: inline-block;
		width: 20px;
		height: 20px;
		padding: 6px;
		border-radius: 100%;
		-webkit-border-radius: 100%;
		-moz-border-radius: 100%;
		-ms-border-radius: 100%;
		-o-border-radius: 100%;
		box-shadow: 0 2px 59px #0006;
		background:$white;
		&:before,&:after{
			content: "";
			position: absolute;
			height: 1px;
			width: 10px;
			top: 50%;
			left: calc(50% - 5px);
			margin-top: -1px;
			background-color: $gray-dark;
			-webkit-transition: all .3s ease;
			transition: all .3s ease;
		}
		&:before{
			transform-origin: 50% 50%;
			-webkit-transform: rotate(-45deg);
			transform: rotate(-45deg);
		}
		&:after{
			transform-origin: 50% 50%;
			-webkit-transform: rotate(45deg);
			transform: rotate(45deg);
		}
		&:hover{
			&:before,&:after{
				-webkit-transform: rotate(0deg);
				transform: rotate(0deg);
			}
		}
		@media (max-width:767px){
			right:15px;
		}
	}
}
.bwp-header{
	.container{
		max-width: 1770px;
		@media (max-width: 1800px) and (min-width: 1200px){
			padding-left: 30px;
			padding-right: 30px;
		}
	}
	.header-desktop{
		position:relative;
	}
	.header-center__inner {
		display: flex;
		align-items: center;
	}
	&.header_1{
		.header-left,.header-right{
			flex:1;
		}
	}
	&.header_2{
		.header-left,.header-right{
			flex:1;
		}
		.header-center{
			flex:4;
		}
		.header-desktop {
			.header-logo {
				margin: 0 70px;
			}
		}
		.header-center {
			align-items: center;
			justify-content: center;
		}
		&.sticky{
			padding:20px 0;
			background:$white;
			position:fixed;
			width:100%;
			left:0;
			z-index:99;
			animation-name: sticky-header;
			animation-duration: 0.5s;
			animation-timing-function: ease-in-out;
			animation-iteration-count: 1;
			box-shadow: 0 1px 5px 2px rgba($gray-dark,0.1);
			top:0;
		}
	}
	&.header_3{
		.header-desktop .header-logo,.header-right{
			flex:1;
		}
		.header-left{
			.main-menu__nav{
				justify-content:center;
			}
		}
	}
	&.header_4{
		.header-desktop {
			.header-center__inner {
				justify-content: center;
				>div{
					flex: 1;
				}
			}
			.header-logo {
				display: flex;
				justify-content: center;
			}
			.main-menu__nav {
				justify-content: center;
			}
		}
	}
	&.header_5{
		.header-desktop {
			.header-left {
				flex: 1;
				@include rtl-margin-left(60px);
			}
			.main-menu__nav {

			}
		}
	}
	.header-sticky{
		padding:20px 0;
		background:$white;
		position:fixed;
		width:100%;
		left:0;
		z-index:99;
		display:none;
		animation-name: sticky-header;
		animation-duration: 0.5s;
		animation-timing-function: ease-in-out;
		animation-iteration-count: 1;
		box-shadow: 0 1px 5px 2px rgba($gray-dark,0.1);
		top:0;
		.header-logo{
			flex: revert;
			max-width: revert;
		}
		.header-logo, .header-right {
			flex: 1;
		}
		.header-main {
			flex: 2;
		}
		.main-menu__nav-item {
			>a {
				color: $header-color;
				span {
					&:before {
						background: $header-color;
					}
				}
			}
		}
		.main-menu__nav {
			justify-content: center;
		}
	}
	&.sticky{
		.header-sticky{
			display:block;
		}
		.header-mobile .header-center__inner{
			padding:10px 0;
		}
		.header-top-mobile{
			background:$white;
			position:fixed;
			width:100%;
			left:0;
			z-index:5;
			animation-name: sticky-header;
			animation-duration: 0.5s;
			animation-timing-function: ease-in-out;
			animation-iteration-count: 1;
			box-shadow: 0 1px 10px 5px rgba($gray-dark,0.05);
			top:0;
		}
	}
	@media (max-width:1050px){
		padding:0 !important;
	}
}
.header {
	color: $header-color;
	background-color: $header-bg;
}
.header-selector {
	position: relative;
	&.show{
		.header-selector__toggle{
			&:after{
				@include transform(rotate(0));
			}
		}
	}
}
.header-selector__toggle {
	cursor: pointer;
	display: flex;
	line-height: 20px;
	text-transform: capitalize;
	&::after {
		content: '\e924';
		pointer-events: none;
		display: inline-block;
		font-family: bwpfont;
		margin:0;
		@include rtl-margin-left(3px);
		@include transform(rotate(180deg));
		transition:all 0.3s ease;
		color: $text-color;
		font-size: 13px;
	}
}
.header-selector__dropdown {
	margin: 0;
	padding: 0;
	border-radius: 0;
	border: 0;
	box-shadow: $shadow;
	.header-selector__item {
		a {
			color: $text-color;
			line-height:25px;
			&:hover {
				color: $theme-color;
			}
		}
	}
	.locale-selector__item--current {
		a {
			color: $theme-color;
		}
	}
}
.header-selector__list {
	margin: 0;
	padding: 10px 0;
	list-style: none;
}
.header-selector__item {
	padding: 0 20px;
	a {
		display: block;
		padding: 6px 0;
		border-bottom: 1px solid $border-color;
		font-size: $font-size - 1;
		text-transform: capitalize;
		transition: color .3s ease;
		&:hover {
			text-decoration: none;
		}
	}
	&:last-child {
		a {
		  border-bottom: 0;
		}
	}
}
.header-page-link{
	display: flex;
	align-items: center;
	justify-content: flex-end;
	.wishlist{
		font-size: 20px;
		cursor: pointer;
		@include rtl-margin-right(20px);
		position: relative;
		top: 2px;
		transition: all .3s ease;
		color:$header-color;
		.count{
			position:absolute;
			width:18px;
			height:18px;
			border-radius:50%;
			background:$theme-color;
			color:$white;
			line-height:18px;
			font-size:10px;
			text-align:center;
			top: -5px;
			@include rtl-right(-12px);
		}
		&:hover{
			color:$theme-color;
		}
		@media (max-width:1199px){
			@include rtl-margin-right(15px);
		}
	}
}
.header-logo__link {
	display: block;
}
.header-logo__link--text {
	color: $header-color;
	font-size: 20px;
	font-weight: bold;
	text-transform: uppercase;
	&:hover {
		color: $header-color;
		text-decoration: none;
	}
}
.header-logo__img {
	display: block;
}
.header-search-mobile {
	position: fixed;
	top: 0;
	left: 0;
	z-index: -1;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	padding: 30px;
	background-color: rgba($black, .7);
	opacity: 0;
	visibility: hidden;
	transition: all .5s ease-in-out;
	.modal-search--open & {
		z-index: 90;
		opacity: 1;
		visibility: visible;
	}
	@media screen and (min-width: 1025px) {
		display: none;
	}
	.dropdown-toggle {
		color: $text-color;
	}
}
.search-toggle{
	font-size: 20px;
	line-height: 1;
	cursor:pointer;
	@include rtl-margin-right(20px);
	position: relative;
    top: 2px;
	transition:all 0.3s ease;
	color:$header-color;
	&:hover{
		color:$theme-color;
	}
	@media (max-width:1199px){
		@include rtl-margin-right(15px);
	}
}
body.active_search{
	overflow:hidden;
}
.content-search-toggle{
	position: fixed;
    width: 100vw;
    height: 100vh;
    top: 0;
    left: 0;
    z-index: 99;
	opacity:0;
	visibility:hidden;
	transition:all 0.3s ease;
	&.active{
		opacity:1;
		visibility:visible;
		>.close-search-toggle{
			display:block;
		}
		.contents-search{
			transform:translateY(0);
			opacity:1;
			visibility:visible;
		}
	}
	>.close-search-toggle{
		position: fixed;
		width: 100vw;
		height: 100vh;
		background:rgba($gray-dark,0.25);
		display:none;
	}
	.content-menu-search{
		display:flex;
		align-items:center;
		padding:35px 15px;
		display: flex;
		flex-wrap:wrap;
		max-width: 960px;
		margin: auto;
		.title{
			color:$gray-dark;
		}
		.list-collection{
			padding:0;
			list-style:none;
			display:flex;
			margin:0;
			white-space:nowrap;
			overflow:auto;
			padding:10px 0;
			li{
				@include rtl-margin(5px ,0 ,5px ,10px);
			}
			a{
				display:inline-block;
				line-height:28px;
				border:1px solid #e2e2e2;
				min-width:80px;
				padding:0 15px;
				text-align:center;
				color:$text-color;
				&:hover{
					color:$gray-dark;
					border-color:$gray-dark;
				}
			}
		}
	}
	.contents-search{
		background:$white;
		padding:100px 0 50px;
		opacity:0;
		visibility:hidden;
		transform:translateY(-100%);
		transition:transform 0.3s ease;
		max-height:90%;
		display: flex;
		flex-direction: column;
		position:relative;
		z-index:99;
		.contents-search-top{
			overflow:auto;
			margin:auto;
			max-width: 1770px;
			width: 100%;
			&::-webkit-scrollbar-track
			{
				background-color: #ececec;
			}
			&::-webkit-scrollbar
			{
				width: 2px;
				background-color: #ececec;
			}
			&::-webkit-scrollbar-thumb
			{
				background-color:$gray-dark;
			}
		}
	}
	.search-modals__form[results=true]{
		.predictive-search{
			display:block;
		}
	}
	.predictive-search-content{
		max-width:1440px;
		margin:auto;
		display:flex;
		flex-wrap:wrap;
		@include rtl-text-align-left();
		.predictive-search-content-product{
			max-width:66.66%;
			flex:0 0 66.66%;
			padding:0 15px;
			&.full{
				max-width:100%;
				flex:0 0 100%;
				.predictive-search__results-list li{
					width:25%;
					@media (max-width:1199px){
						width:33.33%;
					}
					@media (max-width:991px){
						width:33.33%;
					}
					@media (max-width:767px){
						width:50%;
					}
				}
			}
		}
		.predictive-search-content-blog{
			max-width:33.33%;
			flex:0 0 33.33%;
			padding:0 15px;
			.predictive-search__results-list li{
				width:100%;
				margin-bottom:8px;
				a{
					color:$text-color;
					&:hover{
						color:$theme-color;
					}
				}
			}
		}
	}
	.close-search{
		cursor: pointer;
		position: absolute;
		top: 30px;
		right: 30px;
		text-align: center;
		z-index: 1;
		display: inline-block;
		width: 28px;
		height: 28px;
		padding: 6px;
		border-radius: 100%;
		-webkit-border-radius: 100%;
		-moz-border-radius: 100%;
		-ms-border-radius: 100%;
		-o-border-radius: 100%;
		&:before,&:after{
			content: "";
			position: absolute;
			height: 1px;
			width: 20px;
			top: 50%;
			left: calc(50% - 10px);
			margin-top: -1px;
			background-color: $gray-dark;
			-webkit-transition: all .3s ease;
			transition: all .3s ease;
		}
		&:before{
			transform-origin: 50% 50%;
			-webkit-transform: rotate(-45deg);
			transform: rotate(-45deg);
		}
		&:after{
			transform-origin: 50% 50%;
			-webkit-transform: rotate(45deg);
			transform: rotate(45deg);
		}
		&:hover{
			&:before,&:after{
				-webkit-transform: rotate(0deg);
				transform: rotate(0deg);
			}
		}
	}
	.search-top{
		display: flex;
		justify-content: space-between;
		padding-bottom:5px;
		border-bottom:1px solid #e9e9e9;
		margin-bottom:40px;
		.count-search{
			color:$gray-dark;
		}
		.button-view{
			a{
				display:inline-block;
				color:$text-color;
				display:flex;
				align-items:center;
				i{
					display:inline-block;
					@include rtl-margin-left(5px);
				}
				&:hover{
					color:$theme-color;
				}
			}
		}
	}
	.header__search{
		width: 100%;
	}
	.predictive-search{
		position: absolute;
		display:none;
		width: 100vw;
		left: 0;
		padding:10px 0 40px;
		background:$white;
		overflow:auto;
	}
	.search-modal{
		.content-input{
			max-width: 960px;
			margin: auto;
			padding: 0 15px;
		}
		.field{
			display: flex;
			display:flex;
			width:100%;
			border-bottom:1px solid #ebebeb;
			height:50px;
			line-height:48px;
			&:focus-within{
				border-bottom:1px solid $gray-dark;
			}
		}
		.search__input{
			border: 0;
			background: transparent;
			width:100%;
			font-size: 22px;
			padding:0;
			color:$gray-dark;
			&:focus-visible{
				outline:unset;
			}
		}
		.predictive-search__heading{
			text-align:center;
			margin:0 0 30px;
			font-family:$font-family-base;
			font-size:20px;
			color:$text-color;
		}
		.search__button{
			font-size:0;
			background:transparent;
			border:0;
			color:$gray-dark;
			padding:0;
			line-height:48px;
			i{
				font-size:22px;
				line-height:48px;
			}
			&:hover{
				color:$theme-color;
			}
		}
		.predictive-search__results-list{
			display: flex;
			flex-wrap: wrap;
			z-index: 10;
			position: relative;
			background: $white;
			overflow-y: auto;
			padding: 0;
			overflow-x: hidden;
			left: 0;
			list-style: none;
			margin: 0 -15px;
			&::-webkit-scrollbar-track
			{
				background-color: #F5F5F5;
			}
			&::-webkit-scrollbar
			{
				width: 5px;
				background-color: #F5F5F5;
			}

			&::-webkit-scrollbar-thumb
			{
				background-color: rgba($gray-dark, 0.1);
			}
			li{
				list-style: none;
				padding: 0 15px;
				display: inline-block;
				width:33.33%;
				margin-bottom: 30px;
				&.no_results{
					font-size:$font-size;
					color:$text-color;
					b{
						color:$gray-dark;
					}
				}
				.product-card__price {
					.product-price{
						color:$text-color;
						display:flex;
						align-items: center;
						flex-wrap: wrap;
						&.product-price--regular{
							font-size:14px;
							span{
								font-size:$font-size - 3;
							}
						}
						span{
							font-size:$font-size - 1;
						}
					}
				}
				.predictive-search__item--link{
					&:hover{
						.predictive-search__item-heading{
							color:$theme-color;
						}
					}
				}
			}
			.predictive-search__item-heading{
				font-size: $font-size;
				font-weight: 400;
				font-family:$font-family-base;
				margin-bottom: 7px;
			}
			#predictive-search-option-search-keywords{
				width:100%;
				margin:0;
				button{
					background:transparent;
					border:0;
					text-transform:uppercase;
					font-size: $font-size-base;
					font-weight:600;
					line-height:45px;
					padding:0 30px;
					background:$theme-color;
					color:$white;
					font-family:$font-family-base;
					&:hover{
						background:$gray-dark;
					}
				}
			}
			.predictive-search__list-mess{
				width:100%;
				text-align:center;
				color:$gray-dark;
				font-size:16px;
			}
			.predictive-search__item-vendor{
				color:$text-color;
				margin-bottom:5px;
				text-align:center;
			}
			.predictive-search__item-content{
				margin-top:15px;
			}
			@media (max-width:1199px){
				margin:0 -7.5px;
				li{
					width:33.33%;
					padding:0 7.5px;
				}
			}
			@media (max-width:991px){
				li{
					width:33.33%;
				}
			}
			@media (max-width:767px){
				li{
					width:50%;
				}
			}
		}
	}
	@media (max-width:1199px){
		.contents-search{
			padding:50px 0;
		}
		.content-menu-search{
			padding:30px 15px;
		}
		.close-search{
			top:10px;
			right:10px;
		}
	}
	@media (max-width:767px){
		.predictive-search-content{
			.predictive-search-content-product{
				max-width: 100%;
				flex: 0 0 100%;
			}
			.predictive-search-content-blog{
				margin-top:30px;
				max-width: 100%;
				flex: 0 0 100%;
			}
		}
		.content-menu-search{
			padding:30px 15px;
		}
	}
}
.header-account {
	position: relative;
	@include rtl-margin-right(20px);
	.login-account{
		font-size: 20px;
		position: relative;
		top: 2px;
		transition: all .3s ease;
		color:$header-color;
		&:hover{
			color:$theme-color;
		}
	}
	@media (max-width:1199px){
		@include rtl-margin-right(15px);
	}
}
.header-account__title {
	cursor: pointer;
	display: flex;
	align-items: center;
	padding: 5px 0;
	font-size: 20px;
	color:$menu-color;
	&:hover{
		color:$menu-hover-color;
	}
	&::after {
		display: none;
	}
}
.header-account__content {
	padding: 0;
	border: 0;
	border-radius: 0;
	box-shadow: $shadow;
}
.header-account__list {
	margin: 0;
	padding: 0;
	list-style: none;
	li {
		border-bottom: 1px solid rgba($border-color, .5);
		&:last-child {
			border-bottom: 0;
		}
	}
	a {
		display: block;
		padding: 12px 20px;
		color: $text-color;
		font-size: $font-size - 1;
		transition: color .3s ease, border .3s ease;
		span{
			color:$gray-dark;
			font-weight:700;
		}
		&:hover {
			color: $theme-color;
			text-decoration: none;
			span{
				color: $theme-color;
			}
		}
	}
}

.header-cart {
	position: relative;
	@include rtl-margin-right(10px);
	.icon-cart{
		font-size: 20px;
		position: relative;
		top: 2px;
		transition: all .3s ease;
		&:hover{
			top:-1px;
		}
	}
	&:hover,&:focus {
		.header-cart__content {
			@media screen and (min-width: 768px) {
				opacity: 1;
				visibility: visible;
			}
		}
	}
}
body.template-cart{
	.header-cart {
		.header-cart__content {
			display:none;
		}
	}
}
.header-cart__link {
	position: relative;
	display: block;
	color: $header-color;
	font-size:20px;
	top:2px;
	&:hover {
		text-decoration: none;
	}
}
.header-cart__count {
	position: absolute;
    top: -5px;
    @include rtl-right(-9px);
    width: 18px;
    height: 18px;
    line-height: 18px;
    display: inline-block;
    color: $white;
    text-align: center;
    background: $theme-color;
    border-radius: 50%;
    font-size: 10px;
}
.header-bottom {
	position: relative;
}
.header-bottom__inner {
	display: flex;
	@media screen and (max-width: 1024px) {
		flex-flow: row wrap;
	}
}
.header-bottom__right {
	position: relative;
	width: 100%;
}
// FOOTER
body:not(.template-page,.template-index){
	.bwp-footer{
		margin-top:60px;
	}
}
.bwp-footer{
	color:$footer-color;
	.footer-center__inner >.row >div{
		padding:0 15px;
		@media (max-width:991px){
			margin-bottom:40px;
		}
	}
	.container{
		max-width: 1440px;
		margin: auto;
	}
	span{
		color:$gray-dark;
	}
	p{
		margin-bottom:7px;
	}
	.form-control{
		height:50px;
		line-height:50px;
		padding:0 20px;
		border:1px solid #e8e8e8;
	}
	.newsletter-form__wrap {
		display: flex;
		margin: 25px 0;
		border-color: #e4e4e4;
		.newsletter-form__input {
			color: $white;
			background: transparent;
			@include rtl-margin-right(5px);
			&:focus-within {
				border-color: #e4e4e4;
			}
			&::placeholder {
				color: $text-color;
			}
		}
		.newsletter-form__submit {
			line-height: 50px;
			height: 50px;
			border: 0;
			font-size: 0;
			padding: 0 25px;
			background: $gray-dark;
			color: transparent;
			&:before {
				content: "\e911";
				font-family: icomoon;
				font-size: 24px;
				color: $white;
				z-index: 2;
				cursor: pointer;
				display: inline-block;
			}
			&:hover {
				background: $theme-color;
			}
		}
	}
	.footer-menu{
		padding:0;
		margin: 0;
		list-style:none;
		li{
			margin-bottom:6px;
			&:last-child{
				margin-bottom:0;
			}
		}
		a{
			color:$footer-color;
			font-size: $font-size-base;
			&:hover{
				color:$footer-color-hover;
			}
		}
	}
	.social-icons{
		padding:0;
		list-style:none;
		margin:20px 0 0 0;
		li{
			margin: 0 5px;
			display:inline-block;
			&:first-child{
				@include rtl-margin-left(0);
			}
			&:last-child{
				@include rtl-margin-right(0);
			}
			a{
				display: inline-block;
				border: 1px solid $border-color;
				width: 40px;
				height: 40px;
				text-align:center;
				line-height: 40px;
				border-radius: 50%;
				background: $white;
				color: $gray-dark;
				&:hover{
					background:$theme-color;
					border-color:$theme-color;
					color:$white;
				}
			}
		}
		span{
			display:none;
		}
	}
	.footer-bottom{
		.footer-bottom__inner{
			align-items:center;
			>div{
				padding:0 15px;
			}
		}
		.footer-menu{
			display:flex;
			li{
				margin: 0 10px;
				&:first-child{
					margin-left:0;
				}
				&:last-child{
					margin-right:0;
				}
			}
		}
		.aligin-left{
			text-align:left;
			justify-content: left;
		}
		.aligin-right{
			text-align:right;
			justify-content: right;
		}
		.aligin-center{
			text-align:center;
			justify-content: center;
		}
		@media (max-width:767px){
			.aligin_mobi-left{
				text-align:left;
				justify-content: left;
			}
			.aligin_mobi-right{
				text-align:right;
				justify-content: right;
			}
			.aligin_mobi-center{
				text-align:center;
				justify-content: center;
			}
		}
	}
	@media (max-width:767px){
		.footer-center.accordion{
			.footer-block{
				display:none;
			}
			.content-toggle{
				transition:all 0.3s ease;
				&.active{
					.title-footer{
						&:before{
							content:"\e928";
							@include transform(rotate(180deg));
						}
					}
				}
			}
			.title-footer{
				position:relative;
				transition:all 0.3s ease;
				&:before{
					content:"\e927";
					font-family:bwpfont;
					position:absolute;
					@include rtl-right(0);
					transition:all 0.3s ease;
					font-size: 12px;
				}
			}
			.content-toggle:not(:last-child):not(.active){
				margin-bottom:30px;
				.title-footer{
					margin-bottom:0;
				}
			}
		}
	}
}

// VERTICAL MENU
.catalog-menu {
	position: relative;
	padding: 15px 0;
	@media screen and (max-width: 1024px) {
		width: 100%;
		padding: 5px 0;
	}
	@media screen and (min-width: 1025px) {
		&:hover {
			.catalog-menu__content {
				opacity: 1;
				visibility: visible;
			}
		}
	}
}
.catalog-menu__title {
	cursor: pointer;
	position: relative;
	min-width: 250px;
	margin: 0;
	padding: 5px 35px;
	color: $header-color;
	border-right: 1px solid rgba($header-color, .5);
	font-size: $font-size - 1;
	text-transform: uppercase;
	line-height: 20px;
	white-space: nowrap;
	&::before,
	&::after,
	span::before {
		content: '';
		pointer-events: none;
		position: absolute;
		left: 0;
		display: block;
		width: 16px;
		height: 2px;
		background-color: $header-color;
	}
	&::before {
		top: 8px;
	}
	&::after {
		top: 13px;
	}
	span::before {
		top: 18px;
	}
	@media screen and (max-width: 1024px) {
		padding: 8px 0;
		border-right: none;
		&::before,
		&::after,
			span::before {
			display: none;
		}
	}
}
.catalog-menu__content {
	position: absolute;
	top: 100%;
	left: 0;
	z-index: 20;
	width: 100%;
	max-height: max-content;
	background-color: $white;
	border: 1px solid $border-color;
	@media screen and (min-width: 1025px) {
		display: block !important;
		height: auto !important;
		opacity: 0;
		visibility: hidden;
	}
}

.catalog-menu__nav {
  margin: 0;
  padding: 0;
  list-style: none;
}

.catalog-menu__item {
  position: relative;
  border-bottom: 1px solid rgba($border-color, .6);

  &:last-child {
    border-bottom: 0;
  }

  a {
    display: block;
    padding: 12px 20px;
    border-left: 1px solid $nocolor;
    color: $text-color;
    font-size: $font-size - 1;
    transition: all .3s ease;

    &:hover {
      color: $theme-color;
      border-left-color: $theme-color;
      text-decoration: none;
    }

    &.catalog-menu__collapse-toggle {
      @media screen and (min-width: 1025px) {
        display: none;
      }
    }
  }
  .catalog-menu__collapse-toggle {
    color: $theme-color;
    font-weight: $body-font-weight-bold;
    border-left: none;

    &:hover {
      color: $theme-color;
    }

    &::after {
      content: '\f078';
    }

    &.collapsed {
      color: $text-color;
      font-weight: $body-font-weight;

      &:hover {
        color: $text-color;
      }

      &::after {
        content: '\f054';
      }
    }
  }
}

.catalog-menu--has-dropdown {
  > a {
    &::after {
      content: '\f105';
      pointer-events: none;
      position: absolute;
      top: 12px;
      right: 18px;
      font-family: $font-icon;
    }

    &:not(.catalog-menu__collapse-toggle) {
      @media screen and (max-width: 1024px) {
        display: none;
      }
    }
  }

  @media screen and (min-width: 1025px) {
    .catalog-menu__dropdown {
      display: block;
    }

    &:hover {
      > .catalog-menu__dropdown {
        visibility: visible;
        opacity: 1;
        left: 100%;
      }
    }
  }
}

.catalog-menu__dropdown {
		margin: 0;
		padding: 0;
		list-style: none;
		@media screen and (min-width: 1025px) {
		position: absolute;
		top: 0;
		left: 110%;
		width: 100%;
		visibility: hidden;
		opacity: 0;
		background-color: $white;
		border: 1px solid $border-color;
		transition: all .3s ease;
	}
	@media screen and (max-width: 1024px) {
		@include rtl-padding-left(15px);
		padding-bottom: 10px;
	}
}

.header-promotion {
	position: absolute;
	top: 15px;
	right: 0;
	display: flex;
	align-items: center;
	height: 30px;
	@include rtl-padding-left(30px);
	border-left: 1px solid rgba($header-color, .5);
	font-family: $font-family-second;
	font-size: $font-size - 1;
	font-weight: $heading-font-weight-medium;
	@media screen and (max-width: 1199px) {
		display: none;
	}
}

.header-promotion__img {
	display: block;
	width: 32px;
	height: 32px;
	@include rtl-margin-right(15px);
	border-radius: 50%;
	background-color: $white;
	overflow: hidden;
	img {
		display: block;
		width: 100%;
		height: 100%;
		object-fit: cover;
	}
}

// MAIN MENU
.main-menu {
	ul {
		margin-top: 0;
		@include rtl-padding-left(0px);
		list-style: none;
	}
}

.main-menu__nav {
	display: flex;
	flex-wrap: wrap;
	margin: 0;
}

.main-menu__nav-item {
	padding:0 15px;
	position:relative;
	> a {
		position: relative;
		font-size: 12px;
		background-color: transparent;
		color: $menu-color;
		display: table;
		white-space: nowrap;
    	letter-spacing: 2px;
    	text-transform: uppercase;
		transition: all .2s ease 0s;
		&:before{
			position:absolute;
			top:100%;
			content:"";
			width:100%;
			left:0;
			height:30px;
		}
		span {
			position: relative;
			&:before{
				content:"";
				bottom: 1px;
				width:0;
				position:absolute;
				@include rtl-right(0);
				transition:all 0.3s ease;
				background:$menu-color;
				height:1px;
			}
		}
		&:hover,&:focus {
			color: $menu-hover-color;
		}
	}
	&:hover,&:focus,&.active {
		> a {
			color: $menu-hover-color;
			span {
				&:before{
					width:100%;
					@include rtl-left(0);
					background: $menu-hover-color;
				}
			}
		}
	}
	&:first-child{
		@include rtl-padding-left(0px);
	}
	&:last-child{
		@include rtl-padding-right(0px);
	}
	&.menu-dropdown--mega{
		position:static;
		&.width_custom_pos{
			position:relative;
			.menu-dropdown__content--megamenu{
				top:calc(100% + 10px);
				@include rtl-left(-30px);
			}
			&.width_custom_pos_right{
				position:static;
				.menu-dropdown__content--megamenu{
					@include rtl-left(auto);
					@include rtl-right(0);
					max-width:100%;
					top:100%;
				}
			}
		}
	}
	@media (max-width:1200px){
		padding: 0 10px;
	}
}
.menu-dropdown {
	&:hover,
	&:focus {
		> .menu-dropdown__content {
			opacity: 1;
			visibility: visible;
		}
	}
	> a {
		display: flex;
		&::after {
			content: '\f107';
			pointer-events: none;
			@include rtl-margin-left(3px);
			font-family: $font-icon;
			position: relative;
			top: 1px;
		}
	}
}
.menu-dropdown--basic {
	position: relative;
	.menu-dropdown {
		> a {
			&::after {
				content: '\f105';
				float: right;
				margin: 0;
				font-family: $font-icon;
			}
		}
	}
}
.menu-dropdown__content {
	position: absolute;
	top: 100%;
	left: 0;
	z-index: 9999;
	opacity: 0;
	visibility: hidden;
	transition: all .15s ease;
	&:not(.menu-dropdown__content--megamenu){
		width: 220px;
		padding: 0;
		background-color: $menu-dropdown-bg;
		box-shadow: $menu-dropdown-shadow;
		padding:15px 0;
		margin-top: 15px;
	}
	.menu-dropdown__content {
		top: 0;
		left: 100%;
	}
	a {
		display: block;
		padding: 5px 22px;
		color: $menu-dropdown-color;
		font-size: $font-size;
		text-decoration: none;
		transition: color .35s ease;
		font-family: $font-family-base;
		&:hover,
		&:focus {
			color: $menu-dropdown-hover-color;
		}
	}
}
.menu-dropdown__content--megamenu {
	width: 100%;
	background:$white;
	box-shadow: $menu-dropdown-shadow;
	.menu-row{
		max-width:1440px;
		padding: 40px 15px 45px;
		margin:auto;
		max-height: 80vh;
		overflow: auto;
		&::-webkit-scrollbar-track
		{
			background-color: #ececec;
		}
		&::-webkit-scrollbar
		{
			width: 2px;
			background-color: #ececec;
		}
		&::-webkit-scrollbar-thumb
		{
			background-color:$gray-dark;
		}
		.button_all{
			text-align:center;
			width: 100%;
			flex: 0 0 100%;
			a{
				display:inline-block;
				line-height:45px;
				padding:0 20px;
				background:$theme-color;
				color:$white;
				&:hover{
					background:darken($theme-color,10%);
					-webkit-animation-name: text-transform;
					animation-name: text-transform;
					-webkit-animation-duration: 1.5s;
					animation-duration: 1.5s;
					-webkit-animation-timing-function: ease-in-out;
					animation-timing-function: ease-in-out;
					-webkit-animation-iteration-count: 1;
					animation-iteration-count: 1;
				}
			}
		}
	}
	.menu-dropdown__content {
		top: auto;
		left: auto;
	}
	a{
		padding:5px 0;
		position:relative;
		display:inline-block;
		span{
			position:absolute;
			line-height:18px;
			padding:0 10px;
			border-radius:10px;
			color:$white;
			font-size:10px;
			top:-7px;
			&.hot{
				background:#f11e1e;
			}
			&.new{
				background:#32d4bf;
			}
		}
	}
}
.megamenu-heading {
	color: $gray-dark;
	position: relative;
	font-size:18px;
	margin-bottom: 17px;
	font-weight:400;
	a,span {
		display: block;
		padding:0;
		color: $gray-dark;
		line-height:1;
		padding:0;
	}
}
.megamenu-links {
	margin-bottom: 15px;
}
.megamenu-links__item {
	a {
		padding: 6px 0;
	}
}
.megamenu-product {
	.product-card__image-link{
		padding:0;
	}
	.title{
		color: $gray-dark;
		font-weight: 600;
		position: relative;
		font-size:12px;
		text-transform: uppercase;
		padding-bottom:5px;
		margin-bottom: 17px;
		&:before{
			position: absolute;
			bottom: -1px;
			width: 40px;
			height: 1px;
			background: $gray-dark;
			content: "";
			@include rtl-left(0);
		}
	}
	.product-card__buttons,.product-card__form{
		display:none !important;
	}
	.wpb-variants-swatch{
		display:none !important;
	}
	.product-card__name{
		margin-top:-5px;
		margin-bottom:0;
		a{
			font-size: $font-size-base;
			margin: 0;
			font-weight: $heading-font-weight-medium;
			line-height: 16px;
			color:$text-color;
			&:hover{
				color:$theme-color;
			}
		}
	}
	.product-review{
		line-height:1;
	}
	.slick-list{
		margin:0 -6.5px;
		.slick-carousel__item{
			padding:0 7.5px;
		}
	}
}
.megamenu-banner {
	position:relative;
	.title{
		font-size: 16px;
		margin: 15px 0 30px;
		font-weight: 400;
		text-align:center;
		a{
			color:$gray-dark;
			&:hover{
				color:$theme-color;
			}
		}
	}
	img{
		width:100%;
		transition:all 0.3s ease;
		box-shadow: 0 0 10px 2px #0000000a;
		&:hover{
			@include transform(translateY(-15px));
		}
	}
	a {
		padding: 0;
	}
	a.button{
		display:inline-block;
		line-height:35px;
		padding:0 25px;
		color:$gray-dark;
		font-size:16px;
		background:$white;
		position:relative;
		z-index:1;
		&:before{
			content:"";
			position:absolute;
			top:0;
			right:0;
			width:0;
			height:100%;
			background:$theme-color;
			transition:all 0.3s ease;
			z-index:-1;
		}
		&:hover{
			color:$white;
			&:before{
				width:100%;
				left:0;
			}
		}
	}
	.content{
		position:absolute;
		width:100%;
		padding:0 15px;
		bottom:30px;
		text-align:center;
		left:0;
	}
}
.megamenu-blog{
	.featured-blog__post{
		display:flex;
		margin-bottom:20px;
		padding-bottom:20px;
		border-bottom:1px solid #ededed;
		align-items:center;
		&:last-child{
			margin-bottom:0;
			padding-bottom:0;
			border-bottom:0;
		}
		.article__image{
			margin-bottom:0;
			max-width:80px;
			.article__featured-image-link{
				display: inline-block;
				max-width: 80px;
				flex: 0 0 80px;
				img{
					max-width: 80px;
					aspect-ratio: 1;
					object-fit: cover;
					object-position: center;
				}
			}
		}
		.blog-category a{
			padding:0;
			font-size:10px;
			text-transform:uppercase;
			font-weight:500;
			letter-spacing:2px;
			line-height: 1;
		}
		.article__heading{
			margin:-3px 0;
			a{
				margin-bottom:0;
				color:$gray-dark;
				font-weight:500;
				&:hover{
					color:$theme-color;
				}
			}
		}
		.article__content{
			@include rtl-padding-left(20px);
		}
		.meta{
			color:$text-color;
			a{
				font-size: $font-size-base - 3;
				line-height: 1;
				padding: 0;
			}
		}
	}
}
.main-menu__mobile {
	@include rtl-margin-right(15px);
	@media screen and (min-width: 1025px) {
		display: none;
	}
	@media screen and (max-width: 767px) {
		@include rtl-margin-right(4px);
	}
	.btn-nav {
		display: block;
		width: 32px;
		height: 32px;
		padding: 0;
		color: $header-color;
		font-size: 24px;
		line-height: 32px;
	}
}
.menu-row {
	display: flex;
	flex-flow: row wrap;
	margin-left: - $gutter-width / 2;
	margin-right: - $gutter-width / 2;
}
.menu-row__col {
	-ms-flex-preferred-size: 0;
	flex-basis: 0;
	-ms-flex-positive: 1;
	flex-grow: 1;
	width: 100%;
	max-width: 100%;
	padding-left: $gutter-width / 2;
	padding-right: $gutter-width / 2;
}
// MENU MOBILE
.header-mobile{
	display:none;
	.button-menu{
		flex:1;
		display:flex;
		.menu-mobile__btn{
			border: 0;
			padding: 0;
			background: transparent;
			font-size: 22px;
			line-height: 1;
			position: unset;
			@include rtl-text-align-left();
			width: auto;
			color: $gray-dark;
		}
		.search-toggle{
			@include rtl-margin(0 ,0 ,0 ,15px);
			font-size:20px;
			top:1px;
		}
	}
	.header-right{
		display:flex;
		flex:1;
		justify-content:flex-end;
		.header-cart__link{
			font-size: 20px;
		}
		.wishlist-mobile{
			font-size: 20px;
			cursor: pointer;
			@include rtl-margin-right(5px);
			position: relative;
			top: 2px;
			transition: all .3s ease;
			color:$menu-color;
			@include rtl-padding-right(12px);
			.count{
				position:absolute;
				width:18px;
				height:18px;
				border-radius:50%;
				background:$theme-color;
				color:$white;
				line-height:18px;
				font-size:10px;
				text-align:center;
				top: -7px;
				right: 0;
			}
			&:hover{
				color:$menu-hover-color;
			}
			@media (max-width:767px){
				@include rtl-margin-right(5px);
			}
		}
	}
	.header-logo{
		justify-content:center;
	}
	.header-center__inner{
		padding:15px 0;
	}
	.header-bottom-fixed{
		position: fixed;
		bottom: 0;
		left: 0;
		width: 100%;
		background: #fff;
		display: flex;
		padding: 5px 15px;
		align-items: center;
		box-shadow: 0 1px 10px 5px rgba($gray-dark,0.05);
		z-index: 99;
		line-height: 1;
		height: 50px;
		>*{
			flex:1;
			text-align:center;
			i{
				font-size:20px;
				top:0;
			}
			.search-toggle{
				margin:0;
				top:-3px;
			}
			span{
				display:block;
				font-size:10px;
				text-transform:uppercase;
				letter-spacing:1px;
				font-weight:500;
				text-align:center;
				white-space:nowrap;
				margin-top:5px;
			}
			&.wishlist-mobile{
				position:relative;
				i{
					position:relative;
				}
				.count{
					position:absolute;
					width:20px;
					height:20px;
					background:$gray-dark;
					line-height:20px;
					display:inline-block;
					border-radius:50%;
					color:$white;
					text-align:center;
					top: -5px;
					margin:0;
					@include rtl-right(-15px);
					font-size: 11px;
				}
			}
		}
	}
}
@media (max-width:1050px){
	.header-mobile{
		display:block;
	}
	.header-desktop{
		display:none;
	}
	.header-sticky{
		display:none !important;
	}
}
.menu-mobile--open {
	overflow: hidden;
	.menu-mobile {
		opacity: 1;
		visibility: visible;
	}
	.menu-mobile__inner {
		transform: translate(0, 0);
	}
	.js-menu-mobile{
		position: absolute;
		width: 100%;
		padding:20px 15px;
		@include rtl-text-align-right();
		color:$white;
		z-index:10;
		font-size:0;
		>span{
			cursor: pointer;
			position: relative;
			text-align: center;
			z-index: 1;
			display: inline-block;
			width: 30px;
			height: 30px;
			padding: 6px;
			border-radius: 100%;
			-webkit-border-radius: 100%;
			-moz-border-radius: 100%;
			-ms-border-radius: 100%;
			-o-border-radius: 100%;
			box-shadow: 0 2px 59px #0006;
			&:before,&:after{
				content: "";
				position: absolute;
				height: 1px;
				width: 14px;
				top: 50%;
				left: calc(50% - 7px);
				margin-top: -1px;
				background-color: $gray-dark;
				-webkit-transition: all .3s ease;
				transition: all .3s ease;
			}
			&:before{
				transform-origin: 50% 50%;
				-webkit-transform: rotate(-45deg);
				transform: rotate(-45deg);
			}
			&:after{
				transform-origin: 50% 50%;
				-webkit-transform: rotate(45deg);
				transform: rotate(45deg);
			}
			&:hover{
				&:before,&:after{
					-webkit-transform: rotate(0deg);
					transform: rotate(0deg);
				}
			}
		}
	}
}
.menu-mobile {
	@media screen and (min-width: 1050px) {
		display: none;
	}
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	z-index: 9999;
	width: 100%;
	opacity: 0;
	visibility: hidden;
	transition: opacity .4s ease;
}
.menu-mobile__overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
	background-color: $overlay-black;
}
.menu-mobile__inner {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
	width: 320px;
	height: 100%;
	overflow: hidden;
	background-color: $white;
	transform: translate(-320px, 0);
	transition: all .4s ease;
	@media screen and (max-width: 767px) {
		max-width: 90vw;
	}
}
.menu-mobile__header {
	position: relative;
	z-index: 1;
	display: block;
	height: 50px;
	border-bottom: 1px solid $border-color;
	background-color: $white;
}
.menu-mobile__nav {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	width: 320px;
	overflow-x: hidden;
	overflow-y: auto;
	padding:65px 20px 15px;
	@media screen and (max-width: 767px) {
		max-width: calc(100vw - 30px);
	}
}
.menu-mobile__nav-item {
	border-bottom: 1px solid rgba(229, 229, 229, 0.5);
	&.megamenu{
		margin-bottom:30px;
		padding-bottom:30px;
		border-bottom: 1px solid rgba(229, 229, 229, 0.5) !important;
		&:last-child{
			margin-bottom:0;
			border-bottom:0 !important;
			padding-bottom:0;
		}
	}
	a {
		display: block;
		padding: 12px 0;
		color: $gray-dark;
		line-height: 20px;
		text-transform: uppercase;
		transition: color .3s ease;
		font-size:12px;
		letter-spacing:2px;
		font-weight:500;
		&.mm-nav__prev {
			color: $text-color;
		}
		&:hover {
			color: $theme-color;
			text-decoration: none;
		}
	}
	&.active {
		> .mm-nav__links {
			opacity: 1;
			visibility: visible;
			left: 0;
			&.active--hidden {
				position: absolute;
				> .mm-nav__links-header {
					opacity: 0;
					pointer-events: none;
				}
			}		
		}
	}
	.menu-list{
		padding:0;
		list-style:none;
		margin:0;
		a{
			padding:5px 0;
			position:relative;
			span{
				position:absolute;
				line-height:18px;
				padding:0 10px;
				border-radius:10px;
				color:$white;
				font-size:10px;
				top:-4px;
				&.hot{
					background:#f11e1e;
				}
				&.new{
					background:#32d4bf;
				}
			}
		}
	}
	.footer-menu__item a{
		text-transform:unset;
		font-size: $font-size-base;
		color:$text-color;
		&:hover{
			color:$theme-color;
		}
	}
}
.mm-nav__wrapper {
	display: flex;
	justify-content: space-between;
	> a {
		width: calc(100% - 40px);
	}
}
.mm-nav__btn {
	display: block;
	width: auto;
	height: 44px;
	padding: 0;
	color: rgba($gray-dark,0.3);
	border: none;
	border-radius: 0;
	font-size: 20px;
	line-height: 44px;
	text-align: center;
	background:$white;
	&:hover,
	&:focus {
		outline: 0;
		box-shadow: none;
	}
}
.mm-nav__links {
	position: fixed;
	top: 0;
	left: 100%;
	width: 100%;
	height: 100%;
	overflow: hidden;
	-webkit-overflow-scrolling:touch;
	opacity: 0;
	visibility: hidden;
	transition: all .3s ease-in-out;
	margin-top:65px;
}
.mm-nav__links-header {
	position: relative;
	z-index: 1;
	height: 44px;
	background-color: $white;
	border-bottom: 1px solid #f0f0f0;
	text-align: center;
	transition: all .4s ease-in-out;
	a.mm-nav__prev{
		padding: 12px 20px;
		font-size: 12px;
		letter-spacing:2px;
		color:$gray-dark;
		display:flex;
		justify-content:space-between;
		font-weight:500;
		i{
			font-size:18px;
		}
	}
}
.mm-nav__prev {
	cursor: pointer;
	.fa {
		float: left;
		line-height: 20px;
	}
}
.mm-nav__links-wrapper {
	position: absolute;
	display: flex;
	flex-direction: column;
	top: 0;
	bottom: 0;
	left: 0;
	width: 320px;
	height: calc(100% - 52px);
	background-color: $white;
	padding:80px 20px 60px;
	overflow-x: hidden;
	overflow-y: auto;
	&::-webkit-scrollbar-track
	{
		background-color: #ececec;
	}
	&::-webkit-scrollbar
	{
		width: 2px;
		background-color: #ececec;
	}

	&::-webkit-scrollbar-thumb
	{
		background-color:$gray-dark;
	}
	.menu-mobile__nav-item{
		border:0;
	}
	a{
		text-transform:unset;
		font-size: $font-size-base - 1;
		padding:5px 0;
		color:$text-color;
		letter-spacing:0;
		font-weight:400;
		&:hover{
			color:$theme-color;
		}
	}
	.megamenu-heading{
		font-size:$font-size;
	}
	.megamenu-products{
		margin-bottom:50px;
		&:last-child{
			margin-bottom:0;
		}
	}
	.button_all{
		text-align:center;
		order:1;
		a{
			display:inline-block;
			line-height:45px;
			padding:0 20px;
			background:$theme-color;
			color:$white;
			&:hover{
				background:darken($theme-color,10%);
			}
		}
	}
	@media screen and (max-width: 767px) {
		max-width: calc(100vw - 30px);
	}
}
// COLLECTION PAGE
.products__col {
  padding-top: $gutter-width / 2;
  padding-bottom: $gutter-width / 2;

  @media screen and (max-width: 767px) {
    padding: 8px;
  }
}

// PRODUCT PRICE
.product-group-price {
	display: flex;
	flex-flow: row wrap;
	justify-content:center;
	font-size:16px;
	align-items: center;
	.product-price {
		@include rtl-margin-right(5px);
		&:last-child {
			@include rtl-margin-right(0px);
		}
	}
}
.product-price {
	color: $theme-color;
	&:last-child {
		@include rtl-margin-right(0px);
	}
}
.product-price--regular {
	color: #9b9b9b;
	text-decoration: line-through;
	font-size: $font-size-base;
}
.product-quantity__label {
	display: none;
	margin: 0;
	@include rtl-padding-right(10px);
	font-size: $font-size - 1;
	font-weight: $body-font-weight-bold;
}

// PRODUCT REVIEW
.product-review {
	font-size: 12px;
	line-height: 16px;
	.spr-badge {
		display: flex;
		flex-flow: row wrap;
		align-items: baseline;
	}
	.spr-starrating {
		@include rtl-margin-right(8px);
		font-size: 12px;
	}
	.spr-icon {
		@include rtl-margin-right(3px);
		&:before{
			content: "\e918";
			font-family: bwpfont;
			color: #ffa422;
			font-size:12px;
		}
		&.spr-icon-star-empty{
			opacity:1;
			&:before{
				color: #e1e1e1;
			}
		}
		&.spr-icon-star-half-alt{
			&:before{
				content: '\e803';
				font-family: "font-awesome-stars";
				font-size: 10px;
				position: relative;
				top: -1px;
			}
		}
		&:last-child{
			@include rtl-margin-right(0px);
		}
	}
	.spr-badge-caption{
		color:$text-color;
		@include rtl-margin-left(5px);
		.single{
			display:none;
		}
	}
	&.average-review{
		.spr-badge{
			&:before{
				content: attr(data-rating);
				display:inline-block;
				margin-right:5px;
				color: #ffa422;
				font-size:13px;
				position: relative;
				top: 1px;
				font-weight:700;
				@include rtl-text-align-right();
				width: 19px;
				overflow:hidden;
			}
			&[data-rating="0.0"]{
				display:none;
			}
		}
		.spr-badge-caption{
			display:none;
		}
		.spr-icon {
			&:not(:first-child){
				display:none !important;
			}
			&:before{
				color: #ffa422;
				font-size:13px;
			}
		}
	}
}

.spr-icon {
  &.spr-icon-star-hover {
    opacity: 1;
  }
}

.spr-icon-star,
.spr-icon-star-half-alt {
  color: $star-color;

  &:focus {
    color: $star-color;
  }
}

.spr-icon-star-hover {
  color: $star-color;

  &:hover {
    color: darken($star-color, 10%);
  }
}

// PRODUCT CARD
.product-short-description{
	display:none;
}
.product-card {
	position: relative;
	margin-bottom:25px;
	text-align:center;
	&:hover {
		.product-card__buttons >div{
			opacity:1;
			visibility:visible;
			@include transform(translateY(0));
		}
		.product-card__image{
			.product-card__img-hidden{
				opacity:1;
				visibility:visible;
				transition:all 0.3s ease;
			}
		}
		.product-card__image-wrapper.transform{
			.product-card__image{
				overflow:hidden;
				.product-card__img-hidden{
					@include transform(scale(1));
				}
			}
		}
		.countdown-product{
			opacity:0;
			visibility:hidden;
		}
	}
	.countdown-product{
		&.style_1{
			position: absolute;
			bottom: 10px;
			left: 0;
			width: 100%;
			padding: 0 10px;
			transition: all .3s ease;
			.countdown{
				text-align: center;
				padding:10px 15px;
				background:$white;
				box-shadow:0 0 10px #0000000d;
				max-width: 250px;
				margin: auto;
			}
			.countdown__item{
				display: inline-block;
				color: $gray-dark;
				letter-spacing: 2px;
				span:last-child{
					display:none;
				}
				&:after{
					content: ":";
					display: inline-block;
					margin: 0 4px;
				}
				&:first-child{
					@include rtl-margin-right(20px);
					span{
						display:inline-block;
					}
					&:after{
						display: none;
					}
				}
				&:last-child{
					&:after{
						display: none;
					}
				}
			}
			@media (max-width:480px){
				.countdown{
					padding: 5px;
					font-size: 14px;
				}
				.countdown__item:first-child{
					@include rtl-margin-right(5px);
				}
				.countdown__item:after{
					margin: 0 2px;
				}
				.countdown__item{
					letter-spacing: 0;
				}
			}
		}
		&.style_2{
			position: absolute;
			bottom: 10px;
			left: 0;
			width: 100%;
			padding: 0 15px;
			transition: all .3s ease;
			.countdown{
				padding:0;
				text-align: center;
				box-shadow:0 0 10px #0000000d;
			}
			.countdown__item{
				display: inline-block;
				color: $text-color;
				margin: 0 2px;
				width: 45px;
				height: 45px;
				background: $white;
				span:first-child{
					font-size: 14px;
					display: block;
					line-height: 22px;
					color: $gray-dark;
					font-weight: 500;
					margin-top: 4px;
					position: relative;
				}
				span:last-child{
					font-size: 12px;
					line-height: 10px;
					display: block;
					margin-top: -1px;
					margin-bottom: -1px;
				}
			}
			@media (max-width:480px){
				.countdown{
					background:$white;
					flex-wrap:nowrap;
					padding:0;
					height: 30px;
					.countdown__item{
						width: unset;
						height: auto;
						max-height:30px;
						display:block;
						min-width:unset;
						line-height: 30px;
						span:last-child{
							display:none;
						}
						span:first-child{
							font-size: 14px;
							margin:0;
							display:inline-flex;
							font-weight: 400;
							&:before{
								content:":";
								display:inline-block;
								margin: 0 4px 0 0;
							}
						}
						&:first-child{
							span:first-child{
								&:before{
									display:none;
								}
							}
						}
					}
				}
			}
		}
	}
	.product-card__image-wrapper.transform{
		.product-card__image{
			overflow:hidden;
            .preloading-img-product:last-child{
                position: absolute;
                top: 0;
                width: 100%;
                background: transparent;
            }
			.preloading-img-product:first-child{
				position: relative;
			}
            .product-card__img-hidden{
                @include transform(scale(1));
            }
			.product-card__img-hidden{
				@include transform(scale(1.3));
			}
		}
	}
	.product-card__form.mobile{
		@media (min-width:991px){
			display:none;
		}
		margin-top:15px;
		.form-addtocart{
			display:flex;
		}
		.wpbingo-qty{
			height:40px;
			line-height:40px;
			border:1px solid #e6e6e6;
			@include rtl-border-right(0);
			padding:0 5px;
			button{
				background:transparent;
				border:0;
				color:#d5d5d5;
				padding:0;
				width:25px;
				height:25px;
				border-radius:50%;
				line-height:22px;
				font-size: $font-size-base;
				&:hover{
					background:#ededed;
					color:$gray-dark;
				}
			}
			input{
				background:transparent;
				border:0;
				color:$gray-dark;
				height:38px;
				line-height:38px;
				width: 30px;
				text-align: center;
				padding:0;
			}
		}
		.btn{
			padding:0;
			height:40px;
			line-height:42px;
			color:$gray-dark;
			text-transform:unset;
			border: 1px solid #e6e6e6;
			margin:auto;
			border-radius:0;
			position:relative;
			z-index:1;
			overflow:hidden;
			flex:1;
			font-size: revert !important;
			&:before{
				font-family: 'icomoon';
				content: "\e902";
				display:inline-block;
				font-size:18px;
				line-height: 1 !important;
				position: relative;
				top: 1px !important;
			}
			&:hover{
				color:$white;
				background:$theme-color;
				border-color:$theme-color;
			}
			&.is-adding{
				&:before{
					position: relative;
					display: inline-block;
					content: "";
					border: 2px solid rgba($gray-dark,.25);
					border-top-color: $gray-dark;
					width: 16px;
					height: 16px;
					background: none;
					-webkit-animation: 2s linear 0s normal none infinite running spin-load;
					animation: 2s linear 0s normal none infinite running spin-load;
					text-indent: 0;
					top: 2px;
					border-radius: 50%;
					-webkit-border-radius: 50%;
					-moz-border-radius: 50%;
					-ms-border-radius: 50%;
					-o-border-radius: 50%;
				}
				.spinner-border{
					display:none;
				}
				&:hover{
					&:before{
						border: 2px solid rgba($white,.25);
						border-top-color: $white;
					}
				}
			}
			&.btn-link{
				font-size:12px !important;
				text-transform:uppercase;
				letter-spacing:1px;
				line-height: 38px;
				color:$text-color;
				text-decoration:none;
				&:hover{
					background:$theme-color;
					border-color:$theme-color;
					color:$white;
				}
				&:before{
					display:none;
				}
			}
		}
	}
	&.hover_style_1{
		.product-card__content{
			@include rtl-text-align-left();
			.wpb-variants-swatch .swatch-content{
				justify-content: revert;
				.swatch-items{
					&:last-child{
						label{
							@include rtl-margin-right(0);
						}
					}
				}
			}
			.product-card__name{
				flex:1;
			}
			.content-top{
				display:flex;
				justify-content:space-between;
			}
			.product-review {
				position:relative;
				top:3px;
				.spr-badge{
					justify-content: revert;
					padding:0;
					margin:0 0 10px;
				}
			}
		}
	}
	&.hover_style_2{
		.product-card__price{
			justify-content:center;
		}
		.product-card__buttons{
			flex-wrap:wrap;
			width:40px;
			left:20px;
			padding:0;
			>div{
				margin:10px 0 0;
				@include transform(translateY(20px));
				&:before{
					left:calc(100% + 10px);
					bottom:calc(50% - 11.5px);
					@include transform(unset);
				}
				&:after{
					left:100%;
					bottom:calc(50% - 5px);
					border-color:transparent $gray-dark transparent transparent;
				}
			}
		}
		.content-bottom{
			position:relative;
			overflow:hidden;
		}
		.product-card__price{
			transition:all 0.3s ease;
		}
		.product-card__form:not(.mobile){
			text-align:center;
			position:absolute;
			top:0;
			left:0;
			width:100%;
			opacity:0;
			visibility:hidden;
			transition:all 0.3s ease;
			@include transform(translateY(100%));
			.btn{
				padding:0;
				margin:auto;
				color:$gray-dark;
				font-size:11px;
				text-transform:uppercase;
				font-weight:500;
				letter-spacing:1.6px;
				text-decoration:none;
				position:relative;
				display:inline-block;
				&:before{
					content:"";
					width:0;
					right:0;
					height:1px;
					bottom:0;
					transition:all 0.3s ease;
					background:$theme-color;
					opacity:0;
					position:absolute;
				}
				&:hover{
					color:$theme-color;
					&:before{
						width:100%;
						left:0;
						opacity:1;
					}
				}
			}
		}
		.product-card__content .wpb-variants-swatch .swatch-content{
			margin-bottom:10px;
			&.label .swatch-items{
				label{
					font-size:11px;
					border:1px solid #dedede;
					background:$white;
					min-width:13px;
					line-height:15px;
					padding:4px 5px;
				}
				&.active,&:hover{
					label{
						color:$gray-dark;
						border-color:$gray-dark;
					}
				}
			}
		}
		&:hover{
			.product-card__buttons{
				>div{
					@include transform(translateY(0));
				}
			}
			@media (min-width:992px){
				.product-card__price{
					@include transform(translateY(-100%));
					opacity:0;
					visibility:hidden;
				}
			}
			.product-card__form:not(.mobile){
				@include transform(translateY(0));
				opacity:1;
				visibility:visible;
			}
		}
	}
	&.hover_style_3{
		.product-card__price{
			justify-content:center;
		}
		.product-card__buttons{
			flex-wrap:wrap;
			width:40px;
			right:10px;
			padding:0;
			bottom:auto;
			top:0;
			>div{
				margin:10px 0 0;
				@include transform(translateY(20px));
				&:before{
					left:auto;
					right:calc(100% + 10px);
					bottom:calc(50% - 11.5px);
					@include transform(unset);
				}
				&:after{
					left:auto;
					right:100%;
					bottom:calc(50% - 5px);
					border-color:transparent transparent transparent $gray-dark;
				}
			}
		}
		.product-card__quickview:not(.mobile){
			position:absolute;
			bottom:15px;
			padding:0 10px;
			width:100%;
			left:0;
			transition:all 0.3s ease;
			@include transform(translateY(100%));
			opacity:0;
			visibility:hidden;
			>a{
				background:$white;
				color:$gray-dark;
				text-transform:unset;
				height:40px;
				line-height:40px;
				padding:0 30px;
				font-size: $font-size-base;
				display:inline-block;
				border-radius:3px;
				position:relative;
				overflow:hidden;
				z-index:1;
				transition:all 0.3s ease;
				border:0;
				box-shadow: 0 0px 10px 2px rgba($gray-dark,0.04);
				&:before{
					font-family: 'icomoon';
					content: "\e906";
					display:inline-block;
					@include rtl-margin-right(5px);
					font-size:18px;
					line-height: 1;
					position: relative;
					top: 2px;
				}
				&:after{
					content:"";
					position:absolute;
					top:0;
					height:100%;
					right:0;
					width:0;
					z-index:-1;
					background:$theme-color;
					transition:all 0.3s ease;
				}
				&.load-quickview{
					&:before{
						position: relative;
						display: inline-block;
						content: "";
						border: 2px solid rgba($gray-dark,.25);
						border-top-color: $gray-dark;
						width: 16px;
						height: 16px;
						background: none;
						-webkit-animation: 2s linear 0s normal none infinite running spin-load;
						animation: 2s linear 0s normal none infinite running spin-load;
						text-indent: 0;
						top: 3px;
						border-radius: 50%;
						-webkit-border-radius: 50%;
						-moz-border-radius: 50%;
						-ms-border-radius: 50%;
						-o-border-radius: 50%;
					}
					&:hover{
						&:before{
							border: 2px solid rgba($white,.5);
							border-top-color: $white;
						}
					}
				}
				&:hover{
					color:$white;
					&:after{
						width:100%;
						background:$theme-color;
						left:0;
					}
				}
			}
			@media (max-width:991px){
				display:none;
			}
		}
		&:hover{
			.product-card__buttons{
				>div{
					@include transform(translateY(0));
				}
			}
			.product-card__quickview{
				opacity:1;
				visibility:visible;
				@include transform(translateY(0));
			}
		}
	}
	&.hover_style_4{
		.product-card__content{
			@include rtl-text-align-left();
			margin-top:15px;
			.wpb-variants-swatch .swatch-content{
				justify-content: revert;
				.swatch-items{
					&:last-child{
						label{
							@include rtl-margin-right(0);
						}
					}
				}
			}
			.product-card__name{
				flex:1;
			}
			.content-top{
				display:flex;
				justify-content:space-between;
			}
			.product-review {
				position:relative;
				top:3px;
				.spr-badge{
					justify-content: revert;
					padding:0;
					margin:0 0 10px;
				}
			}
		}
		.product-card__buttons{
			flex-wrap:wrap;
			width:40px;
			right:10px;
			padding:0;
			bottom:auto;
			top:0;
			>div{
				margin:10px 0 0;
				@include transform(translateY(20px));
				&:before{
					left:auto;
					right:calc(100% + 10px);
					bottom:calc(50% - 11.5px);
					@include transform(unset);
				}
				&:after{
					left:auto;
					right:100%;
					bottom:calc(50% - 5px);
					border-color:transparent transparent transparent $gray-dark;
				}
			}
		}
		.product-card__form:not(.mobile){
			position:absolute;
			bottom:15px;
			padding:0 10px;
			width:100%;
			left:0;
			transition:all 0.3s ease;
			@include transform(translateY(100%));
			opacity:0;
			visibility:hidden;
			.btn-link{
				background:$white;
				color:$gray-dark;
				text-transform:unset;
				height:40px;
				line-height:40px;
				padding:0 30px;
				display:inline-block;
				font-size: $font-size-base;
				text-decoration:none;
				border-radius:3px;
				position:relative;
				overflow:hidden;
				z-index:1;
				border:0;
				box-shadow: 0 0px 10px 2px rgba($gray-dark,0.04);
				i{
					@include rtl-margin-right(5px);
					font-size:16px;
					line-height:1;
					position: relative;
					top: 2px;
				}
				&:after{
					content:"";
					position:absolute;
					top:0;
					height:100%;
					right:0;
					width:0;
					z-index:-1;
					background:$theme-color;
					transition:all 0.3s ease;
				}
				&:hover{
					color:$white;
					&:after{
						background:$theme-color;
						width:100%;
						left:0;
					}
				}
			}
			.btn--add-to-cart{
				padding:0 30px;
				height:40px;
				line-height:40px;
				font-size: $font-size-base;
				color:$gray-dark;
				text-transform:unset;
				background:$white;
				display:inline-block;
				border-radius:3px;
				position:relative;
				overflow:hidden;
				z-index:1;
				border:0;
				box-shadow: 0 0px 10px 2px rgba($gray-dark,0.04);
				&:before{
					font-family: icomoon;
					content: "\e902";
					display:inline-block;
					@include rtl-margin-right(5px);
					font-size:18px;
					line-height: 1;
					position: relative;
					top: 1px;
				}
				&:after{
					content:"";
					position:absolute;
					top:0;
					height:100%;
					right:0;
					width:0;
					z-index:-1;
					background:$theme-color;
					transition:all 0.3s ease;
				}
				&:hover{
					color:$white;
					&:after{
						background:$theme-color;
						width:100%;
						left:0;
					}
				}
				&.is-adding{
					&:before{
						position: relative;
						display: inline-block;
						content: "";
						border: 2px solid rgba($gray-dark,.25);
						border-top-color: $gray-dark;
						width: 16px;
						height: 16px;
						background: none;
						-webkit-animation: 2s linear 0s normal none infinite running spin-load;
						animation: 2s linear 0s normal none infinite running spin-load;
						text-indent: 0;
						top: 2px;
						border-radius: 50%;
						-webkit-border-radius: 50%;
						-moz-border-radius: 50%;
						-ms-border-radius: 50%;
						-o-border-radius: 50%;
					}
					.spinner-border{
						display:none;
					}
				}
			}
		}
		&:hover{
			.product-card__buttons{
				>div{
					@include transform(translateY(0));
				}
			}
			.product-card__form{
				opacity:1;
				visibility:visible;
				@include transform(translateY(0));
			}
		}
	}
	&.hover_style_5{
		.product-card__image-wrapper{
			display:block;
		}
		.product-card__content{
			margin-top:0;
			padding:20px 15px 0;
			margin-bottom:-40px;
			transition:all 0.3s ease;
			background:transparent;
			z-index:3;
			>.swatch-content{
				margin:10px 0 15px;
				opacity:0;
				visibility:hidden;
				transition:all 0.3s ease;
			}
			.product-card__price{
				justify-content:center;
			}
		}
		.product-card__buttons{
			position:unset;
			padding:0;
			margin-top:10px;
			opacity:0;
			visibility:hidden;
			transition:all 0.3s ease;
			>div{
				opacity:1;
				visibility:visible;
				@include transform(unset);
				.btn,.quickview-button,button{
					border: 1px solid #e8e8e8;
					line-height:38px;
					box-shadow: unset;
					&:hover{
						border-color:$theme-color;
					}
				}
			}
		}
		.content-top{
			position:absolute;
			top:0;
			display:flex;
			padding:0 4px;
			width:100%;
			left:0;
			@include transform(translateY(calc(-100% - 5px)));
			.swatch-content{
				flex:0;
				height:30px;
				line-height:30px;
				margin:0 1px;
				background:$white;
				justify-content: revert;
				width: 0;
				padding: 0;
				transition:all 0.3s ease;
				overflow:hidden;
				flex-wrap:nowrap;
			}
			.product-review .spr-badge{
				height:30px;
				line-height:30px;
				padding:0 3px 0 10px;
				margin:0 1px;
				background:$white;
			}
		}
		&:hover{
			.product-card__content{
				@include transform(translatey(-50px));
				background:$white;
				>.swatch-content{
					opacity:1;
					visibility:visible;
				}
			}
			.product-card__buttons{
				opacity:1;
				visibility:visible;
			}
			.content-top{
				.swatch-content{
					flex:1;
					padding:0 10px;
					opacity:1;
					visibility:visible;
					width:auto;
				}
			}
		}
		@media (max-width:991px){
			.product-card__content{
				padding:20px 0 0;
				transform:unset !important;
				margin:0;
				.swatch-content{
					margin: 5px 0px 0;
				}
				>.swatch-content{
					opacity:1;
					visibility:visible;
				}
				.content-top{
					position:unset;
					transform:unset;
					.swatch-content{
						flex: 0 0 100%;
						padding: 0;
						opacity: 1;
						visibility: visible;
						width: 100%;
						overflow:unset;
						flex-wrap:wrap;
						justify-content:center;
						height: auto;
					}
					.spr-badge{
						position: absolute;
						top: 0;
						left: 3px;
						transform: translateY(calc(-100% - 5px));
					}
				}
			}
		}
		@media (max-width:767px){
			.countdown-product{
				display:none;
			}
		}
	}
	&.hover_style_6{
		transition:all 0.3s ease;
		.product-card__image-wrapper{
			display:block;
		}
		.product-card__content{
			margin-top:0;
			padding:20px 15px;
			transition:all 0.3s ease;
			.product-card__price{
				justify-content:center;
			}
		}
		.btn-gruop{
			display: none;
			>div{
				margin-top:5px;
				&:before{
					content: attr(data-title);
					position: absolute;
					padding:0 10px;
					background: $gray-dark;
					color: $white;
					line-height: 23px;
					white-space: nowrap;
					font-size: 12px;
					z-index: 10;
					opacity: 0;
					visibility: hidden;
					border-radius: 3px;
					pointer-events: none;
					left:auto;
					right:calc(100% + 10px);
					bottom:calc(50% - 11.5px);
					@include transform(unset);
				}
				&:after{
					content: "";
					position: absolute;
					border-width: 5px;
					border-style: solid;
					pointer-events: none;
					opacity: 0;
					visibility: hidden;
					left:auto;
					right:100%;
					bottom:calc(50% - 5px);
					border-color:transparent transparent transparent $gray-dark;
				}
				&:hover{
					&:after,&:before{
						opacity: 1;
						visibility: visible;
					}
				}
			}
		}
		.button-compare{
			-webkit-transition: all 0.3s ease;
			transition: all 0.3s ease;
			-webkit-transform: scale(0);
			-ms-transform: scale(0);
			transform: scale(0);
			button{
				color: $gray-dark;
				display: inline-block;
				text-align: center;
				background: $white;
				width: 40px;
				height: 40px;
				line-height: 40px;
				border: 0;
				font-size: 0;
				white-space: nowrap;
				padding:0;
				border-radius:50%;
				box-shadow: 0 0px 10px 2px rgba($gray-dark,0.04);
				&:before{
					content: "\e913";
					font-family: 'icomoon';
					font-size: 22px;
					display:inline-block;
				}
				span {
					display: none;
				}
				&.active{
					color:$white;
					background:$theme-color;
				}
				&.load-compare{
					&:before{
						position: relative;
						display: inline-block;
						content: "";
						border: 2px solid rgba($gray-dark,.5);
						border-top-color: $gray-dark;
						width: 16px;
						height: 16px;
						background: none;
						animation: 2s linear 0s normal none infinite running spin-load;
						text-indent: 0;
						top: 8px;
						border-radius: 50%;
					}
					&:hover{
						&:before{
							border: 2px solid rgba($white,.5);
							border-top-color: $white;
						}
					}
					&.active{
						&:before{
							border: 2px solid rgba($white,.5);
							border-top-color: $white;
						}
					}
				}
				&:hover,
				&:focus {
					outline: 0;
					box-shadow: none;
				}
				&:hover {
					color: $white;
					background-color: $theme-color;
					border-color:$theme-color;
					-webkit-animation-name: beat;
					animation-name: beat;
					-webkit-animation-duration: 0.9s;
					animation-duration: 0.9s;
					-webkit-animation-timing-function: ease-in-out;
					animation-timing-function: ease-in-out;
					-webkit-animation-iteration-count: infinite;
					animation-iteration-count: infinite;
				}
			}
			@media (max-width:991px){
				display:none !important;
			}
		}
		.button-wishlist:not(.mobile){
			-webkit-transition: all 0.3s ease;
			transition: all 0.3s ease;
			-webkit-transform: scale(0);
			-ms-transform: scale(0);
			transform: scale(0);
			button{
				color: $gray-dark;
				display: inline-block;
				text-align: center;
				background: $white;
				width: 40px;
				height: 40px;
				line-height: 40px;
				border: 0;
				font-size: 0;
				white-space: nowrap;
				border-radius:50%;
				box-shadow: 0 0px 10px 2px rgba($gray-dark,0.04);
				padding:0;
				&:before{
					content: "\e901";
					font-family: 'icomoon';
					font-size: 18px;
					display:inline-block;
				}
				span {
					display: none;
				}
				&.active{
					color:$theme-color;
					&:before{
						content:"\f004";
						font-family: FontAwesome;
						display:inline-block;
						font-size:15px;
					}
				}
				&.load-wishlist{
					&:before{
						position: relative;
						display: inline-block;
						content: "";
						border: 2px solid rgba($gray-dark,.5);
						border-top-color: $gray-dark;
						width: 16px;
						height: 16px;
						background: none;
						animation: 2s linear 0s normal none infinite running spin-load;
						text-indent: 0;
						top: 8px;
						border-radius: 50%;
					}
					&:hover{
						&:before{
							border: 2px solid rgba($white,.5);
							border-top-color: $white;
						}
					}
				}
				&:hover,
				&:focus {
					outline: 0;
					box-shadow: none;
				}
				&:hover {
					color: $white;
					background-color: $theme-color;
					border-color:$theme-color;
					-webkit-animation-name: beat;
					animation-name: beat;
					-webkit-animation-duration: 0.9s;
					animation-duration: 0.9s;
					-webkit-animation-timing-function: ease-in-out;
					animation-timing-function: ease-in-out;
					-webkit-animation-iteration-count: infinite;
					animation-iteration-count: infinite;
				}
			}
			@media (max-width:767px){
				display:none;
			}
		}
		.product-card__buttons{
			bottom:10px;
			padding:0 5px;
			>div{
				flex:1;
				margin:0 5px;
				&:after{
					display:none;
				}
				.btn{
					width:100%;
					font-size: $font-size-base;
					text-transform:unset;
					border-radius:3px;
					position:relative;
					overflow:hidden;
					z-index:1;
					background:$white;
					border:0;
					&:before,i{
						line-height:1;
						position:relative;
						top:2px;
						@include rtl-margin-right(5px);
					}
					&:after{
						content:"";
						position:absolute;
						top:0;
						height:100%;
						right:0;
						width:0;
						z-index:-1;
						background:$theme-color;
						transition:all 0.3s ease;
					}
					span{
						display:inline-block;
					}
					&:hover{
						-webkit-animation-name: none;
						animation-name: none;
						color:$white;
						&:after{
							background:$theme-color;
							width:100%;
							left:0;
						}
					}
					.spinner-border{
						display:none;
					}
					&.is-adding{
						&:before{
							width: 16px;
							height: 16px;
							top:4px;
						}
					}
					&.load-quickview:before{
						width:16px;
						height:16px;
						top:2px;
					}
				}
				@media (max-width:991px){
					flex:0 0 100%;
				}
				@media (max-width:480px){
					.btn{
						font-size:0;
						&:before,i{
							line-height:40px;
						}
					}
				}
			}
		}
		.product-card__content .wpb-variants-swatch .swatch-content{
			margin-bottom:13px;
			&.label .swatch-items{
				label{
					font-size:11px;
					border:1px solid #dedede;
					background:$white;
					min-width:13px;
					line-height:15px;
					padding:4px 5px;
				}
				&.active,&:hover{
					label{
						color:$gray-dark;
						border-color:$gray-dark;
					}
				}
			}
		}
		&:hover{
			-webkit-box-shadow: 0px 9px 15px 0px rgba($gray-dark,0.05);
			box-shadow: 0px 9px 15px 0px rgba($gray-dark,0.05);
			.product-card__buttons{
				>div{
					@include transform(translateY(0));
				}
			}
			.button-wishlist:not(.mobile),.button-compare{
				@include transform(scale(1));
			}
			.product-card__content{
				background:$white;
			}
		}
	}
	&.hover_style_7{
		.wpb-variants-swatch{
			position:absolute;
			left:0;
			bottom:0;
			background:$white;
			margin:0;
			padding:15px 0 3px;
			transform-origin: bottom;
			@include transform(rotateX(90deg));
			transition:all 0.3s ease;
			.swatch-content{
				justify-content: revert;
				.swatch-items{
					&:last-child{
						label{
							@include rtl-margin-right(0);
						}
					}
				}
			}
		}
		.product-card__content{
			@include rtl-text-align-left();
			margin-top:15px;
			.product-card__name{
				flex:1;
			}
			.content-top{
				display:flex;
				justify-content:space-between;
			}
			.product-review {
				position:relative;
				top:3px;
				.spr-badge{
					justify-content: revert;
					padding:0;
					margin:0 0 10px;
				}
			}
		}
		.product-card__buttons{
			flex-wrap:wrap;
			width:100%;
			right:0;
			padding:0;
			bottom: calc(50% - 20px);
			>div{
				margin:0 5px;
				@include transform(translateY(50px));
				.btn,button{
					border-radius:50%;
				}
			}
		}
		.product-card__image-wrapper.slider .slick-arrow{
			z-index:10;
		}
		.product-card__form:not(.mobile){
			text-align:center;
			margin-top:10px;
			.btn-link{				
				color:$gray-dark;
				text-transform:unset;
				height:45px;
				line-height:43px;
				padding:0 25px;
				font-size: $font-size-base;
				text-decoration:none;
				border: 1px solid #dfdfdf;
				display:inline-block;
				width:100%;
				position:relative;
				overflow:hidden;
				z-index:1;
				i{
					@include rtl-margin-right(5px);
					font-size:16px;
					line-height:1;
					position: relative;
					top: 2px;
				}
				&:after{
					content:"";
					position:absolute;
					top:0;
					height:100%;
					right:0;
					width:0;
					z-index:-1;
					background:$theme-color;
					transition:all 0.3s ease;
				}
				&:hover{
					color:$white;
					&:after{
						background:$theme-color;
						width:100%;
						left:0;
					}
				}
			}
			.btn--add-to-cart{
				padding:0 25px;
				height:45px;
				line-height:43px;
				color:$gray-dark;
				font-size: $font-size-base;
				text-transform:unset;
				border: 1px solid #dfdfdf;
				margin:auto;
				width:100%;
				position:relative;
				overflow:hidden;
				z-index:1;
				&:before{
					font-family: 'icomoon';
					content: "\e902";
					display:inline-block;
					@include rtl-margin-right(5px);
					font-size:18px;
					line-height: 1;
					position: relative;
					top: 1px;
				}
				&:after{
					content:"";
					position:absolute;
					top:0;
					height:100%;
					right:0;
					width:0;
					z-index:-1;
					background:$theme-color;
					transition:all 0.3s ease;
				}
				&:hover{
					color:$white;
					&:after{
						background:$theme-color;
						width:100%;
						left:0;
					}
				}
				&.is-adding{
					&:before{
						position: relative;
						display: inline-block;
						content: "";
						border: 2px solid rgba($gray-dark,.25);
						border-top-color: $gray-dark;
						width: 16px;
						height: 16px;
						background: none;
						-webkit-animation: 2s linear 0s normal none infinite running spin-load;
						animation: 2s linear 0s normal none infinite running spin-load;
						text-indent: 0;
						top: 2px;
						border-radius: 50%;
						-webkit-border-radius: 50%;
						-moz-border-radius: 50%;
						-ms-border-radius: 50%;
						-o-border-radius: 50%;
					}
					.spinner-border{
						display:none;
					}
				}
			}
		}
		&:hover{
			.product-card__buttons{
				>div{
					@include transform(translateY(0));
				}
			}
			.wpb-variants-swatch{
				@include transform(rotateX(0));
			}
		}
		@media (max-width:767px){
			.wpb-variants-swatch{
				position:unset;
				transform:unset;
				margin-bottom: -8px;
			}
			.countdown-product{
				display:none;
			}
		}
	}
	&.hover_style_8{
		position:relative;
		@media (min-width:767px){
			.product-card__image-link{
				&:before{
					content:"";
					position:absolute;
					width:100%;
					height:100%;
					left:0;
					top:0;
					background:rgba($gray-dark,0.5);
					@include transform(scale(0.8));
					transition:all 0.3s ease;
					opacity:0;
					visibility:hidden;
					z-index:9;
				}
				.product-review .spr-badge-caption{
					color:$white;
				}
			}
		}
		.product-review {
			.spr-badge-caption {
				color: $white;
			}
		}
		.product-card__price{
			justify-content:center;
		}
		.product-card__buttons{
			flex-wrap:wrap;
			width:20px;
			right:10px;
			padding:0;
			bottom:auto;
			top:10px;
			z-index:11;
			>div{
				margin:5px 0 0;
				@include transform(translateX(50px));
				height:20px;
				line-height:20px;
				&:before{
					left:auto;
					right:calc(100% + 10px);
					bottom:calc(50% - 11.5px);
					@include transform(unset);
				}
				&:after{
					left:auto;
					right:100%;
					bottom:calc(50% - 5px);
					border-color:transparent transparent transparent $gray-dark;
				}
				.btn,button{
					color:$white;
					background:transparent;
					width:auto;
					line-height:1;
					height:20px;
					&:before{
						line-height:1;
					}
					&.load-wishlist:before{
						border-color:rgba($white,0.5);
						border-top-color:$white;
						top:0;
					}
					&.load-compare{
						&:before{
							border-color:rgba($white,0.5);
							border-top-color:$white;
							top:2px;
						}
					}
				}
			}
		}
		.wpb-variants-swatch{
			margin-bottom:15px;
			.swatch-items label{
				border:0;
				background:transparent;
			}
			.swatch-content.label {
				.title{
					color:$white;
				}
				.swatch-items{
					label{
						color:$white;
					}
					&.active,&:hover{
						label{
							color:$white;
							border-color:$white;
						}
					}
				}
			}
		}
		.product-card__form:not(.mobile){
			text-align:center;
			margin-top:10px;
			.btn-link{				
				color:$white;
				text-transform:unset;
				height:40px;
				line-height:38px;
				padding:0 25px;
				font-size:$font-size-base;
				text-decoration:none;
				border: 1px solid $white;
				display:inline-block;
				border-radius:30px;
				position:relative;
				z-index:1;
				overflow:hidden;
				i{
					@include rtl-margin-right(5px);
					font-size:16px;
					line-height:1;
					position: relative;
					top: 2px;
				}
				&:after{
					content:"";
					position:absolute;
					top:0;
					height:100%;
					right:0;
					width:0;
					z-index:-1;
					background:$white;
					transition:all 0.3s ease;
				}
				&:hover{
					color:$gray-dark;
					&:after{
						width:100%;
						left:0;
					}
				}
			}
			.btn--add-to-cart{
				padding:0 25px;
				height:40px;
				line-height:38px;
				color:$white;
				font-size:$font-size-base - 1;
				text-transform:unset;
				border: 1px solid $white;
				margin:auto;
				border-radius:30px;
				position:relative;
				z-index:1;
				overflow:hidden;
				&:before{
					font-family: 'icomoon';
					content: "\e902";
					display:inline-block;
					@include rtl-margin-right(5px);
					font-size:18px;
					line-height: 1;
					position: relative;
					top: 1px;
				}
				&:after{
					content:"";
					position:absolute;
					top:0;
					height:100%;
					right:0;
					width:0;
					z-index:-1;
					background:$white;
					transition:all 0.3s ease;
				}
				&:hover{
					color:$gray-dark;
					&:after{
						width:100%;
						left:0;
					}
				}
				&.is-adding{
					&:before{
						position: relative;
						display: inline-block;
						content: "";
						border: 2px solid rgba($gray-dark,.25);
						border-top-color: $gray-dark;
						width: 16px;
						height: 16px;
						background: none;
						-webkit-animation: 2s linear 0s normal none infinite running spin-load;
						animation: 2s linear 0s normal none infinite running spin-load;
						text-indent: 0;
						top: 2px;
						border-radius: 50%;
						-webkit-border-radius: 50%;
						-moz-border-radius: 50%;
						-ms-border-radius: 50%;
						-o-border-radius: 50%;
					}
					.spinner-border{
						display:none;
					}
				}
			}
		}
		.product-card__form.mobile {
			.wpbingo-qty {
				input {
					color: $white;
				}
			}
			.btn {
				color: $white;
			}
		}
		@media (min-width:767px){
			.product-card__content{
				position:absolute;
				padding:0 15px;
				width:100%;
				left:0;
				top:0;
				height:100%;
				display:flex;
				justify-content:center;
				align-items:center;
				@include transform(scale(0.8));
				transition:all 0.3s ease;
				opacity:0;
				visibility:hidden;
				z-index:10;
				.product-card__name a{
					color:$white;
					&:hover{
						color:$theme-color;
					}
				}
				.product-card__price .product-price{
					color:$white;
				}
				.wpb-variants-swatch{
					background:transparent;
					.swatch-items label:before{
						border-color:$white;
					}
				}
			}
		}
		@media (max-width:767px){
			.product-card__content{
				padding:0;
			}
			.wpb-variants-swatch .swatch-content{
				.swatch-items label:before{
					border-color:#868686;
				}
				&.label{
					.title{
						color:$gray-dark;
					}
					.swatch-items{
						label{
							color:$text-color;
						}
						&.active,&:hover{
							label{
								color:$gray-dark;
								border-color:$gray-dark;
							}
						}
					}
				}
			}
		}
		&:hover{
			.product-card__image-link{
				&:before{
					@include transform(scale(1));
					opacity:1;
					visibility:visible;
				}
			}
			.product-card__buttons{
				>div{
					@include transform(translateX(0));
				}
			}
			.product-card__content{
				@include transform(scale(1));
				opacity:1;
				visibility:visible;
			}
			.product-card__image-wrapper.slider{
				.slick-arrow{
					opacity:1;
					visibility:visible;
				}
			}
		}
	}
	&.hover_style_9{
		.product-card__price{
			justify-content:center;
		}
		.product-card__buttons{
			flex-wrap:wrap;
			width:100%;
			right:0;
			padding:0;
			bottom:60px;
			>div{
				margin:0 5px;
				@include transform(translateY(50px));
				.btn,button{
					border-radius:50%;
				}
			}
		}
		.product-card_popup{
			position:absolute;
			width:100%;
			bottom:0;
			left:0;
			z-index:9;
			transition:all 0.3s ease;
			@include transform(translateY(100%));
			opacity:0;
			visibility:hidden;
			.product-card__content{
				background:$white;
				height:100%;
				margin:0;
				display:flex;
				align-items:center;
				justify-content:center;
				padding:10px 15px 0;
			}
			.product-card__content .wpb-variants-swatch{
				>label{
					margin-bottom:7px;
					color:$gray-dark;
				}
				.swatch-content{
					margin-bottom:15px;
					&.label .swatch-items{
						label{
							font-size:11px;
							border:1px solid #dedede;
							background:$white;
							min-width:13px;
							line-height:15px;
							padding:4px 5px;
						}
						&.active,&:hover{
							label{
								color:$gray-dark;
								border-color:$gray-dark;
							}
						}
					}
				}
			}
			.btn--add-to-cart{
				font-size: $font-size-base;
				line-height:38px;
				padding:0 20px;
				color:$gray-dark;
				text-transform:unset;
				border:1px solid #dfdfdf;
				overflow:hidden;
				position:relative;
				z-index:1;
				flex: 1;
				&:before{
					font-family: 'icomoon';
					content: "\e902";
					display:inline-block;
					@include rtl-margin-right(5px);
					font-size:18px;
					line-height: 1;
					position: relative;
					top: 1px;
				}
				&:after{
					content:"";
					position:absolute;
					top:0;
					height:100%;
					right:0;
					width:0;
					z-index:-1;
					background:$theme-color;
					transition:all 0.3s ease;
				}
				&.is-adding{
					&:before{
						position: relative;
						display: inline-block;
						content: "";
						border: 2px solid rgba($gray-dark,.25);
						border-top-color: $gray-dark;
						width: 16px;
						height: 16px;
						background: none;
						-webkit-animation: 2s linear 0s normal none infinite running spin-load;
						animation: 2s linear 0s normal none infinite running spin-load;
						text-indent: 0;
						top: 2px;
						border-radius: 50%;
						-webkit-border-radius: 50%;
						-moz-border-radius: 50%;
						-ms-border-radius: 50%;
						-o-border-radius: 50%;
					}
					.spinner-border{
						display:none;
					}
					&:hover{
						&:before{
							border: 2px solid rgba($white,.25);
							border-top-color: $white;
						}
					}
				}
				&:hover{
					color:$white;
					border-color:$theme-color;
					&:after{
						width:100%;
						left:0;
					}
				}
			}
			.form-addtocart{
				display:flex;
			}
			.wpbingo-qty{
				height:40px;
				line-height:40px;
				border:1px solid #dfdfdf;
				@include rtl-border-right(0);
				padding:0 5px;
				button{
					background:transparent;
					border:0;
					color:$gray-dark;
					padding:0;
					width:25px;
					height:25px;
					border-radius:50%;
					line-height:25px;
					font-size: $font-size-base;
					&:hover{
						background:#ededed;
						color:$gray-dark;
					}
				}
				input{
					background:transparent;
					border:0;
					color:$gray-dark;
					height:38px;
					line-height:38px;
					width: 30px;
					text-align: center;
					padding:0;
				}
			}
			&.active{
				@include transform(translateY(0));
				opacity:1;
				visibility:visible;
			}
		}
		.product-card__form:not(.popup,.mobile){
			text-align:center;
			position:absolute;
			bottom:0;
			width:100%;
			transition:all 0.3s ease;
			@include transform(translateY(100%));
			opacity:0;
			visibility:hidden;
			.btn-link,.btn-select{
				color:$gray-dark;
				text-transform:unset;
				height:40px;
				line-height:40px;
				padding:0 25px;
				font-size: $font-size-base;
				text-decoration:none;
				display:inline-block;
				width:100%;
				font-size: $font-size-base;
				background:rgba($gray-dark,0.5);
				color:$white;
				position:relative;
				overflow:hidden;
				z-index:1;
				border:0;
				i{
					@include rtl-margin-right(5px);
					font-size:16px;
					line-height:1;
					position: relative;
					top: 2px;
				}
				&:after{
					content:"";
					position:absolute;
					top:0;
					height:100%;
					right:0;
					width:0;
					z-index:-1;
					background:$theme-color;
					transition:all 0.3s ease;
				}
				&:hover{
					color:$white;
					&:after{
						width:100%;
						left:0;
					}
				}
			}
			.btn-select.hide{
				display:none;
			}
			.form-addtocart{
				display:flex;
				width:100%;
				background:rgba($gray-dark,0.5);
				height:40px;
				line-height:40px;
				.wpbingo-qty{
					padding:0 20px;
					@include rtl-border-right(1px solid rgba($white,0.5));
					button{
						background:transparent;
						border:0;
						color:$white;
						padding:0;
						width:20px;
						height:20px;
						border-radius:50%;
						line-height:22px;
						font-size:12px;
						&:hover{
							background:$white;
							color:$gray-dark;
						}
					}
					input{
						background:transparent;
						border:0;
						color:$white;
						height:40px;
						line-height:40px;
						width: 30px;
						text-align: center;
						padding:0;
					}
				}
			}
			.btn--add-to-cart{
				color:$white;
				text-transform:unset;
				margin:auto;
				flex:1;
				font-size: $font-size-base;
				position:relative;
				overflow:hidden;
				z-index:1;
				position:relative;
				overflow:hidden;
				z-index:1;
				border:0;
				&:before{
					font-family: 'icomoon';
					content: "\e902";
					display:inline-block;
					@include rtl-margin-right(5px);
					font-size:18px;
					line-height: 1;
					position: relative;
					top: 1px;
				}
				&:after{
					content:"";
					position:absolute;
					top:0;
					height:100%;
					right:0;
					width:0;
					z-index:-1;
					background:$theme-color;
					transition:all 0.3s ease;
				}
				&:hover{
					color:$white;
					&:after{
						width:100%;
						left:0;
					}
				}
				&.is-adding{
					&:before{
						position: relative;
						display: inline-block;
						content: "";
						border: 2px solid rgba($white,.25);
						border-top-color: $white;
						width: 16px;
						height: 16px;
						background: none;
						-webkit-animation: 2s linear 0s normal none infinite running spin-load;
						animation: 2s linear 0s normal none infinite running spin-load;
						text-indent: 0;
						top: 2px;
						border-radius: 50%;
						-webkit-border-radius: 50%;
						-moz-border-radius: 50%;
						-ms-border-radius: 50%;
						-o-border-radius: 50%;
					}
					.spinner-border{
						display:none;
					}
				}
			}
		}
		&:hover{
			.product-card__buttons{
				>div{
					@include transform(translateY(0));
				}
			}
			.product-card__form:not(.popup,.mobile){
				@include transform(translateY(0));
				opacity:1;
				visibility:visible;
			}
		}
		.wpb-variants-swatch.mobile{
			display:none;
		}
		@media (max-width:1199px){
			.product-card_popup .btn--add-to-cart{
				font-size:0;
				&:before{
					line-height: 1;
					top: 7px;
					margin: 0;
				}
			}
			.product-card__form:not(.popup,.mobile) .btn--add-to-cart{
				font-size:0;
				&:before{
					line-height: 1;
					top: 0;
					margin: 0;
				}
			}
		}
		@media (max-width:991px){
			.product-card__form:not(.mobile){
				display:none;
			}
			.wpb-variants-swatch.mobile{
				display:block;
			}
		}
	}
	.content-button-mobile{
		position:absolute;
		top:10px;
		right:10px;
		.product-card__quickview.mobile{
			.js-btn-quickview{
				border:0;
				color: $gray-dark;
				display: inline-block;
				text-align: center;
				background: $white;
				width: 25px;
				height: 25px;
				line-height: 26px;
				font-size: 0;
				white-space: nowrap;
				padding:0;
				box-shadow:0 0 10px #0000000d;
				&:before{
					font-size: 14px;
					font-family: 'bwpfont';
					content: "\e91a";
					line-height: 25px;
				}
				&.load-quickview{
					&:before{
						position: relative;
						display: inline-block;
						content: "";
						border: 2px solid rgba($gray-dark,.25);
						border-top-color: $gray-dark;
						width: 14px;
						height: 14px;
						background: none;
						-webkit-animation: 2s linear 0s normal none infinite running spin-load;
						animation: 2s linear 0s normal none infinite running spin-load;
						text-indent: 0;
						top: 5px;
						border-radius: 50%;
						-webkit-border-radius: 50%;
						-moz-border-radius: 50%;
						-ms-border-radius: 50%;
						-o-border-radius: 50%;
					}
					&:hover{
						&:before{
							border: 2px solid rgba($white,.5);
							border-top-color: $white;
						}
					}
				}
				&:hover,
				&:focus {
					outline: 0;
					box-shadow: none;
				}
				&:hover {
					color: $white;
					background-color: $theme-color;
				}
			}
		}
		.button-wishlist.mobile{
			button{
				border:0;
				color: $gray-dark;
				display: inline-block;
				text-align: center;
				background: $white;
				width: 25px;
				height: 25px;
				line-height: 26px;
				font-size: 0;
				white-space: nowrap;
				padding:0;
				box-shadow:0 0 10px #0000000d;
				&:before{
					content: "\e91e";
					font-family: 'bwpfont';
					font-size: 14px;
					display:inline-block;
				}
				span {
					display: none;
				}
				&.active{
					color:$theme-color;
					&:before{
						content:"\f004";
						font-family: FontAwesome;
						display:inline-block;
						font-size:11px;
					}
				}
				&.load-wishlist{
					&:before{
						position: relative;
						display: inline-block;
						content: "";
						border: 2px solid rgba($gray-dark,.5);
						border-top-color: $gray-dark;
						width: 13px;
						height: 13px;
						background: none;
						animation: 2s linear 0s normal none infinite running spin-load;
						text-indent: 0;
						top: 6px;
						border-radius: 50%;
					}
					&:hover{
						&:before{
							border: 2px solid rgba($white,.5);
							border-top-color: $white;
						}
					}
				}
				&:hover,
				&:focus {
					outline: 0;
					box-shadow: none;
				}
				&:hover {
					color: $white;
					background-color: $theme-color;
					border-color:$theme-color;
				}
			}
		}
	}
	@media (max-width:991px){
		.product-card__buttons{
			display:none;
		}
		.product-card__form:not(.mobile){
			display:none;
		}
	}
	@media (min-width:991px){
		.content-button-mobile{
			display:none;
		}
	}
}

.product-card__image-wrapper {
	position: relative;
	overflow: hidden;
    &.fadein{
        .preloading-img-product:last-child{
            position: absolute;
            top: 0;
            width: 100%;
            background: transparent;
        }
		.preloading-img-product:first-child{
			position: relative;
		}
    }
	&.slider{
		position:relative;
        .product-card__image{
            display: block;
            &:not(.slick-initialized){
                .product-card__image-link:not(:first-child){
                    display:none;
                }
            }
        }
        .product-card__image:not(.slick-initialized){
            .product-card__image-link:not(:first-child){
                display:none;
            }
        }
		.slick-list{
			padding:0;
		}
		.slick-arrow{
			width:20px;
			height:30px;
			top:calc(50% - 15px);
			background:$white;
			text-align:center;
			line-height:30px;
			padding:0;
			border:0;
			opacity:0 !important;
			visibility:hidden !important;
			box-shadow:unset;
			display:block !important;
			&:before{
				font-size:13px;
			}
			&:hover{
				background:$theme-color;
				color:$white;
			}
			&.slick-prev{
				left:0;
			}
			&.slick-next{
				right:0;
			}
		}
		&:hover{
			.slick-arrow{
				opacity:1 !important;
				visibility:visible !important;
			}
		}
		@media (max-width:991px){
			.slick-arrow{
				width:20px;
				height:30px;
				top:calc(50% - 15px);
				line-height:30px;
				opacity:1 !important;
				visibility:visible !important;
				&:before{
					font-size: $font-size-base;
				}
			}
		}
	}
}
.product-card__image-link {
	display: block;
	img:not([role="presentation"]){
		width:100%;
	}
}
.product-card__image{
	position:relative;
	.product-card__img-hidden{
		position:absolute;
		bottom:0;
		left:0;
		height:100%;
		object-fit:cover;
		opacity:0;
		visibility:hidden;
		transition:all 0.3s ease;
	}
    .preloading-img-product{
        background: #f5f5f5;
        position: relative;
        img{
            position: absolute;
            top: 0;
            left:0;
			&.lazyload{
				height:0;
			}
        }
    }
    .pre-loading-image {
        z-index: revert;
        opacity: 1;
        display:block;
    }
    img.lazyloaded + .pre-loading-image{
        display:none;
    }
    .product-card__img-hidden + .pre-loading-image{
        display:none;
    }
}
.product-card__content {
	position: relative;
	text-align:center;
	margin-top: 15px;
	.product-review {
		.spr-badge{
			justify-content:center;
			padding:5px 0;
			margin-bottom:3px;
		}
		.spr-starrating{
			margin:0;
		}
	}
	@media (max-width:767px){
		margin-top:10px;
	}
}
.wpb-variants-swatch{
	visibility: visible;
	transition: all .3s ease;
	margin-top:7px;
	z-index: 10;
	width: 100%;
	.swatch-content{
		display: flex;
		align-items: center;
		justify-content: center;
		flex-wrap: wrap;
		margin-bottom:7px;
		font-weight:500;
		&.label{
			.title{
				font-size:13px;
				color:$gray-dark;
				position: relative;
				top: 1px;
			}
			.swatch-items{
				label{
					width:auto;
					height:auto;
					line-height:18px;
					margin:2px 7px;
					padding:0;
					font-size:12px;
					text-align:center;
					border: 0;
					border-radius:0;
					box-sizing: content-box;
					color: $gray-dark;
					&:before{
						display:none;
					}
					span{
						display: none;
					}
					&:hover{
						border-bottom: 1px solid $text-color;
						color: $gray-dark;
					}
				}
				&.active{
					label{
						border-bottom: 1px solid $text-color;
						color:$gray-dark;
					}
				}
			}
		}
		&.image{
			.swatch-items label{
				width:30px;
				height:30px;
				line-height:30px;
				border-radius:50%;
			}
		}
	}
	.swatch-items{
		label{
			width:20px;
			margin:2px 8px;
			height:20px;
			font-size:0;
			position:relative;
			cursor:pointer;
			line-height:20px;
			background:$white;
			border-radius: 50%;
			border:1px solid #e9e9e9;
			span{
				display: inline-block;
				line-height: 22px;
				color: $white;
				background: $gray-dark;
				padding: 0 10px;
				font-size: 12px;
				position: absolute;
				bottom: calc(100% + 10px);
				left: 50%;
				transform: translateX(-50%);
				opacity: 0;
				visibility: hidden;
				pointer-events:none;
				white-space: nowrap;
				@media (max-width:767px){
					display:none;
				}
				&:before{
					content: "";
					position: absolute;
					border-color: transparent;
					border-width: 4px;
					border-style: solid;
					left: calc(50% - 4px);
					bottom: -8px;
					border-top-color: #333;
				}
			}
			&:before{
				content: "";
				position: absolute;
				top: -4px;
				width: calc(100% + 8px);
				height: calc(100% + 8px);
				left: -4px;
				opacity: 0;
				visibility: hidden;
				border:1px solid $text-color;
				border-radius: 50%;
			}
			&:hover{
				span{
					opacity: 1;
					visibility: visible;
				}
				&:before{
					opacity: 1;
					visibility: visible;
				}
			}
		}
		&.active{
			label{
				&:before{
					opacity: 1;
					visibility: visible;
				}
			}
		}
		&.disabled{
			label{
				display:none;
			}
		}
	}
	@media (max-width:767px){
		margin-top:0;
		.swatch-items label{
			margin: 2px 5px;
			width:15px;
			height:15px;
			line-height:15px;
		}
		.swatch-content.label .swatch-items label{
			margin: 2px 4px;
		}
	}
}
.product-card__summary {
	display: none;
	padding: 10px 0;
	font-size: $font-size - 2;
	h3,h4,h5,h6 {
		margin: 0;
		padding: 10px 0;
		font-size: $font-size;
		font-weight: 500;
	}
	ul {
		margin: 0;
		@include rtl-padding-left(15px);
	}
}

.product-card__buttons {
    position: absolute;
    bottom: 15px;
    right: 0;
    z-index: 9;
    width: 100%;
	display:flex;
	padding:0 15px;
    transition: all .3s ease-in-out;
	justify-content:center;
	>div{
		position:relative;
		transition:all 0.3s ease;
		@include transform(translateY(50px));
		opacity:0;
		visibility:hidden;
		margin:0 5px;
		&:nth-child(2){
			transition-delay:0.1s;
		}
		&:nth-child(3){
			transition-delay:0.2s;
		}
		&:nth-child(4){
			transition-delay:0.3s;
		}
		&:before{
			content: attr(data-title);
			position: absolute;
			padding:0 10px;
			background: $gray-dark;
			color: $white;
			bottom: calc(100% + 10px);
			line-height: 23px;
			white-space: nowrap;
			left: 50%;
			@include transform(translateX(-50%));
			font-size: 12px;
			z-index: 10;
			opacity: 0;
			visibility: hidden;
			pointer-events: none;
		}
		&:after{
			content: "";
			position: absolute;
			bottom: 100%;
			left: calc(50% - 5px);
			border-width: 5px;
			border-style: solid;
			border-color:$gray-dark transparent transparent transparent;
			pointer-events: none;
			opacity: 0;
			visibility: hidden;
		}
		&:hover{
			&:before,&:after{
				opacity: 1;
				visibility: visible;
			}
		}
		@media (max-width: 991px) {
			&.product-card__quickview{
				display: none;
			}
		}
	}
	.btn {
		color: $gray-dark;
		display: inline-block;
		text-align: center;
		background: $white;
		width: 40px;
		height: 40px;
		line-height: 40px;
		font-size: 0;
		white-space: nowrap;
		padding:0;
		border-radius:50%;
		position:relative;
		cursor:pointer;
		box-shadow: 0 0px 10px 2px rgba($gray-dark,0.04);
		span {
			display: none;
		}
		&.btn--add-to-cart:before{
			content: "\e902";
			font-family: 'icomoon';
			font-size: 18px;
			margin: 0;
			display: inline-block;
		}
		&.btn-link{
			font-size:0;
			text-decoration: none;
			i{
				font-size:18px;
				line-height:38px;
			}
		}
		&.btn--quickview{
			&:before{
				font-size: 18px;
				font-family: 'icomoon';
				content: "\e906";
				line-height: 38px;
			}
			&.load-quickview{
				&:before{
					position: relative;
					display: inline-block;
					content: "";
					border: 2px solid rgba($gray-dark,.25);
					border-top-color: $gray-dark;
					width: 18px;
					height: 18px;
					background: none;
					-webkit-animation: 2s linear 0s normal none infinite running spin-load;
					animation: 2s linear 0s normal none infinite running spin-load;
					text-indent: 0;
					top: 8px;
					border-radius: 50%;
					-webkit-border-radius: 50%;
					-moz-border-radius: 50%;
					-ms-border-radius: 50%;
					-o-border-radius: 50%;
				}
				&:hover{
					&:before{
						border: 2px solid rgba($white,.5);
						border-top-color: $white;
					}
				}
			}
		}
		&.is-adding{
			&:before{
				position: relative;
				display: inline-block;
				content: "";
				border: 2px solid rgba($gray-dark,.25);
				border-top-color: $gray-dark;
				width: 18px;
				height: 18px;
				background: none;
				-webkit-animation: 2s linear 0s normal none infinite running spin-load;
				animation: 2s linear 0s normal none infinite running spin-load;
				text-indent: 0;
				font-size:0;
				top: 8px;
				border-radius: 50%;
				-webkit-border-radius: 50%;
				-moz-border-radius: 50%;
				-ms-border-radius: 50%;
				-o-border-radius: 50%;
			}
			&:hover,&.active{
				&:before{
					border: 2px solid rgba($white,.5);
					border-top-color: $white;
				}
			}
		}
		&:hover,
		&:focus {
			outline: 0;
			box-shadow: none;
		}
		&:hover {
			color: $white;
			background-color: $theme-color;
			-webkit-animation-name: beat;
			animation-name: beat;
			-webkit-animation-duration: 0.9s;
			animation-duration: 0.9s;
			-webkit-animation-timing-function: ease-in-out;
			animation-timing-function: ease-in-out;
			-webkit-animation-iteration-count: infinite;
			animation-iteration-count: infinite;
		}
	}
	.button-wishlist{
		button{
			color: $gray-dark;
			display: inline-block;
			text-align: center;
			background: $white;
			width: 40px;
			height: 40px;
			line-height: 40px;
			border: 0;
			font-size: 0;
			white-space: nowrap;
			padding:0;
			border-radius:50%;
			box-shadow: 0 0px 10px 2px rgba($gray-dark,0.04);
			&:before{
				content: "\e901";
				font-family: 'icomoon';
				font-size: 18px;
				display:inline-block;
			}
			span {
				display: none;
			}
			&.active{
				color:$white;
				background:$theme-color;
				&:before{
					content:"\f004";
					font-family: FontAwesome;
					display:inline-block;
					font-size: $font-size-base;
				}
			}
			&.load-wishlist{
				&:before{
					position: relative;
					display: inline-block;
					content: "";
					border: 2px solid rgba($gray-dark,.5);
					border-top-color: $gray-dark;
					width: 16px;
					height: 16px;
					background: none;
					animation: 2s linear 0s normal none infinite running spin-load;
					text-indent: 0;
					top: 8px;
					border-radius: 50%;
				}
				&:hover,&.active{
					&:before{
						border: 2px solid rgba($white,.5);
						border-top-color: $white;
					}
				}
			}
			&:hover,
			&:focus {
				outline: 0;
				box-shadow: none;
			}
			&:hover {
				color: $white;
				background-color: $theme-color;
				border-color:$theme-color;
				-webkit-animation-name: beat;
				animation-name: beat;
				-webkit-animation-duration: 0.9s;
				animation-duration: 0.9s;
				-webkit-animation-timing-function: ease-in-out;
				animation-timing-function: ease-in-out;
				-webkit-animation-iteration-count: infinite;
				animation-iteration-count: infinite;
			}
		}
	}
	.button-compare{
		button{
			color: $gray-dark;
			display: inline-block;
			text-align: center;
			background: $white;
			width: 40px;
			height: 40px;
			line-height: 40px;
			border: 0;
			font-size: 0;
			white-space: nowrap;
			padding:0;
			border-radius:50%;
			box-shadow: 0 0px 10px 2px rgba($gray-dark,0.04);
			&:before{
				content: "\e913";
				font-family: 'icomoon';
				font-size: 22px;
				display:inline-block;
			}
			span {
				display: none;
			}
			&.active{
				color:$white;
				background:$theme-color;
			}
			&.load-compare{
				&:before{
					position: relative;
					display: inline-block;
					content: "";
					border: 2px solid rgba($gray-dark,.5);
					border-top-color: $gray-dark;
					width: 16px;
					height: 16px;
					background: none;
					animation: 2s linear 0s normal none infinite running spin-load;
					text-indent: 0;
					top: 8px;
					border-radius: 50%;
				}
				&:hover{
					&:before{
						border: 2px solid rgba($white,.5);
						border-top-color: $white;
					}
				}
				&.active{
					&:before{
						border: 2px solid rgba($white,.5);
						border-top-color: $white;
					}
				}
			}
			&:hover,
			&:focus {
				outline: 0;
				box-shadow: none;
			}
			&:hover {
				color: $white;
				background-color: $theme-color;
				border-color:$theme-color;
				-webkit-animation-name: beat;
				animation-name: beat;
				-webkit-animation-duration: 0.9s;
				animation-duration: 0.9s;
				-webkit-animation-timing-function: ease-in-out;
				animation-timing-function: ease-in-out;
				-webkit-animation-iteration-count: infinite;
				animation-iteration-count: infinite;
			}
		}
		@media (max-width:991px){
			display:none !important;
		}
	}
}

.product-card__vendor {
	margin: 0;
	font-size: $font-size - 2;
}
.product-card__name {
	font-size: $font-size-base - 3;
    margin: 0 0 5px;
    font-weight: 400;
	text-transform: uppercase;
	letter-spacing: 1.5px;
	a {
		transition: color .3s ease;
		color: $gray-dark;
		&:hover {
			color: $theme-color;
			text-decoration: none;
		}
	}
	@media (max-width:767px){
		margin:0;
	}
}
.product-card__price{
    font-size: 16px;
    color: $theme-color;
	display: inline-flex;
    font-weight: 400;
	line-height:100%;
	flex-wrap:wrap;
	.product-price{
		color: $theme-color;
		&.product-price--regular{
			font-size: $font-size-base;
			color: $text-color;
			line-height:99%;
		}
		&.variant-price{
			color: $theme-color;
		}
		&.price-sale{
			color: $theme-color;
			position: relative;
			top: -2px;
		}
	}
	.pre_order{
		font-size:$font-size-base;
		color:#24b256;
		@include rtl-margin-left(5px);
	}
	@media (max-width:767px){
		font-size:14px;
		.product-group-price{
			font-size:14px;
		}
		.product-price{
			font-size:14px;
			&.product-price--regular{
				font-size:13px;
			}
		}
		.pre_order{
			font-size:14px;
		}
	}
}
.ttip_currency{
	position:relative;
	.tt_currency_txt{
		display:inline-block !important;
		position:absolute;
		background:$gray-dark;
		line-height:23px;
		color:$white !important;
		padding:0 10px;
		left: 50%;
		@include transform(translateX(-50%));
		bottom: calc(100% + 5px);
		font-size:$font-size - 2 !important;
		opacity:0;
		visibility:hidden;
		pointer-events:none;
		transition:all 0.3s ease;
		&:before{
			content:"";
			position:absolute;
			bottom:-10px;
			border-color:$gray-dark transparent transparent transparent;
			border-style:solid;
			border-width:5px;
			left:calc(50% - 5px);
		}
	}
	&:hover{
		.tt_currency_txt{
			opacity:1;
			visibility:visible;
		}
	}
}
.tt_currency_txt{
	display:none !important;
}
.product-card__label {
	position: absolute;
	top: 10px;
	left: 10px;
	z-index: 1;
	color:$white;
	text-align:left;
	>*{
		min-width: 60px;
		line-height: 25px;
		font-size: $font-size - 1;
		padding: 0 10px;
		text-align: center;
		white-space:nowrap;
		display:inline-block;
		margin-right:5px;
		vertical-align: top;
		@media (max-width:480px){
			min-width: 40px;
			line-height: 20px;
			font-size: 10px;
			padding: 0 5px;
		}
	}
}
.product-card__on-sale {
	text-align: center !important;
    color: $white;
    text-transform: capitalize;
    position: relative;   
    z-index: 1;
    background: #ff4e00;
}
.product-card__sold-out {
    z-index: 2;
    background: $white;
    color: $text-color;
	font-size: 12px;
}

// BREADCRUMBS
.template-article{
	.wpbingo-breadcrumbs {
		margin-bottom:0;
	}
}
section.wpbingo-breadcrumbs{
	.wpbingo-breadcrumbs__inner{
		text-align: center;
		position: relative;
		.wpbingo-breadcrumbs__title{
			font-size: 60px;
			text-align: center;
			@media (max-width:480px){
				font-size: 30px;
			}
		}
		.breadcrumb{
			align-items:center;
			padding:0;
			justify-content:center;
			margin:0;
		}
	}
	.wpbingo-blog-list{
		margin-top:25px;
		white-space: nowrap;
		a{
			font-size:18px;
			color:$text-color;
			position:relative;
			display:inline-block;
			padding-bottom:5px;
			&:before{
				content:"";
				position:absolute;
				bottom:-1px;
				width:0;
				height:1px;
				background:$theme-color;
				left:50%;
				transition:all 0.3s ease;
			}
			&:hover{
				color:$gray-dark;
			}
		}
		.item-blog{
			margin:0 15px;
			display:inline-block;
			&.active{
				a{
					color:$gray-dark;
					&:before{
						width:100%;
						left:0;
					}
				}
			}
		}
		@media (max-width:767px){
			padding-bottom:10px;
			overflow-x: auto;
		}
	}
	&.wpbingo-breadcrumbs--no-image{
		padding-top: 45px;
		padding-bottom: 30px;
	}
	&.wpbingo-breadcrumbs--image{
		margin-bottom:50px;
		.wpbingo-breadcrumbs__image{
			padding-top: 45px;
			padding-bottom: 60px;
			position:relative;
			
		}
		.bwp_slider-carousel.style_2{
			.item-collection {
				a .image:before{
					border-color:$theme-color;
				}
			}
			.slick-arrow{
				background: transparent;
				box-shadow: unset;
				&:hover {
					&:before{
						color: $theme-color;
					}
				}
			}
		}
	}
}
.wpbingo-breadcrumbs{
	margin-top:0;
	font-size:$font-size-base - 1;
	margin-bottom: 50px;
	.breadcrumb{
		background:transparent;
		padding:20px 0;
		border-radius:0;
		margin:0;
		align-items: center;
	}
	a{
		color:$text-color;
		font-size:$font-size-base - 1;
		&:hover{
			color:$theme-color;
		}
	}
	.breadcrumb__link{
		display: inline-block;
	}
	.breadcrumb__item{
		line-height:22px;
		&:before{
			content: "\f105";
			display: inline-block;
			font-family: $font-icon;
			font-size: 15px;
			margin: 0 8px;
			position: relative;
			top: 1px;
		}
		&:first-child{
			&:before{
				display:none;
			}
		}
	}
	.breadcrumb__text{
		color:$gray-dark;
	}
	&.have-collection.wpbingo-breadcrumbs--no-image{
		padding-bottom:0;
		border:0;
	}
	&.have-blog-list{
		&.wpbingo-breadcrumbs--no-image{
			.wpbingo-blog-list{
				margin-top:30px;
			}
			@media (max-width:767px){
				padding-bottom:0;
			}
		}
	}
	.bwp_slider-carousel{
		&.style_1{
			margin-top:45px;
			.item-collection{
				a{
					position:relative;
					display:block;
					h2{
						position:absolute;
						bottom:20px;
						width:100%;
						left:0;
						text-align: center;
						margin: 0;
						padding:0 15px;
						span{
							display:inline-flex;
							background:$white;
							font-size:$font-size-base;
							line-height:18px;
							padding:10px 15px;
							min-width:130px;
							position:relative;
							justify-content:center;
							align-items:center;
							text-transform: uppercase;
							transition: all 0.3s ease;
							@media (max-width:991px){
								min-width:unset;
								width:100%;
							}
						}
					}
					@media (min-width:1050px){
						&:hover{
							h2 span{
								background:$theme-color;
								color:$white;
							}
						}
					}
				}
				&.active{
					a h2 span{
						background:$theme-color;
							color:$white;
					}
				}
			}
			.slick-arrow{
				width:28px;
				height:28px;
				border-radius:50%;
				background:$white;
				color:$gray-dark;
				line-height:28px;
				top:calc(50% - 14px);
				text-align:center;
				padding:0;
				&:before{
					font-size:10px;
				}
				&.slick-prev{
					left: -15px;
				}
				&.slick-next{
					right: -15px;
				}
				&:hover{
					background:$theme-color;
					color:$white;
				}
				@media (max-width:991px){
					opacity:1;
					visibility:visible;
				}
			}
		}
		&.style_2{
			position:relative;
			.content-carousel{
				max-width: 750px;
				margin: 20px auto 0;
				position: relative;
			}
			.slick-arrow{
				top: 35%;
				&:before{
					font-size:20px;
				}
				&.slick-prev {
					&:before {
						content: "\e903";
						font-family: icomoon;
					}
				}
				&.slick-next {
					&:before {
						content: "\e905";
						font-family: icomoon;
					}
				}
				@media (max-width:991px){
					opacity:1;
					visibility:visible;
					width:25px;
					height:25px;
					line-height:25px;
					background:$theme-color;
					padding:0;
					&:before{
						font-size:15px;
					}
					&.slick-prev{
						left:-10px;
					}
					&.slick-next{
						right:-10px;
					}
				}
				
			}
			.item-collection{
				text-align:center;
				a{
					display:inline-block;
					margin-top:10px;
					
					img{
						border-radius:50%;
						width:100%;
						height:100%;
						margin:auto;
						aspect-ratio: 1;
						object-fit: cover;
						object-position: center;
					}
					.image{
						position:relative;
						margin: auto;
						margin-bottom: 10px;
						max-width: 115px;
						&:before{
							position: absolute;
							content: "";
							width: calc(100% + 11px);
							height: calc(100% + 11px);
							top: 50%;
							left: 50%;
							transform: translate(-50%,-50%);
							border-radius: 50%;
							border: 1px solid $theme-color;
							opacity:0;
						}
					}
					@media (min-width:1050px){
						&:hover{
							.image:before{
								opacity:1;
							}
							h2{
								color:$theme-color;
							}
						}
					}
				}
				h2{
					font-size: $font-size-base;
					color: $gray-dark;
					font-weight: 500;
					display: inline-block;
					position: relative;
					padding-bottom: 5px;
					text-transform: uppercase;
					margin:0;
					&:before{
						content: "";
						background: $theme-color;
						left: 0;
						bottom: 1px;
						position: absolute;
						transform: scaleX(0);
						transform-origin: 100% 50%;
						transition: transform .3s cubic-bezier(.25,.46,.45,.94);
						width: 100%;
						height: 2px;
					}
				}
				&.active, &:hover {
					a .image::before{
						opacity:1;
					}
					h2{
						color:$theme-color;
						&:before{
							transform: scaleX(1);
							transform-origin: 0 50%;
							transition-delay: .3s;
						}
					}
				}
			}
		}
	}
}

// OVERRIDE Magnific Popup
body {
  &.mfp-zoom-out-cur {
    position: fixed;
    width: 100%;
    overflow: hidden;
  }
}

.mfp-bg {
  background-color: $white;
  opacity: 1;
}

.mfp-figure {
  &::after {
    display: none;
  }
}

.mfp-counter {
  left: 0;
  color: $gray-dark;
  text-align: center;
}

button {
  &.mfp-arrow,
  &.mfp-close {
    opacity: 1;
    color: $gray-dark;

    &:hover {
      color: $theme-color;
    }

    &:focus {
      outline: 0;
    }
  }
}

.mfp-close {
  font-size: 44px;
}

.mfp-arrow-right {
  &::before {
    opacity: 1;
    border-left-color: $gray-dark;
    transition: all .3s ease;
  }

  &:hover {
    &::before {
      border-left-color: $theme-color;
    }
  }
}

.mfp-arrow-left {
  &::before {
    opacity: 1;
    border-right-color: $gray-dark;
    transition: all .3s ease;
  }

  &:hover {
    &::before {
      border-right-color: $theme-color;
    }
  }
}

// TOAST
.ajaxcart-toast {
  position: fixed;
  top: 30px;
  right: 30px;
  z-index: 99;
  color: $white;
  background-color: $toast-error-bg;
  border: none;
  border-radius: 0;

  .toast-body {
    padding: 15px 30px;
    @include rtl-padding-right(50px);
  }
}

.ajaxcart-toast__close {
  position: absolute;
  top: 5px;
  right: 5px;
  display: block;
  width: 14px;
  height: 14px;
  color: $white;
  line-height: 14px;
  text-align: center;
  opacity: .8;
  transition: all .3s ease;

  &:hover,
  &:focus {
    color: $white;
    outline: 0;
    opacity: 1;
  }
}

// ORDER DISCOUNT
.product-discount {
  margin: 0;
  padding: 0;
  list-style: none;
}

.product-discount__item {
  padding: 2px 0;
  font-size: $font-size - 2;
  font-weight: $body-font-weight;
  text-transform: uppercase;

  .fa {
    @include rtl-margin-right(5px);
  }
}

.order-discount {
  color: $gray-dark;
  font-size: $font-size - 2;
  text-transform: uppercase;

  .fa {
    @include rtl-margin-right(5px);
  }
}

// PAGINATION
.pagination {
	flex-flow: row wrap;
	justify-content: center;
	align-items: center;
	border-radius: 0;
	padding: 0;
	display: inline-flex;
	border-bottom:1px solid #e3e3e3;
	.pagination__navigation i{
		font-size:18px;
		line-height: 1;
		position: relative;
		top: 2px;
	}
	> span {
		> a,> span {
			display: block;
			width: 40px;
			height: 40px;
			padding:0 10px;
			color: $text-color;
			border: 0;
			line-height: 40px;
			text-align: center;
			text-decoration: none;
			transition: all .3s ease;
			position:relative;
			&:before{
				position: absolute;
				bottom: -1px;
				content: "";
				left: 0;
				transform: scaleX(0);
				transform-origin: 100% 50%;
				transition: transform .3s cubic-bezier(.25,.46,.45,.94);
				width: 100%;
				height: 1px;
				background: $gray-dark;
			}
			&:hover {
				color:$gray-dark;
				&:before{
					transform: scaleX(1);
					transform-origin: 0 50%;
					transition-delay: .3s;
				}
			}
		}
		&.current {
			display: block;
			width: 40px;
			height: 40px;
			padding:0 10px;
			color: $gray-dark;
			border: 0;
			line-height: 40px;
			text-align: center;
			text-decoration: none;
			transition: all .3s ease;
			position:relative;
			&:before{
				position: absolute;
				bottom: -1px;
				content: "";
				left: 0;
				transform: scaleX(1);
				transform-origin: 0 50%;
				width: 100%;
				height: 1px;
				background: $gray-dark;
			}
		}
	}
}

// AJAXCART
.cart-modal {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 99;
	display: flex;
	align-items: center;
	justify-items: center;
	width: 100vw;
	height: 100vh;
	padding:0 15px;
}

.cart-modal__overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: $overlay-black;
}

.cart-modal__inner {
	position: relative;
	z-index: 2;
	display: flex;
	flex-flow: row wrap;
	width: 100%;
	max-width: 800px;
	margin: 0 auto;
	padding:0 40px;
	background-color: $white;
	overflow: auto;
    height: auto;
    max-height: 80vh;
	transition:all 0.3s ease;
	opacity:0;
	transform:translateY(-100px);
	&.show{
		opacity:1;
		transform:translateY(0);
	}
	.product-card {
		.countdown-product {
			display: none;
		}
	}
	.cart-modal-recommendations{
		padding:30px 0 0;
		width:100%;
		flex:0 0 100%;
		text-align:center;
		border-top:1px solid $border-color;
		.wpb-variants-swatch,.product-card__buttons{
			display:none;
		}
		.wpbingo-title{
			margin-bottom:15px;
		}
		.wpbingo-title__heading{
			font-size: 20px;
			color: $gray-dark;
			margin: 0;
			display: inline-block;
			position: relative;
		}
		.product-recommendations{
			margin-top:0;
			margin: 0 -15px;
			.wpb-variants-swatch{
				display:none;
			}
		}
		.product-recommendations__inner{
			position:relative;
			.slick-arrow{
				width:30px;
				height:30px;
				background:$gray-dark;
				color:$white;
				padding:0;
				text-align:center;
				line-height:30px;
				&:before{
					font-size:12px;
				}
				&.slick-prev{
					left:-15px;
				}
				&.slick-next{
					right:-15px;
				}
				&:hover{
					background:$theme-color;
				}
			}
			&:hover{
				.slick-arrow{
					opacity:1;
					visibility:visible;
				}
			}
		}
		.slick-list{
			margin: 0 -7.5px;
			.slick-slide{
				padding:0 7.5px;
			}
		}
	}
	.cart-modal__header{
		width: 100%;
		text-align: center;
		padding: 20px;
		border-bottom:1px solid #e9e9e9;
		.cart-modal-totalcount{
			color:$text-color;
			span{
				color:$gray-dark;
			}
		}
	}
	@media (max-width:991px){
		.cart-modal-recommendations{
			display:none;
		}
	}
	@media (max-width:767px){
		padding:0 20px;
		.cart-modal__header{
			padding:20px 0;
		}
	}
}

.cart-modal__close {
	cursor: pointer;
	position: absolute;
	top: 10px;
	right: 8px;
	text-align: center;
	z-index: 1;
	display: inline-block;
	width: 28px;
	height: 28px;
	padding: 6px;
	border-radius: 100%;
	-webkit-border-radius: 100%;
	-moz-border-radius: 100%;
	-ms-border-radius: 100%;
	-o-border-radius: 100%;
	box-shadow: 0 2px 59px #0006;
	&:before,&:after{
		content: "";
		position: absolute;
		height: 1px;
		width: 14px;
		top: 50%;
		left: calc(50% - 7px);
		margin-top: -1px;
		background-color: $gray-dark;
		-webkit-transition: all .3s ease;
		transition: all .3s ease;
	}
	&:before{
		transform-origin: 50% 50%;
		-webkit-transform: rotate(-45deg);
		transform: rotate(-45deg);
	}
	&:after{
		transform-origin: 50% 50%;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
	}
	&:hover{
		&:before,&:after{
			-webkit-transform: rotate(0deg);
			transform: rotate(0deg);
		}
	}
}
#form-modal-addtocart{
	width:100%;
}
.cart-modal__middle{
	display:flex;
	padding:30px 0;
	align-items:center;
	margin:0 -30px;
	flex-wrap:wrap;
	position:relative;
	&:before{
		content:"";
		height:calc(100% - 60px);
		width:1px;
		background:$border-color;
		left:50%;
		top:30px;
		position:absolute;
	}
	>div{
		padding:0 30px;
	}
	.variant{
		font-size:13px;
		>span:not(:first-child){
			&:before{
				content:"|";
				margin:0 5px;
				display:inline-block;
			}
		}
	}
	&.load_modal{
		opacity:0.4;
	}
	@media (max-width:767px){
		margin:0;
		&:before{
			display:none;
		}
		>div{
			padding:0;
		}
	}
}
.cart-modal__product {
	width: 50%;
	flex:0 0 50%;
	display:flex;
	img{
		max-width:80px;
	}
	.info-product{
		@include rtl-padding-left(20px);
	}
	.modalcart__line_price{
		color:$gray-dark;
		font-size: $font-size-base;
		display:flex;
		.price_discount{
			font-size:14px;
			text-decoration:line-through;
			color:$text-color;
			@include rtl-margin-right(5px);
		}
	}
	.modalcart__quantity {
		position: relative;
		max-width: 105px;
		height: 35px;
		line-height: 35px;
		display:flex;
		border:1px solid $border-color;
		margin:7px 0;
		input{
			max-width: 53px;
			flex: 1;
			border: 0;
			text-align: center;
			color: $gray-dark;
			padding: 0;
		}
		button{
			background: transparent;
			border: 0;
			color: $gray-dark;
			padding: 0 5px;
			width:25px;
		}
		.is-loading & {
			opacity: .5;
		}
	}
	@media (max-width:767px){
		width: 100%;
		flex:0 0 100%;
		border:0;
		img{
			max-width:80px;
		}
	}
}
.cart-modal__content {
	width: 50%;
	.cart-modal-totalprice{
		color:$gray-dark;
		font-weight:500;
	}
	.shipping-bar-cart{
		margin-top:13px;
		margin-bottom:15px;
	}
	.ajaxcart_terms_conditions{
		padding: 0;
		margin: 10px 0;
		font-size:$font-size - 1;
		label:before{
			width: 12px;
			height: 12px;
			top: 1px;
		}
	}
	.ajaxcart-currency{
		padding: 0;
		margin-top: 15px;
	}
	@media (max-width:767px){
		width: 100%;
		flex:0 0 100%;
		border-top:1px solid #e5e5e5;
		padding-top:20px !important;
		margin-top:20px;
	}
}
.cart-modal__name {
	margin:0;
	color: $gray-dark;
}
.cart-modal__messenger {
	margin: 0 0 5px;
	color: $gray-dark;
	font-size:20px;
	&:before{
		display:inline-block;
		content: "\e92c";
		font-family: feather;
		color:#31a166;
		@include rtl-margin-right(5px);
	}
	@media (max-width:767px){
		font-size:$font-size;
	}
}
.cart-modal__funcs {
	display:flex;
	flex-wrap:wrap;
	margin:0;
	>*{
		@include rtl-margin(10px ,12px ,0 ,0);
		flex:1;
		&:last-child{
			margin:10px 0 0;
		}
	}
}
.cart-modal__btn {
	display: block;
	width: 100%;
	padding: 10px 15px;
	color: $white !important;
	background-color: $gray-dark;
	border: 1px solid $gray-dark;
	border-radius: 0;
	line-height: 25px;
	text-align: center;
	text-transform: uppercase;
	font-weight:500;
	letter-spacing:2px;
	position:relative;
	transition:all 0.3s ease;
	z-index:1;
	&:before{
		content:"";
		position:absolute;
		top:0;
		right:0;
		height:100%;
		width:0;
		background:$theme-color;
		transition:all 0.15s ease;
		z-index:-1;
	}
	&:not([disabled]){
		&:hover,
		&:focus {
			outline: 0;
			color: !important;
			border-color:$theme-color;
			&:before{
				width:100%;
				left:0;
			}
		}
	}
	@media (max-width:480px){
		padding: 5px 10px;
	}
}
.ajaxcart__footer-buttons{
	display:flex;
	margin:0 -12px;
	padding:0 30px;
	>div{
		flex:1;
		padding:0 12px;
	}
}
.cart-modal__btn--viewcart {
	color: $gray-dark !important;
	background-color: $white;
	border-color: $gray-dark;
	font-weight:600;
	&:hover,
	&:focus {
		color: $white !important;
		background-color: $theme-color;
		border-color: $theme-color;
	}
}
.cookie-message {
	display: none;
	.cart--no-cookies & {
		display: block;
	}
}
.header-cart__content {
	position: absolute;
	top: 100%;
	right: 0;
	z-index: 99;
	display: block;
	min-width: 380px;
	padding: 20px;
	background-color: $body-bg;
	box-shadow: $shadow;
	opacity: 0;
	visibility: hidden;
	transition: all .3s ease;
	width:100%;
	.ajaxcart__footer-price{
		padding:0 0 15px;
		border-top:0;
		border-bottom: 1px solid #e5e5e5;
		margin-top:0;
	}
	.ajaxcart__policies{
		padding:0;
		margin:15px 0 10px;
	}
	.gift-wrap{
		margin-bottom:5px !important;
		font-size: $font-size - 1;
	}
	.ajaxcart__footer{
		padding-top:20px;
		border-top: 1px solid #e5e5e5;
	}
	.ajaxcart__footer-buttons{
		padding:0;
	}
	.ajaxcart-currency{
		padding:0;
	}
	.ajaxcart_terms_conditions{
		padding:0;
	}
	.gift-wrap-title{
		display: flex;
		cursor:pointer;
		.icon-gift{
			position: relative;
			top: -5px;
			@include rtl-margin-right(5px);
			font-size: $font-size + 3;
		}
		&:hover{
			.icon-gift{
				-webkit-animation-name: beat;
				animation-name: beat;
				-webkit-animation-duration: 0.9s;
				animation-duration: 0.9s;
				-webkit-animation-timing-function: ease-in-out;
				animation-timing-function: ease-in-out;
				-webkit-animation-iteration-count: infinite;
				animation-iteration-count: infinite;
			}
		}
	}
}
.ajaxcart-container {
	color: $text-color;
}
.ajaxcart__inner {
	max-height: 320px;
	overflow-x: hidden;
	overflow-y: auto;
	&::-webkit-scrollbar-track
	{
		background-color: #ececec;
	}
	&::-webkit-scrollbar
	{
		width: 2px;
		background-color: #ececec;
	}

	&::-webkit-scrollbar-thumb
	{
		background-color:$gray-dark;
	}
}
.ajaxcart__product {
	padding:0 0 20px;
	margin-bottom:20px;
	border-bottom:1px solid #e9e9e9;
	&:last-child{
		margin:0;
		border:0;
	}
	&.is-loading{
		opacity:0.5;
	}
}
.ajaxcart__line-item {
	display: flex;
	flex-flow: row wrap;
}
.ajaxcart__line-item--left {
	width: 80px;
}
.ajaxcart__line-item--right {
	width: calc(100% - 80px);
	@include rtl-padding-left(20px);
	.ajaxcart__product-description{
		position:relative;
	}
}
.ajaxcart__product-image-wrapper {
	position: relative;
}
.ajaxcart__product-image {
	display: block;
	padding: 0;
	overflow: hidden;
	img {
		display: block;
		max-width: 100%;
	}
}
.ajaxcart__quantity {
	position: absolute;
	top: -7px;
	right: -7px;
	display: block;
	min-width: 25px;
	height: 20px;
	padding: 0 3px;
	color: $white;
	background-color: rgba(114, 114, 114, .9);
	border-radius: 20px;
	border: 2px solid $body-bg;
	font-size: 12px;
	line-height: 16px;
	text-align: center;
}
.ajaxcart__product-name {
	margin: 0;
	color: $gray-dark;
	font-weight: 400;
	transition: color .3s ease;
	display:inline-block;
	font-size: 12px;
	text-transform: uppercase;
	&:hover,
	&:focus {
		color: $theme-color;
		text-decoration: none;
	}
}
.ajaxcart__product-meta {
	display:inline-block;
	color: $text-color;
	font-size: $font-size - 3;
	span:not(:first-child){
		&:before{
			content:"|";
			display:inline-block;
			margin:0 5px;
		}
	}
}
.ajaxcart__price {
	display: block;
	color:$theme-color;
	font-size: $font-size-base;
}
.ajaxcart__price--regular {
	font-size: $font-size - 1;
	font-weight: $heading-font-weight;
	color:$text-color;
	@include rtl-margin-right(5px);
}
.ajaxcart__footer-price {
	display: flex;
	justify-content: space-between;
	margin-top: 20px;
	padding: 15px 30px 5px;
	border-top: 1px solid $border-color;
	align-items:center;
	.ajaxcart__subtotal-name{
		color:$gray-dark;
		font-size:16px;
		font-weight:500;
	}
}
.ajaxcart__subtotal {
	color: $gray-dark;
	font-size: 16px;
	font-weight:500;
}
.ajaxcart__policies {
	margin: 0;
	padding: 0 30px 10px;
	font-size: $font-size;
}
.ajaxcart-currency{
	padding: 0 30px;
	font-size:$font-size;
	.content{
		padding:15px 0 10px;
		border-top: 1px dashed rgba($gray-dark,0.15);
		border-bottom: 1px dashed rgba($gray-dark,0.15);
		margin-bottom:15px;
		p{
			margin:0;
		}
	}
	span{
		color:$gray-dark;
		font-weight:500;
	}
	.marquee{
		white-space: nowrap;
		margin-bottom: 5px;
		display: flex;
        overflow: hidden;
		p{
			@include transform(translateX(80px));
			animation: marquee 15s linear infinite; 
		}
	}
	@media (max-width:767px){
		padding: 0 15px;
	}
}
.ajaxcart_terms_conditions{
	padding: 0 30px;
	position:relative;
	overflow:hidden;
	label{
		&:before{
			content:"";
			width:15px;
			height:15px;
			border:1px solid rgba($gray-dark,0.25);
			border-radius:50%;
			display:inline-block;
			position: relative;
			top: 2px;
			@include rtl-margin-right(5px);
			box-shadow: inset 0 0 0 10px #fff;
			transition: all 0.3s ease;
		}
		a{
			z-index: 2;
			position:relative;
			display:inline-block;
			&:before{
				content:"";
				position:absolute;
				bottom:1px;
				right:0;
				width:100%;
				height:1px;
				background:$gray-dark;
				transition:all 0.3s ease;
			}
			&:hover{
				&:before{
					left:0;
					width:0;
				}
			}
		}
	}
	input{
		position: absolute;
		width: 100%;
		opacity: 0;
		z-index: 2;
		height:100%;
		cursor:pointer;
	}
	input:checked+label{
		&:before{
			background:$theme-color;
			border-color:$theme-color;
			box-shadow:inset 0 0 0 3px #fff;
		}
	}
	@media (max-width:767px){
		padding: 0 15px;
	}
}
.content_terms_conditions{
	position:fixed;
	top:0;
	left:0;
	height:100%;
	width:100%;
	align-items:center;
	justify-content:center;
	padding:20px;
	z-index:999;
	display:none;
	&.active{
		display:flex;
	}
	&.show{
		.content{
			opacity:1;
			visibility:visible;
			@include transform(translateY(0));
		}
	}
	.close-overlay{
		position:fixed;
		width:100%;
		height:100%;
		left:0;
		top:0;
		background:rgba($gray-dark,0.5);
	}
	.content{
		max-width:800px;
		width:100%;
		overflow:auto;
		background:$white;
		padding:30px;
		z-index:3;
		position:relative;
		opacity:0;
		visibility:hidden;
		@include transform(translateY(-100px));
		transition:all 0.3s ease;
		max-height: 100%;
		&::-webkit-scrollbar-track
		{
			background-color: #ececec;
		}
		&::-webkit-scrollbar
		{
			width: 2px;
			background-color: #ececec;
		}
		&::-webkit-scrollbar-thumb
		{
			background-color:$gray-dark;
		}
	}
	.close-conditions{
		cursor: pointer;
		position: absolute;
		top: 10px;
		right: 10px;
		text-align: center;
		z-index: 1;
		display: inline-block;
		width: 28px;
		height: 28px;
		padding: 6px;
		border-radius: 100%;
		-webkit-border-radius: 100%;
		-moz-border-radius: 100%;
		-ms-border-radius: 100%;
		-o-border-radius: 100%;
		box-shadow: 0 2px 59px #0006;
		&:before,&:after{
			content: "";
			position: absolute;
			height: 1px;
			width: 14px;
			top: 50%;
			left: calc(50% - 7px);
			margin-top: -1px;
			background-color: $gray-dark;
			-webkit-transition: all .3s ease;
			transition: all .3s ease;
		}
		&:before{
			transform-origin: 50% 50%;
			-webkit-transform: rotate(-45deg);
			transform: rotate(-45deg);
		}
		&:after{
			transform-origin: 50% 50%;
			-webkit-transform: rotate(45deg);
			transform: rotate(45deg);
		}
		&:hover{
			&:before,&:after{
				-webkit-transform: rotate(0deg);
				transform: rotate(0deg);
			}
		}
	}
	.title{
		border-bottom: 1px solid #ebebeb;
		margin-bottom: 30px;
	}
	h2{
		font-size: 28px;
		display: inline-block;
		position: relative;
		padding-bottom: 15px;
		margin:0;
		@media (max-width:767px){
			font-size: 22px;
		}
		&:before{
			content: "";
			position: absolute;
			bottom: -1px;
			left: 0;
			width: 100%;
			background: black;
			height: 1px;
		}
	}
}
.ajaxcart__footer-discount {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 13px 0 5px;
	border-top: 1px solid $border-color;
	.ajaxcart__price {
		@include rtl-padding-left(20px);
	}
}

.ajaxcart__note {
	margin: 15px 0 0;
}

.ajaxcart__note-label {
	color: $gray-dark;
	font-size:16px;
	font-weight:600;
}

.ajaxcart__note-input {
	border-radius: 0;
	&:focus {
		border-color: $theme-color;
		outline: 0;
		box-shadow: none;
	}
}

.ajaxcart__qty {
	position: relative;
	max-width: 105px;
	height: 35px;
	line-height: 35px;
	display:flex;
	border:1px solid $border-color;
	input{
		max-width: 48px;
		flex: 1;
		border: 0;
		text-align: center;
		color:$gray-dark;
		padding: 0;
	}
	button{
		background: transparent;
		border: 0;
		color:$gray-dark;
		padding: 0 5px;
	}
	.is-loading & {
		opacity: .5;
	}
}

.ajaxcart__remove {
	color: $text-color;
	font-size: $font-size - 3;
	text-decoration: underline;
	transition: color .3s ease;
	&:hover,
	&:focus {
		color: red;
	}
}

.cart-empty-message {
	margin: 0;
	padding: 0 5px;
	text-align: center;
}

.drawer {
	position: fixed;
	top: 0;
	bottom: 0;
	z-index: 999;
	display: block;
	width: 400px;
	max-width: 90%;
	background-color: $white;
	overflow: hidden;
	opacity: 0;
	visibility: hidden;
	transform: translate(100%, 0);
	transition: all .4s cubic-bezier(0.46, 0.01, 0.32, 1);
	right:0;
}

.drawer__overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 999;
	background-color: $overlay-black;
	opacity: 0;
	visibility: hidden;
	transition: all .4s cubic-bezier(0.46, 0.01, 0.32, 1);
}

.drawer--open {
	overflow: hidden;
	.drawer {
		opacity: 1;
		visibility: visible;
		transform: translate(0, 0);
	}
	.drawer__overlay {
		opacity: 1;
		visibility: visible;
	}
}
.drawer__header {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	padding: 45px 30px 20px;
	@media (max-width:480px){
		padding: 20px 15px 15px;
	}
}
.drawer__title {
	margin: 0;
	color: $gray-dark;
	font-size: 18px;
	line-height: 25px;
}
.drawer__close-button {
	position: absolute;
	top: 25px;
	@include rtl-right(27px);
	display: flex;
	text-transform: uppercase;
	color: $gray-dark;
	border: none;
	background-color: $nocolor;
	font-size: 10px;
	font-weight: 500;
	letter-spacing:2px;
	@include rtl-padding-right(18px);
	&:before,&:after{
		content: "";
		position: absolute;
		height: 1px;
		width: 12px;
		top: 50%;
		right: 0;
		margin-top: -1px;
		background-color: $gray-dark;
		-webkit-transition: all .3s ease;
		transition: all .3s ease;
	}
	&:before{
		transform-origin: 50% 50%;
		-webkit-transform: rotate(-45deg);
		transform: rotate(-45deg);
	}
	&:after{
		transform-origin: 50% 50%;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
	}
	&:hover{
		&:before,&:after{
			-webkit-transform: rotate(0deg);
			transform: rotate(0deg);
		}
	}
}
.ajaxcart .gift-wrap{
	.gift-wrap-title{
		&:hover{
			color:$theme-color;
			.icon-gift{
				i{
					-webkit-animation-name: beat;
					animation-name: beat;
					-webkit-animation-duration: 0.9s;
					animation-duration: 0.9s;
					-webkit-animation-timing-function: ease-in-out;
					animation-timing-function: ease-in-out;
					-webkit-animation-iteration-count: infinite;
					animation-iteration-count: infinite;
				}
			}
		}
	}
	label{
		margin:0 0 0 5px;
		color:$theme-color;
		font-weight:500;
		display:flex;
		span{
			color:$theme-color !important;
			font-size:$font-size !important;
			margin: 0 0 0 3px !important;
			&.tt_currency_txt{
				color:$white !important;
				font-size:$font-size - 2 !important;
			}
		}
		@media (max-width:767px){
			justify-content:center;
		}
	}
}
.drawer__inner {
	position: absolute;
	top: 160px;
	left: 0;
	bottom: 0;
	width: 100%;
	padding: 10px 0;
	overflow: hidden;
	#shipping-calculator{
		position: absolute;
		width: 100%;
		left: 0;
		padding: 30px;
		height: auto;
		bottom:0;
		background:$white;
		transition:all 0.3s ease;
		opacity:0;
		visibility:hidden;
		transform:translateY(100%);
		transition:all 0.3s ease;
		z-index:3;
		box-shadow: 0 1px 5px 2px rgba($gray-dark,0.1);
		&::-webkit-scrollbar-track
		{
			background-color: #F5F5F5;
		}
		&::-webkit-scrollbar
		{
			width: 5px;
			background-color: #F5F5F5;
		}

		&::-webkit-scrollbar-thumb
		{
			background-color: rgba($gray-dark, 0.1);
		}
		&.active{
			opacity:1;
			visibility:visible;
			transform:translateY(0);
		}
		.close-ajaxcart__info{
			height:40px;
			line-height:36px;
			text-transform:uppercase;
			font-size:12px;
			letter-spacing:1px;
			border:1px solid #e5e5e5;
			color:$gray-dark;
			padding:0 20px;
			text-align:center;
			font-weight:600;
			cursor:pointer;
			&:hover{
				background:$theme-color;
				color:$white;
				border-color:$theme-color;
			}
		}
		h3{
			font-size:16px;
			font-weight:600;
			font-family:$font-family-base;
		}
		label{
			color:$gray-dark;
			flex:0 0 100%;
		}
		.field{
			display:flex;
			align-items:center;
			flex-wrap:wrap;
		}
		select,input{
			height:35px;
			line-height:35px;
			border:1px solid $border-color;
			padding:0 15px;
			flex:0 0 100%;
			width:100%;
			border-radius:0;
			color:$gray-dark;
		}
		.get-rates{
			height:40px;
			line-height:40px;
			text-transform:uppercase;
			font-size:12px;
			letter-spacing:1px;
			border:0;
			color:$white;
			padding:0 20px;
			text-align:center;
			font-weight:600;
			cursor:pointer;
			background:$theme-color;
			margin-top:20px;
			&:hover{
				background:darken($theme-color,10%);
				color:$white;
			}
		}
		.shipping_calculate_mess,.shipping_calculate_rate{
			color:$gray-dark;
		}
	}
	.ajaxcart__footer {
		position: absolute;
		left: 0;
		width:100%;
		bottom: 0;
		padding:20px 0;
		background-color: $white;
		box-shadow: 0 5px 15px 5px rgba($gray-dark,0.1);
		@media (max-width:480px){
			padding:20px 0 0;
		}
		.ajaxcart__info{
			padding:0 30px;
			.ajaxcart__info_header{
				display:flex;
				justify-content:space-evenly;
				flex-wrap:wrap;
				>div{
					margin:0 10px;
					text-align: center;
					cursor:pointer;
					i{
						width:45px;
						height:45px;
						border-radius:50%;
						font-size:16px;
						color:$gray-dark;
						text-align: center;
						line-height: 45px;
						position:relative;
						display:inline-block;
						background:#f1f1f1;
					}
					span{
						display:block;
						white-space:nowrap;
						font-size:$font-size - 2;
						font-weight:500;
						color:$gray-dark;
						margin-top:5px;
					}
					&:hover{
						i{
							color:$white;
							background:$theme-color;
							border-color:$theme-color;
							-webkit-animation-name: beat;
							animation-name: beat;
							-webkit-animation-duration: 0.9s;
							animation-duration: 0.9s;
							-webkit-animation-timing-function: ease-in-out;
							animation-timing-function: ease-in-out;
							-webkit-animation-iteration-count: infinite;
							animation-iteration-count: infinite;
						}
					}
					&.gift-wrap{
						margin:0;
					}
				}
			}
			.ajaxcart__info_content{
				>div{
					opacity:0;
					visibility:hidden;
					position: absolute;
					width: 100%;
					bottom: 0;
					left: 0;
					padding: 30px;
					height: 100%;
					background:$white;
					transform:translateY(100%);
					transition:all 0.3s ease;
					z-index:3;
					.ajaxcart__note-input{
						height: calc(100% - 140px);
						margin-bottom:15px;
					}
					&.active{
						opacity:1;
						visibility:visible;
						transform:translateY(0);
					}
				}
				.close-ajaxcart__info{
					height:40px;
					line-height:36px;
					text-transform:uppercase;
					font-size:12px;
					letter-spacing:1px;
					border:1px solid #e5e5e5;
					color:$gray-dark;
					padding:0 20px;
					text-align:center;
					font-weight:600;
					cursor:pointer;
					&:hover{
						background:$theme-color;
						color:$white;
						border-color:$theme-color;
					}
				}
				.save{
					height:40px;
					line-height:40px;
					background:$theme-color;
					padding:0 20px;
					text-transform:uppercase;
					font-size:12px;
					letter-spacing:1px;
					color:$white;
					text-align:center;
					font-weight:600;
					margin-bottom:10px;
					cursor:pointer;
					&:hover{
						background:darken($theme-color,10%);
					}
				}
				.discount_code{
					label{
						color:$gray-dark;
						margin-bottom:10px;
						font-weight:600;
						font-size:16px;
					}
					.discount_code_input{
						width: 100%;
						height: 40px;
						line-height: 40px;
						margin-bottom: 15px;
						padding:0 20px;
					}
				}
			}
		}
	}
	.cart-empty-message {
		margin: 30px 0 0;
		padding: 15px 0;
		font-size: $font-size + 10;
	}
	.ajaxcart__inner {
		position: absolute;
		top: 0;
		@include rtl-left(0);
		@include rtl-right(20px);
		max-height: none;
		@include rtl-padding(0 ,10px ,0 ,30px);
	}
	@media (max-width:480px){
		.ajaxcart__inner{
			padding: 0 0 0 15px;
		}
		.ajaxcart__footer .ajaxcart__info{
			padding:0 15px;
		}
		.ajaxcart__footer-price{
			padding:15px 15px 0;
		}
		.ajaxcart__policies{
			padding: 0 15px 10px;
		}
		.ajaxcart__footer-buttons{
			padding:0 15px 20px;
			margin:0 -4px;
			box-shadow: inset 1px -3px 6px 0px #0000001a;
			>div{
				padding:0 4px;
			}
		}
		.ajaxcart__footer .ajaxcart__info .ajaxcart__info_header>div.gift-wrap .gift-wrap-title{
			display:block;
			.icon-gift{
				margin:0;
				font-size:20px;
			}
		}
	}
}
.ajaxcart__product-price-wrapper {
	padding:0;
	display: flex;
	flex-wrap:wrap;
	align-items: center;
	.pre_order{
		color: #24b256;
		@include rtl-margin-left(5px);
		&.hide{
			display:none;
		}
	}
}
.ajaxcart__product-name-wrapper {
	@include rtl-padding-right(15px);
	height:100%;
	display: flex;
	flex-direction: column;
}
.drawer__quantity {
	margin: 8px 0 0;
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
    align-items: center;
    width: 100%;
}
.cart__unit-price {
	display: block;
}
.shipping-bar-cart{
	margin-top:20px;
	.title-spend,.title-shipping{
		margin-bottom:20px;
		span{
			color:$gray-dark;
			font-weight:500;
		}
		&.hide{
			display:none;
		}
	}
	.shipping-progress_bar{
		height:3px;
		background:#e8e8e8;
		width:100%;
		position:relative;
		.shipping-progress{
			position:absolute;
			height:100%;
			background:#ffbc12;
			transition: all 0.3s ease;
			&:before{
				content: "\e939";
				position: absolute;
				right: -18px;
				font-family: bwpfont;
				top: 50%;
				-webkit-transform: translateY(-50%);
				-moz-transform: translateY(-50%);
				-ms-transform: translateY(-50%);
				-o-transform: translateY(-50%);
				transform: translateY(-50%);
				display: inline-flex;
				align-items: center;
				justify-content: center;
				color: #ffbc12;
				font-size: 20px;
				background: #fff;
				width: 36px;
				height: 36px;
				border-radius: 50%;
				border: 1px solid #ffbc12;
			}
			&.full{
				background:$theme-color;
				&:before{
					color:$theme-color;
					border-color:$theme-color;
				}
			}
		}
	}
}
// CART PAGE
.page-cart {
	padding: 80px 0 60px;
	.container{
		max-width:1020px;
	}
	.shipping-bar-cart{
		text-align:center;
		max-width:450px;
		margin-left:auto;
		margin-right:auto;
		margin-bottom:50px;
		.shipping-progress_bar{
			margin-bottom:20px;
		}
	}
	@media screen and (max-width: 767px) {
		padding: 60px 0;
	}
}

.page-cart__title {
	margin: 0 0 60px;
	color: $gray-dark;
	font-family: $font-family-second;
	font-size: 40px;
	font-weight: $heading-font-weight-bold;
	text-align: center;
	@media (max-width:767px){
		font-size:25px;
		margin: 0 0 40px;
	}
}
.cart-table {
	position: relative;
	.cart-loading{
		text-align:center;
		height:100px;
		&:before{
			position: relative;
			display: inline-block;
			content: "";
			border: 2px solid rgba($gray-dark,.25);
			border-top-color: $gray-dark;
			width: 30px;
			height: 30px;
			background: none;
			-webkit-animation: 2s linear 0s normal none infinite running spin-load;
			animation: 2s linear 0s normal none infinite running spin-load;
			text-indent: 0;
			border-radius: 50%;
			-webkit-border-radius: 50%;
			-moz-border-radius: 50%;
			-ms-border-radius: 50%;
			-o-border-radius: 50%;
			opacity:1;
			visibility:visible;
		}
	}
	#shipping-calculator{
		padding:40px 25px 30px;
		background:#f6f6f6;
		margin-top:40px;
		.content-shipping{
			display:flex;
			>*{
				padding:0 5px;
				margin:0;
				margin-bottom:10px;
				&.field_button,&.field_input{
					flex:1;
				}
			}
			.field_select{
				position:relative;
				&:before{
					position:absolute;
					top:calc(50% - 7.5px);
					@include rtl-right(15px);
					font-family: bwpfont;
					font-size: 15px;
					line-height: 15px;
					height: 15px;
					content: "\e924";
					-webkit-transform: rotate(-180deg);
					-moz-transform: rotate(-180deg);
					-ms-transform: rotate(-180deg);
					-o-transform: rotate(-180deg);
					transform: rotate(-180deg);
					transform-origin: center;
				}
			}
			select{
				background:$white;
				border:0;
				height:50px;
				padding:0 15px;
				-webkit-appearance: none;
				-moz-appearance: none;
				appearance: none;
				color:$gray-dark;
				width:100%;
			}
			input{
				background:$white;
				border:0;
				height:50px;
				line-height:50px;
				padding:0 15px;
				width:100%;
				&.button{
					background:$gray-dark;
					color:$white;
					padding:0 20px;
					font-weight:500;
					letter-spacing:2px;
					&:hover{
						background:$theme-color;
						-webkit-animation-name: text-indent;
						animation-name: text-indent;
						-webkit-animation-duration: 1.5s;
						animation-duration: 1.5s;
						-webkit-animation-timing-function: ease-in-out;
						animation-timing-function: ease-in-out;
						-webkit-animation-iteration-count: 1;
						animation-iteration-count: 1;
					}
				}
			}
		}
		h3{
			margin:0 0 30px;
			text-align:center;
			font-size:18px;
			font-weight:400;
		}
		#wrapper-response{
			text-align:center;
			margin-top:20px;
			.shipping_calculate_mess{
				color:$gray-dark;
				margin-bottom: 5px;
			}
			.shipping_calculate_rate{
				padding:0;
				list-style:none;
			}
		}
	}
	@media (max-width:991px){
		#shipping-calculator .content-shipping{
			flex-wrap:wrap;
			.field_select{
				flex: 0 0 50%;
			}
		}
	}
	@media (max-width:767px){
		#shipping-calculator{
			padding: 30px 15px 20px;
			.content-shipping{
				.field_select{
					flex: 0 0 100%;
				}
				>*{
					flex:0 0 100%;
					&.field_input,&.field_button{
						flex:0 0 100%;
					}
				}
				select,input{
					width:100%;
				}
			}
		}
	}
}
.cart-table__row {
	display: flex;
	flex-flow: row wrap;
	margin:0 -15px;
	align-items:center;
}
.cart-table__heading {
	color: $gray-dark;
	font-size: $font-size-base + 2;
	border-bottom:1px solid #eaeaea;
	padding-bottom:15px;
	margin-bottom:11px;
	.cart-table__col {
		padding: 0 15px;
	}
	@media screen and (max-width: 767px) {
		display: none;
	}
}
.cart-table__body {
	border-bottom:1px solid #eaeaea;
	padding-bottom:30px;
	margin-bottom:30px;
	.item-cart{
		padding:17px 0;
		&.is-loading{
			opacity:0.4;
		}
	}
}
.cart-table__col--quantity {
	width: 25%;
	max-width: 25%;
	padding: 0 15px;
	text-align:center;
	@media screen and (max-width: 767px) {
		width: 50%;
		max-width: 50%;
		padding-top:10px;
		@include rtl-text-align-left();
	}
}
.cart-table__col--product {
	width: 50%;
	max-width: 50%;
	padding: 0 15px;
	.product-content{
		display:flex;
		flex-wrap:wrap;
		align-items:center;
		.image{
			flex:0 0 120px;
		}
		.info{
			@include rtl-padding-left(20px);
			flex:1;
		}
		.cart-product-info_variant{
			font-size:13px;
			>span:not(:first-child){
				&:before{
					display:inline-block;
					content:"|";
					margin:0 5px;
				}
			}
		}
	}
	@media screen and (max-width: 767px) {
		width: 100%;
		max-width: 100%;
		.product-content{
			.image{
				flex:0 0 100px;
			}
		}
	}
}
.cart-table__col--price {
	width: 100% !important;
	max-width: 100% !important;
	@include rtl-text-align-right();
	padding: 0 15px;
	@media screen and (max-width: 767px) {
		width: 50%;
		max-width: 50%;
		padding-top: 10px;
		@include rtl-text-align-right();
	}
}
.cart-tablet__image {
	display: block;
	img {
		display: block;
		max-width: 100%;
	}
}
.cart-product-info__name {
	display: inline-block;
	color: $gray-dark;
	font-size: 15px;
	transition: all .3s ease;
	&:hover {
		color: $theme-color;
		text-decoration: none;
	}
}
.cart-product-info__price {
	margin: 3px 0 0;
	color: $gray-dark;
	font-size: $font-size;
	display:flex;
	.pre_order{
		color: #24b256;
		@include rtl-margin-left(5px);
	}
}
.cart-product-edit_variant{
	cursor:pointer;
	margin-top:5px;
	display:inline-block;
	position:relative;
	&:before{
		content: attr(data-title);
		position: absolute;
		padding:0 10px;
		background: $gray-dark;
		color: $white;
		bottom: calc(100% + 10px);
		line-height: 23px;
		white-space: nowrap;
		@include rtl-left(-10px);
		font-size: 12px;
		z-index: 10;
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
	}
	&:after{
		content: "";
		position: absolute;
		bottom: 100%;
		@include rtl-left(0);
		border-width: 5px;
		border-style: solid;
		border-color:$gray-dark transparent transparent transparent;
		pointer-events: none;
		opacity: 0;
		visibility: hidden;
	}
	&:hover{
		&:before,&:after{
			opacity: 1;
			visibility: visible;
		}
	}
	&:hover{
		color:$theme-color;
	}
}
.cart__price {
	color: $gray-dark;
	font-size: $font-size + 1;
}
.cart__price--regular {
	@include rtl-margin-right(5px);
	font-size: $font-size - 1;
	color:$text-color;
}
.cart-product-info__qty-label {
	display: none;
}
.cart-product-info__qty {
	display:flex;
	.wpbingo-qty {
		max-width: 100px;
		border:1px solid $border-color;
		display: flex;
		margin:0 auto 5px;
		button{
			border: 0;
			background: transparent;
			width: 30px;
			text-align: center;
			height: 40px;
			max-width: unset;
			display: inline-block;
			line-height: 40px;
			font-size: 16px;
			padding:0 5px;
			color:$gray-dark;
			&:hover{
				color:$theme-color;
			}
		}
		input{
			width: 40px;
			border: 0;
			text-align: center;
		}
	}
	select {
		cursor: pointer;
		-webkit-font-smoothing: antialiased;
		-webkit-text-size-adjust: 100%;
		-webkit-appearance: none;
		-moz-appearance: none;
		display: block;
		width: 90px;
		padding: 5px 15px;
		color: $gray-dark;
		border: 1px solid $border-color;
		border-radius: 0;
		background: {
		  image: url('//mapplegems.com/cdn/shop/t/59/assets/ico-select.svg?v=120449432774175234591787059114');
		  repeat: no-repeat;
		  position: right 10px center;
		  color: lighten($border-color, 5%);
		}
		font-family: $font-family-second;
		font-size: $font-size;
		font-weight: $heading-font-weight-medium;
		line-height: 1.5;
		text-rendering: optimizeLegibility;
		transition: all .3s ease;
		&:hover {
			border-color: darken($border-color, 5%);
		}
		&:focus {
			outline: 0;
		}
	}
	@media (max-width:767px){
		.wpbingo-qty{
			@include rtl-margin-left(0);
		}
	}
}
.cart-product-info__func {
	padding-bottom: 2px;
}
.cart-product-info_variant{
	label{
		font-weight:700;
		margin-bottom:0;
	}
}
.cart-product-info__btn--remove {
	cursor: pointer;
	display: inline-block;
	font-size: $font-size - 2;
	border-bottom:1px solid $text-color;
	color:$text-color;
	line-height:14px;
	&:hover,&:focus {
		color: $theme-color;
		border-bottom-color: $theme-color;
		outline: 0;
		box-shadow: none;
		text-decoration: none;
	}
}
.cart-table__footer {
	display:flex;
	margin:0 -15px;
	flex-wrap:wrap;
	>div{
		flex:1;
		padding:0 15px;
	}
	.discount_code{
		.title{
			color:$gray-dark;
		}
		.discount_code_input{
			height:50px;
			line-height:50px;
			width:100%;
			border: 1px solid #e2e2e2;
			border-radius: 0;
			padding: 0 20px;
			margin-top:10px;
		}
	}
	.cart-total{
		@include rtl-text-align-right();
		.cart-modal__btn{
			width:auto;
			line-height:20px;
			padding:13px 50px;
			@include rtl-margin-left(auto);
		}
		.cart-total__buttons{
			margin-top:15px;
		}
		.ajaxcart_terms_conditions{
			padding:0;
		}
	}
	.gift-wrap{
		margin-bottom:30px;
		.gift-wrap-title{
			display:flex;
			flex-wrap:wrap;
			color:$gray-dark;
			align-items:center;
			.icon-gift{
				font-size:30px;
				position: relative;
				top: -8px;
				@include rtl-margin-right(5px);
			}
			label{
				color:$theme-color;
				margin:0 5px;
			}
		}
		.button-gift-cart{
			padding:0 25px;
			line-height:38px;
			border:1px solid $gray-dark;
			cursor:pointer;
			z-index:1;
			position:relative;
			transition:all 0.3s ease;
			&:before{
				content:"";
				height:100%;
				right:0;
				width:0;
				background:$theme-color;
				z-index:-1;
				transition:all 0.3s ease;
				position:absolute;
			}
			&:hover{
				color:$white;
				border-color:$theme-color;
				&:before{
					left:0;
					width:100%;
				}
			}
		}
	}
	@media (max-width:767px){
		>div{
			flex:0 0 100%;
		}
		.cart-total{
			margin-top:30px;
		}
	}
}
.cart-note {
	margin: 0 0 30px;
	.form-control {
		border-radius: 0;
		border-color:#e2e2e2;
	}
}
.cart-note__label {
	color: $gray-dark;
	margin-bottom:20px;
}
.cart__discounts {
	padding: 10px 0;
	@include rtl-text-align-right();
	.order-discount {
		font-size: $font-size - 1;
		text-transform: uppercase;
	}
}
.cart-total__subtotal {
	display: flex;
	justify-content:flex-end;
	font-size: $font-size + 2;
	font-weight:500;
	color: $gray-dark;
}
.cart-total__subtotal-title {
	@include rtl-margin-right(5px);
}
.cart-tax {
	margin: 0 0 15px;
	@include rtl-text-align-right();
}
.cart-currency{
	span{
		color:$gray-dark;
		font-weight:500;
	}
}
#fire_work{
	position: fixed;
    top: 0;
	width:100%;
	height:100vh;
	z-index:9999;
	pointer-events:none;
	&.hide{
		opacity:0;
		visibility:hidden;
		z-index:-1;
	}
}
.page-cart-empty {
	padding: 60px 0;
	text-align: center;
}
.page-cart-empty__heading {
	margin: 0 0 10px;
	padding: 6px 0;
	color: $gray-dark;
	font-family: $font-family-second;
	font-size: $font-size + 5;
	font-weight: $heading-font-weight-medium;
	text-transform: uppercase;
}
.page-cart-empty__content {
	.btn {
		display: inline-block;
		margin: 10px 0 0;
		background:$gray-dark;
		border:0;
		letter-spacing:2px;
		font-weight:500;
		position:relative;
		z-index:1;
		&:before{
			content:"";
			position:absolute;
			width:0;
			height:100%;
			right:0;
			transition:all 0.3s ease;
			background:$theme-color;
			z-index:-1;
			top:0;
		}
		&:hover{
			&:before{
				left:0;
				width:100%;
			}
		}
	}
}
.gift_card-container{
	position: fixed;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
	justify-content:center;
	align-items:center;
	display:none;
	z-index:999;
	padding:15px;
	overflow:auto;
	&.show{
		display:flex;
	}
	.gift_card__overlay{
		position:fixed;
		height: 100%;
		width: 100%;
		top: 0;
		left: 0;
		background:rgba($gray-dark,0.5);
	}
	.gift_card__content{
		max-width:500px;
		margin:auto;
		position:relative;
		z-index:100;
		width:100%;
		background:$white;
		transition:all 0.3s ease;
		opacity:0;
		transform:translateY(-100px);
		&.show{
			opacity:1;
			transform:translateY(0);
		}
	}
	.img-giftcard{
		width:45%;
		flex:0 0 45%;
		padding:0 15px;
	}
	.bwp-single-info{
		width:55%;
		flex:0 0 55%;
		padding:0 15px;
	}
	.product-giftcard{
		padding:30px 0 50px;
		>.row{
			align-items:center;
		}
	}
	.product-giftcard__variants{
		.variants__label{
			color:$gray-dark;
			font-size:12px;
			text-transform:uppercase;
			font-weight:500;
			letter-spacing:1px;
		}
		.variants__options{
			display:flex;
			flex-wrap:wrap;
		}
		.single-option-selector{
			input{
				clip: rect(0,0,0,0);
				overflow: hidden;
				position: absolute;
				width: 1px;
				height: 1px;
			}
			label{
				cursor: pointer;
				position: relative;
				width: auto;
				height: auto;
				line-height: 15px;
				padding:5px 10px;
				min-width: 20px;
				text-align: center;
				border: 1px solid #dedede;
				border-radius: 0;
				box-sizing: content-box;
				overflow: hidden;
				margin: 0 10px 0 0;
				font-size:13px;
			}
			input[type=radio]:checked+label{
				border-color: $gray-dark;
				background: $white;
				color: $gray-dark;
			}
		}
	}
	.wpbingo-qty{
		height:40px;
		line-height:40px;
		border:1px solid #dfdfdf;
		padding:0 5px;
		display: inline-block;
		button{
			background:transparent;
			border:0;
			color:$gray-dark;
			padding:0;
			width:25px;
			height:25px;
			border-radius:50%;
			line-height:22px;
			font-size: $font-size-base;
			&:hover{
				background:#ededed;
				color:$gray-dark;
			}
		}
		input{
			background:transparent;
			border:0;
			color:$gray-dark;
			height:38px;
			line-height:38px;
			width: 50px;
			text-align: center;
			padding:0;
		}
	}
	.gift_card__btn-close{
		cursor: pointer;
		position: absolute;
		top: 10px;
		right: 10px;
		text-align: center;
		z-index: 1;
		display: inline-block;
		width: 28px;
		height: 28px;
		padding: 6px;
		border-radius: 100%;
		-webkit-border-radius: 100%;
		-moz-border-radius: 100%;
		-ms-border-radius: 100%;
		-o-border-radius: 100%;
		border: 0;
		background: transparent;
		box-shadow: 0 2px 59px #0006;
		&:before,&:after{
			content: "";
			position: absolute;
			height: 1px;
			width: 14px;
			top: 50%;
			left: calc(50% - 7px);
			margin-top: -1px;
			background-color: $gray-dark;
			-webkit-transition: all .3s ease;
			transition: all .3s ease;
		}
		&:before{
			transform-origin: 50% 50%;
			-webkit-transform: rotate(-45deg);
			transform: rotate(-45deg);
		}
		&:after{
			transform-origin: 50% 50%;
			-webkit-transform: rotate(45deg);
			transform: rotate(45deg);
		}
		&:hover{
			&:before,&:after{
				-webkit-transform: rotate(0deg);
				transform: rotate(0deg);
			}
		}
	}
	.product-giftcard_title{
		font-size: 22px;
		margin: 0 0 15px;
		padding:0 30px 10px;
		border-bottom:1px solid #dfdfdf;
	}
	.product-single__price{
		color:$gray-dark;
		font-size:18px;
	}
	.product-giftcard__buttons{
		position: absolute;
		width: 100%;
		left: 0;
		display: flex;
		bottom: 0;
		.product-single__add-to-cart{
			flex:1;
			.btn--add-to-cart{
				width:100%;
				background:$gray-dark;
				color:$white;
				font-size:12px;
				text-transform:uppercase;
				letter-spacing:2px;
				font-weight:500;
				position:relative;
				padding:0 20px;
				line-height:40px;
				border:0;
				&.active{
					&:before{
						position: relative;
						display: inline-block;
						content: "";
						border: 2px solid rgba($white,.25);
						border-top-color: $white;
						width: 16px;
						height: 16px;
						background: none;
						-webkit-animation: 2s linear 0s normal none infinite running spin-load;
						animation: 2s linear 0s normal none infinite running spin-load;
						text-indent: 0;
						top: 4px;
						border-radius: 50%;
						-webkit-border-radius: 50%;
						-moz-border-radius: 50%;
						-ms-border-radius: 50%;
						-o-border-radius: 50%;
						left: -5px;
					}
				}
				&.added{
					&:before{
						content: "\e92b";
						font-family: feather;
						display: inline-block;
						font-size: 18px;
						color: $white;
						left: -5px;
						top: 3px;
						line-height: 1;
						position: relative;
					}
				}
				&:hover{
					background:$theme-color;
					-webkit-animation-name: text-indent;
					animation-name: text-indent;
					-webkit-animation-duration: 1.5s;
					animation-duration: 1.5s;
					-webkit-animation-timing-function: ease-in-out;
					animation-timing-function: ease-in-out;
					-webkit-animation-iteration-count: 1;
					animation-iteration-count: 1;
				}
			}
		}
	}
	.product-giftcard__images{
		@include rtl-padding-left(30px);
	}
	.content_product_detail{
		@include rtl-padding-right(30px);
	}
	@media (max-width:480px){
		.product-giftcard_title{
			padding: 0 20px 10px;
		}
		.img-giftcard{
			width:100%;
			flex: 0 0 100%;
			.product-giftcard__images{
				padding:20px;
				.giftcard-images{
					max-width:150px;
					margin:auto;
				}
			}
		}
		.bwp-single-info{
			width:100%;
			flex: 0 0 100%;
			.content_product_detail{
				padding:20px;
			}
		}
	}
}
.edit_variant-cart-container{
	top:50%;
	left:50%;
	width:calc(100% - 30px);
	max-width:350px;
	max-height: 90%;
	@include transform(translate(-50%,calc(-50% + 100px)));
	overflow:auto;
	position:fixed;
	z-index:9999;
	transition:max-width 0.5s ease, transform 0.3s ease, opacity 0.3s ease;
	opacity:0;
	visibility:hidden;
	&.transform{
		@include transform(translate(-50%,-50%));
		opacity: 1;
		visibility:visible;
	}
	&.is-visible{
		max-width:700px;
	}
	.edit_variant-cart__content{
		width:100%;
		margin:auto;
		background:$white;
		z-index: 10;
		position:relative;
		transition:all 0.3s ease;
		.row{
			align-items:center;
			margin: 0;
			.bwp-single-info{
				z-index: 1;
				opacity: 1;
				visibility: visible;
			}
		}
	}
	.edit_variant__btn-close{
		cursor: pointer;
		position: absolute;
		top: 10px;
		right: 10px;
		text-align: center;
		z-index: 1;
		display: inline-block;
		width: 28px;
		height: 28px;
		padding: 6px;
		border-radius: 100%;
		-webkit-border-radius: 100%;
		-moz-border-radius: 100%;
		-ms-border-radius: 100%;
		-o-border-radius: 100%;
		box-shadow: 0 2px 59px #0006;
		border:0;
		background:$white;
		z-index:9;
		&:before,&:after{
			content: "";
			position: absolute;
			height: 1px;
			width: 14px;
			top: 50%;
			left: calc(50% - 7px);
			margin-top: -1px;
			background-color: $gray-dark;
			-webkit-transition: all .3s ease;
			transition: all .3s ease;
		}
		&:before{
			transform-origin: 50% 50%;
			-webkit-transform: rotate(-45deg);
			transform: rotate(-45deg);
		}
		&:after{
			transform-origin: 50% 50%;
			-webkit-transform: rotate(45deg);
			transform: rotate(45deg);
		}
		&:hover{
			&:before,&:after{
				-webkit-transform: rotate(0deg);
				transform: rotate(0deg);
			}
		}
	}
	.product-edit_variants_title{
		font-size: 26px;
		margin: 0 0 15px;
	}
	.img-edit_variants{
		position: relative;
		z-index: 3;
		width:350px;
		background:$white;
		.slick-list{
			margin:0;
		}
		.slick-carousel__item{
			padding:0;
		}
		.edit_variant-images__list:not(.slick-initialized){
			display:block;
			.slick-carousel__item{
				display:none;
				&.show{
					display:block;
				}
			}
		}
	}
	.bwp-single-info{
		position: absolute;
		z-index: -1;
		opacity: 0;
		visibility: hidden;
		-webkit-transition: opacity .3s,visibility 0s;
		transition: opacity .3s,visibility 0s;
		display: flex;
		flex-direction: column;
		justify-content: center;
		width:350px;
		padding:30px;
		@include rtl-right(0);
		max-height: 100%;
		.content_product_detail{
			height:100%;
			overflow:auto;
			@include rtl-padding-right(10px);
			&::-webkit-scrollbar-track
			{
				background-color: #ececec;
			}
			&::-webkit-scrollbar
			{
				width: 2px;
				background-color: #ececec;
			}

			&::-webkit-scrollbar-thumb
			{
				background-color:$gray-dark;
			}
			.variants-wrapper.image .variants__options{
				@include rtl-padding-left(5px);
			}
		}
	}
	.product-edit_variants__buttons{
		display:flex;
		flex-wrap:wrap;
		.product-single__add-to-cart{
			flex:1;
			margin:5px 0;
		}
		.btn--add-to-cart{
			line-height:30px;
			padding:5px 20px;
			background:$gray-dark;
			color:$white;
			font-size:12px;
			text-transform:uppercase;
			letter-spacing:2px;
			width:100%;
			border:0;
			span{
				display:inline-block;
			}
			&.active{
				-webkit-animation-name: none;
				animation-name: none;
				&:before{
					position: relative;
					display: inline-block;
					content: "";
					border: 2px solid rgba($white,.25);
					border-top-color: $white;
					width: 16px;
					height: 16px;
					background: none;
					-webkit-animation: 2s linear 0s normal none infinite running spin-load;
					animation: 2s linear 0s normal none infinite running spin-load;
					text-indent: 0;
					top: 4px;
					border-radius: 50%;
					-webkit-border-radius: 50%;
					-moz-border-radius: 50%;
					-ms-border-radius: 50%;
					-o-border-radius: 50%;
					left: -5px;
				}
			}
			&.added{
				-webkit-animation-name: none;
				animation-name: none;
				&:before{
					content: "\e92b";
					font-family: feather;
					display: inline-block;
					font-size: 18px;
					color: $white;
					left: -5px;
					top: 3px;
					line-height: 1;
					position: relative;
				}
			}
			&:hover{
				background:$theme-color;
				color: #fff;
				span{
					-webkit-animation-name: text-transform;
					animation-name: text-transform;
					-webkit-animation-duration: 1.5s;
					animation-duration: 1.5s;
					-webkit-animation-timing-function: ease-in-out;
					animation-timing-function: ease-in-out;
					-webkit-animation-iteration-count: 1;
					animation-iteration-count: 1;
				}
			}
		}
	}
	.product-quantity{
		@include rtl-margin(5px ,10px ,5px ,0);
		border: 1px solid #e6e6e6;
		height: 40px;
		display: inline-block;
		position: relative;
		.wpbingo-qty__number{
			width: 100px;
			border: 0;
			height: 38px;
			text-align: center;
			padding: 0 30px;
			font-size: 18px;
		}
		.wpbingo-qty__adjust--minus{
			position: absolute;
			top: 0;
			left: 0;
			background: transparent;
			line-height: 40px;
			border: none;
			width: 30px;
			height: 38px;
			color:#d5d5d5;
			font-size:18px;
			padding: 0;
			&:hover{
				color:$gray-dark;
			}
		}
		.wpbingo-qty__adjust--plus{
			position: absolute;
			top: 0;
			right: 0;
			background: transparent;
			line-height: 40px;
			border: none;
			font-size:18px;
			width: 30px;
			height: 38px;
			color:#d5d5d5;
			padding: 0;
			&:hover{
				color:$gray-dark;
			}
		}
		@media (max-width:480px){
			.wpbingo-qty__number{
				width: 95px;
				padding: 0 28px;
			}
			.wpbingo-qty__adjust--plus,.wpbingo-qty__adjust--minus{
				width:28px;
			}
		}
	}
	.price-container{
		display:flex;
		flex-wrap:wrap;
		color:$gray-dark;
		font-size:$font-size + 3;
		align-items: end;
		margin-bottom:10px;
		.product-single__price--compare-at{
			color:$text-color;
			font-size:$font-size + 1;
			text-decoration:line-through;
			@include rtl-margin-right(5px);
		}
	}
	.single-option-selector {
		position: relative;
		input {
			clip: rect(0, 0, 0, 0);
			overflow: hidden;
			position: absolute;
			width: 1px;
			height: 1px;
		}
		label {
			cursor: pointer;
			position: relative;
			width: auto;
			height: auto;
			line-height: 15px;
			padding:5px;
			min-width: 20px;
			text-align: center;
			border: 1px solid #dedede;
			border-radius: 0;
			box-sizing: content-box;
			overflow:hidden;
			margin:0 10px 10px 0;
			font-size:$font-size - 2;
			&.disabled {
				cursor: not-allowed;
				&::before {
					content: '';
					pointer-events: none;
					position: absolute;
					top: 0;
					left: 0;
					width: 100%;
					height: 100%;
					background: linear-gradient(to bottom right, transparent calc(50% - 1px), #d7d7d7 , transparent calc(50% + 1px) );
				}
			}
		}
		input[type='radio']:checked {
			+ label {
				border-color: $gray-dark;
				background:$gray-dark;
				color:$white;
				&.disabled {
					border-color: #ccc;
					background:$white;
					color:$gray-dark;
				}
				&[data-color] {
					&:after{
						border-color: $gray-dark;
					}
				}
				&[data-image]{
					box-shadow: 0 0 0 1px #000,inset 0 0 0 5px #fff;
				}
			}
		}
	}
	.variants-wrapper{
		.variants__options{
			display:flex;
			flex-wrap:wrap;
		}
		.variants__label{
			color: $gray-dark;
			margin-right: 15px;
			margin-bottom: 10px;
			font-weight: 400;
			font-size: 12px;
			text-transform: uppercase;
			letter-spacing: 1.5px;
			span{
				font-weight:500;
			}
		}
		&.label{
			.tool-tip{
				display:none;
			}
		}
		&.color{
			.variants__options{
				@include rtl-margin-left(6px);
			}
			.single-option-selector {
				position: relative;
				input {
					clip: rect(0, 0, 0, 0);
					overflow: hidden;
					position: absolute;
					width: 1px;
					height: 1px;
				}
				label {
					cursor: pointer;
					position: relative;
					text-align: center;
					box-sizing: content-box;
					padding: 0;
					font-size: 0;
					text-indent: -9999;
					background-repeat: no-repeat;
					background-position: center;
					background-size: 100%;
					border: 0;
					width:20px;
					height:20px;
					overflow:unset;
					border-radius:50%;
					margin:0 20px 20px 0;
					&:after{
						content:"";
						position:absolute;
						width:calc(100% + 10px);
						height:calc(100% + 10px);
						border:1px solid #d7d7d7;
						border-radius:50%;
						top:-5px;
						left:-5px;
					}
					&.disabled {
						&::before {
							content: '';
							pointer-events: none;
							position: absolute;
							top: -5px;
							left: 50%;
							width: 1px;
							height: calc(100% + 10px);
							background-color:#d7d7d7;
							@include transform(rotate(45deg));
						}
						&:hover{
							&:after{
								border-color: #d7d7d7;
							}
						}
					}
					span.tool-tip{
						position: absolute;
						bottom: calc(100% + 12px);
						background: $gray-dark;
						line-height: 25px;
						padding: 0 10px;
						color: $white;
						font-size: 13px;
						border-radius: 0;
						left: 50%;
						transform: translateX(-50%);
						pointer-events:none;
						opacity:0;
						visibility:hidden;
						&:before{
							bottom:-10px;
							content:"";
							position:absolute;
							border-width:5px;
							border-style:solid;
							border-color:$gray-dark transparent transparent;
							left:calc(50% - 5px);
						}
					}
				}
				input[type='radio']:checked {
					+ label {
						border-color: $gray-dark;
						background:$gray-dark;
						color:$white;
						&.disabled {
							border-color: #ccc;
							background:$white;
							color:$gray-dark;
						}
						&:after{
							border-color: $gray-dark;
						}
					}
				}
			}
		}
		&.image{
			.single-option-selector {
				label {
					cursor: pointer;
					position: relative;
					text-align: center;
					box-sizing: content-box;
					padding: 0;
					font-size: 0;
					text-indent: -9999;
					background-repeat: no-repeat;
					background-position: center;
					background-size: 100%;
					border: 0;
					width:60px;
					height:60px;
					overflow:unset;
					margin:0 15px 10px 0;
					transition:all 0.3s ease;
					&.disabled {
						&::before {
							content: '';
							pointer-events: none;
							position: absolute;
							top: 0;
							left: 0;
							width: 100%;
							height: 100%;
							background: linear-gradient(to bottom right, transparent calc(50% - 1px), #000 , transparent calc(50% + 1px) );
						}
					}
					span.tool-tip{
						position: absolute;
						bottom: calc(100% + 12px);
						background: $gray-dark;
						line-height: 25px;
						padding: 0 10px;
						color: $white;
						font-size: 13px;
						border-radius: 0;
						left: 50%;
						transform: translateX(-50%);
						pointer-events:none;
						opacity:0;
						visibility:hidden;
						&:before{
							bottom:-10px;
							content:"";
							position:absolute;
							border-width:5px;
							border-style:solid;
							border-color:$gray-dark transparent transparent;
							left:calc(50% - 5px);
						}
					}
				}
				input[type='radio']:checked {
					+ label {
						border-color: $gray-dark;
						background:$gray-dark;
						color:$white;
						box-shadow: 0 0 0 1px #000,inset 0 0 0 5px #fff;
						&.disabled {
							border-color: #ccc;
							background:$white;
							color:$gray-dark;
						}
					}
				}
			}
		}
	}
	.product-single__buttons {
		display:flex;
		flex-wrap:wrap;
		.product-single__add-to-cart{
			flex:1;
			display:flex;
			flex-wrap:wrap;
		}
		.btn--add-to-cart{
			-webkit-transition: none;
			transition: none;
			font-size: 12px;
			text-transform: uppercase;
			line-height: 50px;
			position: relative;
			background: $gray-dark;
			color: $white;
			text-align: center;
			@include rtl-margin-right(20px);
			padding: 0 15px;
			cursor: pointer;
			display: inline-block;
			vertical-align: top;
			flex: 1;
			margin: 5px 0;
			white-space: nowrap;
			border:0;
			font-family:$font-family-base;
			letter-spacing:2px;
			font-weight:500;
			&:hover{
				background:$theme-color;
				border-color:$theme-color;
				color:$white;
				-webkit-animation-name: text-indent;
				animation-name: text-indent;
				-webkit-animation-duration: 1.5s;
				animation-duration: 1.5s;
				-webkit-animation-timing-function: ease-in-out;
				animation-timing-function: ease-in-out;
				-webkit-animation-iteration-count: 1;
				animation-iteration-count: 1;
			}
			&[disabled]{
				background:#f1f1f1;
				color:$gray-dark;
				opacity:1;
				&:hover{
					cursor:not-allowed;
					background:#f1f1f1;
					-webkit-animation-name: none;
					animation-name: none;
				}
				&.is-adding{
					opacity:1;
					&:hover{
						cursor: wait;
					}
				}
			}
			&.is-adding{
				>span{
					&:nth-child(2){
						display:inline-block !important;
					}
				}
			}
			>span.btn__text{
				&:last-child{
					display:none;
				}
				&:only-child{
					display:inline-block !important;
				}
			}
		}
	}
	@media (max-width:767px){
		opacity:0 ;
		visibility:hidden ;
		&.is-visible{
			opacity:1 ;
			visibility:visible ;
			@include transform(translate(-50%,-50%));
		}
		.edit_variant-cart__content{
			padding:30px;
		}
		.product-edit_variants_title{
			font-size:18px;
		}
		.img-edit_variants,.bwp-single-info{
			width:100%;
			flex:0 0 100%;
			max-width:100%;
		}
		.slick-arrow{
			opacity:0;
			visibility:hidden;
		}
		.bwp-single-info{
			position: relative;
			opacity:1;
			z-index:2;
			visibility:visible;
			padding:0;
		}
		.product-edit_variants__images{
			max-width:200px;
			margin:0 auto 30px;
		}
	}
	@media (max-width:400px){
		&.add-content {
			.edit_variant-cart__content{
				padding:30px 15px;
			}
		}
		.product-quantity{
			width:100%;
			text-align: center;
			@include rtl-margin-right(0);
		}
	}
}
// SIDEBAR
.block-sidebar {
  position: relative;
  margin: 0 0 30px;
  padding: 0 0 1px;
}

.block-sidebar__title {
	color: $gray-dark;
    background: transparent;
    margin: 0 0 25px;
    position: relative;
	display:flex;
	justify-content:space-between;
	cursor:pointer;
	font-size: 20px;
	text-transform:uppercase;
	letter-spacing:2px;
	&:after{
		display:inline-block;
		font-family: bwpfont;
		font-size:15px;
		line-height:15px;
		height:15px;
		position:relative;
		top:3px;
		content: "\e924";
		transition:all 0.3s ease;
		@include transform(rotate(-180deg));
		transform-origin:center;
	}
	label{
		margin:0;
		position:relative;
		cursor:pointer;
	}
	.count{
		width:22px;
		height:22px;
		background:$theme-color;
		border-radius:50%;
		color:$white;
		font-size:12px;
		display:inline-block;
		text-align: center;
		line-height: 22px;
		@include rtl-margin-left(5px);
		position: relative;
		top: -1px;
		&.hide{
			display:none;
		}
	}
	&.active{
		&:after{
			@include transform(rotate(0));
		}
	}
	.active-price{
		width:5px;
		height:5px;
		background:$theme-color;
		border-radius:50%;
		font-size:12px;
		display:inline-block;
		text-align: center;
		line-height: 22px;
		@include rtl-margin-left(5px);
		position: relative;
		top: -8px;
	}
}

// PAGE
.page-header {
	padding: 30px 0;
}
.page-title {
	margin: 0 0 15px;
	padding: 0;
	color: $gray-dark;
	font-family: $font-family-second;
	font-size: $heading-font-size + 4;
	font-weight: 300;
	text-align: center;
	@media screen and (max-width: 767px) {
		margin: 0;
		font-size: $heading-font-size;
	}
	.fa {
		font-size: $heading-font-size - 10;
	}
	a {
		display: inline-block;
		@include rtl-margin-left(5px);
		color: $gray-dark;
		transition: color .3s ease;
		&:hover {
			color: $theme-color;
			text-decoration: none;
		}
	}
}

//PORTFOLIO
.page-portfolio{
	.content-article{
		&:hover{
			.article__image{
				img{
					transform:scale(1.2);
				}
			}
		}
	}
	.article{
		margin-bottom:30px;
	}
	.article__content{
		text-align:center;
	}
	.article__heading{
		font-size:18px;
		margin:0 0 5px;
	}
	.article__image{
		margin-bottom:15px;
		overflow:hidden;
		img{
			transition:all 0.8s ease;
		}
	}
	.list-tag{
		display:flex;
		padding:0;
		list-style:none;
		justify-content:center;
		margin:0;
		flex-wrap:wrap;
		li{
			text-transform:uppercase;
			letter-spacing:1.5px;
			font-size:11px;
			a{
				color:$text-color;
				&:hover{
					color:$theme-color;
				}
			}
			&:before{
				content:",";
				display:inline-block;
				@include rtl-margin-right(3px);
				color:$text-color;
			}
			&:first-child{
				&:before{
					display:none;
				}
			}
		}
	}
	.cate-post-content{
		text-align:center;
	}
	.pagination-ajax-blog{
		margin-top:30px;
	}
	.article__list.normal{
		.portfolio__featured-image{
			width: 100%;
			aspect-ratio: 1;
			object-fit: cover;
			object-position: center;
		}
	}
	.article__list.masory{
		columns: var(--col-xl);
		column-gap: 0;
		display:block;
		overflow:hidden;
		.article__image{
			margin:0;
		}
		.content-article{
			position:relative;
			&:hover{
				.article__content{
					opacity:1;
					visibility:visible;
					@include transform(scale(1));
				}
			}
		}
		.article__content{
			padding:0 15px;
			position:absolute;
			width:100%;
			height:100%;
			top:0;
			left:0;
			display:flex;
			justify-content:center;
			align-items:center;
			opacity:0;
			visibility:hidden;
			@include transform(scale(0.8));
			transition:all 0.5s ease;
		}
		.article__content-info{
			background:$white;
			max-width:330px;
			width:100%;
			text-align:center;
			padding:20px 15px;
		}
		.article__heading{
			margin:3px 0 0;
			a{
				&:after{
					display:block;
					content:"\e938";
					font-family:bwpfont;
					font-size:20px;
					margin-top:5px;
				}
			}
		}
		@media (max-width:1199px){
			columns: var(--col-lg);
		}
		@media (max-width:991px){
			columns: 2;
		}
		@media (max-width:767px){
			columns: 1;
		}
	}
	@media (max-width:1199px){
		.article__list{
			margin:0 -7.5px;
			.article {
				padding:0 7.5px;
				margin-bottom:15px;
			}
		}
	}
}

// BLOG
.page-blog{
	margin-top:50px;
	&.right{
		.page-blog__inner >.row >.col-xl-3{
			order:2;
		}
	}
	.article__image{
		margin:0 0 20px;
		position:relative;
	}
	.article__heading{
		font-size: 30px;
		line-height: 1.3;
		width: 100%;
		margin: 0 0 10px;
	}
	.article__image .blog-category{
		position:absolute;
		bottom:20px;
		@include rtl-left(20px);
		a{
			color:$gray-dark;
			display:inline-block;
			padding:0 15px;
			line-height:25px;
			background:$white;
			&:hover{
				background:$theme-color;
				color:$white;
			}
		}
	}
	.meta-date{
		margin-bottom:5px;
		font-size:$font-size - 1;
	}
	.article__meta{
		.article__meta-author{
			span{
				color:$gray-dark;
			}
		}
		>span:not(:first-child){
			&:before{
				display: inline-block;
				height: 15px;
				width: 1px;
				background: #d5d5d5;
				margin: 0 10px;
				content: "";
				position: relative;
				top: 3px;
			}
		}
	}
	&.standar{
		.article{
			padding:0 15px;
			margin-bottom:40px;
		}
		.pagination{
			justify-content: left;
		}
		.meta-date{
			@include rtl-right(15px);
		}
	}
	&.without{
		.article__list{
			max-width:1200px;
			margin-left:auto;
			margin-right:auto;
		}
	}
	&.list{
		.article__list{
			margin:0;
		}
		.article{
			width: 100%;
			display: flex;
			flex-wrap: wrap;
			margin-bottom: 50px;
			align-items: center;
			padding:0;
		}
		.article__heading{
			font-size:25px;
		}
		.article__content{
			flex:1;
		}
		.article__image{
			position: relative;
			display: inline-block;
			overflow: hidden;
			@include rtl-margin(0 ,0 ,0 ,30px);
			width: 50%;
		}
		.meta-date{
			@include rtl-right(15px);
		}
		@media (max-width:767px){
			.article__image{
				width:100%;
				margin:0 0 15px 0;
			}
			.article__content{
				order:2;
			}
		}
	}
	&.grid{
		.meta-date{
			@include rtl-left(15px);
		}
		.article{
			position:relative;
			margin-bottom:30px;
		}
		.article__heading{
			font-size:24px;
		}
	}
	&.modern{
		.article__image{
			margin-bottom:15px;
		}
		.content-modern{
			width:100%;
			padding:0 15px;
			.article{
				padding:0;
				position:relative;
			}
			.article__heading{
				font-size:35px;
			}
		}
		.content-moderns{
			width:100%;
			display:flex;
			.article__heading{
				font-size:25px;
			}
			@media (max-width:767px){
				flex-wrap:wrap;
			}
		}
	}
	@media (max-width:991px){
		.page-blog__inner >.row >.col-xl-3{
			order:2;
		}
	}
	@media (max-width:767px){
		.article__heading{
			font-size: 20px;
		}
	}
}
.cate-post-content{
	&.left{
		@include rtl-padding-left(35px);
	}
	&.right{
		@include rtl-padding-right(35px);
		order:1;
	}
	@media (max-width:1199px){
		&.left{
			@include rtl-padding-left(15px);
		}
		&.right{
			@include rtl-padding-right(15px);
		}
	}
}
.blog-sidebar {
	@media screen and (max-width: 991px) {
		margin-top: 50px;
	}
	@media screen and (max-width: 767px) {
		padding-bottom: 50px;
	}
}
.blog-search {
	position: relative;
	margin: 0 0 45px;
}
.blog-search__form {
	position: relative;
	display: flex;
	border-bottom:2px solid $gray-dark;
}
.blog-search__input {
	line-height: 35px;
    height: 35px;
    padding:0;
	border:0;
    width: 100%;
	&:focus {
		border-color: $theme-color;
	}
	&::placeholder{
		color:rgba($text-color,0.75);
	}
}
.blog-search__btn {
	font-size: 0;
    height: 35px;
    padding: 0;
    border-radius: 0;
	border:0;
	position:relative;
	i{
		font-size: 20px;
		line-height: 35px;
		color: $gray-dark;
	}
	&:hover{
		i{
			color:$theme-color;
		}
	}	
}
.blog-sidebar__title {
	margin: 0 0 25px;
	padding-bottom:10px;
	border: 0;
	position: relative;
	font-size:20px;
	text-transform: uppercase;
	letter-spacing: 1px;
}
.category-blog{
	margin-bottom: 45px;
	.list-category{
		padding:0;
		list-style:none;
    	border-top: 0;
		li{
			margin-bottom:10px;
			&:last-child{
				margin-bottom:0;
			}
			a{
				color:$text-color;
				&:hover{
					color:$theme-color;
				}
			}
			&.active{
				a{
					color:$theme-color;
				}
			}
		}
	}
}
.related-artibles {
	position: relative;
	margin: 0 0 50px;
	overflow: hidden;
	@media screen and (max-width: 767px) {
		margin: 0 0 30px;
	}
}
.related-artibles__list {
	padding:0;
	list-style:none;
}
.related-artibles__item {
	margin-bottom:30px;
	&:last-child{
		margin-bottom: 0;
	}
}
.related-artibles__card {
	display: flex;
	align-items:center;
}
.related-artibles__card-image {
	width: 90px;
    position: relative;
	@include rtl-margin-right(20px);
	img{
		width: 90px;
		aspect-ratio: 7/8;
		object-fit: cover;
		height: 100%;
		object-position: center;
	}
	@media (max-width:1199px) and (min-width:991px){
		width:100%;
		margin-bottom:10px;
	}
}
.related-artibles__card-content {
	position: relative;
    top: -3px;
	a{
		line-height: 20px;
		margin: 0 0 3px;
		display:block;
	}
	.blog-category{
		margin-bottom:3px;
		a{
			color:$text-color;
			text-transform:uppercase;
			letter-spacing:2px;
			font-size:10px;
			&:hover{
				color:$theme-color;
			}
		}
	}
	.article__meta-comment{
		font-size:12px;
		a{
			color:$text-color;
			&:hover{
				color:$theme-color;
			}
		}
	}
	@media (max-width:1199px) and (min-width:991px){
		width:100%;
		padding:0;
	}
}
.blog-tags__list {
	padding: 0;
	list-style-type: none;
	display: flex;
	flex-flow: row wrap;
	margin:0 -4px;
}
.blog-tags__item {
	padding: 0 4px;
	display: inherit;
	a {
		color: $text-color;
		border: 1px solid #e4e4e4;
		overflow: hidden;
		background: $nocolor;
		padding: 6px 20px;
		text-transform: capitalize;
		position: relative;
		text-decoration: none;
		transition: all .3s ease;
		font-weight: 400;
		z-index: 0;
		line-height: 18px;
		font-size: 14px;
		margin-bottom:8px;
		&:before{
			content: "";
			position: absolute;
			bottom: 0;
			right: 0;
			width: 0;
			height: 100%;
			background: #efefef;
			z-index: -1;
			transition: all .3s ease;
		}
		&:hover,
		&:focus {
			color: $white;
			border-color: $theme-color;
			&:before{
				width: 100%;
                background: $theme-color;
			}
		}
	}
}
.pagination-ajax-blog-loadmore{
	border:0;
	justify-content: center !important;
    width: 100%;
	margin-top:30px;
	flex-wrap:wrap;
	flex-direction: column;
	.collection-blog-count{
		margin-bottom:10px;
		font-size:16px;
		width:100%;
		text-align:center;
	}
	.content-percent{
		width: 100%;
		max-width: 350px;
		margin: auto;
		margin-bottom: 25px;
		height: 2px;
		background: #e3e3e3;
		position: relative;
		width:100%;
		.percent{
			position: absolute;
			top: 0;
			left: 0;
			height: 100%;
			background:$theme-color;
		}
	}
	a{
		display:inline-block;
		line-height:40px;
		border:1px solid $gray-dark;
		font-weight: 500;
		padding: 0 35px;
		position:relative;
		transition:all 0.3s ease;
		z-index:1;
		&:before{
			content:"";
			position:absolute;
			right:0;
			width:0;
			height:100%;
			background:$theme-color;
			transition:all 0.3s ease;
			z-index:-1;
		}
		&:hover{
			border-color:$theme-color;
			color:$white;
			&:before{
				left:0;
				width:100%;
			}
		}
		&[href=""]{
			display:none;
		}
		.lds-ellipsis {
			display: inline-block;
			position: absolute;
			width: 65px;
			height: 8px;
			top: calc(50% - 4px);
			left: calc(50% - 32.5px);
			opacity:0;
		}
		.lds-ellipsis div {
			position: absolute;
			top: 0;
			width: 8px;
			height: 8px;
			border-radius: 50%;
			background: $gray-dark;
			animation-timing-function: cubic-bezier(0, 1, 1, 0);
		}
		.lds-ellipsis div:nth-child(1) {
			left: 5px;
			animation: lds-ellipsis1 0.6s infinite;
		}
		.lds-ellipsis div:nth-child(2) {
			left: 5px;
			animation: lds-ellipsis2 0.6s infinite;
		}
		.lds-ellipsis div:nth-child(3) {
			left: 29px;
			animation: lds-ellipsis2 0.6s infinite;
		}
		.lds-ellipsis div:nth-child(4) {
			left: 53px;
			animation: lds-ellipsis3 0.6s infinite;
		}
		&.active{
			border-color:transparent;
			color:transparent;
			&:before{
				display:none;
			}
			.lds-ellipsis{
				opacity:1;
			}
		}
	}
}
// PRODUCT-PAGE
.product-page{
	.container{
		max-width: 1440px;
		&.container-full-image{
			max-width: 100%;
		}
	}

}

// ARTICLE CARD
.article__list {
	display: flex;
	flex-flow: row wrap;
	margin-left: -15px;
	margin-right: -15px;
}
.article {
	width: 100%;
	margin: 0 0 40px;
	@include rtl-padding-left(15px);
	@include rtl-padding-right(15px);
}
.article--detail {
	@include rtl-padding-left(0px);
	@include rtl-padding-right(0px);
	@media screen and (max-width: 767px) {
		margin: 0;
	}
}
.article__image {
	margin: 0 0 50px;
}
.article__featured-image-wrapper {
	position: relative;
	overflow: hidden;
}
.article__featured-image {
	display: block;
	margin: 0 auto;
	position: absolute;
	width: 100%;
	top: 0;
	bottom: 0;
	left: 0;
}
.article__heading {
	margin: 0 0 15px;
	color: $gray-dark;
	font-family: $font-family-second;
	font-size: $heading-font-size - 4;
	font-weight: $heading-font-weight-medium;
	@media screen and (max-width: 767px) {
		font-size: $heading-font-size - 8;
	}
}
.article__heading-link {
	color: $gray-dark;
	transition: color .35s ease;
	&:hover {
		color: $theme-color;
		text-decoration: none;
	}
}
.article__meta {
	display: flex;
	flex-flow: row wrap;
	margin: 0 0 15px;
	color: $text-color;
	align-items:center;
	a {
		color: $text-color;
		transition: color .3s ease;
		&:hover {
			color: $theme-color;
			text-decoration: none;
		}
	}
	i{
		font-size:$font-size-base;
		margin-right:5px;
		color:$gray-dark;
	}
}
.article__meta--post {
	justify-content: center;
}
.article__read-more {
	margin-top:20px;
}
.article__read-more-url {
	display: inline-block;
    position: relative;
    font-size: 16px;
    transition: all .3s ease;
	padding-bottom:5px;
	&:before{
		content: "";
		width: 100%;
		height: 1px;
		transition: all .3s ease;
		position: absolute;
		bottom: 2px;
		@include rtl-left(0);
		background: $gray-dark;
	}
	&:hover{
		&:before{
			width: 50%;
			background:$theme-color;
		}
	}
}
.article__tags {
	a {
		font-size: 14px;
		color: $gray-dark;
		font-weight: 400;
		line-height: 30px;
		@include rtl-margin(2.5px ,5px ,2.5px ,0);
		border: 1px solid #e5e5e5;
		display: inline-block;
		padding: 0 20px;
		background: transparent;
		white-space: nowrap;
		position:relative;
		transition:all 0.3s ease;
		z-index:1;
		&:before{
			content:"";
			position:absolute;
			left:0;
			top:0;
			width:0;
			height:100%;
			background:$theme-color;
			transition:all 0.3s ease;
			z-index:-1;
		}
		&:hover {
			color: $white;
			border-color:$theme-color;
			&:before{
				width:100%;
			}
		}
	}
}
.tags__title {
	color: $gray-dark;
	font-weight: $heading-font-weight-medium;
}
// ARTICLE SINGLE
.main-content{
	&.prallax_image,&.sticky_title{
		.wpbingo-breadcrumbs {
			display:none;
		}
		.page-article{
			margin:0;
		}
	}
}
.page-article{
	.page-article__inner{
		&.prallax_image{
			.article__image{
				background-attachment: fixed;
				background-size: cover;
				height: 80vh;
				margin-bottom: 40px;
				background-position: 50%;
				position: relative;
				margin-top:0;
				&:before{
					content: "";
					position: absolute;
					width: 100%;
					height: 100%;
					top: 0;
					left: 0;
					background: rgba(0,0,0,.25);
				}
			}
			.content-info{
				width: 100%;
				padding: 50px 15px 35px;
				bottom: 0;
				left: 0;
				position: absolute;
				margin: 0;
				&:before{
					display:none;
				}
				.blog-category a{
					color:$white;
					border-color:$white;
					&:hover{
						border-color:$theme-color;
					}
				}
			}
			.content-image-single{
				position:relative;
			}
			.page-title{
				max-width:1200px;
				margin-left:auto;
				margin-right:auto;
				color:$white;
			}
			.article__meta{
				color:$white;
				span{
					color:$white;
				}
			}
			.article--detail{
				max-width: 1055px;
				margin-left: auto;
				margin-right: auto;
			}
			@media (max-width:991px){
				.article__image{
					height: 65vh;
				}
			}
			@media (max-width:480px){
				.article__image{
					height: 55vh;
				}
				.content-info{
					padding: 40px 15px 10px;
				}
			}
		}
		&.sticky_title{
			.article__content{
				@include rtl-text-align-left();
				blockquote{
					@include rtl-text-align-left();
				}
			}
			.post-content-entry{
				justify-content: revert;
			}
			.container >.row{
				display: inline-block;
			}
			.article__image{
				background-attachment: fixed;
				background-size: cover;
				height: 80vh;
				margin-bottom: 40px;
				background-position: 50%;
				position: relative;
				margin-top:0;
			}
			.content-info{
				float: left;
				flex: 0 0 33.33333%;
				max-width: 33.33333%;
				margin: 0;
				position: sticky;
				top: 50px;
				padding:0 15px 25px;
				@include rtl-text-align-left();
				&:before{
					@include rtl-left(15px);
					@include transform(unset);
				}
				.blog-category{
					@include rtl-text-align-left();
				}
			}
			.page-title{
				@include rtl-text-align-left();
			}
			.article__meta--post {
				justify-content: flex-start;
			}
			.post-single{
				float: left;
				flex: 0 0 66.66667%;
				max-width: 66.66667%;
				@include rtl-padding(0 ,15px ,0 ,35px);
			}
			@media (max-width:991px){
				.content-info{
					flex: 0 0 100%;
					max-width: 100%;
					float: unset;
					position: relative;
					margin-bottom:40px;
					top:0;
					&:before{
						@include rtl-left(50%);
						@include transform(translateX(-50%));
					}
					.blog-category{
						text-align:center;
					}
				}
				.page-title{
					text-align:center;
				}
				.article__meta--post {
					justify-content: center;
				}
				.post-single{
					float: unset;
					flex: 0 0 100%;
					max-width: 100%;
					padding:0 15px;
				}
				.article__image{
					height: 65vh;
				}
			}
			@media (max-width:480px){
				.article__image{
					height: 55vh;
				}
			}
		}
		&.simple_title{
			.content-title{
				margin: 0 0 50px;
				background: #f6f6f6;
				padding: 90px 0;
				.content-info{
					max-width: 1440px;
					@include rtl-padding-left(15px);
					@include rtl-padding-right(15px);
					margin: auto;
					padding-bottom:40px;
				}
			}
			.post-single{
				max-width: 1055px;
				margin-left: auto;
				margin-right: auto;
			}
			.article__meta{
				margin-bottom:0;
			}
		}
	}
	.content-info {
		position:relative;
		padding-bottom: 25px;
		margin-bottom:40px;
		&:before{
			position: absolute;
			content: "";
			bottom: 0;
			left: 50%;
			-webkit-transform: translateX(-50%);
			transform: translateX(-50%);
			width: 210px;
			height: 1px;
			background: #e2e2e2;
		}
		.blog-category{
			text-align:center;
			margin-bottom:20px;
			a{
				color:$gray-dark;
				padding:0 25px;
				line-height:30px;
				border:1px solid $gray-dark;
				display:inline-block;
				&:hover{
					border-color:$theme-color;
					background:$theme-color;
					color:$white;
				}
			}
		}
	}
	.article__meta-author{
		span{
			color:$gray-dark;
		}
	}
	.article__meta--post{
		font-size:$font-size - 1;
		span{
			color:$gray-dark;
			display:inline-block;
			margin:0 5px;
		}
	}
	.page-title{
		font-size: 50px;
		word-break: break-word;
		margin: 0 0 15px;
		font-weight: 300;
	}
	.post-single{
		&.sidebar_left{
			@include rtl-padding-left(35px);
			.article__content{
				@include rtl-text-align-left();
				blockquote{
					@include rtl-text-align-left();
				}
			}
			.post-content-entry{
				justify-content: revert;
			}
		}
		&.sidebar_right{
			@include rtl-padding-right(35px);
			.article__content{
				@include rtl-text-align-left();
				blockquote{
					@include rtl-text-align-left();
				}
			}
			.post-content-entry{
				justify-content: revert;
			}
		}
		&.one_column{
			.article--detail{
				max-width: 1055px;
				margin-left: auto;
				margin-right: auto;
			}
		}
	}
	.article__content{
		blockquote {
			margin: 30px 0;
			padding:0 80px;
			color: $gray-dark;
			@include rtl-border-left(2px solid $gray-dark);
			position: relative;
			font-size: 18px;
			text-align:center;
			i{
				display: block;
				font-size: 23px;
				color: #dadada;
				margin-bottom: 20px;
			}
			h6 {
				font-size:12px;
				font-weight: 500;
				text-transform: uppercase;
				letter-spacing:1.5px;
				margin: 15px 0 0;
				padding:0;
			}
		}
	}
	.post-content-entry{
		display: flex;
		align-items: center;
		justify-content: center;
		flex-wrap: wrap;
		margin-top: 55px;
		padding-bottom: 45px;
		width: 100%;
		text-align:center;
	}
	.article__social-sharing {
		display:flex;
		align-items:center;
		margin:10px 0;
		label{
			color:$gray-dark;
			@include rtl-margin(0 ,10px ,0 ,0);
		}
		.social-sharing a{
			display: inline-block;
			width: 36px;
			height: 36px;
			@include rtl-margin-right(5px);
			text-align: center;
			line-height: 34px;
			border: 1px solid #e5e5e5;
			color:$gray-dark;
			border-radius:50%;
			span{
				line-height: 34px;
				padding:0;
				height: 34px;
				font-size: 13px;
			}
			&:hover{
				background:$theme-color;
				color:$white;
				border-color:$theme-color;
			}
		}
	}
	.prevNextArticle{
		padding: 30px 0;
		display: inline-flex;
		width: 100%;
		border-top: 1px solid #e5e5e5;
		border-bottom: 1px solid #e5e5e5;
		position: relative;
		align-items:center;
		.backto_category{
			a{
				width:50px;
				height:50px;
				border-radius:50%;
				border:1px solid #dfdfdf;
				text-align: center;
				line-height: 50px;
				font-size: 35px;
				color:$gray-dark;
				display:inline-block;
				position:relative;
				&:before{
					content: attr(data-title);
					position: absolute;
					padding:0 10px;
					background: $gray-dark;
					color: $white;
					bottom: calc(100% + 10px);
					line-height: 26px;
					white-space: nowrap;
					left:50%;
					@include transform(translateX(-50%));
					z-index: 10;
					opacity: 0;
					font-size:$font-size;
					visibility: hidden;
					pointer-events: none;
				}
				&:after{
					content: "";
					position: absolute;
					bottom: 100%;
					left: calc(50% - 5px);
					border-width: 5px;
					border-style: solid;
					border-color:$gray-dark transparent transparent transparent;
					pointer-events: none;
					opacity: 0;
					visibility: hidden;
				}
				&:hover{
					&:before,&:after{
						opacity: 1;
						visibility: visible;
					}
				}
			}
		}
		.previousArticle,.nextArticle{
			flex:1;
			a{
				color: #9b9b9b;
				font-size: 15px;
				text-transform: capitalize;
				display: block;
				&:hover{
					color:$theme-color;
					.title{
						color:$theme-color;
					}
				}
			}
		}
		.previousArticle{
			@include rtl-padding-right(30px);
		}
		.nextArticle{
			@include rtl-text-align-right();
			float: right;
			@include rtl-padding-left(30px);
		}
		.hoverExtend{
			font-size: 12px;
			text-transform: uppercase;
			margin-bottom: 5px;
			letter-spacing:1.5px;
		}
		.title{
			overflow-wrap: break-word;
			margin: 0;
			font-size: 20px;
			overflow: hidden;
			text-overflow: ellipsis;
			white-space: nowrap;
		}
	}
	&.portfolio{
		.content-single-portfolio{
			max-width:1050px;
			margin-left:auto;
			margin-right:auto;
		}
		.article__featured-image-wrapper{
			text-align: center;
		}
		.content-single-info{
			display:flex;
			width:100%;
			align-items: center;
			margin-bottom:50px;
		}
		.page-title{
			font-size:34px;
			@include rtl-text-align-left();
			margin:10px 0 0;
		}
		.article__content{
			@include rtl-text-align-left();
		}
		.content-client{
			max-width:40%;
			flex:0 0 40%;
			@include rtl-padding(30px ,0 ,30px ,25px);
			@include rtl-border-left(1px solid #e9e9e9);
			ul{
				padding:0;
				list-style:none;
				margin:0;
				li{
					margin-bottom:5px;
					&:last-child{
						margin-bottom:0;
					}
				}
				label{
					color:$gray-dark;
					margin:0;
				}
			}
		}
		.content-info{
			padding:0;
			margin:0;
			flex:1;
			&:before{
				display:none;
			}
			.post-content-entry{
				padding:0;
				margin:0;
				border:0;
				justify-content:revert;
				.article__tags a{
					padding:0;
					border:0;
					font-size:12px;
					text-transform:uppercase;
					letter-spacing:2px;
					color:$text-color;
					margin:0;
					line-height:1;
					&:after{
						content:",";
						display:inline-block;
						@include rtl-margin-right(3px);
						color:$text-color;
					}
					&:before{
						display:none;
					}
					&:last-child{
						&:after{
							display:none;
						}
					}
					&:hover{
						color:$theme-color;
					}
				}
			}
		}
		.content-social{
			display:flex;
			width:100%;
			justify-content:space-between;
			flex-wrap:wrap;
			margin-top: 30px;
			padding-bottom: 20px;
			.post-content-entry{
				width:auto;
				justify-content: revert;
				padding-bottom:0;
				margin:5px 0;
				border:0;
			}
		}
		.related-portfolio{
			margin-top:70px;
			.title-related{
				font-size:26px;
				margin:0 0 40px;
				text-align:center;
			}
			.item-related{
				.related-image{
					overflow:hidden;
					img{
						aspect-ratio: var(--related-image-ratio);
						width: 100%;
						object-fit: cover;
						transition:all 0.8s ease;
					}
				}
				&:hover{
					.related-image img{
						@include transform(scale(1.2));
					}
				}
			}
			.title-article-rel{
				font-size:18px;
				margin:20px 0 10px;
			}
			.list-tag{
				display:flex;
				padding:0;
				list-style:none;
				margin:0;
				flex-wrap:wrap;
				li{
					text-transform:uppercase;
					letter-spacing:1.5px;
					font-size:11px;
					a{
						color:$text-color;
						&:hover{
							color:$theme-color;
						}
					}
					&:before{
						content:",";
						display:inline-block;
						@include rtl-margin-right(3px);
						color:$text-color;
					}
					&:first-child{
						&:before{
							display:none;
						}
					}
				}
			}
			.slick-arrow{
				width:30px;
				height:30px;
				line-height:30px;
				background:$theme-color;
				color:$white;
				text-align:center;
				padding:0;
				&:before{
					font-size:14px;
				}
				&.slick-prev{
					left:-15px;
				}
				&.slick-next{
					right:-15px;
				}
				&:hover{
					background:darken($theme-color,10%);
				}
			}
		}
		.article-comments{
			max-width: 1050px;
			margin-left: auto;
			margin-right: auto;
		}
		&.prevNextArticle{
			margin:0;
		}
		@media (max-width:767px){
			.article__image{
				margin:0 0 25px;
			}
			.page-title{
				font-size: 25px;
				margin-top: 5px;
			}
			.content-single-info{
				flex-wrap:wrap;
				margin-bottom: 20px;
			}
			.content-info{
				width:100%;
				flex:0 0 100%;
				margin:0 0 12px;
			}
			.content-client{
				width:100%;
				flex:0 0 100%;
				padding:0;
				border:0;
				max-width:100%;
			}
			.related-portfolio{
				.slick-arrow{
					width:25px;
					height:25px;
					line-height:25px;
					&:before{
						font-size:12px;
					}
					&.slick-prev{
						left:-12.5px;
					}
					&.slick-next{
						right:-12.5px;
					}
				}
			}
		}
	}
	@media (max-width:991px){
		.post-single{
			&.sidebar_left{
				order:1;
				@include rtl-padding-left(15px);
			}
			&.sidebar_right{
				order:1;
				@include rtl-padding-right(15px);
			}
		}
		.col-xl-3{
			order:2;
		}
	}
	@media (max-width:767px){
		.page-title{
			font-size: 25px;
		}
		.article__content {
			blockquote {
				font-size: $font-size-base;
				padding:0 30px;
			}
		}
		.article-comments__heading{
			font-size: 25px;
		}
		.article-comments .form-group{
			margin-bottom:15px;
		}
		.title{
			display:none;
		}
		.prevNextArticle .hoverExtend{
			margin-bottom:0;
		}
	}
}

// ARTICLE COMMENT
.article-comments {
	padding:0;
	.form-group{
		margin-bottom: 30px;
	}
	.form-control{
		padding: 0 20px;
		border: none;
		line-height:60px;
		height:60px;
		border:1px solid #d6d6d6;
	}
	textarea.form-control{
		min-height:216px;
		height:auto;
		padding: 20px;
		line-height:1.4;
	}
	.form-row{
		margin:0 -15px;
		.col-12{
			padding:0 15px;
		}
	}
	.form-button{
		text-align:center;
		input{
			background: $gray-dark;
			border-radius: 0;
			color: $white;
			padding: 0 30px;
			height: 50px;
			line-height: 50px;
			font-size: 12px;
			text-transform: uppercase;
			font-weight: 500;
			letter-spacing: .1em;
			margin: auto;
			border:0;
			&:hover{
				background:$theme-color;
				border-color:$theme-color;
				color:$white;
			}
		}
	}
	.rte{
		line-height:1.5;
	}
}
.article-comments__heading {
	font-size: 30px;
    color: $gray-dark;
    margin: 50px 0 30px;
    text-align: center;
}
.comments_list {
	margin: 0;
	padding: 0;
	list-style: none;
}
.comments_item {
	padding: 15px 0;
	border-bottom: 1px solid $border-color;
	margin-bottom:10px;
}
.comment-card__header {
	margin: 0 0 8px;
}
.comment-card__author {
	@include rtl-margin-right(30px);
	color: $gray-dark;
	font-size:15px;
	&:before{
		font-family: bwpfont;
		content: "\e91c";
		font-size:16px;
		display:inline-block;
		@include rtl-margin-right(5px);
		color: $text-color;
	}
}
.comment-card__date {
	color: $gray-dark;
	font-size:15px;
	&:before{
		font-family: feather;
		content: "\e927";
		font-size:16px;
		display:inline-block;
		@include rtl-margin-right(5px);
		color: $text-color;
	}
}
.errors {
	margin: 0 0 20px;
	color: $error;
	@include rtl-text-align-left();
	ul {
		margin: 0;
		@include rtl-padding-left(0px);
		list-style: none;
		li {
			padding: 2px 0;
		}
	}
}
// ACCOUNT PAGE
.login-popup{
	position: fixed;
	left:0;
	top:0;
	width:100%;
	height:100%;
	z-index: 100;
	opacity:0;
	visibility:hidden;
	transition:all 0.3s ease;
	max-width:100%;
	display:none;
	align-items:center;
	justify-content:center;
	padding:15px;
	&.sideout{
		display:block;
	}
	.remove-form-login-register{
		position:fixed;
		width:100%;
		height:100%;
		top:0;
		left:0;
		z-index:90;
		display:none;
		opacity:0;
		visibility:hidden;
		background: rgba($gray-dark, .6);
	}
	.content-form-register{
		&.popup{
			position:relative;
			z-index:99;
			background:$white;
			max-width:510px;
			margin:auto;
			max-height:100%;
			width:100%;
			padding:40px 30px 30px;
			text-align:center;
			.login__content{
				border:1px solid #e5e5e5;
				padding:45px 30px 30px;
				text-align:center;
			}
		}
		&.sideout{
			width:365px;
			right:0;
			padding:70px 20px 40px;
			background:$white;
			z-index:99;
			height:100%;
			top:0;
			position:absolute;
			display: flex;
			flex-direction: column;
			transition:all 0.3s ease;
			@include transform(translateX(100%));
			.login__content{
				flex: 1;
				overflow: auto;
				&::-webkit-scrollbar-track
				{
					background-color: #ececec;
				}
				&::-webkit-scrollbar
				{
					width: 2px;
					background-color: #ececec;
				}
				&::-webkit-scrollbar-thumb
				{
					background-color:$gray-dark;
				}
			}
			h3{
				display:block;
				padding:0;
				@include rtl-text-align-left();
				position:unset;
				@include transform(unset);
				margin-bottom:25px;
				&:before{
					display:none;
				}
			}
			.close-form-login{
				font-size:11px;
				font-weight:500;
				text-transform:uppercase;
				letter-spacing:1px;
				display:block;
				position:absolute;
				top:30px;
				right:20px;
				cursor:pointer;
				font-weight:500;
				span{
					cursor: pointer;
					text-align: center;
					z-index: 1;
					display: inline-block;
					width: 25px;
					height: 8px;
					position:relative;
					&:before,&:after{
						content: "";
						position: absolute;
						height: 1px;
						width: 14px;
						top: 50%;
						left: calc(50% - 7px);
						margin-top: -1px;
						background-color: $gray-dark;
						-webkit-transition: all .3s ease;
						transition: all .3s ease;
					}
					&:before{
						transform-origin: 50% 50%;
						-webkit-transform: rotate(-45deg);
						transform: rotate(-45deg);
					}
					&:after{
						transform-origin: 50% 50%;
						-webkit-transform: rotate(45deg);
						transform: rotate(45deg);
					}
				}
				&:hover{
					color:$theme-color;
					span{
						&:before,&:after{
							background-color: $theme-color;
							-webkit-transform: rotate(0deg);
							transform: rotate(0deg);
						}
					}
				}
			}
		}
	}
	.form-control{
		line-height:50px;
		height:50px;
		padding:0 20px;
		border:1px solid #e5e5e5;
	}
	h3{
		display:inline-block;
		font-size:20px;
		padding:0 30px 10px;
		background:$white;
		margin: 0;
		position: absolute;
		left: 50%;
		top:8px;
		transform: translate(-50%,50%);
		&:before{
			content:"";
			position:absolute;
			bottom:0;
			width:calc(100% + 10px);
			left:-5px;
			height:1px;
			background:$theme-color;
		}
	}
	.form-button{
		input{
			width:100%;
			padding:0 20px;
			line-height:50px;
			letter-spacing:2px;
			font-weight:500;
			background:$theme-color;
			border:0;
			&:hover{
				background:$gray-dark;
				-webkit-animation-name: text-indent;
				animation-name: text-indent;
				-webkit-animation-duration: 1.5s;
				animation-duration: 1.5s;
				-webkit-animation-timing-function: ease-in-out;
				animation-timing-function: ease-in-out;
				-webkit-animation-iteration-count: 1;
				animation-iteration-count: 1;
			}
		}
	}
	.form-link{
		margin:20px 0;
		@include rtl-text-align-left();
		.js-forget-password{
			color:$gray-dark;
			position:relative;
			display:inline-block;
			&:before{
				content:"";
				position:absolute;
				bottom:0;
				right:0;
				width:100%;
				height:1px;
				background:$gray-dark;
				transition:all 0.3s ease;
			}
			&:hover{
				color:$theme-color;
				&:before{
					left:0;
					width:0;
					background:$theme-color;
				}
			}
		}
	}
	.register-account{
		padding:15px;
		border:1px solid $gray-dark;
		line-height:18px;
		font-size:12px;
		font-weight:500;
		text-transform:uppercase;
		letter-spacing:1px;
		margin-top:20px;
		text-align:center;
		a{
			color:$theme-color;
			display:inline-block;
			position:relative;
			&:before{
				content:"";
				position:absolute;
				bottom:0;
				right:0;
				width:100%;
				height:1px;
				background:$theme-color;
				transition:all 0.3s ease;
			}
			&:hover{
				color:$gray-dark;
				&:before{
					left:0;
					width:0;
					background:$gray-dark;
				}
			}
		}
	}
	.recover-password__form{
		.form-link{
			text-align:center;
			margin-bottom:0;
		}
	}
	.close-form-login{
		display:none;
	}
	&.active{
		opacity:1;
		visibility:visible;
		display:flex;
		.remove-form-login-register{
			opacity:1;
			visibility:visible;
			display:block;
		}
		.content-form-register{
			&.sideout{
				@include transform(translateX(0));
			}
		}
	}
}
.page-account{
	h1{
		text-align:center;
		margin: 80px 0;
		font-size:50px;
		@media (max-width:480px){
			margin: 45px 0;
			font-size: 30px;
		}
	}
}
.page-account__inner {
	max-width: 950px;
    margin: 0 auto;
    padding: 0 0 40px;
	&.dashboard{
		max-width: 1170px;
	}
	.login-form-container{
		margin:0 -30px;
		display:flex;
		flex-wrap:wrap;
		h3{
			font-size:25px;
			margin-bottom:30px;
		}
		>div{
			padding:0 30px;
			width:50%;
			flex:0 0 50%;
		}
		.form-button input{
			width:100%;
			background:$gray-dark;
			color:$white;
			border:0;
			letter-spacing:2px;
			font-weight:500;
			font-size:12px;
			height:45px;
			&:hover{
				background:$theme-color;
			}
		}
		.form-link{
			@include rtl-text-align-left();
			margin:20px 0;
			a{
				color:$gray-dark;
				text-decoration:underline;
				&:hover{
					color:$theme-color;
				}
			}
		}
	}
	.description{
		font-size:18px;
	}
	.register-account{
		margin-top:30px;
		a{
			display:inline-block;
			padding:0 30px;
			line-height:45px;
			background:$gray-dark;
			color:$white;
			font-size:12px;
			font-weight:500;
			letter-spacing:2px;
			text-transform:uppercase;
			&:hover{
				background:$theme-color;
			}
		}
	}
	.login-register__heading{
		font-size:25px;
		text-transform:revert;
		@include rtl-text-align-left();
	}
	.recover-password__summary{
		padding: 0;
		font-style: normal;
		@include rtl-text-align-left();
		margin-bottom: 20px;
		&:after{
			display:none;
		}
	}
	.recover-password__form .form-button{
		display:flex;
		align-items:center;
		margin-top:20px;
		>*{
			flex:0 0 50%;
			max-width:50%;
		}
		a{
			text-align:center;
			font-size:16px;
			text-decoration:underline;
		}
	}
	.register-form-container{
		max-width:500px;
		margin-left:auto;
		margin-right:auto;
		.description{
			font-size:$font-size;
		}
		.form-button input{
			width:100%;
			background:$gray-dark;
			line-height:45px;
			text-transform:uppercase;
			font-size:12px;
			letter-spacing:2px;
			font-weight:500;
			border:0;
			padding:0 15px;
			margin-top:30px;
			&:hover{
				background:$theme-color;
			}
		}
		.login-account a{
			display:block;
			width:100%;
			background:$white;
			border:1px solid $gray-dark;
			line-height:43px;
			text-transform:uppercase;
			font-size:12px;
			letter-spacing:2px;
			font-weight:500;
			padding:0 15px;
			text-align:center;
			margin-top:20px;
			&:hover{
				color:$white;
				background:$theme-color;
				border-color:$theme-color;
			}
		}
	}
	.page-account__content{
		display: inline-block;
		width: 100%;
		.nav-StickySidebar{
			width:25%;
			position:sticky;
			top:100px;
			@include rtl-float-left();
			ul{
				padding:0;
				list-style:none;
				background:#f5f5f5;
				margin:0;
				li{
					border-bottom:1px solid rgba($border-color,0.5);
					font-size:16px;
					a{
						padding:10px 20px;
						display:block;
					}
					&:last-child{
						border-bottom:0;
					}
					&.active{
						background:$theme-color;
						a{
							color:$white;
						}
					}
				}
			}
		}
		.account__content{
			width:75%;
			@include rtl-float-left();
			@include rtl-padding-left(30px);
			#customer_logout_link{
				color:red;
				&:hover{
					color:$theme-color;
				}
			}
			.box-account__heading{
				color:$gray-dark;
				font-size:20px;
				font-weight:$heading-font-weight-medium;
				margin-bottom:5px;
			}
			.orders__table{
				margin-top:15px;
			}
		}
	}
	.orders__empty{
		i{
			font-size:22px;
			@include rtl-margin-right(10px);
			color: #3c763d;
			position: relative;
			top: 4px;
		}
		.btn_link{
			text-decoration:underline;
			text-transform: uppercase;
			color: #3c763d;
			font-weight: $heading-font-weight-medium;
			font-size:$font-size - 1;
			&:hover{
				color:$theme-color;
			}
		}
	}
	@media screen and (max-width: 991px) {
		.login-form-container{
			margin:0 -15px;
			padding:0 15px;
			>div{
				padding:0 15px;
			}
		}
	}
	@media screen and (max-width: 767px) {
		.page-account__content{
			.nav-StickySidebar{
				width: 100%;
				margin-bottom:50px;
				position:unset;
			}
			.account__content{
				width: 100%;
				padding:0;
			}
		}
		.login-form-container{
			padding:0;
			>div{
				width:100%;
				flex:0 0 100%;
			}
			.content-register{
				margin-top:60px;
			}
		}
	}
}
.page-account__inner-addresses {
	max-width: 990px;
	margin: 0 auto;
}
.login-register {
	position: relative;
	max-width: 600px;
	margin: 0 auto;
	border: 1px solid $border-color;
	.form-button {
		.btn {
			width: 100%;
		}
	}
	.form-control{
		line-height: 50px;
		height: 50px;
		padding: 0 20px;
		border: 1px solid #e5e5e5;
	}
	.form-button{
		input{
			width: 100%;
			padding: 0 20px;
			line-height: 50px;
			letter-spacing: 2px;
			font-weight: 500;
			background: $theme-color;
			border: 0;
			&:hover{
				background: black;
				-webkit-animation-name: text-indent;
				animation-name: text-indent;
				-webkit-animation-duration: 1.5s;
				animation-duration: 1.5s;
				-webkit-animation-timing-function: ease-in-out;
				animation-timing-function: ease-in-out;
				-webkit-animation-iteration-count: 1;
				animation-iteration-count: 1;
			}
		}
	}
	.js-forget-password{
		color: $gray-dark;
		position: relative;
		display: inline-block;
		&:before{
			content: "";
			position: absolute;
			bottom: 0;
			right: 0;
			width: 100%;
			height: 1px;
			background: $gray-dark;
			transition: all .3s ease;
		}
		&:hover{
			color:$theme-color;
			&:before{
				left:0;
				width:0;
				background:$theme-color;
			}
		}
	}
}
.login-register__nav {
	border: 0;
}
.login-register__nav-item {
	width: 50%;
}
.login-register__nav-link {
	display: block;
	padding: 15px;
	color: $white;
	background-color: $gray-dark;
	font-family: $font-family-second;
	font-size: $font-size;
	font-weight: $heading-font-weight-bold;
	text-align: center;
	text-transform: uppercase;
	transition: all .3s ease;
	&.active {
		color: $gray-dark;
		background-color: $white;
		&:hover{
			color: $gray-dark;
		}
	}
	&:hover {
		color: $white;
		text-decoration: none;
	}
}
.form-link {
	margin: 20px 0 0;
	text-align: center;
	@media screen and (max-width: 767px) {
		margin: 15px 0 0;
	}
	a {
		display: inline-block;
		color: $text-color;
		transition: color .3s ease;
		&:hover {
			color: $theme-color;
		}
	}
}
.login-register__heading {
	margin: 0 0 15px;
	padding: 0;
	color: $gray-dark;
	font-family: $font-family-second;
	font-size: $font-size + 4;
	font-weight: $heading-font-weight-bold;
	text-align: center;
	text-transform: uppercase;
}
.recover-password__summary {
	position: relative;
	margin: 0 0 30px;
	padding: 0 0 20px;
	font-style: italic;
	text-align: center;
	&::after {
		content: '';
		position: absolute;
		left: 50%;
		bottom: 0;
		pointer-events: none;
		display: block;
		width: 100px;
		@include rtl-margin-left(-50px);
		border-bottom: 1px solid $gray-dark;
	}
}
.form-group--pasword {
	position: relative;
	.form-control {
		@include rtl-padding-right(55px);
		&.is-invalid {
			background-position: right 80px center;
		}
	}
}
.password-toggle {
	position: absolute;
	top: 50%;
	right: 2px;
	min-width: 35px;
	margin-top: -14px;
	padding: 5px 10px;
	color: $text-color;
	border-left: 1px solid $border-color;
	font-size: 16px;
	line-height: 1;
	text-align: center;
	&:hover {
		color: $text-color;
		text-decoration: none;
	}
	.text-hide-password {
		display: none;
	}
}
.password-toggle--show {
	.text-show-password {
		display: none;
	}
	.text-hide-password {
		display: block;
	}
}

// PAGE
.page__inner {
	padding: 0 0 80px;
	@media screen and (max-width: 767px) {
		padding: 0 0 50px;
	}
}
.page__inner--compact {
	max-width: 990px;
	margin: 0 auto;
}

// ADDRESS PAGE
.addresses {
	.modal-header {
		padding: 20px 30px;
		@media screen and (max-width: 767px) {
			padding: 20px 15px;
		}
	}
	.modal-body {
		padding: 30px;
		@media screen and (max-width: 767px) {
			padding: 15px;
		}
	}
}
.addresses__creat{
	font-size:18px;
	a{
		text-decoration:underline;
		text-transform:uppercase;
		font-size:16px;
		color:green;
		font-weight:$heading-font-weight-medium;
		&:hover{
			color:$theme-color;
		}
	}
}
.addresses__heading {
	margin: 0 0 20px;
	color: $gray-dark;
	font-family: $font-family-second;
	font-size: 30px;
	font-weight: $heading-font-weight-medium;
}
.modal-close {
	display: block;
	width: 30px;
	height: 30px;
	padding: 4px;
	color: $gray-dark;
	background-color: $nocolor;
	border: none;
	opacity: .6;
	transition: opacity .3s ease;
	svg {
		display: block;
		max-width: 100%;
		max-height: 100%;
	}
	&:hover {
		opacity: 1;
	}
}
.modal-content {
	border-radius: 0;
	.addresses__heading {
		margin: 0;
		padding: 3px 0;
	}
}
.form-label {
	color: $gray-dark;
	font-family: $font-family-second;
	font-weight: $heading-font-weight-medium;
}
.addresses__button {
	margin: 0 0 30px;
	.btn {
		display: inline-block;
	}
}
.addresses__no-address {
	margin: 0;
	padding: 15px;
	border: 1px solid $border-color;
}
.addresses__form {
	.form-button {
		padding: 30px 0 0;
	}
}
.addresses__grid {
	display: flex;
	flex-flow: row wrap;
	margin-left: -15px;
	margin-right: -15px;
	@media screen and (max-width: 767px) {
		margin-left: -8px;
		margin-right: -8px;
	}
}
.addresses__item {
	width: 50%;
	max-width: 50%;
	padding: 15px;
	@media screen and (max-width: 767px) {
		width: 100%;
		max-width: 100%;
		padding: 8px;
	}
}
.address-card {
	position: relative;
	padding: 30px;
	border: 1px solid $border-color;
	height:100%;
	@media  screen and (max-width: 767px) {
		padding: 20px;
	}
	.address-card__update{
		a{
			display:inline-block;
			@include rtl-margin-right(10px);
			border:1px solid green;
			text-transform:uppercase;
			font-weight:$heading-font-weight-medium;
			letter-spacing:1px;
			color:green;
			font-size:$font-size - 2;
			padding:5px 20px;
			&:hover{
				background:green;
				color:$white;
			}
		}
		.address-delete{
			display:inline-block;
			border:1px solid red;
			text-transform:uppercase;
			font-weight:$heading-font-weight-medium;
			letter-spacing:1px;
			color:red;
			font-size:$font-size - 2;
			padding:5px 20px;
			background:$white;
			&:hover{
				background:red;
				color:$white;
			}
		}
	}
}
.address-default {
	position: absolute;
	top: 0;
	right: 0;
	padding: 2px 15px;
	color: $white;
	background-color: #007fd5;
	font-family: $font-family-second;
	font-size: $font-size - 3;
	font-weight: $heading-font-weight-medium;
	line-height: 20px;
	text-transform: uppercase;
}
.address-card__update {
	margin: 0;
	a {
		display: inline-block;
		color: $text-color;
		transition: color .35s ease;
		&:hover {
			color: $theme-color;
		}
	}
}
.return-account {
	padding: 30px;
	text-align: center;
}
.return-account__link {
	color: $text-color;
	font-weight: $body-font-weight-bold;
	text-transform: uppercase;
	transition: color .3s ease;
	.fa {
		@include rtl-margin-right(4px);
	}
	&:hover {
		color: $theme-color;
		text-decoration: none;
	}
}
.orders__table {
	.table {
		margin: 0;
	}
	thead {
		th {
			color: $gray-dark;
			font-family: $font-family-second;
			font-weight: $heading-font-weight-medium;
			text-transform: uppercase;
		}
	}
}
// ORDER DETAILS
.order__title {
  margin: 0 0 15px;
  padding: 0;
  color: $gray-dark;
  font-family: $font-family-second;
  font-size: $font-size + 6;
  font-weight: $heading-font-weight-medium;
  text-transform: uppercase;
}

.order__date {
  margin: 0 0 30px;
  font-style: italic;
}

.order__table {
  padding: 15px;
  background-color: lighten($border-color, 5%);

  td,
  th {
    padding: 8px 12px;
    border: none;
  }

  .table {
    color: $gray-dark;
  }

  thead {
    th {
      border-top: 0;
      border-bottom: 1px solid $border-color;
    }
  }

  .cart__price {
    font-size: $font-size + 1;
    font-weight: normal;
  }

  .cart__price--regular {
    display: block;
    @include rtl-margin-right(0px);
    font-size: $font-size - 1;
  }

  tbody {
    @media screen and (min-width: 768px) {
      tr {
        &:first-child {
          td {
            padding-top: 24px;
          }
        }

        &:last-child {
          td {
            padding-bottom: 24px;
          }
        }
      }
    }
  }

  tfoot {
    th,
    td {
      padding: 8px 12px;
      border-top: none;
      font-weight: normal;

      &.order-product__label--total,
      &.order-product__value--total {
        padding-top: 24px;
        font-weight: $heading-font-weight-bold;
      }
    }

    tr {
      &:first-child {
        th,
        td {
          padding-top: 25px;
        }
      }

      &:nth-last-child(2) {
        th,
        td {
          padding-bottom: 25px;
        }
      }
    }
  }

  .border-top {
    border-top: 1px solid $border-color;
  }
}

.order__table--quantity {
  @media screen and (min-width: 768px) {
    text-align: center;
  }
}

.order-product__title {
  > a {
    display: inline-block;
    margin: 0 0 5px;
    padding: 2px 0;
    color: $gray-dark;
    font-family: $font-family-second;
    font-size: $font-size;
    font-weight: $heading-font-weight-medium;
    transition: color .3s ease;

    &:hover {
      color: $theme-color;
      text-decoration: none;
    }
  }
}

.order-product__note {
  margin: 20px 0 15px;
  padding: 10px 15px;
  border: 1px solid $border-color;
  font-size: $font-size - 1;
  font-style: italic;

  a {
    transition: color .3s ease;

    &:hover {
      color: $theme-color;
    }
  }
}

.order-product__value {
  font-family: $font-family-second;
  @include rtl-text-align-right();
}

.box-account--order {
  height: auto;
  background-color: lighten($border-color, 5%);
  border: none;

  .box-account__heading {
    font-size: $font-size;
    font-weight: $heading-font-weight-medium;
  }

  ~ .box-account--order {
    margin-top: $gutter-width;
  }

  .address-detail {
    p {
      margin: 0;
    }
  }
}

.order-product__status {
  margin: 0 0 5px;

  strong {
    color: $gray-dark;
  }
}

.order__cancelled {
  margin: 0 0 30px;
  padding: 15px 20px;
  color: $error;
  border: 1px solid $error;
  background-color: rgba($error, .1);

  p {
    margin: 0;
  }

  .h5 {
    color: $gray-dark;
    font-size: $font-size + 1;
    font-weight: $heading-font-weight-medium;
  }
}

.activate-account {
  max-width: 480px;
  margin: 0 auto;
  text-align: center;
}

.activate-account__form {
  .form-button {
    .btn {
      width: 100%;
    }
  }
}

// SEARCH PAGE
.page-search{
	.article__image{
		max-width: 25%;
		float: left;
		@include rtl-margin(0 ,30px ,0 ,0);
	}
	.article__heading{
		font-size: 30px;
		line-height: 1.3;
		width: 100%;
		margin: -5px 0 5px;
	}
	.article__content{
		overflow: hidden;
	}
	.article__meta{
		>*{
			@include rtl-margin-right(10px);
			&:last-child{
				@include rtl-margin-right(0);
			}
		}
	}
	@media (max-width:767px){
		.article__image{
			max-width: 100%;
			float: unset;
			margin:0 0 30px 0;
		}
	}
}

// COOKIE CONSENT
.cookie-consent {
	position: fixed;
	left: 0;
	bottom: 0;
	z-index: 100;
	display: block;
	padding:10px 15px;
	opacity: 0;
	visibility: hidden;
	transition: opacity .3s ease;
	width: 100%;
    text-align: left;
	background:$white;
	box-shadow:0 -5px 35px 5px #00000024;
	&.active {
		opacity: 1;
		visibility: visible;
	}
}
.cookie-consent__wrapper {
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	justify-content: space-between;
}
.cookie-consent__message {
	margin: 5px 0;
	a {
		color: inherit;
		display: inline-block;
		border-bottom:1px solid $gray-dark;
		color:$gray-dark;
		line-height: 1.3;
		&:hover{
			color:$theme-color;
			border-color:$theme-color;
		}
	}
	p {
		margin: 0;
	}
}
.cookie-consent__dismiss {
	display:flex;
	margin: 5px 0;
	justify-content:flex-end;
	font-weight:500;
	letter-spacing:2px;
	align-items: center;
	.btn-agree {
		color: $white;
		padding:0;
		border:0;
		font-weight:500;
		text-transform:revert;
		@include rtl-margin-left(10px);
		position: relative;
		background:$gray-dark;
		padding:0 40px;
		line-height:40px;
		font-size:$font-size;
		&:first-child{
			@include rtl-margin-left(0);
		}
		&:hover{
			background: $theme-color;
		}
	}
	.btn-dismiss{
		background:transparent;
		color:$gray-dark;
		text-transform:revert;
		font-size:$font-size;
		padding:0;
		border-bottom:1px solid $gray-dark;
		&:hover{
			color:$theme-color;
			border-bottom:1px solid $theme-color;
		}
	}
}

// SCROLL TO TOP
.scroll-to-top {
	width: 46px;
    height: 46px;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    text-align: center;
    position: fixed;
    bottom: 70px;
    right: 30px;
    z-index: 9;
    filter: alpha(opacity=0);
    cursor: pointer;
	&:after{
		position: absolute;
		font-family: feather;
		content: "\e914";
		text-align: center;
		line-height: 38px;
		font-size: 20px;
		color: $gray-dark;
		left: 0;
		top: 0;
		width: 46px;
		height: 46px;
		cursor: pointer;
		display: block;
		z-index: -1;
		 border-radius: 50%;
		-webkit-border-radius: 50%;
		-moz-border-radius: 50%;
		-ms-border-radius: 50%;
		-o-border-radius: 50%;
		background:$white;
		border:4px solid #f5f5f5;
	}
	path{
		stroke: #000;
		stroke-width: 4;
		box-sizing: border-box;
		fill: none;
	}
	&:hover{
		&:after{
			background: $theme-color;
			color:$white;
		}
	}
}

.table--responsive {
  @media screen and (max-width: 767px) {
    thead {
      display: none;
    }

    tfoot {
      th {
        display: none;
      }
    }

    tr {
      display: block;
    }

    td,
    th {
      display: block;
    }

    td {
      @include rtl-text-align-right();

      &::before {
        content: attr(data-label);
        float: left;
        padding: 3px 0 0;
        color: $gray-dark;
        font-family: $font-family-second;
        font-size: $font-size - 1;
        font-weight: $heading-font-weight-medium;
        text-transform: uppercase;
        line-height: 18px;
      }
    }

    .orders__table-section {
      margin: 0 0 30px;
      border-bottom: 2px solid $text-color;

      &:last-child {
        margin-bottom: 0;
      }
    }

    .orders__table-product {
      text-align: center;

      &::before {
        width: 100%;
        text-align: center;
      }
    }
  }
}

.product-quantity__input {
  display: block;
  width: 100%;
  height: 42px;
  padding: 8px 15px;
  color: $gray-dark;
  background-color: lighten($border-color, 4%);
  border: 1px solid lighten($border-color, 4%);
  border-radius: 0;
  outline: 0;
  font-family: $font-family-second;
  font-size: $font-size;
  font-weight: $heading-font-weight-medium;
  opacity: .9;

  &:focus {
    outline: 1px solid $theme-color;
    border-color: $theme-color;
  }
}

// NEWSLETTER POPUP
.newsletter-popup{
	opacity:0;
	visibility:hidden;
	pointer-events:none;
	&.show{
		opacity:1;
		visibility:visible;
		pointer-events:revert;
		transition:0.3s ease;
	}
	&.newsletter-popup--active{
		pointer-events:revert;
		.newsletter-popup__inner{
			padding-left: var(--width-image);
			width: 720px;
		}
		.newsletter-popup__content{
			width: calc(720px - var(--width-image));
		}
	}
	.newsletter-popup__overlay{
		background-color: rgba(32,32,32,.6);
		height: 100%;
		left: 0;
		position: fixed;
		top: 0;
		width: 100%;
		z-index: 99999;
	}
	.newsletter-popup__inner{
		border-radius: 8px;
		transition: padding 1s ease,width 1s ease;
		box-sizing: border-box;
		height: auto;
		left: 50%;
		-webkit-transform: translate(-50%,-50%);
		transform: translate(-50%,-50%);
		margin: auto;
		position: fixed;
		top: 50%;
		z-index: 99999;
		display: none;
		overflow: hidden;
		display:flex;
		width: var(--width-image);
	}
	.image{
		width: var(--width-image);
		position: absolute;
		left: 0;
	}
	.newsletter-popup__content{
		margin: 0;
		background: #fff;
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 0 15px;
		min-height: var(--height-image);
		width: var(--width-image);
		z-index:3;
	}
	.newsletter-popup__close{
		cursor: pointer;
		position: absolute;
		top: 10px;
		right: 15px;
		text-align: center;
		z-index: 4;
		display: inline-block;
		width: 28px;
		height: 28px;
		padding: 6px;
		border-radius: 100%;
		-webkit-border-radius: 100%;
		-moz-border-radius: 100%;
		-ms-border-radius: 100%;
		-o-border-radius: 100%;
		box-shadow: 0 2px 59px #0006;
		&:before,&:after{
			content: "";
			position: absolute;
			height: 1px;
			width: 14px;
			top: 50%;
			left: calc(50% - 7px);
			margin-top: -1px;
			background-color: $gray-dark;
			-webkit-transition: all .3s ease;
			transition: all .3s ease;
		}
		&:before{
			transform-origin: 50% 50%;
			-webkit-transform: rotate(-45deg);
			transform: rotate(-45deg);
		}
		&:after{
			transform-origin: 50% 50%;
			-webkit-transform: rotate(45deg);
			transform: rotate(45deg);
		}
		&:hover{
			&:before,&:after{
				-webkit-transform: rotate(0deg);
				transform: rotate(0deg);
			}
		}
	}
	.title-newsletter{
		font-size: 25px;
		font-weight: 400;
		margin: auto;
		position: relative;
		margin-bottom: 20px;
		color:$gray-dark;
		line-height: 30px;
	}
	.text-newsletter{
		margin-bottom: 15px;
	}
	.newsletter-form__input{
		border: 0;
		border-bottom: 2px solid $gray-dark;
		padding: 0;
		font-size: 13px;
		background: transparent;
		line-height: 35px;
		height: 35px;
		width: 100%;
		color:$gray-dark;
		&::placeholder{
			color:$text-color;
		}
	}
	.newsletter-form__wrap{
		width: 100%;
		margin: 0;
		display: flex;
		background: $white;
	}
	.newsletter-form__submit{
		border: 0;
		padding: 0 10px;
		background: transparent;
		line-height: 35px;
		height: 35px;
		font-size: 20px;
		color: $gray-dark;
		cursor: pointer;
		border-bottom: 2px solid $gray-dark;
		@include rtl-margin-left(10px);
		&:hover{
			color:$theme-color;
			border-color:$theme-color;
		}
	}
	.newsletter-popup__content-inner{
		width:100%;
		padding:25px 10px;
		text-align:center;
	}
	@media (max-width:991px){
		.image{
			display:none;
		}
		&.newsletter-popup--active {
			.newsletter-popup__inner{
				width:calc(100% - 30px);
				max-width: 400px;
				padding: 0;
			}
			.newsletter-popup__content{
				width:100%;
				min-height: auto;
				padding-top: 30px;
				padding-bottom: 50px;
			}
		}
		.newsletter-popup__inner{
			width:calc(100% - 30px);
			max-width: 400px;
			padding: 0;
		}
		.newsletter-popup__content{
			width:100%;
			min-height: auto;
			padding-top: 30px;
			padding-bottom: 50px;
		}
		.title-newsletter{
			font-size:25px;
		}
	}
}
.newsletter-popup__close {
	position: absolute;
	top: 2px;
	right: 2px;
	display: block;
	padding: 5px;
	color: $gray-dark;
	border: none;
	background-color: $nocolor;
	svg {
		display: block;
		width: 20px;
		height: 20px;
	}
	&:hover,
	&:focus {
		border: none;
		outline: 0;
	}
}

//////////////// sale nofication
.sale-nofication{
	opacity:0;
	visibility:hidden;
	transition:all 0.5s ease;
	position:fixed;
	bottom:50px;
	@include rtl-left(30px);
	width:355px;
	z-index:9;
	&.slide_inup{
		@include transform(translateY(100%));
	}
	&.left_to_right{
		@include transform(translateX(-100%));
	}
	&.popup{
		@include transform(scale(0.7));
	}
	&.active{
		opacity:1;
		visibility:visible;
		&.slide_inup{
			@include transform(translateY(0));
		}
		&.left_to_right{
			@include transform(translateX(0));
		}
		&.popup{
			@include transform(scale(1));
		}
		.scroll-notification{
			animation-name: notification-progressbar;
			animation-fill-mode: forwards;
			animation-iteration-count: infinite;
			animation-timing-function: linear;
			opacity:1;
		}
	}
	.notification-container{
		display:flex;
		background:$white;
		width:100%;
		padding:10px 10px 13px;
		box-shadow:0 1px 8px 5px rgba(0, 0, 0, 0.1);
		align-items:center;
	}
	.notification-image{
		flex:0 0 80px;
		max-width:80px;
	}
	.notification-content{
		@include rtl-padding(0 ,40px ,0 ,20px);
		flex:1;
	}
	.notification-purchased{
		font-size: 12px;
		margin-bottom: 2px;
		span{
			color:$gray-dark;
		}
	}
	.product-title{
		font-weight: 500;
		margin-bottom: 6px;
	}
	.suggest{
		display:flex;
		justify-content:space-between;
		color:$gray-dark;
		font-size:13px;
	}
	.verified{
		color: green;
		&:before{
			content:"\e92c";
			display:inline-block;
			font-size:15px;
			margin-right:5px;
			font-family:feather;
			top:1px;
			line-height:1;
		}
	}
	.close-notification{
		position:absolute;
		top:0;
		right:0;
		font-size:18px;
		color:$gray-dark;
		cursor:pointer;
		padding: 3px;
		line-height: 1;
		&:hover{
			color:$theme-color;
		}
	}
	.scroll-notification{
		position:absolute;
		bottom:0;
		left:0;
		height:3px;
		background:$theme-color;
		width:100%;
		opacity:0;
	}
	@media (max-width:767px){
		display:none !important;
	}
}

//////////////// compare table
.compare__table{
	@media (max-width:991px){
		display:none;
	}
	&:not(.loaded){
		.content-compare.active{
			opacity:0;
			visibility:hidden;
			@include transform(scale(0));
			transition-delay:1s;
		}
		.show-compare{
			display:none;
		}
	}
	.show-compare{
		position:fixed;
		left:0;
		top:50%;
		@include transform(translateY(-50%));
		background:$gray-dark;
		color:$white;
		padding: 15px 5px;
		writing-mode: tb;
		cursor:pointer;
		border-radius: 0px 6px 6px 0px;
		z-index:9;
		.count{
			position:relative;
			width:20px;
			height:20px;
			background:#f5f5f5;
			color:$gray-dark;
			display: inline-block;
			text-align: center;
			line-height: 20px;
			border-radius: 50%;
			font-size: 12px;
			margin-top: 5px;
		}
	}
	.content-compare{
		position:fixed;
		top:0;
		left:0;
		width:100%;
		height:100%;
		background:rgba($gray-dark,0.75);
		padding:40px;
		opacity:0;
		visibility:hidden;
		@include transform(scale(0));
		transition:all 0.3s ease;
		z-index:99;
		display:flex;
		align-items:center;
		&.active{
			opacity:1;
			visibility:visible;
			@include transform(scale(1));
		}
		.hide-compare{
			line-height: 30px;
			position: absolute;
			top: 20px;
			right: 20px;
			width: 30px;
			height: 30px;
			z-index: 9999;
			text-align: center;
			font-size: 25px;
			cursor:pointer;
			display:inline-block;
			border: 7px solid transparent;
			background: $white;
			border-radius:50%;
			box-shadow: 0px 2px 59px 0px rgba($gray-dark, 0.4);
			&:before,&:after{
				content: "";
				position: absolute;
				height: 1px;
				width: 100%;
				top: 50%;
				left: 0;
				margin-top: -1px;
				background-color: rgba(0,0,0,.5);
				-webkit-transition: all .3s ease;
				transition: all .3s ease;
			}
			&:before{
				transform-origin: 50% 50%;
				-webkit-transform: rotate(-45deg);
				transform: rotate(-45deg);
			}
			&:after{
				transform-origin: 50% 50%;
				-webkit-transform: rotate(45deg);
				transform: rotate(45deg);
			}
			&:hover{
				&:before,&:after{
					-webkit-transform: rotate(0deg);
					transform: rotate(0deg);
				}
			}
		}
	}
	.content{
		position:relative;
		margin-bottom:0;
		width:100%;
		overflow: auto;
		max-height: 100%;
		display:flex;
		background:$white;
		&.load-compare{
			&:before{
				position: absolute;
				display: inline-block;
				content: "";
				border: 2px solid rgba($gray-dark,.5);
				border-top-color: $gray-dark;
				width: 40px;
				height: 40px;
				background: none;
				animation: 2s linear 0s normal none infinite running spin-load;
				text-indent: 0;
				top: calc(50% - 20px);
				left:calc(50% - 20px);
				border-radius: 50%;
				z-index:10;
			}
			&:after{
				content:"";
				position:absolute;
				left:0;
				top:0;
				background:rgba($white,0.75);
				height:100%;
				width:100%;
				z-index:9;
			}
		}
	}
	.table{
		width:100%;
		margin:0;
		background:$white;
		position:relative;
		overflow:auto;
	}
	li.label{
		background:#f5f5f5;
		@include rtl-text-align-left();
		font-size:16px;
		color:$gray-dark;
		font-weight:500;
	}
	li{
		padding:20px;
		border-right: 1px solid #e5e5e5;
		border-bottom: 1px solid #e5e5e5;
		width:20%;
		max-width:25%;
		min-width: 14.29%;
		@media (max-width:1199px){
			min-width:25%;
		}
	}
	ul{
		width:100%;
		margin:0;
		padding:0;
		list-style:none;
		display:flex;
		&.compare-name li{
			border-bottom:0;
			padding:20px 20px 0;
		}
		&.compare-image{
			border-top:0;
		}
	}
	.remove-compare button{
		display:inline-block;
		line-height:28px;
		padding: 0;
		background: transparent;
		border:0;
		color:$text-color;
		&:before{
			content:"\ea02";
			font-family:feather;
			font-size:16px;
			display:inline-block;
			transition: all 0.3s ease;
			line-height: 1;
			position: relative;
			top: 1px;
		}
		&:hover{
			color:$theme-color;
			&:before{
				@include transform(rotate(-90deg));
			}
		}
	}
	.product-card__content{
		margin:0;
		.wpb-variants-swatch {
			margin:0;
			.swatch-content{
				margin-bottom:10px;
				&:last-child{
					margin-bottom:0;
				}
			}
			.swatch-items label{
				width:25px;
				height:25px;
			}
		}
	}
	.product-price{
		font-size:20px;
	}
	.product-card__form{
		.btn--add-to-cart,.btn-link{
			width:100%;
			background:$gray-dark;
			line-height:45px;
			font-size: $font-size-base;
			text-transform:uppercase;
			padding:0 15px;
			font-size:12px;
			font-weight:500;
			letter-spacing:2px;
			color:$white;
			text-decoration:none;
			&:hover{
				background:$theme-color;
				-webkit-animation-name: text-indent;
				animation-name: text-indent;
				-webkit-animation-duration: 1.5s;
				animation-duration: 1.5s;
				-webkit-animation-timing-function: ease-in-out;
				animation-timing-function: ease-in-out;
				-webkit-animation-iteration-count: 1;
				animation-iteration-count: 1;
			}
		}
	}
	.inventory-content{
		>#variant-inventory{
			position:relative;
			@include rtl-padding-left(20px);
			color:$gray-dark;
			display: inline-block;
			color: #108043;
			&:before{
				content: "\e919";
				width: 14px;
				height:14px;
				background: $white;
				display: inline-block;
				border-radius:50%;
				@include rtl-left(0);
				position:absolute;
				top:calc(50% - 9px);
				font-family: bwpfont;
				line-height:1;
				z-index:2;
			}
			&:after{
				position:absolute;
				content: "";
				width: 14px;
				height:14px;
				background: #108043;
				display: inline-block;
				border-radius:50%;
				opacity:0.25;
				top:calc(50% - 9px);
				@include rtl-left(0);
				@include transform(scale(1));
				-webkit-animation-name: scale;
				animation-name: scale;
				-webkit-animation-duration: 2s;
				animation-duration: 2s;
				-webkit-animation-timing-function: linear;
				animation-timing-function: linear;
				-webkit-animation-iteration-count: infinite;
				animation-iteration-count: infinite;
			}
			&.out_stock{
				color:red;
				&:after{
					background:red;
				}
			}
		}
	}
}

// 404 PAGE
.page-not-found{
	padding: 100px 0 60px;
	text-align:center;
	.page-not-found__heading{
		font-size: 300px;
		line-height: 1;
		font-family: $font-family-second;
		color: $gray-dark;
	}
	.page-not-found__title{
		font-size: 50px;
		color: $gray-dark;
		font-weight: 500;
		margin-bottom: 25px;
		font-family: $font-family-second;
		position: relative;
		padding-bottom: 25px;
		&:before{
			position: absolute;
			content: "";
			width: 140px;
			height: 2px;
			bottom: 0;
			left: calc(50% - 70px);
			background: #e1e1e1;
		}
	}
	.page-not-found__summary{
		max-width: 325px;
		margin: auto;
	}
	.btn-not-found{
		margin-top: 30px;
		padding: 0 40px;
		height: 50px;
		line-height: 46px;
		font-weight: 400;
		font-size: 18px;
		color: $white;
		font-size: $font-size-base;
		background: $gray-dark;
		border-radius: 0;
		-webkit-border-radius: 0;
		-moz-border-radius: 0;
		-ms-border-radius: 0;
		-o-border-radius: 0;
		position: relative;
		z-index: 1;
		border: 2px solid $gray-dark;
		text-transform: uppercase;
		letter-spacing: .1em;
		display:inline-block;
		&:after{
			font-family:feather;
			content:"\e912";
			display:inline-block;
			font-size: 20px;
			line-height: 1;
			position: relative;
			top: 3px;
			@include rtl-margin-left(5px);
		}
		&:hover{
			background:$white;
			color:$gray-dark;
		}
	}
	@media (max-width:767px){
		.page-not-found__heading{
			font-size:150px;
		}
		.page-not-found__title{
			font-size:25px;
		}
	}
}

// QUICKVIEW
.quickview {
	position: fixed;
	display: none;
	align-items: center;
	justify-content: center;
	opacity: 0;
	visibility: hidden;
	top: 0;
    left: 0;
    width: 100%;
    height: 100%;
	z-index:100;
	padding:20px;
	&.show {
		display: flex;
		opacity: 1;
		visibility: visible;
	}
	&.show-content{
		.quickview__overlay{
			opacity: 1;
			visibility: visible;
		}
		.quickview__content {
			opacity: 1;
			visibility: visible;
		}
	}
	&.transition {
		.quickview__content {
			max-width:900px;
			.product-quickview{
				.bwp-single-info{
					opacity: 1;
					visibility: visible;
					z-index: unset;
					height: 100%;
					overflow: auto;
					width: 100%;
					padding-left: 400px;
					@include rtl-padding(50px ,30px ,50px ,480px);
					.product-review{
						-webkit-animation: translate-popup .5s;
						animation: translate-popup .5s;
					}
					.product-quickview_title{
						-webkit-animation: translate-popup .8s;
						animation: translate-popup .8s;
					}
					.product__vendor{
						-webkit-animation: translate-popup 1s;
						animation: translate-popup 1s;
					}
					.product-quickview__price{
						-webkit-animation: translate-popup 1.2s;
						animation: translate-popup 1.2s;
					}
				}
			}
		}
	}
	.quickview__overlay{
		position:fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background:rgba($gray-dark,0.5);
		opacity: 0;
		visibility: hidden;
		transition:all 0.3s ease;
	}
	@media (max-width:991px){
		&.transition .quickview__content{
			max-width: 700px;
			.product-quickview .bwp-single-info{
				padding: 50px 30px 50px 350px;
			}
		}
	}
	@media (max-width:767px){
		padding:0;
		justify-content: flex-end;
		[data-quickview-container]{
			height: 100%;
		}
		.quickview__content{
			height: 100%;
		}
		&.transition .quickview__content{
			max-width: 400px;
			width: calc(100% - 30px);
			.product-quickview .bwp-single-info{
				padding: 0 12px;
				position: relative;
			}
		}
		&.show-content .quickview__content{
			@include transform(translateX(0));
		}
	}
}
.quickview__content {
	position: relative;
	z-index: 1;
	width: 100%;
	max-width:450px;
	overflow: hidden;
	background-color: $white;
	transition: all .3s ease;
	opacity: 0;
	visibility: hidden;
	.product-quickview{
		>.row{
			align-items:center;
			margin:0;
		}
		.img-quickview{
			position:relative;
			z-index:3;
			width: 100%;
			max-width: 450px;
			.quickview-images__list:not(.slick-initialized){
				display:block;
				.slick-carousel__item{
					display:none;
					&:first-child{
						display:block;
					}
				}
			}
			.slick-list{
				margin:0;
			}
			.slick-carousel__item{
				padding:0;
			}
			img{
				margin:auto;
				@media (max-width: 768px) {
					aspect-ratio: 1;
					object-fit: contain;
					background: #f5f5f5;
				}
			}
			.slick-arrow{
				background:$white;
				font-size:0;
				color:$gray-dark;
				opacity:1;
				visibility:visible;
				height:30px;
				width:20px;
				padding:0;
				line-height:30px;
				text-align:center;
				top:calc(50% - 15px);
				font-family: FontAwesome;
				&:before{
					font-size:16px;
				}
				&.slick-prev{
					left:0;
					&:before{
						content:"\f104";
					}
				}
				&.slick-next{
					right:0;
					&:before{
						content:"\f105";
					}
				}
				&.slick-disabled{
					display:none !important;
				}
				&:hover{
					background:$theme-color;
					&:before{
						color: $white;
					}
				}
			}
		}
		.bwp-single-info{
			position: absolute;
			z-index: -1;
			opacity: 0;
			visibility: hidden;
			-webkit-transition: opacity .3s,visibility 0s;
			transition: opacity .3s,visibility 0s;
			display: flex;
			flex-direction: column;
			justify-content: center;
			.content_product_detail{
				max-height: 400px;
				height:100%;
				padding:0 8px;
				overflow: auto;
				&::-webkit-scrollbar-track
				{
					background-color: #F5F5F5;
				}
				&::-webkit-scrollbar
				{
					width: 2px;
					background-color: #F5F5F5;
				}

				&::-webkit-scrollbar-thumb
				{
					background-color: $gray-dark;
				}
			}
			.product-avaiable.product-avaiable--active .product-avaiable__text:after{
				@include rtl-left(0);
			}
			.product__vendor{
				display:flex;
				align-items:center;
				margin-bottom:20px;
				.product__organization__label{
					color:$gray-dark;
					@include rtl-margin-right(5px);
				}
				.product__organization__text{
					text-decoration:underline;
					text-transform:capitalize;
					a{
						color:$theme-color;
					}
				}
			}
			.product-quickview_title{
				margin-top: 10px;
				margin-bottom: 18px;
				font-size: 30px;
				line-height: 35px;
				color: $gray-dark;
				word-break: break-word;
				display: block;
				font-weight:300;
			}
			.product-quickview__price{
				.price-container{
					color:$gray-dark;
					font-size:22px;
					width: 100%;
					margin-bottom: 30px;
					padding-bottom: 30px;
					border-bottom: 1px solid #e5e5e5;
					line-height: 100%;
					display: flex;
					align-items:flex-end;
					.product-single__unit{
						display:none;
					}
					.product-single__price--wrapper{
						font-size: 18px;
						color: #9b9b9b;
						text-decoration: line-through;
						@include rtl-margin-right(5px);
						line-height:1;
					}
					.product-single__price--compare-at{
						font-size: 15px;
						color: #9b9b9b;
						text-decoration: line-through;
						@include rtl-margin-right(5px);
						line-height:1;
					}
				}
				.product-quickview__description{
					margin-bottom:15px;
				}
				.group-quickview{
					.view-gruop-product-btn{
						width:100%;
						-webkit-transition: none;
						transition: none;
						font-size: 12px;
						text-transform: uppercase;
						line-height: 50px;
						position: relative;
						background: $gray-dark;
						color: $white;
						text-align: center;
						padding: 0 15px;
						cursor: pointer;
						display: inline-block;
						vertical-align: top;
						flex: 1;
						margin: 0;
						white-space: nowrap;
						border: 0;
						font-weight:500;
						letter-spacing:2px;
						&:hover{
							background:$theme-color;
							span{
								display:inline-block;
								-webkit-animation-name: text-transform;
								animation-name: text-transform;
								-webkit-animation-duration: 1.5s;
								animation-duration: 1.5s;
								-webkit-animation-timing-function: ease-in-out;
								animation-timing-function: ease-in-out;
								-webkit-animation-iteration-count: 1;
								animation-iteration-count: 1;
							}
						}
					}
					.product-group__add-to-cart{
						display:flex;
						.add-group-to-cart{
							-webkit-transition: none;
							transition: none;
							font-size: 12px;
							text-transform: uppercase;
							line-height: 50px;
							position: relative;
							background: $gray-dark;
							color: $white;
							text-align: center;
							padding: 0 15px;
							cursor: pointer;
							display: inline-block;
							vertical-align: top;
							flex: 1;
							margin: 0;
							white-space: nowrap;
							border: 0;
							font-weight:500;
							letter-spacing:2px;
							&:hover{
								background:$theme-color;
								span{
									display:inline-block;
									-webkit-animation-name: text-transform;
									animation-name: text-transform;
									-webkit-animation-duration: 1.5s;
									animation-duration: 1.5s;
									-webkit-animation-timing-function: ease-in-out;
									animation-timing-function: ease-in-out;
									-webkit-animation-iteration-count: 1;
									animation-iteration-count: 1;
								}
							}
							&.active{
								span{
									-webkit-animation-name: none !important;
									animation-name: none !important;
								}
								&:before{
									position: relative;
									display: inline-block;
									content: "";
									border: 2px solid rgba($white,.25);
									border-top-color: $white;
									width: 18px;
									height: 18px;
									background: none;
									-webkit-animation: 2s linear 0s normal none infinite running spin-load;
									animation: 2s linear 0s normal none infinite running spin-load;
									text-indent: 0;
									top: 4px;
									border-radius: 50%;
									-webkit-border-radius: 50%;
									-moz-border-radius: 50%;
									-ms-border-radius: 50%;
									-o-border-radius: 50%;
									left:-10px;
								}
							}
							&.added{
								span{
									-webkit-animation-name: none !important;
									animation-name: none !important;
								}
								&:before{
									content:"\e92b";
									font-family:feather;
									display:inline-block;
									font-size:20px;
									color:$white;
									left: -10px;
									top: 3px;
									line-height: 1;
									position: relative;
								}
							}
						}
					}
					.group_table{
						border: 1px solid $border-color;
						margin-bottom: 30px;
						width: 100%;
						.item-product-group{
							display: flex;
							padding: 12px 15px;
							border-bottom: 1px solid $border-color;
							justify-content: space-between;
							align-items: center;
							flex-wrap: wrap;
							&:last-child{
								border-bottom:0;
							}
							.product-content{
								display: flex;
								align-items: center;
								flex: 1;
								@media (max-width:991px) and (min-width:767px){
									flex: 0 0 100%;
									margin-bottom:10px;
								}
								@media (max-width:400px){
									flex: 0 0 100%;
									margin-bottom:10px;
								}
							}
							.product-thumb{
								flex: 0 0 60px;
								@include rtl-margin-right(10px);
							}
							.product-title{
								font-size: $font-size-base;
								font-weight: 400;
								margin: 0 0 2px;
								-webkit-line-clamp: 2;
								-webkit-box-orient: vertical;
								overflow: hidden;
								max-width: 250px;
								font-family:$font-family-base;
								display: -webkit-box;
								a{
									color:$text-color;
									&:hover{
										color:$theme-color;
									}
								}
							}
							select{
								height:30px;
								border-color:$border-color;
								color:$gray-dark;
								font-size:12px;
							}
							.product-price{
								color:$gray-dark;
							}
							.quantity-content{
								margin: 0;
								border: 1px solid #e5e5e5;
								height: 33px;
								display: inline-block;
								position: relative;
								width: 110px;
								display: flex;
								button{
									background: transparent;
									line-height: 15px;
									border: none;
									width: 35px;
									height: 30px;
									border:0;
									color:$text-color;
								}
								input{
									width:100%;
									border:0;
									text-align:center;
								}
							}
						}
					}
				}
			}
			.countdown-quickview{
				margin-bottom: 30px;
				font-size: 18px;
				color: #f11e1e;
				display:flex;
				flex-wrap:wrap;
				align-items: center;
				@include rtl-padding(12px ,15px ,12px ,60px);
				font-weight: 400;
				position: relative;
				line-height:26px;
				box-shadow: 0px 3px 117px 0px rgba(0, 0, 0, 0.1);
				&.hidden{
					display:none;
				}
				.icon{
					font-size:18px;
					position:absolute;
					height:100%;
					width:50px;
					height:100%;
					left: 0;
					top: 0;
					display: inline-flex;
					align-items: center;
					justify-content: center;
					background:#f11e1e;
					color:$white;
					svg{
						height:30px;
						animation:hourglass 1s linear infinite;
						.outer{
							fill:$white;
						}
						.middle{
							fill:#f11e1e;
						}
					}
				}
				.countdown{
					padding:0;
					justify-content:flex-start;
					>div{
						&:before{
							content:":";
							display:inline-block;
							margin:0 5px;
						}
						&:first-child{
							&:before{
								display:none;
							}
						}
					}
				}
			}
			.variants__label{
				font-size:16px;
				font-family:$font-family-second;
				color:$gray-dark;
			}
			.variants__options{
				display: flex;
				flex-wrap: wrap;
				width:100%;
				.js-quickview-option-selector{
					width:100%;
					line-height:40px;
					border: 0;
					height: 40px;
					padding: 0 15px;
					font-size:15px;
					width:100%;
					border:1px solid #e5e5e5;
					color:$text-color;
					-webkit-appearance: none;
					-moz-appearance: none;
					background-image: linear-gradient(45deg,transparent 50%,gray 50%),linear-gradient(135deg,gray 50%,transparent 50%),linear-gradient(to right,#cccccc,#cccccc);
					background-position: calc(100% - 20px) calc(1em + 2px),calc(100% - 15px) calc(1em + 2px),calc(100% - 2.5em) 0.5em;
					background-size: 5px 5px,5px 5px,1px 0em;
					background-repeat: no-repeat;
					&:focus-visible {
						outline: unset;
					}
					option{
						line-height:30px;
						font-size: $font-size-base;
					}
				}
			}
			.single-option-selector {
				position: relative;
				@include rtl-margin(0 ,10px ,10px ,0);
				input {
					clip: rect(0, 0, 0, 0);
					overflow: hidden;
					position: absolute;
					width: 1px;
					height: 1px;
				}
				label {
					cursor: pointer;
					position: relative;
					display: inline-block;
					margin: 0;
					background-color: $white;
					border: 1px solid #ccc;
					font-size: 14px;
					line-height: 1;
					text-align: center;
					color:$text-color;
					text-align: center;
					line-height: 20px;
					padding:5px 10px;
					&:after{
						content: "";
						position: absolute;
						top: -4px;
						width: calc(100% + 8px);
						height: calc(100% + 8px);
						left: -4px;
						border: 1px solid #d7d7d7;
						border-radius:50%;
					}
					&.disabled {
						cursor: not-allowed;
						opacity:0.5;
						&::before {
							content: "";
							pointer-events: none;
							position: absolute;
							top: 0;
							left: 0;
							width: 100%;
							height: 100%;
							background: linear-gradient(to bottom right,transparent calc(50% - 1px),#d7d7d7,transparent calc(50% + 1px));
						}
					}
				}
				input[type='radio']:checked {
					+ label {
						border-color: $gray-dark;
						background:$gray-dark;
						color:$white;
						&:after{
							border-color:$gray-dark;
						}
						&.disabled {
							border-color: #ccc;
							background:$white;
							color:$gray-dark;
						}
					}
				}
				input[type='radio'].disabled {
					+ label {
						cursor: not-allowed;
						opacity:0.5;
						&::before {
							content: "";
							pointer-events: none;
							position: absolute;
							top: 0;
							left: 0;
							width: 100%;
							height: 100%;
							background: linear-gradient(to bottom right,transparent calc(50% - 1px),#d7d7d7,transparent calc(50% + 1px));
						}
					}
				}
			}
			.product-quantity__select {
				border: 0;
				min-width: 50px;
				height: 45px;
				padding: 0 10px;
				font-size:15px;
				&:focus-visible {
					outline: unset;
				}
				option{
					line-height:30px;
					font-size: $font-size-base;
				}
			}
			.product-form__item{
				margin-bottom:20px;
				display: flex;
				flex-wrap:wrap;
				.variants__label{
					color: $gray-dark;
					@include rtl-margin-right(10px);
					font-weight: 400;
					font-size: 12px;
					text-transform: uppercase;
					letter-spacing: 1.5px;
					width:100%;
					margin-bottom:15px;
					span{
						font-weight:500;
					}
				}
				&.image{
					.single-option-selector{
						@include rtl-margin-right(20px);
						label{
							font-size:0;
							border:0;
							overflow:unset;
							border-radius:0;
							width:35px;
							height:35px;
							&:after{
								border-radius:0;
							}
						}
					}
				}
				&.color{
					.single-option-selector{
						@include rtl-margin-right(15px);
						label{
							font-size:0;
							border:0;
							overflow:unset;
							width: 25px;
							height: 25px;
							border-radius:50%;
							&:hover{
								&:after{
									opacity: 1;
									visibility: visible;
								}
							}
						}
					}
				}
				&.label{
					.single-option-selector label{
						&:after{
							display:none;
						}
					}
				}
			}
			.product-quickview__avaiable{
				margin:5px 0 15px;
				.product-avaiable{
					display:none;
					&.product-avaiable--active{
						display:block;
					}
				}
			}
			.product-quickview__buttons_external a{
				-webkit-transition: none;
				transition: none;
				font-size: 12px;
				text-transform: uppercase;
				line-height: 50px;
				position: relative;
				background:$gray-dark;
				color: $white;
				text-align: center;
				@include rtl-margin-right(20px);
				padding: 0 15px;
				cursor: pointer;
				display: inline-block;
				vertical-align: top;
				width: 100%;
				margin: 0;
				white-space: nowrap;
				border:0;
				font-family:$font-family-base;
				letter-spacing:2px;
				font-weight:500;
				&:hover{
					background:$theme-color;
					-webkit-animation-name: text-indent;
					animation-name: text-indent;
					-webkit-animation-duration: 1.5s;
					animation-duration: 1.5s;
					-webkit-animation-timing-function: ease-in-out;
					animation-timing-function: ease-in-out;
					-webkit-animation-iteration-count: 1;
					animation-iteration-count: 1;
				}
			}
			.product-quickview__buttons {
				display:flex;
				flex-wrap:wrap;
				.product-single__add-to-cart{
					flex:1;
					display:flex;
					flex-wrap:wrap;
				}
				.btn--add-to-cart{
					-webkit-transition: none;
					transition: none;
					font-size: 12px;
					text-transform: uppercase;
					line-height: 50px;
					position: relative;
					background:$gray-dark;
					color: $white;
					text-align: center;
					@include rtl-margin-right(20px);
					padding: 0 15px;
					cursor: pointer;
					display: inline-block;
					vertical-align: top;
					flex: 1;
					margin: 0;
					white-space: nowrap;
					border:0;
					font-family:$font-family-base;
					letter-spacing:2px;
					font-weight:500;
					&:hover{
						background:$theme-color;
						-webkit-animation-name: text-indent;
						animation-name: text-indent;
						-webkit-animation-duration: 1.5s;
						animation-duration: 1.5s;
						-webkit-animation-timing-function: ease-in-out;
						animation-timing-function: ease-in-out;
						-webkit-animation-iteration-count: 1;
						animation-iteration-count: 1;
					}
					&.active{
						&:before{
							position: relative;
							display: inline-block;
							content: "";
							border: 2px solid rgba($white,.25);
							border-top-color: $white;
							width: 18px;
							height: 18px;
							background: none;
							-webkit-animation: 2s linear 0s normal none infinite running spin-load;
							animation: 2s linear 0s normal none infinite running spin-load;
							text-indent: 0;
							top: 4px;
							border-radius: 50%;
							-webkit-border-radius: 50%;
							-moz-border-radius: 50%;
							-ms-border-radius: 50%;
							-o-border-radius: 50%;
							left:-10px;
						}
					}
					&.added{
						&:before{
							content:"\e92b";
							font-family:feather;
							display:inline-block;
							font-size:20px;
							color:$white;
							left: -10px;
							top: 3px;
							line-height: 1;
							position: relative;
						}
					}
				}
				.shopify-payment-button{
					width:100%;
					.shopify-payment-button__button{
						background:$theme-color;
						border-radius:0;
						font-size: 16px;
						text-transform: uppercase;
						line-height: 50px;
						position: relative;
						padding: 0 15px;
						cursor: pointer;
						display: inline-block;
						vertical-align: top;
						width: 100%;
						margin: 10px 0;
						white-space: nowrap;
						&:hover{
							background:$gray-dark;
						}
						@media (max-width:480px){
							font-size: $font-size-base;
						}
					}
					.shopify-payment-button__button--hidden{
						display:none;
					}
				}
				.product-quantity{
					margin: 0;
					border: 1px solid #e6e6e6;
					height: 50px;
					display: inline-block;
					@include rtl-margin-right(10px);
					position: relative;
					.wpbingo-qty__number{
						width: 125px;
						border: 0;
						height: 45px;
						text-align: center;
						padding: 0 38px;
						font-size: 18px;
					}
					.wpbingo-qty__adjust--minus{
						position: absolute;
						top: 0;
						left: 0;
						background: transparent;
						line-height: 50px;
						border: none;
						width: 38px;
						height: 46px;
						color:#d5d5d5;
						font-size:18px;
						&:hover{
							color:$gray-dark;
						}
					}
					.wpbingo-qty__adjust--plus{
						position: absolute;
						top: 0;
						right: 0;
						background: transparent;
						line-height: 50px;
						border: none;
						font-size:18px;
						width: 38px;
						height: 46px;
						color:#d5d5d5;
						&:hover{
							color:$gray-dark;
						}
					}
					@media (max-width:480px){
						.wpbingo-qty__number{
							width: 95px;
							padding: 0 28px;
						}
						.wpbingo-qty__adjust--plus,.wpbingo-qty__adjust--minus{
							width:28px;
						}
					}
				}
			}
		}
	}
	@media (max-width:991px){
		max-width: 320px;
		.product-quickview {
			.img-quickview{
				max-width: 320px;
			}
		}
	}
	@media (max-width:767px){
		max-width: 400px;
		width: calc(100% - 30px);
		@include transform(translateX(100%));
		.product-quickview {
			height:100%;
			>.row{
				flex-direction: column;
				flex-wrap: nowrap;
				height:100%;
			}
			.img-quickview{
				max-width: 100%;
				flex:1;
			}
			.bwp-single-info{
				padding: 0 12px;
				position: relative;
				.content_product_detail{
					max-height: 100%;
					height: 100%;
					padding: 30px 10px;
				}
				.product-quickview_title{
					font-size: 25px;
					line-height: 28px;
				}
			}
		}
	}
}

.quickview__btn-close {
	cursor: pointer;
	position: absolute;
	top: 15px;
	@include rtl-right(15px);
	text-align: center;
	z-index: 9;
	display: inline-block;
	width: 28px;
	height: 28px;
	padding: 6px;
	border-radius: 100%;
	-webkit-border-radius: 100%;
	-moz-border-radius: 100%;
	-ms-border-radius: 100%;
	-o-border-radius: 100%;
	box-shadow: 0 2px 59px #0006;
	border:0;
	background:$white;
	padding:0;
	&:before,&:after{
		content: "";
		position: absolute;
		height: 1px;
		width: 14px;
		top: 50%;
		left: calc(50% - 7px);
		margin-top: -1px;
		background-color: $gray-dark;
		-webkit-transition: all .3s ease;
		transition: all .3s ease;
	}
	&:before{
		transform-origin: 50% 50%;
		-webkit-transform: rotate(-45deg);
		transform: rotate(-45deg);
	}
	&:after{
		transform-origin: 50% 50%;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
	}
	&:hover{
		&:before,&:after{
			-webkit-transform: rotate(0deg);
			transform: rotate(0deg);
		}
	}
	@media (max-width:767px){
		position:fixed;
	}
}

.quickview-images {
	display: block;
	overflow: hidden;
}

.product-avaiable {
	&.product-avaiable--active {
		display: block;
		.product-avaiable__text {
			position:relative;
			@include rtl-padding-left(25px);
			color:#108043;
			&:before{
				content: "\e919";
				width: 14px;
				height: 14px;
				background: white;
				border-radius: 50%;
				@include rtl-left(0);
				position:absolute;
				top:calc(50% - 7px);
				line-height:14px;
				font-family: bwpfont;
			}
			&:after{
				z-index: -1;
				position: absolute;
				content: "";
				width: 14px;
				height: 14px;
				background: #108043;
				display: inline-block;
				border-radius: 50%;
				opacity: .25;
				top: calc(50% - 7px);
				left: 0;
				-webkit-transform: scale(1);
				-moz-transform: scale(1);
				-ms-transform: scale(1);
				-o-transform: scale(1);
				transform: scale(1);
				-webkit-animation-name: scale;
				animation-name: scale;
				-webkit-animation-duration: 1.5s;
				animation-duration: 1.5s;
				-webkit-animation-timing-function: ease-out;
				animation-timing-function: ease-out;
				-webkit-animation-iteration-count: infinite;
				animation-iteration-count: infinite;
			}
			&.product-avaiable__text--outstock{
				color:red;
				&:after{
					background:red;
				}
			}
		}
	}
}
body.not-scroll{
	overflow:hidden;
}
body{
	&.qv_overlay-layer,&.editv_overlay-layer{
		&:before{
			content: "";
			position: fixed;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			background: rgba(0,0,0,.4);
			visibility: visible;
			opacity: 1;
			-webkit-transition: opacity .3s ease,visibility 0s ease;
			transition: opacity .3s ease,visibility 0s ease;
			z-index: 9999;
		}
		@media (max-width:991px){
			&:before{
				z-index: 9999;
			}
		}
	}
}
body:not(.template-index){
	.bwp-header{
		border-bottom:1px solid $border-color;
		.header-top{
			border-bottom: 1px solid rgba($white,0.15);
			.header-text{
				span{
					&:before{
						color: $gray-dark;
					}
				}
				&:before{
					background: #d4d4d4;
				}
			}
			.header-top__nav{
				li{
					&:before{
						background:#d4d4d4;
					}
				}
			}
		}
	}
}
// WISHLIST
#wishlist{
	.wishlist_empty{
		text-align:center;
		font-size:20px;
	}
	.wishlist__grid{
		display: flex;
		margin: 0 -15px;
		flex-wrap: wrap;
		&.loading_wishlist{
			position:relative;
			padding:50px 0;
			&:before{
				position: absolute;
				display: inline-block;
				content: "";
				border: 2px solid rgba($gray-dark,.25);
				border-top-color: $gray-dark;
				width: 30px;
				height: 30px;
				background: none;
				-webkit-animation: 2s linear 0s normal none infinite running spin-load;
				animation: 2s linear 0s normal none infinite running spin-load;
				text-indent: 0;
				top: 30px;
				left:calc(50% - 15px);
				border-radius: 50%;
				-webkit-border-radius: 50%;
				-moz-border-radius: 50%;
				-ms-border-radius: 50%;
				-o-border-radius: 50%;
				opacity:1;
			}
			*{
				opacity:0;
			}
		}
		.product-content-card{
			max-width: 25%;
			flex: 0 0 25%;
			padding: 0 15px;
		}
		.product-card-wishlist{
			.product-card__content .product-review .spr-badge{
				justify-content:revert; 
			}
			.product-card__content {
				@include rtl-text-align-left();
				.content-top {
					display: flex;
					justify-content: space-between;
				}
				.wpb-variants-swatch .swatch-content {
					justify-content: revert;
				}
			}
			.button-wishlist{
				position: absolute;
				top: 10px;
				@include rtl-right(10px);
				&:before{
					content: attr(data-title);
					position: absolute;
					padding:0 10px;
					background: $gray-dark;
					color: $white;
					top:calc(50% - 11.5px);
					line-height: 23px;
					white-space: nowrap;
					right: calc(100% + 10px);
					font-size: 12px;
					z-index: 10;
					opacity: 0;
					visibility: hidden;
					pointer-events: none;
				}
				&:after{
					content: "";
					position: absolute;
					top:calc(50% - 5px);
					right: 100%;
					border-width: 5px;
					border-style: solid;
					border-color:transparent transparent transparent $gray-dark;
					pointer-events: none;
					opacity: 0;
					visibility: hidden;
				}
				&:hover{
					&:before,&:after{
						opacity: 1;
						visibility: visible;
					}
				}
				button{
					color: $gray-dark;
					display: inline-block;
					text-align: center;
					background: $white;
					width: 35px;
					height: 35px;
					line-height: 35px;
					border: 0;
					font-size: 0;
					white-space: nowrap;
					padding:0;
					border-radius:50%;
					&:before{
						content: "\e9e4";
						font-family: 'feather';
						font-size: 16px;
						display:inline-block;
					}
					span {
						display: none;
					}
					&.active{
						color:$gray-dark;
						background:$white;
					}
					&.load-wishlist{
						&:before{
							position: relative;
							display: inline-block;
							content: "";
							border: 2px solid rgba($gray-dark,.5);
							border-top-color: $gray-dark;
							width: 16px;
							height: 16px;
							background: none;
							animation: 2s linear 0s normal none infinite running spin-load;
							text-indent: 0;
							top: 8px;
							border-radius: 50%;
						}
						&:hover{
							&:before{
								border: 2px solid rgba($white,.5);
								border-top-color: $white;
							}
						}
					}
					&:hover,
					&:focus {
						outline: 0;
						box-shadow: none;
					}
					&:hover {
						color: $white;
						background-color: $theme-color;
						border-color:$theme-color;
						-webkit-animation-name: beat;
						animation-name: beat;
						-webkit-animation-duration: 0.9s;
						animation-duration: 0.9s;
						-webkit-animation-timing-function: ease-in-out;
						animation-timing-function: ease-in-out;
						-webkit-animation-iteration-count: infinite;
						animation-iteration-count: infinite;
					}
				}
			}
		}
		@media (max-width:1200px){
			margin: 0 -7.5px;
			.product-content-card{
				max-width: 33.33%;
				flex: 0 0 33.33%;
				padding: 0 7.5px;
			}
		}
		@media (max-width:991px){
			margin: 0 -7.5px;
			.product-content-card{
				max-width: 50%;
				flex: 0 0 50%;
				padding: 0 7.5px;
			}
		}
	}
}
// BEFORE-YOU-LEAVE
#before-you-leave{
	display:none;
	position:fixed;
	width:100%;
	height:100%;
	top:0;
	left:0;
	z-index:9999;
	&.active{
		@media (min-width:767px){
			display:flex;
		}
	}
	.close-full{
		position:fixed;
		width:100%;
		height:100%;
		top:0;
		left:0;
		background:rgba($gray-dark,0.25);
	}
	.close{
		cursor: pointer;
		position: absolute;
		top: 30px;
		right: 30px;
		text-align: center;
		z-index: 1;
		display: inline-block;
		width: 28px;
		height: 28px;
		border-radius: 100%;
		-webkit-border-radius: 100%;
		-moz-border-radius: 100%;
		-ms-border-radius: 100%;
		-o-border-radius: 100%;
		&:before,&:after{
			content: "";
			position: absolute;
			height: 1px;
			width: 20px;
			top: 50%;
			left: calc(50% - 10px);
			margin-top: -1px;
			background-color: $gray-dark;
			-webkit-transition: all .3s ease;
			transition: all .3s ease;
		}
		&:before{
			transform-origin: 50% 50%;
			-webkit-transform: rotate(-45deg);
			transform: rotate(-45deg);
		}
		&:after{
			transform-origin: 50% 50%;
			-webkit-transform: rotate(45deg);
			transform: rotate(45deg);
		}
		&:hover{
			&:before,&:after{
				-webkit-transform: rotate(0deg);
				transform: rotate(0deg);
			}
		}
	}
	.content-you-leave{
		position: fixed;
		right: 0;
		width: 100%;
		max-width: 380px;
		background:$white;
		overflow:auto;
		height:100%;
		&::-webkit-scrollbar-track
		{
			background-color: #ececec;
		}
		&::-webkit-scrollbar
		{
			width: 2px;
			background-color: #ececec;
		}
		&::-webkit-scrollbar-thumb
		{
			background-color:$gray-dark;
		}
	}
	.content-top{
		position:relative;
		margin-bottom:35px;
		h2{
			position:absolute;
			margin:0;
			font-size:25px;
			width:100%;
			padding:0 25px;
			bottom:30px;
		}
	}
	.desc{
		font-size:18px;
		text-align:center;
		margin-bottom:10px;
		span{
			font-size:22px;
			color:$theme-color;
		}
	}
	.code{
		text-align:center;
		margin-bottom:25px;
		span{
			color:$gray-dark;
			text-decoration:underline;
			font-weight:500;
		}
	}
	.button{
		padding:0 30px;
		text-align:center;
		margin-bottom:30px;
		a{
			display:inline-block;
			width:100%;
			padding:15px 20px;
			line-height:20px;
			font-weight:500;
			background:$gray-dark;
			color:$white;
			&:hover{
				background:$theme-color;
			}
		}
	}
	.title-product-leave{
		font-size:18px;
		padding:0 30px;
		margin-bottom:25px;
		font-weight: 500;
	}
	.content-product{
		padding:30px;
		border-top:1px solid $border-color;
	}
	.product-card{
		display:flex;
		.product-card__image-wrapper{
			flex:0 0 120px;
			max-width:120px;
		}
		.product-card__content{
			flex:1;
			@include rtl-padding-left(20px);
			@include rtl-text-align-left();
			margin:0;
			.product-review{
				margin:0;
				.spr-badge{
					justify-content: revert;
					padding: 0 0 5px;
				}
			}
			.wpb-variants-swatch{
				margin-top: 0;
				.swatch-content{
					justify-content: revert;
				}
			}
			.product-card__price{
				margin-bottom: 10px;
				.product-price.product-price--regular{
					font-size:$font-size - 2;
				}
			}
			.product-group-price{
				font-size:$font-size;
			}
		}
	}
	.content-button{
		display:flex;
		margin-top:15px;
		.product-card__form{
			flex:1;
			.btn{
				border:1px solid $border-color;
				padding:5px 10px;
				line-height:20px;
				color:$gray-dark;
				font-weight:500;
				text-align:center;
				width: 100%;
				&:hover{
					background:$theme-color;
					border-color:$theme-color;
					color:$white;
				}
			}
		}
		.button-wishlist{
			@include rtl-margin-left(5px);
			button{
				width:32px;
				height:32px;
				padding:0;
				text-align:center;
				line-height:30px;
				border:1px solid $border-color;
				color:$gray-dark;
				background:$white;
				&:before{
					content: "\e91e";
					font-family: bwpfont;
					font-size: 14px;
					display: inline-block;
				}
				&.active{
					background:$theme-color;
					border-color:$theme-color;
					color:$white;
					&.load-wishlist{
						&:before{
							border: 2px solid rgba($white,.5);
							border-top-color: $white;
						}
					}
				}
				&:hover{
					background:$theme-color;
					border-color:$theme-color;
					color:$white;
				}
				&.load-wishlist{
					&:before{
						position: relative;
						display: inline-block;
						content: "";
						border: 2px solid rgba($gray-dark,.5);
						border-top-color: $gray-dark;
						width: 16px;
						height: 16px;
						background: none;
						animation: 2s linear 0s normal none infinite running spin-load;
						text-indent: 0;
						top: 3px;
						border-radius: 50%;
					}
					&:hover{
						&:before{
							border: 2px solid rgba($white,.5);
							border-top-color: $white;
						}
					}
				}
			}
		}
	}
}
// ANIMATION
@keyframes spin-load{
	0% {
		-webkit-transform: rotate(0);
		transform: rotate(0);
	}
	100% {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}
@keyframes bwp-wobble-horizontal{
	16.65% {
		transform: translateX(8px);
	}

	33.3% {
		transform: translateX(-6px);
	}
	49.95% {
		transform: translateX(4px);
	}
	66.6% {
		transform: translateX(-2px);
	}
	83.25% {
		transform: translateX(1px);
	}
	100% {
		transform: translateX(0);
	}
}
@keyframes sticky-header{
	0% {
		transform:translateY(-100%);
	}
	100% {
		transform:translateY(0);
	}
}
@keyframes notification-progressbar{
	0% {
		width:100%;
	}
	100% {
		width:0;
	}
}
@keyframes text-indent{
	0% {
		text-indent:30px
	}
	15% {
		text-indent:-25px
	}
	30% {
		text-indent:20px
	}
	45% {
		text-indent:-15px
	}
	60% {
		text-indent:10px
	}
	75% {
		text-indent:-5px
	}
	90% {
		text-indent:2px
	}
	100% {
		text-indent:0px
	}
}
@-webkit-keyframes text-indent{
	0% {
		text-indent:30px
	}
	15% {
		text-indent:-25px
	}
	30% {
		text-indent:20px
	}
	45% {
		text-indent:-15px
	}
	60% {
		text-indent:10px
	}
	75% {
		text-indent:-5px
	}
	90% {
		text-indent:2px
	}
	100% {
		text-indent:0px
	}
}
@-moz-keyframes text-indent{
	0% {
		text-indent:30px
	}
	15% {
		text-indent:-25px
	}
	30% {
		text-indent:20px
	}
	45% {
		text-indent:-15px
	}
	60% {
		text-indent:10px
	}
	75% {
		text-indent:-5px
	}
	90% {
		text-indent:2px
	}
	100% {
		text-indent:0px
	}
}
@keyframes beat{
	0% {
		@include transform(scale(1));
	}
	50% {
		@include transform(scale(1.1));
	}
	100% {
		@include transform(scale(1));
	}
}
@-webkit-keyframes beat{
	0% {
		@include transform(scale(1));
	}
	50% {
		@include transform(scale(1.1));
	}
	100% {
		@include transform(scale(1));
	}
}
@-moz-keyframes beat{
	0% {
		@include transform(scale(1));
	}
	50% {
		@include transform(scale(1.1));
	}
	100% {
		@include transform(scale(1));
	}
}
@keyframes lds-ellipsis1 {
  0% {
    transform: scale(0);
  }
  100% {
    transform: scale(1);
  }
}
@keyframes lds-ellipsis3 {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(0);
  }
}
@keyframes lds-ellipsis2 {
  0% {
    transform: translate(0, 0);
  }
  100% {
    transform: translate(24px, 0);
  }
}
@keyframes scale-lookbook {
	0%{
		transform:scale(1);
		-webkit-transform:scale(1);
		opacity:1; }
	to{
		transform:scale(2);
		-webkit-transform:scale(2);
		opacity:0; 
	}
}
@keyframes loading-page {
	0%{
		width:0;
	}
	to{
		width:40%;
	}
}
@keyframes loading-page-done {
	0%{
		width:40%;
	}
	to{
		width:100%;
	}
}
@keyframes hourglass{
    0%{
        transform:rotate(0deg);
        box-shadow:inset #fff 0 0px, inset #f11e1e 0 0px, inset #fff 0 -15px;
    }
    80%{
        transform:rotate(0deg);
        box-shadow:inset #fff 0 15px, inset #f11e1e 0 0, inset #fff 0 0px;
    }
    100%{
        transform:rotate(180deg);
        box-shadow:inset #fff 0 15px, inset #f11e1e 0 0, inset #fff 0 0px;
    }
}
@keyframes  translate-popup{
	0% {
		-webkit-transform: translate3d(-40px,0,0);
		transform: translate3d(-40px,0,0);
	}
	100% {
		-webkit-transform: translateZ(0);
		transform: translateZ(0);
	}
}
@keyframes text-transform{
	0% {
		@include transform(translateX(30px));
	}
	15% {
		@include transform(translateX(-25px));
	}
	30% {
		@include transform(translateX(20px));
	}
	45% {
		@include transform(translateX(-15px));
	}
	60% {
		@include transform(translateX(10px));
	}
	75% {
		@include transform(translateX(-5px));
	}
	90% {
		@include transform(translateX(2px));
	}
	100% {
		@include transform(translateX(0px));
	}
}
@-webkit-keyframes text-transform{
	0% {
		@include transform(translateX(30px));
	}
	15% {
		@include transform(translateX(-25px));
	}
	30% {
		@include transform(translateX(20px));
	}
	45% {
		@include transform(translateX(-15px));
	}
	60% {
		@include transform(translateX(10px));
	}
	75% {
		@include transform(translateX(-5px));
	}
	90% {
		@include transform(translateX(2px));
	}
	100% {
		@include transform(translateX(0px));
	}
}
@-moz-keyframes text-transform{
	0% {
		@include transform(translateX(30px));
	}
	15% {
		@include transform(translateX(-25px));
	}
	30% {
		@include transform(translateX(20px));
	}
	45% {
		@include transform(translateX(-15px));
	}
	60% {
		@include transform(translateX(10px));
	}
	75% {
		@include transform(translateX(-5px));
	}
	90% {
		@include transform(translateX(2px));
	}
	100% {
		@include transform(translateX(0px));
	}
}
@keyframes marquee{
	100% {
		@include transform(translateX(-100%));
	}
}
@-webkit-keyframes marquee{
	100% {
		@include transform(translateX(-100%));
	}
}
@-moz-keyframes marquee{
	100% {
		@include transform(translateX(-100%));
	}
}
@keyframes textclip{
	to {
		background-position: -200% center;
	}
}
@-webkit-keyframes textclip{
	to {
		background-position: -200% center;
	}
}
@-moz-keyframes textclip{
	to {
		background-position: -200% center;
	}
}