@charset "UTF-8";


/* RESET 
------------------------------------------------*/
* {margin:0; padding: 0; border: 0; outline: 0; background: transparent;}
	
html {scroll-behavior: smooth;}

/* GLOBAL SITE FRAMEWORK
------------------------------------------------*/
body {font-size:100%; letter-spacing: .065em; font-family: "owners", sans-serif !important; color:#34343a; background:#fff;}


/* SELECTION */	
::selection {color:#fff; background: #0271be;}
::-moz-selection {color:#fff; background: #0271be;}


/* CLEAR */
.clear {clear: both;}

/* HEADERS */
/*Remove or simplify font-weight and font-height */
h1, h2, h3, h4 ,h5 ,h6 {line-height: normal;}
h1 {font-size:26px; font-weight:normal;}
h2 {font-size:24px; font-weight:normal;}
h3 {font-size:20px; font-weight:normal;}
h4 {font-size:18px; font-weight:normal;}
h5 {font-size:16px; font-weight:normal;}
h6 {font-size:14px; font-weight:normal;}


/* PARAGRAPH/LIST/GENERAL TEXT */

/* LINKS */
a{-webkit-transition:.5s ease-in; -moz-transition:.5s ease-in; -o-transition:.5s ease-in; transition:.5s ease-in;}
a:link, a:visited {color:inherit; text-decoration:none;}
a:hover, a:active {color:inherit; text-decoration:none;}

a[href^="tel:"] {color:inherit;  text-decoration: none;}

/* IMAGES */
img {display:block;}

/* TEXT EMPHASIS */
em {font-style:italic;}
strong {font-weight: 700;}

/* TEXT STYLINGS */
.dark {color:#131313;}
.gray {color:#4F4F4F;}
.heavy {font-weight:800;}

/* ALIGNMENT */
.left {float:left;}
.right {float:right;}
.center {text-align:center;}


.fa-reverse {transform: scaleX(-1);}


a.blue-button {
	display:inline-block; padding:20px 25px; font-weight:500; color:#fff; border-radius:40px; background:#0271be; transition:.35s ease-in;}
a.blue-button i {margin:0 0 0 8px;}
a.blue-button:hover {background:#323746; /*transform: scale(1.05);*/}


a.outline-blue-button {display:inline-block; padding:20px 25px; font-weight:500; color:#0271be !important; border-radius:40px; border:1px #0271be solid;}
a.outline-blue-button:hover {color:#0271be !important; border:1px #0271be solid; background:#e9edef75;}


a.outline-pill-button {display:inline-block; margin:5px; padding:15px 40px; font-size:20px; line-height:1; font-weight:500; color:#232323 !important; border-radius:30px; border:1px #232323 solid;}
a.outline-pill-button strong {font-weight:800; }
a.outline-pill-button:hover {color:#0271be !important; border:1px #0271be solid; background:#e9edef75;}




#btt-button {display: none;position: fixed; z-index:110;  right: 30px;  bottom: 20px;  border: none; outline: none;  cursor: pointer;}
#btt-button i {margin:0 0 8px 0; padding:10px 11px; font-size:24px; color:#fff; border-radius: 30px; background:#0271be; transition:.35s ease-in;}
#btt-button:hover i{background: #323746;}



/* HEADER UPPER
------------------------------------------------*/	
.head-upper {display:flex; flex-flow:row wrap; align-items:center; justify-content: space-between; padding:.75rem 0; background:#0271be;}	

.head-contact {margin: 0 0 0 5%; font-weight:500; color:#fff;}
.head-contact a:nth-of-type(n+2) {margin: 0 0 0 2.5rem;}


/*  NAVIGATION
------------------------------------------------*/
#menu-button{display:none;}
nav.mobile {display:none;}

nav.primary {z-index:500; position:relative; margin:0; padding:0;}

nav.primary ul {display:flex; flex-flow:row wrap; align-items:center; justify-content:space-around; margin:0; padding:0;}
nav.primary ul li {margin:0; padding:0; list-style-type:none; }
				
nav.primary ul li a {
	display:block; margin:0; padding:10px; font-size:18px; line-height:1; font-weight:600; text-align:center; text-decoration:none; text-transform:uppercase; color:#f7f7f7; transition:.5s ease-in; cursor: pointer;	
}	

nav.primary ul li a:hover {color:#121212;}

/*  SUB NAV
------------------------------------------------*/
nav.primary ul li li {width: auto;}
nav.primary ul li li a:link, nav.primary ul li li a:visited{
	 padding:18px 45px 18px 35px; font-size:.94em; line-height:18px; text-align:left; color:#fff; border:0; background: #00528a;
}

nav.primary ul li li a:hover,nav.primary ul li li a:active {color:#fff; background:#087ecf;}

nav.primary ul li li:last-of-type a {border-bottom-left-radius:1px; border-bottom-right-radius:25px;}

/*  NAV DROPDOWNS
------------------------------------------------*/
nav.primary ul ul {display: none; position: absolute;} 
nav.primary ul ul ul {position: absolute; left: 100%; top:0;}
nav.primary ul li:hover > ul {display: block; line-height:18px; z-index: 500; padding:4px 0 0 0;}
nav.primary ul ul li {float: none; position: relative; margin:0;}







/* HEAD LOWER
------------------------------------------------*/	
.head-lower {display:flex; flex-flow:row wrap; align-items:center; justify-content: space-between; padding:1rem 4.5%; background:#cfd4e3;}

.hero .head-lower {position:absolute; top:0; z-index: 5; width:100%; padding:2rem 6.75%;  box-sizing: border-box; background:transparent; /*background:rgba(255,255,255,.5);*/}


/* LOGO
------------------------------------------------*/	
.head-logo {width:130px;height:109px;}
.head-logo img {width:100%; height:100%;}	
/*.head-logo .st0, .head-logo .st1 {fill: #323746;}
.head-logo .st1 {fill-rule: evenodd;}*/

.hero .head-logo {width:239px; height:200px; /*height:147px; filter: grayscale(100%) invert(0%) brightness(450%);*/}



/* CATEGORIES
------------------------------------------------*/	
.head-categories {font-size:20px; line-height:1; font-weight:600; text-transform:uppercase; color:#323746;}
.head-categories a {margin:0 10px}
.head-categories a:first-of-type {margin-left: 0;}
.head-categories a:last-of-type {margin-right: 0;}

.hero .head-categories {font-size:23px; color:#fff;}
.hero .head-categories a {margin:0 18px}



/*  HERO
------------------------------------------------*/	
.hero {position:relative; overflow:hidden; height:0; padding:0 0 42.5% 0; color:#fff; background:#00192b;}
.hero::after {content:''; position:absolute; z-index:2; top:0; right:0; width: 100%; height:100%; background: rgba(99, 105, 125, 0.3);
background: linear-gradient(55deg, rgba(99, 105, 125, 0.3) 0%, rgba(50, 55, 70, 0.3) 100%);}

.hero .hero-vid-full {display:block; margin:-11% 0 0 0;}
.hero .hero-vid-mid {display:none;}

.hero video {position:relative; z-index:1; width:100%; height:100%;}
/*position: absolute; z-index: 1; top: 0; left: 0; width: 100%; height: 100%;*/



.hero-overlay {position:absolute; top:70%; left:35.5%; transform: translate(-50%,-60%); z-index:5; width:92.5%; max-width:970px;}

.hero-title {margin:0 0 20px 0; font-size:65px; font-weight:500; text-transform: uppercase;}
.hero-title span {font-weight:800;}
.hero-subtitle {margin:0 0 40px 0; font-size:45px; font-weight:300; text-transform: uppercase;}








/*  CATEGORIES SECTION
------------------------------------------------*/	
.category-section {display:flex; flex-flow:row wrap; align-items:center; justify-content:center; margin:8rem 0 0 0;}

.category-title {position:relative; z-index:1; width:100%; margin:0 0 1rem 5%; font-size: calc(16px + 2.3vw); font-weight:800; text-transform:uppercase; color:#0271be;}
.category-title::before {content:'Reliable Equipment'; position:absolute; z-index: -1; top: -.5em; left: -.35em; font-size:1.1em; font-weight:800; color:#eef0f2;}

.category-section .category-item {position:relative; overflow: hidden; width:32.6%; height:300px; margin:.3%; color:#fff; background-color:#323746; /*background-size:105%;*/ transition:.5s ease;}
.category-section .category-item::after {position:absolute; z-index:1; content:''; width:100%; height:100%; background:rgba(50, 55, 70, .47); transition:.85s ease;}

.cat-storage {background:url('/siteart/categories/storage-tanks-category.webp') no-repeat center; background-size: cover;}
.cat-sprayers {background:url('/siteart/categories/sprayers-category.webp') no-repeat center; background-size: cover;}
.cat-trailers {background:url('/siteart/categories/trailers-category.webp') no-repeat center; background-size: cover;}
.cat-tenders {background:url('/siteart/categories/tenders-category.webp') no-repeat center; background-size: cover;}
.cat-drones {background:url('/siteart/categories/drones-category.webp') no-repeat center; background-size: cover;}
.cat-peck {background:url('/siteart/categories/augers-category.webp') no-repeat center; background-size: cover;}
.cat-components {background:url('/siteart/categories/components-category.webp') no-repeat center; background-size: cover;}

.cat-overlay {position: absolute; z-index:2; bottom:18px; left:34px; transition:.5s ease;}
.cat-overlay::before{transition:.5s ease-in;}
.cat-title {font-size:40px; line-height:1.1; font-weight:700; text-transform: uppercase; text-shadow:5px 0 7px rgba(22,22,22,.15);}
.cat-brands {margin:0 0 0 .25rem; font-size:17px; line-height:1.1; font-weight:500; text-shadow:5px 0 7px rgba(22,22,22,.2);}


.category-section .category-item a {position: absolute; z-index:10; width:100%; height:100%;}
.category-section .category-item a::before{
	content: "\f061"; position: absolute; transform: rotate(-45deg); z-index:2; top:0; right:.25rem; font-size:3vw; color:rgba(255,255,255,0); transition:1.2s all;  font-family: FontAwesome;
}

.category-section .category-item:hover a::before{color:rgba(255,255,255,.5);}
.category-section .category-item:hover::after {background:rgba(50, 55, 70, .8); }
.category-section .category-item:hover .cat-overlay {left:24px;}
.category-section .category-item:hover .cat-overlay::before {content:'EXPLORE OUR'; position:absolute; z-index: -1; top:-1.2em; left:0; font-size:1.25em; font-weight:400; letter-spacing:1px; font-style:italic; color:rgba(255, 255, 255, .6);}





/*  COMPANY INTRO
------------------------------------------------*/	
.company-intro {flex:1;/*width:870px;*/ margin:0 7.5%; padding:5rem 0;}
.company-intro h1{position:relative; z-index:1; font-size: calc(16px + 3vw); font-weight:800; text-transform:uppercase; color:#0271be;}
.company-intro h1::before{content:'Who We Are'; position:absolute; z-index: -1; top: -.5em; left: -.35em; font-size:1.15em; font-weight:800; color:#e9edef;}
.company-intro p {font-size:20px; line-height:28px; font-weight: 300;}

.intro-contact i {color:#0271be;}
.intro-contact a {font-weight:500; color:#8e8e93;}
.intro-contact span {margin:0 3%; color:#0271be;}

.company-map {flex:1;}
.company-map iframe {width:100%; height:100%; min-height: 360px;}



/*  MAIN
------------------------------------------------*/	
.main {}
.home-main {display:flex; flex-flow:row wrap; /*align-items:center;*/ /*justify-content: space-between;*/margin:8rem 0;}
.inv-main {padding:45px 5%;}
.sub-main {/*max-width:1150px;*/ margin:0 auto; padding:85px 8.5%;}
.center-main {text-align: center;}

.main h1 {position:relative; z-index:1; margin:0 0 30px 0; font-size: calc(24px + 1.85vw); font-weight:800; text-transform:uppercase; color:#0271be; text-shadow:-.5em -.35em #e9edef75;}
.main h2 {position:relative; z-index:1; margin:0 0 20px 0; font-size:28px; font-weight:600; color:#323746; }

.inv-intro {margin:0 5% 15px 5%; text-align:center;}
.inv-intro h1 {position:relative; z-index:1; font-size:33px; font-weight:800; text-transform:uppercase; color:#0271be;}
.inv-intro p {margin:0 0 12px 0; font-size:18px; line-height:26px; font-weight: 300;}
.inv-intro a {margin:5px;}





.sub-main-section{margin:3.5% auto; padding:calc(10% + 60px) 8.5%;
	background:#fff; background: linear-gradient(359deg, rgba(255, 255, 255, 1) 5%, rgba(207, 212, 227, 1) 5.1%, rgba(207, 212, 227, 1) 95%, rgba(255, 255, 255, 0.66) 95.1%);
}
.sub-main-section:nth-of-type(1) {margin:0 auto 3.5% auto;}
.sub-main-section:nth-of-type(even){margin:0 auto; padding:5%; background: #fff;}

.sub-main-section h3 {position:relative; z-index:1; margin:0 0 15px 0; font-size:28px; font-weight:600; color:#323746;}

.product-aside {float: right; overflow:hidden; width:45%; margin:0 0 5% 5%; border-radius:4px; border-bottom-right-radius:80px; border-top-left-radius:60px; }
.product-aside img  {object-fit: contain; max-width:100%;}






.brand-highlight {display:flex; flex-flow:row wrap; align-items:center; justify-content:space-around;}

.brand-highlight .brand-item {width: 30%;
  margin:3% 0 0 0;  padding:45px 0; border:2px #0271be solid; border-radius:4px; border-bottom-right-radius:40px; border-top-left-radius:30px; background:rgba(255,255,255,.5);} 

.brand-highlight .brand-logo {/*flex:0 1 20%;*/ /* width:25%;*/ margin:0 0 15px 0; padding:0 5%;}
.brand-highlight .brand-logo img { max-width:100%; margin:0 auto;}

.brand-highlight .brand-links {text-align: center;}
.brand-highlight .brand-links a {box-sizing:border-box; width:80%; margin:5px auto !important; text-align: center;}


/*  ARTICLE
------------------------------------------------*/
article {}
article.split-layout {display: flex; flex-flow:row wrap; justify-content: space-between; }
article p {font-size:22px; line-height:30px; font-weight: 300;}


/*  ABOUT PAGE
------------------------------------------------*/
.about-aside {float: right; overflow:hidden; width:45%; margin:0 0 5% 5%; border-radius:4px; border-bottom-right-radius:80px; border-top-left-radius:60px; }
.about-aside img  {object-fit: contain; max-width:100%;}


/*  CONTACT DETAILS
------------------------------------------------*/
.contact-details a{position:relative;  display:inline-block; margin:45px 0 45px 85px; font-size:22px; line-height:1; font-weight:300;}
.contact-details a:hover {color:#0271be;}

.contact-details a[href^="tel:"] {position:relative;}
.contact-details a[href^="tel:"]::before {
	content: "\f095"; position: absolute; z-index:2; top:-31px; left:-100px; width:85px; height:85px; transition:1.2s all;  
	font-size:30px; line-height:85px;  text-align: center; color:#fff; border-radius:85px; background:#0271be; font-family: FontAwesome;
}


.contact-details a[href^="mailto:"] {position:relative; }
.contact-details a[href^="mailto:"]::before {
	content: "\f0e0"; position: absolute; z-index:2;  top:-31px; left:-100px; width:85px; height:85px; transition:1.2s all;  
	font-size:30px; line-height:85px;  text-align: center; color:#fff; border-radius:85px; background:#0271be; font-family: FontAwesome;
}


.contact-details a[target="_blank"] {}
.contact-details a[target="_blank"]::before {
	content: "\f3c5"; position: absolute; z-index:2;  top:-31px; left:-100px; width:85px; height:85px; transition:1.2s all;  	
	font-size:30px; line-height:85px;  text-align: center; color:#fff; border-radius:85px; background:#0271be; font-family: FontAwesome;
}

.contact-details a:hover::before {background:#323746;}


/*  MAP WRAPPER - CONTACT PAGE
------------------------------------------------*/
.map-wrapper {overflow:hidden; width: 60%; border-top-right-radius:80px;}
.map-wrapper iframe {width:100%; height:100%;}


/*  SCROLLING INVENTORY
------------------------------------------------*/
.scrolling-wrap {width:100%; height:90px; overflow:hidden;}
.scrolling{width:100%; height:90px;}



/*  BRANDS SECTION
------------------------------------------------*/	
.brands-section {padding:5rem 0 5rem 0; background:#bec1ca; background: linear-gradient(354deg, rgba(255, 255, 255, 1) 45%, rgba(190, 193, 202, 1) 45.15%);}
.brands-heading {display:flex; flex-flow:row wrap; align-items:center; justify-content: space-between; padding:5rem 4.5% 2rem 4.5%;}
.brands-title {position:relative; z-index:1; font-size: calc(16px + 2vw); font-weight:700; text-transform:uppercase; color:#4c4c5a;}
.brands-title::before {content:'Product Lines'; position:absolute; z-index: -1; top: -.5em; left: -.35em; font-size:1.45em; font-weight:700; color:#ccd0d7;}


/*  BRAND SLIDER
------------------------------------------------*/
.brand-slideshow {overflow: hidden !important;  height:400px; }

.brand-slider {width:calc(97% - 96px); position:relative; margin:4rem calc(1.5% + 48px) 2.5% calc(1.5% + 48px);}

.brand-slider .prev, .brand-slider .next {position:absolute; top:0; bottom:0; width:48px; height:48px; margin: auto; color:#454752; transition:.85s ease-in-out; cursor:pointer;}
.brand-slider .prev {left:-48px; font-size:33px;text-align: center;}
.brand-slider .prev::before {content: "\f104"; position: absolute; z-index:2; top:3px; left:5px; font-size:28px; color:#9c9fab; transition:.5s ease-in-out; font-family: FontAwesome;}

.brand-slider .next {right:-48px; font-size:33px; text-align: center;}
.brand-slider .next:after {content: "\f105"; position: absolute; z-index:2; top:3px; right:5px; font-size:28px; color:#9c9fab; transition:.5s ease-in-out; font-family: FontAwesome;}
.brand-slider .prev img , .brand-slider .next img {width:20px; margin:0 auto;}

.brand-slider .prev:hover, .brand-slider .next:hover {color:#9c9fab;}
.brand-slider .prev:hover::before, .brand-slider .next:hover::after {color:#454752;}


.brand-slider .brand-item {
	max-width:390px; min-width:200px; height:292px; border-top-left-radius:30px; border-top-right-radius:2px; border-bottom-right-radius:45px; border-bottom-left-radius:2px;
	margin:0 15px; width:100%;
}

.hitchdoc-slide {background: #e82337; background: linear-gradient(348deg, rgba(232, 35, 55, 1) 45%, rgba(35, 35, 35, 1) 45.3%);}
.patriot-slide {background: #4a4a4a; background: linear-gradient(348deg, rgba(74, 74, 74, 1) 45%, rgba(245, 242, 242, 1) 45.3%);}
.meridian-slide {background: #4a4a4a; background: linear-gradient(348deg, rgba(198, 28, 41, 1) 45%, rgba(255, 255, 255, 1) 45.3%);}
.enduraplas-slide {background: #00aea9; background: linear-gradient(348deg, rgba(0, 174, 169, 1) 45%, rgba(243, 243, 243, 1) 45.3%);}
.demco-slide {background: #ad172b; background: linear-gradient(348deg, rgba(173, 23, 43, 1) 45%, rgba(249, 249, 249, 1) 45.3%);}
.bb-slide {background: #b4051f; background: linear-gradient(348deg, rgba(180, 5, 31, 1) 45%, rgba(229, 229, 229, 1) 45.3%);}
.behnke-slide {background: #b4051f; background: linear-gradient(348deg, rgba(180, 5, 31, 1) 45%, rgba(229, 229, 229, 1) 45.3%);}
.duolift-slide {background: #005dab; background: linear-gradient(348deg, rgba(0, 93, 171, 1) 45%, rgba(4, 4, 4, 1) 45.3%);}
.xag-slide {background: #161616; background: linear-gradient(348deg, rgba(22, 22, 22, 1) 45%, rgba(250, 250, 250, 1) 45.3%);}
.dji-slide {background: #272727; background: linear-gradient(348deg, rgba(39, 39, 39, 1) 45%, rgba(229, 229, 229, 1) 45.3%);}
.eavision-slide {background: #289ceb; background: linear-gradient(348deg, rgba(40, 156, 235, 1) 45%, rgba(247, 248, 249, 1) 45.3%);}
.terremax-slide {background: #ffce25; background: linear-gradient(348deg, rgba(255, 206, 37, 1) 45%, rgba(10, 10, 10, 1) 45.3%);}
.fs-slide {background: #ffe701; background: linear-gradient(348deg, rgba(255, 231, 1, 1) 45%, rgba(202, 202, 202, 1) 45.3%);}
.banjo-slide {background: #fedc00; background: linear-gradient(348deg, rgba(254, 220, 0, 1) 45%, rgba(250, 250, 250, 1) 45.3%);}
.peck-slide {background:#BF2324; background: linear-gradient(348deg, rgba(191, 35, 36, 1) 45%, rgba(250, 250, 250, 1) 45.3%);}


.brand-slider .brand-logo {padding:8px; text-align:center;}
.brand-slider .brand-logo img {width:100%; max-width:215px; margin:0 auto 5px auto;}

.brand-slider .brand-equipment {margin:-25px 0 0 0;}
.brand-slider .brand-equipment img {width:100%; max-width:346px; margin:0 auto; padding:5px 0;}

.brand-slider .brand-cat-description {font-size:18px; font-weight:300; color:#8e8e93;}

.brand-slider .cycle-pager {width:auto; position: absolute; right:0; bottom:-65px; z-index: 500; overflow: hidden; text-align: center;}
.brand-slider .cycle-pager span {display: inline-block; width:50px; height:8px; margin:0 8px; font-size:0; color:#e9edef; background:#e9edef; cursor: pointer;}

.brand-slider .cycle-pager span.cycle-pager-active {color:#0271be; background:#0271be;}
.brand-slider .cycle-pager > * {cursor: pointer;}


/*  CONTACT SECTION
------------------------------------------------*/
.contact-section {
	display:flex; flex-flow:row wrap; align-items:center;
	padding:5rem 0 8rem 7.5%;
	background: #0271BE; background: linear-gradient(354deg, rgba(2, 113, 190, 1) 29%, rgba(255, 255, 255, 1) 29.1%);
}

.contact-section-body {flex:1; margin: 0 7.5% 0 0;}

.contact-title {position:relative; z-index:1; margin:0 0 1.5rem 0; font-size: calc(16px + 2.2vw); font-weight:600; text-transform:uppercase; color:#3394d7;}
.contact-title::before {content:'Taking Care of You'; position:absolute; z-index: -1; top: -.5em; left: -.35em; font-size:1.15em; font-weight:600; color:#e9edef;}

.contact-section p {margin:0 0 2rem 0; font-size:20px; line-height:28px; font-weight: 300; color:#34343a;}

.contact-section-aside {overflow:hidden; flex:1; margin: 0 0 0 auto; border-top-left-radius: 100px; border-bottom-left-radius:100px;}
.contact-section-aside video, .contact-section-aside img {width:100%; height:auto;}
.contact-section-aside .csa-desktop {display:block;}
.contact-section-aside .csa-mobile {display:none;}



/*  FOOTER
------------------------------------------------*/
.site-footer {box-sizing: content-box; width:93%; padding:5.25rem 3.5%; background:#323746;}
.foot-logo {width: 279px; margin:0 auto; filter: grayscale(100%) invert(100%) brightness(500%);}
.foot-contact {margin:1.5rem 0 0 0; text-align:center;}
.foot-contact a{font-size:20px; font-weight: 700; color:#e5e5ee; }
.foot-copyright {margin:3.75rem 0 0 0; font-size:18px; font-weight:400;  text-align: center; color:#fff;}




/************************************************ Responsive Styles **/


@media screen and (max-width: 1500px) {
	.hero-overlay {max-width:720px;}
	.hero-title {margin: 0 0 10px 0; font-size: 45px;}
	.hero-subtitle {margin: 0 0 30px 0; font-size: 30px;}
}

@media screen and (max-width: 1400px) {
	nav.primary ul li a {padding:10px 8px; font-size: 16px;}
	
	.hero .head-lower {padding:2rem 5%;}
	
	.head-logo {width:130px;height:109px;}
	.hero .head-logo {width:175px;height:146px;}
	
	.head-categories {font-size:20px;}
	.head-categories a {margin:0 10px}
	.hero .head-categories {font-size:18px;}
	.hero .head-categories a {margin:0 8px}
}

@media screen and (max-width: 1350px) {
	nav.primary{display:none;}
	#menu-button{display:block;  line-height:1; position: relative; z-index:400; cursor:pointer;}
	#menu-button a{display: inline-block; padding:.75rem 1rem; font-size: 1.25em; text-decoration: none; font-weight:600; color:#fff; border:1px #8bafc7 solid; border-radius:3px; }
	
	nav.mobile ul li a .fa{
		width:25px;
		font-weight:100;
		padding:8px 3px;
		margin:0 0 0 5px;
		text-align:center;
		background:#292929;
		-webkit-border-radius: 30px;
		-moz-border-radius: 30px;
		border-radius: 30px;
		text-shadow: 1px 1px 1px rgba(0,0,0,0.3);
	}
	
	nav.mobile ul li .fa-chevron-down {position:absolute; right:10px; margin:18px 0 0 0;}

	nav.mobile {
		display:block;
		position: fixed;
		top: 0;
		left: -285px;
		width: 285px;
		height: 100%;
		z-index: 500;
		overflow:auto;
		padding-bottom:40px;
		background:#333;
	}
	
	/* MENU HEADER SOCIAL MEDIA */
	nav.mobile .social-media {
		position: absolute;
		text-decoration: none;
		vertical-align: top;
		z-index:9999;
		display: inline-block;
		
		top: 15px;
		left: 15px;
		font-size:16px;
		word-spacing:13px;
		color: #ccc !important;
	}
	
	nav.mobile .social-media a:link, nav.mobile .social-media a:visited {color:#ccc; text-decoration:none;}
	nav.mobile .social-media a:hover, nav.mobile .social-media a:active {color:#fff; text-decoration:underline;}
	
	/* MENU HEADER STYLES */
	nav.mobile .menu-header {	
		color: #ccc;
		padding: 23px 0;
		position: relative;
		font-size: 18px;
		background:#313131;
	}			
	nav.mobile .menu-title {position: absolute; vertical-align: top; top: 16px; right: 47px; text-transform:uppercase; font-size:12px; color: #ccc;}
		
	/* MENU CLOSE 'X' BUTTON */
	nav.mobile .menu-toggle {position: absolute; top: 8px; right: 10px; padding: 6px 9px 5px; display: inline-block; font-weight: 700; font-size: 18px; line-height: 1; color: #ccc; text-decoration: none; vertical-align: top; cursor:pointer; font-family: Arial, sans-serif;}
	nav.mobile .menu-toggle:hover {color: #fff;}
	
	/* MENU LIST STYLE */
	nav.mobile ul {list-style: none; font-weight: 300; margin:0; padding:0;}
	nav.mobile ul li {color: #999; font-size:15px; border-bottom: 1px solid #303030;}
	
	/* FIRST LEVEL */
	nav.mobile ul li a {
		color: #999;
		position: relative;
		display: block;
		font-size:15px;
		text-align:right;
		cursor:pointer; 
		text-decoration: none;
		border-left:4px #333 solid;
		padding: 15px 35px 15px 20px;
		text-shadow: 1px 1px 1px rgba(0,0,0,0.3);
	}
	nav.mobile ul li a:hover {background:rgba(45,45,45,0.5); color: #fff; border-left:4px #0271be solid;}
	
	/* SECOND LEVEL */
	nav.mobile ul li li:last-child {border:none;}
	nav.mobile ul li li a {color: #ccc; background: #444; border-left:4px #444 solid; padding: 15px 10px 15px 15px;}
	nav.mobile ul li li a:hover {background:rgba(65,65,65,0.5);}
	
	/* THIRD LEVEL */
	nav.mobile ul li li li:last-child {border:none;}
	nav.mobile ul li li li a {color: #ccc; background: #555; border-left:4px #555 solid;}
	nav.mobile ul li li li a:hover {background:rgba(85,85,85,0.5);}	
}

@media screen and (max-width: 1250px) {
	nav.primary{display:none;}
	#menu-button{display:block;  line-height:1; position: relative; z-index:400; cursor:pointer;}
	#menu-button a{display: inline-block; padding:.75rem 1rem; font-size: 1.25em; text-decoration: none; font-weight:600; color:#fff; border:1px #8bafc7 solid; border-radius:3px; }
	
	nav.mobile ul li a .fa{
		width:25px;
		font-weight:100;
		padding:8px 3px;
		margin:0 0 0 5px;
		text-align:center;
		background:#292929;
		-webkit-border-radius: 30px;
		-moz-border-radius: 30px;
		border-radius: 30px;
		text-shadow: 1px 1px 1px rgba(0,0,0,0.3);
	}
	
	nav.mobile ul li .fa-chevron-down {position:absolute; right:10px; margin:18px 0 0 0;}

	nav.mobile {
		display:block;
		position: fixed;
		top: 0;
		left: -285px;
		width: 285px;
		height: 100%;
		z-index: 500;
		overflow:auto;
		padding-bottom:40px;
		background:#333;
	}
	
	/* MENU HEADER SOCIAL MEDIA */
	nav.mobile .social-media {
		position: absolute;
		text-decoration: none;
		vertical-align: top;
		z-index:9999;
		display: inline-block;
		
		top: 15px;
		left: 15px;
		font-size:16px;
		word-spacing:13px;
		color: #ccc !important;
	}
	
	nav.mobile .social-media a:link, nav.mobile .social-media a:visited {color:#ccc; text-decoration:none;}
	nav.mobile .social-media a:hover, nav.mobile .social-media a:active {color:#fff; text-decoration:underline;}
	
	/* MENU HEADER STYLES */
	nav.mobile .menu-header {	
		color: #ccc;
		padding: 23px 0;
		position: relative;
		font-size: 18px;
		background:#313131;
	}			
	nav.mobile .menu-title {position: absolute; vertical-align: top; top: 16px; right: 47px; text-transform:uppercase; font-size:12px; color: #ccc;}
		
	/* MENU CLOSE 'X' BUTTON */
	nav.mobile .menu-toggle {position: absolute; top: 8px; right: 10px; padding: 6px 9px 5px; display: inline-block; font-weight: 700; font-size: 18px; line-height: 1; color: #ccc; text-decoration: none; vertical-align: top; cursor:pointer; font-family: Arial, sans-serif;}
	nav.mobile .menu-toggle:hover {color: #fff;}
	
	/* MENU LIST STYLE */
	nav.mobile ul {list-style: none; font-weight: 300; margin:0; padding:0;}
	nav.mobile ul li {color: #999; font-size:15px; border-bottom: 1px solid #303030;}
	
	/* FIRST LEVEL */
	nav.mobile ul li a {
		color: #999;
		position: relative;
		display: block;
		font-size:15px;
		text-align:right;
		cursor:pointer; 
		text-decoration: none;
		border-left:4px #333 solid;
		padding: 15px 35px 15px 20px;
		text-shadow: 1px 1px 1px rgba(0,0,0,0.3);
	}
	nav.mobile ul li a:hover {background:rgba(45,45,45,0.5); color: #fff; border-left:4px #0271be solid;}
	
	/* SECOND LEVEL */
	nav.mobile ul li li:last-child {border:none;}
	nav.mobile ul li li a {color: #ccc; background: #444; border-left:4px #444 solid; padding: 15px 10px 15px 15px;}
	nav.mobile ul li li a:hover {background:rgba(65,65,65,0.5);}
	
	/* THIRD LEVEL */
	nav.mobile ul li li li:last-child {border:none;}
	nav.mobile ul li li li a {color: #ccc; background: #555; border-left:4px #555 solid;}
	nav.mobile ul li li li a:hover {background:rgba(85,85,85,0.5);}	
	
	.hero .hero-vid-full {display:none;}
	.hero .hero-vid-mid {display:block;}
	
	
	.category-section .category-item {width:49.4%; height: 250px; }
		
	.sub-main h1, .sub-main h2  {text-align:center;}

	.product-aside,
	.about-aside {float:none; width:85%; margin:25px auto 45px auto;}
	
	.contact-details {margin:0 auto;}
	.map-wrapper {width:85%; height: 350px; margin:4rem auto 0 auto;}
	
	.contact-section {padding:5rem 0 8rem 3.5%;}
	.contact-section-body {margin: 0 3.5% 0 0;}	
	.contact-title {position:relative; z-index:1; margin:0 0 1.5rem 0; font-size: calc(16px + 2.2vw); font-weight:600; text-transform:uppercase; color:#3394d7;}
	.contact-section p {margin:0 0 2rem 0; font-size:20px; line-height:28px; font-weight: 300; color:#34343a;}
	.contact-section-aside {overflow:hidden; flex:1; margin: 0 0 0 auto; border-top-left-radius: 100px; border-bottom-left-radius:100px;}
	.contact-section-aside video, .contact-section-aside img {width:100%; height:auto;}
	.contact-section-aside .csa-desktop {display:block; }
	.contact-section-aside .csa-mobile {display:none;}
}

@media screen and (max-width: 1135px) {
	.hero-overlay {max-width:570px;}
	.hero-title {font-size: 35px;}
	.hero-subtitle {margin: 0 0 20px 0; font-size:25px;}
}

@media screen and (max-width: 1024px) {
	
	.hero .head-lower {flex-flow:column;}
	.hero .head-logo {width:239px;height:200px;}
	
	.head-categories {font-size:16px;}
	.head-categories a {margin:0 7px}
	
	.hero {padding: 0 0 55.5% 0;}
	.hero .head-categories {margin:2rem 0 0 0;}
	
	.hero-overlay {max-width:none; top: 70%; left:50%; transform: translate(-50%, -50%);}
	.hero-subtitle {display:none;}

    
	
	.home-main {display:flex; flex-flow:column-reverse wrap; margin:8rem 0;}
	.company-intro h1{font-size: calc(16px + 5vw);} 
	.company-map {width:100%; height:425px;}
	.brands-title {font-size: calc(16px + 3vw);}
	.contact-section {flex-flow:column; padding:5rem 0 5rem 8.5%;}
	.contact-section-body {margin: 0 8.5% 5rem 0;}
	.contact-title {font-size: calc(16px + 4.2vw);}
	
	
	
	.sub-main-section{margin:5% auto; padding:8.5%;	background:#cfd4e3;}
	.sub-main-section:nth-of-type(even){padding:8.5%;}

	.brand-highlight .brand-item {width:48%; margin:30px 0 0 0;} 
}


@media screen and (max-width: 885px) {
	.head-categories {font-size:14px;}
	.head-categories a {margin:0 5px}
	.hero .head-categories {font-size:15px;}
	.hero-overlay {max-width:none; top: 77%; left:50%; transform: translate(-50%, -50%);}
	
	.category-section .category-item {width:99.7%; height: 200px;}
	
	
	.brands-heading {display: flex; flex-flow: column wrap; align-items: center; justify-content: center;}
	.brands-title {align-self:flex-start; margin:0 0 1rem 0;}
}

@media screen and (max-width: 768px) {
	.hero .hero-vid-mid {display:none;}
	.hero {/*height:700px;*/ padding: 0 0 100% 0;background:url("/siteart/videos/cornfield-mobile.webp") no-repeat center; background-size: cover;}
	.hero-overlay {max-width:none; top: 70%; left:50%; transform: translate(-50%, -50%);}
	
	.head-lower {flex-flow:column; padding:1.25rem 4.5%;}
	.head-categories {margin:1.5rem 0 0 0;}
	
	.contact-section {flex-flow:column; padding:5rem 0 3.5rem 8.5%;}
	
	.brand-slideshow {height:270px;}
	.brand-slider .brand-item {max-width:235px; height:235px; margin:0 10px;}
	.brand-slider .brand-logo img {width: 80%;}
	.brand-cat-description {display:none;}
	
	.contact-section-aside .csa-desktop {display:none;}
	.contact-section-aside .csa-mobile {display:block;}
	
	.brand-highlight .brand-item {width:98%; margin:30px 0 0 0;} 
}

@media screen and (max-width: 675px) {
	.hero .head-categories {display:none;}	
	.contact-title {font-size: calc(16px + 3.2vw);}
}

@media screen and (max-width: 585px){
	.head-contact {display: flex; flex-flow:row wrap; justify-content: space-evenly; margin:0 5%;}
	.head-categories {display:none;}
	.head-contact {box-sizing: border-box; width:100%; padding:0 0 2rem 0;  text-align:center;}
	#menu-button {margin:0 0 0 5%;}
	
	.category-title {font-size: calc(16px + 1.85vw);}
	.contact-title {font-size: 6.5vw;}
	.brands-title {font-size: 6vw;}
	
	.brand-slider {width:calc(96% - 96px);}
}

@media screen and (max-width: 485px){
	.hero-overlay {top: 78%;}
	.hero-title {font-size:24px;}
}

@media screen and (max-width: 400px){
	.hero-overlay {top: 85%; text-align: center;}
	.hero-title {display:none;}
	
	.brand-slider {width:97%; margin:4rem 1.5% 2.5% 1.5%;}
	.brand-slider .prev, .brand-slider .next {display: none;}
}

@media screen and (max-width: 320px){
	.head-contact a:nth-of-type(n+2) {margin: 0 0 0 1rem;}
	
}