ꦫꦣꦺꦤ꧀ꦄꦤ꧀ꦠꦱꦺꦤ

PATH: home / lab2454c / adenbic.com / wp-content / themes / bumbleb / sass / themes

h1.bwp-title-default{
    font-size: 25px;
    padding-top: 30px;
    padding-bottom: 20px;
}

/* Block default ------------------------------------------------------------------------*/
.#{$block-selector} {
    margin-bottom: $block-module-margin-bottom;
    border: 0px solid $block-module-border-color;
    position: relative;
    padding: $block-module-padding;
    .#{$block-heading-selector}{
        
        &.separator_align_center{
            .widget-arrow{
                margin: 0 auto;
                @include rtl-left(0);
                @include rtl-right(0);
            }
        }
        // Align  right
        &.separator_align_right{
            .widget-arrow{
                &:before{
                    @include rtl-left(auto);
                    @include rtl-right(47px);
                }
                &:after{
                    @include rtl-left(47px);
                }
                @include rtl-left(auto);
                @include rtl-right(70px);
            }
        }
        // Align  left
        &.separator_align_left{
            .widget-arrow{
                &:before{
                    @include rtl-left(-70px);
                }
                &:after{
                    @include rtl-left(47px);
                }
                @include rtl-left(74px);
            }
        }

}
    .#{$block-content-selector} {
        @include border-radius ($block-module-content-radius);
        @include clearfix();
    }
    .#{$block-heading-reversed-selector}{
        @include rtl-margin-right(75px);
    }

/* block styles */
    &.nopadding{
        .#{$block-content-selector}{
            padding:0;
            margin: 0;
        }
    }
}
 
  
/* Contextual variations ------------------------------------------------------------*/
.#{$block-prefix}-theme {
  @include block-variant($panel-default-border, $white, $theme-color, $panel-default-border);
}
.#{$block-prefix}-default {
  @include block-variant($panel-default-border, $panel-default-text, $panel-default-heading-bg, $panel-default-border);
}
.#{$block-prefix}-primary {
  @include block-variant($panel-primary-border, $panel-primary-text, $panel-primary-heading-bg, $panel-primary-border);
}
.#{$block-prefix}-success {
  @include block-variant($panel-success-border, $panel-success-text, $panel-success-heading-bg, $panel-success-border);
}
.#{$block-prefix}-info {
  @include block-variant($panel-info-border, $panel-info-text, $panel-info-heading-bg, $panel-info-border);
}
.#{$block-prefix}-warning {
  @include block-variant($panel-warning-border, $panel-warning-text, $panel-warning-heading-bg, $panel-warning-border);
}
.#{$block-prefix}-danger {
  @include block-variant($panel-danger-border, $panel-danger-text, $panel-danger-heading-bg, $panel-danger-border);
}

.#{$block-prefix}-highlighted {
    margin: $block-sidebar-hightlight-margin;
    .#{$block-heading-selector}{
        margin: $block-sidebar-heading-hightlight-margin;
        color: $block-sidebar-heading-hightlight-color;
        padding: $block-sidebar-heading-hightlight-padding;
        @include rtl-padding-right(0);
        background: $block-sidebar-heading-hightlight-bg;
        font-weight: $block-sidebar-heading-hightlight-font-weight;
        font-size: $block-sidebar-heading-hightlight-font-size;
        border: none!important;
        text-transform: uppercase;
        overflow: hidden;
        > span{
            position: relative;
            padding: 0 15px;
            &:after, &:before{
                content: "";
                position: absolute;
                top: 50%;
                height: 1px;
                width: 1000px;
                background: $border-color;
            }
            &:after{
                @include rtl-left(100%); 
            }
            &:before{
                 @include rtl-right(100%);
            }
            > span{ 
                position: relative;
                padding: 7px 15px;
                &:after, &:before{
                    content: ""; 
                    position: absolute;
                    top: 0;
                    height: 100%;
                    width: 1px;
                    background: $theme-color;
                    @include rotate(-45deg);
                }
                &:after{
                    left: 100%;
                }
                &:before{
                    right: 100%;
                }
            }
        }
    } 
    .#{$block-content-selector} {
        padding: $block-sidebar-hightlight-content-padding;
        background: $block-sidebar-hightlight-content-bg;
        > div {
            background: $block-sidebar-hightlight-content-bg;
            > ul > li{
                border: none;
                > a{
                    padding: $block-sidebar-list-hightlight-padding;
                    border-top: $block-sidebar-hightlight-border;
                    color: $block-sidebar-hightlight-content-color;
                    margin: 0;
                    &:hover{
                       border-top: $block-sidebar-hightlight-border; 
                    }
                }
                &:first-child a{
                    border-top: none;
                }
            }
        }
    }      
}
/* Block inline style -----------------------------------------------------------*/
.#{$block-prefix}-inline{
    .icon{
        @include font-size(font-size, 35px);
    }
    .explain{
        @include font-size(font-size, 11px);
    }
    .#{$block-content-selector}{
        color: $white;
        position: relative;
        text-transform: $block-module-heading-transform;
        font-weight: $headings-font-weight;
        @include font-size(font-size,$block-module-heading-font-size);
    }
    .input-group{
        width: 98%
    }
}

/* Twitter -----------------------------------------------------------------------*/
.bwp-twitter-slider {
    a {
        color: $theme-color-default;
    }
}

/* Testimonial -----------------------------------------------------------------*/
.bwp-testimonial{
	.star{
		margin: 0 0 10px;
		&:before,&:after{
			display:inline-block;
			color:#f7c601;
			font-family: icomoon;
			font-size:19px;
			line-height:1;
			letter-spacing:1px;
		}
		&:after{
			color:$gray-light;
		}
		&.star-1{
			&:before{
				content:"\e901";
			}
			&:after{
				content:"\e901\e901\e901\e901";
			}
		}
		&.star-2{
			&:before{
				content:"\e901\e901";
			}
			&:after{
				content:"\e901\e901\e901";
			}
		}
		&.star-3{
			&:before{
				content:"\e901\e901\e901";
			}
			&:after{
				content:"\e901\e901";
			}
		}
		&.star-4{
			&:before{
				content:"\e901\e901\e901\e901";
			}
			&:after{
				content:"\e901";
			}
		}
		&.star-5{
			margin-top: -3px;
			&:before{
				content:"\e901\e901\e901\e901\e901";
			}
		}
	}
	ul.slick-dots{
		li{
			@include square(17px);
			margin: 0 3px;
			button{
				color: $gray-dark;
				font-size:0;
				background:rgba($gray-dark, .5);
				@include square(9px);
				margin: auto;
				top: 50%;
				@include transform(translateY(-50%));
				&:before{
					content: "";
				}
			}
		}
	}
	@media(max-width: $screen-xs-max){
		ul.slick-dots{
			display: none !important; 
		}
	}
	@media (max-width:$screen-md-max){
		.slick-list{
			margin:0 -7.5px;
			.testimonial-content{
				padding:0 7.5px;
			}
		}
	}
    &.default, &.default_2{
		.slick-carousel{
			max-width: 1410px;
			margin: auto;
		}
		.content-img{
			max-width: 445px;
			margin: 0 auto 30px;
			.slick-track{
				display: flex;
				align-items: center;
			}
			@media(min-width: $screen-xs-max){
				@include transform(translateY(-50%));
			}
		}
		.content-info{
			@media(min-width: $screen-xs-max){
				@include transform(translateY(-50%));
			}
		}
		.item{
			.thumbnail{
				img{
					@include transition(all .4s ease-in);
				}
			}
			&.slick-center{
				.thumbnail{
					width: 135px !important;
					img{
						min-width: 135px !important;
						@include transition(all .2s);
					}
				}
				@media(max-width: $screen-xs-max){
					.thumbnail{
						width: 95px !important;
						img{
							min-width: 95px !important;
						}
					}
				}
			}
		}
		.testimonial-item{
			position: relative;
		}
		.slick-arrow{
			@include opacity-s();
			font-size: 30px;
			&.fa-angle-left{
				left: 0;
			}
			&.fa-angle-right{
				right: 0;
			}
			&:hover{
				color: $theme-color;
			}
		}
	}
	&.default_2{
		.content-img{
			@media(min-width: $screen-xs-max){
				@include transform(translateY(0));
			}
		}
		.content-info{
			@media(min-width: $screen-xs-max){
				@include transform(translateY(0));
			}
		}
	}
	&.layout1{
		.slick-slider{
			overflow: unset;
		}
		.slick-arrow{
            @include opacity-s();
            font-size: 24px;
            font-family: icomoon;
            color: rgba($gray-dark, .2);
            top: 45%;
            &:hover{
            	color: $gray-dark;
            }
            &.fa-angle-right{
                right:0;
                @include transform(scaleX(-1));
                &:before{
                    content:"\e909";
                }
            }
            &.fa-angle-left{
                left:0;
                &:before{
                    content:"\e909";
                }
            }
        }
		.slick-dots{
			position:relative;
			margin-top: 15px;
			li{
				@include square(0);
				margin: 0;
				button{
					font-size: 12px;
					margin: 0;
					@include square(0);
					@include opacity-h();
					@include rtl-right(143px);
					&:after{
						position: absolute;
						content: '';
						background:rgba($gray-dark, .1);
						@include size(110px, 1px);
						@include rtl-left(15px);
					}
				}
			}
			.slick-active{
				button{
					@include opacity-s();
				}
			}
		}
		.slick-carousel{
			padding:115px 150px;
			@media(max-width:$screen-md-max){
				padding:70px 50px 50px;
			}
			@media(max-width: $screen-xs-max){
				padding:50px 15px;
			}
		}
		.testimonial-item{
			display: flex;
			align-items:center;
		}
		.content{
			@include rtl-margin-left(50px);
			@media(max-width:$screen-xs){
				@include rtl-margin-left(0);
			}
		}
		.post-excerpt{
			margin-bottom: 7px;
		}
		.testimonial-info{
			display: flex;
			align-items:center;
			h2{
				margin: 0;
			}
			.testimonial-job{
				@include rtl-margin-left(5px);
				&:after{
					content:')';
				}
				&:before{
					content:'(';
				}
			}
		}
		@media(max-width: $screen-xs-max){
			.testimonial-info{
				justify-content: center;
			}
			.testimonial-item{
				display: block;
				text-align: center;
				justify-content: center;
			}
		}	
    }
    &.layout2{
		.slick-arrow{
            @include opacity-s();
            font-size: 24px;
            font-family: icomoon;
            @include square(35px);
            line-height:35px;
            &.fa-angle-right{
                right: -52px;
                @include transform(scaleX(-1));
                &:before{
                    content:"\e909";
                }
            }
            &.fa-angle-left{
                left: -52px;
                &:before{
                    content:"\e909";
                }
            }
        }
        .slick-center{
        	.item{
        		border:1px solid #0070DC;
        		@media (max-width:$screen-sm-max){
					border:1px solid #f2f2f2;
				}
        	}
        }
		.item{
			border:1px solid #f2f2f2;
			@include transition(all 0.5s ease);
			&:hover{
				border:1px solid #00a046;
			}
		}
		.testimonial-item{
			display: flex;
			align-items:center;
			@media (max-width:$screen-xs-max){
				display: block;
				text-align: center;
				.content{
					@include rtl-padding-left(0);
					padding-top:15px;
				}
			}
		}
		.testimonial-info{
			display: flex;
			align-items:center;
				@media(max-width: $screen-xs-max){
					justify-content: center;
				}
			h2{
				margin: 0;
			}
			.testimonial-job{
				@include rtl-margin-left(15px);
			}
		}	
    }
    &.layout3{
		.slick-arrow{
            @include opacity-s();
            font-size: 24px;
            font-family: icomoon;
            background:transparent;
            top: 45%;
            &.fa-angle-right{
                right:-5px;
                @include transform(scaleX(-1));
                &:before{
                    content:"\e909";
                }
            }
            &.fa-angle-left{
                left:-5px;
                &:before{
                    content:"\e909";
                }
            }
        }
		.testimonial-item{
			display: flex;
			align-items:center;
			@media (max-width:$screen-xs-max){
				display: block;
				text-align: center;
				.content{
					@include rtl-padding-left(0);
					padding-top:15px;
				}
			}
		}
		.testimonial-info{
			display: flex;
			align-items:center;
				@media(max-width: $screen-xs-max){
					justify-content: center;
				}
			h2{
				margin: 0;
			}
			.testimonial-job{
				@include rtl-margin-left(15px);
			}
		}	
    }
    &.layout4{
		.slick-arrow{
            @include opacity-s();
            font-size: 24px;
            font-family: icomoon;
            color: $white;
            background:transparent;
            top: 45%;
            &.fa-angle-right{
                right:-5px;
                @include transform(scaleX(-1));
                &:before{
                    content:"\e909";
                }
            }
            &.fa-angle-left{
                left:-5px;
                &:before{
                    content:"\e909";
                }
            }
        }
        .post-excerpt{
        	opacity: .8;
        }
		.testimonial-item{
			display: flex;
			align-items:center;
			@media (max-width:$screen-xs-max){
				display: block;
				text-align: center;
				.content{
					@include rtl-padding-left(0);
					padding-top:15px;
				}
			}
		}
		.testimonial-info{
			display: flex;
			align-items:center;
				@media(max-width: $screen-xs-max){
					justify-content: center;
				}
			h2{
				margin: 0;
			}
			.testimonial-job{
				@include rtl-margin-left(15px);
				color: rgba($white, .8);
			}
		}	
    }
    &.scroll{
    	.icon-quotes-2{
			font-size: 45px;
			color:rgba($theme-color, .2);
		}
		.item{
			.testimonial-item{
				padding: 0 20px;
			}
			.testimonial-icon{
				margin-bottom: 25px;
			}
			.post-excerpt{
				margin-bottom: 15px;
			}
		}
		.content-scoll{
			 &.grid:not(.slick-carousel){
		        display: flex;
		        flex-wrap: wrap;
		        @media (max-width: $screen-xs-max){
		            justify-content: center;
		        } 
   	 		}
			.item-image{
				display:inline-block;
				wdith:100%;
				overflow:hidden;
				img{
					@include transition(all 0.5s ease);
				}
			}
		}
		.scrollbar{
			margin:50px auto 15px;
			height: 1px;
			background:#f1f1ff;
			line-height: 0;
			cursor: pointer;
			overflow: hidden; 
			.handle{
				background: $theme-color;
				height: 2px;
				position: relative;
				top: -1px;
			}
			.mousearea{
				position: absolute;
				top: -37px;
				left: 0;
				width: 100%;
				height: 20px;
				font-size: 10px;
				text-transform: uppercase;
				color: $gray-dark;
				white-space: nowrap;
				line-height:20px;
				letter-spacing:1px;
				font-weight:500;
				i{
					font-size: 15px;
					line-height: 15px;
                    font-weight: 600;
					position:relative;
					top:3px;
					@include rtl-margin-left(10px);
				}
				&:hover{
					color:$theme-color;
				}
			}
		}
		@media (max-width: $screen-xs-max){
			.content-scroll-list{
				@include rtl-padding-right(0);
			}
		}
		@media (max-width: $screen-sm-max){
			.content-scroll-list{
				@include rtl-padding-right(0);
			}
		}
	}
}

/* Bin Brand -----------------------------------------------------------------*/
.bwp-brand{
	&.default, &.default2, &.default3{
		.slick-track{
			display: flex;
			align-items: center;
		}
		.item-image{
			display:flex;
			align-items:center;
			justify-content:center;
			img{
				width:auto;
				@include transition(all 0.3s ease);
			}
		}
	}
	&.default2{	
		@include rtl-margin-left(40px);
		@media (max-width: $screen-xs-max){
			@include rtl-margin-left(0);
		}
		.slick-arrow{
			@include opacity-s();
			@include square(20px);
			font-family: icomoon;
			line-height:20px;
			@include rtl-text-align-left();
			font-size: 24px;
			@include border-radius(50%);
			&.fa-angle-left{
				&:before{
					content: "\e909";
				}
				left: 0;
			}
			&.fa-angle-right{
				@include transform(scaleX(-1));
				&:before{
					content: "\e909";
				}
				right: 0;
			}
		}
		.slick-carousel{
			max-width: 700px;
			margin: auto;
		}
	}
	&.default3{
		.slick-track{
			justify-content: space-between;
		}
		.slick-arrow{
			@include opacity-s();
			@include square(20px);
			font-family: icomoon;
			line-height:20px;
			@include rtl-text-align-left();
			color:$gray-dark;
			font-size: 24px;
			@include border-radius(50%);
			&.fa-angle-left{
				&:before{
					content: "\e909";
				}
				left: 0;
			}
			&.fa-angle-right{
				@include transform(scaleX(-1));
				&:before{
					content: "\e909";
				}
				right: 0;
			}
		}
	}
}

/* bwp client -----------------------------------------------------------------*/
.bwp-client{
    .item{
        .item-image{
            display: flex;
            justify-content: center;
        }
    }
	.item-image a{
		img{
			filter: grayscale(100%);
		}
		&:hover{
			img{
				filter: grayscale(0%);
			}
		}
	}
	&.default{
		.item-image{
			min-height:100px;
			display:flex;
			align-items:center;
			justify-content:center;
			img{
				@include transition(all 0.5s ease);
				@include scale(1);
			}
			&:hover{
				img{
					@include scale(1.1);
				}
			}
		}
	}
	&.slider{
		background:$white;
		border:1px solid #dedede;
		.slick-list{
			margin:0 -1px;
		}
		.item{
			padding:5px 0;
			@include rtl-border-right(1px solid #dedede);
		}
		.item-image{
			min-height:200px;
			padding:5px 0;
			display:flex;
			align-items:center;
			justify-content:center;
			img{
				@include transition(all 0.5s ease);
				@include scale(1);
			}
			&:hover{
				img{
					@include scale(1.1);
				}
			}
		}
		.slick-arrow{
			background:$theme-color;
			&:hover{
				background:darken($theme-color,10%);
			}
			&.fa-angle-left{
				@include rtl-left(-12.5px);
			}
			&.fa-angle-right{
				@include rtl-right(-12.5px);
			}
		}
	}
	&.slider2{
		.item-image{
			min-height:150px;
			display:flex;
			align-items:center;
			justify-content:center;
			img{
				@include transition(all 0.5s ease);
				@include scale(1);
			}
			&:hover{
				img{
					@include scale(1.1);
				}
			}
		}
	}
}

/* CTA -----------------------------------------------------------------*/
.bwp-cta{
	&.default{
		text-align:center;
		border:1px solid rgba($gray-lighter,0.5);
		padding:30px 25px;
		&:hover{
			.box-image{
				img{
					-webkit-animation-name: shakes;
					animation-name: shakes;
					-webkit-animation-duration: 1s;
					animation-duration: 1s;
					-webkit-animation-timing-function: ease-in-out;
					animation-timing-function: ease-in-out;
					-webkit-animation-iteration-count: 1;
					animation-iteration-count: 1;
				}
			}
		}
		.count-cta{
			font-size:28px;
			font-weight:700;
			margin:0;
			margin-top:25px;
		}
		.title-cta{
			font-size:18px;
			margin-top:5px;
		}
	}
}

/* Block style in footer ------------------------------------------------------------*/
.#{$app-prefix}-footer{
    .#{$block-selector} {
        border:none;
        padding: 0;
        background: $nocolor;
        margin: $footer-column-margin;
        .#{$block-heading-selector}{
            color: $footer-heading-color;
            text-transform: $footer-heading-transform;
            margin: $footer-heading-margin;
            padding: $footer-heading-padding;
            font-size: $footer-heading-font-size;
            @include rtl-text-align-left();
            border: none; 
            > span{
                position: relative; 
                padding: 0 10px;
                &:after, &:before{
                    content: "";
                    height: 0;
                    width: 0;
                    background: none;
                }
               
                > span{ 
                    position: relative;
                    padding: 0 10px;
                    &:after, &:before{
                       content: "";
                        height: 0;
                        width: 0;
                        background: none;
                    }
                }
            }   
        }
        .#{$block-content-selector}{
            border:none;
            padding: 0
        }
    }
}

/************************************************************************************************
    WIDGET SEARCH
*************************************************************************************************/
.widget_search{
    .container{
        padding: 0;
        input[type="text"]{
            border: 0;
            padding: 0;
        }
    }
	.form-content{
		position:relative;
		input[type="text"]{
			border-bottom: 2px solid $gray-dark;
			@include border-radius(0);
			@include rtl-padding(0, 30px, 5px, 0);
			width:100%;
		}
		#searchsubmit{
			position:absolute;
			top:0;
			@include rtl-right(0);
			padding:0 10px;
			&:hover{
				i{
					color:$theme-color;
				}
			}
		}
	}
    .search-from .btn{
		background:transparent;
		border:0;
		line-height:0;
    }
}

/************************************************************************************************
    Bingo Filter Hompage
*************************************************************************************************/
.bwp-filter-homepage{
    @media (max-width:$screen-md-max){
		.slick-list{
			margin:0 -7.5px !important;
			.slick-slide {
				padding:0 7.5px !important;
			}
		}
	}
    .bwp-filter-heading{
        display: inline-block;
        width: 100%;
        vertical-align: top;
        overflow: hidden;
        ul{
            list-style-type: none;
            right: 0;
            left: auto;
            padding: 0;
			li{
				@include transition(all 0.3s ease);
			}
        }
		.category-nav{
			display:inline-block;
			text-align:center;
		}
        ul.filter-category{
            padding: 0;
            li{
                display:inline-block;
                &:hover,&.active{
                    cursor: pointer;
                }
            }
        }
        .bwp-filter-toggle{
            font-weight: 500;
            display: inline-block;
            position: relative;
            font-size: 12px;
            text-transform: uppercase;
			cursor: pointer;
			color:$gray-dark;
			padding:0 15px 0 35px;
			line-height:32px;
			border:2px solid $gray-dark;
			position:relative;
			top:20px;
            &:before{
                position: absolute;
                content: "\ea02";
                font-family: feather;
                font-size: 0;
                color: $brand-danger;
                @include transform(scale(0));
                opacity: 0;
                visibility: hidden;
                @include transition(transform 0.2s ease);
				left:15px;
				font-size: 16px;
				top: calc(50% - 8px);
				line-height:1;
            }
			i{
				font-size: 16px;
				position: absolute;
				top: calc(50% - 8px);
				left:15px;
			}
            &.active{
				i{
					display:none;
				}
                &:before{
                    @include transform(scale(1));
                    opacity: 1;
                    visibility: visible;
                }
            }
			&:hover{
				border-color:$theme-color;
				color:$theme-color;
			}
        }
        .filter-order-by{
            &.open{
                >button{
                    color: $theme-color;
                    &:before{
                        opacity: 1;
                        width: 100%;
                    }
                    .caret{
                        &:before{
                            content: "\32";
							font-family: ElegantIcons;
                        }
                    }
                }
            }
            >.dropdown-menu{
                top: calc(100% + 5px);
                padding: 10px 20px;
                line-height: 28px;
				min-width:200px;
            }
            >button{
                text-transform: uppercase;
                background: transparent;
                border: 0;
                color: $gray-dark;
                font-weight: 500;
                font-size: 15px;
                padding: 0;
                &:focus{
                    outline: none;
                }
                .caret{
                    &:before{
                        content: "\33";
						font-family: ElegantIcons;
						font-size: 22px;
						font-size: 16px;
						position: relative;
						top: -3px;
                    }
                }
                &:hover{
                    color: $theme-color;
                }
            }
            ul li{ 
                cursor: pointer; 
                &:hover{
                    color: $theme-color;
                }
            }
        }
    }
	.bwp-filter-attribute{
		display: none;
		width: 100%;
		margin-bottom: 15px;
		.bwp-filter-attribute-inner{
			display: flex;
			flex-wrap:wrap;
			width: 100%;
			padding-top: 30px;
			@media (max-width: $screen-xs-max) {
				display: inline-block;
				padding-top: 0;
			}
			@media (min-width: $screen-sm) {
				padding: 37px 25px 30px;
				border: 1px solid $border-color;
				margin-bottom: 60px;
			}
			@media (max-width: $screen-sm-max) and (min-width: $screen-sm){
				padding-top: 20px;
				padding-bottom: 30px;
			}
			> div{
				flex:1;
				padding:0 15px;
				@media (max-width: $screen-sm-max) {
					flex:0 0 50%;
					margin-bottom:30px;
				}
				@media (max-width: $screen-xs-max) {
					width: 100%;
					padding: 0 !important;
					margin-bottom: 25px;
					display: inline-block;
				}
				ul{
					list-style:none;
					padding:0;
					li{
						float: left;
						width: 50%;
						padding: 5px 0;
						span{
							color: $text-color;
							cursor: pointer;
							&:hover{
								color: $gray-dark;
							}
						}
					}
					&:not(.pa_color){
						li{
							span{
								position:relative;
								&:before{
									content:"";
									@include square(17px);
									cursor: pointer;
									overflow: visible;
									display: inline-block;
									vertical-align: middle;
									border:1px solid #cccccc;
									@include rtl-margin-right(10px);
									position:relative;
									top:-2px;
								}
							}
							&.active{
								span{
									color:$gray-dark;
									&:before{
										border-color:$gray-dark;
									}
									&:after{
										content: "\f00c";
										font-family: FontAwesome;
										position: absolute;
										top: 4px;
										left: 4px;
										font-size: 11px;
										color: $gray-dark;
									}
								}
							}
						}
					}
				}
				&.bwp-filter-color{
					order: 1;
					.pa_color{
						li{
							.color{
								display: inline-block;
								vertical-align: top;
								@include square(16px);
								@include rtl-margin-right(10px);
								@include transform(translateY(3px));
								padding: 0;
								@include transition(transform 0.1s ease);
								@include border-radius(50%);
								&:before{
									content:"";
									@include square(22px);
									@include border-radius(50%);
									top:calc(50% - 11px);
									left:calc(50% - 11px);
									position:absolute;
									border:1px solid #cccccc;
								}
							}
							&.active{
								span{
									color:$gray-dark;
								}
								.color{
									&:before{
										border-color:$gray-dark;
									}
									&:after{
										display:none;
									}
								}
							}
						}
					}
					li[data-value="white"]{
						.color{
							border: 1px solid $border-color;
						}
						&.active{
							.color{
								&:before{
									top: -2px;
									@include rtl-left(5.5px);
									color: $theme-color;
								}
							}
						}
					}
				}
				&.bwp-filter-price{
					order: 3;
					h2{
						margin-bottom: 45px;
					}
					.bwp_slider_price{
						margin: 0;
						background: transparent;
						@include box-shadow(inset 0px 1px 3px 3px rgba(0, 0, 0, 0.2));
						height: 5px;
						@include border-radius(10px);
						width: calc(100% - 20px);
						&:after, &:before{
							display: none;
						}
						.ui-slider-handle{
							@include size(10px,14px);
							border: 1px solid $theme-color;
							background:$theme-color;
							top: -5px;  
						}
						.ui-slider-range{
							height: 5px;
							background: $theme-color;
							position: absolute;
							@include transform(translateX(10px));
							width: calc(100% -50px) !important;
						}
					}
					.price-input{
						margin-top: 20px;
						font-size: 14px;
						color: $gray-dark;
						font-weight:500;
						>span:not(.text-price-filter){
							color:$text-color;
							font-weight:400;
						}
					}
				}
				&.bwp-filter-brand{
					order: 2;
				}
			}
		}
		.clear_all{
			span{
				background: $theme-color;
				color: $white;
				text-transform: uppercase;
				padding: 5px 10px;
				font-size: 12px;
				display: inline-block; 
				&:hover{
					cursor: pointer;
					background: $gray-dark;
				}  
			}     
		}
		h2{
			color: $gray-dark;
			padding: 0 0 15px;
			background: transparent;
			font-weight: 500;
			font-size: 14px;
			margin: 0px 0 40px 0;
			position: relative;
			text-transform: uppercase;
			border-bottom: 1px solid $gray-light;
			letter-spacing: 3.2px;
		}
	}
	&.filter.slider{
		.bwp-filter-heading{
			overflow:unset;
		}
	}
	&.filter-default{
		.bwp-filter-heading{
			display:flex;
			justify-content:space-between;
			margin-bottom:50px;
			flex-wrap:wrap;
			ul{
				li{
					font-size:20px;
					margin:0 25px;
					position:relative;
					padding:15px 0;
					font-weight:500;
					&:before{
						content:"";
						position:absolute;
						bottom:0;
						@include size(0,2px);
						background:$gray-dark;
						@include transition(all 0.3s ease);
						left:50%;
						@include transform(translateX(-50%));
					}
					.item-count{
						position:absolute;
						top:0;
						font-size:14px;
						@include rtl-right(-10px);
					}
					&.active,&:hover{
						color:$gray-dark;
						&:before{
							width:100%;
						}
					}
					@media (max-width:$screen-sm-max){
						margin:0 15px;
						font-size:16px;
					}
				}
			}
			@media (max-width:$screen-sm-max){
				.filter-content{
					order:2;
					margin-top:10px;
					a{
						top:0;
					}
				}
			}
			@media (max-width:$screen-xs-max){
				.filter-content{
					flex:0 0 100%;
					margin-top:30px;
				}
				.filter-category{
					flex:0 0 100%;
					text-align:center;
				}
			}
			@media (max-width:$screen-xs){
				.filter-content{
					a{
						width:100%;
					}
				}
				.filter-category{
					li{
						margin:0 0 5px;
						width:100%;
						padding:10px;
						background:#f5f5f5;
						&:before{
							display:none;
						}
						.item-count{
							display:inline-block;
							font-size:12px;
							position:relative;
							top:-10px;
							right:0;
						}
					}
				}
			}
		}
		.products_loadmore{
			.btn.loadmore{
				margin-top:30px;
				line-height: 40px;
				height:44px;
				padding: 0 30px;
				background:transparent;
				color:$gray-dark;
				font-size:16px;
				font-weight:500;
				@include border-radius(0);
				letter-spacing:0;
				border:2px solid $gray-dark;
				span{
					padding:0;
					&:before{
						display:none;
					}
				}
				i{
					line-height:1;
					@include size(20px,15px);
					display:none;
					&:before{
						position:relative;
						left:1px;
					}
				}
				&:hover{
					i{
						color:$theme-color !important;
					}
				}
				&.loading{
					i{
						display:block;
					}
				}
			}
		}
	}
	&.tab_category_icon{
		.filter-category{
			text-align:center;
			display:flex;
			max-width:990px;
			margin:0 auto 40px;
			border:2px solid #e6e6e6;
			li{
				flex:1;
				@include rtl-border-right(1px solid #e6e6e6);
				padding:35px 15px 30px;
				&:last-child{
					@include rtl-border-right(0);
				}
				&.active,&:hover{
					a{
						h2{
							color:$gray-dark;
						}
						.item-icon{
							color:$theme-color;
						}
					}
				}
			}
		}
		.name-category{
			h2{
				font-size:14px;
				text-transform:uppercase;
				font-weight:700;
				color:$text-color;
				margin:10px 0 0;
			}
			.item-icon{
				font-size:45px;
				line-height:1;
				color:$text-color;
			}
		}
		.rating{
			display:none !important;
		}
		@media (max-width:$screen-xs){
			.filter-category{
				flex-wrap:wrap;
				li{
					width:100%;
					flex:0 0 100%;
					@include rtl-border-right(0);
					border-bottom:1px solid #e6e6e6;
					padding:15px;
					&:last-child{
						border-bottom:0;
					}
				}
			}
			.name-category .item-icon{
				font-size:20px;
			}
		}
	}
	&.tab_category_slider_2{
		.slick-arrow{
            opacity: 1 !important;
            visibility: visible !important;
            font-size: 24px;
            font-family: icomoon;
            @include square(35px);
            background: transparent;
            line-height:35px;
            &.fa-angle-right{
                right: -40px;
                @include transform(scaleX(-1));
                &:before{
                    content:"\e909";
                }
            }
            &.fa-angle-left{
                left: -40px;
                &:before{
                    content:"\e909";
                }
            }
            @media(max-width:1440px){
                 &.fa-angle-left{
                    left: 0;
                }
                &.fa-angle-right{
                    right:0;
                }
            }
        }
		.bwp-filter-heading{
			margin-bottom: 45px;
			.category-tab-nav{
				display:flex;
				justify-content:space-between;
				flex-wrap:wrap;
				align-items: flex-end;
				flex: 1;
				@media (max-width:$screen-xs){
					padding-bottom:5px;
				}
				.filter-category{
					white-space: nowrap;
					overflow: hidden;
					overflow-x: auto;
				}
			}
		}
		.title-block{
			h2{
				span{
					font-weight: 200;
				}
			}
		}
		.filter-category{
			li{
				a{
					font-size:14px;
					font-weight:400;
					@include transition(all .5s ease);
					display:inline-block;
					text-transform: uppercase;
					position:relative;
					-webkit-background-clip: text;
				    -webkit-text-fill-color: transparent;
				    background-image: linear-gradient(to right, $gray-dark, $gray-dark 50%, $gray-color 50%);
				    background-size: 200% 100%;
				    background-position: 100%;
				    transition: all 1s ease-in-out;
					&:before{
						content:"";
						display:inline-block;
						margin:0 25px 0 10px;
						height:35px;
						width:1px;
						@include transform(rotate(-30deg) translateY(50%));
						background:$text-color;
					}
				}
				&.active, &:hover{
					a{
						background-position: 0% 0%;
					}
				}
				&:first-child{
					a:before{
						display:none;
					}
				}
			}
		}
		@media (max-width:$screen-sm-max){
			.bwp-filter-heading{
				.category-tab-nav{
					text-align: center;
					display: block;
				}
			}
		}
		@media(max-width:$screen-xs-max){
			.bwp-filter-heading{
				margin-bottom: 55px;
				.category-tab-nav{
					@include rtl-text-align-left();
				}
			}
	        .slick-arrow{
	            display: none !important;
	        }
		}
	}
	&.tab_category_default{
		.bwp-filter-heading{
			margin-bottom: 45px;
			.content-filter{
				display:flex;
				justify-content:space-between;
				flex-wrap:wrap;
				align-items: flex-end;
				flex: 1;
				@media (max-width:$screen-sm-max){
					padding-bottom:5px;
					display: block;
					text-align: center;
				}
				.filter-category{
					white-space: nowrap;
					overflow: hidden;
					overflow-x: auto;
				}
			}
		}
		.title-block{
			h2{
				span{
					font-weight: 200;
				}
			}
		}
		.filter-category{
			li{
				a{
					font-size:14px;
					font-weight:400;
					@include transition(all .5s ease);
					display:inline-block;
					text-transform: uppercase;
					position:relative;
					-webkit-background-clip: text;
				    -webkit-text-fill-color: transparent;
				    background-image: linear-gradient(to right, $gray-dark, $gray-dark 50%, $gray-color 50%);
				    background-size: 200% 100%;
				    background-position: 100%;
				    transition: all 1s ease-in-out;
					&:before{
						content:"";
						display:inline-block;
						margin:0 25px 0 10px;
						height:35px;
						width:1px;
						@include transform(rotate(-30deg) translateY(50%));
						background:rgba($gray-dark, .6);
					}
				}
				&.active, &:hover{
					a{
						background-position: 0% 0%;
					}
				}
				&:first-child{
					a:before{
						display:none;
					}
				}
			}
		}
		@media(max-width: $screen-md-max){
			.row{
				margin: 0 -7.5px;
				.item{
					padding: 0 7.5px;
				}
			}
		}
	}
	&.tab_category_slider{
		.slick-arrow{
            opacity: 1 !important;
            visibility: visible !important;
            font-size: 24px;
            font-family: icomoon;
            @include square(35px);
            background: transparent;
            line-height:35px;
            &.fa-angle-right{
                right: -52px;
                @include transform(scaleX(-1));
                &:before{
                    content:"\e909";
                }
            }
            &.fa-angle-left{
                left: -52px;
                &:before{
                    content:"\e909";
                }
            }
            @media(max-width:1440px){
                 &.fa-angle-left{
                    left: 0;
                }
                &.fa-angle-right{
                    right:0;
                }
            }
        }
		.bwp-filter-heading{
			margin-bottom: 65px;
			.category-tab-nav{
				display:flex;
				justify-content:space-between;
				flex-wrap:wrap;
				align-items: flex-end;
				white-space: nowrap;
				overflow: hidden;
				overflow-x: auto;
				flex: 1;
				@media (max-width:$screen-xs){
					padding-bottom:5px;
				}
			}
		}
		.title-block{
			h2{
				span{
					font-weight: 200;
				}
			}
		}
		.filter-category{
			li{
				a{
					font-size:11px;
					font-weight:400;
					color:rgba($gray-dark, .6);
					@include transition(all .5s ease);
					display:inline-block;
					text-transform: uppercase;
					position:relative;
					@include border-radius(30px);
					margin: 0 14px;
					position: relative;
					-webkit-background-clip: text;
				    -webkit-text-fill-color: transparent;
					background-image: linear-gradient(to right, $gray-dark, $gray-dark 50%, $gray-color 50%);
				    background-size: 200% 100%;
				    background-position: 100%;
				    @include transition(all 1s ease-in-out);
					&:before{
						font-family:icomoon;
						@include transition(all .5s ease-in-out);
						content: "\e91c";
						font-size: 16px;
						position: absolute;
						@include rtl-left(0);
						-webkit-text-fill-color:$gray-dark;
						@include transform(translateY(-35px));
						@include opacity-h();
					}
				}
				&.active, &:hover{
					a{
						color: $gray-dark;
						background-position:0%;
						&:before{
							@include opacity-s();
							@include transform(translateY(-26px));
						}
					}
				}
				&:last-child{
					a{
						@include rtl-margin-right(0);
					}
				}
				&:first-child{
					a{
						@include rtl-margin-left(0);
					}
				}
			}
		}
		 @media(max-width: $screen-md-max){
		 	.bwp-filter-heading{
		 		margin-bottom: 45px;
		 	}
        }
		@media (max-width:$screen-sm-max){
			.bwp-filter-heading{
				.category-tab-nav{
					text-align: center;
					display: block;
					.title-block{
						margin-bottom: 30px;
					}
				}
			}
		}
		@media(max-width:$screen-xs-max){
			.bwp-filter-heading{
				.category-tab-nav{
					@include rtl-text-align-left();
				}
			}
			@include rtl-margin-right(-100px);
	        .slick-arrow{
	            display: none !important;
	        }
		}
	}
	&.tab_category_scroll{
		.bwp-filter-heading{
			margin-bottom:60px;
			padding:0 15px;
			.filter-category{
				text-align:center;
				li{
					margin:0 5px;
					a{
						font-size:20px;
						color:$text-color;
						display:inline-block;
						border:1px solid $text-color;
						font-family:$font-family-second;
						padding:8px 70px;
						&:hover{
							border-color:$gray-dark;
							color:$gray-dark;
						}
					}
					&.active{
						a{
							border-color:$gray-dark;
							color:$gray-dark;
						}
					}
				}
			}
		}
		.product-content{
			.item-product{
				padding:0 15px;
			}
		}
		.content-scroll-list{
			overflow:hidden;
			@include rtl-padding-right(215px);
			@media (max-width:$screen-md-max){
				@include rtl-padding-right(0);
			}
		}
		.scrollbar{
			margin: 50px 15px 0;
			height: 1px;
			background: #dfdfdf;
			line-height: 0;
			cursor: pointer;
			.handle{
				background: #000000;
				height: 3px;
				position: relative;
				top: -1px;
			}
			.mousearea{
				position: absolute;
				top: -37px;
				left: 0;
				width: 100%;
				height: 20px;
				font-size: 14px;
				text-transform: uppercase;
				color: #000;
				white-space: nowrap;
				font-family:$font-family-second;
				line-height:20px;
				i{
					font-size:20px;
					line-height:20px;
					position:relative;
					top:3px;
					@include rtl-margin-left(10px);
				}
				&:hover{
					color:$theme-color;
				}
			}
		}
		.controls{
			button{
				position:absolute;
				top:33%;
				@include square(33px);
				background:transparent;
				border:1px solid $gray-dark;
				cursor:pointer;
				@include border-radius(0);
				color:$gray-dark;
				&.prev{
					@include rtl-left(0);
				}
				&.next{
					@include rtl-right(0);
				}
				&.disabled{
					cursor:no-drop;
					opacity:1;
				}
				&:hover{
					background:$gray-dark;
					color:$white;
				}
			}
		}
		@media (max-width:$screen-xs-max){
			.bwp-filter-heading{
				.filter-category{
					li{
						a{
							font-size:20px;
							padding:8px 20px;
						}
					}
				}
			}
		}
		@media (max-width:$screen-xs){
			.bwp-filter-heading{
				.filter-category{
					li{
						display:block;
						width:100%;
						margin:0 0 5px;
						a{
							font-size:20px;
							padding:8px 20px;
							width:100%;
						}
					}
				}
			}
		}
	}
    &.loadmore{
		.bwp-filter-heading{
			margin-bottom:40px;
			.filter-order-by{
				float:unset;
				margin:0;
				ul{
					li{
						display:inline-block;
						font-size:12px;
						color: rgba($gray-dark, .7);
						text-transform:uppercase;
						letter-spacing: 4px;
						@include rtl-margin-right(20px);
						&:last-child{
							@include rtl-margin-right(0);
						}
						span{
							position:relative;
							padding-bottom: 3px;
							&:before{
								content:"";
								position:absolute;
								bottom:0;
								left:50%;
								@include transform(translateX(-50%));
								@include transition(all 0.3s ease);
								@include opacity-h();
								background:$gray-dark;
								@include size(0,1px);
							}
						}
						&.active,&:hover{
							color:$gray-dark;
							span{
								&:before{
									width:100%;
									@include opacity-s();
								}
							}
						}
						@media (max-width:$screen-xs-max){
							margin:0 0 10px;
							width:100%;
							padding: 0 15px;
						}
					}
				}
			}
			@media(max-width: $screen-xs-max){
				text-align: center;
			}
		}
		.products_loadmore{
			.btn.loadmore{
				margin-top:0;
				@include square(130px);
				line-height: 130px;
				@include border-radius(50%);
				border: 1px solid rgba($gray-dark, .2);
				color:$gray-dark;
				font-size:12px;
				letter-spacing: 4px;
				text-transform: uppercase;
				text-align: center;
				padding: 0 10px;
				span{
					position: relative;
					display: inline-block;
					left: 2px;
					&:after{
						position: absolute;
						content: "\e902";
						bottom: 5px;
						left: 0;
						width: 100%;
						font-size: 17px;
						line-height: 20px;
						font-family: icomoon;
						margin-bottom: 18px;
						@include transform(rotate(90deg));
					}
				}
				&.loading{
					.lds-dual-ring {
						position: absolute;
						top: 50%;
						left: 50%;
						@include transform(translate(-50%, -50%));
						display: inline-block;
						@include square(45px);
					}
					.lds-dual-ring{
						&:before{
							position: absolute;
							content: "";
							display: inline-block;
							top: calc(50% - 12px);
							left: calc(50% - 12px);
							@include square(25px);
							@include border-radius(50%);
							border: 3px solid #000;
							border-color: #000 transparent #000 transparent;
							animation: lds-dual-ring 1.2s linear infinite;
						}
					}
				}
				&:hover{
					background:$theme-color;
					border-color: $theme-color;
					&.loading{
						.lds-dual-ring{
							&:before{
								border: 3px solid #fff;
								border-color: #fff transparent #fff transparent;
							}
						}
					}
				}
			}
		}
		@media(max-width: $screen-md-max){
			.row{
				margin: 0 -7.5px;
				.item{
					padding: 0 7.5px;
				}
			}
		}
    }
	&.tab_product_default{
		.bwp-filter-heading{
			margin-bottom:60px;
			.filter-orderby{
				text-align:center;
				white-space: nowrap;
				overflow: hidden;
				overflow-x: auto;
				li{
					display:inline-block;
					text-transform:uppercase;
					font-family: $font-family-base;
					line-height:35px;
					color:rgba($gray-dark, .3);
					font-size: 35px;
					font-weight:700;
					-webkit-background-clip: text;
				    -webkit-text-fill-color: transparent;
					background-image: linear-gradient(to right, $gray-dark, $gray-dark 50%, $gray-color 50%);
				    background-size: 200% 100%;
				    background-position: 100%;
				    @include transition(all 1s ease-in-out);
					&:before{
						content:"";
						display:inline-block;
						margin:0 40px 0 10px;
						height:40px;
						width:1px;
						@include transform(rotate(-25deg) translateY(50%));
						background:rgba($gray-dark, .3);
						position: relative;
						top: -10px;
						left: 5px;
					}
					&:first-child{
						&:before{
							display:none;
						}
					}
					&.active, &:hover{
						color: $gray-dark;
						background-position:0%;
					}
					@media(max-width: $screen-md-max){
						font-size: 25px;
					}
				}
			}
		}
		@media(max-width: $screen-md-max){
			.row{
				margin: 0 -7.5px;
				.item{
					padding: 0 7.5px;
				}
			}
		}
	}
	&.tab_product_default_2{
		.bwp-filter-heading{
			margin-bottom:40px;
			text-align: center;
			.filter-orderby{
				li{
					display:inline-block;
					text-transform:uppercase;
					padding:0 32.5px;
					font-family: $font-family-base;
					line-height:36px;
					color:rgba($gray-dark, .3);
					font-size: 35px;
					font-weight:700;
					&:first-child{
						@include rtl-padding-left(0);
					}
					@media(max-width: $screen-md-max){
						font-size: 22px;
						padding:0 15px;
					}
					span{
						font-weight: 200;
					}
					&.active, &:hover{
						color:$gray-dark;
					}
				}
				@media(max-width: $screen-xs-max){
					white-space: nowrap;
					overflow: hidden;
					overflow-x: auto;
					padding-bottom:5px;
				}
			}
		}
		.products-list{
			&.grid{
				.banner-product{
					margin: 0 15px 30px 0;
				}
			}
		}
		@media(max-width: $screen-md-max){
			.row{
				margin: 0 -7.5px;
				.item{
					padding: 0 7.5px;
				}
			}
		}
	}
	&.tab_product_slider{
		.bwp-filter-heading{
			margin-bottom: 52px;
			white-space: nowrap;
			overflow: hidden;
			overflow-x: auto;
			.filter-orderby{
				text-align: center;
				li{
					font-size:35px;
					padding: 0 30px;
					line-height:34px;
					position:relative;
					font-family: $font-family-base;
					letter-spacing: 1px;
					color: rgba($gray-dark,.4);
					display: inline-block;
					text-transform: uppercase;
					position: relative;
					@include transition(all 0.5s ease);       
					font-weight:700;
					&:after{
						content: "";
					    position: absolute;
					    background: rgba($gray-dark,.3);
					    @include rtl-right(0);
					    top: -4px;
					    transform: rotate(-20deg);
					    width: 1px;
					    height: 40px;
					}
					&:first-child{
						@include rtl-padding-left(0);
					}
					&:last-child{
						@include rtl-padding-right(0);
						&:after{
							display: none;
						}
					}
					&:hover, &.active{
						color: $gray-dark;
					}		
				}
			}
		}
		@media (max-width:$screen-sm-max){
			.bwp-filter-heading{
				.filter-orderby{
					li{
						font-size: 25px;
					}
				}
			}
		}
		@media(max-width:$screen-sm-max){
			.bwp-filter-heading{
				margin-bottom: 35px;			
			}
		}
	}
	&.tab_product_slider_2{
		.slick-arrow{
            opacity:1 !important;
            visibility: visible !important;
            top: -80px;
            font-size: 20px;
            @include square(35px);
            line-height:35px;
            border:1px solid $very-light-gray;
            @include border-radius(50%);
            &.fa-angle-right{
                @include rtl-right(0);
            }
            &.fa-angle-left{
                left: auto;
                @include rtl-right(45px);
            }
            &:hover{
                border: 1px solid transparent;
                background: $theme-color;
                color: $white;
            }
            @media(max-width:$screen-xs){
                top: -60px;
                &.fa-angle-left{
                    left:0;
                }
            }
        }
		.bwp-filter-heading{
			margin-bottom:45px;
			.filter-orderby{
				display:flex;
				justify-content:flex-start;
				li{
					font-size:20px;
					margin: 0 23px;
					position:relative;
					line-height: 40px;
					padding: 0;
					position: relative;
					background: transparent;
					text-transform: capitalize;
					@include border-radius(25px);
					color: $text-color;
					@include transition(all 0.5s ease);       
					font-weight:800;
					&:first-child{
						@include rtl-margin-left(0);
					}
					&:hover{
						color: $gray-dark;
					}
					&.active{
						padding: 0 28px;
						background: rgba(#3cc3b5, .15);
						color: $gray-dark;
					}
					@media(max-width:$screen-sm-max){
						margin: 0 10px;
						font-size: 17px;
						&.active{
							padding: 0 20px;
						}
					}		
				}
			}
		}
		@media (max-width:$screen-xs-max){
			.bwp-filter-heading{
				margin-bottom: 80px;
				.filter-orderby{
					flex-wrap:wrap;
					li{
						@include rtl-margin-right(0);
						padding:0 5px;
						background:#f5f5f5;
						border: 1px solid transparent;
						text-align:center;
						margin-bottom:5px;
						line-height: 40px;
						width:100%;
						&:before{
							display:none;
						}
						&:hover,&.active{
							border: 1px solid $theme-color;
							background: transparent;
						}
					}
				}
			}
		}
	}
	&.tab_product_slider_3{
		.box-content{
			display: flex;
			.bwp-filter-heading{
				width: 305px;
				background: url('#{$image-theme-path}background-product.png') no-repeat;
				background-size: contain;
			}			
			.bwp-filter-content{
				width: calc(100% - 305px);
				@include rtl-padding-left(30px);
			}
			@media(max-width:$screen-sm-max){
				.bwp-filter-heading{
					width: 255px;
				}
				.bwp-filter-content{
					width: calc(100% - 255px);
					@include rtl-padding-left(15px);
				}
			}
			@media(max-width:$screen-xs-max){
				display: block;
				.bwp-filter-heading{
					width: 100%;
					background-size: cover;
					margin-bottom: 15px;
				}
				.bwp-filter-content{
					width: 100%;
					@include rtl-padding-left(0);
				}
			}
		}
		.bwp-filter-heading{
			.filter-orderby{
				li{
					font-size:20px;
					position:relative;
					line-height: 60px;
					text-align: center;
					padding: 0;
					position: relative;
					background: transparent;
					text-transform: capitalize;
					@include transition(all 0.5s ease);       
					font-weight:800;
					padding: 0 15px;
					color: $gray-dark;
					border-bottom: 1px solid $very-light-gray;
					&.active, &:hover{
						background:#3cc3b5;
						color: $white;
						border-bottom: 1px solid transparent;
					}		
				}
			}
		}
	}
	&.filter{
		&.slider{
			.bwp-filter-heading{
				.filter-category{
					margin-bottom:50px;
					li{
						margin:0;
						@include rtl-margin-right(10px);
						padding:0;
						&:last-child{
							@include rtl-margin-right(0);
						}
						span{
							font-size:15px;
							color:$text-color;
							text-transform:capitalize;
							padding:0 20px;
							line-height:25px;
							font-weight:600;
						}
						&.active,&:hover{
							span{
								background:$theme-color;
								color:$white;
							}
						}
					}
				}
				.filter-order-by{
					margin:0;
					margin-top:-1px;
					@media (max-width: $screen-sm-max) {
						@include rtl-margin-left(30px);
					}
					>button{
						font-size:12px;
						color:$text-color;
						line-height:24px;
						padding:0 20px;
						border:1px solid $text-color;
						.caret{
							line-height:1;
							&:before{
								top:0;
							}
						}
					}
				}
				.bwp-filter-toggle{
					font-size:12px;
					color:$text-color;
					line-height:24px;
					padding:0 20px;
					border:1px solid $text-color;
					margin:0;
					@include rtl-margin-left(10px);
					&:after{
						display:none;
					}
					&:before{
						display:none;
					}
					i{
						font-size:18px;
						top:5px;
					}
					&.active{
						&:after{
							display:none;
						}
						i{
							display:inline-block;
							&:before{
								display:inline-block;
								position: relative;
								top: -3px;
								content: "\ea02";
								font-family: feather;
							}
						}
					}
				}
			}
			.bwp-filter-content {
				.slick-dots {
					@media (max-width: $screen-md-max) {
						bottom: 0;
					}
				}
			}
		}
	}
}
.main-archive-product{
	.content-products-list{
		position:relative;
		&.active{
			>.banner-shop{
				opacity: 0;
			}
			.products-list{ 
				&.grid{
					.products-thumb{
						background:#f5f5f5;
						&:before{
							@include opacity-s();
						}
						img{
							opacity:0 !important;
						}
						.product-lable >div{
							background:#fff;
							color:transparent;
							&:before{
								@include opacity-s();
							}
						}
						.countdown,.product-stock{
							@include opacity-h();
						}
					}
					.products-content {
						h3.product-title{
							a{
								color:transparent;
								background:#f5f5f5;
								&:before{
									@include opacity-s();
								}
							}
						}
						.price {
							color:transparent;
							background:#f5f5f5;
							&:before{
								@include opacity-s();
							}
							del,ins{
								color:transparent;
							}
						}
						.product-attribute,.btn-atc,.rating{
							@include opacity-h();
						}
					}
				}
			}
		}
		>.loading{
			position: absolute;
			top: 0;
			left: calc(50% - 40px);
		}
		ul.products-list{
			.col-xl-6{
				.products-thumb{
					width: 100%;
					img{
						width: 100%;
					}
				}
			}
		}
	}
	@media (max-width:$screen-md-max){
		.content-products-list{
			>.row{
				margin:0 -7.5px;
				>li{
					padding:0 7.5px;
				}
			}
		}
	}
}
ul.products-list{
	padding: 0;
    list-style: none;
	
}
.bwp-filter-content, ul.products-list{
    position: relative;
    >.content, >.content-product-list{
        @include transition(opacity 0.2s ease);
		.slick-arrow{
			opacity:0;
			visibility:hidden;
			@media(max-width:$screen-sm-max){
				opacity:1;
				visibility:visible;
			}
			@media(max-width:$screen-xs-max){
				visibility:hidden;
			}
		}
		&:hover{
			.slick-arrow{
				opacity:1;
				visibility:visible;
			}
		}
    }
	&.active{
		.products-thumb{
			background:#f5f5f5;
			&:before{
				@include opacity-s();
			}
			img{
				opacity:0 !important;
			}
			.product-lable >div{
				background:#fff;
				color:transparent;
				&:before{
					@include opacity-s();
				}
			}
			.countdown,.product-stock{
				@include opacity-h();
			}
		}
		.products-content {
			h3.product-title{
				a{
					color:transparent;
					background:#f5f5f5;
					&:before{
						@include opacity-s();
					}
				}
			}
			.price {
				color:transparent;
				background:#f5f5f5;
				&:before{
					@include opacity-s();
				}
				del,ins{
					color:transparent;
				}
			}
			.product-attribute,.btn-atc,.rating{
				opacity:0 !important;
			}
		}
    }
    >.loading-filter{
        position: absolute;
        top: 0;
        left: calc(50% - 50px);
    }
}

/************************************************************************************************
    Bingo Woo Tab Caterories
*************************************************************************************************/
.bwp-woo-tab-cat{
    .bwp-category-tab{
        text-align: center;
        margin-bottom: 32px;
        ul.nav-tabs{
            display: inline-block;
            float: none;
            li{
                padding: 0;
                float: none;
                display: inline-block;
                a{
                    font-size: 16px;
                    padding: 0 20px;
                    text-transform: uppercase;
                    font-weight: 700;
                    position: relative;
                    @media (max-width: $screen-xs){
                        padding: 0 10px;
                    }
                    &:after{
                        top: 0;
                        content: "/";
                        color: $light-gray;
                        position: absolute;
                        @include rtl-right(-1px);
                        @media (max-width: $screen-xs){
                            display: none;
                        }
                    }
                    &:before{
                        display: none;
                    }
                }
                &:last-child{
                    a{
                        &:after{
                            display: none;
                        }
                    }
                }
            }
        }
    }
    .tab-content{
        position: relative;
    }
    .tab-pane{
        display: block !important;
        &.active{
            .slick-arrow{
                display: block !important;
            }
        }
    }
    &.slider{
		.row{
			display:flex;
			align-items:center;
			@media (max-width:$screen-sm-max){
				display:block;
			}
		}
		.category-nav{
			.category{
				position:relative;
				margin-bottom:30px;
				.name-category{
					position:absolute;
					font-size:18px;
					color:$gray-dark;
					font-weight:700;
					bottom:20px;
					@include rtl-left(50%);
					@include transform(translateX(-50%));
					margin:0;
					&:hover{
						color:$theme-color;
					}
				}
			}
		}
		.title-block{
			position:absolute;
			z-index:99;
			h2{
				font-size:35px;
				font-weight:500;
				color:$gray-dark;
				margin:0;
				margin-top:-7px;
				display:inline-block;
			}
		}
		.category{
			padding:86px 15px;
			.category-content{
				width: 55%;
				@include rtl-padding(72px, 30px, 153px, 30px);
				background: #fff;
				background:$white;
				.name-category{
					text-transform:uppercase;
					font-size:18px;
					color:$gray-dark;
					font-weight:500;
					margin-bottom:35px;
					display:block;
					&:hover{
						color:$theme-color;
					}
				}
				.description-category{
					color:$text-color;
					
				}
				@media (max-width:$screen-sm-max){
					width:50%;
				}
				@media (max-width:$screen-xs-max){
					width:100%;
				}
			}
			.category-img{
				position: absolute;
				top: 0;
				@include rtl-right(20px);
				@include box-shadow(3px 4px 5px 0px rgba($gray-dark, 0.25));
				@media (max-width:$screen-md-max){
					max-width:280px;
					top:130px;
				}
				@media (max-width:$screen-sm-max){
					right: 120px;
				}
				@media (max-width:$screen-xs-max){
					display:none;
				}
			}
		}
		.slick-arrow{
			border: none;
			background: #f5f5f5;
			@include border-radius(0);
			top: auto;
			@include rtl-left(45px);
			bottom: 27%;
			@include square(34px);
			line-height:34px;
			color:$text-color;
			&.fa-angle-right{
				@include rtl-left(88px);
			}
			&:hover{
				background:$theme-color;
				color:$white;
			}
		}
		.prodcut-slider{
			.products-list{
				padding-top:40px;
				padding:0;
			}
		}
    }
}

/************************************************************************************************
    Bingo Woo Caterories
*************************************************************************************************/
.bwp_widget_woo_categories.widget{
    margin-bottom: 0;
}
.bwp-woo-categories{
	.content-category:not(.slick-carousel){
		display: flex;
    	flex-wrap: wrap;
    	list-style: none;
	}
	@media (max-width:$screen-md-max){
		.slick-list{
			margin:0 -7.5px;
			.item-product-cat{
				padding:0 7.5px;
			}
		}
	}
	@media(min-width: $screen-md-max){
		.slick-arrow{
			&.fa-angle-left{
				left: -60px; 
			}
			&.fa-angle-right{
				right: -60px;
			}
		}
	}
	&:hover{
		.slick-arrow{
			@include opacity-s();
		}
	}
	&.default{
		.item{
			padding: 0 15px;
			.item-product-cat-content{
				.imagehover{
					z-index: 1;
					position: relative;
					&:before{
						position: absolute;
						content: "";
						bottom: 0;
						left: 50%;
						@include transform(translateX(-50%));
						@include transition(all .3s ease);
						@include size(0, 1px);
						background: $gray-dark;
					}
					&:hover{
						&:before{
							width: 100%;
							background: $theme-color;
						}
					}
					img{
						position: absolute;
						z-index: -1;
						@include opacity-h();
						@include transform(translate(-50%, -50%));
						@include transition(all .3s ease);
						pointer-events:none;
						max-width: 200px;
						height: 200px;
						object-fit: cover;
						@include box-shadow(0px 10px 10px 0px rgba(0, 0, 0, 0.1));
						&.visible {
							@include opacity-s();
						}
					}
				}
				a{
					&:hover{
						color: $gray-dark;
					}
				}
			}
			.content-btn{
				position: relative;
			    top: 0;
			    height: 132px;			    
			    border: 1px solid rgba($gray-dark, .05);
			    background: $white;
			    text-align: center;
			    @include transition(all 0.5s ease);
			    .btn-all{
			    	position: absolute;
				    bottom: 0;
				    left: 0;
				    width: 100%;
				    height: 100%;
				    a{
				    	color: $gray-dark;
				    	font-family: $font-family-base;
				    	font-weight:700;
				    	text-transform: uppercase;
				    	font-size: 18px;
					    width: 100%;
					    height: 100%;
					    display: inline-flex;
					    align-items: center;
					    justify-content: center;
				    }
			    }
			    &:hover{
			    	background: $theme-color;
					border: 1px solid $theme-color;
			    }
			}
		}
		.item-product-cat-content{
			display: flex;
			align-items: center;
			justify-content:space-between;
			@include transition(all 0.5s ease);
			border: 1px solid rgba($gray-dark, .05);
			margin-bottom: 30px;
			background: $white;
			padding: 40px 30px;
			.product-cat-content-info{
				a{
					@include rtl-padding-right(53px);
				}
			}
			&:hover{
				background: $theme-color;
				border: 1px solid $theme-color;
				.item-icon{
				    animation: lds-dual-ring-2 3s infinite;
				}
			}
		}
		.item-icon{
			order: 2;
			line-height:0;
			a{
				font-size: 50px;
			}
		}
		@media(max-width: $screen-md-max){
			.item{
				padding: 0 7.5px;
			}
			.item-product-cat-content{
				margin-bottom: 15px;
				padding: 40px 15px;
				.product-cat-content-info{
					a{
						@include rtl-padding-right(15px);
					}
				}
			}
		}
	}
	&.slider{
		.slick-slider{
			overflow: unset;
		}
		.item-product-cat-content{
			display: flex;
			align-items: center;
			justify-content:space-between;
			border: 1px solid rgba($gray-dark, .05);
			@include transition(all 0.5s ease);
			background: $white;
			padding: 40px 30px;
			.product-cat-content-info{
				a{
					@include rtl-padding-right(55px);
				}
			}
			&:hover{
				border: 1px solid $theme-color;
				box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.05);
				.item-icon{
				    animation: lds-dual-ring-2 3s infinite;
				}
			}
		}
		.item-icon{
			order: 2;
			line-height:0;
			a{
				font-size: 50px;
			}
		}
		@media(max-width: $screen-md-max){
			.item{
				padding: 0 7.5px;
			}
			.item-product-cat-content{
				padding: 40px 15px;
				.product-cat-content-info{
					a{
						@include rtl-padding-right(15px);
					}
				}
			}
		}
	}
	&.slider2{
		.slick-slider{
			overflow: unset;
		}
		.item-product-cat-content{
			display: flex;
			align-items: center;
			justify-content:space-between;
			border: 1px solid transparent;
			@include transition(all 0.5s ease);
			background: $white;
			padding: 10px 30px;
			margin-bottom: 30px;
			&:hover{
				border: 1px solid $theme-color;
				box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.05);
			}
			.product-cat-content-info{
				a{
					@include rtl-padding-right(5px);
				}
			}
			.item-image{
				img{
					max-width: 100px;
				}
			}
		}
		@media(max-width: $screen-md-max){
			.item{
				padding: 0 7.5px;
			}
			.item-product-cat-content{
				margin-bottom: 15px;
				padding: 40px 15px;
			}
		}
	}
	&.slider3{
		.slick-slider{
			overflow: unset;
		}
		.item-product-cat-content{
			display: flex;
			align-items: center;
			justify-content:space-between;
			border: 1px solid rgba($gray-dark, .05);
			@include transition(all 0.5s ease);
			background: $white;
			padding: 10px 30px;
			margin-bottom: 30px;
			&:hover{
				border: 1px solid $theme-color;
				box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.05);
			}
			.product-cat-content-info{
				a{
					@include rtl-padding-right(5px);
				}
			}
			.item-image{
				img{
					max-width: 100px;
				}
			}
		}
		@media(max-width: $screen-md-max){
			.item{
				padding: 0 7.5px;
			}
			.item-product-cat-content{
				margin-bottom: 15px;
				padding: 40px 15px;
			}
		}
	}
}

/************************************************************************************************
    Bingo Slider
*************************************************************************************************/
.bwp-slider{
	&:hover{
		&.slider-homepage1,&.slider-homepage2,&.slider-homepage3{
			.slick-arrow{
				@include opacity-s();
			}
		}
	}
	@media(max-width: $screen-md-max){
		.slick-list{
			margin: 0 -7.5px;
			.item{
				padding: 0 7.5px;
			}
		}
	}
	&.default{
		max-width: 100%;
		overflow: hidden;
		.slick-list{
			.slick-slide{
				padding: 0;
			}
		}
		.item-info{
			position:absolute;
			width:100%;
			z-index: 9;
			transform: unset;
			@include transition(all 0.3s ease);
			transition-delay:0.6s;
			display:flex;
			top:50%;
			@include transform(translateY(-50%));
			justify-content: center;
			&.horizontal_center{
			}
			&.horizontal_end{
				justify-content:flex-end;
				@include transform(translateY(-50%) skew(0deg));
				.title-slider{
					@include rtl-padding-right(135px);
				}
			}
			&.vertical_middle{
				@include transform(translateY(-50%) skew(30deg));
				.title-slider{
					@include rtl-padding-left(135px);
				}
			}
			&.align_right{
				.title-slider{
					text-align: right;
				}
			}
			@media(max-width: $screen-md-max){
				&.vertical_middle{
					@include transform(translateY(-50%) skew(0deg));
					.title-slider{
						@include rtl-padding-left(0);
					}
				}
				&.horizontal_end{
					justify-content:center;
					@include transform(translateY(-50%) skew(0deg));
					.title-slider{
						@include rtl-padding-right(0);
					}
				}
				&.horizontal_start{
					.title-slider{
						text-align: center;
					}	
				}
				&.align_right{
					.title-slider{
						text-align: center;
					}
				}
			}
		}
		.slick-list{
			background: transparent;
		    height: 490px;
		    display: flex;
		    margin-left: -15%;
		    margin-right: -15%;
		}
		.item{
		    flex: 1;
		    transform: skew(-30deg);
		    overflow: hidden;
		    position: relative;
		    @include rtl-left(0);
		    cursor: pointer;
		    .item-content{
			    position: absolute;
			    left: -9.5vw;
			    right: -9.5vw;;
			    transform: skew(30deg);
			    top:0;
			    bottom: 30px;
			    display: flex;
			    align-items: center;
			    min-height: 24em;
			    justify-content: center;
		    }
		    &:nth-of-type(2){
		    	.item-content{
		    		top: 30px;
		    		bottom: 0;
		    	}
		    }
		    &:first-child{
			   	.item-content{
			   	 	@include rtl-left(0);
			   	 	transform: skew(0);
			   	 	z-index: 1;
			   	 	width: 100%;
			   	 	justify-content: flex-end;
			   	}
			}
			&:last-child{
			   	.item-content{
			   	 	z-index: 1;
			   	 	width: 100%;
			   	}
			}
		}
		@media(max-width: 1830px){
			.item{
				 &:last-child{
				   	.item-content{
				   	 	justify-content: flex-start;
				   	}
				}
			}
		}
		@media(max-width: 1300px){
			.item{
				.item-content{
			    	@include rtl-left(-11.5vw);
			    }
			}
		}
		@media(max-width: $screen-md-max){
			.slick-list{
				-webkit-box-orient: vertical;
			    -webkit-box-direction: normal;
			    -ms-flex-direction: column;
			    flex-direction: column;
			    height: calc(100vh - 100px);
			}
			.item{
				transform: skew(0deg);
				.item-content{
					transform: skew(0deg);
				    @include rtl-right(0);
				    min-height: 0;
				    top: 0;
				    @include rtl-left(0);
				    bottom: 0;
				    .content-image{
				    	width: 100%;
				    	img{
							width: 100%;
						}
				    }
				}
				 &:nth-of-type(2){
			    	.item-content{
			    		top:0;
			    	}
			    }
			}
		}
	}
	&.slider-homepage1{
		.content-image img{
			width:100%;
		}
		span{
			display:inline-block;
		}
		.slick-dots{
			position:absolute;
			bottom:0;
			z-index:10;
		}
		.item-info{
			@include transform(translateY(-50%) skew(30deg));
			&.vertical_bottom{
				bottom:0;
			}
			&.horizontal_center{
				justify-content:center;
			}
			&.horizontal_start{
				justify-content:flex-start;
			}
			&.horizontal_end{
				justify-content:flex-end;
			}
			&.align_left{
				.title-slider{
					text-align:right;
				}
			}
			@media(max-width: $screen-xs){
				justify-content: center !important;
			}
		}
		.content{
			width: 100%;
		}
		.button-slider{
			display:inline-block;
			width: 100%;
			span{
				font-style: italic;
			}
		}
		.slick-arrow{
			@include opacity-h();
			@include square(35px);
			line-height:35px;
			font-size:11px;
			font-weight:400;
			top: 35%;
			background: $white;
			@include box-shadow(0px 4px 45px 0px rgba(0, 0, 0, 0.09));
			@include border-radius(50%);
			@media (max-width:$screen-sm-max){
				display:none !important;
			}
		}
		ul.slick-dots{
			li{
				button{
					background: rgba($white, .3);
				}
				&.slick-active{
					button{
						background: $white;
					}
				}
			}
		}
	}
	&.layout-1{
		.item{
			.item-content{
				background: $white;
				padding:60px 30px;
			}
			.item-category{
				display: flex;
				align-items: center;
				justify-content: space-between;
				line-height:0;
				margin-bottom: 15px;
				.item-title{
					margin: 0;
					line-height:18px;
					font-size: 18px;
					max-width: 100px;
				}
				.item-icon{
					a{
						font-size: 50px;
					}
				}
			}
			.description-slider{
				margin-bottom: 17px;
				ul{
					padding: 0;
					list-style:none;
					li > a{
						color: rgba($gray-dark, .8);
						font-size: 15px;
						line-height:24px;
						&:hover{
							color: $theme-color;
						}
					}
				}
			}
			.button-slider{
				font-size: 12px;
				font-family:$font-family-base;
				font-weight: 700;
				text-transform:uppercase;
			}
		}
		.slick-arrow{
            @include opacity-s();
            font-size: 24px;
            font-family: icomoon;
            @include square(35px);
            top: 49%;
            background: transparent;
            line-height:35px;
            &.fa-angle-right{
                right: -52px;
                @include transform(scaleX(-1));
                &:before{
                    content:"\e909";
                }
            }
            &.fa-angle-left{
                left: -52px;
                &:before{
                    content:"\e909";
                }
            }
            @media(max-width:1440px){
                &.fa-angle-left{
                    left: 0;
                }
                &.fa-angle-right{
                    right:0;
                }
            }
        }
		@media(max-width: $screen-md-max){
			.slick-list{
				margin: 0 -7.5px;
				.item{
					padding: 0 7.5px;
				}
			}
		}
	}
	&.layout-2{
		.item{
			.item-content{
				border:1px solid #f2f2f2;
				padding:60px 30px;
			}
			.item-category{
				display: flex;
				align-items: center;
				justify-content: space-between;
				line-height:0;
				margin-bottom: 15px;
				.item-title{
					margin: 0;
					line-height:18px;
					font-size: 18px;
					max-width: 100px;
				}
				.item-icon{
					a{
						font-size: 50px;
					}
				}
			}
			.description-slider{
				margin-bottom: 17px;
				ul{
					padding: 0;
					list-style:none;
					li > a{
						color: rgba($gray-dark, .8);
						font-size: 15px;
						line-height:24px;
						&:hover{
							color: $theme-color;
						}
					}
				}
			}
			.button-slider{
				font-size: 12px;
				font-family:$font-family-base;
				font-weight: 700;
				text-transform:uppercase;
			}
		}
		.slick-arrow{
            @include opacity-s();
            font-size: 24px;
            font-family: icomoon;
            @include square(35px);
            top: 49%;
            background: transparent;
            line-height:35px;
            &.fa-angle-right{
                right: -40px;
                @include transform(scaleX(-1));
                &:before{
                    content:"\e909";
                }
            }
            &.fa-angle-left{
                left: -40px;
                &:before{
                    content:"\e909";
                }
            }
            @media(max-width:1440px){
                &.fa-angle-left{
                    left: 0;
                }
                &.fa-angle-right{
                    right:0;
                }
            }
        }
		@media(max-width: $screen-md-max){
			.slick-list{
				margin: 0 -7.5px;
				.item{
					padding: 0 7.5px;
				}
			}
		}
	}
	&.slider-scroll{
		.slides{
			display: flex;
			height: 510px;
			min-width: 100%;
			-webkit-box-orient: horizontal;
			-webkit-box-direction: normal;
			-ms-flex-flow: row nowrap;
			flex-flow: row nowrap;
			overflow: scroll;
			white-space: nowrap;
			&::-webkit-scrollbar {
				display: none;
			}
			.scroll_item{
				-webkit-box-flex: 0;
				-ms-flex: 0 0 13%;
				flex: 0 0 13%;
				max-width: 13%;
				cursor: pointer;
				overflow: hidden;
				position: relative;
				-webkit-transform: translateX(100%);
				-o-transform: translateX(100%);
				transform: translateX(100%);
				opacity: 0;
				z-index: 1;
				&:hover{
					flex-basis: 20%;
					max-width: 20%;
				}
				&:not(.active){
					-webkit-transform: translateX(0);
					-o-transform: translateX(0);
					transform: translateX(0);
					-webkit-transition: max-width .5s cubic-bezier(.17,.67,1,1),opacity .3s cubic-bezier(.17,.67,1,1),-webkit-box-flex .5s cubic-bezier(.17,.67,1,1),-webkit-transform .5s cubic-bezier(.17,.67,1,1);
					transition: max-width .5s cubic-bezier(.17,.67,1,1),opacity .3s cubic-bezier(.17,.67,1,1),-webkit-box-flex .5s cubic-bezier(.17,.67,1,1),-webkit-transform .5s cubic-bezier(.17,.67,1,1);
					-o-transition: flex .5s cubic-bezier(.17,.67,1,1),max-width .5s cubic-bezier(.17,.67,1,1),opacity .3s cubic-bezier(.17,.67,1,1),-o-transform .5s cubic-bezier(.17,.67,1,1);
					transition: flex .5s cubic-bezier(.17,.67,1,1),max-width .5s cubic-bezier(.17,.67,1,1),transform .5s cubic-bezier(.17,.67,1,1),opacity .3s cubic-bezier(.17,.67,1,1);
					transition: flex .5s cubic-bezier(.17,.67,1,1),max-width .5s cubic-bezier(.17,.67,1,1),transform .5s cubic-bezier(.17,.67,1,1),opacity .3s cubic-bezier(.17,.67,1,1),-webkit-box-flex .5s cubic-bezier(.17,.67,1,1),-ms-flex .5s cubic-bezier(.17,.67,1,1),-webkit-transform .5s cubic-bezier(.17,.67,1,1),-o-transform .5s cubic-bezier(.17,.67,1,1);
					opacity: 1;
					-webkit-transition-delay: 0s!important;
					-o-transition-delay: 0s!important;
					transition-delay: 0s!important;
				}
				&.active{
					-webkit-box-flex: 0;
					-ms-flex: 0 0 48%;
					flex: 0 0 48%;
					max-width: 48%;
					-webkit-transition: max-width .5s cubic-bezier(.17,.67,1,1),-webkit-box-flex .5s cubic-bezier(.17,.67,1,1);
					transition: max-width .5s cubic-bezier(.17,.67,1,1),-webkit-box-flex .5s cubic-bezier(.17,.67,1,1);
					-o-transition: flex .5s cubic-bezier(.17,.67,1,1),max-width .5s cubic-bezier(.17,.67,1,1);
					transition: flex .5s cubic-bezier(.17,.67,1,1),max-width .5s cubic-bezier(.17,.67,1,1);
					transition: flex .5s cubic-bezier(.17,.67,1,1),max-width .5s cubic-bezier(.17,.67,1,1),-webkit-box-flex .5s cubic-bezier(.17,.67,1,1),-ms-flex .5s cubic-bezier(.17,.67,1,1);
					-webkit-transform: translateX(0);
					-o-transform: translateX(0);
					transform: translateX(0);
					opacity: 1;
					-webkit-transition-delay: 0;
					-o-transition-delay: 0;
					transition-delay: 0;
					.item-info{
						@include opacity-s();
						z-index: 2;
					}
				}
				.bg-img{
					content: "";
					position: absolute;
					top: 0;
					right: 0;
					bottom: 0;
					left: 0;
					margin: auto;
					width: 100%;
					height: 100%;
					-webkit-transform-origin: center;
					-o-transform-origin: center;
					transform-origin: center;
					-webkit-transition: -webkit-transform .5s cubic-bezier(.17,.67,1,1);
					transition: -webkit-transform .5s cubic-bezier(.17,.67,1,1);
					-o-transition: -o-transform .5s cubic-bezier(.17,.67,1,1);
					transition: transform .5s cubic-bezier(.17,.67,1,1);
					transition: transform .5s cubic-bezier(.17,.67,1,1),-webkit-transform .5s cubic-bezier(.17,.67,1,1),-o-transform .5s cubic-bezier(.17,.67,1,1);
					z-index: 0;
					overflow: hidden;
					background-size: cover;
				}
				@media(max-width: $screen-xs-max){
					-ms-flex: 0 0 100%;
					flex: 0 0 100%;
					max-width: 100%;
					&.active{
						-ms-flex: 0 0 100%;
						flex: 0 0 100%;
						max-width: 100%;
					}
				}
			}
			.overlay{
				position: absolute;
				top: 0;
				left: 0;
				right: 0;
				bottom: 0;
				width: 100%;
				height: 100%;
				z-index: 1;
			}
		}
		.content-image img{
			width:100%;
		}
		.item-info{
			position:absolute;
			width:100%;
			@include opacity-h();
			@include transition(all 0.1s ease);
			display:flex;
			.button-slider{
				display: inline-block;
			}
			&.vertical_middle{
				top:50%;
				@include transform(translateY(-50%));
			}
			&.vertical_top{
				top:0;
			}
			&.vertical_bottom{
				bottom:0;
			}
			&.horizontal_center{
				justify-content:center;
			}
			&.horizontal_start{
				justify-content:flex-start;
			}
			&.horizontal_end{
				justify-content:flex-end;
			}
			&.align_left{
				text-align:left;
			}
			&.align_right{
				text-align:right;
			}
			&.align_center{
				text-align:center;
			}
			&.align_justify{
				text-align:justify;
			}
		}
	}
}

/************************************************************************************************
    Bingo Woo Countdown
*************************************************************************************************/
.bwp-countdown{
	@media (max-width:$screen-md-max){
		.slick-list{
			margin:0 -7.5px !important;
			.item-product{
				padding:0 7.5px !important;
			}
		}
	}
	&.slider{
		.slick-list{
			margin:0 -15px;
			.slick-slide {
				padding: 0 15px;
			}
		}
		.slick-arrow{
			@include opacity-s();
			border:1px solid $very-light-gray;
			@include square(35px);
			line-height:35px;
			color:$gray-dark;
			background: $white;
			font-size: 18px;
			@include border-radius(50%);
			&.fa-angle-left{
				@include rtl-left(-50px);
			}
			&.fa-angle-right{
				@include rtl-right(-50px);
			}
			&:hover{
				color:$white;
				background: $theme-color;
			}
			@media(max-width: $screen-md-max){
				&.fa-angle-left{
					@include rtl-left(-25px);
				}
				&.fa-angle-right{
					@include rtl-right(-25px);
				}		
			}
		}
		.item-countdown{
			margin-top: 20px;
			@include transition(all 0.3s ease);
			.countdown-content{
				text-align: center;
				>span{
					display:inline-block;
					font-family: $font-family-base;
					color:$gray-dark;
					text-transform:uppercase;
					margin:0 14px;
					@media(max-width: $screen-md-max){
						margin:0 8px;		
					}
					&:first-child{
						@include rtl-margin-left(0);
					}
				}
				.countdown-amount{
					font-size:18px;
					display:block;
					line-height:21px;
					margin-bottom: 2px;
					color:$red;
					font-weight:700;
					position:relative;
				}
				.countdown-text{
					font-size:13px;
					line-height:10px;
					display:block;
					font-weight:300;
				}
			}
		}
		.content-image{
			width:220px;
			flex: 0 0 220px;
		}
		.item-product-content{
			margin:0!important;
			display:flex;
			overflow:hidden;
			align-items: center;
			border: 1px solid $theme-color;
			padding: 55px 60px !important;
			@media(max-width: $screen-md-max){
				padding:15px !important;		
			}
			@media(max-width: $screen-xs-max){
				flex-wrap: wrap;			
			}
			&:hover{
    			.products-content{
					.product-title-countdown{
						a{
							color: rgba($gray-dark, .8);
						}
					}
    				.woo-price{
    					.btn-atc-countdown{
    						top: 0;
    						@include opacity-s();
    						@include transform(translateY(0));
    					}
    					.price{
        					@include transform(translateY(100%));
        					@include opacity-h();
        				}
    				}
    			}
    		}
		}
		.products-content{
			@include rtl-text-align-left();
			@include rtl-padding-left(30px)
			.product-title-countdown{
				font-size:15px;
				margin:6px 0 13px;
				text-transform: uppercase;
				.product-title-countdown{
					a{
						color: rgba($gray-dark, .8);
					}
				}
			}
			.rating {
				margin-bottom: 25px;
			}
			.woo-price{
				position: relative;
				.price{
					@include transform(translateY(0));
					transition: opacity .3s ease-out,transform .4s ease-in-out
				}
			}
			.btn-atc-countdown{
				transition: opacity .3s ease-out,transform .4s ease-in-out;
				z-index: 9;
				position: absolute;
        		width: 100%;
				bottom: 0;
				@include transform(translateY(70%));
				@include opacity-h();
				@media(max-width: $screen-xs-max){
            		@include opacity-s();
            		margin: 5px 0 0;
            		position: unset;
					@include transform(unset);
				}
				a{
					display:inline-block;
					color:$white;
					font-size:15px;
					line-height: 12px;
					font-weight: 700;
					font-style: italic;
					color: $gray-dark;
					background: $theme-color;
					padding:10px 20px;
					@include border-radius(25px);
					text-transform: uppercase;
					@include transition(all 0.5s ease);
					text-align:center;
					position:relative;
					font-family: $font-family-base;
					&:hover{
						background: $gray-dark;
						color: $white;
					}
					@media (max-width:$screen-xs-max){
						font-size:16px;
					}
					label{
						margin:0;
					}
					&.loading {  
						@include transition(all 0.2s ease);
						color: transparent;
						&:before {
							display: inline-block;
							content: "";
							border:2px solid $blue-light;
							border-top-color:rgba($blue-light, .3);
							@include square(20px);
							@include border-radius(50%);
							background: none;
							@include animation(2s linear 0s normal none infinite running spinAround);
						}
						&:hover{
							&:before{
								border-color:rgba($theme-color,0.5);
								border-top-color:$theme-color;
							}
						}
					}
					&.added{
						display: none;
					}
				}
				.woosw-btn{
                	display: none;
                }
			}
		}
		@media(max-width: $screen-md-max){
			.products-content{
				@include rtl-padding-left(15px);
			}
		}
		@media(max-width: $screen-xs-max){
			.content-image{
				width: 100%;
				flex: none;
			}
			.products-content{
				margin-top: 15px;
				.rating{
					margin-bottom:0;
				}
			}
		}
		.rating{
			.review-count{
				display: inline-block;
				position: relative;
				top: -3px;
			}
		}
		.content-title{
			margin-bottom:10px;
		}
		.available-box{
			margin-top:20px;
			.content-available{
				display:flex;
				justify-content:space-between;
				font-weight:500;
				label{
					margin-bottom:0;
					@include rtl-margin-right(5px);
					color:$text-color;
				}
				.available{
					color:$gray-dark;
				}
				.sold{
					color:$theme-color;
				}
			}
			.percent{
				position:relative;
				height:6px;
				width:100%;
				@include border-radius(10px);
				background:#f5f5f5;
				margin-bottom:12px;
				.content{
					position:absolute;
					top:0;
					left:0;
					height:6px;
					@include border-radius(10px);
					background:#4bc871;
				}
			}
		}
		@media (max-width:$screen-xs){
			.item-countdown{
				padding:5px 0;
				margin-top: 5px;
				h2{
					font-size:14px;
				}
				.countdown-content{
					font-size:14px;
				}
			}
		}
	}
	&.slider2{
		.slick-list{
			margin:0 -15px;
			.slick-slide {
				padding: 0 15px;
			}
		}
		.slick-arrow{
			@include opacity-s();
			border:1px solid $very-light-gray;
			@include square(35px);
			line-height:35px;
			color:$gray-dark;
			background: $white;
			font-size: 18px;
			@include border-radius(50%);
			&.fa-angle-left{
				@include rtl-left(-50px);
			}
			&.fa-angle-right{
				@include rtl-right(-50px);
			}
			&:hover{
				color:$white;
				background: $theme-color;
			}
			@media(max-width: $screen-md-max){
				&.fa-angle-left{
					@include rtl-left(-25px);
				}
				&.fa-angle-right{
					@include rtl-right(-25px);
				}		
			}
		}
		.item-countdown{
			margin-top: 24px;
			@include transition(all 0.3s ease);
			.countdown-content{
				text-align: center;
				background: $theme-color;
				display:block;
				padding: 12px 30px;
				>span{
					display:inline-block;
					font-family: $font-family-base;
					color:$gray-dark;
					text-transform:uppercase;
					margin:0 14px;
					@media(max-width: $screen-xs-max){
						margin:0 8px;		
					}
					&:first-child{
						@include rtl-margin-left(0);
					}
				}
				.countdown-amount{
					font-size:32px;
					display:block;
					line-height:32px;
					margin-bottom: 5px;
					font-weight:700;
					position:relative;
				}
				.countdown-text{
					font-size:13px;
					line-height:10px;
					display:block;
					font-weight:300;
				}
			}
		}
		.item-product-content{
			margin:0!important;
			overflow:hidden;
			border: 1px solid $theme-color;
			padding: 45px !important;
			@include border-radius(20px);
			@media(max-width: $screen-md-max){
				padding:15px !important;		
			}
			@media(max-width: $screen-xs-max){
				flex-wrap: wrap;			
			}
			&:hover{
    			.products-content{
					.product-title-countdown{
						a{
							color: rgba($gray-dark, .8);
						}
					}
    				.woo-price{
    					.btn-atc-countdown{
    						top: 0;
    						@include opacity-s();
    						@include transform(translateY(0));
    					}
    					.price{
        					@include transform(translateY(100%));
        					@include opacity-h();
        				}
    				}
    			}
    		}
		}
		.products-content{
			@include rtl-text-align-left();
			margin-top: 20px;
			.product-title-countdown{
				font-size:15px;
				margin:6px 0 13px;
				text-transform: uppercase;
				.product-title-countdown{
					a{
						color: rgba($gray-dark, .8);
					}
				}
			}
			.rating {
				margin-bottom: 5px;
			}
			.woo-price{
				position: relative;
				.price{
					@include transform(translateY(0));
					transition: opacity .3s ease-out,transform .4s ease-in-out
				}
			}
			.btn-atc-countdown{
				transition: opacity .3s ease-out,transform .4s ease-in-out;
				z-index: 9;
				position: absolute;
        		width: 100%;
				bottom: 0;
				@include transform(translateY(70%));
				@include opacity-h();
				@media(max-width: $screen-xs-max){
            		@include opacity-s();
            		margin: 5px 0 0;
            		position: unset;
					@include transform(unset);
				}
				a{
					display:inline-block;
					color:$white;
					font-size:15px;
					line-height: 12px;
					font-weight: 700;
					font-style: italic;
					color: $gray-dark;
					background: $theme-color;
					padding:10px 20px;
					@include border-radius(25px);
					text-transform: uppercase;
					@include transition(all 0.5s ease);
					text-align:center;
					position:relative;
					font-family: $font-family-base;
					&:hover{
						background: $gray-dark;
						color: $white;
					}
					@media (max-width:$screen-xs-max){
						font-size:16px;
					}
					label{
						margin:0;
					}
					&.loading {  
						@include transition(all 0.2s ease);
						color: transparent;
						&:before {
							display: inline-block;
							content: "";
							border:2px solid $blue-light;
							border-top-color:rgba($blue-light, .3);
							@include square(20px);
							@include border-radius(50%);
							background: none;
							@include animation(2s linear 0s normal none infinite running spinAround);
						}
						&:hover{
							&:before{
								border-color:rgba($theme-color,0.5);
								border-top-color:$theme-color;
							}
						}
					}
					&.added{
						display: none;
					}
				}
				.woosw-btn{
                	display: none;
                }
			}
		}
		@media(max-width: $screen-xs-max){
			.content-image{
				width: 100%;
				flex: none;
			}
			.products-content{
				margin-top: 15px;
				.rating{
					margin-bottom:0;
				}
			}
		}
		.rating{
			.review-count{
				display: inline-block;
				position: relative;
				top: -3px;
			}
		}
		.content-title{
			margin-bottom:10px;
		}
		.available-box{
			margin-top:20px;
			.content-available{
				display:flex;
				justify-content:space-between;
				font-weight:500;
				label{
					margin-bottom:0;
					@include rtl-margin-right(5px);
					color:$text-color;
				}
				.available{
					color:$gray-dark;
				}
				.sold{
					color:$theme-color;
				}
			}
			.percent{
				position:relative;
				height:6px;
				width:100%;
				@include border-radius(10px);
				background:#f5f5f5;
				margin-bottom:12px;
				.content{
					position:absolute;
					top:0;
					left:0;
					height:6px;
					@include border-radius(10px);
					background:#4bc871;
				}
			}
		}
		@media (max-width:$screen-md-max){
			.item-countdown{
				.countdown-content{
					font-size:14px;
					padding: 5px 15px;
					.countdown-amount{
						font-size: 25px;
					}
				}
			}
		}
	}
	&.slider3{
		position:relative;
		.title-block{
			margin-bottom:25px;
			h2{
				margin:0;
				font-size:30px;
				font-weight:700;
				position:relative;  
				span{
					color: $theme-color;
				}
			}
		}
		.slick-list{
			margin: 0 -20px;
			.slick-slide{
				padding: 0 20px;
			}
		}
		.slick-arrow{
			@include opacity-s();
			@include square(25px);
			line-height:26px;
			font-size: 8px;
			top:7px;
			&.fa-angle-left{
				@include rtl-left(auto);
				@include rtl-right(30px);
			}
			&.fa-angle-right{
				@include rtl-right(0);
			}
		}
		.item-product{
			padding-bottom: 24px;
		}
		.item-product-content{		
			margin-bottom: 0 !important;
		}
		.grid-content{
			padding:40px 20px;
			display:flex;
			flex-wrap:wrap;
			border: 2px solid #e7e7e7;
			@include border-radius(10px);
		}
		.item-product {
			&:nth-child(2n + 1){
				.item-product-content {
					.products-content{
						background: $theme-color;
					}
				}
			}
			&:nth-child(2n + 2){
				.item-product-content {
					.products-content{
						background: #837bb3;
					}
				}
			}
			&:nth-child(3n + 1){
				.item-product-content {
					.products-content{
						background: $orange;
					}
				}
			}
			&:nth-child(4n + 2){
				.item-product-content {
					.products-content{
						background: #538454;
					}
				}
			}
		}
		.products-list.grid{
			.product-wapper{
				.products-content{
					@include rtl-text-align-center();
					padding: 25px 30px 40px;
					margin: auto 0;
					@media (max-width:1200px){
						padding: 15px;
					}
					.products-content-top{
						margin-bottom: 15px;
					}
					h3.product-title{
						font-size:15px;
						font-weight: 500;
						margin-bottom:2px;
						a{
							color: $white;
						}
					}
					.review-count{
						font-size: 11px;
					}
					.price{
						color:$white;
						padding-bottom:10px;
						ins{
							color:$white;
							font-size:15px;
						}
						del{
							font-size: 15px;
							color: rgba($white, .5);
							font-weight: 400;
						}
					}
				}
			}
		}
		.product-description{
			margin-top:5px;
			font-size: 13px;
			line-height: 18px;
			color: $white;
		}
		.brands-single{
			display:flex;
			align-items:center;
			margin-top:15px;
			.title-brand{  
				margin:0;
				font-size:12px;
				text-transform:uppercase;
				font-weight:700;
			}
			ul{  
				padding:0;
				list-style:none;
				li{
					display:inline-block;
					@include rtl-margin-left(5px);
					margin-bottom:5px;
					a{
						display:inline-block;
						border:1px solid #cccccc;
						height:66px;
						padding:10px;
						img{
							max-height:45px;
							max-width:unset;
							width:auto;
						}
						&:hover{
							border-color:$gray-dark;
						}
					}
				}
			}
		}
		.available-box{
			margin-top:14px;
			.content-available{
				display:flex;
				justify-content:space-between;
				font-weight:700;
				font-size: 12px;
				label{
					margin-bottom:0;
					font-weight:500;
					@include rtl-margin-right(5px);
					color:$light-gray;
				}
				.available{
					font-weight:600;
					color:$gray-dark;
				}
				.sold{
					font-weight:600;
					color:$theme-color;
				}
			}
			.percent{
				position:relative;
				height:6px;
				width:100%;
				@include border-radius(10px);
				background:#e1e1e1;
				margin-bottom:6px;
				.content{
					position:absolute;
					top:0;
					left:0;
					height:6px;
					@include border-radius(10px);
					background:$theme-color;
				}
			}
		}
		.item-countdown{
			display:flex;
			align-items:center;
			justify-content: center;
			margin-top:20px;
			flex-wrap:wrap;
			.title-countdown{
				@include rtl-margin-right(10px);
				h2{
					font-size:11px;
					text-transform:uppercase;
					font-weight:700;
					margin:0 0 -5px;
				}
				span{
					font-size:11px;
					font-weight:500;
				}
			}
			.countdown-content{
				>span{
					display:inline-block;
					@include rtl-margin-right(22px);
					@media(max-width:$screen-md-max){
						@include rtl-margin-right(10px);
					}
					&:last-child{
						@include rtl-margin-right(0);
					}
					.countdown-amount{
						font-size:18px;
						color:$white;
						@include size(42px, 0);
						@include border-radius(50%);
						display:inline-block;
					}
					.countdown-text{
						font-size:13px;
						line-height:12px;
						text-transform:capitalize;
						display:block;
						color: $white;
					}
				}
			}
		}
		.star-rating span::before{
			color: $theme-color;
		}
		.product-button{
			margin-top:20px;
			>*{
				display:inline-block;
				vertical-align:top;
				@include rtl-margin-right(6px);
				&:last-child{
					@include rtl-margin-right(0);
				}
			}
			>a{
				display:inline-block;
				font-size:12px;
				font-weight:500;
				text-transform: uppercase;
				background: $gray-dark;
				@include border-radius(30px);
				line-height:35px;
				padding:0 20px;
				color: $white;
				&.added{
					display:none;
				}
				&:hover{
					background:$theme-color;
					border-color:$theme-color;
					color:$white;
				}
				&.loading {    
					@include transition(all 0.2s ease);                   
					&:before {
						position: relative;
						display: inline-block;
						content: "";
						border:2px solid rgba($white,0.5);
						border-top-color:$white;
						@include square(15px);
						@include border-radius(50%);
						background: none;
						@include animation(2s linear 0s normal none infinite running spinAround);
						text-indent: 0;
						top:3px;
						@include rtl-margin-right(5px);
					}
				} 
			}    
			.product-quickview, .compare-button{
				display:none;
			}
			.woocommerce{
				text-align: center;
				background: $white;
				font-size: 0;
				white-space: nowrap;
				>a{
					color: $gray-dark;
					@include square(50px);
					line-height: 48px; 
					display: inline-block;
					border:1px solid $gray-lighter;
					&:before{
						font-size: 16px;
						color: $gray-dark;
						line-height: 48px;
						@include transition(all 0.1s ease);
						content:"\e905";
						font-family:icomoon;
					}
				}
				&:hover{
					>a{
						background:$theme-color;
						border-color:$theme-color;
						&:before{
							color: $white;
						}
					}
					.loading{
						&:before{
							color: $white;
						}
					}
				}
				.loading {
					i{
						display: none;
					}
					&:before {
						position: absolute;
						left: 10px;
						color: $gray-dark;
						display: inline-block;
						content: "\e02d";
						width: auto;
						height: auto;
						@include rtl-margin-left(0);
						font-family: 'ElegantIcons';
						background-color: transparent !important;
						background: none;
						font-size: 20px;
						@include animation(2s linear 0s normal none infinite running spinAround);
					}
				} 
			}
			.woosw-btn{                     
				font-size: 0;
				background: $white;
				text-align: center;
				position: relative;
				white-space: nowrap;
				margin-top: 0;
				color: $white; 
				@include square(35px);
				border:1px solid #cccccc;
				line-height: 35px; 
				display: inline-block;
				@include border-radius(50%);
				cursor:pointer;
				&:before{
					content: "\e901";
					font-family: icomoon;
					font-size: 14px;
					line-height: 35px;
					color: $gray-dark;
					text-indent: -2px;
					@include transition(all 0.1s ease);
				}
				&.woosw-adding{
					&:before {
						position: relative;
						display: inline-block;
						content: "";
						border:2px solid rgba($gray-dark,0.25);
						border-top-color:$gray-dark;
						@include square(16px);
						@include border-radius(50%);
						background: none;
						@include animation(2s linear 0s normal none infinite running spinAround);
						text-indent: 0;
						top:7px;
						left: 0;
					}
					&:hover{
						&:before{
							border-color:rgba($white,0.5);
							border-top-color:$white;
						}
					}
				}
				&.woosw-added{
					&:before{
						content: "\e901";
						font-family: icomoon;
						line-height: 35px;
						margin:0;
						color: $theme-color;
						@include transition(all 0.1s ease);
						position: relative;
					}
				}
				&:hover{ 
					background:$theme-color;
					border-color:$theme-color;
					&:before{
						color: $white;
					}
				}
			}
		}
		@media (max-width:1400px){
			.content-image{
				width:40%;
			}
			.products-content{
				width:60%;
			}
			.content-countdown{
				>h2{
					width:40%;
				}
				.item-countdown{
					width:60%;
				}
			}
		}
		@media (max-width:$screen-md-max){
			.content-image{
				width:100%;
			}
			.products-content{
				width:100%;
				@include rtl-padding-left(0);
			}
			.content-countdown{
				>h2{
					width:100%;
					margin-bottom:10px;
				}
				.item-countdown{
					width:100%;
					@include rtl-padding-left(0);
				}
			}
		}
		@media (max-width:$screen-xs){
			.grid-content{
				padding:15px;
			}
			.products-content{
				@include rtl-padding-left(0);
			}
			.content-countdown{
				padding:15px 0;
				.item-countdown{
					flex-wrap:wrap;
					>h2{
						margin-top:5px;
						margin-bottom:5px;
					}
				}
				.product-countdown{
					margin-top:5px;
					margin-bottom:5px;
				}
			}
		}
	}
}

/************************************************************************************************
    Bingo Image Gallery
*************************************************************************************************/
.bwp-gallery{
    .slick-slide{
        text-align: center;
        img{
            display: inline-block;
        }
    }
    .slick-dots{
        position: absolute;
        bottom: 15px;
        padding: 0;
        left: 50%;
        margin-right: -50%;
        transform: translate(-50%, -50%);
        li{
            button{
                border: 0;
                opacity: 0.4;
                background: $gray-dark;
                @include square(16px);
                transform: none;
                &:hover{
                    background: $white;
                    opacity: 1;
                }
            }
            &.slick-active{
                button{
                    background: $white;
                    opacity: 1;
                }
            }
        }
    }
}

/************************************************************************************************
    Wp Tag Cloud
*************************************************************************************************/
.vc_wp_tagcloud{
    .widget_tag_cloud{
        h2.widgettitle{
            font-size: 18px;
            border-bottom: 1px solid #343434;
            margin-top: 0;
            margin-bottom: 10px;
            padding-bottom: 14px;
        }
    }
}

.bwp-widget-feature-product{
	display:none;
	ul{
		padding:0;
		list-style:none;
	}
	.item-product{
		display:flex;
		padding-bottom:18px;
		margin-bottom:18px;
		border-bottom: 1px solid #e6e6e6;
		&:last-child{
			padding-bottom:0;
			margin-bottom:0;
			border-bottom:0;
		}
	}
	.item-thumb{
		flex:0 0 80px;
	}
	.content-bottom{
		@include rtl-padding-left(15px);
		.rating{
			margin-bottom:0;
			font-size:14px;
		}
		.item-title{ 
			margin-top: -1px;
			font-weight: 500;
			display:block;
			margin-bottom:5px;
			line-height: 20px;
			font-size:14px;
			-webkit-line-clamp: 1;
			-webkit-box-orient: vertical;
			overflow: hidden;
			max-width: 200px;
			display: -webkit-box;
			a{
				color: $text-color;
				&:hover{
					color: $theme-color;
				}
			}
		}
		.price {
			line-height: 100%;
			display: inline-block;
			font-family: $font-family-second;
			font-size:15px;
			ins{
				font-size: 16px;
			}
			del{
				line-height: 100%;
				color:rgba($text-color,0.8);
				font-size:13px;
			}
		} 
		.rating{
			.review-count{
				display: inline-block;
				position: relative;
				top: -3px
			}
		}
	}
}
/************************************************************************************************
    Bingo Lookbook
*************************************************************************************************/
.bwp-lookbook{
	.close-lookbook{
		position: fixed;
		width: 100%;
		height: 100%;
		left: 0;
		top: 0;
		display: none;
		z-index: 2;
		&.active{
			display: block;
		}
	}
	.slick-track{
		position: unset;
	}
	.button{
		display: inline-block;
		position: relative;
	}
	.item{
		.bwp-content-lookbook{
			position: unset;
		}
	}
	.content-lookbook{
		z-index: 9;
		text-align: center;
		width:225px;
		@include opacity-h();
		position: absolute;
		display: block;
		bottom: auto;
		.content-product{
			padding: 15px;
			margin-bottom: 0;
			text-align: center;
			background-color: $white;
			@include box-shadow(-1px 5px 5px 0px rgba(144, 144, 144, 0.2));
			@include transition(all 0.2s ease);
			overflow: unset;
			position: relative;
			&:before{
				content: "";
				position: absolute;
				border: 8px solid transparent;
				border-width: 12px 8px;
			}
		}
		.content-lookbook-bottom{
			margin-top:18px;
			padding-bottom:10px;
			.rating{
				margin-bottom:10px;
				.star-rating{
					margin:auto;
				}
				.review-count{
					display:none;
				}
			}
			.item-title{
				line-height:15px;
				text-transform: capitalize;
				a{
					color: $gray-dark;
					font-size:15px;
					line-height:15px;
					text-transform: uppercase;
					font-weight: 700;
					font-family:$font-family-base;
					&:hover{
						color: $theme-color;
					}
				}
			}
			.price{
				font-weight: 700;
				font-family:$font-family-base;
			}
		}
		&.top{
			.content-product{
				&:before{
					bottom: -23px;
					border-top-color: $white;
				}
			}
			&.left{
				@include transform(translate(calc(-100% + 40px),calc(-100% - 20px)));
				.content-product{
					&:before{
						right: 15px;
					}
				}
			}
			&.right{
				@include transform(translateY(calc(-100% - 20px)));
				.content-product{
					&:before{
						left: 8px;
					}
				}
			}
		}
		&.bottom{
			.content-product{
				&:before{
					top: -24px;
					border-bottom-color: $white;
				}
			}
			&.left{
				@include transform(translate(calc(-100% + 40px),55px));
				.content-product{
					&:before{
						right: 15px;
					}
				}
			}
			&.right{
				@include transform(translate(calc(-100% + 145px), 30px));
				.content-product{
					&:before{
						left: calc(50% - 25px);
					}
				}
				&.active{
					@include transform(translate(calc(-100% + 145px), 55px));
				}
			}
		}
		&.active{
			@include opacity-s();
		}
	}
	.item-lookbook{
		@include border-radius(50%);
		@include square(23px !important);
		position:absolute;
		@include border-radius(50%);
		text-align: center;
		line-height: 23px;
		@include transition(width 0.2s ease, height 0.2s ease);
		@include transition(all .3s ease);
		display: inline-block;
		z-index: 1;
		background: transparent;
		text-indent: -1px;
		cursor:pointer;
		&:hover{
			color:$white;
			.content-lookbook{
				display: block;
			}
			.number-lookbook{
				@include transform(scale(1.2));
			}
			&:before, &:after{
				background: transparent;
			}
		}
		&:before, &:after{
			@include square(31px);
			position:absolute;
			content:"";
			left: calc(50% - 14.5px);
			top: calc(50% - 14.5px);
			background:transparent;
			background: rgba($theme-color, 0.5);
			@include border-radius(50%);
			@include transition(all .3s ease);
			z-index:-1;
			-webkit-animation-name: scale2;
			animation-name: scale2;
			-webkit-animation-duration: 3s;
			animation-duration: 3s;
			-webkit-animation-timing-function: ease-in-out;
			animation-timing-function: ease-in-out;
			-webkit-animation-iteration-count: infinite;
			animation-iteration-count: infinite;
		}
		&:after{
			animation-delay: 1.5s;
		}
		.number-lookbook{
			font-size:0;
			@include square(25px);
			line-height: 25px;
			@include border-radius(50%);
			background:$white;
			display:inline-block;
			position:absolute;
			top: 0;
			left: 0;
			@include transition(all .3s ease);
			&:before{
				position: relative;
				content: "\e904";
				top: 0;
				left: .5px;
				font-family: icomoon;
				font-weight: 400;
				font-size: 11px;
				color: $gray-dark;
			}
			&:hover{
				background: $theme-color;
			}
		}
    }
    .bwp-content-lookbook{
        vertical-align: top;
		width:100%;
    }
    ul.slick-dots{
		position:absolute;
		z-index:10;
		left: 50%;
		@include transform(translateX(-50%));
		li{
			margin: 0 3px;
			display: inline-block;
			@include size(18px, 2px);
			@include border-radius(0);
			button{
				background: rgba($white, .3);
				@include size(18px, 2px);
				margin: auto;
				@include border-radius(0);
				&:before{
					display: none;
				}
			}
			&.slick-active{
				button{
					background: $white;
				}
			}
		}
	}
    &.slider{
    	.slick-list{
			margin: 0 -5px;
			.item{
				padding: 0 5px;
			}
		}
    }
	&.slider-2{
    	.slick-list{
			margin: 0;
			.item{
				padding: 0;
			}
		}
    }
}
.bwp-widget-feature-product{
	display:none;
	ul{
		padding:0;
		list-style:none;
	}
	.item-product{
		display:flex;
		align-items: center;
		padding-bottom:18px;
		margin-bottom:18px;
		border-bottom:1px solid $gray-light;
		&:last-child{
			padding-bottom:0;
			margin-bottom:0;
			border-bottom:0;
		}
	}
	.content-bottom{
		@include rtl-padding-left(15px);
		.item-title{ 
			margin-top: 0px;
			display:block;
			margin-bottom:5px;
			a{
				color: $gray-dark;
				&:hover{
					color: $theme-color;
				}
			}
		}
		.rating{
			.review-count{
				display: inline-block;
				position: relative;
				top: -3px
			}
		}
	}
}
.bwp-image-product-countdown{
 	&.default{
	   .product-title{
			font-size: 18px;
			margin: 0;
			text-transform: uppercase;
			a{
				color: $blue-light; 	
			}
		}
		.product-price{
			color: $white;
			font-size: 20px;
			font-weight: 700;
			font-family:$font-family-base;
			margin-bottom: 10px;
		}
		.countdown-deal{
			margin-top: 3px;
			margin-bottom: 35px;
			@include transition(all 0.3s ease);
			label{
				font-size: 12px;
				text-transform:uppercase;
				margin-bottom: 15px;
				color: rgba($gray-dark, .8);
			}
			.item-countdown{
				text-align:center;
			}
			.countdown-content{
				display:flex;
				text-align: center;
				align-items: center;
				>span{
					display:inline-block;
					font-family: $font-family-base;
					color:$gray-dark;
					text-transform:uppercase;
					margin:0 14px;
					&:first-child{
						margin: 0;
						background: url('#{$image-theme-path}background-countdown.png') no-repeat;
						background-position: center;
						background-size: contain;
						padding: 19px 16px 14px;
						position: relative;
						top: -3px;
					}
				}
				.countdown-amount{
					font-size:18px;
					display:block;
					line-height:21px;
					margin-bottom: 2px;
					font-weight:700;
					position:relative;
				}
				.countdown-text{
					font-size:13px;
					line-height:10px;
					display:block;
					font-weight:300;
				}
			}
		}
		@media(max-width: $screen-xs){
			.countdown-deal{
				.countdown-content{
					justify-content: flex-start;
				}
			}
		}
	}
	&.default2{
	   .product-title{
			font-size: 18px;
			margin: 0;
			text-transform: uppercase;
			a{
				color: $blue-light; 	
			}
		}
		.product-price{
			color: $white;
			font-size: 18px;
			font-weight: 700;
			font-family:$font-family-base;
			text-transform:uppercase;
			color: $theme-color;
			margin-bottom: 10px;
			.start{
				font-weight: 200;
			}
		}
		.countdown-deal{
			margin-top: 25px;
			margin-bottom: 20px;
			@include transition(all 0.3s ease);
			align-items: center;
			display: flex;
			label{
				font-size: 12px;
				text-transform:uppercase;
				margin-bottom:0;
				@include rtl-margin-right(12px);
				color: rgba($blue-light, .8);
			}
			.item-countdown{
				text-align:center;
			}
			.countdown-content{
				display:flex;
				text-align: center;
				align-items: center;
				>span{
					display:inline-block;
					font-family: $font-family-base;
					color:$theme-color;
					text-transform:uppercase;
					margin:0 14px;
					&:first-child{
						margin: 0;
						background: url('#{$image-theme-path}background-countdown.png') no-repeat;
						background-position: center;
						background-size: contain;
						padding: 19px 16px 14px;
						position: relative;
						top: -3px;
						color: $gray-dark;
					}
				}
				.countdown-amount{
					font-size:18px;
					display:block;
					line-height:21px;
					margin-bottom: 2px;
					font-weight:700;
					position:relative;
				}
				.countdown-text{
					font-size:13px;
					line-height:10px;
					display:block;
					font-weight:300;
				}
			}
		}
		@media(max-width: $screen-xs){
			.countdown-deal{
				.countdown-content{
					justify-content: flex-start;
				}
			}
		}
	}
}

[-] _shortcodes.scss [edit]
[+] ..
[-] _woocommerce-product.scss [edit]
[-] _post.scss [edit]
[-] _woocommerce-widgets.scss [edit]
[-] _form.scss [edit]
[-] _effect.scss [edit]
[-] _woocommerce-responsive.scss [edit]
[-] _woocommerce-general.scss [edit]
[-] _responsive.scss [edit]
[-] _woof.scss [edit]
[-] _menu.scss [edit]
[-] _utilities.scss [edit]
[-] _base.scss [edit]
[-] _layout.scss [edit]
[-] _slider.scss [edit]
[-] _widgets-layout.scss [edit]
[-] _pages.scss [edit]
[-] _fonts.scss [edit]
[-] _elementor.scss [edit]
[-] _garenal.scss [edit]
[-] _header.scss [edit]
[-] _woocommerce-page.scss [edit]
[-] _widgets.scss [edit]