/*
Theme Name: DLW
Author: DLW Latvija
Author URI: https://dlw.lv/
Description: Responsive theme for DLW.
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: dlw
*/

/**
 * Table of Contents:
 *
 * 1.0 - General and Typography
 * 2.0 - Layout
 * 3.0 - Front Page
 * 4.0 - Products
 * 5.0 - Media Queries
 * -----------------------------------------------------------------------------
 */


/**
 * 1.0 General and Typography
 * -----------------------------------------------------------------------------
 */

@font-face {
	font-family: 'open_sansregular';
	src: url('./fonts/OpenSans-Regular-webfont.eot');
	src: url('./fonts/OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'),
		url('./fonts/OpenSans-Regular-webfont.woff2') format('woff2'),
		url('./fonts/OpenSans-Regular-webfont.woff') format('woff'),
		url('./fonts/OpenSans-Regular-webfont.ttf') format('truetype'),
		url('./fonts/OpenSans-Regular-webfont.svg#open_sansregular') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'open_sanslight';
	src: url('./fonts/OpenSans-Light-webfont.eot');
	src: url('./fonts/OpenSans-Light-webfont.eot?#iefix') format('embedded-opentype'),
		url('./fonts/OpenSans-Light-webfont.woff2') format('woff2'),
		url('./fonts/OpenSans-Light-webfont.woff') format('woff'),
		url('./fonts/OpenSans-Light-webfont.ttf') format('truetype'),
		url('./fonts/OpenSans-Light-webfont.svg#open_sanslight') format('svg');
	font-weight: normal;
	font-style: normal;
}

article, footer, header, nav {
	display: block;
}

html, body {
	width: 100%;
	height: 100%;
	float: left;
	margin: 0;
	padding: 0;
	border: 0;
}

body {
	font-family: 'open_sansregular', Arial, sans-serif;
	font-size: 15px;
	line-height: 28px;
	letter-spacing: 0;
	position: relative;
	background: #FFFFFF;
}

h1, h2, h3 {
	font-family: 'open_sanslight', Arial, sans-serif;
	font-size: 28px;
	line-height: 42px;
	color: #46454d;
	font-weight: normal;
}

h1, h2 {
	width: 100%;
	float: left;
	margin: 0 0 35px 0;
}

h3 {
	width: 100%;
	float: none;
	margin: 0;
	padding: 0 42px;
	overflow: hidden;
	display: table-cell;
	vertical-align: middle;
	color: #FFFFFF;
	text-align: center;
}

a, a img {
	border: 0;
	text-decoration: none;
}

.header .contact .social svg,
.front .nav .item .overlay,
.page .left h2 a,
.page .left p a,
.page .left .pagenav ul li a,
.page .right .item .overlay {
	-webkit-transition: .55s ease-out;
	-moz-transition: .55s ease-out;
	-ms-transition: .55s ease-out;
	-o-transition: .55s ease-out;
	transition: .55s ease-out;
}

.footer .right,
.front .nav,
.page,
.page .left .article,
.page .left .pagenav h2,
.page .left .pagenav ul li a,
.page .right .grid,
.page .right .item,
.page .right .article {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.front .nav .item,
.page .right .item .bg {
	background: no-repeat center center scroll;
	-webkit-background-size: 100%;
	-moz-background-size: 100%;
	-o-background-size: 100%;
	background-size: 100%;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}


/**
 * 2.0 Layout
 * -----------------------------------------------------------------------------
 */

.layout {
	width: 100%;
	height: 112px;
	float: left;
	position: relative;
	z-index: 2;
	background: #46454d;
	color: #939199;
}

.layout p {
	float: left;
	margin: 0;
	color: #939199;
}

.layout a {
	color: #939199;
	-webkit-transition: color .55s ease-out;
	-moz-transition: color .55s ease-out;
	-ms-transition: color .55s ease-out;
	-o-transition: color .55s ease-out;
	transition: color .55s ease-out;
}

.layout a:hover,
.layout .active a {
	color: #FFFFFF;
}

.layout a:focus,
.layout a::-moz-focus-inner,
.page p a:focus,
.page p a::-moz-focus-inner,
.page .right .item .overlay:focus,
.page .right .item .overlay::-moz-focus-inner {
	border: 0 !important;
	outline: none !important;
}

.layout .right,
.layout .left {
	height: 28px;
	float: right;
	margin: 42px 0;
}

.layout .menu {
	float: left;
	margin: 0 56px;
}

.layout .menu ul {
	float: left;
	margin: 0;
	padding: 0;
	list-style: none;
}

.layout .menu ul li {
	float: left;
	margin: 0 28px 0 0;
	text-transform: uppercase;
}

.layout .menu ul li:last-child {
	margin: 0;
}

.header .left {
	width: 224px;
	height: 56px;
	float: left;
	margin: 28px 0 28px 56px;
}

.header .logo {
	float: left;
}

.header .logo img {
	float: left;
}

.header .contacts {
	float: left;
}

.header .contact {
	float: left;
	margin: 0 0 0 56px;
}

.header .contact .icon {
	float: left;
	margin: 9px 15px 7px 0;
}

.header .contact .social {
	float: left;
	margin: 0 0 0 56px;
}

.header .contact .social svg {
	float: left;
}

.header .contact .social:hover svg {
	fill: #FFFFFF;
}

.footer .left {
	width: 336px;
	float: left;
}

.footer .logo {
	float: left;
	margin: 0 15px 0 56px;
}

.footer .right {
	width: 100%;
	margin-left: -336px;
	padding-left: 336px;
}

.footer .menu ul li {
	text-transform: none;
}

.footer .copyright {
	float: right;
	margin: 0 56px 0 0;
}


/**
 * 3.0 Front Page
 * -----------------------------------------------------------------------------
 */

.front .nav,
.front .nav .item .center,
.page,
.page .right .item .center {
	width: 100%;
	height: 100%;
	float: left;
	display: table;
}

.front .nav {
	margin: -112px 0 0 0;
	padding: 112px 0 0 0;
	position: relative;
	display: block;
	z-index: 1;
}

.front .nav .row {
	width: 50%;
	height: 100%;
	float: left;
	display: table;
}

.front .nav .item {
	width: 50%;
	height: 100%;
	display: table-cell;
}

.front .nav .item .overlay {
	width: 100%;
	height: 100%;
	float: left;
	background: rgba(48, 46, 51, 0.75);
}

.front .nav .item .overlay:hover {
	background: rgba(147, 145, 153, 0.75);
}

.front .nav .item img,
.page .right .item img {
	display: none;
}


/**
 * 4.0 Products
 * -----------------------------------------------------------------------------
 */

.page {
	margin: -112px 0;
	padding: 112px 0;
	position: relative;
	z-index: 1;
}

.page h2 a,
.page p a {
	color: #46454d;
}

.page h2 a:hover,
.page p a:hover {
	color: #939199;
}

.page p {
	width: 100%;
	float: left;
	margin: 0 0 14px 0;
	color: #46454d;
}

.page p:last-child,
.page table:last-child {
	margin: 0;
}

.page p a {
	text-decoration: underline;
}

.page em {
	font-style: normal;
	color: #939199;
}

.page .left,
.page .right {
	width: 336px;
	height: 100%;
	position: relative;
	display: table-cell;
	vertical-align: top;
	background: #dddae5;
}

.page .left .article {
	width: 100%;
	float: left;
	padding: 49px 56px 56px 56px;
}

.page .left .pagenav {
	width: 100%;
	float: left;
	margin: 49px 0 56px 0;
	list-style: none;
}

.page .left .pagenav h2 {
	padding: 0 56px;
}

.page .left .pagenav ul {
	width: 100%;
	float: left;
	margin: 0;
	padding: 0;
	list-style: none;
}

.page .left .pagenav ul li {
	width: 100%;
	float: left;
}

.page .left .pagenav ul li a {
	width: 100%;
	float: left;
	padding: 7px 56px;
	line-height: 28px;
	color: #46454d;
}

.page .left .pagenav ul li.current_page_item a,
.page .left .pagenav ul li.current_page_parent a {
	color: #FFFFFF;
}

.page .left .pagenav ul li.current_page_item a,
.page .left .pagenav ul li.current_page_parent a,
.page .left .pagenav ul li a:hover {
	background: #b8b6bf;
}

.page .left .pagenav ul li ul {
	display: none;
}

.page .left .pagenav ul li.current_page_item ul,
.page .left .pagenav ul li.current_page_parent ul {
	padding: 0 0 14px 0;
	display: block;
	background: #b8b6bf;
}

.page .left .pagenav ul li.current_page_item ul li a,
.page .left .pagenav ul li.current_page_parent ul li a {
	padding: 4px 56px 3px 56px;
	line-height: 21px;
	color: #46454d;
}

.page .left .pagenav ul li.current_page_item ul li a:hover,
.page .left .pagenav ul li.current_page_parent ul li a:hover {
	background: #939199;
}

.page .left .pagenav ul li.current_page_parent ul li.current_page_item a {
	color: #FFFFFF;
}

.page .right {
	width: auto;
	background: #FFFFFF;
}

.page .right .grid,
.page .right .item {
	width: 100%;
	float: left;
	padding: 7px;
}

.page .right .item {
	width: 25%;
}

.page .right .item .bg {
	width: 100%;
	height: 100%;
	float: left;
	position: relative;
}

.page .right .item .bg:after {
	content: "";
	display: block;
	padding-top: 100%;
}

.page .right .item .overlay {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background: rgba(48, 46, 51, 0.25);
}

.page .right .item .overlay:hover {
	background: rgba(48, 46, 51, 0.75);
}

.page .right .article {
	width: 100%;
	float: left;
	padding: 35px 56px 56px 56px;
}

.page .right .article:first-child {
	padding: 49px 56px 56px 56px;
}

.page .right .article table,
.page .right .article tr,
.page .right .article th,
.page .right .article td {
	padding: 0;
	border: 0;
	border-spacing: 0;
	vertical-align: top;
}

.page .right .article table {
	margin: 0 0 14px 0;
	color: #46454d;
}

.page .right .article .col-2 td:first-child {
	width: 112px;
}

.page .right .article .col-3 th {
	padding: 0 0 14px 0;
	font-weight: normal;
	color: #939199;
	text-align: left;
}

.page .right .article .col-3 td {
	width: 140px;
}


/**
 * 5.0 Media Queries
 * -----------------------------------------------------------------------------
 */

/* Does the same thing as <meta name="viewport" content="width=device-width">,
 * but in the future W3C standard way. -ms- prefix is required for IE10+ to
 * render responsive styling in Windows 8 "snapped" views; IE10+ does not honor
 * the meta tag.
 */
@-ms-viewport {
	width: device-width;
}

@viewport {
	width: device-width;
}

@media screen and (max-width: 1600px) {
	.page .right .item {
		width: 33.33%;
	}
}

@media screen and (max-width: 1150px) {
	.page .right .item h3 {
		font-size: 20px;
		line-height: 28px;
	}
}

@media screen and (max-width: 1060px) {
	.layout {
		height: 84px;
	}

	.layout .right,
	.layout .left {
		margin: 28px 0;
	}

	.layout .menu {
		margin: 0 28px;
	}

	.layout .menu ul li {
		margin: 0 14px 0 0;
	}

	.header .left,
	.header .logo img {
		width: 112px;
		height: 28px;
	}

	.header .left {
		margin: 28px 0 28px 28px;
	}

	.header .contact {
		margin: 0 0 0 28px;
	}

	.header .contact .social {
		margin: 0 0 0 28px;
	}

	.footer .logo {
		margin: 0 15px 0 28px;
	}

	.footer .left,
	.footer .right {
		width: auto;
	}

	.footer .right {
		margin-left: 0;
		padding-left: 0;
	}

	.footer .copyright {
		margin: 0 28px 0 0;
	}

	.front .nav {
		margin: -84px 0 0 0;
		padding: 84px 0 0 0;
		display: table;
	}

	.page {
		margin: -84px 0;
		padding: 84px 0;
	}
}

@media screen and (max-width: 960px) {
	h1, h2 {
		margin: 0 0 21px 0;
	}

	.front .nav .row {
		width: 100%;
		height: 50%;
		float: none;
		display: table-row;
	}

	.front .nav .item {
		height: 168px;
	}

	.page .left {
		width: 280px;
	}

	.page .left .article {
		padding: 35px 28px 42px 28px;
	}

	.page .left .pagenav {
		margin: 35px 0 42px 0;
	}

	.page .left .pagenav h2 {
		padding: 0 28px;
	}

	.page .left .pagenav ul li a {
		padding: 7px 28px;
	}

	.page .left .pagenav ul li.current_page_item ul li a,
	.page .left .pagenav ul li.current_page_parent ul li a {
		padding: 4px 28px 3px 28px;
	}

	.page .right .item {
		width: 50%;
	}

	.page .right .item h3 {
		font-size: 28px;
		line-height: 56px;
	}

	.page .right .article {
		padding: 21px 28px 42px 28px;
	}

	.page .right .article:first-child {
		padding: 35px 28px 42px 28px;
	}
}

@media screen and (max-width: 820px) {
	.page .right .item h3 {
		font-size: 20px;
		line-height: 28px;
	}
}

@media screen and (max-width: 740px) {
	.layout {
		height: 168px;
	}

	.layout .left {
		width: 100%;
		margin: 28px 0 14px 0;
		text-align: center;
	}

	.layout .logo,
	.layout .menu ul li,
	.header .contact,
	.footer .left p {
		float: none;
		display: inline-block;
		vertical-align: top;
	}

	.layout .right {
		width: 100%;
		height: 70px;
		margin: 0 0 28px 0;
	}

	.layout .menu {
		width: 100%;
		margin: 0;
	}

	.layout .menu ul,
	.header .contacts {
		width: 100%;
		height: 28px;
		text-align: center;
	}

	.header .contacts,
	.footer .menu {
		margin: 0 0 14px 0;
	}

	.header .contact:first-child {
		margin: 0;
	}

	.footer .left .logo {
		margin: 0 15px 0 0;
	}

	.footer .copyright {
		width: 100%;
		margin: 0;
		text-align: center;
	}

	.footer .copyright a {
		float: none;
	}

	.front .nav {
		margin: -168px 0 0 0;
		padding: 168px 0 0 0;
	}

	.page {
		margin: -168px 0;
		padding: 168px 0;
	}

	.page.category .left {
		display: none;
	}

	.page .right .item h3 {
		font-size: 28px;
		line-height: 56px;
	}
}

@media screen and (max-width: 560px) {
	.page .left,
	.page .right {
		height: auto;
	}

	.page .right .item h3 {
		font-size: 20px;
		line-height: 28px;
	}

	.contact .left,
	.contact .right {
		width: 100%;
		float: left;
		display: block;
	}

	.contact h2,
	.contact p {
		text-align: center;
	}

	.contact .right {
		height: 336px;
	}
}

@media screen and (max-width: 480px) {
	.front .nav .row {
		height: auto;
		float: left;
		display: block;
	}

	.front .nav .item {
		width: 100%;
		display: block;
	}
}

@media screen and (max-width: 460px) {
	.header {
		height: 210px;
	}

	.header .right {
		height: 112px;
	}

	.header .contacts {
		height: 70px;
	}

	.header .contact {
		width: 100%;
		height: 28px;
		float: left;
		margin: 0;
		text-align: center;
	}

	.header .contact:first-child {
		margin: 0 0 14px 0;
	}

	.header .contact .icon,
	.header .contact .social,
	.header .contact p {
		float: none;
		display: inline-block;
		vertical-align: top;
	}

	.front .nav {
		margin: -210px 0 0 0;
		padding: 210px 0 0 0;
	}

	.page {
		margin: -210px 0 -168px 0;
		padding: 210px 0 168px 0;
	}

	.page .right .item {
		width: 100%;
	}

	.page .right .item h3 {
		font-size: 28px;
		line-height: 56px;
	}
}
.fa {
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}