@font-face {
	font-family: font-popins;
	src:url(‘../fonts/Poppins-Black.ttf’) format(‘truetype’),
	url(‘../fonts/Poppins-BlackItalic.ttf’) format(‘truetype’),
	url(‘../fonts/Poppins-Bold.ttf’) format(‘truetype’),
	url(‘../fonts/Poppins-BoldItalic.ttf’) format(‘truetype’),
	url(‘../fonts/Poppins-ExtraBold.ttf’) format(‘truetype’),
	url(‘../fonts/Poppins-ExtraBoldItalic.ttf’) format(‘truetype’),
	url(‘../fonts/Poppins-ExtraLight.ttf’) format(‘truetype’),
	url(‘../fonts/Poppins-ExtraLightItalic.ttf’) format(‘truetype’),
	url(‘../fonts/Poppins-Italic.ttf’) format(‘truetype’),
	url(‘../fonts/Poppins-Light.ttf’) format(‘truetype’),
	url(‘../fonts/Poppins-LightItalic.ttf’) format(‘truetype’),
	url(‘../fonts/Poppins-Medium.ttf’) format(‘truetype’),
	url(‘../fonts/Poppins-MediumItalic.ttf’) format(‘truetype’),
	url(‘../fonts/Poppins-Regular.ttf’) format(‘truetype’),
	url(‘../fonts/Poppins-SemiBold.ttf’) format(‘truetype’),
	url(‘../fonts/Poppins-SemiBoldItalic.ttf’) format(‘truetype’),
	url(‘../fonts/Poppins-Thin.ttf’) format(‘truetype’),
	url(‘../fonts/Poppins-ThinItalic.ttf’) format(‘truetype’);
	font-weight:normal;
	font-style:normal;
}
@font-face {
	font-family: font-roboto;
	src:url(‘../fonts/Roboto-Black.ttf’) format(‘truetype’),
	url(‘../fonts/Roboto-BlackItalic.ttf’) format(‘truetype’),
	url(‘../fonts/Roboto-Bold.ttf’) format(‘truetype’),
	url(‘../fonts/Roboto-BoldItalic.ttf’) format(‘truetype’),
	url(‘../fonts/Roboto-Italic.ttf’) format(‘truetype’),
	url(‘../fonts/Roboto-Light.ttf’) format(‘truetype’),
	url(‘../fonts/Roboto-LightItalic.ttf’) format(‘truetype’),
	url(‘../fonts/Roboto-Medium.ttf’) format(‘truetype’),
	url(‘../fonts/Roboto-MediumItalic.ttf’) format(‘truetype’),
	url(‘../fonts/Roboto-Regular.ttf’) format(‘truetype’),
	url(‘../fonts/Roboto-Thin.ttf’) format(‘truetype’),
	url(‘../fonts/Roboto-ThinItalic.ttf’) format(‘truetype’);
	font-weight:normal;
	font-style:normal;
}

// mixin vinova
@mixin css3-prefix($property, $value) {
	-webkit-#{$property}: #{$value};
	-moz-#{$property}: #{$value};
	-ms-#{$property}: #{$value};
	-o-#{$property}: #{$value};
	#{$property}: #{$value};
}

@mixin border-radius($radius: 5px) {
	@include css3-prefix('border-radius', $radius);
}

@mixin opacity($opacity: 0.5) {
	$opacityMultiplied: ($opacity * 100);
	filter:  alpha(opacity=$opacityMultiplied);
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=" + $opacityMultiplied + ")";
	@include css3-prefix('opacity', $opacity);
}

// Main color
$theme-color-default: #111;
$theme-color-primary: #56e723;

// Headings
$color-heading: #222;
$color-heading-second: #444;
$color-heading-sub: #666;
$color-heading-a: #398ad6;
$color-bg: #fff;
$color-heading-af: #f7af24;

// Font
$font-family-primary: 'font-popins', sans-serif;
$font-family-default: 'font-roboto', sans-serif;

*{
	outline: none;
}
body {
	font-family: $font-family-default;
	font-weight: 400;
	font-size: 1.4rem;
}
html {
	font-size:62.5%;
}
@media (max-width: 767px) {
	html {
		font-size:50%;
	}
}
p, h1, h2, h3, h4, h5, h6, dl, ol, ul {
	margin: 0;
	padding: 0;
}
a {
	&:hover {
	    text-decoration: none;
	}
}
b, strong {
	font-weight: bold;
}
input, select, textarea {
	display: block;
	width: 100%;
	border: 1px solid #e3e0d3;
	background-color: $color-bg;
	color: #162950;
	max-width: 100%;
	line-height: 1.2;
	@include border-radius(0);
	padding: 13px 15px;
}
input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
	-webkit-box-shadow: 0 0 0px 1000px #f2f2f2 inset;
	transition: background-color 5000s ease-in-out 0s;
}
svg, symbol {
	&.icon:not(.icon--full-color) {circle, ellipse, g, line, path, polygon, polyline, rect {fill: inherit;stroke: inherit;}}
}

//Overrite Bootstrap 4
@media (min-width: 1200px) {
	.container {
		width: 1200px;
		max-width: 100%;
	}
}

.mb-40 {
	margin-bottom: 40px;
}
.mb-90 {
	margin-bottom: 90px;
}

// Style now

.header {
	background-image: url("../images/bg_hder.jpg");
	background-repeat: no-repeat;
	background-position: center;
    padding: 96px 0 231px;
	.logo-header {
	    padding-bottom: 51px;
	}
	.hder-tt {
		.title-block {
			font-family: $font-family-primary;
			font-weight: 900;
			font-size: 2.6rem;
			color: $theme-color-primary;
			text-transform: uppercase;
		    margin-bottom: 21px;
		}
		.sub-title {
			font-family: $font-family-primary;
			font-weight: 800;
			font-size: 1.6rem;
			color: $color-bg;
			text-transform: uppercase;
		    margin-bottom: 9px;
		}
		.title-info {
			font-family: $font-family-default;
			font-weight: 400;
			font-size: 1.4rem;
			color: $color-bg;
		    line-height: 24px;
	        margin: 0 150px;
		}
	}
}
.main {
	position: relative;
	.title_block {
		font-family: $font-family-primary;
		font-weight: 800;
		font-size: 2.2rem;
		color: $color-heading;
		text-transform: uppercase;
		border-bottom: 1px solid #f2f3f7;
		margin: -3px 0 26px;
		span {
		    position: relative;
		    display: inline-block;
	        padding: 0 0 16px;
			&:after {
			    content: "";
			    position: absolute;
			    width: 100%;
			    height: 3px;
			    background: $color-heading-af;
			    left: 0;
			    bottom: -2px;
			}
		}
	}
	.sub_block {
		font-family: $font-family-default;
		font-weight: 400;
		font-size: 13px;
		color: $color-heading-sub;
	    line-height: 22px;
		a {
			color: $color-heading-a;
			font-weight: bold;
			&:hover {
				color: $theme-color-primary;
			}
		}
	}
	.list-menu {
		padding-top: 49px;
		.list-homepage {
			background: #e4e4e4;
			@include border-radius(8px);
			li {
				list-style-type: none;
				&:not(:last-child) {
					border-bottom: 1px dashed $color-bg;
				}
				a {
					font-family: $font-family-default;
					font-weight: bold;
					font-size: 12px;
					color: $color-heading;
		    		padding: 17px 30px 15px;
				    display: block;
				}
				&:hover, &.active {
					background: #cecece;
					&:first-child {
						border-top-left-radius: 8px;
						border-top-right-radius: 8px;
					}
					&:last-child {
						border-bottom-left-radius: 8px;
						border-bottom-right-radius: 8px;
					}
				}
			}
		}
	}
	.main_layout {
		.getting_started {
			padding-top: 49px;
			margin-bottom: 46px;
			.block_title {
				margin-bottom: 38px;
			}
			.block_content {
				.tl_ct_1 {
					h4.tl_h4 {
						font-family: $font-family-default;
						font-weight: 900;
						font-size: 1.6rem;
						color: $color-heading;
						margin-bottom: 28px;
					}
					h5.tl_h5 {
						font-family: $font-family-default;
						font-weight: bold;
						font-size: 1.4rem;
						color: $color-heading-sub;
					    margin: 24px 0 27px;
					}
					p, h6 {
						font-family: $font-family-default;
						font-weight: 400;
						font-size: 13px;
						color: $color-heading-sub;
					}
					p {
					    margin-bottom: 3px;
				        line-height: 22px;
				        padding-left: 10px;
					}
					h6.tl_h6 {
					    margin: 25px 0 27px;
					}
				}
			}
		}
		.installation {
			padding-top: 49px;
			margin-bottom: 49px;
			.block_title {
				margin-bottom: 48px;
			}
			.block_content {
				.tl_ct_1 {
					.tl_h5 {
						font-family: $font-family-default;
						font-weight: bold;
						font-size: 1.4rem;
						color: $color-heading-sub;
						margin-bottom: 24px;
					}
					.tl_h6 {
						font-family: $font-family-default;
						font-weight: 400;
						font-size: 13px;
						color: $color-heading-sub;
						line-height: 20px;
					    margin-bottom: 31px;
					}
					&:nth-child(2) {
						.tl_h5 {
							margin-bottom: 12px;
						}
						.tl_h6 {
							margin-left: 16px;
						    margin-bottom: 32px;
						}
					}
				}
				.box-img {
					margin: 0 -36px;
					.list-img {
						padding: 0 18px;
					}
				}
			}
		}
		.configuration {
			padding-top: 49px;
			margin-bottom: 49px;
			.block_title {
				.title_block {
				    margin-bottom: 37px;
				}
			}
			.block_content {
				.tl_ct_1 {
					margin-bottom: 25px;
					.tl_h5 {
						font-family: $font-family-default;
						font-weight: bold;
						font-size: 1.4rem;
						color: $color-heading;
						margin-bottom: 19px;
					}
					.tl_h6 {
						font-family: $font-family-default;
						font-weight: 400;
						font-size: 13px;
						color: $color-heading-sub;
						line-height: 22px;
					    margin-bottom: 1px;
					}
					&:nth-child(2) {
						.tl_h5 {
							margin-bottom: 12px;
						}
						.tl_h6 {
							margin-left: 16px;
						    margin-bottom: 32px;
						}
					}
					.note {
						font-family: $font-family-default;
						font-weight: bold;
						font-size: 13px;
						color: #79a452;
					}
				}
				.box-img {
					margin-bottom: 25px;
					.tl_h5 {
						font-family: $font-family-default;
						font-weight: bold;
						font-size: 1.6rem;
						color: $color-heading;
					    margin: 4px 0 36px;
					}
					.img_wide {
						margin: 0 -18px;
						img {
							padding: 0 9px;
						}
					}
				}
				.content_block {
					.tl_ct_1 {
						margin-bottom: 23px;
						&:last-child {
							margin-bottom: 22px;
							.tl_h5 {
								margin-bottom: 3px !important;
							}
						}
					}
					.tl_h5 {
						font-family: $font-family-default;
						font-weight: bold;
						font-size: 1.5rem;
						color: #297bb4;
						margin-bottom: 25px !important;
					}
					p {
						font-family: $font-family-default;
						font-weight: 400;
						font-size: 13px;
						color: $color-heading-sub;
						line-height: 22px;
						strong {
							color: $color-heading;
						}
					}
					.note {
						border-top: 1px dashed #ccc;
						border-bottom: 1px dashed #ccc;
						padding: 8px 0;
						p {
							font-family: $font-family-default;
							font-weight: bold;
							font-size: 13px;
							color: #fd4521;
						    letter-spacing: -0.51px;
						}
					}
				}
			}
		}
		.mega_menu, .vertical_menu {
			padding-top: 49px;
			margin-bottom: 38px;
			.block_title {
				.title_block {
					margin-bottom: 39px;
				}
			}
			.block_content {
				.box-img {
					.tl_h5 {
						font-family: $font-family-default;
						font-weight: bold;
						font-size: 1.6rem;
						color: $color-heading;
						margin-bottom: 14px;
						strong {
							font-size: 12px;
						}
					}
					img {
						margin-bottom: 35px;
					}
				}
				.content_bl {
					.tl_h5 {
						font-family: $font-family-default;
						font-weight: bold;
						font-size: 1.6rem;
						color: $color-heading;
						text-transform: uppercase;
					    margin-bottom: 25px;
					}
					p {
						font-family: $font-family-default;
						font-weight: 400;
						font-size: 13px;
						color: $color-heading-sub;
						line-height: 30px;
						strong {
							color: $color-heading;
						}
					}
				}
			}
		}
		.testimonials {
			padding-top: 49px;
			margin-bottom: 38px;
			.block_title {
				.title_block {
					margin-bottom: 39px;
				}
			}
			.block_content {
				.box-img, .box-img_1, .box-img_2 {
					.tl_h5 {
						font-family: $font-family-default;
						font-weight: bold;
						font-size: 1.6rem;
						color: $color-heading;
						margin-bottom: 14px;
						strong {
							font-size: 12px;
						}
					}
					img {
						margin-bottom: 40px;
					}
				}
				.box-img_1 {
					img {
						margin-bottom: 35px;
					}
				}
				.box-img_2 {
					img {
						margin-bottom: 47px;
					}
				}
				.content_bl, .content_blo, .content_bl_1 {
					.tl_h5 {
						font-family: $font-family-default;
						font-weight: bold;
						font-size: 1.6rem;
						color: $color-heading;
					    margin-bottom: 12px;
					}
					p {
						font-family: $font-family-default;
						font-weight: 400;
						font-size: 13px;
						color: $color-heading-sub;
						line-height: 30px;
						strong {
							color: $color-heading;
						}
					}
				}
				.content_bl {
				    margin-bottom: 24px;
					p {
						strong {
							font-family: $font-family-default;
							font-weight: bold;
							font-size: 13px;
							color: $color-heading-sub;
						}
					}
				}
				.content_blo {
					margin-bottom: 67px;
					.tl_h5 {
					    margin-bottom: 25px;
					}
				}
				.content_bl_1 {
				    margin-bottom: 10px;
					p {
						strong {
							font-family: $font-family-default;
							font-weight: bold;
							font-size: 13px;
							color: $color-heading-sub;
						}
					}
				}
			}
		}
		.product_comment, .block_tags {
		    padding-top: 49px;
		    margin-bottom: 38px;
			.block_title {
				.title_block {
					margin-bottom: 41px;
				}
			}
			.block_content {
				.box-img {
					margin-bottom: 46px;
				}
				.content_bl {
					.tl_h5 {
						font-family: $font-family-default;
						font-weight: bold;
						font-size: 1.6rem;
						text-transform: uppercase;
						color: $color-heading;
						margin-bottom: 15px;
					}
					p {
						font-family: $font-family-default;
						font-weight: 400;
						font-size: 13px;
						color: $color-heading-sub;
						line-height: 30px;
						margin-left: 23px;
					}
				}
			}
		}
		.block_tags {
			.block_content {
				.content_bl {
					.tl_h5 {
						text-transform: none;
					}
					p {
						strong {
							color: $color-heading;
						}
					}
				}
			}
		}
		.page_customize {
		    padding-top: 49px;
	        margin-bottom: 49px;
			.block_title {
				.title_block {
					margin-bottom: 39px;
				}
			}
			.block_content {
				.box-img {
					margin-bottom: 57px;
				}
				.tl_h5 {
					font-family: $font-family-default;
					font-weight: bold;
					font-size: 1.6rem;
					color: $color-heading;
					margin-bottom: 37px;
				}
				.tl_h6 {
					font-family: $font-family-default;
					font-weight: bold;
					font-size: 13px;
					color: $color-heading;
					line-height: 22px;
					margin-bottom: 23px;
					letter-spacing: -0.5px;
					span {
						font-size: 1.4rem;
						color: #36a959;
					}
					i {
						color: #e4724a;
						font-size: 12px;
					}
				}
				.tl_ct_1 {
					margin-bottom: 86px;
				}
				.tl_ct_2 {
					.tl_h5 {
						margin-bottom: 28px;
					}
					.tl_h6 {
						margin-bottom: 13px;
					}
					.box-img {
						margin-bottom: 35px;
					}
				}
			}
		}
		.footer_customize {
			padding-top: 49px;
			.block_title {
				.title_block {
					margin-bottom: 73px;
				}
			}
			.block_content {
				.box-img {
					margin-bottom: 57px;
					&.ct_1 {
						margin-bottom: 63px;
					}
					&:last-child {
						margin-bottom: 49px;
					}
				}
				.tl_h5 {
					font-family: $font-family-default;
					font-weight: bold;
					font-size: 1.6rem;
					color: $color-heading;
					margin-bottom: 47px;
				}
				.tl_h6 {
					font-family: $font-family-default;
					font-weight: bold;
					font-size: 13px;
					color: $color-heading;
					line-height: 22px;
					margin-bottom: 19px;
				    letter-spacing: -0.5px;
					span {
						font-size: 1.4rem;
						color: #36a959;
					}
					i {
						font-weight: 400;
						color: $color-heading-sub;
					}
				}
				.note {
					display: flex;
					align-items: center;
					margin: -5px 0 24px;
					&>i {
						color: #ff2486;
						font-size: 2.6rem;
						margin-right: 12px;
					}
					p {
						font-family: $font-family-default;
						font-weight: bold;
						font-size: 13px;
						color: #ff2486;
					}
				}
			}
		}
		.revolution_slider {
			padding-top: 49px;
		}
	}
}
.footer {}