/* ---------------------------------------------------------

	 pageWrapper styles
	 dropdown submenu styles
	 headingHead styles
	 hTitle styles
	 blockH styles
	 contentBlock styles
	 btnMore styles
	 btn styles
	 btnText
	 btnThemeOutine
	 btnDefaultOutline
	 btnTheme
	 slickDots
	 slickBars styles
	 pageHeader
	 pageHeaderHolder
	 topBarContactList
	 loginLinksList
	 topBarSearchForm
	 logo
	 pageNavHolder
	 pageNavBtnCart , topBarSearchFormOpener styles
	 pageNavBtnCart
	 pageNav
	 pageMainNavigation
	 pageMainNavOpener styles
	 mainNavCollapse styles
	 mainNavDropdown styles
	 bannerSlider styles
	 bannerSlideHolder styles
	 bannerBlockSlideBg styles
	 bannerSlideHeader styles
	 bannerSliderSlide styles
	 featuresList styles
	 widget styles
	 widgetFormtHead styles
	 aboutIntroBlock styles
	 quoteFormOpener styles
	 widgetQuoteFormCollapse styles
	 servicesBlock styles
	 serviceColumn styles
	 stepsDescrBlock styles
	 stepsGuideList styles
	 filterList styles
	 filtersNavTabs styles
	 prejectsListingBlock styles
	 prPostColumn styles
	 clientsTestimonialBlock styles
	 clientQuote styles
	 ratingStarList styles
	 testimonialSwitcherSlider , testimonialSwitcherSlider02 styles
	 testimonialSwitcherSlider02 styles
	 testimonialSwitcherPicWrap styles
	 videoBlockWrap styles
	 btnPlay styles
	 ltPostsBlock styles
	 ltPostColumn styles
	 pageFooterAreaWrap styles
	 subscribeAsideBlock styles
	 ftAddress styles
	 adrList styles
	 pageFooter styles
	 ftLinksNav styles
	 ftSocialLinks styles
	 wcuBlock styles
	 yoeListing styles
	 wcuBlockImageHolder styles
	 mkCallAside styles
	 wwdTabsetAreaWrap styles
	 wwdTabsetList styles
	 videoAside styles
	 pageHeaderTopBar styles
	 phSocialLinks styles
	 languageSlctDrop styles
	 phAddress styles
	 phadrList styles
	 pgIcnsWrap styles
	 pgSearchForm styles
	 pgSearchFormOpener styles
	 pgSearchCollpase styles
	 bsSwitcherAsideWrap styles
	 bsSwitcher styles
	 bsSSlide styles
	 servicesVisualColumnsBlock styles
	 svcColumn styles
	 prjctDescrColumn styles
	 postTitleTextTag styles
	 prjctColumnImageWrap styles
	 prjctTextHolder styles
	 prjctCatagoriesSlider styles
	 prjctSSlide styles
	 pSsImage styles
	 filtersTabContentWrap styles
	 hwwCBlock styles
	 hwwColumnsList styles
	 shareWTitleWrap styles
	 socialLinksSimple styles
	 bannerBottomAsideBlock styles
	 bannerAsideServicesList styles
	 abtIntroAsideBlock styles
	 swwdPost styles
	 swwdColumnsSlider styles
	 hiwStepsList styles
	 npProjectsSlider styles
	 npssSlide styles
	 powVisualPost styles
	 pricingPlansBlock styles
	 pricePlanColumn styles
	 pricingFeaturesList styles
	 reKtAsideBlock styles
	 popItemColumn styles
	 popActionsList styles
	 moreExploreHolder styles
	 breadcrumb styles
	 pageBdWrapNav styles
	 ctSorterWrapHeader styles
	 viewSorterList styles
	 dsSortDropdown styles
	 pagination styles
	 getResultsWrap styles
	 popItemColumn__listView styles
	 filtersSidebarFWrap styles
	 fSFWHolder styles
	 filtersSidebarOpener styles
	 detailsImageSlider styles
	 disSliderWrap styles
	 disImg styles
	 sdbWDescription styles
	 cartForm styles
	 shpDefinaition styles
	 shpTopIntroWrap styles
	 disSwitcherSlider styles
	 listDefault styles
	 benefitsFeaturedList styles
	 reviewsList styles
	 reviewSubmissionForm styles
	 cartTableWrap styles
	 cartTable styles
	 cartQuantity styles
	 cartTotal styles
	 checkoutAlert styles
	 bilingDetailsWrap styles
	 confirmationBoxWrap styles
	 checkoutCountTable styles
	 custom control styles
	 pmSlctList styles
	 pmPlaceholderImage styles
	 pmNotePop styles
	 otwBlock styles
	 teamColumn styles
	 tcSocialNetworks styles
	 slickGalleryBars styles
	 galleryAreaBlock styles
	 prPCColumnsWrap styles
	 loadMoreBtnWrap styles
	 pageFullBlock styles
	 countdownList styles
	 signWarn styles
	 swwdColumnsSliderType2 styles
	 pdssImage styles
	 prjctDtSliderSwitcher styles
	 pdssvSliderWrap styles
	 pdisImage styles
	 pdbDescriptionHolder styles
	 pdDescrTable styles
	 prdtImageWrap styles
	 contactAreaBlock styles
	 ctMapHolder styles
	 ctAddress styles
	 widgetCtForm styles
	 ctList styles
	 bCenterImage styles
	 btHHead styles
	 bdText styles
	 statusesList styles
	 quoteDefault styles
	 rpPosterSlider styles
	 rpPostsWrap , commentsWrap styles
	 commentsWrap styles
	 bpCommentsList styles
	 comment form styles
	 shareSocialLinks styles
	 piSocialLinks styles
	 wpiTable styles
	 imgLignCenter styles
	 sticky wrap headerFixer styles
	 cshHolderWrap styles
	 cshColumn styles
	 cshColumnFull styles
	 hb-services styles
	 booked-calendar styles
	 pre-active styles
	 back-top styles
	 loader-holder styles
	 
---------------------------------------------------------*/


body{
	-ms-overflow-style: scrollbar;
	min-width: 320px;
}
button,
a{
	@extend %transition;
	outline: none;
}
h1, .h1,
h2, .h2,
h3, .h3,
h4, .h4,
h5, .h5,
h6, .h6{
	a{
		color: inherit;
		&:hover{ color: $link-hover-color; }
	}
}
hr{
	margin-top: 40px;
	margin-bottom: 50px;
}
/* ---------------------------------------------------------
	 pageWrapper styles
---------------------------------------------------------*/
#pageWrapper{
	width: 100%;
	overflow: hidden;
	position: relative;
	//min-height: 99999px;
}
.bgCover{
	background-size: cover;
	background-position: 50% 50%;
}
.inaccessible{ pointer-events: none; }
.hasShadow{ box-shadow: $box-shadow; }
.fwMedium{ font-weight: 500; }
.fwSemiBold{ font-weight: 600; }
.fontRoboto{ font-family: $font-roboto; }
.fontBase{ font-family: $font-family-base; }
.buttonReset{
	border: 0;
	background-color: transparent;
	padding: 0;
}
.bgWhite{ background-color: $white; }
.dropdown-menu{ box-shadow: $box-shadow }
/* ---------------------------------------------------------
	 dropdown submenu styles
---------------------------------------------------------*/
.dropdown-submenu{ position: relative; }
/* ---------------------------------------------------------
	 headingHead styles
---------------------------------------------------------*/
.headingHead{
	p{ margin-bottom: 10px; }
}
/* ---------------------------------------------------------
	 hTitle styles
---------------------------------------------------------*/
.hTitle{
	letter-spacing: 3.4px;
	font-size: 16px;
	line-height: (20/16);
	margin-bottom: 13px;
}
/* ---------------------------------------------------------
	 blockH styles
---------------------------------------------------------*/
.blockH{ margin-bottom: 13px; }
/* ---------------------------------------------------------
	 contentBlock styles
---------------------------------------------------------*/
.contentBlock{
	padding-top: 30px;
	padding-bottom: 30px;
}
/* ---------------------------------------------------------
	 btnMore styles
---------------------------------------------------------*/
.btnMore{
	color: $gray-200;
	&:hover{
		.icn{ transform: translateX(5px); }
	}
	.icn{
		transition: inherit;
		transform: translateX(0);
		font-size: 20px;
		margin-left: 5px;
		@include vertical(inline-block, middle);
	}
}
/* ---------------------------------------------------------
	 btn styles
---------------------------------------------------------*/
.btn{
	font-size: 14px;
	letter-spacing: 1.3px;
	padding: 0;
	border: 0;
	transition: none;
	position: relative;
	@include pseudo(before, 0, 0, 0, 0);
	&.btnRoudedLarge{ border-radius: 99px; }
	&:before{
		content: attr(data-hover);
		opacity: 0;
		transform: translateY(50%) rotateX(90deg);
		transform-origin: right center 0;
		transform-style: preserve-3d;
		transition: all 0.3s ease-in-out 0s;
		padding: $btn-padding-y $input-btn-padding-x;
	}
	&:hover{
		&:before{
			opacity: 1;
			transform: translateY(0px) rotateX(0deg);
		}
		.btnText{
			opacity: 0;
			transform: translateY(-50%) rotateX(90deg);
		}
	}
	.btnText,
	&:before{ border-radius: inherit; }
	.btnIcn{
		vertical-align: middle;
		margin-right: 8px;
		margin-left: 8px;
	}
}
/* ---------------------------------------------------------
	 btnText
---------------------------------------------------------*/
.btnText{
	@extend .inaccessible;
	border: 1px solid transparent;
	transform: translateY(0px) rotateX(0deg);
	transform-origin: right center 0;
	transform-style: preserve-3d;
	transition: all 0.3s ease-in-out 0s;
	opacity: 1;
	padding: $btn-padding-y $input-btn-padding-x;
}
/* ---------------------------------------------------------
	 btnThemeOutine
---------------------------------------------------------*/
.btnThemeOutine{
	background-color: transparent;
	border-color: transparent;
	&.btnThemeOutineNotWhite{
		.btnText{ color: $dark; }
	}
	&:before{ color: $white; }
	.btnText{ color: $white; }
	&:hover{ color: $white; }
}
/* ---------------------------------------------------------
	btnDefaultOutline
---------------------------------------------------------*/
.btnDefaultOutline{
	background-color: transparent;
	border-color: transparent;
	letter-spacing: normal;
	&:before{
		border-color: $dark;
		background-color: $dark;
		color: $white;
	}
	.btnText{
		border-color: $border-color;
		color: $dark;
	}
	&:hover{ color: $white; }
}
/* ---------------------------------------------------------
	 btnTheme
---------------------------------------------------------*/
.btnTheme{
	background-color: transparent;
	border-color: transparent;
	&.btnThemeWhiteInverse{
		.btnText{
			border-color: $white;
			background-color: $white;
		}
	}
	.btnText,
	&:before{ color: $white; }
	&:hover{ color: $white; }
}
/* ---------------------------------------------------------
	 slickDots
---------------------------------------------------------*/
.slickDots{
	line-height: 0;
	margin-bottom: 0;
	padding-top: 10px;
	padding-bottom: 10px;
	li{ margin: 0 5px 5px; }
	button{
		@extend .buttonReset;
		cursor: pointer;
		border-radius: 100%;
		background-color: $light;
		@include text-hide();
		@include size(10px);
	}
}
/* ---------------------------------------------------------
	 slickBars styles
---------------------------------------------------------*/
.slickBars{
	line-height: 0;
	li{ margin: 0 5px 10px; }
	button{
		cursor: pointer;
		padding: 0;
		border: 0;
		background-color: $light;
		@include text-hide();
		@include size(20px, 8px);
		&:hover{ background-color: darken($light, 20%); }
	}
	.prPostsSlider02 &{ padding-top: 20px; }
}
/* ---------------------------------------------------------
	 pageHeader
---------------------------------------------------------*/
#pageHeader{
	position: relative;
	z-index: 999;
	/* pageHeader02 styles */
	&.pageHeader02{
		//margin-top: -16px;
		//transform: translateY(15px);
		//margin-bottom: 15px;
	}
	/* pageHeader04 styles */
	&.pageHeader04{
		.btn{
			min-width: 160px;
			margin-left: 30px;
		}
	}
	&.position-absolute{
		left: 0;
		top: 0;
		width: 100%;
	}
}
/* ---------------------------------------------------------
	 pageHeaderHolder
---------------------------------------------------------*/
.pageHeaderHolder{
	padding-top: 8px;
	padding-bottom: 8px;
	/* pageHeaderHolder02 styles */
	&.pageHeaderHolder02{ padding: 10px; }
	/* pageHeaderHolder03 styles */
	&.pageHeaderHolder03{
		padding-top: 8px;
		padding-bottom: 8px;
	}
}
/* ---------------------------------------------------------
	 topBarContactList
---------------------------------------------------------*/
.topBarContactList{
	font-size: 21px;
	&.topBarContactList02{
		a{
			background-color: transparent;
			color: $gray-300;
		}
	}
	&.barTransparent{ a{ &:hover{ color: $info; } } }
	a{
		padding: 5px 16px;
		color: $white;
		display: block;
		&:hover{
			background-color: $gray-300;
			color: $white;
		}
	}
}
/* ---------------------------------------------------------
	 loginLinksList
---------------------------------------------------------*/
.loginLinksList{
	color: $gray-300;
	position: absolute;
	top: 9px;
	right: 53px;
	font-size: 16px;
	z-index: 1;
	&.loginLinksList02{
		background-color: transparent;
		right: 63px;
		top: 11px;
		color: $white;
		a{ &:hover{ color: $black; } }
	}
	li{ position: relative; }
	a{
		color: inherit;
		display: block;
		border: 1px solid currentColor;
		display: flex;
		align-items: center;
		justify-content: center;
		border-radius: $border-radius;
		@include size(33px, 28px);
	}
}
/* ---------------------------------------------------------
	 topBarSearchForm
---------------------------------------------------------*/
.topBarSearchForm{
	position: absolute;
	left: 0;
	top: 100%;
	right: 0;
	background-color: $white;
	overflow: hidden;
	margin-top: 44px;
	&.topBarSearchForm02{ margin: 47px ($grid-gutter-width / 2) 0; }
	.form-group{
		border-style: solid;
		border-width: 1px 0;
		position: relative;
		padding: 10px 15px;
	}
	button{
		position: absolute;
		top: 24px;
		right: 25px;
	}
}
/* ---------------------------------------------------------
	 logo
---------------------------------------------------------*/
.logo{
	margin: 0 10px 0 0;
	max-width: 93px;
	position: relative;
	z-index: 99;
	/* logo03, logo05 styles */
	&.logo03,
	&.logo05{ margin-top: 0; }
	&.logo05Sticky{
		margin-top: 4px;
		display: none;
	}
	&.logo03Sticky{
		margin: 0;
		display: none;
		position: absolute;
		left: 15px;
		top: 50%;
		transform: translateY(-50%);
	}
}
/* ---------------------------------------------------------
	 pageNavHolder
---------------------------------------------------------*/
.pageNavHolder{
	margin: 0;
	width: calc(100% - 103px);
	/* pageNavHolder03 , pageNavHolder05 styles */
	&.pageNavHolder03,
	&.pageNavHolder05{
		color: $white;
		width: 100%;
		position: relative;
	}
}
/* ---------------------------------------------------------
	 pageNavBtnCart , topBarSearchFormOpener styles
---------------------------------------------------------*/
.pageNavBtnCart,
.topBarSearchFormOpener{
	color: $gray-300;
	border-radius: $border-radius;
	border-style: solid;
	border-width: 1px;
	padding: 0;
	margin-left: 5px;
	font-size: 16px;
	@include size(33px, 28px);
	@include vertical(inline-block, top);
	&.pageNavBtnCart02,
	&.topBarSearchFormOpener02{
		color: $white;
		&:hover{ color: $black; }
	}
}
/* ---------------------------------------------------------
	 pageNavBtnCart
---------------------------------------------------------*/
.pageNavBtnCart{
	margin-right: 28px;
	/* pageNavBtnCart03 styles */
	&.pageNavBtnCart03{
		margin-right: 0;
		margin-left: 15px;
	}
}
/* ---------------------------------------------------------
	 pageNav
---------------------------------------------------------*/
#pageNav{
	border: 0;
	border-radius: 0;
	padding: 0;
	position: static;
}
/* ---------------------------------------------------------
	 pageMainNavigation
---------------------------------------------------------*/
.pageMainNavigation{
	&.navbar-nav{
		width: 100%;
		background-color: $light;
		overflow: hidden;
		/* pageMainNavigation02, pageMainNavigation03 , pageMainNavigation05 styles */
		&.pageMainNavigation02,
		&.pageMainNavigation03,
		&.pageMainNavigation05{
			.nav-link{ &:before{ background-color: $white; } }
		}
		/* pageMainNavigation04 styles */
		&.pageMainNavigation04{
			.nav-link{
				&:before{ display: none; }
			}
		}
		.nav-link{
			position: relative;
			color: $gray-300;
			padding: 5px 15px;
			&:hover,
			&:focus,
			&:active{ outline: none; }
		}
	}
	/* navDropdownList styles */
	.navDropdownList{
		li.dropdown,
		li.dropdown-submenu{
			&:hover{
				> .dropdown-item{ background-color: transparent; }
			}
		}
	}
}
/* ---------------------------------------------------------
	 pageMainNavOpener styles
---------------------------------------------------------*/
.pageMainNavOpener{
	color: $gray-300;
	border-color: currentColor;
	position: relative;
	border-radius: $border-radius;
	padding: 0;
	margin-left: 15px;
	@include size(33px, 28px);
	@include pseudo(before, 5px, 5px, auto, 5px);
	@include pseudo(after, auto, 5px, 5px, 5px);
	/* pageMainNavOpener02 styles */
	&.pageMainNavOpener02{
		color: $white;
		&:hover{ color: $black; }
	}
	/* pageMainNavOpener03 , pageMainNavOpener05 styles */
	&.pageMainNavOpener03,
	&.pageMainNavOpener05{
		position: absolute;
		right: 0;
		top: -34px;
	}
	/* pageMainNavOpener05 styles */
	&.pageMainNavOpener05{ right: 15px; }
	&:after,
	&:before,
	.navbar-toggler-icon{
		background-color: currentColor;
		border-radius: $border-radius-lg;
		height: 2px;
	}
	.navbar-toggler-icon{
		position: absolute;
		left: 5px;
		right: 5px;
		width: auto;
		top: 12px;
	}
}
/* ---------------------------------------------------------
	 mainNavCollapse styles
---------------------------------------------------------*/
.mainNavCollapse{
	&.navbar-collapse{
		position: absolute;
		left: 0;
		padding-bottom: 99999px;
		margin-bottom: -99999px;
		background-color: $light;
		width: 280px;
		top: 45px;
		transform: translateX(-100%);
		box-shadow: 3px 0 5px rgba($black, 0.15);
		/* mainNavCollapse02 , mainNavCollapse03 , mainNavCollapse05 styles */
		&.mainNavCollapse02,
		&.mainNavCollapse03,
		&.mainNavCollapse05{
			transform-origin: 0 0 0;
			transform: scaleY(0);
			width: 100%;
			padding-bottom: 0;
			margin-bottom: 0;
			overflow: hidden !important;
			border-bottom-left-radius: $border-radius;
			border-bottom-right-radius: $border-radius;
			&.show{ transform: scaleY(1); }
		}
		/* mainNavCollapse02 styles */
		&.mainNavCollapse02{
			top: 100%;
			padding-top: 0;
			left: 0;
			right: 0;
		}
		/* mainNavCollapse03 , mainNavCollapse05 styles */
		&.mainNavCollapse03,
		&.mainNavCollapse05{
			padding-top: 0;
			top: 0;
			left: #{$grid-gutter-width / -2};
			width: calc(100% + #{$grid-gutter-width});
		}
		/* mainNavCollapse04 styles */
		&.mainNavCollapse04{ top: 73px; }
		/* mainNavCollapse05 styles */
		&.mainNavCollapse05{
			left: 0;
			width: 100%;
		}
		&.show{ transform: translateX(0); }
	}
}
/* ---------------------------------------------------------
	 mainNavDropdown styles
---------------------------------------------------------*/
.mainNavDropdown{
	&.dropdown-menu{
		@extend %transition;
		border: 0;
		border-top-right-radius: 0;
		border-top-left-radius: 0;
		.dropdown-item{
			padding: 5px 25px;
			&:hover,
			&.active{ color: $white; }
		}
		.dropdown-menu{
			.dropdown-item{
				padding-left: 35px;
				padding-right: 35px;
			}
		}
	}
}
/* ---------------------------------------------------------
	 bannerSlider styles
---------------------------------------------------------*/
.bannerSliderBlock{
	line-height: (24/16);
	letter-spacing: 0.85px;
	overflow: hidden;
	/* bannerSliderBlock02 , bannerSliderBlock03 , bannerSliderBlock04 , bannerSliderBlock05 styles */
	&.bannerSliderBlock02,
	&.bannerSliderBlock03,
	&.bannerSliderBlock04,
	&.bannerSliderBlock05{
		.slick-arrow{
			border-style: solid;
			border-width: 1px;
			background-color: transparent;
		}
	}
	/* bannerSlider03 styles */
	&.bannerSliderBlock03{
		line-height: inherit;
		h1, .h1{ margin-bottom: 13px; }
	}
	/* bannerSliderBlock05 styles */
	&.bannerSliderBlock05{
		h1, .h1{ margin-bottom: 15px; }
	}
	/* bsbOffsetTop styles */
	&.bsbOffsetTop{
		transform: translateY(-16px);
		&.bsbOffsetTop3{ transform: translateY(0); }
	}
	.btnHolder{
		margin-left: -10px;
		margin-right: -10px;
		animation-duration: 1s;
		opacity: 0;
		visibility: hidden;
		transform: translateY(100px);
	}
	.btn{
		min-width: 160px;
		margin: 0 10px 10px;
	}
	.btn-outline-success{ color: $white; }
	h1, .h1{
		color: inherit;
		margin-bottom: 21px;
	}
	.slick-arrow{
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
		z-index: 5;
		color: $white;
		background-color: rgba($white, 0.2);
		border-radius: $border-radius;
		font-size: 18px;
		@include size(50px);
		&:hover{ color: $white; }
	}
	.slickPrev{ left: #{$grid-gutter-width / 2}; }
	.slickNext{ right: #{$grid-gutter-width / 2}; }
	.slickDots{
		position: absolute;
		left: 0;
		bottom: 0;
		right: 0;
	}
}
/* ---------------------------------------------------------
	 bannerSlideHolder styles
---------------------------------------------------------*/
.bannerSlideHolder{
	z-index: 1;
	min-height: calc(100vh - 45px);
	@include v-align(inherit, middle, before);
	/* bannerSlideHolder02 styles */
	&.bannerSlideHolder02{ min-height: calc(100vh - 32px); }
	/* bannerSlideHolder03 styles */
	&.bannerSlideHolder03{ min-height: calc(100vh - 112px); }
	/* bannerSlideHolder05 styles */
	&.bannerSlideHolder05{
		min-height: calc(100vh - 42px);
		> .align{
			max-width: none;
			width: 100%;
		}
	}
	> .align{
		padding-top: 35px;
		padding-bottom: 40px;
	}
}
/* ---------------------------------------------------------
	 bannerBlockSlideBg styles
---------------------------------------------------------*/
.bannerBlockSlideBg{
	left: 0;
	top: 0;
	z-index: -1;
	transform-origin: 50% 50% 0;
	transform: scale(2);
	animation-name: slidersBgFadeScaleAnimateOut;
	animation-timing-function: ease;
	animation-duration: 5s;
	@include size(100%);
	@include pseudo(before, 0, 0, 0, 0);
	&:before{
		@extend .inaccessible;
		background-color: rgba($black, 0.5);
	}
}
/* ---------------------------------------------------------
	 bannerSlideHeader styles
---------------------------------------------------------*/
.bannerSlideHeader{
	margin-bottom: 26px;
	overflow: hidden;
	animation-duration: 1s;
	opacity: 0;
	visibility: hidden;
	transform: translateY(100px);
	/* bannerSlideHeader03 styles */
	&.bannerSlideHeader03{ margin-bottom: 8px; }
}
/* ---------------------------------------------------------
	 bannerSliderSlide styles
---------------------------------------------------------*/
.bannerSliderSlide{
	z-index: 1;
	&.slick-current{
		.bannerBlockSlideBg{
			transform: scale(1);
			animation-name: slidersBgFadeScaleAnimateIn;
		}
		.bannerSlideHeader,
		.btnHolder{
			animation-name: animOne;
			opacity: 1;
			visibility: visible;
			transform: translateY(0);
		}
		.btnHolder{ animation-name: animTwo; }
	}
}
/* ---------------------------------------------------------
	 featuresList styles
---------------------------------------------------------*/
.featuresList{
	margin: 25px -5px 0;
	/* featuresList04 styles */
	&.featuresList04{
		margin: 0;
		padding-top: 31px;
		> li{
			flex-basis: inherit;
			flex-grow: inherit;
			padding-left: 0;
			padding-right: 0;
			&.hover{ .icn{ transform: scaleX(-1); } }
		}
		h3, .h3{ @extend %transition; }
		.icn{
			@extend %transition;
			transform: scaleX(1);
			position: static;
			transform: none;
			opacity: 1;
			font-size: 45px;
			margin-right: 20px;
			margin-top: 7px;
		}
	}
	> li{
		display: flex;
		flex-basis: 0;
		flex-grow: 1;
		min-width: 50%;
		padding-left: 5px;
		padding-right: 5px;
		margin-bottom: 20px;
	}
	.wrap{
		@extend %transition;
		overflow: hidden;
		padding: 12px 5px 12px 10px;
		&.hover{
			color: $white;
			h3, .h3,
			h4, .h4,
			.icn{ color: inherit; }
			.icn{ opacity: 1; }
		}
	}
	h3, .h3{
		transition: inherit;
		font-size: 30px;
		line-height: 1;
		margin-bottom: 9px;
		@include nowrap(block);
	}
	h4, .h4{
		transition: inherit;
		color: inherit;
		font-size: 13px;
		margin-bottom: 0;
		@include nowrap(block);
	}
	.icn{
		transition: inherit;
		position: absolute;
		right: 0;
		top: 50%;
		transform: translate(50%, -50%);
		opacity: 0.6;
		font-size: 45px;
		margin-right: 6px;
		margin-top: -5px;
	}
}
/* ---------------------------------------------------------
	 widget styles
---------------------------------------------------------*/
.widget{
	h3, .h3{ margin-bottom: 22px; }
	/* widgetForm styles */
	&.widgetForm{
		position: relative;
		padding: 30px 30px 52px;
		.form-group{ margin-bottom: 20px; }
		.form-control,
		.custom-select{ height: 46px; }
		textarea{
			&,
			&.form-control{
				resize: none;
				height: 90px;
			}
		}
		.btn{
			min-width: 1px;
			margin-top: 30px;
		}
	}
	/* widget search styles */
	&.widget_search{
		.form-control,
		input[type="search"]{
			border-width: 0 0 1px;
			border-color: $gray-300;
			margin: 0;
			height: 40px;
			padding: 7px 25px 7px 0;
		}
		button{
			position: absolute;
			top: 50%;
			transform: translateY(-50%);
			right: 0;
			font-size: 14px;
		}
	}
	/* widget categories styles */
	&.widget_categories{
		margin-bottom: 38px;
		h3, .h3{ margin-bottom: 12px; }
		.cat-item{
			+ .cat-item{
				a{ border-top: 1px solid $border-color; }
			}
			a{
				color: inherit;
				padding: 10px 14px 11px;
				@include pseudo(before, 0, auto, auto, 0);
				&:before{
					@extend .fas;
					content: '\f101';
					font-size: 11px;
					top: 19px;
				}
				&:hover{ color: $white; }
			}
		}
	}
	/* widgetPriceFilter styles */
	&.widgetPriceFilter{
		h3, .h3{ margin-bottom: 31px; }
		.ui-slider{ margin: 0 3px 20px 11px; }
	}
	/* rpListWidget styles */
	&.rpListWidget{
		h3, .h3{ margin-bottom: 18px; }
		ul{
			> li{
				overflow: hidden;
				margin-bottom: 13px;
			}
		}
		time{
			margin-bottom: 6px;
			font-size: 14px;
			line-height: (18/14);
		}
		.imgWrap{
			@extend %transition;
			border: 1px solid $border-color;
			@include size(70px, 80px);
			&.alignleft{ margin: 7px 20px 0 0; }
			&.imgWrap2{
				margin-top: 0;
				border: 0;
				@include size(70px);
			}
			img{ vertical-align: top; }
		}
		h4, .h4{
			font-size: 16px;
			line-height: (26/16);
			margin-bottom: 10px;
		}
		h5, .h5{ margin-bottom: 0; }
		.descrWrap{ overflow: hidden; }
	}
	/* widget tag cloud styles */
	&.widget_tag_cloud{
		.tagcloud{ margin-left: -10px; }
		.tagcloudItem{
			vertical-align: top;
			color: $gray-300;
			background-color: $light;
			font-size: 14px;
			line-height: (18/14);
			margin-bottom: 10px;
			padding: 5px 16px 7px;
			margin-left: 10px;
			&:hover,
			&.active{ color: $white; }
		}
	}
	/* helpVisualWidget styles */
	&.helpVisualWidget{
		overflow: hidden;
		padding: 22px 10px 29px;
		@include pseudo(before, 0, 0, 0, 0);
		&:before{
			@extend .inaccessible;
			background-color: rgba($dark, 0.7);
		}
		.align{ z-index: 1; }
		h3, .h3{
			color: inherit;
			font-size: 16px;
			line-height: (26/16);
			margin-bottom: 13px;
		}
		.btn{
			vertical-align: top;
			font-size: 12px;
			min-width: 120px;
			&:before{ padding: 8px 10px; }
		}
		.btnText{ padding: 8px 10px; }
	}
	/* widgetShare styles */
	&.widgetShare{
		border: 1px solid $border-color;
		margin-top: 13px;
		padding: 22px 29px 10px;
		h3, .h3{
			font-size: 24px;
			margin-bottom: 24px;
		}
	}
	/* widgetProfilerInfo styles */
	&.widgetProfilerInfo{
		border: 1px solid $border-color;
		font-size: 14px;
		line-height: (24/14);
		padding: 29px 10px 0;
		.picWrap{ margin-bottom: 20px; }
		h3, .h3{ margin-bottom: 11px; }
		p{ margin-bottom: 23px; }
	}
}
/* ---------------------------------------------------------
	 widgetFormtHead styles
---------------------------------------------------------*/
.widgetFormtHead{
	color: $white;
	overflow: hidden;
	margin: -30px -30px 30px;
	padding: 16px 10px 21px;
	font-size: 12px;
	.icn{
		background-image: linear-gradient(90deg, rgba($white,0.5) 0%, rgba($white,0.5) 100%);
		background-repeat: no-repeat;
		background-position: 100% calc(50%  + 2px);
		background-size: 1px 44px;
		padding: 3px 15px 0;
		font-size: 30px;
		width: 67px;
		margin-right: 16px;
	}
	h3, .h3{
		color: inherit;
		font-size: 20px;
		margin-bottom: 0;
	}
	.textTitle{ margin-bottom: 3px; }
	.wrap{
		flex-basis: 0;
		flex-grow: 1;
	}
}
/* ---------------------------------------------------------
	 aboutIntroBlock styles
---------------------------------------------------------*/
.aboutIntroBlock{
	padding-top: 34px;
	padding-bottom: 34px;
	.blockH{ margin-bottom: 22px; }
}
/* ---------------------------------------------------------
	 quoteFormOpener styles
---------------------------------------------------------*/
.quoteFormOpener{
	position: absolute;
	top: 25px;
	right: 0;
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
	transition: all 0.5s ease;
	&[aria-expanded="true"]{
		transform: scaleX(-1);
		right: 272px;
	}
}
/* ---------------------------------------------------------
	 widgetQuoteFormCollapse styles
---------------------------------------------------------*/
.widgetQuoteFormCollapse{
	position: absolute;
	right: 0;
	overflow: visible !important;
	display: block !important;
	transition: transform 0.3s ease !important;
	transform: translateX(100%);
	top: 25px;
	@include size(290px, auto !important);
	&.show,
	&.collapsing{ transform: translateX(0); }
}
/* ---------------------------------------------------------
	 servicesBlock styles
---------------------------------------------------------*/
.servicesBlock{ .headingHead{ margin-bottom: 25px; } }
/* ---------------------------------------------------------
	 serviceColumn styles
---------------------------------------------------------*/
.serviceColumn{
	@extend %transition;
	z-index: 1;
	color: inherit;
	min-height: 260px;
	margin-bottom: 30px;
	&.hover{
		@extend .hasShadow;
		color: $white;
		z-index: 2;
		.columnBgCover{
			opacity: 1;
			visibility: visible;
			transform: scale(1);
		}
		.icn,
		h3, .h3{ color: inherit; }
	}
	.align{ padding: 35px 15px; }
	.icn{
		font-size: 36px;
		margin-bottom: 26px;
	}
	h3, .h3{
		@extend %transition;
		margin-bottom: 12px;
	}
	.columnBgCover{
		@extend %transition;
		left: 0;
		top: 0;
		z-index: -1;
		opacity: 0;
		visibility: hidden;
		transform-origin: 50% 50% 0;
		transform: scale(1.05);
		@include size(100%);
		@include pseudo(before, 0, 0, 0, 0);
		&:before{ opacity: 0.9; }
	}
	p{ margin-bottom: 0; }
}
/* ---------------------------------------------------------
	 stepsDescrBlock styles
---------------------------------------------------------*/
.stepsDescrBlock{
	/* stepsDescrBlock04 styles */
	&.stepsDescrBlock04{
		.alignleft{ margin: 0 0 30px; }
	}
	.headingHead{ margin-bottom: 43px; }
}
/* ---------------------------------------------------------
	 stepsGuideList styles
---------------------------------------------------------*/
.stepsGuideList{
	counter-reset: item;
	> li{
		counter-increment: item;
		position: relative;
		margin-top: 100px;
		@include pseudo(before, auto, auto, 100%, 50%);
		&:first-child{
			margin-top: 0;
			&:before{
				opacity: 0;
				visibility: hidden;
			}
		}
		&:before{
			background-color: rgba($black, 0.1);
			transform: translate(-50%, -50%);
			@include size(1px, 50px);
		}
	}
	.icn{
		@extend %transition;
		border: 4px solid $white;
		margin-bottom: 25px;
		font-size: 30px;
		@include size(100px);
	}
	h3, .h3{
		margin-bottom: 12px;
		&:before{ content: counters(item, ".", decimal-leading-zero) ". "; }
	}
}
/* ---------------------------------------------------------
	 filterList styles
---------------------------------------------------------*/
.filterList{
	overflow: hidden;
	margin-bottom: 0;
	padding-right: 15px;
	padding-top: 37px;
	li{
		position: relative;
		@include pseudo(after, 100%, 0, -999px, auto);
		&:after{
			width: 2px;
			transform-origin: 0 0 0;
			transform: scaleY(0);
		}
		&.active{
			position: absolute;
			left: 0;
			top: 0;
			right: 15px;
			box-shadow: 0 5px 5px -3px rgba($black, 0.1);
			&:after{ transform: scaleY(1); }
			a{ &:after{ transform: scaleX(1); } }
		}
	}
	a{
		color: inherit;
		display: block;
		position: relative;
		padding: 5px 15px;
		@include pseudo(after, auto, 0, 0, 0);
		&.active{
			&:after{ transform: scaleX(1); }
		}
		&:after{
			@extend %transition;
			transform-origin: 50% 0 0;
			transform: scaleX(0);
			height: 2px;
		}
	}
}
/* ---------------------------------------------------------
	 filtersNavTabs styles
---------------------------------------------------------*/
.filtersNavTabs{
	&.nav-tabs{
		border: 0;
		margin-bottom: 10px;
		.nav-item{
			flex-grow: 1;
			flex-basis: 0;
			min-width: 50%;
			margin: 0 -1px -1px 0;
			&:first-child{
				.nav-link{ border-top-left-radius: $border-radius; }
				+ .nav-item{
					.nav-link{ border-top-right-radius: $border-radius; }
				}
			}
			&:last-child{
				.nav-link{ border-radius: 0 0 $border-radius $border-radius; }
			}
		}
		.nav-link{
			color: inherit;
			padding: 4px 10px;
			display: flex;
			align-items: center;
			justify-content: center;
			width: 100%;
			position: relative;
			&:after{ @extend %transition; }
		}
	}
}
/* ---------------------------------------------------------
	 prejectsListingBlock styles
---------------------------------------------------------*/
.prejectsListingBlock{
	/* prejectsListingBlock02 styles */
	&.prejectsListingBlock02{
		z-index: 1;
		@include pseudo(before, 0, 0, auto, 0);
		&:before{
			z-index: -1;
			background-color: $light;
			bottom: 35%;
		}
	}
	.headingHead{ margin-bottom: 15px; }
}
/* ---------------------------------------------------------
	 prPostColumn styles
---------------------------------------------------------*/
.prPostColumn{
	color: inherit;
	width: 100%;
	overflow: hidden;
	margin-bottom: 15px;
	/* prPostColumn02 styles */
	&.prPostColumn02{
		.prColumnBgCover{
			padding-top: 0;
			height: 230px;
		}
	}
	/* prPostColumnInGallery styles */
	&.prPostColumnInGallery{
		.prColumnBgCover{
			padding-top: 0;
			height: 270px;
			@include pseudo(before, 0, 0, 0, 0);
			&:before{
				@extend %transition;
				background-color: $black;
				opacity: 0.6;
			}
		}
	}
	/* galleryHeightLarge styles */
	&.galleryHeightLarge{
		.prColumnBgCover{
			padding-top: 0;
			height: 270px;
		}
	}
	/* prPostColumnwTrow styles */
	&.prPostColumnwTrow{
		width: 270px;
		.prColumnBgCover{
			padding-top: 0;
			height: 200px;
		}
	}
	&.hasOverlay{
		&.hover{
			.prColumnBgCover{
				&:before{ opacity: 0; }
			}
		}
		.prColumnBgCover{
			@include pseudo(before, 0, 0, 0, 0);
			&:before{
				@extend %transition;
				background-color: $black;
				opacity: 0.4;
			}
		}
	}
	&.prPostColumnMbSmall{ margin-bottom: 12px; }
	/* prPostColumnMedium styles */
	&.prPostColumnMedium{
		.prColumnBgCover{
			padding-top: 0;
			height: 260px;
		}
	}
	&.hover{
		.prPostCaption{ transform: translateY(0); }
		.prColumnBgCover{ transform: scale(1.2); }
	}
	.prColumnBgCover{
		@extend %transition;
		transform: scale(1);
		transform-origin: 50% 50% 0;
		width: 100%;
		padding-top: 67.5%;
	}
	.prPostCaption{
		@extend %transition;
		position: absolute;
		left: 20px;
		right: 20px;
		bottom: 20px;
		padding: 16px 20px 17px;
		transform: translateY(200%);
	}
	.hTitle{ letter-spacing: normal; }
	h3, .h3{
		margin-bottom: 0;
		font-size: 18px;
	}
}
/* ---------------------------------------------------------
	 clientsTestimonialBlock styles
---------------------------------------------------------*/
.clientsTestimonialBlock{
	.headingHead{ margin-bottom: 15px; }
	.separator{
		margin-top: 16px;
		margin-bottom: 19px;
	}
	.imgHolder{ margin: 5px 0 0; }
}
/* ---------------------------------------------------------
	 clientQuote styles
---------------------------------------------------------*/
.clientQuote{
	q{
		quotes: none;
		margin-bottom: 20px;
		&:after,
		&:before{ display: none; }
	}
	cite{ font-style: normal; }
	.quoteTitle{ margin-bottom: 10px; }
	h3, .h3{
		font-family: $font-family-sans-serif;
		margin-bottom: 7px;
	}
	h5, .h5{
		font-family: $font-family-sans-serif;
		color: $gray-200;
		margin-bottom: 0;
	}
}
/* ---------------------------------------------------------
	 ratingStarList styles
---------------------------------------------------------*/
.ratingStarList{
	color: $gray-200;
	font-size: 12px;
	line-height: 1;
	/* ratingStarList02 , ratingStarList03 styles */
	&.ratingStarList02,
	&.ratingStarList03{
		font-size: 16px;
		> li{
			margin-right: 7px;
			margin-left: 0;
			&.active{ color: $warning; }
		}
	}
	&.ratingStarList03{
		font-size: 12px;
		> li{
			margin-left: 1px;
			margin-right: 1px;
		}
	}
	> li{ margin-left: 3px; }
}
/* ---------------------------------------------------------
	 testimonialSwitcherSlider , testimonialSwitcherSlider02 styles
---------------------------------------------------------*/
.testimonialSwitcherSlider,
.testimonialSwitcherSlider02{
	width: 100%;
	padding-right: 50px;
	.slick-slide{
		transition: transform 0.7s ease, opacity 0.7s ease;
		width: 40px;
		margin-right: 16px;
		margin-bottom: 25px;
		transform: translateY(15px);
		&.slick-current{
			width: 55px;
			transform: translateY(0);
			.testimonialSwitcherPicWrap{ transform: scale(1); }
		}
	}
	.slick-arrow{
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
		color: $gray-200;
		font-size: 20px;
		margin-top: -12px;
		right: -2px;
	}
	.slickPrev{ margin-right: 24px; }
}
/* ---------------------------------------------------------
	 testimonialSwitcherSlider02 styles
---------------------------------------------------------*/
.testimonialSwitcherSlider02{
	max-width: 290px;
	padding: 27px 35px 0;
	margin-bottom: -79px;
	.slick-slide{
		margin: 0 15px 100px;
		opacity: 0.5;
		&:hover{ opacity: 0.8; }
		&,
		&.slick-current{
			transform: none;
			width: 46px;
		}
		&.slick-current{
			opacity: 1;
			.testimonialSwitcherPicWrap{
				transform: none;
				box-shadow: 0 27px 43px rgba($clr1, 0.15);
			}
		}
	}
	.slick-arrow{
		right: auto;
		margin-top: -36px;
		font-size: 30px;
	}
	.slickPrev{
		margin-right: 0;
		left: 0;
	}
	.slickNext{ right: 0; }
}
/* ---------------------------------------------------------
	 testimonialSwitcherPicWrap styles
---------------------------------------------------------*/
.testimonialSwitcherPicWrap{
	@extend %transition;
	overflow: hidden;
	transform-origin: 0 0 0;
	transform: scale(0.75);
	@include size(55px);
	/* testimonialSwitcherPicWrap02 styles */
	&.testimonialSwitcherPicWrap02{
		transition: none;
		transform: none;
		@include size(46px);
	}
	img{ max-width: none; }
}
/* ---------------------------------------------------------
	 videoBlockWrap styles
---------------------------------------------------------*/
.videoBlockWrap{
	overflow: hidden;
	position: absolute;
	left: 0;
	top: 0;
	@include size(50%, 100%);
	/* videoBlockWrap03 styles */
	&.videoBlockWrap03{
		position: relative;
		left: auto;
		top: auto;
	}
	&.hasOverlay{
		&.hover{
			.videoBlockBgCover{
				&:before{ background-color: rgba($black, 0.2); }
			}
		}
		.videoBlockBgCover{
			@include pseudo(before, 0, 0, 0, 0);
			&.overlayThemeColor{
				&.hover{	
					&:before{ opacity: 0.5; }
				}
				&:before{ opacity: 0.7; }
			}
			&:before{
				@extend %transition;
				@extend .inaccessible;
				background-color: rgba($black, 0.4);
			}
		}
	}
	.videoBlockBgCover{
		left: 0;
		top: 0;
		@include size(100%);
	}
}
/* ---------------------------------------------------------
	 btnPlay styles
---------------------------------------------------------*/
.btnPlay{
	left: 50%;
	top: 50%;
	z-index: 2;
	transform: translate(-50%, -50%);
	background-clip: padding-box;
	border: 10px solid rgba($white, 0.2);
	@include size(80px);
	/* btnPlay02 styles */
	&.btnPlay02{
		background-color: transparent;
		font-size: 61px;
		&:after{ display: none; }
	}
	/* btnPlay04 styles */
	&.btnPlay04{
		border-width: 6px;
		transform: none;
		left: auto;
		top: auto;
		&:hover{ border-width: 10px; }
	}
	&:before{ display: block; }
	&:after{
		content: '';
		display: block;
		transform: translateX(3px);
		@include triangle(30px 22px, $white, right);
	}
}
/* ---------------------------------------------------------
	 ltPostsBlock styles
---------------------------------------------------------*/
.ltPostsBlock{
	.headingHead{ margin-bottom: 47px; }
}
/* ---------------------------------------------------------
	 ltPostColumn styles
---------------------------------------------------------*/
.ltPostColumn{
	color: inherit;
	margin-bottom: 30px;
	overflow: hidden;
	/* ltPostColumn03 styles */
	&.ltPostColumn03{
		h3, .h3{
			font-size: $h3-font-size;
			line-height: (30/22);
		}
		.descriptionWrap{ overflow: hidden; }
	}
	/* ltPostColumn05 styles */
	&.ltPostColumn05{
		overflow: hidden;
		height: 280px;
		&.hover{
			.ltPostBgCoverImage{
				&:before{
					opacity: 0.8;
					visibility: visible;
				}
			}
			.descriptionWrap{
				opacity: 1;
				visibility: visible;
				transform: translateY(0);
			}
			h3, .h3{
				color: inherit;
				a{ &:hover{ color: $black; } }
			}
		}
		h3, .h3{
			color: inherit;
			line-height: (30/22);
			margin-bottom: 5px;
			a{ &:hover{ color: $black; } }
		}
		.descriptionWrap{
			@extend %transition;
			left: 0;
			top: 0;
			z-index: 2;
			transform: translateY(120%);
			opacity: 0;
			visibility: hidden;
			padding: 23px 28px;
		}
		.posterTagline{
			color: inherit;
			a{ &:hover{ color: $black; } }
		}
		.btnMore{
			color: inherit;
			&:hover{ color: $black; }
		}
	}
	&.hover{
		.aligncenter,
		.alignleft{ transform: scale(1.05); }
		.time{ transform: translateY(-36px); }
	}
	.alignleft,
	.aligncenter{
		@extend %transition;
		transform: scale(1);
		transform-origin: 50% 50% 0;
	}
	.aligncenter{
		margin-bottom: 23px;
		img{
			max-width: none;
			width: 100%;
		}
	}
	.alignleft{
		width: 70px;
		margin: 8px 15px 0 0;
	}
	h3, .h3{
		@extend %transition;
		line-height: (30/22);
		margin-bottom: 10px;
		+ .btnMore{ margin-top: 10px; }
	}
	.time{
		@extend %transition;
		transform: translateY(0);
		padding: 3px 8px;
		margin-bottom: 5px;
	}
	.textLarge{
		font-size: 17px;
		line-height: 1;
	}
	.posterTagline{
		color: $gray-200;
		font-size: 14px;
		line-height: (18/14);
		margin-bottom: 10px;
		a{ color: inherit; }
	}
	.sep{
		margin-left: 2px;
		margin-right: 2px;
	}
	.ltPostBgCoverImage{
		left: 0;
		top: 0;
		@include pseudo(before, 0, 0, 0, 0);
		&:before{
			@extend %transition;
			opacity: 0;
			visibility: hidden;
		}
	}
	p{ margin-bottom: 23px; }
}
/* ---------------------------------------------------------
	 pageFooterAreaWrap styles
---------------------------------------------------------*/
.pageFooterAreaWrap{
	color: $gray-200;
	z-index: 1;
	@include pseudo(before, 0, 0, 0, 0);
	&:before{ background-color: rgba($dark, 0.9); }
	.separator{
		border-color: rgba($white, 0.1);
		margin-top: 4px;
		margin-bottom: 48px;
	}
	.pageFooterWrapHolder{ z-index: 2; }
	.col{ margin-bottom: 30px; }
}
/* ---------------------------------------------------------
	 subscribeAsideBlock styles
---------------------------------------------------------*/
.subscribeAsideBlock{
	padding-top: 42px;
	padding-bottom: 42px;
	h3, .h3{ margin-bottom: 10px; }
	.input-group{ margin-top: 17px; }
	.btn{
		height: $input-height;
		.btnText,
		&:before{
			padding-top: 8px;
			padding-bottom: 8px;
			height: inherit;
		}
	}
	.form-control{ border-color: $white; }
	p{ margin-bottom: 0; }
}
/* ---------------------------------------------------------
	 ftAddress styles
---------------------------------------------------------*/
.ftAddress{
	font: inherit;
	margin-bottom: 20px;
}
/* ---------------------------------------------------------
	 adrList styles
---------------------------------------------------------*/
.adrList{
	li{
		display: flex;
		justify-content: center;
		margin-bottom: 6px;
	}
	.icn{
		width: 16px;
		font-size: 14px;
		margin-right: 9px;
		margin-top: 6px;
	}
	a{
		color: inherit;
		&:hover{ color: $white; }
	}
}
/* ---------------------------------------------------------
	 pageFooter styles
---------------------------------------------------------*/
#pageFooter{
	padding-top: 60px;
	.logo{
		margin-right: 0;
		position: absolute;
		left: 50%;
		top: 0;
		transform: translateX(-50%);
	}
	h3, .h3{
		margin-top: 7px;
		margin-bottom: 27px;
	}
	p{
		a{
			color: inherit;
			&:hover{ color: $white; }
		}
	}
}
/* ---------------------------------------------------------
	 ftLinksNav styles
---------------------------------------------------------*/
.ftLinksNav{
	li{
		margin-bottom: 10px;
		&.active{ a{ color: $white; } }
	}
	a{
		color: inherit;
		&:hover{ color: $white; }
	}
}
/* ---------------------------------------------------------
	 ftSocialLinks styles
---------------------------------------------------------*/
.ftSocialLinks{
	> li{
		display: flex;
		justify-content: center;
		margin-bottom: 10px;
		> a{
			color: inherit;
			&:hover{ color: $white; }
		}
	}
	.icn{
		margin-right: 20px;
		@include size(18px, 16px);
	}
}
/* ---------------------------------------------------------
	 wcuBlock styles
---------------------------------------------------------*/
.wcuBlock{
	.headingHead{ margin-bottom: 24px; }
	.btn{ min-width: 160px; }
}
/* ---------------------------------------------------------
	 yoeListing styles
---------------------------------------------------------*/
.yoeListing{
	> li{
		margin-bottom: 20px;
		&.hover{ .icn{ transform: scaleX(-1); } }
	}
	h3, .h3{
		@extend %transition;
		margin-bottom: 0;
	}
	.titleWrap{ margin-bottom: 10px; }
	.icn{
		@extend %transition;
		font-size: 30px;
		width: 30px;
		margin-right: 17px;
		transform: scaleX(1);
	}
}
/* ---------------------------------------------------------
	 wcuBlockImageHolder styles
---------------------------------------------------------*/
.wcuBlockImageHolder{
	&.hasOverlay{
		@include pseudo(before, 0, 0, 0, 0);
		&:before{
			@extend .inaccessible;
			border-radius: inherit;
			background-color: rgba($black, 0.4);
		}
	}
	/* wcuBlockVideoImage styles */
	&.wcuBlockVideoImage{
		@include pseudo(after, 50%, 100%, auto, auto);
		&:after{
			z-index: -1;
			background: repeating-radial-gradient(
				circle,
				$white,
				$white 39px,
				$light 39px, 
				$light 40px
			);
			border-radius: 100%;
			transform: translate(50%, -50%);
			@include size(470px);
		}
		.btnPlay{
			&:hover{ background-color: $warning; }
		}
	}
	img{ vertical-align: top; }
}
/* ---------------------------------------------------------
	 mkCallAside styles
---------------------------------------------------------*/
.mkCallAside{
	min-height: 250px;
	@include pseudo(before, 0, 0, 0, 0);
	&:before{
		@extend .inaccessible;
		background-color: rgba($black, 0.5);
	}
	.mkCallAsideHolder{
		z-index: 2;
		min-height: inherit;
		@include v-align(inherit, middle, before);
		> .align{
			max-width: none;
			width: 100%;
			padding-top: 15px;
			padding-bottom: 15px;
		}
	}
	h2, .h2{
		color: inherit;
		margin-bottom: 10px;
	}
	.btn{
		font-size: 17px;
		line-height: 1;
	}
}
/* ---------------------------------------------------------
	 wwdTabsetAreaWrap styles
---------------------------------------------------------*/
.wwdTabsetAreaWrap{
	overflow: hidden;
	border: 1px solid $border-color;
	border-bottom-right-radius: $border-radius;
	border-bottom-left-radius: $border-radius;
	/* wwdTabsetAreaWrap05 , shpTabsetAreaWrap styles */
	&.wwdTabsetAreaWrap05,
	&.shpTabsetAreaWrap{ border: 0; }
	&.shpTabsetAreaWrap{
		h3, .h3{ margin-bottom: 12px; }
		p{ margin-bottom: 41px; }
		.listDefault{
			padding-left: 10px;
			margin-bottom: 25px;
		}
		.benefitsFeaturedList{
			h3, .h3{ margin-bottom: 6px; }
			p{ margin-bottom: 0; }
		}
		.reviewsList{
			p{ margin-bottom: 0; }
		}
		.reviewSubmissionForm{
			h3, .h3{ margin-bottom: 14px; }
		}
	}
	.accSlideHolder{
		padding: 16px 20px;
		border-bottom: 1px solid $border-color;
	}
	.imageWrap{
		margin: 0;
		&.alignright,
		&.alignleft{ float: none; }
		img{ vertical-align: top; }
	}
	h3, .h3{ margin-bottom: 25px; }
	.accOpener{
		cursor: pointer;
		background-color: transparent;
		border: solid $border-color;
		border-width: 0 0 1px;
		font-size: 15px;
		line-height: (19/15);
		padding: 13px 50px 13px 20px;
		@include pseudo(after, 50%, 15px, auto, auto);
		&:after{
			content: "\e61a";
			transform: translateY(-50%);
			font-family: 'themify';
			speak: none;
			font-style: normal;
			font-weight: normal;
			font-variant: normal;
			text-transform: none;
			line-height: 1;
			-webkit-font-smoothing: antialiased;
			-moz-osx-font-smoothing: grayscale;
		}
		&:focus{ outline: none; }
		&[aria-expanded="true"]{
			color: $white;
			&:after{ content: "\e622"; }
			&:hover{ color: $white; }
		}
	}
	p{ margin-bottom: 10px; }
}
/* ---------------------------------------------------------
	 wwdTabsetList styles
---------------------------------------------------------*/
.wwdTabsetList{
	&.nav-tabs{
		border: 0;
		font-size: 16px;
		line-height: (20/16);
		margin-right: -1px;
		/* wwdTabsetList05 styles */
		&.wwdTabsetList05{
			border-bottom: 1px solid $border-color;
			.nav-item{
				margin-left: 8px;
				margin-right: 8px;
			}
			.nav-link{
				width: 100%;
				margin-left: 0;
				border: 0;
				padding: 0 0 15px;
				@include pseudo(after, auto, 0, 0, 0);
				&.active{
					margin-bottom: 0;
					background-color: transparent;
					&:after{
						opacity: 1;
						visibility: visible;
						transform: scale(1);
					}
				}
				&:after{
					height: 3px;
					transition: inherit;
					opacity: 0;
					visibility: visible;
					transform-origin: 50% 100% 0;
					transform: scale(0);
				}
			}
		}
		&.shpTabsetList{
			border-bottom: 1px solid $border-color;
			padding-left: 20px;
			.nav-item{
				flex-grow: inherit;
				flex-basis: inherit;
				margin-right: 10px;
			}
			.nav-link{
				border-radius: $border-radius $border-radius 0 0;
				border-width: 1px;
				width: 100%;
				margin-bottom: -1px;
				margin-left: 0;
				overflow: hidden;
				padding: 12px 14px;
				@include pseudo(before, 0, 0, auto, 0);
				&:before{
					transition: inherit;
					height: 3px;
					opacity: 0;
					visibility: hidden;
					transform-origin: 50% 0 0;
					transform: scaleY(0);
				}
				&.active{
					background-color: transparent;
					color: inherit;
					border-color: $border-color;
					border-bottom-color: $white;
					&:before{
						opacity: 1;
						visibility: visible;
						transform: scaleY(1);
					}
				}
			}
		}
		.nav-item{
			flex-grow: 1;
			flex-basis: 0;
			margin-bottom: 0;
		}
		.nav-link{
			color: $gray-300;
			border-color: $nav-tabs-border-color;
			border-top-width: 0;
			width: calc(100% + 1px);
			margin-left: -1px;
			padding: 14px 10px;
			&.active{
				color: $white;
				pointer-events: none;
			}
		}
		.icn{
			font-size: 36px;
			height: 36px;
			margin-bottom: 12px;
		}
	}
}
/* ---------------------------------------------------------
	 videoAside styles
---------------------------------------------------------*/
.videoAside{
	min-height: 250px;
	@include pseudo(before, 0, 0, 0, 0);
	&.overlayThemeColor{
		&.hover{	
			&:before{ opacity: 0.5; }
		}
		&:before{ opacity: 0.7; }
	}
	&.hover{ &:before{ background-color: rgba($black, 0.2); } }
	&:before{
		@extend %transition;
		@extend .inaccessible;
		background-color: rgba($black, 0.4);
	}
	.btnPlay{
		@extend %transition;
		&:hover{ border-width: 0; }
	}
}
/* ---------------------------------------------------------
	 pageHeaderTopBar styles
---------------------------------------------------------*/
.pageHeaderTopBar{
	&.pageHeaderTopBar03{ border-bottom: 1px solid $border-color; }
}
/* ---------------------------------------------------------
	 phSocialLinks styles
---------------------------------------------------------*/
.phSocialLinks{
	> li{
		> a{
			display: flex;
			align-items: center;
			justify-content: center;
			color: $gray-200;
			border: solid $border-color;
			border-width: 0 1px;
			margin-left: -1px;
			font-size: 10px;
			@include size(30px, 20px);
			&:hover{ color: $white; }
		}
	}
}
/* ---------------------------------------------------------
	 languageSlctDrop styles
---------------------------------------------------------*/
.languageSlctDrop{
	color: $gray-300;
	padding-top: 2px;
	padding-bottom: 2px;
	font-size: 10px;
	.dropdown-toggle{
		color: inherit;
		&:after{ vertical-align: middle; }
		&:hover{ color: $black; }
	}
	.icn{ margin-right: 5px; }
	.dropdown-menu{
		padding-top: 0;
		padding-bottom: 0;
	}
	.dropdown-item{
		&:hover,
		&.active{ color: $white; }
	}
}
/* ---------------------------------------------------------
	 phAddress styles
---------------------------------------------------------*/
.phAddress{
	font-style: normal;
	font-size: 12px;
}
/* ---------------------------------------------------------
	 phadrList styles
---------------------------------------------------------*/
.phadrList{
	/* phadrList05 styles */
	&.phadrList05{
		li{
			border-left: 1px solid $border-color;
			margin-left: 17px;
			padding-left: 17px;
			&:first-child{ border-left: 0; }
		}
		.textWrap{ min-width: 1px; }
	}
	li{
		display: flex;
		align-items: flex-start;
		margin-left: 15px;
		&.hover{ .icnWrap{ color: $white; } }
	}
	.icnWrap{
		@extend %transition;
		border: 1px solid $border-color;
		margin-top: 4px;
		font-size: 15px;
		margin-right: 8px;
		@include size(30px);
	}
	.textWrap{ min-width: 94px; }
	a{ color: inherit; }
}
/* ---------------------------------------------------------
	 pgIcnsWrap styles
---------------------------------------------------------*/
.pgIcnsWrap{
	position: absolute;
	right: 48px;
	top: -34px;
	&.pgIcnsWrap05{ right: 63px; }
}
/* ---------------------------------------------------------
	 pgSearchForm styles
---------------------------------------------------------*/
.pgSearchForm{
	button{
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
		right: 8px;
	}
	.form-control{ padding-right: 50px; }
}
/* ---------------------------------------------------------
	 pgSearchFormOpener styles
---------------------------------------------------------*/
.pgSearchFormOpener{
	border-radius: $border-radius;
	font-size: 16px;
	color: $gray-300;
	border: 1px solid $gray-300;
	margin-left: 15px;
	@include size(33px, 28px);
}
/* ---------------------------------------------------------
	 pgSearchCollpase styles
---------------------------------------------------------*/
.pgSearchCollpase{
	transition: transform 0.5s ease !important;
	position: absolute;
	top: 100%;
	right: 0;
	height: auto !important;
	width: 63vw;
	overflow: visible !important;
	transform: scaleX(0);
	transform-origin: 100% 0 0;
	margin-top: 6px;
	&.show,
	&.collapsing{ transform: scaleX(1); }
}
/* ---------------------------------------------------------
	 bsSwitcherAsideWrap styles
---------------------------------------------------------*/
.bsSwitcherAsideWrap{ border-bottom: 1px solid $border-color; }
/* ---------------------------------------------------------
	 bsSwitcher styles
---------------------------------------------------------*/
.bsSwitcher{
	counter-reset: item;
	margin-top: -18px;
}
/* ---------------------------------------------------------
	 bsSSlide styles
---------------------------------------------------------*/
.bsSSlide{
	margin-top: 16px;
	cursor: pointer;
	position: relative;
	@include pseudo(after, auto, 0, 0, 0);
	@include pseudo(before, auto, auto, 100%, 50%);
	&:after{
		@extend %transition;
		opacity: 0;
		visibility: hidden;
		transform: scale(0);
		transform-origin: 50% 100% 0;
		height: 4px;
	}
	&:before{
		@extend %transition;
		opacity: 0;
		visibility: hidden;
		transform: translateX(-50%) scaleY(0);
		transform-origin: 0 100% 0;
		margin-bottom: -2px;
		@include triangle(29px 16px, $white, up);
	}
	&.slick-current{
		&:after{
			opacity: 1;
			visibility: visible;
			transform: scale(1);
		}
		&:before{
			opacity: 1;
			visibility: visible;
			transform: translateX(-50%) scaleY(1);
		}
		.holderWrap{ color: $dark; }
	}
	.holderWrap{
		@extend %transition;
		color: $gray-200;
		border: solid $border-color;
		border-width: 1px 1px 0;
		font-size: 12px;
		line-height: 1;
		height: 50px;
		&:hover{ color: $gray-800; }
	}
}
/* ---------------------------------------------------------
	 servicesVisualColumnsBlock styles
---------------------------------------------------------*/
.servicesVisualColumnsBlock{
	@include pseudo(before, 0, 0, 0, 0);
	&:before{
		@extend .inaccessible;
		background-color: rgba($black, 0.75);
	}
	.holder{ z-index: 2; }
	.col{
		+ .col{ border-top: 1px solid rgba($white, 0.2); }
	}
}
/* ---------------------------------------------------------
	 svcColumn styles
---------------------------------------------------------*/
.svcColumn{
	@extend %transition;
	overflow: hidden;
	min-height: 400px;
	&.hover{
		background-color: rgba($black, 0.2);
		.btnWrap{
			transform: translateY(0);
			margin-bottom: 15px;
			margin-top: 26px;
		}
	}
	.align{ padding: 20px 25px 54px; }
	.icn{
		font-size: 36px;
		margin-bottom: 26px;
	}
	h3, .h3{
		text-transform: capitalize;
		color: inherit;
		margin-bottom: 12px;
	}
	.btnWrap{
		transition: all 0.5s ease;
		margin-top: 0;
		margin-bottom: -45px;
		transform: translateY(555px);
	}
	.btn{ min-width: 160px; }
	p{ margin-bottom: 17px; }
}
/* ---------------------------------------------------------
	 prjctDescrColumn styles
---------------------------------------------------------*/
.prjctDescrColumn{
	margin-bottom: 24px;
	h3, .h3{ margin-bottom: 18px; }
	.colImage{ z-index: 1; }
	.colDescr{ z-index: 2; }
	p{ margin-bottom: 26px; }
}
/* ---------------------------------------------------------
	 postTitleTextTag styles
---------------------------------------------------------*/
.postTitleTextTag{
	color: $gray-200;
	font-size: 14px;
	line-height: (18/14);
	margin-bottom: 12px;
}
/* ---------------------------------------------------------
	 prjctColumnImageWrap styles
---------------------------------------------------------*/
.prjctColumnImageWrap{
	&.alignleft{ margin: 0 0 15px; }
	&.alignright{ margin: 0 0 15px; }
}
/* ---------------------------------------------------------
	 prjctTextHolder styles
---------------------------------------------------------*/
.prjctTextHolder{
	@extend %transition;
	padding: 0 20px 24px;
	z-index: 1;
}
/* ---------------------------------------------------------
	 prjctCatagoriesSlider styles
---------------------------------------------------------*/
.prjctCatagoriesSlider{
	.slick-list{
		padding-left: 30px;
		padding-right: 30px;
		margin-left: -30px;
		margin-right: -30px;
	}
}
/* ---------------------------------------------------------
	 prjctSSlide styles
---------------------------------------------------------*/
.prjctSSlide{
	padding-left: 12px;
	padding-right: 12px;
	&.slick-current{
		.pSsImage{
			&:before{
				opacity: 0.7;
				visibility: visible;
			}
		}
	}
}
/* ---------------------------------------------------------
	 pSsImage styles
---------------------------------------------------------*/
.pSsImage{
	overflow: hidden;
	cursor: pointer;
	@include size(95.5px);
	@include pseudo(before, 0, 0, 0, 0);
	&:before{
		@extend %transition;
		opacity: 0;
		visibility: hidden;
	}
	&:hover{ &:before{ opacity: 0.2; } }
}
/* ---------------------------------------------------------
	 filtersTabContentWrap styles
---------------------------------------------------------*/
.filtersTabContentWrap{
	> .tab-pane{
		display: block !important;
		transition: none !important;
		&:not(.show){
			@extend .inaccessible;
			position: absolute;
			left: 0;
			top: 0;
			right: 0;
		}
	}
}
/* ---------------------------------------------------------
	 hwwCBlock styles
---------------------------------------------------------*/
.hwwCBlock{
	@include pseudo(before, 0, 0, 0, 0);
	&:before{
		@extend .inaccessible;
		background-color: rgba($black, 0.75);
	}
	.holder{ z-index: 2; }
	.headingHead{
		p{ margin-bottom: 38px; }
	}
	h2, .h2{ color: inherit; }
	.btn{ min-width: 160px; }
}
/* ---------------------------------------------------------
	 hwwColumnsList styles
---------------------------------------------------------*/
.hwwColumnsList{
	color: $body-color;
	counter-reset: item;
	margin: 27px #{$grid-gutter-width / -2} 0;
	> li{
		counter-increment: item;
		padding-left: #{$grid-gutter-width / 2};
		padding-right: #{$grid-gutter-width / 2};
		display: flex;
		width: 100%;
		margin-bottom: 60px;
		&.hover{
			.align{
				&:before{ transform: translateY(-70%); }
			}
		}
	}
	h3, .h3{ margin-bottom: 12px; }
	.wrap{ padding: 20px 20px 25px; }
	.align{
		&:before{
			@extend %transition;
			content: counters(item, ".", decimal-leading-zero) " ";
			display: flex;
			align-items: center;
			justify-content: center;
			border-radius: $border-radius;
			color: $white;
			transform: translateY(-50%);
			font: 500 30px/1 $font-roboto;
			margin-top: -20px;
			margin-bottom: -17px;
			@include size(55px);
		}
	}
	p{ margin-bottom: 0; }
}
/* ---------------------------------------------------------
	 shareWTitleWrap styles
---------------------------------------------------------*/
.shareWTitleWrap{
	padding-top: 6px;
	padding-bottom: 6px;
	&.shareWTitleWrap02{
		border: solid $border-color;
		border-width: 1px 0;
		padding-top: 14px;
		padding-bottom: 14px;
		.shareTitle{ margin-right: 20px; }
	}
	.shareTitle{ margin-right: 0; }
}
/* ---------------------------------------------------------
	 socialLinksSimple styles
---------------------------------------------------------*/
.socialLinksSimple{
	font-size: 16px;
	line-height: 1;
	/* socialLinksSimple02 styles */
	&.socialLinksSimple02{
		li{
			margin-right: 27px;
			margin-left: 0;
		}
	}
	/* socialLinksSimpleWhite styles */
	&.socialLinksSimpleWhite{
		a{
			color: inherit;
			&:hover{ color: $info; }
		}
	}
	li{ margin-left: 20px; }
	a{ color: $gray-200; }
}
/* ---------------------------------------------------------
	 bannerBottomAsideBlock styles
---------------------------------------------------------*/
.bannerBottomAsideBlock{
	z-index: 3;
	margin-top: -5px;
	.holderWrap{
		overflow: hidden;
		padding: 39px 15px 20px;
	}
}
/* ---------------------------------------------------------
	 bannerAsideServicesList styles
---------------------------------------------------------*/
.bannerAsideServicesList{
	> li{
		margin-bottom: 15px;
		&.hover{
			.icn{ transform: scaleX(-1); }
		}
	}
	.titleWrap{ margin-bottom: 17px; }
	h3, .h3{
		@extend %transition;
		margin-bottom: 0;
	}
	.icn{
		@extend %transition;
		transform: scaleX(1);
		font-size: 30px;
		width: 30px;
		margin-right: 11px;
	}
	p{ margin-bottom: 0; }
}
/* ---------------------------------------------------------
	 abtIntroAsideBlock styles
---------------------------------------------------------*/
.abtIntroAsideBlock{
	h2, .h2{ margin-bottom: 0; }
	p{ margin-bottom: 10px; }
}
/* ---------------------------------------------------------
	 swwdPost styles
---------------------------------------------------------*/
.swwdPost{
	padding-left: 10px;
	padding-right: 10px;
	margin-bottom: 30px;
	overflow: hidden;
	&.hover{
		.aligncenter{ transform: scale(1.05); }
	}
	.aligncenter{
		@extend %transition;
		transform-origin: 50% 50% 0;
		transform: scale(1);
		margin: 0 -10px 26px;
		img{ max-width: none; }
	}
	h3, .h3{ margin-bottom: 12px; }
}
/* ---------------------------------------------------------
	 swwdColumnsSlider styles
---------------------------------------------------------*/
.swwdColumnsSlider,
.swwdColumnsSliderType2{
	.slickBars{ padding-top: 9px; }
}
/* ---------------------------------------------------------
	 hiwStepsList styles
---------------------------------------------------------*/
.hiwStepsList{
	counter-reset: item;
	> li{
		counter-increment: item;
		position: relative;
		padding-left: 78px;
		@include pseudo(before, 0, auto, auto, 0);
		@include pseudo(after, 15px, auto, auto, 0);
		&.hover{ &:before{ color: $white; } }
		&:last-child{ &:after{ display: none; } }
		&:after{
			@extend .inaccessible;
			background-color: $border-color;
			left: 27px;
			@include size(1px, calc(100% + 20px));
		}
		&:before{
			@extend %transition;
			@extend .inaccessible;
			@extend .hasShadow;
			content: counters(item, ".", decimal-leading-zero) " ";
			display: flex;
			align-items: center;
			justify-content: center;
			border-radius: 100%;
			z-index: 1;
			background-color: $white;
			font: 500 25px/1 $font-roboto;
			margin-top: 5px;
			@include size(56px);
		}
		+ li{ margin-top: 20px; }
	}
	h3, .h3{ margin-bottom: 12px; }
	p{ margin-bottom: 0; }
}
/* ---------------------------------------------------------
	 npProjectsSlider styles
---------------------------------------------------------*/
.npProjectsSlider{
	max-width: 270px;
	.slick-list{ overflow: visible !important; }
	.slick-arrow{
		position: absolute;
		bottom: 0;
		color: $body-color;
		font-size: 26px;
		margin-bottom: 19px;
		z-index: 2;
	}
	.slickPrev{ left: 11px; }
	.slickNext{ right: 11px; }
}
/* ---------------------------------------------------------
	 npssSlide styles
---------------------------------------------------------*/
.npssSlide{
	@extend %transition;
	opacity: 0.5;
	padding-left: 5px;
	padding-right: 5px;
	&.slick-current{
		opacity: 1;
		.powVisualPost{
			.textWrap{
				opacity: 1;
				visibility: visible;
				transform: scale(1);
			}
		}
	}
	.powVisualPost{
		.textWrap{
			@extend %transition;
			transform-origin: 50% 100% 0;
			transform: scale(0);
			opacity: 0;
			visibility: hidden;
		}
	}
}
/* ---------------------------------------------------------
	 powVisualPost styles
---------------------------------------------------------*/
.powVisualPost{
	.aligncenter{
		margin: 0 0 31px;
		img{ max-width: none; }
	}
	h3, .h3{
		margin-bottom: 11px;
		font-size: 18px;
	}
	h4, .h4{
		color: $body-color;
		font-size: 14px;
		margin-bottom: 0;
	}
}
/* ---------------------------------------------------------
	 pricingPlansBlock styles
---------------------------------------------------------*/
.pricingPlansBlock{
	.headingHead{ margin-bottom: 46px; }
}
/* ---------------------------------------------------------
	 pricePlanColumn styles
---------------------------------------------------------*/
.pricePlanColumn{
	margin-bottom: 30px;
	padding: 15px 15px 113px;
	&.hover{
		.columnHead{
			color: $white;
			h3, .h3,
			h4, .h4{ color: inherit; }
		}
		.chBgCover{
			opacity: 1;
			visibility: visible;
			transform: scale(1);
		}
		.btn{ &:hover{ background-color: transparent; } }
	}
	.columnHead{
		@extend %transition;
		border-radius: $border-radius $border-radius 0 0;
		overflow: hidden;
		z-index: 1;
		margin: -15px -15px 40px;
		padding: 35px 15px 39px;
	}
	h3, .h3{ margin-bottom: 10px; }
	h4, .h4{
		color: $body-color;
		font-size: 16px;
		margin-bottom: 0;
	}
	h2, .h2{
		line-height: 1;
		margin-bottom: 30px;
	}
	.textUnit{
		color: $gray-200;
		font-size: 14px;
		vertical-align: baseline;
	}
	.chBgCover{
		@extend %transition;
		left: 0;
		top: 0;
		bottom: 0;
		right: 0;
		z-index: -1;
		opacity: 0;
		visibility: hidden;
		transform-origin: 50% 50% 0;
		transform: scale(1.5);
		@include pseudo(before, 0, 0, 0, 0);
		&:before{ opacity: 0.8; }
	}
	.btn{
		z-index: 1;
		left: 0;
		right: 0;
		width: 155px;
		bottom: 52px;
	}
}
/* ---------------------------------------------------------
	 pricingFeaturesList styles
---------------------------------------------------------*/
.pricingFeaturesList{
	line-height: (30/16);
	> li{ margin-bottom: 0; }
	.unFollowed{
		color: $gray-200;
		text-decoration: line-through;
	}
}
/* ---------------------------------------------------------
	 reKtAsideBlock styles
---------------------------------------------------------*/
.reKtAsideBlock{
	min-height: 320px;
	@include pseudo(before, 0, 0, 0, 0);
	&:before{
		@extend .inaccessible;
		background-color: rgba($black, 0.6);
	}
	.holder{
		z-index: 1;
		min-height: inherit;
		@include v-align(inherit, middle, before);
		> .align{
			width: 100%;
			padding-top: 31px;
			padding-bottom: 35px;
		}
	}
	h2, .h2{
		color: inherit;
		margin-bottom: 16px;
	}
	.btnPlay{ margin-top: 24px; }
	p{ margin-bottom: 0; }
}
/* ---------------------------------------------------------
	 popItemColumn styles
---------------------------------------------------------*/
.popItemColumn{
	padding-left: 10px;
	padding-right: 10px;
	margin-bottom: 30px;
	&.hMbSmall{
		h3, .h3{ margin-bottom: 9px; }
	}
	&.hover{
		.popActionsList{
			opacity: 1;
			visibility: visible;
			transform: translateY(0);
		}
	}
	&[data-featured-tag]{
		@include pseudo(before, 0, auto, auto, 15px);
		&:before{
			content: attr(data-featured-tag);
			color: $white;
			text-transform: capitalize;
			border-radius: $border-radius 0 0 0;
			font-size: 16px;
			line-height: 1;
			min-width: 70px;
			text-align: center;
			padding: 7px 4px 4px;
			z-index: 1;
		}
		&[data-tag-hot]{
			&:before{ background-color: $danger; }
		}
	}
	.imageHolder{
		overflow: hidden;
		border: 1px solid $border-color;
		min-height: 356px;
		margin: 0 -10px 26px;
		> .wrap{ min-height: inherit; }
	}
	h3, .h3{
		font-size: 20px;
		margin-bottom: 14px;
	}
	h4, .h4{
		font-size: 16px;
		margin-bottom: 0;
	}
	.priceCut{
		color: $gray-200;
		font-size: 14px;
		vertical-align: baseline;
		text-decoration: line-through;
	}
}
/* ---------------------------------------------------------
	 popActionsList styles
---------------------------------------------------------*/
.popActionsList{
	@extend %transition;
	left: 0;
	right: 0;
	z-index: 1;
	opacity: 0;
	visibility: hidden;
	font-size: 18px;
	line-height: 1;
	margin-left: -10px;
	margin-right: -10px;
	bottom: 30px;
	transform: translateY(200px);
	> li{
		padding-left: 10px;
		padding-right: 10px;
		> a{
			color: $body-color;
			border: 1px solid $border-color;
			@include size(46px);
			&:hover{ color: $white; }
		}
	}
}
/* ---------------------------------------------------------
	 moreExploreHolder styles
---------------------------------------------------------*/
.moreExploreHolder{
	.btn{
		vertical-align: top;
		min-width: 140px;
	}
}
/* ---------------------------------------------------------
	 breadcrumb styles
---------------------------------------------------------*/
.breadcrumb{
	&.pageBreadcrumb{
		background-color: transparent;
		border-radius: 0;
		font-size: 12px;
		a{
			color: $dark;
			&:hover{ color: $body-color; }
		}
		.icn{ margin-right: 3px; }
	}
}
/* ---------------------------------------------------------
	 pageBdWrapNav styles
---------------------------------------------------------*/
.pageBdWrapNav{
	padding-top: 8px;
	padding-bottom: 8px;
	.title{
		font-size: 18px;
		line-height: (22/18);
	}
}
/* ---------------------------------------------------------
	 ctSorterWrapHeader styles
---------------------------------------------------------*/
.ctSorterWrapHeader{
	font-size: 12px;
	margin-bottom: 18px;
	p{ margin-bottom: 0; }
}
/* ---------------------------------------------------------
	 viewSorterList styles
---------------------------------------------------------*/
.viewSorterList{
	font-size: 16px;
	line-height: 1;
	margin-left: 5px;
	> li{
		margin-left: 11px;
		> a{ color: inherit; }
	}
}
/* ---------------------------------------------------------
	 dsSortDropdown styles
---------------------------------------------------------*/
.dsSortDropdown{
	.dropdown-toggle{
		color: inherit;
		&:after{
			border-width: 0.35em 0.35em 0;
			margin-left: 10px;
			vertical-align: 0.055em;
		}
	}
	.dropdown-item{
		padding: 0 5px;
		&.active{ color: $white; }
	}
}
/* ---------------------------------------------------------
	 pagination styles
---------------------------------------------------------*/
.pagination{
	&.pagePagination{
		padding-top: 12px;
		padding-bottom: 12px;
		margin-left: -5px;
		margin-right: -5px;
		.page-item{
			margin-left: 5px;
			margin-right: 5px;
			+ .page-item{
				.page-link{ margin-left: 0; }
			}
			&:last-child,
			&:first-child{ .page-link{ border-radius: $border-radius; } }
			&.active{ .page-link{ color: $white; } }
		}
		.page-link{
			min-width: 30px;
			background-color: $light;
			border-radius: $border-radius;
			&:hover{ color: $white; }
		}
	}
}
/* ---------------------------------------------------------
	 getResultsWrap styles
---------------------------------------------------------*/
.getResultsWrap{
	color: $gray-200;
	font-size: 12px;
	line-height: 1;
	.btn{
		font-size: 14px;
		line-height: (18/14);
		margin-right: 5px;
		&:before{ padding: 4px 15px; }
	}
	.btnText{ padding: 4px 15px; }
	p{ margin-bottom: 0; }
}
/* ---------------------------------------------------------
	 popItemColumn__listView styles
---------------------------------------------------------*/
.popItemColumn__listView{
	border: 1px solid $border-color;
	margin-bottom: 30px;
	padding: 21px 20px 28px;
	.imgHolder{
		width: 145px;
		margin: 0 auto 15px;
	}
	h2, .h2{
		font-size: 20px;
		line-height: (30/20);
		margin-bottom: 10px;
	}
	h3, .h3{
		font-size: 20px;
		margin-bottom: 0;
	}
	.btn{
		vertical-align: top;
		min-width: 136px;
		margin-top: 36px;
	}
	p{ margin-bottom: 22px; }
}
/* ---------------------------------------------------------
	 filtersSidebarFWrap styles
---------------------------------------------------------*/
.filtersSidebarFWrap{
	left: 0;
	top: 0;
	z-index: 999;
	padding-bottom: 9999px;
	margin-bottom: -9999px;
	width: 270px;
	height: auto !important;
	transition: transform 0.3s ease-out !important;
	transform: translateX(-200%);
	&.show,
	&.collapsing{
		transform: translateX(0);
	}
	.titleWrap{
		padding-right: 30px;
		margin-bottom: 60px;
	}
	.btnClose{
		color: $dark;
		top: 3px;
		right: -4px;
		font-size: 30px;
		&:hover{ color: $danger; }
	}
	.fTitle{ margin-bottom: 0; }
}
/* ---------------------------------------------------------
	 fSFWHolder styles
---------------------------------------------------------*/
.fSFWHolder{ padding: 20px 18px; }
/* ---------------------------------------------------------
	 filtersSidebarOpener styles
---------------------------------------------------------*/
.filtersSidebarOpener{
	color: inherit;
	margin-right: 5px;
	.icn{ margin-right: 3px; }
}
/* ---------------------------------------------------------
	 detailsImageSlider styles
---------------------------------------------------------*/
.detailsImageSlider{
	margin-top: 5px;
	.slick-slide{ margin-bottom: 20px; }
	.imgWrap{
		overflow: hidden;
		border: 1px solid $border-color;
		&[data-featured-tag]{
			@include pseudo(before, 0, auto, auto, 0);
			&:before{
				content: attr(data-featured-tag);
				color: $white;
				text-transform: capitalize;
				border-radius: $border-radius 0 0 0;
				font-size: 16px;
				line-height: 1;
				min-width: 70px;
				text-align: center;
				padding: 7px 4px 4px;
			}
		}
		img{ vertical-align: top; }
	}
}
/* ---------------------------------------------------------
	 disSliderWrap styles
---------------------------------------------------------*/
.disSliderWrap{
	margin-left: -10px;
	margin-right: -10px;
}
/* ---------------------------------------------------------
	 disSliderWrap styles
---------------------------------------------------------*/
.disSliderWrap{
	.slick-slide{
		padding-left: 10px;
		padding-right: 10px;
	}
}
/* ---------------------------------------------------------
	 disImg styles
---------------------------------------------------------*/
.disImg{
	overflow: hidden;
	border: 1px solid $border-color;
	width: 100%;
}
/* ---------------------------------------------------------
	 sdbWDescription styles
---------------------------------------------------------*/
.sdbWDescription{
	h1, .h1{
		font-size: 24px;
		margin-bottom: 28px;
	}
	h2, .h2{ margin-bottom: 29px; }
	.sep,
	.priceCut{
		color: $gray-200;
		vertical-align: middle;
	}
	.sep{
		font-size: 18px;
		margin-left: 8px;
		margin-right: 10px;
	}
	.priceCut{
		text-decoration: line-through;
		font-size: 24px;
	}
	.ratingStarList{ margin-bottom: 35px; }
	p{ margin-bottom: 38px; }
}
/* ---------------------------------------------------------
	 cartForm styles
---------------------------------------------------------*/
.cartForm{
	margin-bottom: 34px;
	.quantity,
	.btn,
	.btnToCart{
		margin-right: 10px;
		margin-bottom: 10px;
	}
	.btnToCart{
		border-width: 1px;
		border-style: solid;
		color: $dark;
		font-size: 18px;
		@include size(48px);
		&:hover{ color: $white; }
	}
	.btn{
		height: 48px;
		.btnText{ height: inherit; }
	}
}
/* ---------------------------------------------------------
	 shpDefinaition styles
---------------------------------------------------------*/
.shpDefinaition{
	color: $gray-200;
	margin-bottom: 42px;
	dt{
		margin-right: 5px;
	}
	dd{
		overflow: hidden;
		margin-bottom: 10px;
	}
}
/* ---------------------------------------------------------
	 shpTopIntroWrap styles
---------------------------------------------------------*/
.shpTopIntroWrap{
	margin-bottom: 30px;
}
/* ---------------------------------------------------------
	 disSwitcherSlider styles
---------------------------------------------------------*/
.disSwitcherSlider{
	margin-bottom: 30px;
}
/* ---------------------------------------------------------
	 listDefault styles
---------------------------------------------------------*/
.listDefault{
	> li{
		position: relative;
		padding-left: 22px;
		@include pseudo(before, 0, auto, auto, 0);
		&:before{
			border-radius: 100%;
			background-color: currentColor;
			top: 10px;
			@include size(7px);
		}
	}
}
/* ---------------------------------------------------------
	 benefitsFeaturedList styles
---------------------------------------------------------*/
.benefitsFeaturedList{
	border: solid $border-color;
	border-width: 1px 0 0;
	padding-top: 16px;
	padding-bottom: 0;
	overflow: hidden;
	> li{
		padding-left: 30px;
		padding-right: 30px;
		margin-bottom: 16px;
		min-width: 50%;
		flex-grow: 1;
		flex-basis: 0;
	}
	h3, .h3{ margin-bottom: 6px; }
	.icn{
		font-size: 28px;
		margin-right: 10px;
		width: 28px;
	}
}
/* ---------------------------------------------------------
	 reviewsList styles
---------------------------------------------------------*/
.reviewsList{
	> li{
		overflow: hidden;
		margin-bottom: 40px;
	}
	.alignleft{
		float: none;
		width: 75px;
		margin: 0 0 15px;
	}
	.profiler{
		overflow: hidden;
		margin-bottom: 19px;
		@include size(70px);
	}
	.descr{ overflow: hidden; }
	.time{
		color: $gray-200;
		font-size: 14px;
		line-height: (18/14);
		margin-bottom: 7px;
	}
	p{ margin-bottom: 0; }
}
/* ---------------------------------------------------------
	 reviewSubmissionForm styles
---------------------------------------------------------*/
.reviewSubmissionForm{
	h3, .h3{ margin-bottom: 0; }
	.form-group{ margin-bottom: 36px; }
	.wrap{ margin-bottom: 15px; }
	.extraWrap{ margin-bottom: 19px; }
	.ratingStarList{
		font-size: 18px;
		padding-left: 16px;
		> li{ margin-right: 0; }
	}
	textarea{
		&,
		&.form-control{
			resize: none;
			height: 132px;
		}
	}
	.btn{ min-width: 146px; }
}
/* ---------------------------------------------------------
	 cartTableWrap styles
---------------------------------------------------------*/
.cartTableWrap{ margin-bottom: 25px; }
/* ---------------------------------------------------------
	 cartTable styles
---------------------------------------------------------*/
.cartTable{
	&.table{
		min-width: 690px;
		th,
		td{
			padding: 0;
			border: 1px solid $border-color;
			vertical-align: middle;
		}
		th{
			@extend .fwMedium;
			color: $dark;
			padding: 15px 10px 11px;
			font-size: 16px;
		}
		.tdWrap{ padding: 5px; }
		tfoot{ .tdWrap{ padding: 10px 9px; } }
		h3, .h3{ font-size: 16px; }
		h4, .h4{ font-size: 16px; }
		h3, .h3,
		h4, .h4{ margin-bottom: 0; }
		.col01{ width: 12.7%; }
		.col02{ width: 38.77%; }
		.col03{ width: 14.9%; }
		.col04{ width: 18.32%; }
		.col05{ width: 14.9%; }
		.imgWrap{ margin: -5px; }
		.coupenFormControl{
			font-size: 14px;
			line-height: (18/14);
			margin-right: 10px;
			padding: 4px 11px;
			@include size(calc(30% + 10px), 34px);
		}
		.btn{
			font-size: 14px;
			line-height: (18/14);
			min-width: 140px;
			&.btnDefaultOutline{
				min-width: 1px;
				width: 30%;
			}
			.btnText,
			&:before{ padding: 7px 10px; }
		}
		.wrap1{ width: 70%; }
	}
}
/* ---------------------------------------------------------
	 cartQuantity styles
---------------------------------------------------------*/
.quantityLight{
	input{
		border-color: $border-color;
		font-size: 16px;
		@include size(80px, 40px);
		@include placeholder{ color: $gray-200; };
	}
	.quantity-button{ font-size: 22px; }
}
/* ---------------------------------------------------------
	 cartTotal styles
---------------------------------------------------------*/
.cartTotal{
	&.table{
		font-size: 16px;
		line-height: (20/16);
		th{
			@extend .fwMedium;
			font-size: 22px;
			border: 0;
			padding: 0 0 15px;
		}
		td{
			padding: 0;
			border: 1px solid $border-color;
		}
		tfoot{
			td{ border: 0; }
			.tdWrap{ padding: 10px 0 0; }
		}
		.tdWrap{ padding: 8px 15px; }
		.textLarge{
			font-size: 22px;
			margin-top: 8px;
			margin-bottom: 8px;
		}
		.btn:before,
		.btnText{ padding: 8px 10px; }
	}
}
/* ---------------------------------------------------------
	 checkoutAlert styles
---------------------------------------------------------*/
.checkoutAlert{
	&.alert-light{
		a{ &:hover{ color: $black; } }
	}
}
/* ---------------------------------------------------------
	 bilingDetailsWrap styles
---------------------------------------------------------*/
.bilingDetailsWrap{
	padding-top: 15px;
	.form-group{ margin-bottom: 21px; }
	.formCol{
		width: 100%;
		padding-left: 5px;
		padding-right: 5px;
	}
	.fLabel{
		color: $gray-200;
		margin-bottom: 3px;
	}
	h3, .h3{ margin-bottom: 18px; }
}
/* ---------------------------------------------------------
	 confirmationBoxWrap styles
---------------------------------------------------------*/
.confirmationBoxWrap{
	overflow: hidden;
	border: 1px solid $border-color;
	margin-top: 29px;
	padding: 15px 12px;
	h3, .h3{ margin-bottom: 15px; }
}
/* ---------------------------------------------------------
	 checkoutCountTable styles
---------------------------------------------------------*/
.checkoutCountTable{
	&.table{
		margin-bottom: 26px;
		font-size: 12px;
		th,
		td{
			padding: 0;
			border: 0;
		}
		th{
			@extend .fwMedium;
			padding-bottom: 7px;
		}
		.tdWrap{ padding: 3px 10px 3px 0; }
		tfoot{
			.tdWrap{ padding: 23px 10px 0 0; }
		}
		.textLarge{ font-size: 16px; }
		.col01{ width: 75%; }
		.col02{ width: 25%; }
	}
}
/* ---------------------------------------------------------
	 custom control styles
---------------------------------------------------------*/
.custom-control{
	padding-left: 32px;
	.custom-control-input:checked{
		~ .custom-control-label:after{ background-image: none; }
		~ .custom-control-label:before{
			background-color: transparent;
			box-shadow: none;
		}
	}
	.custom-control-input:focus{
		~ .custom-control-label:before{ box-shadow: none; }
	}
	label{
		&:before{
			border: 1px solid $gray-300;
			background-color: transparent;
			left: -32px;
			top: 8px;
			@include size(12px);
		}
		&:after{
			background-image: none;
			left: -29px;
			border-radius: 100%;
			top: 11px;
			@include size(6px);
		}
	}
}
/* ---------------------------------------------------------
	 pmSlctList styles
---------------------------------------------------------*/
.pmSlctList{ > li{ margin-bottom: 10px; } }
/* ---------------------------------------------------------
	 pmPlaceholderImage styles
---------------------------------------------------------*/
.pmPlaceholderImage{ margin: -52px 0 -52px 14px; }
/* ---------------------------------------------------------
	 pmNotePop styles
---------------------------------------------------------*/
.pmNotePop{
	margin-top: 12px;
	padding: 8px 15px;
	@include pseudo(before, auto, auto, 100%, 12px);
	&:before{ @include triangle(5px 12px, $light, up); }
}
/* ---------------------------------------------------------
	 otwBlock styles
---------------------------------------------------------*/
.otwBlock{ .headingHead{ margin-bottom: 27px; } }
/* ---------------------------------------------------------
	 teamColumn styles
---------------------------------------------------------*/
.teamColumn{
	border: 1px solid $border-color;
	overflow: hidden;
	margin-bottom: 30px;
	&.hover{
		.captionWrap{
			color: $white;
			margin-top: -63px;
			padding-top: 16px;
			padding-bottom: 25px;
		}
		h3, .h3,
		h4, .h4{ color: inherit; }
		h3, .h3{
			a{ &:hover{ color: $black; } }
		}
		.tcSocialNetworks{
			max-height: 50px;
			padding-top: 20px;
		}
	}
	.imgHolder{
		margin: 0;
		img{ max-width: none; }
	}
	h3, .h3,
	h4, .h4{
		@extend %transition;
		@include nowrap(block);
	}
	h3, .h3{ margin-bottom: 5px; }
	h4, .h4{
		color: $gray-200;
		font-size: 16px;
		margin-bottom: 0;
	}
	.captionWrap{
		transition: all 0.3s ease;
		position: relative;
		z-index: 1;
		padding: 13px 10px 15px;
	}
}
/* ---------------------------------------------------------
	 tcSocialNetworks styles
---------------------------------------------------------*/
.tcSocialNetworks{
	transition: all 0.3s ease;
	max-height: 0;
	overflow: hidden;
	li{
		padding-left: 5px;
		padding-right: 5px;
	}
	a{
		color: $white;
		border: 1px solid currentColor;
		@include size(30px);
		&:hover{ color: $black; }
	}
}
/* ---------------------------------------------------------
	 slickGalleryBars styles
---------------------------------------------------------*/
.slickGalleryBars{
	line-height: 0;
	z-index: 1;
	margin: 0 -25px;
	padding-top: 20px;
	clear: both;
	li{
		flex-grow: 1;
		flex-basis: 0;
		display: flex;
		@include pseudo(after, auto, -9999px, 0, -9999px);
		&:after{
			z-index: -1;
			border-bottom: 1px solid $border-color;
		}
	}
	button{
		padding: 0;
		border: 0;
		display: flex;
		background-color: transparent;
		@include text-hide();
		@include size(100%, 3px);
	}
}
/* ---------------------------------------------------------
	 galleryAreaBlock styles
---------------------------------------------------------*/
.galleryAreaBlock{
	overflow: hidden;
	padding-top: 0;
}
/* ---------------------------------------------------------
	 prPCColumnsWrap styles
---------------------------------------------------------*/
.prPCColumnsWrap{
	&.row{
		margin-left: -6px;
		margin-right: -6px;
	}
	.col{
		padding-left: 6px;
		padding-right: 6px;
		vertical-align: top;
	}
}
/* ---------------------------------------------------------
	 loadMoreBtnWrap styles
---------------------------------------------------------*/
.loadMoreBtnWrap{
	padding-top: 38px;
	.btn{ min-width: 150px; }
}
/* ---------------------------------------------------------
	 pageFullBlock styles
---------------------------------------------------------*/
.pageFullBlock{
	@include pseudo(before, 0, 0, 0, 0);
	&:before{
		@extend .inaccessible;
		background-color: rgba($black, 0.7);
	}
	.holder{
		z-index: 2;
		min-height: 100vh;
		@include v-align(inherit, middle, before);
		> .align{
			padding-top: 100px;
			padding-bottom: 40px;
		}
	}
	.hTitle{ color: inherit; }
	h1, .h1{
		color: inherit;
		margin-bottom: 30px;
	}
	h2, .h2{
		color: inherit;
		margin-bottom: 10px;
	}
	.subtitle{ margin-bottom: 32px; }
	.btnsWrap{
		.btn{
			margin: 0 10px 10px;
			min-width: 160px;
		}
	}
}
/* ---------------------------------------------------------
	 countdownList styles
---------------------------------------------------------*/
.countdownList{
	font-size: 15px;
	line-height: 1;
	margin-left: -5px;
	margin-right: -5px;
	> li{
		padding-left: 5px;
		padding-right: 5px;
	}
	h1, .h1{
		color: inherit;
		margin-bottom: 0;
	}
}
/* ---------------------------------------------------------
	 signWarn styles
---------------------------------------------------------*/
.signWarn{
	font-size: 40px;
	margin-bottom: 20px;
}
/* ---------------------------------------------------------
	 swwdColumnsSliderType2 styles
---------------------------------------------------------*/
.swwdColumnsSliderType2{
	.slick-arrow{
		border-style: solid;
		border-width: 1px;
		position: absolute;
		top: 25%;
		z-index: 5;
		color: $dark;
		border-radius: $border-radius;
		font-size: 18px;
		@include size(50px);
		&:hover{ color: $white; }
	}
	.slickPrev{ left: -100px; }
	.slickNext{ right: -100px; }
}
/* ---------------------------------------------------------
	 pdssImage styles
---------------------------------------------------------*/
.pdssImage{
	@extend %transition;
	cursor: pointer;
	padding-left: 5px;
	padding-right: 5px;
	&.hover{ transform: scale(1.08); }
	img{ max-width: none; }
}
/* ---------------------------------------------------------
	 prjctDtSliderSwitcher styles
---------------------------------------------------------*/
.prjctDtSliderSwitcher{
	&.slick-vertical{ .slick-slide{ border-width: 15px 0; } }
}
/* ---------------------------------------------------------
	 pdssvSliderWrap styles
---------------------------------------------------------*/
.pdssvSliderWrap{ margin: 10px -5px 0; }
/* ---------------------------------------------------------
	 pdisImage styles
---------------------------------------------------------*/
.pdisImage{
	width: 100%;
	padding-top: 56%;
}
/* ---------------------------------------------------------
	 pdbDescriptionHolder styles
---------------------------------------------------------*/
.prjctDetailsBlock{
	h3, .h3{
		margin-bottom: 20px;
		padding-bottom: 20px;
		@include pseudo(after, auto, 0, 0, 0);
		&:after{ border-bottom: 1px solid $border-color; }
	}
	p{ margin-bottom: 10px; }
}
/* ---------------------------------------------------------
	 pdDescrTable styles
---------------------------------------------------------*/
.pdDescrTable{
	&.table{
		table-layout: fixed;
		margin-top: -1px;
		td{
			padding: 0;
			&:first-child{ .tdWrap{ padding-right: 10px; } }
		}
		.tdWrap{ padding: 15px 0; }
	}
}
/* ---------------------------------------------------------
	 prdtImageWrap styles
---------------------------------------------------------*/
.prdtImageWrap{
	overflow: hidden;
	margin: 0;
	&.alignright{ float: none; }
	+ .prdtImageWrap{ margin-top: 30px; }
}
/* ---------------------------------------------------------
	 contactAreaBlock styles
---------------------------------------------------------*/
.contactAreaBlock{
	h2, .h2{ margin-bottom: 10px; }
	p{ margin-bottom: 25px; }
}
/* ---------------------------------------------------------
	 ctMapHolder styles
---------------------------------------------------------*/
.ctMapHolder{
	.map{ @include size(100%, 250px); }
}
/* ---------------------------------------------------------
	 ctAddress styles
---------------------------------------------------------*/
.ctAddress{
	li{ margin-bottom: 37px; }
	.icn{
		color: $gray-200;
		font-size: 24px;
		width: 24px;
		margin-right: 20px;
	}
	a{ color: inherit; }
}
/* ---------------------------------------------------------
	 widgetCtForm styles
---------------------------------------------------------*/
.widgetCtForm{
	padding: 20px;
	textarea{
		&,
		&.form-control{
			height: 122px;
			resize: none;
		}
	}
}
/* ---------------------------------------------------------
	 ctList styles
---------------------------------------------------------*/
.ctList{
	margin-bottom: 0;
	li{
		margin-bottom: 15px;
		&.hover{
			.icn{ transform: scaleX(-1); }
		}
	}
	.icn{
		@extend %transition;
		transform: scaleX(1);
		font-size: 36px;
		margin-bottom: 15px;
	}
	h3, .h3{
		@extend %transition;
		margin-bottom: 15px;
	}
	a{ color: inherit; }
}
/* ---------------------------------------------------------
	 bCenterImage styles
---------------------------------------------------------*/
.bCenterImage{
	&.aligncenter{ margin-bottom: 53px; }
}
/* ---------------------------------------------------------
	 btHHead styles
---------------------------------------------------------*/
.btHHead{
	color: $gray-200;
	margin-bottom: 26px;
	h1, .h1{
		margin-bottom: 10px;
		font-size: 24px;
		line-height: (32/24);
	}
}
/* ---------------------------------------------------------
	 bdText styles
---------------------------------------------------------*/
.bdText{
	font-size: 14px;
	line-height: 1;
	.sep{
		margin-left: 0;
		margin-right: 0;
	}
}
/* ---------------------------------------------------------
	 statusesList styles
---------------------------------------------------------*/
.statusesList{
	color: $gray-200;
	font-size: 14px;
	line-height: 1;
	padding-top: 7px;
	> li{ margin-left: 53px; }
	a{ color: inherit; }
	.icn{ margin-right: 1px; }
}
/* ---------------------------------------------------------
	 quoteDefault styles
---------------------------------------------------------*/
.quoteDefault{
	font-style: italic;
	font-size: 18px;
	line-height: (30/18);
	padding: 26px 90px 29px 26px;
	margin-bottom: 23px;
	@include pseudo(after, 0, 0, auto, auto);
	&:after{
		content: "\e905";
		font-size: 32px;
		top: 32px;
		right: 30px;
		font-family: 'icomoon';
		speak: none;
		font-style: normal;
		font-weight: normal;
		font-variant: normal;
		text-transform: none;
		line-height: 1;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
	}
	q{ margin-bottom: 11px; }
	cite{
		font-style: normal;
		color: $body-color;
		font-size: 14px;
		line-height: (18/14);
	}
}
/* ---------------------------------------------------------
	 rpPosterSlider styles
---------------------------------------------------------*/
.rpPosterSlider{
	margin-top: -70px;
	padding-top: 70px;
	.slick-arrow{
		border-style: solid;
		border-width: 1px;
		position: absolute;
		right: 15px;
		top: 0;
		color: $gray-300;
		border-radius: $border-radius;
		font-size: 12px;
		@include size(30px);
		&:hover{ color: $white; }
	}
	.slickPrev{ margin-right: 40px; }
}
/* ---------------------------------------------------------
	 rpPostsWrap , commentsWrap styles
---------------------------------------------------------*/
.rpPostsWrap,
.commentsWrap{
	h2, .h2{
		font-size: 24px;
		line-height: (30/24);
		margin-bottom: 40px;
	}
}
/* ---------------------------------------------------------
	 commentsWrap styles
---------------------------------------------------------*/
.commentsWrap{ h2, .h2{ margin-bottom: 30px; } }
/* ---------------------------------------------------------
	 bpCommentsList styles
---------------------------------------------------------*/
.bpCommentsList{
	li{
		overflow: hidden;
		+ li{ padding-top: 17px; }
	}
	.avatar-holder{
		margin: 4px 15px 0 0;
		@include size(70px);
	}
	h3, .h3{ margin-bottom: 11px; }
	.descrWrap{ overflow: hidden; }
	time{
		color: $gray-200;
		font-style: italic;
		font-size: 14px;
		line-height: (18/14);
		margin-bottom: 6px;
	}
	.btn{
		font-size: 12px;
		line-height: (16/12);
		min-width: 70px;
		margin-right: 17px;
		vertical-align: top;
	}
	.btn:before,
	.btnText{ padding: 6px 10px; }
	ul{
		padding-top: 38px;
		padding-left: 23px;
	}
	p{ margin-bottom: 14px; }
}
/* ---------------------------------------------------------
	  comment form styles
---------------------------------------------------------*/
.comment-form{
	.form-row{
		margin-left: -15px;
		margin-right: -15px;
	}
	.formCol{
		padding-left: 15px;
		padding-right: 15px;
		width: 100%;
	}
	.form-control,
	input[type="text"],
	input[type="email"]{
		border-color: $input-border-color;
		margin: 0;
	}
	textarea{
		&,
		&.form-control{
			height: 116px;
			resize: none;
		}
	}
	h2, .h2{
		font-size: 24px;
		margin-bottom: 24px;
	}
	.btn{
		min-width: 180px;
		margin-top: 10px;
	}
}
/* ---------------------------------------------------------
	 shareSocialLinks styles
---------------------------------------------------------*/
.shareSocialLinks{
	font-size: 14px;
	> li{ margin-bottom: 20px; }
	a{
		border-radius: 99px;
		color: $white;
		padding: 8px 10px 9px;
	}
	.facebook{
		background-color: $blue;
		&:hover{ background-color: darken($blue, 10%); }
	}
	.twitter{
		background-color: $cyan;
		&:hover{ background-color: darken($cyan, 10%); }
	}
	.google{
		background-color: $clr2;
		&:hover{ background-color: darken($clr2, 10%); }
	}
	.icn{
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
		left: 28px;
	}
}
/* ---------------------------------------------------------
	 piSocialLinks styles
---------------------------------------------------------*/
.piSocialLinks{
	font-size: 14px;
	margin-bottom: 10px;
	> li{
		padding-left: 14px;
		padding-right: 14px;
	}
	a{ color: inherit; }
}
/* ---------------------------------------------------------
	 wpiTable styles
---------------------------------------------------------*/
.wpiTable{
	&.table{
		table-layout: fixed;
		border: solid $border-color;
		font-size: 14px;
		line-height: (20/14);
		border-width: 1px 0 0;
		margin-left: -11px;
		margin-right: -11px;
		width: calc(100% + 22px);
		th,
		td{
			border: solid $border-color;
			border-width: 0 1px;
			padding: 4px 5px;
		}
		th{
			padding-top: 11px;
			padding-bottom: 0;
		}
	}
}
/* ---------------------------------------------------------
	 imgLignCenter styles
---------------------------------------------------------*/
.imgLignCenter{
	&.aligncenter{
		margin-top: 35px;
		margin-bottom: 35px;
	}
}
/* ---------------------------------------------------------
	 sticky wrap headerFixer styles
---------------------------------------------------------*/
.sticky-wrap-headerFixer{
	&.fixedPosition{
		.logo05Sticky,
		.logo03Sticky{ display: block; }
	}
}
/* ---------------------------------------------------------
	 cshHolderWrap styles
---------------------------------------------------------*/
.cshHolderWrap{
	margin-left: ($grid-gutter-width / -2);
	margin-right: ($grid-gutter-width / -2);
	/* cshHolderWrap03 styles */
	&.cshHolderWrap03{
		margin-left: -5px;
		margin-right: -5px;
		.cshColumn{
			padding-left: 5px;
			padding-right: 5px;
		}
	}
}
/* ---------------------------------------------------------
	 cshColumn styles
---------------------------------------------------------*/
.cshColumn{
	float: left;
	padding-left: ($grid-gutter-width / 2);
	padding-right: ($grid-gutter-width / 2);
}
/* ---------------------------------------------------------
	 cshColumnFull styles
---------------------------------------------------------*/
.cshColumnFull{ width: 256px; }
/* ---------------------------------------------------------
	 hb-services styles
---------------------------------------------------------*/
.hb-services{
	padding: 100px 0;
	overflow: hidden;
}
/* ---------------------------------------------------------
	 booked-calendar styles
---------------------------------------------------------*/
.booked-calendar {
	overflow: hidden;
	display: block;
	padding: 12px 0 0;
	tbody {
		overflow: hidden;
		tr {
			overflow: hidden;
			td {
				width: 110px;
				border: 1px solid $white;
				background: $gray-100;
				padding: 32px 0;
				float: left;
				span {
					@include font(20px, 22px);
					color: $gray-200;
					display: block;
					font-weight: 500;
					&.active {
						color: $white;
						width: 50px;
						padding: 12px 0;
						display: block;
						border-radius: 25px;
						margin: -12px auto;
					}
				}
				&:first-child {
					border-top: 1px solid $white;
					border-right: 1px solid $white;
					border-bottom: 1px solid $white;
				}
				&:last-child {
					border-top: 1px solid $white;
					border-left: 1px solid $white;
					border-bottom: 1px solid $white;
				}
				&.bg-green { span{ color: $white; } }
			}
		}
	}
	.entry-block {
		overflow: hidden;
		display: none;
		transition: all 0.25s linear;
		td {
			width: 100%;
			padding: 0;
			height: auto;
			table {
				overflow: hidden;
				margin: 0;
				border-bottom: 1px solid $white;
			}
		}
		table {
			thead {
				background: $gray-900;
				overflow: hidden;
				width: 100%;
				border-bottom: 1px solid $white;
				th {
					@include font(16px, 18px);
					color: $white;
					font-weight: 500;
					padding: 13px 0 18px;
				}
			}
			tbody {
				overflow: hidden;
				td {
					background: $gray-100;
					padding: 10px 4px 10px 27px;
					border-bottom: 1px solid $white;
				}
			}
		}
		.txt-block {
			overflow: hidden;
			padding: 11px 0 0;
			width: 58.2%;
			float: left;
			time {
				@include font(16px, 18px);
				letter-spacing: 0.7px;
				color: $gray-900;
				float: left;
			}
			span {
				@include font(16px, 18px);
				color: $gray-200;
				float: right;
			}
		}
		.btn{
			border-radius: 45px;
			color: $gray-900;
			i{ font-style: normal; }
		}
		.btnText{ padding: 0.5rem 1.25rem; }
	}
	thead {
		overflow: hidden;
		tr {
			overflow: hidden;
			background: $gray-900;
			width: 100%;
			.month-name {
				@include font(20px, 22px);
				color: $white;
				font-weight: 500;
				display: block;
				width: 100%;
				letter-spacing: 3px;
			}
			.fa {
				@include font(20px, 22px);
				float: right;
				margin: -22px 17px 0 0;
			}
			th {
				overflow: hidden;
				padding: 15px 0;
				width: 100%;
				border: none;
			}
		}
		.months {
			background: $white;
			overflow: hidden;
			width: 100%;
			th {
				width: 14.285%;
				color: $gray-900;
				@include font(14px, 16px);
				float: left;
				font-weight: 500;
				padding: 13px 0 11px;
			}
		}
	}
}
/* ---------------------------------------------------------
	 pre-active styles
---------------------------------------------------------*/
.pre-active { .entry-block { display: block; } }
/* ---------------------------------------------------------
	 back-top styles
---------------------------------------------------------*/
#back-top {
	position: fixed;
	right: 20px;
	bottom: 20px;
	@include font(18px, 20px);
	color: #fff;
	cursor: pointer;
	float: right;
	@include size(50px, 50px);
	padding: 14px 0;
	z-index: 9;
	opacity: 0;
	visibility: hidden;
	background-size: 200% auto;
	transition: all 0.6s ease 0s;
 	&:hover{ background-position: right center; }
 	&.active{
		opacity: 1;
		visibility: visible;
	}
}
/* ---------------------------------------------------------
	 loader-holder styles
---------------------------------------------------------*/
.loader-holder{
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 9999;
	position: fixed;
	background-color: rgba(255, 255, 255, 0.9);
	.block { 
		position: absolute;
		margin: auto;
		top: 0; bottom: 0; left: 0; right: 0;
		width: 6.250em; height: 6.250em;
		animation: rotate 2.4s linear infinite;
	}
	.white { 
		top: 0; bottom: 0; left: 0; right: 0; 
		background: white; 
		animation: flash 2.4s linear infinite;
		opacity: 0;
	}
	.dot {
		position: absolute;
		margin: auto;
		width: 2.4em; height: 2.4em;
		border-radius: 100%;
		transition: all 1s ease;
		&:nth-child(2) { top: 0; bottom: 0; left: 0; background: #FF4444; animation: dotsY 2.4s linear infinite; }
		&:nth-child(3) { left: 0; right: 0; top: 0; background: #FFBB33; animation: dotsX 2.4s linear infinite; }
		&:nth-child(4) { top: 0; bottom: 0; right: 0; background: #99CC00; animation: dotsY 2.4s linear infinite; }
		&:nth-child(5) { left: 0; right: 0; bottom: 0; background: #33B5E5; animation: dotsX 2.4s linear infinite; }
	}
}
@keyframes rotate {
	0% { transform: rotate( 0 ); }
	10% { width: 6.250em; height: 6.250em; }
	66% { width: 2.4em; height: 2.4em; }
	100%{ transform: rotate(360deg); width: 6.250em; height: 6.250em; }
}
@keyframes dotsY {
	66% { opacity: .1; width: 2.4em; }
	77%{ opacity: 1; width: 0; }
}
@keyframes dotsX {
	66% { opacity: .1; height: 2.4em;}
	77%{ opacity: 1; height: 0; }
}
@keyframes flash {
	33% { opacity: 0; border-radius: 0%; }
	55%{ opacity: .6; border-radius: 100%; }
	66%{ opacity: 0; }
}