@charset "UTF-8";

h1, h2, h3 { font-size: 30px; line-height: 35px; }
p { text-align: left; }

.border-title { margin-bottom: 2em; border: none; }
.border-title h3 { white-space: inherit; bottom: inherit; border: none; font-size: 26px; }

header { width: 70px; padding: 15px; }
header.open { z-index: 1; }
section { width: calc(100% - 70px); margin-left: 70px; background-image: none; }

.container { padding: 1.5em 1em 1em; }

/* Header */
.nav-icon { display: block; }
.header-logo { margin-bottom: 1.5em; }
.header-logo img { max-width: 40px; }
.header-menu {
	opacity: 0;
	width: 240px;
	position: absolute;
	top: 0;
	left: -240px;
	height: 100vh;
	min-height: 100vh;
	padding: 190px 30px 20px;
	background: #1d252c;
	transition-property: all;
	transition-duration: 1s;
	transition-timing-function: cubic-bezier(0, 1, 0.5, 1);
}
.header-menu.show {
	opacity: 1;
	left: 0;
	transition-property: all;
	transition-duration: 1s;
	transition-timing-function: cubic-bezier(0, 1, 0.5, 1);
}

/* Banners */
.banner { height: 250px; }
.medium-banner { height: 200px; }
.contact-banner { height: 150px; }
.banner-txt { left: 1em; padding-right: 0; }
.banner-txt h2 { margin: 0; font-size: 26px; line-height: 26px; }
.banner-txt p { display: none; }

/* List */
.product-list li { width: 100%; margin-right: 0; margin-bottom: 2em; }

/* CTA */
.home-cta { margin-bottom: 0; }
.home-cta li { width: 100%; margin-right: 0; margin-bottom: 2em; }
.home-catalog { background-size: cover; }
.home-cta li span,
.home-catalog span { font-size: 30px; }
.home-catalog span { line-height: 35px; margin: 0 0 1em; }
.home-catalog .catalog-btn { line-height: inherit; }

/* Products */
.wrap-filters,
.wrap-product-list { float: left; width: 100%; margin-right: 0; }
.wrap-filters { position: relative; }
.wrap-filter-product {
	display: none;
	z-index: 1;
	position: absolute;
	top: 57px;
	left: 0;
	width: 100%;
	padding: 1em;
	background: #e7e9e9;
	box-shadow: 0px 3px 8px #888;
}
.wrap-filter-product { display: none; }
.wrap-filter-product.show { display: block; }
.filter-list ul { padding-left: 0; }
.filter-list ul li label { padding-left: 0; }
.filter-title span { font-size: 0; }
.filter-title span:before { top: calc(50% - 2px); }
.filter-title.active span:before { top: calc(50% - 4px) }
.filter-title.active .main-filter { display: none; }
.filter-title.active .close-filter { display: inline-block; }
.filter-title.active .close-filter:before { width: 18px; height: 18px; background-image: url('../../img/icons/icon-close.svg'); }

.filter-dropdown li { position: relative; margin-bottom: 5px; padding-left: 30px; }
.filter-dropdown li .custom-checkbox { position: absolute; top: 2px; left: 0; }

/* Product info */
.wrap-product-detail { margin-bottom: 2em; }
.product-img, .product-info { width: 100%; margin-right: 0; }
.product-img { margin-bottom: 3em; text-align: center; }
.product-img img { margin: 0 auto; }
.product-info { padding-right: 0; }
.product-info .product-number li { width: 100%; margin-right: 0; padding: 0; border: none; }
.product-info .product-number li:first-child { margin-bottom: .5em; }
.product-info .back { position: absolute; top: 0; right: 0; }
.product-info table { margin-bottom: 4em; }

/* Custom design */
.custom-design-list li { float: left; width: 100%; margin: 0 0 1.5em 0; }

/* Contact */
.wrap-contact .wrap-form,
.wrap-contact .wrap-contact-info { width: 100%; margin-right: 0; }
.wrap-contact .wrap-form { margin-bottom: 2em; }

/* About */
.about .subtitle { font-size: 30px; line-height: 35px; }
.wrap-logo-ampak a, .wrap-logo-ampak .logo-ampak-txt { float: none; }
.wrap-logo-ampak a { text-align: center; }
.wrap-logo-ampak .logo-ampak-txt { padding: 0; }
.company-logos { text-align: center; }
.company-logos li { margin-right: 0; margin-bottom: 2em; }
.about-img img { max-width: 100%; }

/* Footer */
.footer { padding: 2em 1em 6em 70px; }
.footer-info,
.footer-quote { width: 100%; margin-bottom: 1.5em; }
.footer-info { margin-bottom: 3em; }
.footer-quote { text-align: left; }

.copyright .wrap-copyright { width: inherit; padding: .75em; }
.copyright .wrap-copyright p,
.copyright .wrap-copyright p:last-child { float: none; text-align: center; }