/*
Theme Name: SPWM
Theme URI: 
Author: 
Author URI: 
Description: 
Version: 1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: black, blue, gray, red, white, yellow, dark, light, one-column, two-columns, right-sidebar, fixed-layout, responsive-layout, accessibility-ready, custom-background, custom-colors, custom-header, custom-menu, editor-style, featured-images, flexible-header, microformats, post-formats, rtl-language-support, sticky-post, threaded-comments, translation-ready
*/

html, body { margin:0;padding:0; }

body { 
	font-family: "proxima-nova",sans-serif;
	color:#555;
}

h1,h2,h3,h4,h5 { 
	font-family: 'Arvo', serif;
}

a { color: #900; text-decoration:none; cursor:pointer; }
.nav-item-link a { color: #555; }
a:hover { color: #900; }
 
/* ===== HEADER ===== */
header {
	max-width:1200px;
	width:100%;
	margin-left:auto;
	margin-right:auto;
	position:relative;
	height:85px;
}
.logo{
	width:330px;
	height:75px;
	background:url("/wp-content/themes/spwm/img/logo-368x84px.png") no-repeat center center;
	background-size:330px 75px	;
	display:inline-block;
	float:left;
	margin-left:15px;
}

@media(min-width:469px) and (max-width:768px){
	.logo{
		width:250px;
		height:70px;
		background-size:contain;
		background-position:top;
	}
}
@media(max-width:468px){
	.logo{
		width:200px;
		height:46px;
		background-size:contain;
		background-position:top;
	}
}

header .contact div { text-align:right; }

.telephone-no {
	color: #990000;
	font-size:1.4em;
	font-weight:bold;
	text-decoration:none;
}

.facebook {
	display:inline-block;
	background:url("/wp-content/themes/spwm/img/facebook-40x40px.png") no-repeat center center;
	background-size:cover;
	width:40px;
	height:40px;
}
.twitter {
	display:inline-block;
	background:url("/wp-content/themes/spwm/img/twitter-40x40px.png") no-repeat center center;
	background-size:cover;
	width:40px;
	height:40px;
}

/* ======= NAV ======= */

.nav-item{
	display:inline-block;
	color:#000;
	font-weight:700;
	margin:0;
	text-transform:uppercase;
}


.nav-item-link { position: relative; z-index:2}


@media (min-width:769px)
{
	.nav-item {
		font-size:0.9em;
	}
	.nav-item.active, .nav-item a:hover{
		color:#555;
		padding-bottom:2px;
		border-bottom: 2px solid #990000;
	}
}
@media (max-width:768px)
{
	.nav { background-color:white; }
	.nav-item {
		font-size:1.2em;
		background-color:white;
	}
	.nav-item-link.has-children .nav-item.top {display:none;}
	.nav-item-link.has-children .subItems
	{
		display:block;
		position:static;
		width:100%;
		text-align:center;
		padding:0px;
	}
	.subItems .nav-item-link
	{
		padding-bottom:0px !important;
	}
}

.subItems {
	display:none;
	position:absolute;
	top:00px;
	left:0px;
	background:#fff;
	z-index:2;
	padding-bottom:6px;
	text-transform:uppercase;
}

.subItems .nav-item-link { padding-bottom: 12px; }

.sub-nav-item-link {
	padding-top:6px;
	padding-bottom:6px;
}

@media (min-width:769px)
{
	.nav-item-link:hover .subItems, .subItems:hover {
		display:block !important;
	}
}

.nav-list-toggle{
	display:none;
	z-index:3;
}

@media(min-width:1000px){
	header .contact {
		display:grid;
		position:absolute;
		right:0px;
		top:0px;
		width:400px;
		height:84px;
		grid-template-columns:1fr 60px 60px;
		align-items: center;  
	}
}
@media(min-width:768px) and (max-width:999px)
{
	header .contact {
		display:grid;
		position:absolute;
		right:0px;
		top:0px;
		width:250px;
		height:84px;
		grid-template-columns:1fr 0fr 0fr;
		align-items: center;  
	}
	header .contact .facebook, header .contact .twitter {display:none;}
}
@media(max-width:769px){
	header .contact {display:none; }
}

@media(min-width:769px){
	.nav-item-link{
		display:inline-block;
		text-align:center;
	}
	.nav{
		margin-left:0px;
		margin-right:0px;
		display:grid !important;
		grid-template-columns:1fr 1fr 1.5fr 1fr 1fr 1fr 1fr 1fr;
		align-items: center; 
		position:absolute;
		top:120px;
		left:0px;
		width:100%;
		text-align:center;
	}

	.nav-item.active{
		color:#000;
		background:#000;
		-webkit-background-clip: text;
		-webkit-text-fill-color: transparent;
	}

}

@media(max-width:768px){
	
	header{
		padding:15px 0px 0px;
		height:60px !Important;
	}

	header .container{
		padding:0;
	}
	
	.home-panel, .content-panel { margin-top:20px !important;}
	.logo{
		margin-bottom:15px;
	}
	.nav-item-link{
		width:100%;
	}

	.nav-list-toggle{
		position:absolute;right:0px;top:20px;
		width:25px;
		height:24px;
		float:right;
		margin-right:15px;
		margin-top:5px;
		display:inline-block;
	}
	.nav-list-toggle-bar{
		width:100%;
		height:3px;
		background:#000;
		margin-bottom:5px;
		 -webkit-transition: all 0.3s ease-in-out;
		  -moz-transition: all 0.3s ease-in-out;
		  -o-transition: all 0.3s ease-in-out;
		  transition: all 0.3s ease-in-out;
	}
	.nav-list-toggle.open .nav-list-toggle-bar:nth-child(1){
		-ms-transform: rotate(45deg); /* IE 9 */
    -webkit-transform: rotate(45deg); /* Chrome, Safari, Opera */
		    transform: rotate(45deg);
		    margin-top:8px;
		    margin-bottom:-11px;
	}
	.nav-list-toggle.open .nav-list-toggle-bar:nth-child(2){
		opacity:0;
		-webkit-transition: opacity 0s ease-in-out;
		  -moz-transition: opacity 0s ease-in-out;
		  -o-transition: opacity 0s ease-in-out;
		  transition: opacity 0s ease-in-out;
	}
	.nav-list-toggle.open .nav-list-toggle-bar:nth-child(3){
		-ms-transform: rotate(-45deg); /* IE 9 */
    -webkit-transform: rotate(-45deg); /* Chrome, Safari, Opera */
		    transform: rotate(-45deg);
		    margin-bottom:0px;
	}
	.nav{
		width:100%;
		display:none;
	}
	.nav-item{
		width:100%;
		text-align:center;
		padding-top:8px;
		padding-bottom:8px;
	}
	.nav-item.active{
		position:static;
		bottom:0px;
		border-bottom:none !important;
	}

}
@media(min-width:561px) and (max-width:768px){
	.nav-list-toggle{
		margin-right:30px !important;
	}
}  

/* HOMEPAGE */
.home-panel {
	margin-left:auto;margin-right:auto;
	margin-top:82px;
	width:100%;
	height:500px;
	max-width:1600px;
	background-size:auto 650px,cover,cover;
	background-repeat:no-repeat,repeat, no-repeat;
	background-position:50% -100px,center,center;
	display:block;
	position:relative;
}
.home-panel .textHolder {
	position:absolute;
	top:0px;
	left:0px;
	display: table; 
	max-width:1600px;
	width:100%;
	height:500px;
}
.home-panel h1 {
	display: table-cell; 
	vertical-align: middle; 
	text-align: center; 
	color:white;
	text-transform:uppercase;
	font-size:3.5em;
	font-weight:normal;
}

@media (min-width:469px) and (max-width:768px){ 
	.home-panel h1 {
		font-size:2.5em !important;
	}
	
	.home-panel {
		margin-top:12px;
		width:100%;
		height:300px;
		background-size:auto 360px,cover,cover;
		background-position:50% -50px,center,center;
		display:inline-block;
	}
	.home-panel .textHolder {
		height:300px;
	}
}
@media (max-width:468px){
	.home-panel h1 {
		font-size:2.2em !important;
	}
	
	.home-panel {
		margin-top:12px;
		width:100%;
		height:300px;
		background-size:auto 360px,cover,cover;
		background-position:50% -50px,center,center;
		display:inline-block;
	}
	.home-panel .textHolder {
		height:300px;
	}
}
.bodyCopy {
	text-align:center;
	margin-top:20px;
}

.bodyCopy h2 {
	font-family: "proxima-nova",sans-serif;
	color: #990000;
	font-size:1.4em;
	font-weight:bold;
	text-decoration:none;
}

/* SLIDE NAV */
.slide-nav {
	width:100%;
	max-width: 1250px;
	margin-left:auto;
	margin-right:auto;
}

.nav-slide {
	display:block;
}
@media(min-width:1150px){
	body { font-size:1em; }
	.nav-slide {
		width:365px;
		height:205px;
	}
	.nav-slide .textHolder {
		width:365px;
		height:205px;
	}
}
@media(min-width:769px) and (max-width:1149px){
	body { font-size:1em; }
	.nav-slide {
		width:345px;
		height:195px;
	}
	.nav-slide .textHolder {
		width:345px;
		height:195px;
	}
}
@media (min-width:535px) and (max-width:768px){

	.nav-slide {
		width:254px;
		height:160px;
	}
	.nav-slide .textHolder {
		width:254px;
		height:160px;
	}
}
@media (min-width:330px) and (max-width:534px){

	.nav-slide {
		width:325px;
		height:185px;
	}
	.nav-slide .textHolder {
		width:325px;
		height:185px;
	}
}
@media (max-width:330px){

	.nav-slide {
		width:280px;
		height:165px;
	}
	.nav-slide .textHolder {
		width:280px;
		height:165px;
	}
}
.nav-slide {
	margin-left:auto;
	margin-right:auto;
	display:block;
	background-size:cover, cover;
	background-position:center,center;
	background-repeat:no-repeat,no-repeat;

	text-align:center;
	position:relative;
}
.nav-slide .textHolder {
	position:absolute;
	top:0px;
	left:0px;
	display: table;
}
.nav-slide h3 {
	padding-left:20%;
	padding-right:20%;
	font-size:1.3em;
	font-weight:normal;
	text-transform:uppercase;
	display: table-cell; 
	vertical-align: middle; 
	text-align: center; 
	color:white;
}
.nav-slide .arrow-right {
	position:absolute;
	bottom:0px;
	right:0px;
	width:55px;
	height:55px;
	background:url("/wp-content/themes/spwm/img/arrow-16x27px.png") no-repeat center center, #990000;
	background-size:14px;
}
.slick-dots {
	bottom:-55px !important;
}
.slick-dots li button {
    background: url("/wp-content/themes/spwm/img/dots-off.png") !important;
	background-size:contain !Important;
    text-indent: -9999px;
    overflow:hidden;
    /* more CSS */
}
.slick-dots li.slick-active button {
    background: url("/wp-content/themes/spwm/img/dots-on.png") !important;
	background-size:contain !Important;
    text-indent: -9999px;
    overflow:hidden;
}


/* CONTENT PAGE */
.content-panel {
	margin-top:82px;
	width:100%;
	height:300px;
	max-width:1600px;
	background-size:auto 650px,cover,cover;
	background-repeat:no-repeat,repeat, no-repeat;
	background-position:50% -180px,center,center;
	display:block;
	margin-left:auto;
	margin-right:auto;
	position:relative;
}
.content-panel .textHolder {
	position:absolute;
	top:0px;
	left:0px;
	display: table; 
	max-width:1600px;
	width:100%;
	height:300px;
}
.content-panel h1 {
	display: table-cell; 
	vertical-align: middle; 
	text-align: center; 
	color:white;
	text-transform:uppercase;
	font-size:3em;
	font-weight:normal;
}
@media (max-width:768px){
	.content-panel h1 {
		font-size:2em !important;
	}
}

.footer {
	margin-top:80px;
	background-color:#990000;
	width:100%;
	max-width:1600px;
	height:auto;
	margin-left:auto;
	margin-right:auto;
	text-align:center;
	padding-top:30px;
	padding-bottom:30px;
}

.footer .facebook {
	margin-right:20px;
}

.footer .link a {
	text-transform:uppercase;
	font-weight:bold;
	font-size:0.7em;
	display:block;
	margin-top:30px;
	color:white;
	text-decoration:none;
}

.expandingTitle {
	position:absolute;
	top:0;
	left:0;
	height:auto;
	display:inline-block;
	width:100%;
	background-color:#e7eaf3;
}
@media (min-width:769px)
{
	.expandingTitle
	{
		line-height:50px;
	}
	.expandingSection {
		position:relative;
		padding: 60px 40px 10px 40px;
	}
}
@media (max-width:768px)
{
	.expandingTitle
	{
		line-height:auto;
		min-height:50px;
	}
	.expandingTitle h3 {
		
		padding-top:12px;
		padding-bottom:12px;
	}
	.expandingSection {
		position:relative;
		padding: 60px 14px 10px 14px;
	}
}
.expandingSection.open {
	background-color:#f3f4f9;
}
.expandingSection.open .expandingBody {
	display:inline-block;
	width:100%;
}
.expandingBody {
	display:none;
	padding-top:20px;
}
.expandingTitle h3 {
	cursor:pointer;
	position:static;
	padding-left:70px;
	top:0px;
	margin-top:0px;
	margin-bottom:0px;
	color: #990000;
	font-size:1.2em;
}
.expander {
	position:absolute;
	left:0px;
	top:0px;
	background:url("/wp-content/themes/spwm/img/arrow-16x27px.png") no-repeat center center, #990000;
	width:50px;
	height:50px;
	background-size:14px;
	-webkit-transform: rotate(90deg);
	transform: rotate(90deg);
}
.expandingSection.open .expander {
	-webkit-transform: rotate(270deg) !important;
	transform: rotate(270deg) !important;
}

.repeating-content h3, 
.repeating-content h4,
.repeating-content h5
{
	margin-top:0px;
	color: #900;
	font-family: "proxima-nova",sans-serif !important;
}

.repeating-content h3 {
	font-size:1.3em;
}
.expandingBody h3 {
	font-size:1em;
}

.repeating-content h4,
.repeating-content h5 {
	font-size:1em;
}

.repeating-content {
	width:100%;
	max-width:1200px;
	margin-left:auto;
	margin-right:auto;
}

.contentGrid {
	margin-top:40px;
	margin-bottom:40px;
	max-width:1200px;
	width:100%;
	margin-left:auto;
	margin-right:auto;
	display:grid;
	grid-column-gap:15px;
	font-size:1.1em;
}

.logoGridItem { 
	padding:0 15px;
}
.logoGrid img{
	width:100%;
	grid-column-gap:0px;
}


@media (min-width:800px) 
{
	.contentGrid {
		grid-template-columns: 5fr 5fr;
	}
	.logoGrid{
		grid-template-columns: 1fr 1fr 1fr 1fr;
	}
}
@media (max-width:799px) 
{
	.contentGrid {
		grid-template-columns:1fr;
	}
	.logoGrid{
		grid-template-columns: 1fr 1fr;
	}
}

.contentEvenGrid {
	margin-top:40px;
	margin-bottom:40px;
	max-width:1200px;
	width:100%;
	margin-left:auto;
	margin-right:auto;
	display:grid;
	grid-column-gap:15px;
	display:-ms-grid;
	font-size:1.1em;
	line-height:1.5em;
}
.contentEvenGrid p.icons { padding-top:40px; }

.contentEvenGrid p.icons img { max-height:40px; margin-right:10px; }

@media (min-width:800px) 
{
	.contentEvenGrid {
		grid-template-columns: 1fr 1fr;
		-ms-grid-columns:1fr 1fr;
	}
}
@media (max-width:799px) 
{
	.contentEvenGrid {
		grid-template-columns:1fr;
		-ms-grid-columns:1fr;
	}
}
.contentEvenGrid h3 {
	color:#900;
}

.contentGrid .contentImage img {
	width:100%;
}

ul { padding-left:20px; }
li { padding-bottom:20px; }

.contentGrid li a {
	text-decoration:none;
	color:#555;
	font-weight:bold;
}

.contentGrid p {
	margin-top:0px;
}

.productsTable table {
	border-collapse: collapse;
	width:100%;
	border-spacing: 0px;
}
.productsTable table td { border:1px solid #900; padding:10px; }

.productsTable .tableTitle {
	background-color:#900;
	text-transform:uppercase;
	color:white;
	font-weight:bold;
	font-size:1em;
}

.productsTable .tableSubtitle {
	background-color:#fff1f1;
	text-transform:uppercase;
	color:#900;
	font-size:0.9em;
	font-weight:bold;
}

.productsTable strong { color: #900; }

@media (max-width:900px)
{
	.productsTable table { min-width:900px; }
	.productsTable { overflow-x: scroll; }
}

.productsTable td {
	font-size:0.9em;
}

.form label {
	font-weight:bold;
	color:#900;
}

.form input , .form textarea { box-sizing:border-box;width:100%;border:1px solid #aaa; padding:12px; margin-top: 12px; }

.form input[type='submit'] {
	background-color:#900;
	border:0;
	padding:14px;
	width:160px;
	color:white;
	text-transform:uppercase;
	font-size:1em;
}

.wpcf7-response-output {
	margin: 0 0 0 0px !Important;
    padding: 12px !Important;
    border-color: #900 !Important;
}
.wpcf7-not-valid-tip {
	padding-top:12px !Important;
	color: #900 !Important;
}
.wpcf7-not-valid {
	background-color:#fff1f1;
}



.footer a { color:#fff;text-decoration:underline; }
.footer a:hover { color:#213b7c; }