Uname: Linux premium294.web-hosting.com 4.18.0-553.45.1.lve.el8.x86_64 #1 SMP Wed Mar 26 12:08:09 UTC 2025 x86_64
Software: LiteSpeed
PHP version: 8.1.32 [ PHP INFO ] PHP os: Linux
Server Ip: 104.21.32.1
Your Ip: 216.73.216.221
User: mjbynoyq (1574) | Group: mjbynoyq (1570)
Safe Mode: OFF
Disable Function:
NONE

name : _widgets.scss
/************************************************************************************************
    TOP BANNER LISTING
************************************************************************************************ */
.bwp_widget_image{
    margin-bottom: 40px;
    .container-banner{
        position: absolute;
        top: 50%;
        -moz-transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
        .boxContent {
            max-width: 640px;
            padding: 30px;
            text-align: center;
            color: white;
             .boxSubTitle {
                margin: 0px;
                padding: 10px 0;
                font-size: 24px;
                font-weight: 400;
                text-transform: uppercase;
            }
            .boxTitle {
                margin: 0px;
                padding: 10px 0;
                font-size: 42px;
                font-weight: bold;
                text-transform: uppercase;
                color: #fff;
            }
            .btn {
                font-size: 16px;
                font-weight: bold;
                margin: 20px 0 0;
                padding: 5px 20px;
                height: 42px;
                border: 1px solid white;
                background-color: transparent;
                color: white;
                text-transform: uppercase;
                text-decoration: none;
                @include transition(opacity 0.3s ease-in-out 0.3s);
                &:hover {
                    border-color: $theme-color; 
                    background-color: $theme-color;
                }
            } 
        }
    }
}

/*
    widget styles
*------------------------------------
*/
.title_block {
    h4 {
        font-size: $font-size-base + 4;
        text-align: center;
        position: relative;
        text-transform: uppercase;
        line-height: 100%;
        letter-spacing: 2px;
        padding-bottom: 15px;
        padding-bottom: 20px;
        margin-bottom: 30px;
        &:before,&:after{
            content: "";
            height: 1px;
            position: absolute;
            bottom: 0;
            @include rtl-left(50%);
        }
        &:before{
            width: 20%;
            @include rtl-margin-left(-10%);
            background-color: $border-color;
        }
        &:after{
            width: 10%;
            @include rtl-margin-left(-5%);
            background-color: #616161;
            z-index: 1;
        }
    }
}
    

/*
    Widget Genaral
*------------------------------------
*/
.widget{
    label{  
        font-weight: $font-weight-base;
    }
    // widget image
    .widget_sp_image-image-link{
        display: block;
        overflow: hidden;
        position: relative;
        img{
            @include img-responsive();
            @include transition(all 0.35s);
            @extend .filter-grayscale;
        }
    }
    // widget post
    .post-widget{
        .image{
            @include size(70px,70px);
            margin: 0;
            @include rtl-margin-right(10px);
            img{
                @include size(percentage(1),percentage(1));
            }
        }
    }
    // widget archive
    &.widget_archive{
        @include lists-style();
    }
    // widget categories
    &.widget_categories{
        //@include lists-style();
    }
    // widget page
    &.widget_pages{
        @include lists-style();
    }
    // widget meta
    &.widget_meta{
        @include lists-style();
    }
    // widget nav menu
    &.widget_nav_menu{
        @include lists-style();
    }
    &.widget_rss{
        @include lists-style();
        ul li{
            background: none;
            margin-bottom: 10px;
            a{
                padding: 0;
            }
        }
    }
    // widget recent entries
    &.widget_recent_entries{
        @include lists-style();
        ul li{
            background: none;
        }
    }
    // widget recent comments
    &.widget_recent_comments{
        @include lists-style();
        ul li{
            background: none;
        }
    }
    // widget rss
    &.widget_rss{
        @include lists-style();
        ul li{
            background: none;
            a{
                padding: 0;
            }
            &:before{
                display: none;
            }
        }
    }
}

/*
    Widget Contact Us
*------------------------------------
*/
.contact{
    margin: 0;
    padding: 0;
	@include clearfix();
	dt{
		@include rtl-float-left();
		@include size(30px,auto);
	}
	dd{
		overflow: hidden;
		margin-bottom: 5px;
	}
    .contact-icon{
        display: block;
        text-align: center;
        background: $contact-icon-bg;
        @include rtl-float-left();
        @include square($contact-icon-size);
        @include border-radius($contact-icon-border-radius);
        .fa{
            color: $contact-icon-color;
            @include font-size(font-size,$font-size-base);
            @include rtl-margin(0, 0, 0, 4px);
        }
    }
}

/*
    Widget Newsletter
*------------------------------------
*/
.wpcf7-form{
    div.wpcf7-validation-errors, div.wpcf7-acceptance-missing{
        margin-top: 15px;
    }
}
.wpbingo-newsletter-1{
	background-color: transparent;
	z-index: 1;
	position: relative;
	display:flex;
	align-items:center;
	flex-wrap:wrap;

	.title{
		font-size:18px;
		font-weight:700;
		color:$white;
		line-height:25px;
		text-transform:uppercase;
	}
	.sub-title {
		color:$text-color;
	}
	
	.content-newsletter{
		margin-left:90px;
		position: relative;
		flex: 1;
		display:flex;
		align-items:center;
		@media (max-width:$screen-md-max){
			margin-left:40px;
		}
		@media (max-width:$screen-sm-max){
			margin-left:0;
			margin-bottom:25px;
		}
		@media (max-width:$screen-xs-max){
			 max-width: unset;
			 min-width: unset;
		}
		input[type="email"]{
			height: 40px;
			line-height:40px;
		} 
		.clearfix{
			position:relative;
		}
		.your-email{
			flex:1;
		}
	}
	input[type="email"] {
		border: 0;
		background: white;
		font-weight: 300;
		width: 100%;
		padding:0 20px;
		border:none;
		@include placeholder($light-gray);
		@media(max-width:$screen-md-max){
			padding:0 15px;
		}
		&::placeholder {
			font-size:14px;
		}
	}
	input[type="submit"] {
		background:transparent;
		border:0;
		text-transform:uppercase;
		color:$white;
		font-size:14px;
		@include rtl-margin-left(10px);
		cursor:pointer;
		line-height:40px;
		padding:0 15px;
		&:hover{
			background:$gray-dark;
			color:$white;
		}
	}
	span.wpcf7-not-valid-tip{
		margin-top: 15px;
	}
	@media (max-width:$screen-sm-max){
		.title-newsletter{
			width:100%;
			text-align:center;
			margin-bottom:25px;
		}
	}
}
.wpbingo-newsletter-1-1{
	background-color: transparent;
	z-index: 1;
	position: relative;
	display:flex;
	align-items:center;
	flex-wrap:wrap;
	.content-newsletter{
		position: relative;
		flex: 1;
		display:flex;
		align-items:center;
		input[type="email"]{
			height: 55px;
			line-height:55px;
		} 
		.clearfix{
			position:relative;
		}
		.your-email{
			flex:1;
		}
	}
	input[type="email"] {
		border: 0;
		background: white;
		font-weight: 300;
		width: 100%;
		padding:0 20px;
		border:none;
		border:1px solid rgba($light-gray,0.5);
		@include placeholder($light-gray);
		@media(max-width:$screen-md-max){
			padding:0 15px;
		}
		&::placeholder {
			font-size:14px;
		}
	}
	input[type="submit"] {
		background:transparent;
		border:0;
		text-transform:uppercase;
		color:$white;
		font-size:14px;
		cursor:pointer;
		line-height:55px;
		padding:0 15px;
		&:hover{
			background:$gray-dark;
			color:$white;
		}
	}
	span.wpcf7-not-valid-tip{
		margin-top: 15px;
	}
	@media (max-width:$screen-sm-max){
		.title-newsletter{
			width:100%;
			text-align:center;
			margin-bottom:25px;
		}
	}
}
.wpbingo-newsletter{
	&.newsletter-default{
		.content-newsletter{
			max-width:690px;
			margin:auto;
			display:flex;
			.wpcf7-form-control-wrap{
				width:100%;
			}
			input[type="email"]{
				width:100%;
				border:0;
				padding:0 20px;
				height:55px;
				line-height:55px;
				font-size:14px;
				background:$white;
				&::placeholder{
					color: #a8a7a7;
				}
				@media(max-width: $screen-xs){
					padding: 0 10px;
				}
			}
			input[type="submit"]{
				border:0;
				background:$gray-dark;
				font-size:14px;
				text-transform:uppercase;
				color:$white;
				padding:0 40px;
				height:55px;
				line-height:55px;
				font-weight:600;
				position:relative;
				top:0;
				cursor:pointer;
				letter-spacing:1.5px;
				&:hover{
					background: #ff9600;
				}
				@media (max-width:$screen-xs){
					padding:0 20px;
				}
			}
			.clearfix{
				position:relative;
			}
			.ajax-loader{
				position:absolute;
				left:calc(50% - 8px);
			}
		}
	}
    &.wpbingo-newsletter-sidebar{
        background: #f5f5f5;
        @include rtl-padding(35px, 20px, 40px, 20px);
        color: $gray-dark;
        .content-newsletter{
            display: block;
        }
        input[type="email"]{
            border: 2px solid #dedede;
            background: $white;
            margin-bottom: 10px;
        }
        input[type="submit"]{
            width: 100%;
        }
    }
}

/* Owl carousel post */
.bwp-recent-post {
	@media(max-width: $screen-md-max){
		.slick-list{
			margin: 0 -7.5px;
			.post-grid{
				padding: 0 7.5px;
			}
		}
	}
	&.slider{
		.bwp-heading-content{
            display: flex;
            justify-content: space-between;
            margin: 0 0 25px;
        }
		&:hover{
			.slick-arrow{
				@include opacity-s();
			}
		}
		.title-block h2{
            margin: 0;
            font-size: 24px;
        }
        .page-description{
        	font-size: 16px;
        }
		.btn-all{
            a{
                display:inline-block;
                font-size:12px;
                font-weight:500;
                border-bottom:1px solid $gray-dark;
                &:after{
                    content: "\24";
                    display:inline-block;
                    font-family: eleganticons;
                    font-size:18px;
                    position:relative;
                    top:4px;
                    @include rtl-margin-left(5px);
                }
                &:hover{
                    color:$theme-color;
                    border-color:$theme-color;
                }
            }
        }
		.slick-arrow{
            @media(max-width: $screen-md-max){
                &.fa-angle-left{
                    @include rtl-left(-15px);
                }
                &.fa-angle-right{
                    @include rtl-right(-15px);
                }
            }
        }
		.post-inner{
			@include transition(all 0.3s ease);
			margin-top:10px;
			overflow:hidden;
			border: 1px solid #dddddd;
			&:hover{
				.post-image{
					img{
						@include scale(1.1);
					}
				}
			}
		}
		.post-content{
			padding: 25px 20px;
			background: $white;
		}
		.post-image{
			position:relative;
			overflow:hidden;
			img{
				@include transition(all 0.5s ease);
			}
		}
		.cat-links{
			position:absolute;
			bottom:20px;
			width:100%;
			padding:0 20px;
			ul{
				padding:0;
				list-style:none;
				li{
					display:inline-block;
					@include rtl-margin-right(5px);
					@media(max-width: $screen-xs){
						display: block;
						margin: 0 0 5px;
					}
				}
			}
			a{
				font-size:12px;
				font-weight:600;
				color:$white;
				background:$theme-color;
				line-height:25px;
				padding:0 12px;
				display:inline-block;
			}
		}
		.entry-title{
			font-size:18px;
			font-family:$font-family-second;
			text-transform: uppercase;
			font-weight: 400;
			margin:0px 0 15px;
			@media (max-width:$screen-xs){
				font-size:18px;
			}
		}
		.entry-by{
			display:flex;
			align-items:center;
			font-size:13px;
			font-weight: 500;
			i{
				color:$gray-dark;
				font-size:15px;
				@include rtl-margin-right(10px);
				position:relative;
				top:3px;
			}
			a{
				color:$text-color;
				&:hover{
					color:$theme-color;
				}
			}
			.entry-author{
				display:flex;
				align-items:center;
				&:after{
					content:"";
					width:1px;
					height:20px;
					margin:0 17px;
					display:inline-block;
					background:#c4c4c4;
				}
				i{
					top:2px;
				}
			}
			@media(max-width: $screen-xs){
				font-size: 12px;
				i{
					@include rtl-margin-right(5px);
				}
			}
		}
		@media(max-width: $screen-sm-max){
            .bwp-heading-content{
                display: block;
                text-align: center;
            }
            .title-block h2{
                font-size: 20px;
            }
        }
	}
    &.sidebar{
		.post-grid{
			margin:0;
			&:last-child{
				.item{
					border-bottom:0;
				}
            }
		}
        .item{
			padding:20px;
			border-bottom: 1px solid $border-color;
            >*{
                display: table-cell;
				vertical-align: top;
				@media(max-width:$screen-md-max)and(min-width:$screen-md){
					display:block;
				}
            }
            >.post-thumbnail{
                width: 70px;
				position:relative;
				@media(max-width:$screen-md-max)and(min-width:$screen-md){
					width:100%;
				}
				.cout{
					@include square(24px);
					font-size:10px;
					background:$gray-dark;
					color:$white;
					line-height:24px;
					text-align:center;
					position:absolute;
					top:0;
					@include rtl-left(0);
				}
            }
            .post-content{
				position:relative;
				top:-7px;
                @include rtl-padding-left(20px);
				@media(max-width:$screen-md-max)and(min-width:$screen-md){
					padding:0;
					margin-top:15px;
				}
				.post-categories{
					margin-bottom:5px;
					a{
						font-size:11px;
						color:$theme-color;
						text-transform:uppercase;
						font-weight:700;
					}
				}
                h2.entry-title{
                    font-size: 14px;
                    font-weight: 500;
                    line-height: 20px;
					margin:0;
                    margin-bottom: 3px;
					a{
						color:$gray-dark;
						&:hover{
							color:$theme-color;
						}
					}
                }
                span.entry-date{
                    display: block;
					text-transform:uppercase;
					time{
						color: $text-color;
						font-size:10px;
						font-weight:500;
					}
                }
                .entry-link a{
                    color: $gray-dark;
                    &:hover{
                        color: $theme-color;
                    }
                }
            }
        }
    }	
	&.default{
		.post-content{
			margin-top:10px;
		}
		.categories{
			a{
				color:$theme-color;
				font-size:14px;
				&:hover{
					color:$gray-dark;
				}
			}
		}
		.entry-title{
			line-height:1.3;
			font-size:16px;
			margin-bottom:0;
			margin-top:0;
		}
		.date-cmt{
			display:flex;
			time.entry-date{
				color:$text-color;
				font-size:14px;
			}
		}
		.entry-meta-head{
			font-size:14px;
			color:$text-color;
			&:before{
				content:"-";
				display:inline-block;
				margin:0 3px 0 5px;
			}
		}
	}
	&.blog-menu{
		.post-thumbnail{
			display:inline-block;
			max-width:125px;
			flex:0 0 125px;
			img{
				max-width:125px;
			}
		}
		.item{
			display:flex;
		}
		.post-content{
			@include rtl-padding-left(30px);
		}
		.entry-title{
			font-size:16px;
			margin:0 0 5px;
		}
		.post-grid{
			margin-bottom:15px;
			&:last-child{
				margin-bottom:0;
			}
		}
		.day-cmt{
			>*{
				display:inline-block;
				font-size:14px;
				color:$text-color;
				&:before{
					content:"|";
					display:inline-block;
					margin:0 5px;
					color:$gray-light;
				}
				&:first-child{
					&:before{
						display:none;
					}
				}
				a{
					color:$text-color;
				}
				time{
					color:$text-color;
				}
			}
		}
	}
}

.widget_text{
    select{
        width: 100%;
		white-space: pre-wrap;
    }
}

.sidebar{
    .widget{
        > ul{
            ul.children{
                padding: 0 20px;
            }
        }
        ul.sub-menu{
            padding: 0 20px;
        }
    }
}

.template-news{
    .#{$app-prefix}-sidebar{
        .post-widget,
        .comment-widget{
            .blog-title,h6{
                text-transform: none;
                font-weight: 700;
                @include font-size(font-size,12px);
            }
        }
    }
}


.flickr-gallery{
	img{
        padding: 0;
        margin: 4px;
        @include size(60px,60px);
        @include rtl-float-left();
	}
}

/*
   Widget Sidebar
*------------------------------------
*/
.#{$app-prefix}-sidebar{
    >.widget{
        margin-bottom: 30px;
		padding:0;
		border:none;
        &:empty{
            display: none;
        }
        &:last-child{
            margin-bottom: 0;
        }
		&.bwp_widget_image{
			padding:0;
			overflow:hidden;
			border:none;
			.bwp-image{
				@media(max-width:$screen-sm-max){
					text-align:center;
				}
			}
		}
		&.widget_product_categories{
			margin-bottom:50px;
		}
		.bwp-filter-size{
			margin-bottom:55px !important;
		}
		&.widget_categories{
			ul{
				li{
					padding:15px 0 !important;
					font-size:11px;
					font-weight:500;
					a{
						color:$text-color;
						&:hover{
							color:$theme-color;
						}
					}
					&:last-child{
						border-bottom:0;
					}
					&.current-cat{
						a{
							color:$theme-color ;
						}
					}
					.children{
						li{
							&:last-child{
								padding-bottom:0 ;
							}
						}
					}
				}
			}
		}
		&.widget_rss{
			.rss-widget-icon{
				margin-top:3px !important;
			}
			ul li{
				@include rtl-padding-left(0 !important);
			}
		}
		&.dokan-store-widget{
			&.dokan-category-menu{
				ul{
					li{
						padding: 5px 0 !important;
						a{
							padding:0 !important;
							border-bottom:0 !important;
							font-size:15px !important;
							margin:0 !important;
							&:hover{
								color:$theme-color !important;
							}
						}
					}
				}
				#cat-drop-stack{
					ul li:last-child.has-children a{
						border-bottom:0 !important;
					}
					> ul li.parent-cat-wrap ul.level-0{
						background:transparent;
					}
				}
			}
			&.widget_products{
				.product_list_widget{
					li{
						padding:0;
						display:flex;
						margin-bottom:20px;
						&:last-child{
							margin-bottom:0;
						}
						&:before{
							display:none;
						}
						.product-title{
							font-size:15px;
							color:$text-color;
							font-weight:400;
							display:block;
						}
						.thumbnail-content{
							width:100%;
							max-width:100px;
						}
						.box-content{
							@include rtl-padding-left(20px);
						}
						.woocommerce-Price-amount{
							color:$gray-dark;
							font-size:16px;
							>span{
								color:$gray-dark;
							}
						}
						ins{text-decoration: none;}
						del{
							.woocommerce-Price-amount{
								color:$text-color;
								font-weight:400;
								font-size:14px;
								>span{
									color:$text-color;
									font-weight:400;
								}
							}
						}
					}
				}
			}
			&.dokan-store-contact{
				ul{
					li{
						padding:0 !important;
						&:before{
							display:none;
						}
					}
				}
				.dokan-btn-theme{
					padding:0 20px;
					line-height:40px;
					text-transform:uppercase;
					font-weight:500 !important;
					font-size:12px;
					letter-spacing:2px;
				}
			}
			#cat-drop-stack > ul li a{
				color:$text-color;
				&:hover{
					color:$theme-color;
				}
			}
		}
        .widgettitle, .widget-title, .title_brand h2{
            color: $block-sidebar-heading-color;
            padding: $block-sidebar-heading-padding;
            background: $block-sidebar-heading-hightlight-bg;
            font-weight: $block-sidebar-heading-font-weight;
            font-size: $block-sidebar-heading-font-size;
            margin: $block-sidebar-heading-margin;
            position: relative;
			text-transform: uppercase;
			border:0;
			@include rtl-border-left(3px solid $theme-color);
			line-height:20px;
			.rsswidget{
				.rss-widget-icon{
					margin-top:5px;
				}
			}
        }
        >div >ul:not(.social-link), >ul{
            @include rtl-padding-left(0px !important);
            margin-top: -7px;
            margin-bottom: -7px;
            >li{
                a, span{
					color: $text-color;           
                }
                &.current-cat, &.open{
                    > a{
                        color: $theme-color;
                    }
                }
            }
        }
        ul:not(.social-link,.content-products,.product_list_widget){
            background: $block-sidebar-hightlight-content-bg;
            padding: 0;
            border: none;
            @include rtl-padding-left(15px);
            li:not(.recentcomments){
                padding: 5px 0;
                list-style: none;
                color: $text-color;
                &:first-child{
                    padding-top: 0;
					border-top:none;
                }
                .count{
					display:inline-block;
                }
                a:not(.rsswidget){
                    color: $text-color;
                    &:hover, &.active{
                        color: $theme-color;
                    }
                }
                &.current-cat{
					color: $theme-color;
                    > a, > span{
                        color: $theme-color;
                        cursor: pointer;
                        .count{
                            color: $theme-color;
                        }
                    }
					&:before{
						color: $theme-color !important;
					}
                }
            }
			&.children{
				margin-top:12px;
				li{
					&:last-child{
						padding-bottom:0;
					}
				}
			}
            li.cat-parent{
                .children{
                    li{
                        @include rtl-padding-left(20px);
                    }
                }
            }
        }
        &.widget_recent_comments{
            ul{
				li{
					padding: 5px 0;
					list-style: none;
					color: $text-color;
					@include rtl-padding-left(20px);
					&:first-child{
						padding-top: 0;
						border-top:none;
					}
					&:before{
						content: "\f0e6";
						font-family: FontAwesome;
						font-size:13px;
						color:rgba($text-color,0.5);
						@include rtl-margin-right(10px);
						@include rtl-margin-left(-20px);
					}
					a{
						color:$text-color;
						word-break: break-word;
						&:hover{
							color:$theme-color;
						}
					}
				}
			}
        }
        &.widget_search{
			#searchsubmit{
				font-size:0;
				height:45px;
				@include transform(rotateY(180deg));
				background:$gray-dark;
				padding:0 20px;
				@include border-radius(0);
				&:hover{
					background:darken($theme-color,10%);
					i{
						color:$white;
					}
				}
			}
			i{
				font-size:18px;
				line-height:45px;
				color:$white;
			}
			span{
				line-height:45px;
				color:$white;
			}
        }
		&.widget_archive,&.widget_text,&.widget_categories{
			select{
				margin-bottom:10px;
			}
		}
        &.widget_rss{
            ul{
				li{
					@include rtl-margin-left(0!important);
					>div{
						font-style: italic;
						color:rgba($text-color,0.7);
					}
					a{
						display: block;
						color: $gray-dark;
						&:hover{
							color:$theme-color;
						}
					}
					cite{
						&:before{
							content: "- ";
						}
						&:after{
							content: " -";
						}
					}
				}
			}
        }
        &.widget_tag_cloud{
			.tagcloud a{
				color: $text-color;
				border: 1px solid $border-color;
				overflow:hidden;
				background:transparent;
				padding: 10px 20px;
				text-transform: capitalize;
				position:relative;
				&:before{
					content:"";
					position:absolute;
					bottom:0;
					@include rtl-left(0);
					width:0;
					height:100%;
					background:#efefef;
					z-index:-1;
					@include transition(all 0.3s ease);
				}
				&:hover{
					border-color: $theme-color;
					color: $widget-tag-color-hover;
					&:before{
						width:100%;
						background:$theme-color;
					}
				}
			}
        }
		&.woocommerce.widget_products{
			.product_list_widget{
				padding:0;
				list-style:none;
				li{
					padding:20px !important;
					border-bottom:1px dashed $border-color;
					display:inline-block;
					width:100%;
					&:last-child{
						border-bottom:0;
					}
					img{
						max-width:90px;
						@include rtl-float-left();
						@include rtl-margin-right(20px);
					}
					.product-title{
						font-size:14px;
						color:$gray-dark;
						display:block;
						font-weight:500;
						line-height:18px;
						margin-bottom:10px;
					}
					.woocommerce-Price-amount{
						color:$gray-dark;
						font-weight:500;
						font-size:16px;
						.woocommerce-Price-currencySymbol{
							color:$gray-dark;
						}
					}
					del .woocommerce-Price-amount{
						color:$text-color;
						font-size:12px;
						.woocommerce-Price-currencySymbol{
							color:$text-color;
						}
					}
					ins{
						text-decoration:none;
						.woocommerce-Price-amount{
							color:$theme-color;
							.woocommerce-Price-currencySymbol{
								color:$theme-color;
							}
						}
					}
					a:hover{
						.product-title{
							color:$theme-color;
						}
					}
				}
			}
		}
        .bwp-widget-banner{
            @include rtl-text-align-left();
            margin-bottom: 0;
        }
    }
    ul.social-link{
        li{
            a{
                border: 1px solid $gray-dark;
                @include square(36px);
                background: $gray-dark;
                @include border-radius(50%);
                line-height: 36px;
                text-align: center;
                display: inline-block;
                @include transition(all 0.2s ease);
                i{
                    color: $white;
                }
                &:hover{
                    background: $white;
                    i{
                        color: $gray-dark;
                    }
                }
            }
        }
    }
	&.sidebar-blog{
		>.widget{
			border:1px solid $border-color;
			&:not(.bwp_recent_post_widget){
				&.widget_categories{
					>form{
						border:0 !important;
						select{
							padding:15px 20px;
							border:0;
							background-position: calc(100% - 24px) calc(1em + 12px), calc(100% - 18px) calc(1em + 12px), calc(100% - 2.5em) 0.5em;
							&:focus{
								background-position: calc(100% - 23px) calc(1em + 12px), calc(100% - 18px) calc(1em + 12px), calc(100% - 2.5em) 0.5em;
								background-image: linear-gradient(45deg, transparent 50%, gray 50%), linear-gradient(135deg, gray 50%, transparent 50%), linear-gradient(to right, #ccc, #ccc);
								background-size: 6px 5px, 6px 5px, 0 1.5em;
							}
						}
					}
				}
				&.widget_archive{
					select{
						border:0;
						padding:15px 20px;
						background-position: calc(100% - 24px) calc(1em + 12px), calc(100% - 18px) calc(1em + 12px), calc(100% - 2.5em) 0.5em;
						&:focus{
							background-position: calc(100% - 23px) calc(1em + 12px), calc(100% - 18px) calc(1em + 12px), calc(100% - 2.5em) 0.5em;
							background-image: linear-gradient(45deg, transparent 50%, gray 50%), linear-gradient(135deg, gray 50%, transparent 50%), linear-gradient(to right, #ccc, #ccc);
							background-size: 6px 5px, 6px 5px, 0 1.5em;
						}
					}
				}
			}
			&:not(.widget_rss){
				ul:not(.social-link,.content-products,.product_list_widget){
					margin:0;
					overflow:hidden;
					padding:0;
					&.children{
						padding:0;
					}
					li:not(.recentcomments){
						font-size:14px;
						@include rtl-padding(10px ,2px ,10px ,20px  !important);
						position:relative;
						font-weight:500;
						&:after{
							position:absolute;
							top:0;
							width:500px;
							border-top:1px solid $border-color ;
							height:1px;
							left:calc(50% - 250px);
							content:"";
						}
						&:before{
							content: "\35";
							display: inline-block;
							font-family: eleganticons;
							font-size: 15px;
							margin-right: 3px;
							position: relative;
							top: 1px;
							color:$theme-color;
							line-height:1;
						}
						.children,.sub-menu{
							margin-top:10px;
							padding:0;
							overflow:unset;
							position:relative;
							li:last-child{
								padding-bottom:0 !important;
							}
							&:after{
								position:absolute;
								top:0;
								width:1000px;
								border-top:1px solid $border-color ;
								height:1px;
								left:calc(50% - 500px);
								content:"";
							}
						}
						&:first-child{
							&:after{
								display:none;
							}
						}
						@media (max-width:$screen-md-max){
							@include rtl-padding(10px ,2px ,10px ,10px  !important);
						}
					}
				}
			}
			&.widget_recent_comments{
				ul{
					li{
						color:rgba($text-color,0.75);
						a{
							color:darken($text-color,10%);
							&:hover{
								color:$theme-color;
							}
						}
					}
				}
			}
			.widget-title{
				margin:0;
				border-bottom:1px solid $border-color;
				padding:11px 20px;
				font-family: $font-family-base;
			}
			&.widget_tag_cloud,&.widget_recent_comments,&.widget_calendar,&.widget_text,&.widget_rss,&.widget_search{
				>*:not(.widget-title){
					padding:20px !important;
				}
			}
		}
	}
	&.sidebar-single-product{
		.policy-single{
			@include border-radius(8px);
			background:#f5f5f5 !important;
			li{
				display:flex;
				align-items:center;
				padding:20px !important;
				border-bottom:1px solid $border-color;
				&:last-child{
					border-bottom:0;
				}
				i{
					font-size:40px;
					color:$theme-color;
				}
				h2{
					margin:0;
					font-size:14px;
					text-transform:uppercase;
					font-weight:600;
				}
				p{
					margin:0;
				}
				.content{
					@include rtl-padding-left(20px);
				}
			}
		}
	}
}

/*
    Widget Newsletter
*------------------------------------
*/
.widget_mc4wp_widget{
	form{
		margin: 0;
	}
}
/*
    Widget Brands
*------------------------------------
*/
.brands {
    .vc_item {
        @include opacity(0.5);
        &.vc_active, &:hover {
            @include opacity(1);
        }
    }
}

/*
    Social
*------------------------------------
*/
.list-social {
    margin: 0;
    line-height: 0;
    text-align: center;
    li{
        display: inline-block;
        margin-bottom: 0 !important;
        a{
            @include border-radius(50%);
            text-align: center;
            margin: 0 18px 0 0;
            @include square(32px);
            overflow: hidden;
            display: block;
            padding: 6px;
            color: #000;
            background: #fff;
            > *{
                display: block;
                color: $black;
                @include font-size(font-size, 18px);
            }
            .fa,[class^="icon-"], [class*=" icon-"]{
                z-index: 1;
                position: relative;
            }
            &:hover{
                > *{
                    color: $social-hover-color;
                }
                background: $theme-color;               
                &.dribbble{
                    background: #F26798;
                }
                &.facebook{
                    background: #3b589e;
                }
                &.google-plus{
                    background: #d44132;
                }
                &.skype{
                    background: #00A8E6;
                }
                &.tumblr{
                    background: #465a74;
                }
                &.twitter{
                    background: #40BBF7;
                }
                &.youtube{
                    background: #F04E43; 
                }
                &.pinterest{

                }
                &.linkedin{
                    background: #F8659C;
                }
            }
        }
        &:last-child{
            a{
                margin: 0;
            }
        }
    }
}

/*
    Widget video
*------------------------------------
*/
.wpb_video_widget{
    .video-description{
        text-transform: uppercase;
        font-weight: 400;
        line-height: 30px;
        font-size: 12px;
        color: $black;
    }
    .wpb_wrapper .wpb_video_wrapper{
        padding-top: 60.7%!important;
    }
} 
 
//Block contact information
#block_contact_infos {
    p {margin-bottom: 0;}
    .ct-adress {
        @include rtl-padding-left(30px);
        margin-bottom: 10px;
        &:before{
            content: "\f041";
            font-family: $theme-font-icon-name;
            position: absolute;
            @include rtl-left(0);
            font-size: 17px;
        }
    }
    .ct-phone {
        @include rtl-padding-left(30px);
        margin-bottom: 10px;
        &:before{
            content: "\f10b";
            font-family: $theme-font-icon-name;
            position: absolute;
            @include rtl-left(0);
            font-size: 21px;
        }
    }
    .ct-email {
        @include rtl-padding-left(30px);
        &:before{
            content: "\f0e0";
            font-family: $theme-font-icon-name;
            position: absolute;
            @include rtl-left(0);
            font-size: 13px;
        }
    }
}

// Form mail
.mc4wp-form {
    .btn {
        line-height: 20px;
    }
}

 // Ourteam
.bwp-ourteam{
	text-align: center;
	&:hover{
		.slick-arrow{
			@include opacity-s();
		}
	}
	.ourteam-customer-name{
		font-size:14px;
		color:$gray-dark;
		font-weight:600;
		margin-bottom:-2px;
		margin-top: 6px;
		letter-spacing: 0.1em;
		text-transform: uppercase;
	}
	.ourteam-items{
		&:hover{
			.ourteam-image{
				&:before{
					@include opacity-s();
					@include transform(translate(-50%,-50%) scale(1));
				}
				.social-link{
					@include opacity-s();
				}
			}
		}
	}
	.slick-dots{
		margin-top:10px;
	}
	.ourteam-image{
		position:relative;
		text-align:center;
		padding: 30px;
		margin-bottom: -18px;
		&:after{
			content:"";
			top: 0;
			@include rtl-left(0);
			border: 1px solid $theme-color;
			@include size(100%, 85%);
			position: absolute;
			z-index: -1;
		}
		&:before{
			content:"";
			@include square(calc(100% - 60px));
			background:rgba($gray-dark,0.3);
			position:absolute;
			top:50%;
			left:50%;
			@include transform(translate(-50%,-50%) scale(0.8));
			@include transition(all 0.3s ease);
			@include opacity-h();
			z-index:1;
		}
		img{
			width:100%;
		}
		@media(max-width: $screen-xs){
			padding: 20px;
			margin-bottom: -10px;
		}
	}
	.social-link{
		@include opacity-h();
		position:absolute;
		top:50%;
		left:50%;
		width:100%;
		@include transform(translate(-50%,-50%));
		@include transition(all 0.3s ease);
		z-index:2;
		li{
			margin:0 7px;
			a{
				font-size:12px;
				@include square(40px);
				display:inline-block;
				line-height:42px;
				text-align:center;
				background:$white;
				@include border-radius(50%);
				color:$gray-dark;
				i{
					font-size:14px;
					color:$gray-dark;
				}
				&:hover{
					background:$theme-color;
					i{
						color:$white;
					}
				}
			}
		}
	}
}

/************************************************************************************************
    WIDGET TITLE 
*************************************************************************************************/
.widget{
    h1.widget-title{
        font-size: 18px;
        text-transform: uppercase;
        @include rtl-padding(0, 0, 10px, 0);
        margin: 0;
    }
}
/************************************************************************************************
    WIDGET BEST SELLER 
*************************************************************************************************/
.bwp_best_seller{
    .content-best-seller{ 
        margin-top: 15px;
        .post-item{
            margin-bottom: 30px;
            border: 1px solid #f5f5f5;
            display: flex;
        }
        .item-img{
            min-width: 95px;
            img{
                width: 95px;
            }
        }
        .item-content{  
            @include rtl-padding-left(20px);
            @include rtl-padding-right(10px);
            h4{                  
                font-size: 15px;
                font-weight: 500;
                line-height: 25px;
                margin-top: 12px;
                margin-bottom: 7px;
                a{
                    color: $text-color;
                    &:hover{
                        color: $theme-color;
                    }
                }
            }
            del>.woocommerce-Price-amount{
                color: $text-color;
                font-weight: 300;
            }
            .woocommerce-Price-amount{
                color: $theme-color;
                font-weight: 500;
            }
            ins{
                color: $text-color;
                text-decoration: none;
                @include rtl-margin-left(5px);
            }
        }
    }
}

/************************************************************************************************
    WIDGET BANNER 
*************************************************************************************************/
.bwp-widget-banner{
    position: relative;
	@media (max-width:$screen-sm-max){
		.banners {
			.bwp-image{
				img{
					width:100%;
				}
				a{
					display:block;
				}
			}
		}
	}
    &.default{
		.bwp-image-subtitle{
			text-transform:uppercase;
			font-size: 40px;
			line-height: 40px;
			color:$white;
			font-family: $font-family-second;
			margin-bottom:12px;
		}
		.title-banner{
			margin:0 0 22px;
			font-size:14px;
			color:$white;
			letter-spacing: 2px;
			text-transform: uppercase;
		}
		.button{
			font-size:12px;
			line-height:35px;
			display:inline-block;
			padding:0 23px;
			color:$gray-dark;
			background: $white;
			font-weight: 600;
			text-transform: uppercase;
			letter-spacing: 2px;
			@include transition(all .3s ease);
			&:hover{
				background:$theme-color;
				border-color:$theme-color;
				color: $white;
			}
		}
		.banner-wrapper-infor{
			position:absolute;
			top: 50%;
			@include transform(translateY(-50%));
			width: 100%;
			text-align: center;
			padding: 0 15px;
		}
		@media(max-width: $screen-md-max){
			.bwp-image-subtitle{
				font-size: 35px;
				line-height: 35px;
			}
			.title-banner{
				font-size: 13px;
				letter-spacing: 1px;
			}
		}
		@media(max-width: $screen-sm-max){
			.bwp-image-subtitle{
				font-size: 25px;
				line-height: 25px;
			}
			.button{
				font-size: 10px;
				padding: 0 20px;
			}
		}
		@media(max-width: $screen-xs){
			.bwp-image-subtitle{
				font-size: 15px;
				line-height: 15px;
			}
			.title-banner{
				margin: 0 0 15px;
			}
		}
	}
	&.layout-1{
		.banner-wrapper-infor{
			position:absolute;
			width:100%;
			left:0;
			padding:0 30px;
			bottom:35px;
		}
		.bwp-image-subtitle{
			font-size:14px;
			text-transform:uppercase;
			font-weight:600;
			color: $white;
			letter-spacing: 1.5px;
			margin: 0 0 5px;
		}
		.title-banner{
			font-size:26px;
			margin:0 0 20px;
			font-weight: 400;
			color: $white;
			font-family: $font-family-second;
			text-transform:uppercase;
		}
		.button{
			font-size:12px;
			line-height:35px;
			display:inline-block;
			padding:0 23px;
			color:$gray-dark;
			background: $white;
			font-weight: 600;
			text-transform: uppercase;
			letter-spacing: 2px;
			@include transition(all .3s ease);
			&:hover{
				background:$theme-color;
				border-color:$theme-color;
				color: $white;
			}
		}
		@media(max-width:$screen-md-max){
			.banner-wrapper-infor{
				padding: 0 15px;
				bottom: 20px;
			}
			.bwp-image-subtitle{
				letter-spacing: 1px;
				font-size: 13px;
			}
			.title-banner{
				font-size: 20px;
				margin:0 0 15px;
			}
		}
		@media(max-width: $screen-sm-max){
			.bwp-image-subtitle{
				letter-spacing: 0;
			}
			.title-banner{
				font-size: 15px;
			}
			.button{
				font-size: 10px;
				padding: 0 20px;
			}
		}
	}
	&.layout-2{
		.banner-wrapper-infor{
			position:absolute;
			width:100%;
			left:0;
			top:50%;
			@include transform(translateY(-50%));
		}
		.info{
			max-width:400px;
			padding:0 15px;
			@include rtl-margin-left(auto);
		}
		.bwp-image-subtitle{
			font-size:16px;
			font-weight:600;
			color:$white;
			text-transform:uppercase;
		}
		.title-banner{
			font-weight:400;
			margin:0 0 15px;
			font-family: $font-family-second;
			font-size:30px;
			text-transform: uppercase;
			color:$white;
		}
		.button{
			display:inline-block;
			font-size:12px;
			font-weight:600;
			text-transform: uppercase;
			line-height:35px;
			letter-spacing: 1.5px;
			padding:0 25px;
			background:$white;
			@include transition(all 0.2s ease);
			&:hover{
				background:$theme-color;
				color:$white;
			}
		}
		@media(max-width: $screen-md-max){
			.info{
				max-width: 340px;
			}
			.title-banner{
				font-size: 25px;
			}
		}
		@media(max-width: $screen-xs){
			.bwp-image-subtitle{
				font-size: 15px;
			}
			.title-banner{
				font-size: 20px;
				margin: 0 0 10px;
			}
			.button{
				font-size: 10px;
				line-height: 30px;
				padding: 0 20px;
			}
		}
	}
	&.layout-3{
		.banner-wrapper-infor{
			position:absolute;
			top: 50%;
			@include transform(translateY(-50%));
			padding:0 15px;
			width:100%;
			left:0;
			text-align:center;
		}
		.bwp-image-subtitle{
			font-size:28px;
			font-family: $font-family-second;
			color:$white;
			margin: 0 0 5px;
			text-transform:uppercase;
		}
		.title-banner{
			margin:0 0 20px;
			font-size:12px;
			letter-spacing: 2px;
			text-transform:uppercase;
			color:$white;
		}
		.button{
			display:inline-block;
			font-size:12px;
			font-weight:600;
			text-transform: uppercase;
			line-height:35px;
			letter-spacing: 1.5px;
			padding:0 25px;
			color: $white;
			background: #00b9ff;
			@include transition(all 0.2s ease);
			&:hover{
				background:$theme-color;
			}
		}
		@media(max-width: $screen-md-max){
			.bwp-image-subtitle{
				font-size: 25px;
				line-height: 30px;
			}
		}
	}
	&.layout-4{
		.banner-wrapper-infor{
			position:absolute;
			bottom: 30px;
			padding:0 20px;
			width:100%;
			left:0;
		}
		.title-banner{
			margin:0 0 10px;
			font-size:12px;
			letter-spacing: 2px;
			text-transform:uppercase;
			color:$white;
		}
		.bwp-image-subtitle{
			font-size: 24px;
			line-height: 24px;
			margin: 0 0 10px;
			color: $white;
			font-family: $font-family-second;
			text-transform: uppercase;
		}
		.bwp-image-description{
			margin-bottom:12px;
		}
		.button{
			display:inline-block;
			font-size:12px;
			font-weight:600;
			text-transform: uppercase;
			line-height:30px;
			letter-spacing: 1.5px;
			padding:0 20px;
			color: $white;
			background: $gray-dark;
			@include transition(all 0.2s ease);
			&:hover{
				background:$theme-color;
			}
		}
		@media(max-width: $screen-md-max){
			.banner-wrapper-infor{
				bottom: 20px;
			}
			.bwp-image-subtitle{
				font-size: 20px;
			}
		}
	}
	&.layout-5{
		.banner-wrapper-infor{
			position:absolute;
			bottom: 30px;
			padding:0 20px;
			width:100%;
			left:0;
		}
		.title-banner{
			margin:0 0 10px;
			font-size:12px;
			letter-spacing: 2px;
			text-transform:uppercase;
			color:$white;
		}
		.bwp-image-subtitle{
			font-size: 24px;
			line-height: 24px;
			margin: 0 0 10px;
			color: $white;
			font-family: $font-family-second;
			text-transform: uppercase;
		}
		.bwp-image-description{
			margin-bottom:12px;
		}
		.button{
			display:inline-block;
			font-size:12px;
			font-weight:600;
			text-transform: uppercase;
			line-height:30px;
			letter-spacing: 1.5px;
			padding:0 20px;
			color: $white;
			background: #ff0a3e;
			@include transition(all 0.2s ease);
			&:hover{
				background:$theme-color;
			}
		}
		@media(max-width: $screen-md-max){
			.banner-wrapper-infor{
				bottom: 20px;
			}
			.bwp-image-subtitle{
				font-size: 20px;
			}
		}
	}
	&.layout-6{
		.banner-wrapper-infor{
			position:absolute;
			bottom: 45px;
			width:100%;
			left:0;
			padding:0 30px;
		}
		.title-banner{
			margin:0 0 5px;
			font-family: $font-family-second;
			font-size:26px;
			font-weight: 400;
			text-transform: uppercase;
			color:$white;
		}
		.bwp-image-description{
			color:$white;
			line-height: 14px;
			font-size: 14px;
			font-weight: 500;
		}
		.button{
			position: absolute;
			@include rtl-right(0);
			display:inline-block;
			font-size:12px;
			@include rtl-text-align-right();
			font-weight:600;
			min-width: 185px;
			height: 45px;
			line-height:45px;
			padding:0 25px;
			letter-spacing: 2px;
			color: $white;
			text-transform: uppercase;
			background:$gray-dark;
			@include transition(all 0.3s ease);
			clip-path: polygon(20% 0, 100% 0, 100% 100%, 0% 100%);
			&:after{
				font-family:wpbingofont;
				content:"\e91b";
				font-size: 10px;
				display: inline-block;
				@include rtl-margin-left(5px);
				position: relative;
			}
			&:hover{
				background:$theme-color;
				&:after{
					@include rtl-right(-3px);
				}
			}
		}
		@media(max-width: $screen-sm-max){
			.banner-wrapper-infor{
				padding: 0 15px;
			}
			.title-banner{
				font-size: 20px;
			}
		}
	}
	&.layout-7{
		.banner-wrapper-infor{
			position:absolute;
			bottom: 40px;
			padding: 0 35px;
			width:100%;
			left:0;
		}
		.bwp-image-description{
			font-size: 14px;
			font-weight: 500;
			color: $white;
			margin: 0 0 12px;
		}
		.title-banner{
			font-size:24px;
			font-family: $font-family-second;
			font-weight: 400;
			text-transform:uppercase;
			color:$white;
			margin:0 0 6px;
		}
		.button{
			display:inline-block;
			font-size:12px;
			font-weight:600;
			line-height:35px;
			padding:0 25px;
			letter-spacing: 2px;
			color:$white;
			text-transform: uppercase;
			border: 1px solid $white;
			@include transition(all 0.2s ease);
			&:hover{
				background: $theme-color;
				border-color: $theme-color;
			}
		}
		@media(max-width: $screen-sm-max){
			.banner-wrapper-infor{
				bottom: 20px;
				padding: 0 20px;
			}
			.title-banner{
				font-size: 20px;
				margin: 0 0 5px;
			}
			.bwp-image-description{
				line-height: 18px;
				margin: 0 0 10px;
			}
			.button{
				font-size: 10px;
				line-height: 30px;
				padding: 0 20px;
			}
		}
	}
	&.layout-8{
		.banner-wrapper-infor{
			position:absolute;
			bottom: 20px;
			width:100%;
			padding:0 20px;
			left:0;
		}
		.title-banner{
			font-size:20px;
			text-transform:uppercase;
			color:$white;
			font-weight: 400;
			font-family: $font-family-second;
			margin:0 0 5px;
		}
		.button{
			display:inline-block;
			position: relative;
			font-size:12px;
			font-weight:600;
			letter-spacing: 2px;
			text-transform: uppercase;
			color: $white;
			padding-bottom: 3px;
			&:before{
				position: absolute;
				content: "";
				background: $white;
				@include size(100%, 2px);
				bottom: 0;
				left: 0;
				@include transition(all 0.3s ease);
			}
			&:hover{
				&:before{
					width: 50%;
					right: 50%;
				}
			}
		}
		@media(max-width: $screen-md-max){
			.title-banner{
				font-size: 15px;
			}
			.button{
				font-size: 10px;
			}
		}
	}
	&.layout-9{
		.banner-wrapper-infor{
			position:absolute;
			width:100%;
			left:0;
			top: 50%;
			@include transform(translateY(-50%));
			text-align: center;
			padding:0 15px;
		}
		.bwp-image-description{
			font-weight: 500;
			color: $white;
		}
		.title-banner{
			margin:0 0 5px;
			font-size:24px;
			font-weight: 400;
			font-family: $font-family-second;
			color:$white;
		}
	}
	&.layout-10{
		clip-path: polygon(15% 0, 100% 0%, 100% 100%, 0 100%, 0 18%);
		.banner-wrapper-infor{
			position:absolute;
			top:50%;
			@include transform(translateY(-50%));
			width:100%;
			left:0;
			padding:0 90px;
		}
		.bwp-image-subtitle{
			text-transform:uppercase;
			font-weight:600;
			font-size: 16px;
			letter-spacing: 1px;
			color: $white;
		}
		.title-banner{
			margin:0 0 10px;
			font-size:34px;
			font-weight: 400;
			font-family: $font-family-second;
			color: $white;
			text-transform:uppercase;
		}
		.button{
			display:inline-block;
			font-size:12px;
			font-weight:600;
			letter-spacing: 2px;
			line-height:35px;
			padding:0 25px;
			background:$white;
			text-transform: uppercase;
			@include transition(all 0.2s ease);
			&:hover{
				background:$theme-color;
				color: $white;
			}
		}
		@media(max-width: $screen-md-max){
			.banner-wrapper-infor{
				padding: 0 50px;
			}
			.title-banner{
				font-size: 30px;
			}
		}
		@media(max-width: $screen-sm-max){
			.banner-wrapper-infor{
				padding: 0 30px;
			}
			.title-banner{
				font-size: 25px;
			}
			.button{
				font-size: 10px;
				padding: 0 20px;
			}
		}
		@media(max-width: $screen-xs-max){
			.title-banner{
				font-size: 20px;
			}
			.bwp-image-subtitle{
				font-size: 12px;
			}
		}
	}
	&.layout-11{
		.banner-wrapper-infor{
			position:absolute;
			width:100%;
			left:0;
			padding:0 60px;
			bottom: 60px;
		}
		.title-banner{
			font-size: 70px;
			margin:0 0 -5px;
			font-weight: 400;
			font-family: $font-family-second;
			-webkit-text-stroke: 1px $white;
			color: transparent;
		}
		.bwp-image-description{
			margin-bottom:20px;
		}
		.button{
			display:inline-block;
			font-size:16px;
			font-weight:600;
			text-transform: uppercase;
			letter-spacing: 2px;
			color: $white;
			position: relative;
			@include rtl-padding-right(30px);
			&:after{
				position: absolute;
				content: "\e913";
				font-family: icomoon;
				font-size: 15px;
				@include rtl-right(5px);
				top: 0;
				@include transition(all 0.2s ease);
			}
			&:hover{
				&:after{
					@include rtl-right(3px);
				}
			}
		}
		@media(max-width: $screen-sm-max){
			.banner-wrapper-infor{
				padding: 0 30px;
				bottom: 30px;
			}
			.title-banner{
				font-size: 45px;
			}
			.button{
				@include rtl-padding-right(25px);
				font-size: 12px;
				&:after{
					font-size: 12px;
				}
			}
		}
		@media(max-width: $screen-xs-max){
			.title-banner{
				font-size: 35px;
				margin: 0;
			}
		}
	}
	&.layout-12{
		.banner-wrapper-infor{
			position: absolute;
			top: 50%;
			left: 0;
			@include transform(translateY(-50%));
			padding: 0 75px;
		}
		.bwp-image-description{
			color: $white;
			letter-spacing: 2px;
			font-size: 16px;
			font-weight: 600;
			text-transform: uppercase;
			margin: 0 0 15px;
		}
		.title-banner{
			font-size:50px;
			text-transform: uppercase;
			font-family: $font-family-second;
			font-weight: 400;
			color: $white;
			margin:0 0 5px;
		}
		.button{
			display:inline-block;
			font-size:12px;
			font-weight:600;
			line-height:35px;
			padding:0 25px;
			letter-spacing: 2px;
			text-transform: uppercase;
			background:$white;
			@include transition(all 0.2s ease);
			&:hover{
				background:$theme-color;
				color:$white;
			}
		}
		@media(max-width: 1441px){
			.title-banner{
				font-size: 45px;
			}
		}
		@media(max-width: $screen-md-max){
			.banner-wrapper-infor{
				padding: 0 50px;
			}
			.title-banner{
				font-size: 30px;
			}
			.bwp-image-description{
				font-size: 11px;
			}
		}
		@media(max-width: $screen-sm-max){
			.banner-wrapper-infor{
				padding: 0 30px;
			}
			.title-banner{
				font-size: 25px;
			}
			.button{
				font-size: 10px;
				padding: 0 20px;
			}
		}
		@media(max-width: $screen-xs-max){
			.title-banner{
				font-size: 20px;
			}
		}
	}
	&.layout-13{
		.banner-wrapper-infor{
			position: absolute;
			top: 50%;
			left: 0;
			@include transform(translateY(-50%));
			padding: 0 75px;
		}
		.bwp-image-description{
			color: $white;
			letter-spacing: 2px;
			font-size: 16px;
			font-weight: 600;
			text-transform: uppercase;
			margin: 0 0 15px;
		}
		.title-banner{
			font-size:34px;
			text-transform: uppercase;
			font-family: $font-family-second;
			font-weight: 400;
			color: $white;
			margin:0 0 5px;
		}
		.button{
			display:inline-block;
			font-size:12px;
			font-weight:600;
			line-height:35px;
			padding:0 25px;
			letter-spacing: 2px;
			text-transform: uppercase;
			background:$white;
			@include transition(all 0.2s ease);
			&:hover{
				background:$theme-color;
				color:$white;
			}
		}
		@media(max-width: $screen-md-max){
			.bwp-image-description{
				font-size: 11px;
			}
			.banner-wrapper-infor{
				padding: 0 50px;
			}
			.title-banner{
				font-size: 30px;
			}
		}
		@media(max-width: $screen-sm-max){
			.banner-wrapper-infor{
				padding: 0 30px;
			}
			.title-banner{
				font-size: 25px;
			}
			.button{
				font-size: 10px;
				padding: 0 20px;
			}
		}
		@media(max-width: $screen-xs-max){
			.title-banner{
				font-size: 20px;
			}
			.bwp-image-description{
				margin: 0 0 5px;
			}
		}
	}
	&.banner-product-countdown{
		text-align:center;
		.title-banner{
			color:$white;
			margin:0 0 -5px;
			text-transform:uppercase;
			font-size:24px;
		}
		.product-title{
			font-size:50px;
			font-weight:500;
			a{
				color:$white;
				&:hover{
					color:$theme-color;
				}
			}
		}
		.product-price{
			color:$white;
			font-size:30px;
			margin-bottom:26px;
			del{
				font-size:18px;
				color:$white;
			}
			ins{
				text-decoration:none;
			}
		}
		.countdown{
			margin-bottom:34px;
			.countdown-content{
				>span{
					display:inline-block;
					margin:0 10px;
				}
				.countdown-amount{
					@include square(65px);
					background:$theme-color;
					color:$white;
					@include border-radius(50%);
					display:inline-block;
					text-align:center;
					line-height:65px;
					font-size:24px;
					font-weight:500;
					margin-bottom:10px;
				}
				.countdown-text{
					display:block;
					font-size:12px;
					text-transform:uppercase;
					color:$white;
					font-weight:600;
				}
			}
		}
		.btn-banner{
			font-size:12px;
			font-weight:500;
			line-height:45px;
			padding:0 50px;
			background:$white;
			text-transform:uppercase;
			display:inline-block;
			&:hover{
				background:$theme-color;
				color:$white;
			}
		}
		@media (max-width:$screen-xs-max){
			.title-banner{
				font-size:16px;
				margin-bottom:15px;
			}
			.product-title{
				font-size:25px;
				line-height:30px;
			}
			.product-price{
				font-size:16px;
				del{
					font-size:13px;
				}
			}
			.countdown .countdown-content{
				> span{
					margin:0 5px;
				}
				.countdown-amount{
					@include square(60px);
					line-height:60px;
				}
			}
		}
	}
	&.banner-countdown{
		text-align: center;
		.title-banner h2{
			margin: 0 0 7px;
			color: $white;
			font-family: $font-family-second;
			font-size: 34px;
			text-transform: uppercase;
			font-weight: 400;
		}
		label{
			color: $white;
			font-size: 14px;
			font-weight: 600;
			margin: 0 0 15px;
		}
		.countdown-content{
			>span{
				@include rtl-margin-right(8px);
				display:inline-block;
				text-align:center;
				&:last-child{
					@include rtl-margin-right(0);
				}
			}
		}
		.countdown-amount{
			display:inline-block;
			@include square(45px);
			background:$theme-color;
			@include border-radius(50%);
			line-height:45px;
			text-align:center;
			font-size:16px;
			font-weight:400;
			font-family: $font-family-second;
			color:$white;
			margin-bottom:5px;
		}
		.countdown-text{
			display:block;
			font-size:11px;
			color:$white;
			font-weight:700;
			text-transform:uppercase;
		}
		@media(max-width: $screen-xs-max){
			.title-banner h2{
				font-size: 30px;
			}
		}
	}
}

/************************************************************************************************
    BWP INSTAGRAM WIDGET
*************************************************************************************************/
.bwp-instagram{
	&.default{
		text-align: center;
		.instagram-title{
			background:$theme-color;
			position:absolute;
			top:0;
			height:100%;
			width:100%;
			left:0;
			display:flex;
			align-items:center;
			justify-content:center;
			h2{
				text-transform:uppercase;
				font-size:14px;
				margin:0 0 10px;
				letter-spacing:1.6px;
				position:relative;
				padding-top:115px;
				color:$white;
				&:before{
					content:"\e911";
					font-family:icomoon;
					font-size:90px;
					position:absolute;
					top:0;
					line-height:1;
					left:50%;
					@include transform(translateX(-50%));
				}
				@media (max-width:$screen-md-max){
					padding-top:80px;
					letter-spacing:0;
					&:before{
						font-size:50px;
					}
				}
			}
			.subtitle{
				font-size:16px;
				color:$white;
			}
			@media (max-width:$screen-sm-max){
				position:unset;
				padding:20px;
			}
		}
		@media (min-width:$screen-md){
			.image-instagram:nth-child(3){
				@include opacity-h();
			}
		}
		.content_instagram.row{
			margin:0;
			.image-instagram{
				padding:0;
				margin:0;
				a{
					margin:0;
				}
			}
		}
	}
    a.instagram{
        display: inline-block;
        margin-bottom:20px;
        position: relative;
        vertical-align: top;
        overflow: hidden;
        img{
            @include transition(transform 0.3s ease);
            @media (max-width: $screen-xs-max) {
				width: 100%;
            }
        }
        &:before{
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            opacity: 0;
            visibility: hidden;
            background-color: rgba(37,37,37,0.45);
            @include transition(opacity 0.3s ease);
            z-index: 1;
        }
        &:after{
            content: "\f16d";
            color: #fff;
            font-family: "FontAwesome";
            font-size: 30px;
            font-weight: 400;
            position: absolute;
            top: calc(50% - 13px);
            left: 0;
            width: 100%;
            text-align: center;
            line-height: 100%;
            opacity: 0;
            visibility: hidden;
            z-index: 2;
            @include transition(opacity 0.3s ease);
        }
        &:hover{
            img{
                @include scale(1.2);
            }
            &:before, &:after{
                opacity: 1;
                visibility: visible;
            }
        }
    }
    &.slider{
		position:relative;
		&:hover{
			.slick-arrow{
				@include opacity-s();
			}
		}
        a.instagram{
            margin-bottom: 0;
        }
		.slick-list{
			margin:0 -7.5px;
		}
		.image-instagram{
			padding:0 7.5px;
		}
    }
	&.slider2{
		position:relative;
		.slick-list {
			margin: 0;
		}
		.slick-slide {
			padding: 0;
		}
        a.instagram{
            margin-bottom: 0;
        }
	}
	&.slider3{
		.instagram-title{
			border-bottom:1px solid $gray-light ;
			margin-bottom:25px;
			h2{
				margin:0;
				font-size:16px;
				padding-bottom:10px;
				font-weight:700;
				position:relative;
				text-transform:uppercase;
				&:before{
					content:"";
					position:absolute;
					bottom:-1px;
					@include rtl-left(0);
					@include size(72px,2px);
					background:$theme-color;
				}
			}
		}
		.slick-list{
			margin:0 -5px;
		}
		.item-instagram{
			padding:0 5px;
		}
		a.instagram{
			margin-bottom:10px;
		}
		.image-instagram{
			&:last-child{
				a.instagram{
					margin-bottom:0;
				}
			}
		}
	}
}

/************************************************************************************************
    BWP POLICY WIDGET
*************************************************************************************************/
.bwp-policy{
    &.default{
		display:flex;
		align-items:center;
		position: relative;
		z-index: 1;
		&:before{
			position: absolute;
			content: "";
			background: #1f2425;
			bottom: 0;
			left: 0;
			@include square(100%);
			z-index: -1;
			clip-path: polygon(0% 0%, 86% 0, 100% 40%, 100% 100%, 0% 100%);
		}
		.image{
			text-align: center;
		}
		&:hover{
			.policy-icon{
				i,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;
				}
			}
		}
		.title-policy{
			margin:0 0 5px;
			font-size:20px;
			color: $white;
			font-weight: 400;
			font-family: $font-family-second;
			text-transform: uppercase;
		}
		.desc-policy{
			font-size:14px;
			font-weight: 500;
			line-height: 20px;
			color: $white;
		}
		.policy-icon{
			i{
				font-size:54px;
				color:$gray-dark;
				display:inline-block;
			}
		}
		.policy-info{
			padding: 15px 20px;
			@include rtl-margin-left(-20px);
		}
		&.style1{
			.image{
				width: 35%;
				flex: 0 0 35%;
				img{
					margin: -58px 0 7px;
				}
			}
		}
		&.style2{
			&:before{
				background: $orange-second;
			}
			.image{
				width: 35%;
				flex: 0 0 35%;
				img{
					margin: -50px 0 15px;
				}
			}
		}
		&.style3{
			&:before{
				background: #0e55d8;
			}
			.image{
				width: 35%;
				flex: 0 0 35%;
				img{
					margin: -66px 0 25px;
				}
			}
		}
		@media(max-width: $screen-md-max){
			.image{
				padding: 0 15px;
			}
			.title-policy{
				font-size: 15px;
			}
			&.style1{
				.image{
					width: 45.5%;
					flex: 0 0 45.5%;
					img{
						margin: -55px 0 0px;
					}
				}
			}
			&.style2{
				.image{
					img{
						margin: -55px 0 12px;
					}
				}
			}
			&.style3{
				.image{
					width: 31.5%;
    				flex: 0 0 31.5%;
					img{
						margin: -65px 0 10px;
					}
				}
			}
		}
		@media(max-width: $screen-sm-max){
			.image{
				padding: 0 10px;
			}
			.desc-policy{
				display: none;
			}
		}
		@media(max-width: $screen-xs-max){
			&.style1{
				.image{
					width: 35%;
    				flex: 0 0 35%;
				}
			}
			&.style2{
				.image{
					width: 30%;
    				flex: 0 0 30%;
				}
			}
			&.style3{
				.image{
					width: 30%;
    				flex: 0 0 30%;
				}
			}
			.desc-policy{
				display: block;
			}
		}
    }
}
.border-policy{
    >.wpb_column{
        .bwp-policy.layout2{
            background: transparent;
        }
    }
}
.border-policy-2{
    margin: 0 !important;
    @media (min-width: $screen-sm){
        display: flex;
    }
    >.wpb_column{
        border: 1px solid rgba($light-gray, 0.3);
        padding-top: 100px;
        padding-bottom: 93px;
        &:not(:last-child){
            @media (min-width: $screen-sm){
                border-right: 0;
            }
            @media (max-width: $screen-xs-max){
                border-bottom: 0;
            }
        }
    }
}
/************************************************************************************************
    BWP video WIDGET
*************************************************************************************************/
.bwp-widget-video {
	&.default{
		position:relative;
		.content-video{
				position:fixed;
				width:100%;
				height:100%;
				top:0;
				left:0;
				display:none;
				z-index:10000;
				background:rgba($gray-dark,0.5);
				.modal-dialog{
					position:absolute;
					top:50%;
					left:50%;
					@include transform(translate(-50%,-50%));
					iframe{
						min-height:60vh;
						width:70vw;
					}
				}
			}
		.bwp-video-btn{
			display:inline-block;
			@include square(90px);
			color:$gray-dark;
			@include border-radius(50%);
			font-size:18px;
			line-height:86px;
			text-indent:3px;
			position:relative;
			text-align:center;
			border:2px solid $gray-dark;
			letter-spacing:0;
			font-weight:400;
			@include rtl-margin-right(15px);
			cursor:pointer;
		}
		.bwp-video{
			font-weight:600;
			text-transform:uppercase;
			font-size:12px;
			letter-spacing:3px;
			&:hover{
				.bwp-video-btn{
					background:$theme-color;
					color:$white;
					border-color:$theme-color;
				}
			}
		}
	}
	&.default2{
		position:relative;
		.bwp-video{
			display:inline-block;
			@include square(110px);
			background:$white;
			color:$gray-dark;
			@include border-radius(50%);
			font-size:18px;
			line-height:110px;
			text-indent:3px;
			position:absolute;
			text-align:center;
			top:calc(50% - 55px);
			left:calc(50% - 55px);
			&:before{
				content:"";
				position:absolute;
				top:calc(50% - 55px);
				left:calc(50% - 55px);
				@include square(110px);
				border:2px solid $white;
				@include border-radius(50%);
				-webkit-animation-name: scale2;
				animation-name: scale2;
				-webkit-animation-duration: 2s;
				animation-duration: 2s;
				-webkit-animation-timing-function: ease-in-out;
				animation-timing-function: ease-in-out;
				-webkit-animation-iteration-count: infinite;
				animation-iteration-count: infinite;
			}
			&:after{
				content:"";
				position:absolute;
				top:calc(50% - 55px);
				left:calc(50% - 55px);
				@include square(110px);
				border:2px solid $white;
				@include border-radius(50%);
				-webkit-animation-name: scale2;
				animation-name: scale2;
				-webkit-animation-duration: 2s;
				animation-duration: 2s;
				-webkit-animation-timing-function: ease-in-out;
				animation-timing-function: ease-in-out;
				-webkit-animation-iteration-count: infinite;
				animation-iteration-count: infinite;
				animation-delay: 1s;
			}
			&:hover{
				background:$theme-color;
				color:$white;
				&:before,&:after{
					border-color:$theme-color;
				}
			}
		}
		@media (max-width:$screen-xs-max){
			.title-video{
				font-size:30px;
			}
		}
	}
	&.layout1{
		text-align:center;
		position:relative;
		&:before{
			position:absolute;
			bottom:0;
			content:"";
			@include size(100%,70%);
			background:$navbar-default-bg;
			left:0;
			z-index:-1;
		}
		.title-video{
			font-size:40px;
			text-transform:uppercase;
			color:$white;
			margin:30px 0 10px;
		}
		.description-video{
			font-size:20px;
			color:$white;
			margin-bottom:30px;
		}
		.bwp-video{
			display:inline-block;
			@include square(106px);
			background:$theme-color;
			color:$white;
			@include border-radius(50%);
			font-size:18px;
			line-height:106px;
			text-indent:3px;
			position:relative;
			&:before{
				content:"";
				position:absolute;
				top:calc(50% - 53px);
				left:calc(50% - 53px);
				@include square(106px);
				border:2px solid $theme-color;
				@include border-radius(50%);
				-webkit-animation-name: scale;
				animation-name: scale;
				-webkit-animation-duration: 2s;
				animation-duration: 2s;
				-webkit-animation-timing-function: ease-in-out;
				animation-timing-function: ease-in-out;
				-webkit-animation-iteration-count: infinite;
				animation-iteration-count: infinite;
			}
			&:after{
				content:"";
				position:absolute;
				top:calc(50% - 53px);
				left:calc(50% - 53px);
				@include square(106px);
				border:2px solid $theme-color;
				@include border-radius(50%);
				-webkit-animation-name: scale;
				animation-name: scale;
				-webkit-animation-duration: 2s;
				animation-duration: 2s;
				-webkit-animation-timing-function: ease-in-out;
				animation-timing-function: ease-in-out;
				-webkit-animation-iteration-count: infinite;
				animation-iteration-count: infinite;
				animation-delay: 1s;
			}
			&:hover{
				background:darken($theme-color,10%);
				&:before,&:after{
					border-color:darken($theme-color,10%);
				}
			}
		}
		.button-video{
			a{
				display:inline-block;
				font-size:12px;
				letter-spacing:3.2px;
				text-transform:uppercase;
				font-weight:500;
				line-height:45px;
				padding:0 40px;
				border:1px solid $white;
				color:$white;
				&:hover{
					background:$theme-color;
					border-color:$theme-color;
				}
			}
		}
		@media (max-width:$screen-xs){
			.title-video{
				font-size:30px;
			}
		}
	}
}
© 2025 XylotrechusZ