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

	Canvas: Cleaner

	Version: 1.0

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



:root {

	--cnvs-themecolor: #335EEE;

	--cnvs-themecolor-rgb: 51,94,238;

	--cnvs-secondcolor: #EFE33F;



	--cnvs-body-font: 'Heebo', sans-serif;;

	--cnvs-primary-font: var(--cnvs-body-font);

	--cnvs-secondary-font: var(--cnvs-body-font);

}



#header {

	--cnvs-header-height: 80px;

	--cnvs-primary-menu-font-size: 0.825rem;

	--cnvs-primary-menu-ls: 1px;

	--cnvs-primary-menu-tt: uppercase;

	--cnvs-primary-menu-font-weight: 700;

}



#top-bar {

	--cnvs-topbar-font-transform: uppercase;

	--cnvs-topbar-font-size: 0.75rem;

}



.second-color { color: var(--cnvs-secondcolor) !important; }

.second-bg-color { background-color: var(--cnvs-secondcolor) !important; }



/* Topbar

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

.top-links li a img {

	position: relative;

	display: inline-block;

	width: 20px;

	height: 20px;

	border-radius: 20px;

	top: -1px;

	margin-right: 8px;

	border: 1px solid rgba(255, 255, 255, 0.7);

}



/* Header

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

#primary-menu ul li > a {

	text-transform: none;

	font-size: 1rem;

	font-weight: 500;

	letter-spacing: 0;

}



.svg-separator {

	position: absolute;

	width: 100%;

	height: 20px;

	bottom: 0;

	left: 0;

	display: flex;

	justify-content: center;

	flex-direction: column;

	z-index: 1;

}



.svg-separator.top {

	top: -1px;

	bottom: auto;

}





.form-process {

	top: 0;

	left: 0;

}



.hero-diagonal { position: relative; }



.hero-diagonal::before {

	content: '';

	position: absolute;

	top: -50px;

	left: 0;

	width: 100%;

	height: calc(100% + 100px);

	-webkit-clip-path: polygon(0 9%, 100% 0%, 100% 91%, 0 100%);

	clip-path: polygon(0 9%, 100% 0%, 100% 91%, 0 100%);

	background-image: linear-gradient(rgba(0,0,0,0.3), rgba(0,0,0,0.4));

	background-position: center center;

	background-size: cover;

}



.feature-box.fbox-plain:not(.fbox-small) .fbox-icon img { width: 50px; }



.negetive-margin { margin-top: -230px; }



#cleaner-carousel .owl-item {

	opacity: 0;

	transform: translateY(20px);

	transition: all .4s .1s ease-out;

}



#cleaner-carousel .owl-item.active {

	opacity: 1;

	transform: translateY(0);

}



.total-price {

	font-size: 54px;

	letter-spacing: 0;

}



.btn-check:checked + .btn-outline-secondary,

.btn-check:active +

.btn-outline-secondary,

.btn-outline-secondary:active,

.btn-outline-secondary.active,

.btn-outline-secondary.dropdown-toggle.show {

	background-color: var(--cnvs-themecolor);

	border-color: var(--cnvs-themecolor);

}



.toggle .toggleta i {

	color: var(--cnvs-themecolor);

}



.section:not(.nobg) .fancy-title h4 { background-color: #F9F9F9; }



.testimonials-carousel:before {

	content: "\F6B0";

	font-family: 'bootstrap-icons';

	position: absolute;

	top: -8px;

	left: 50px;

	font-size: 100px;

	color: rgba(51,94,238, 0.02);

	color: rgba(var(--cnvs-themecolor-rgb), 0.08);

}



.header-misc .button {

	background-color: var(--cnvs-secondcolor);

	margin: 0;

	padding: 29px 16px;

}



/* Responsive Device more than 992px (.device-md >)

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

@media (min-width: 992px) {

	.header-misc .button {

		padding: 29px 34px;

	}



	.slider-title h1 {

		font-size: 40px;

		line-height: 1.3;

		font-weight: 700;

	}



	.feature-box .fbox-img img {

		z-index: 3;

		position: relative;

		background-color: #FFF;

	}



	[class^=col-]:not(:last-child) .feature-box .fbox-img:before {

		content: '';

    	position: absolute;

		top: 50%;

		left: 100%;

		width: 150%;

    	border-top: 1px dashed var(--cnvs-themecolor);

		transform: translateY(-50%);

		z-index: 0;

	}



	#oc-testi.owl-carousel .owl-dots {

		position: absolute;

	    bottom: 45px;

	    right: 40px;

	}



	#oc-testi.owl-carousel .owl-dots .owl-dot { margin-top: 0; }



}