/* roboto-300 - latin */

@font-face {

	font-family: 'Roboto';

	font-style: normal;

	font-weight: 300;

	src: url('../fonts/roboto-v18-latin-300.eot'); /* IE9 Compat Modes */

	src: local('Roboto Light'), local('Roboto-Light'),

		url('../fonts/roboto-v18-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */

		url('../fonts/roboto-v18-latin-300.woff2') format('woff2'), /* Super Modern Browsers */

		url('../fonts/roboto-v18-latin-300.woff') format('woff'), /* Modern Browsers */

		url('../fonts/roboto-v18-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */

		url('../fonts/roboto-v18-latin-300.svg#Roboto') format('svg'); /* Legacy iOS */

	font-display: swap;

}

/* roboto-regular - latin */

@font-face {

	font-family: 'Roboto';

	font-style: normal;

	font-weight: 400;

	src: url('../fonts/roboto-v18-latin-regular.eot'); /* IE9 Compat Modes */

	src: local('Roboto'), local('Roboto-Regular'),

		url('../fonts/roboto-v18-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */

		url('../fonts/roboto-v18-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */

		url('../fonts/roboto-v18-latin-regular.woff') format('woff'), /* Modern Browsers */

		url('../fonts/roboto-v18-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */

		url('../fonts/roboto-v18-latin-regular.svg#Roboto') format('svg'); /* Legacy iOS */

	font-display: swap;

}

/* roboto-700 - latin */

@font-face {

	font-family: 'Roboto';

	font-style: normal;

	font-weight: 700;

	src: url('../fonts/roboto-v18-latin-700.eot'); /* IE9 Compat Modes */

	src: local('Roboto Bold'), local('Roboto-Bold'),

		url('../fonts/roboto-v18-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */

		url('../fonts/roboto-v18-latin-700.woff2') format('woff2'), /* Super Modern Browsers */

		url('../fonts/roboto-v18-latin-700.woff') format('woff'), /* Modern Browsers */

		url('../fonts/roboto-v18-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */

		url('../fonts/roboto-v18-latin-700.svg#Roboto') format('svg'); /* Legacy iOS */

	font-display: swap;

}

@font-face {

	font-family: 'Palatino Linotype';

	font-style: normal;

	font-weight: normal;

	src: local('Palatino Linotype'), url('../fonts/palatino-linotype.woff') format('woff') /* Modern Browsers */

		url('../fonts/palatino-linotype.ttf') format('truetype'); /* Safari, Android, iOS */

	font-display: swap;

}

body {

	/* font-family: Roboto; */

	font-family: 'Palatino Linotype', 'Montserrat', 'Roboto', sans-serif;

	font-weight: 400;

	color: #414042;

	overflow-x: hidden;

}

label, .btn {

	font-size: 16px;

}



/* GENERAL */

.btn .fa {

	margin-right: 8px;

}

.btn-success {

	background-color: #414042;

	border-color: #414042;

	transition: all .2s;

}

.btn-success:hover {

	color: #414042;

	background-color: #fff;

	border-color: #414042;

	transition: all .2s;

}

.input-group-addon {

	background-color: #f8f8f8;

	color: #616161;

}

.content h2,

.content h3 {

	padding-top: 10px;

	padding-bottom: 16px;

	position: relative;

	text-transform: uppercase;

	margin: 0 0 20px;

	font-size: 20px;

}

.content h2::after,

.content h3::after {

	content: '';

	position: absolute;

	width: 35px;

	height: 4px;

	bottom: 0;

	display: block;

	background: #414042;

}

.content h3 {

	font-size: 17px;

}

.content .text {

	font-size: 18px;

	padding-bottom: 30px;

	text-align: justify;

}



/* TOP BAR */

@media (max-width: 768px) {

	.navbar-nav > li:hover > a::before {

		opacity: 0 !important;

		height: 0;

	}

}

.navbar-toggle {

	background-color: #eee;

	float: none;

	margin-right: 0;

	margin-top: 1px;

}

.navbar-toggle span {

	background-color: #414042;

}

.topbar {

	padding: 10px 0;

	background: #fff;

}

.topbar .line {

	width: 1px;

	overflow: hidden;

	line-height: 70px;

	line-height: 40px;

	background: #414042;

}

.topbar ul {

	display: table;

	margin: 0 auto;

}

.topbar li {

	display: table-cell;

	vertical-align: middle;

}

.top-box {

	font-size: 16px;

	font-weight: 700;

	padding-left: 40px;

	padding-right: 40px;

	display: inline-block;

}

@media (max-width: 399px) {

	.top-box {

		font-size: 13px;

		padding-left: 8px;

		padding-right: 8px;

	}

}

@media (min-width: 400px) and (max-width: 768px) {

	.top-box {

		font-size: 15px;

		padding-left: 20px;

		padding-right: 20px;

	}

}

.top-box span {

    color: #414042;

    font-weight: 400;

}

.top-box a,

.top-box a:hover {

    color: #414042;

}/* 

.top-box i {

	width: 40px;

	height: 30px;

	float: left;

	line-height: 30px;

	text-align: center;

	font-size: 20px;

	margin-top: 5px;

	margin-right: 10px;

	border-right: 1px solid #ccc;

	color: #45bf55;

} */



/* TOP MENU */

.navbar-default {

	border: none;

	margin-bottom: 0;

	background: #414042;

	border-radius: 0;

}

@media (max-width: 768px) {

	.navbar {

		min-height: auto;

	}

}

.navbar-center {

	float: none;

	text-align: center;

}

.navbar-center > li {

	display: inline-block;

	float: none;

}

@media (max-width: 768px) {

	.navbar-center > li {

		display: block;

	}

}

@media (min-width: 768px) and (max-width: 991px) {

	.navbar-nav {

		padding-top: 10px;

		padding-bottom: 10px;

	}

}

.navbar-nav > li > a.logo {

	padding: 0;

	margin: 20px 20px 25px 20px;

}

.navbar-nav > li > a.logo img {

	display: inline-block;

}

.navbar-nav > li > a {

	position: relative;

	color: #fff !important;

	font-size: 16px;

	font-weight: 700;

	text-transform: uppercase;

	padding: 45px 45px 42px 45px;

	letter-spacing: 2px;

	/* transition: all .2s; */

}

@media (max-width: 767px) {

	.navbar-nav > li > a {

		padding: 10px 0;

	}

}

@media (min-width: 768px) and (max-width: 991px) {

	.navbar-nav > li > a {

		padding: 25px 10px;

		font-size: 14px;

	}

	.navbar a.logo {

		width: 160px;

		display: block;

		margin: 20px auto 0 auto;

	}

	.navbar-nav > li > a.logo img {

		max-width: 100%;

	}

}

@media (min-width: 992px) and (max-width: 1199px) {

	.navbar-nav > li > a {

		padding: 25px 15px;

		font-size: 15px;

	}

	.navbar-nav > li > a.logo {

		width: 160px;

	}

	.navbar-nav > li > a.logo img {

		max-width: 100%;

	}

}

@media (min-width: 1200px) and (max-width: 1500px) {

	.navbar-nav > li > a {

		padding: 25px 15px;

	}

	.navbar-nav > li > a.logo {

		width: 200px;

	}

	.navbar-nav > li > a.logo img {

		max-width: 100%;

	}

}

@media (min-width: 979px) {

	ul.nav li.dropdown:hover > ul.dropdown-menu {

		display: block;

		margin: 0;

	}

}

.navbar-nav > li > a:before {

	content: '';

	position: absolute;

	height: 4px;

	bottom: 0;

	left: 50%;

	width: 45px;

	margin-left: -25px;

	background: #fff;

	opacity: 0;

	transition: opacity .3s,height .3s;

}

.navbar-nav > li > a.logo:before {

	height: 0;

}

.navbar-nav > li:hover > a:before {

	opacity: 1;

}

.dropdown-menu {

	box-shadow: 0 5px 12px rgba(100,100,100,.15);

}

.dropdown-menu > li > a,

.dropdown-menu > li > a:focus,

.dropdown-menu > li > a:hover {

	padding: 8px 25px;

	font-size: 14px;

}

.dropdown-menu > li > a:focus,

.dropdown-menu > li > a:hover {

	color: #fff;

	background-color: #414042;

}



/* GET A QUOTE */

.get-quote {

	background: #414042 url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAIAQMAAAD+wSzIAAAABlBMVEUAAADp6elVPkCZAAAAAnRSTlMSEv3ezKMAAAAYSURBVAjXY2BkYGJgYeBgEGBQYHBgaAAAAv0BAIVul1QAAAAASUVORK5CYII=') repeat;

	padding: 30px 0;

	margin-bottom: 30px;

}

.get-quote p {

	font-size: 17px;

	color: #fff;

	line-height: 2;

	margin: 0;

}

@media (max-width: 991px) {

	.get-quote {

		padding: 20px 0;

		text-align: center;

	}

	.get-quote p {

		margin-bottom: 15px;

		line-height: 1.42857143;

	}

}

.get-quote .btn {

	color: #fff;

	background-color: #414042;

	border-color: #fff;

	border-radius: 0;

	transition: all .3s ease;

	font-size: 13px;

}

.get-quote .btn:hover {

	color: #141414;

	background-color: #fff;

}

.get-quote .btn:first-child {

	margin-right: 20px;

}



/* SLIDER */

.slider {

	background-color: #24201f;

}

.slider .inner {

	visibility: hidden;

	position: relative;

	top: 0px;

	left: 0px;

	width: 1300px;

	height: 500px;

	overflow: hidden;

	margin: 0 auto;

}

.slider .loading {

	position: absolute;

	top: 0px;

	left: 0px;

	width: 100%;

	height: 100%;

	text-align: center;

}

.slider .loading img {

	position: relative;

	top: 50%;

	width: 38px;

	height: 38px;

	margin-top: -19px;

}

.spin img {

	animation-name: infinite-spin;

	animation-duration: 1.6s;

	animation-iteration-count: infinite;

	animation-timing-function: linear;

}

.slider .slides {

	position: absolute;

	left: 0px;

	top: 0px;

	width: 1300px;

	height: 500px;

	overflow: hidden;

}

.slider .navigator {

	position: absolute;

	bottom: 12px;

	right: 12px;

}

.slider .navigator .i {

	position: absolute;

	width: 20px;

	height: 20px;

	cursor: pointer;

}

.slider .navigator .i .b {

	fill: #000;

	fill-opacity: 0.5;

	stroke: #fff;

	stroke-width: 1200;

	stroke-miterlimit: 10;

	stroke-opacity: 0.7;

	transition: stroke-opacity .2s ease-out;

}

.slider .navigator .i:hover .b {

	fill: #fff;

	fill-opacity: .7;

	stroke: #000;

	stroke-opacity: .5;

	transition: stroke-opacity .2s ease-out;

}

.slider .navigator .iav .b {

	fill: #888;

	fill-opacity: .8;

}

.slider .navigator svg {

	position: absolute;

	top: 0;

	left: 0;

	width: 100%;

	height: 100%;

}

.slider .arrow {

	display: block;

	position: absolute;

	cursor: pointer;

	width: 55px;

	height: 55px;

	top: 0px;

	opacity: .8;

	transition: opacity .1s ease-in;

}

.slider .arrow:hover {

	opacity: 1;

	transition: opacity .1s ease-out;

}

.slider .arrow svg {

	position: absolute;

	top: 0;

	left: 0;

	width: 100%;

	height: 100%;

}

.slider .arrow-left {

	left: 25px;

}

.slider .arrow-right {

	right: 25px;

}

.slider .arrow .a {

	fill: none;

	stroke: #fff;

	stroke-width: 720;

	stroke-miterlimit: 10;

}

.slider .caption {

	position: absolute;

	top: 50% !important;

	right: 50% !important;

	left: auto !important;

	width: 500px;

	height: auto;

	margin-top: -100px;

	margin-right: -250px;

	padding: 10px 20px;

	background-color: rgba(0,0,0,0.8);

	transform: scale(1) !important;

	text-align: center;

}

.slider .caption .title {

	font-size: 22px;

	color: #fff;

	margin-bottom: 15px;

}

.slider .caption .text {

	font-size: 14px;

	color: #fff;

	font-weight: 300;

	margin-bottom: 15px;

}

.slider .caption .link {

	margin-bottom: 10px;

}

.slider .caption .btn {

	background-color: #45BF55;

	color: #fff;

	font-size: 12px;

	font-weight: 300;

	border-radius: 0;

	border-color: #fff;

	border-width: 1px;

}



/* PRODUCTS LIST */

.products {

	color: #777;

	padding: 5px 0 35px 0;

}

.products .intro {

	text-align: center;

	margin-bottom: 40px;

}

@media (max-width: 768px) {

	.products .intro {

		margin-bottom: 0;

	}

}

.products .intro h2 {

	text-transform: uppercase;

	font-size: 30px;

	color: #414042;

	margin: 20px 0 10px 0;

}

@media (max-width: 768px) {

	.products .intro h2 {

		font-size: 20px;

	}

}

.products .intro hr {

	border-top: 1px solid #939598;

	position: relative;

	max-width: 120px;

	margin: 0 auto;

}

/*.products .intro hr::after {

	content: '';

	position: absolute;

	left: 40%;

	right: 40%;

	top: -3px;

	border-top: 4px solid #414042;

}*/

.products .intro p {

	padding: 10px 0;

}

.products .item {

	margin-bottom: 20px;

}

.products .item:hover img {

	opacity: 0.8;

}

.products .image {

	display: inline-block;

	background-color: #000;

	overflow: hidden;

}

.products img {

	transition: all .3s ease-in-out;

}

.products h3 {

	height: 40px;

	overflow: hidden;

	font-size: 18px;

	text-transform: uppercase;

	font-weight: 400;

	margin: 20px 0;

}

.products h3 a,

.products h3 a:hover {

	color: #141414;

}

.products .subtitle {

	height: 40px;

	overflow: hidden;

}

.products a.more {

	display: inline-block;

	margin-top: 15px;

	color: #414042;

}

.products a.more::after {

	font-family: 'FontAwesome';

	content: "\f105";

	padding-left: 10px;

}

.products .btn {

    color: #fff;

    background-color: #414042;

    border-color: #414042;

    border-radius: 0;

    transition: all .3s ease;

}

.products .btn:hover {

	color: #141414;

	background-color: #fff;

}



/* PRODUCTS DETAILS */

.product-details {

	margin-bottom: 35px;

}

.product-details .carousel-background {

	margin-bottom: 30px;

}

/* .product-details .image {

	margin-bottom: 30px;

} */

.product-details .text {

	margin-bottom: 15px;

	font-size: 18px;

	line-height: 1.5;

	color: #414042;

}

.product-details .text p {

	margin-bottom: 25px;

}

.product-details .btn-lg {

	border-radius: 0;

	padding-left: 55px;

	padding-right: 55px;

}

.product-details .btn-lg i {

	margin-right: 45px;

}



.product-details .btn-sm {

	border-radius: 0;

	padding-left: 15px;

	padding-right: 15px;

}

/* PORTOFOLIO DETAILS */

.portofolio-details {

	margin-bottom: 35px;

}

.portofolio-details .carousel-background {

	margin-bottom: 30px;

}

.portofolio-details .text {

	margin-bottom: 15px;

	font-size: 18px;

	line-height: 1.5;

}



/* SERVICE DETAILS */

.service-details {

	margin-bottom: 35px;

}

.service-details .image {

	margin-bottom: 25px;

}

.service-details .text {

	margin-bottom: 15px;

	font-size: 18px;

	line-height: 1.5;

	color: #3f4042;

}

.service-details .separator {

	margin-bottom: 35px;

}

.service-details .content h2::after,

.service-details .content h3::after {

	width: 35px;

	height: 6px;

	background: #f1f2f2;

}



/* PAGE BANNER */

.page-banner {

	padding-top: 50px;

	padding-bottom: 50px;

	background: #24201F url("../img/page-title.jpg") no-repeat center center;

	margin-bottom: 40px;

	overflow: hidden;

}

.page-banner h1 {

	color: #fff;

	font-size: 30px;

	font-weight: bold;

	letter-spacing: 9px;

	margin: 7px 0;

	text-transform: uppercase;

}



/* PAGES */

.pages .menu {

	margin-bottom: 40px;

}

.pages .menu a,

.pages .menu a:hover {

	display: block;

	color: #141414;

	font-weight: 400;

	padding: 35px 15px;

	margin-bottom: 2px;

	text-transform: uppercase;

	background: #f5f5f5;

}

.pages .menu li a {

	background: #f4f4f4;

	text-decoration: none;

}

.pages .menu li a:hover {

	background: #414042;

	color: #fff;

}

.pages .menu li.active a,

.pages .menu li.active a:hover {

	background: #414042;

	color: #fff;

}

.pages .listing {

	margin-bottom: 40px;

}

.pages .listing .row {

	margin-bottom: 15px;

}

.pages .listing h2 {

	font-size: 16px;

	text-transform: uppercase;

	font-weight: 400;

	padding-bottom: 16px;

	margin: 0 0 25px;

	position: relative;

}

.pages .listing h2::after {

	content: '';

	position: absolute;

	width: 35px;

	height: 4px;

	display: block;

	bottom: 0;

	background: #414042;

}

.pages .listing img {

	margin-right: 10px;

}

.pages .listing a,

.pages .listing a:hover {

	color: #141414;

	font-weight: 400;

}



/* BRANDS SLIDER */

.brands {

	background-color: #f1f2f2;

	padding: 30px 0 0 0;

	margin-top: 30px;

}

.brands .inner {

	padding-bottom: 35px;

	text-align: center;

}

.brands .item {

	margin-bottom: 15px;

}

.brands .item img {

	margin: 0 auto;

}

.brands h2 {

	font-size: 22px;

	margin-top: 0;

	margin-bottom: 30px;

}



/* CONTACT */

.contact {

	padding-bottom: 40px;

}

.contact .top {

	margin-bottom: 40px;

}

.contact .left-col {

	margin-bottom: 20px;

}

@media (min-width: 768px) {

	.contact .left-col {

		padding-right: 30px;

	}

	.contact .right-col {

		padding-left: 30px;

	}

}

.contact .intro {

	margin-bottom: 30px;

	font-size: 16px;

}

.contact textarea {

	height: 100px;

	resize: vertical;

}

.contact .form-control {

	border-color: #414042;

	height: 40px;

}

.contact .input-group-addon {

	background-color: #414042;

	color: #fff;

	border-color: #414042;

}

.contact .btn {

    color: #fff;

    background-color: #414042;

    border-color: #414042;

    border-radius: 0;

    transition: all .3s ease;

	margin-top: 20px;

	padding: 8px 20px;

}

.contact .btn:hover {

	color: #141414;

	background-color: #fff;

}

.contact h2 {

	position: relative;

	padding-bottom: 16px;

	margin: 0 0 20px;

	font-size: 20px;

	text-transform: uppercase;

}

.contact h2::after {

	position: absolute;

	background: #f1f2f2;

	content: '';

	position: absolute;

	height: 4px;

	display: block;

	bottom: 0;

	width: 55px;

}

.contact .map {

	height: 500px;

	margin-bottom: 20px;

	border: 1px #ddd solid;

}

.contact .table > tbody > tr > td {

	border-color: #f1f2f2;

	font-size: 16px;

}



/* NOT FOUND */

.not-found .inner {

	font-size: 15px;

	color: #141414;

	font-weight: 400;

	padding: 100px 0;

}

.not-found .btn {

	color: #fff;

    background-color: #414042;

    border-color: #fff;

    border-radius: 0;

    transition: all .3s ease;

	margin-top: 40px;

}

.not-found .btn:hover {

	color: #141414;

	background-color: #fff;

    border-color: #414042;

}



/* PRE-FOOTER */

.pre-footer {

	background-color: #414042;

	color: #ffffff;

	padding: 50px 0;

}

@media (max-width: 991px) {

	.pre-footer {

		padding: 30px 0;

	}

}

.pre-footer h4 {

	color: #fff;

	text-transform: uppercase;

	margin: 0 0 25px;

	padding-bottom: 16px;

	position: relative;

}

.pre-footer h4::after {

	content: '';

	position: absolute;

	height: 4px;

	display: block;

	bottom: 0;

	width: 35px;

	background: #ffffff;

}

.pre-footer a,

.pre-footer a:hover {

	color: #fff;

	display: inline-block;

	margin-bottom: 4px;

	padding: 3px 0;

	font-size: 16px;

	font-weight: 300;

}

.pre-footer .social a,

.pre-footer .social a:hover {

	font-size: 14px;

}

.pre-footer .fa {

	margin-right: 8px;

	color: #ffffff;

}

.pre-footer .list-unstyled {

	margin-bottom: 0;

}

.pre-footer .about-us {

	margin-bottom: 30px;

}



/* FOOTER */

.footer {

	color: #414042;

	font-weight: 400;

	background: #f1f2f2;

	padding: 30px 0;

}

@media (max-width: 768px) {

	.footer {

		text-align: center;

		padding: 10px 0;

	}

	.footer .text-right {

		padding-top: 5px;

		text-align: center;

	}

}

.footer p,

.footer ul {

	margin-bottom: 0;

}

.footer a,

.footer a:hover {

	color: #414042;

}



/* ANIMATION */

@keyframes infinite-spin {

	from {transform: rotate(0deg)}

	to {transform: rotate(360deg)}

}