/**

    Contents:
    
    $PageElements
    $Header
    $Navigation
    $HomePage
    $Pages
    $Companies
    $Blog
    $Footer

*/

/**********************************************************************************************************************************************

$PageElements

******************************************************************************************************************************************** */

html {
	background: #eaeaea;
}

[role="main"] {
	padding: 0;
	float: none;
}

@media only screen and (min-width: 61.313em) {
	[role="banner"] {
		position:fixed;
		z-index: 10000;
		top:0;
		left: 0;
		box-shadow: 0 .188em .375em rgba(0,0,0,.25);
		height: 10em;
		opacity: .975;
		background: #fff;
		width: 100%;
		padding: 0 13.25%;
	}

	.logged-in [role="banner"] {
		top: 1.938em;
	}

	body {
		padding-top: 10em;
	}
}

/**********************************************************************************************************************************************

$Header

******************************************************************************************************************************************** */

.header-search {
	float: right;
	margin: 0 2.5% 0 0;
}

header[role="banner"] .search-form {
	display: inline-block;
	background: #ddd;
    font-size: .875em;
    margin-right: .286em;
    padding: .286em;
    transition: all 0.15s linear 0s;
    overflow: hidden;
    border-radius: 0 0 0.25em 0.25em;
    -moz-box-sizing: border-box; 
   -webkit-box-sizing: border-box; 
   -ms-box-sizing: border-box; 
   box-sizing: border-box;
   vertical-align: top;
}

header[role="banner"] .search-form input {
	float: left;
	width: 52%;
	padding: 0.176em;
	line-height: 1.063em;
}

header[role="banner"] .search-form input[type="submit"] {
	width: 38%;
	background: none;
	color: #193368;
}

.menu-search-menu-container {
	display: inline-block;
}

.site-logo {
	float: left;
	margin-left: 1%;
	margin-top: 2em;
	width: auto;
}

.site-logo img {
	width: 97%;
}

@media only screen and (min-width: 61.313em) {
	.header-search {
		width: 65%;
		margin: .5em 0 0 0;
		text-align: right;
	}

	.header-search .search-form {
		width: 17.357em;
		border-radius: .25em;
	}

	header[role="banner"] .search-form input {
		width: 71.60493827160494%;
	}

	header[role="banner"] .search-form input[type="submit"] {
		width: auto;
		padding: .214em .357em;
		border: none;
	}
}

/**********************************************************************************************************************************************

$Navigation

******************************************************************************************************************************************** */

.menu-toggle {
	display: none;
}

.menu-site-navigation-container {
	height: auto;
	margin: .5em 0 0 0;
}

.js .site-nav {
	left: 0;
	clear: both;
}

.js .site-nav form {
	display: none;
}

.site-nav li {
	float: left;
	width: 20%;
	text-align: center;
}

.site-nav a {
	color: #858585;
	font-size: 1.125em; 
	padding: .5em;
	line-height: 1.889;
}

.site-nav a:hover {
	color: #193368;
	background: #fafafa;
	text-decoration: none;
}

header .current-menu-item a {
    background: #fafafa;
    color: #193368;
}

@media only screen and (min-width: 61.313em) {
    .site-logo {
    	width: 25%;
    }

    .site-logo img {
    	width: 72%;
    }

    .js .site-nav {
    	float: left;
    	width: 74%;
    	clear: none;
    }
}


/**********************************************************************************************************************************************

$HomePage

******************************************************************************************************************************************** */

.slider-nav span {
	border-radius: 2em;
    height: 1em;
    width: 1em;
}

.home-brands {
	width: 78%;
	margin: 3em auto;
}

.home-brands > li {
	width: 100%;
}

.brands-prev, .brands-next {
	left: 5%;
	top: 45%;
	top: calc(50% - 30px);
	height: 61px;
	width: 41px;
	background: url(../img/icons/arrow-left.png) center center no-repeat rgba(255,255,255,.75);
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}

.brands-next {
	left: auto;
	right: 5%;
	background: url(../img/icons/arrow-right.png) center center no-repeat rgba(255,255,255,.75);
}

@media only screen and (min-width: 40.875em) {
	.shop-covers li li {
		width: 14.1%;
		padding: 1% 2%;
	}
}

@media only screen and (min-width: 61.313em) {
	.home-post {
		padding: 8.750em 0;
		background-position: center center;
		background-repeat: no-repeat;
		background-size: cover;
	}

	.home-post .content {
		width: 30%;
		margin: 0 auto 0 60%;
	}

	.home-jobs h1 {
		float: left;
		width: 25%;
	}

	.home-jobs ul {
		float: left;
		width: 75%;
	}

	.text-block {
		padding: 7em 0;
	}

	.text-block-inner {
		width: 29%;
		margin: 0 0 0 5.313em;
	}
}

/**********************************************************************************************************************************************

$Blog

******************************************************************************************************************************************** */

@media only screen and (min-width: 53.750em) {
	.blog-posts {
		float: left;
		width: 60%;
		padding: 0 5% 0 0;
	}

	.sidebar {
		float: right;
	    padding: 0 6.07143% 0 0;
	    width: 32%;
	    margin: 5.813em 0 0 0;
	}

	.post .entry-meta, .blog [itemprop="image"] {
		display: block;
	}

	.blog [itemprop="image"] {
		max-width: 30%;
	}

	.blog-posts .post h1 {
		width: 70%;
	}

	.blog-posts .blog-list [itemprop="text"] {
		width: 60%;
	}

	.single-post article header, .single-post article footer, .single-post [itemprop="text"] {
		float: left;
		width: 60%;
	}

	.single-post .post-image {
		max-width: 35%
	}

	.single .post h1 {
		width: 100%;
	}

}

/**********************************************************************************************************************************************

$Pages

******************************************************************************************************************************************** */

.page-text {
	float: left;
	width: 53%;
}

[itemprop="articleSection"] img {
	float: right;
	max-width: 40%;
	margin: 4em 0 0 0;
}

.page-inner {
    margin: 4em auto;
}


/**********************************************************************************************************************************************

$Companies

******************************************************************************************************************************************** */

.companies-list, .brand-list {
	text-align: left;
}

.companies-list li, .brands-list li {
	width: 47%;
}

.companies-list li:nth-child(even), .brands-list li:nth-child(even) {
	float: right;
}

@media only screen and (min-width: 42.500em) {

	.company-info {
		float: left;
		width: 70%;
		padding: 0 5%;
	}

	.company-contact {
		float: right;
		width: 30%;
	}

}

@media only screen and (min-width: 57.500em) {
	
	.companies-list li {
		width: 31.5%;
		float: left;
		margin: 0 .625em .625em 0;
	}

	.companies-list li:nth-child(even) {
		float: left;
	}

	.companies-list li:nth-child(3n+1) {
		clear: both;
	}

	.company-image {
		display: block;
		float: left;
		width: 15%;
	}

	.small-brand-image {
		margin: 0 0 1em 0;
	}

	.company-info {
		width: 55%;
	}

	.brand-list li {
		width: 21.5%;
		float: left;
		margin: 0 2% 2% 0;
	}

	.brand-list li:nth-child(even) {
		float: left;
	}
	
	.brand-list li:nth-child(4n+1) {
		clear: both;
	}
}

/**********************************************************************************************************************************************

$Contact

******************************************************************************************************************************************** */

@media only screen and (min-width: 53.375em) {
	.map-prev {
		left: 3em;
	}

	.map-next {
		right: 3em;
	}

	.location-slider li {
		padding: 0 10%;
	}
}

@media only screen and (max-width: 59.374em) {
	.department-contact > li {
		float: left;
		width: 48%;
	}

	.department-contact > li:nth-child(even) {
		float: right;
	}

	.department-contact > li:nth-child(2n+1) {
		clear: both;
	}
}

@media only screen and (min-width: 59.375em) {
	.department-contact > li {
		float: left;
		width: 31%;
		margin: 1.13%;
	}

	.department-contact > li:nth-child(3n) {
		float: right;
	}

	.department-contact > li:nth-child(3n+1) {
		clear: both;
	}
}

.location-text {
	float: left;
	width: 35%;
	padding: 0 5% 0 0;
}

.location-map {
	height: 16.313em;
	width: 65%;
}

/**********************************************************************************************************************************************

$Footer

******************************************************************************************************************************************** */

footer[role="contentinfo"] {
	margin: 0;
	padding: 2em 6.071428571428571%;
	border-top: 1px solid rgb(231, 228, 225);
}

[role="contentinfo"] h4 {
	border: none;
}

.sitemap-list {
	float: left;
	width: 25%;
}

@media only screen and (min-width: 55.063em) {
	.footer-section, .menu-quick-links-container {
		float: left;
		width: 16.667%;
		padding: 0 3% 0 0;
		box-sizing: border-box;
	}

	.footer-section:nth-child(3) {
		width: 50%;
		padding: 0;
	}

	.footer-section li, .menu-quick-links-container li {
		float: none;
		width: 100%;
	}

	.footer-section:nth-child(3) li {
		width: 29.3333%;
		float: left;
		margin: 0 3% 0 0;
	}

	[role="contentinfo"] small {
		float: left;
		border: none;
	}

	.menu-footer-menu-container {
		float: right;
		min-width: 55%;
		max-width: 75%;
		padding: 1em 0;
	}

	.menu-footer-menu-container li {
		float: left;
		width: auto;
	}
}