.white-bg {
	background-color: $light-color;
}
.bg-light-grey {
	background-color: darken($light-color, 2.7%);
}
.primary-bg {
	background-color: $primary-color;
}
.secondary-bg {
	background-color: $secondary-color;
}
.pl-20 {
	padding-left: 20px;
}
.pr-40 {
	padding-right: 40px;
}
// site preloader css
.site-loader {
	background-color: $light-color;
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 9999;
	text-align: center;
	.preloader-content {
	    position: absolute;
	    top: 50%;
	    left: 50%;
	    @include translate(-50%, -50%);
	    width: 70px;
	}
}

// social share icon
.social-links {
	ul {
		margin: 0;
		padding: 0;
		font-size: 0;
	}
	li {
		display: inline-block;
		list-style: none;
		margin: 0 10px;
	}
	a {
		@include font-size(16);
		color: lighten($dark-color, 25%);
		@include transition(color 0.4s);
		&:hover,
		&:focus,
		&:active {
			color: $hover-color;
		}
	}
}

.social-icon-wrap {
	@include flexbox();
	@include flex-wrap(wrap);
	margin: -5px;
	.social-icon {
		padding: 5px;
		@include flex-grow(1);
		a {
			background-color: $primary-color;
			color: $light-color;
			@include flexbox();
			@include align-items(center);
			@include transition(all 0.3s);
			&:hover {
				-webkit-filter: saturate(1.5) brightness(1.2);
				-moz-filter: saturate(1.5) brightness(1.2);
				-ms-filter: saturate(1.5) brightness(1.2);
				-o-filter: saturate(1.5) brightness(1.2);
				filter: saturate(1.5) brightness(1.2);
			}
		}
		[class*="fa-"] {
			width: 40px;
			text-align: center;
		}
		span {
			background-image: -webkit-gradient(linear,left top,right top,from(rgba(0,0,0,.12)),to(transparent));
 			background-image: -webkit-linear-gradient(left,rgba(0,0,0,.12),transparent); 
			background-image: -o-linear-gradient(left,rgba(0,0,0,.12),transparent);
			background-image: linear-gradient(90deg,rgba(0,0,0,.12),transparent);
			padding: 10px 15px;
		}
	}
	.social-facebook {
		a {
			background-color: #3b5998;
		}
	}
	.social-pinterest {
		a {
			background-color: #bd081c;
		}
	}
	.social-whatsapp {
		a {
			background-color: #25d366;
		}
	}
	.social-linkedin {
		a {
			background-color: #0077b5;
		}
	}
	.social-twitter {
		a {
			background-color: #1da1f2;
		}
	}
	.social-google {
		a {
			background-color: #dd4b39;
		}
	}
}

// back to top css
.to-top-icon {
	background-color: rgba($primary-color, 0.7);
	color: $light-color;
	font-size: 20px;
	display: none;
	line-height: 45px;
	text-align: center;
	@include border-radius(100%);
	width: 45px;
	height: 45px;
	position: fixed;
	right: 15px;
	bottom: 15px;
	z-index: 99;
	@include transition(background-color 0.3s, color 0.3s);
	&:hover {
		background-color: $hover-color;
		color: $light-color;
	}
	@include bp(smx) {
		width: 25px;
		height: 25px;
		line-height: 25px;
		font-size: 13px;
		right: 10px;
		bottom: 10px;
	}
}