@charset "UTF-8";


/* RESET 
------------------------------------------------*/
* {margin:0; padding: 0; border: 0; outline: 0; background: transparent;}
	

/* GLOBAL SITE FRAMEWORK
------------------------------------------------*/
body {/*margin:0; line-height:12px;*/ font-size:100%; font-family: fagun, sans-serif !important; background:#fff;}


/* SELECTION */	
::selection {color:#fff; background: #0e45b4;}
::-moz-selection {color:#fff; background: #0e45b4;}


/* 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;}




a.linkButtonBox {
	/*display:flex; flex-flow:row wrap; align-items:center; justify-content: space-between;*/ padding:12px 25px; font-size:1.15em; line-height:2.2; letter-spacing:.5px; font-weight:400; color:#fff; background:#0e45b4;
	-webkit-transition:.5s ease; -moz-transition:.5s ease; -o-transition:.5s ease; transition:.5s ease;
	-webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px;
	
	
	-webkit-animation: fade-in 1.2s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
	        animation: fade-in 1.2s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
}
a.redButtonBox {font-weight:500; color:#454545; background:#fbb315;}

a.linkButtonBox i {
	margin:0 8px 0 0; padding:8px; font-size:.95em; background:#d62822;
	-webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px;
}

a.linkButtonBox:hover {/*padding:12px 31px 12px 25px;*/ letter-spacing:1px; transform:scale(1.01,1.01);}
a.linkButtonBox:hover i {/*margin:0 2px 0 0; font-size:.95em;*/}



/*
	font-family: fagun, sans-serif;
	200 900 / Italic
*/




/* HEADER
------------------------------------------------*/	
.site-header {display:flex; flex-flow:row wrap; align-items:center; justify-content:space-between; padding:20px 3.5% 15px 3.5%; border-top:8px #0e45b4 solid; }	
	
/* LOGO
------------------------------------------------*/	
.logo {margin:0; width:410px;}	
.logo img {width:100%; max-width:410px;}


/*  SEARCH FORM
------------------------------------------------*/
.quickSearch {
	width:calc(93% - 759px); max-width:550px; margin:0 3.5%; border:2px #ebebeb solid;  background-color:#fdfdfd;
	-webkit-border-radius:2px !important; -moz-border-radius:3px !important; border-radius:3px !important;
}

/*  SEARCH FORM
------------------------------------------------*/
.search-form {display:flex; flex-flow:row wrap; align-items:center; justify-content:space-between; margin:0 auto; padding:0 10px;}

.search-form input[type="text"] {
	box-sizing: border-box; width:calc(100% - 42px) !important; height:44px !important; margin:0; padding:0 !important;
    font-size:1em !important; font-weight:300; font-style:italic;  color:#222 !important; border:none !important; background-color:#f9f9f9 !important; 
	-webkit-border-radius:2px !important; -moz-border-radius:2px !important; border-radius:2px !important;
	font-family: quasimoda, sans-serif;
}

.search-form button {
	display: inline-block; width:30px !important; height: 30px !important; padding: 0 6px!important;
    font-size: 14px; line-height: 30px; font-weight:900; color:#d62822 !important; border:none !important; background:transparent !important;
	font-family: "Font Awesome 5 Free"; cursor: pointer;
    -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;
    -moz-border-radius:0; -webkit-border-radius:0; -o-border-radius:0; -ms-border-radius:0; border-radius:0;
}


/*  HEADER CONTACT
------------------------------------------------*/
.headerContact a, .headerContact a[href^="tel:"] {font-size:1.25em; font-weight:200;color:#3f3f3f;
-webkit-animation: text-focus-in .45s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
	        animation: text-focus-in .45s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
}
.headerContact a i {margin:0 4px 0 0; color:#0e45b4;}
.headerContact a[href^="tel:"] {margin:0 0 0 45px;}
.headerContact a[href^="tel:"] i {color:#d62822;}

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

nav.primary {z-index:500; position:relative; margin:0; padding:0; border-top:1px #ebebeb solid;}

nav.primary ul {display:flex; flex-flow:row wrap; align-items:center; justify-content:space-around; max-width:950px; margin:0 auto;}
nav.primary ul li {margin:0; padding:0; list-style-type:none;}
				
nav.primary ul li a {
	display:block; margin:0 5px; padding:22px 5px; 
    font-size:1.125em; line-height:1; font-weight:200;  text-align:center; text-decoration:none; color:#161616; border-top:2px #fff solid;
	-webkit-transition:.5s ease-in; -moz-transition:.5s ease-in; -o-transition:.5s ease-in; transition:.5s ease-in;	
}	

nav.primary ul li a i {font-size:.6em; }

nav.primary ul li a:hover {color:#121212; border-top:2px #d62822 solid;}

/*  SUB NAV
------------------------------------------------*/
nav.primary ul li li {width: 250px;}
nav.primary ul li li a:link, nav.primary ul li li a:visited{
	width: 250px; padding:15px 0; font-size:.94em; line-height:18px; text-indent:20px; text-align:left; color:#fff; border:0; background:rgba(0,0,0,0.92);
}

nav.primary ul li li a:hover,nav.primary ul li li a:active {line-height:18px; color:#fff; background:#0e45b4;}

/*  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;}
nav.primary ul ul li {float: none; position: relative; margin:0;}

/*  HERO
------------------------------------------------*/	
.hero {
	position:relative; width:100%; height:640px; color:#fff;
	background:url("/siteart/hero/hero-excavator.jpg") no-repeat top center; background-size:cover;
	-webkit-clip-path: polygon(100% 0%, 100% 100%, 0% 80%, 0% 0%);
    		clip-path: polygon(100% 0%, 100% 100%, 0% 80%, 0% 0%);
}


.heroOverlay {position:absolute; top:45%; left:7.5%; transform: translateY(-45%); 
}
.heroTitle {
	font-size:4.15em; line-height:1; font-weight:800;
	-webkit-animation: slide-in-blurred-left 0.6s cubic-bezier(0.230, 1.000, 0.320, 1.000) both;
	        animation: slide-in-blurred-left 0.6s cubic-bezier(0.230, 1.000, 0.320, 1.000) both;
}
.heroText {
	max-width:850px; margin:8px 0 35px 0; font-size:1.75em; line-height:1.2; font-weight:200;
	-webkit-animation: slide-in-blurred-left 0.7s cubic-bezier(0.230, 1.000, 0.320, 1.000) both;
	        animation: slide-in-blurred-left 0.7s cubic-bezier(0.230, 1.000, 0.320, 1.000) both;
}
.heroContact {
	font-size:1.6875em; font-weight:700; text-transform:uppercase;
	-webkit-animation: slide-in-blurred-left 0.8s cubic-bezier(0.230, 1.000, 0.320, 1.000) both;
	        animation: slide-in-blurred-left 0.8s cubic-bezier(0.230, 1.000, 0.320, 1.000) both;
}

/*  SUB HERO
------------------------------------------------*/	
.subHero {
	position:relative; width:100%; height:300px; color:#fff; background:#0e45b4;
	-webkit-clip-path: polygon(100% 0%, 100% 100%, 0% 92%, 0% 0%);
    		clip-path: polygon(100% 0%, 100% 100%, 0% 92%, 0% 0%);
}

.subOverlay {display:inline-block; position:absolute; z-index:5; top:45%; left:50%; transform: translate(-50%, -50%);}
.subTitle {
	position:relative; font-size:4.15em; line-height:1; font-weight:600; text-align: center; text-transform:uppercase;
	-webkit-animation: slide-in-blurred-top 0.65s cubic-bezier(0.230, 1.000, 0.320, 1.000) both;
	        animation: slide-in-blurred-top 0.65s cubic-bezier(0.230, 1.000, 0.320, 1.000) both;
}
.subTitle:after {
	content:''; position:absolute; right:0; bottom:-13px; left:0; width:120px; height:4px; margin:auto;  background:#d62822;
	-webkit-animation: slide-in-blurred-top 0.7s cubic-bezier(0.230, 1.000, 0.320, 1.000) both;
	        animation: slide-in-blurred-top 0.7s cubic-bezier(0.230, 1.000, 0.320, 1.000) both;
}

.subGradient {
	position:absolute;z-index:2; width:100%; height:100%;
	background: rgb(14,69,180); background: linear-gradient(132deg, rgba(14,69,180,0.85) 0%, rgba(8,56,153,.95) 100%);
}

.transportHero {background:url("/siteart/subHero/transport.jpg") no-repeat center center; background-size:cover; }
.serviceHero {background:url("/siteart/subHero/service.jpg") no-repeat center center; background-size:cover; }
.aboutHero {background:url("/siteart/subHero/about-us.jpg") no-repeat center center; background-size:cover; }
.contactHero {background:url("/siteart/subHero/contact-us.jpg") no-repeat center center; background-size:cover; }
.thankyouHero {background:url("/siteart/subHero/thankyou.jpg") no-repeat center center; background-size:cover; }


/*  BRAND SLIDER
------------------------------------------------*/	
.brandSlider {
	margin:-118px 0 0 0; width:100%; height:440px; background:#0e45b4 url("/siteart/brands-bg.jpg") no-repeat center; background-size:cover; 
	-webkit-clip-path: polygon(100% 29%, 100% 100%, 0% 71%, 0% 0%);
    		clip-path: polygon(100% 29%, 100% 100%, 0% 71%, 0% 0%);
}

.brandSlider .cycle-slideshow {top:50%; transform: translateY(-50%); display:flex; flex-flow:row wrap; align-items:center; justify-content:space-around;}
.brandSlider .cycle-slideshow a {margin:0 1%;}
.brandSlider .cycle-slideshow img {width:200px;}


/*  CATEGORY SELECT/  HEX GRID
------------------------------------------------*/	
.categorySelect {margin:5% 0;}

.hexGrid {overflow: hidden;display:flex; flex-wrap: wrap; width: 96%; margin: 0 auto; list-style-type: none;}

.hex {
  position: relative;
  visibility:hidden;
  outline:1px solid transparent;
  backface-visibility: hidden;
  will-change: transform;
  transition: all 0.5s;
}
.hex::after{
  content:'';
  display:block;
  padding-bottom: 86.602%;  /* =  100 / tan(60) * 1.5 */
}
.hexIn{
  position: absolute;
  width:96%;
  padding-bottom: 110.851%; /* =  width / sin(60) */
  margin: 2%;
  overflow: hidden;
  visibility: hidden;
  outline:1px solid transparent;
  -webkit-transform: rotate3d(0,0,1,-60deg) skewY(30deg);
      -ms-transform: rotate3d(0,0,1,-60deg) skewY(30deg);
          transform: rotate3d(0,0,1,-60deg) skewY(30deg);
    transition: all 0.5s;
}
.hexIn * {
	position: absolute;
	visibility: visible;
	outline:1px solid transparent;
}
.hexLink {
    display:block;
    width: 100%;
    height: 100%;
    text-align: center;
    color: #fff;
    overflow: hidden;
    -webkit-transform: skewY(-30deg) rotate3d(0,0,1,60deg);
        -ms-transform: skewY(-30deg) rotate3d(0,0,1,60deg);
            transform: skewY(-30deg) rotate3d(0,0,1,60deg);
}

img.catIcon {
	width: auto; max-width:126px; height:auto; max-height:93px; right: -100%; bottom:48%; left: -100%; margin: 0 auto; padding-top:50%;
	
	-webkit-animation: tracking-in-expand-fwd-top 0.8s cubic-bezier(0.215, 0.610, 0.355, 1.000) both;
	        animation: tracking-in-expand-fwd-top 0.8s cubic-bezier(0.215, 0.610, 0.355, 1.000) both;
}

.hex h3 {
	right:5%; left:5%; padding-top:63%; margin:auto;
	z-index: 1; font-size:1.5vw; font-weight:700; line-height:1.2; text-transform:uppercase; text-align: center; color:#fff;
	-webkit-animation: tracking-in-contract-bck-bottom 1s cubic-bezier(0.215, 0.610, 0.355, 1.000) both;
	        animation: tracking-in-contract-bck-bottom 1s cubic-bezier(0.215, 0.610, 0.355, 1.000) both;
}



.hexBG {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-position: center center;
  background-size: cover;
  overflow: hidden;
	-webkit-clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
    		clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
}

.hexBG:before, .hexBG:after {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  content: '';
  opacity: 0;
  transition: opacity 0.5s;
}
.hexBG:before {background: rgba(22, 103, 137, 0)}
.hexBG:after {background: linear-gradient(to top, transparent, rgba(0, 0, 0, 0.5), transparent);}





.dozers {background:url("/siteart/categories/dozers-category.jpg") no-repeat;}
.excavators {background:url("/siteart/categories/excavators-category.jpg") no-repeat;}
.long-reach {background:url("/siteart/categories/long-reach-excavators-category.jpg") no-repeat;}
.compaction {background:url("/siteart/categories/compaction-category.jpg") no-repeat;}
.off-highway {background:url("/siteart/categories/off-highway-trucks-category.jpg") no-repeat;}
.wheel-loaders {background:url("/siteart/categories/wheel-loaders-category.jpg") no-repeat;}
.pipelayers {background:url("/siteart/categories/pipelayers-category.jpg") no-repeat;}
.crawler-trucks {background:url("/siteart/categories/crawler-trucks-category.jpg") no-repeat;}
.compact-track {background:url("/siteart/categories/compact-track-loaders-category.jpg") no-repeat;}
.forklifts {background:url("/siteart/categories/forklifts-category.jpg") no-repeat;}
.light-plants {background:url("/siteart/categories/light-plants-category.jpg") no-repeat;}




.hexIn:hover .hexBG:before,
.hexIn:hover .hexBG:after,
.hexIn:hover .hexLink {opacity: 1;}





/*  HOME SECTION
------------------------------------------------*/	
.homeSection {
	margin:0 0 5% 0; width:100%; height:525px; background:#ededed;
	-webkit-clip-path: polygon(100% 0%, 100% 90%, 0% 100%, 0% 10%);
    		clip-path: polygon(100% 0%, 100% 90%, 0% 100%, 0% 10%);
}


/*  MAIN
------------------------------------------------*/	
.main {margin:4% 0 5% 0; padding:0 5%;}
.main article h1,
.main article p {text-align:left;}



.formPage {display:flex; flex-flow:row wrap; justify-content:space-between; }

.formPage article {width:45%; padding:0; margin:0;}
.formPage .site-form {width:45%; margin:0; padding:2.5%; border:1px #ddd solid; background:#f9f9f9; -webkit-border-radius: 2px;-moz-border-radius: 2px;border-radius: 2px;}


/*  ARTICLE
------------------------------------------------*/
article {max-width:1050px; margin:0 auto; padding:2% 5%;}
.homeSection article {position:relative; top:48%; transform: translateY(-48%);}

article h1 {margin:0 0 25px 0; font-size:2.1875em; font-weight:800; line-height:1; text-align:center; text-transform:uppercase; color:#0e45b4;

-webkit-animation: tracking-in-contract 0.8s cubic-bezier(0.215, 0.610, 0.355, 1.000) both;
	        animation: tracking-in-contract 0.8s cubic-bezier(0.215, 0.610, 0.355, 1.000) both;
}
article h1 span {font-size:.575em; line-height:.5; font-weight:400; color:#515151;}
article h2 {margin:0 0 12px 0; font-weight:700; line-height:1.3; text-transform:uppercase; color:#5f739b;}

article p {font-size:1.375em; line-height:1.5; font-weight:200; text-align:center; color:#111;}


.quickMap {line-height:0; border:1px #ddd solid; -webkit-border-radius: 10px; -moz-border-radius:10px; border-radius:10px;}
.quickMap iframe {-webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius:10px;}


/*  SITE FORM
------------------------------------------------*/
.site-form {width:95%; margin:0; padding:2.5%; -webkit-border-radius: 2px;-moz-border-radius: 2px;border-radius: 2px;}
.site-form form {display:flex; flex-flow:row wrap; align-items:flex-start; justify-content:center; margin:0 auto;}
.site-form h2 {font-size:25px; font-weight:600; text-transform: uppercase;}
.site-form h3 {font-size:18px; width:100%; margin:12px 0 10px 8px; font-weight:500;  font-style: italic;}
.site-form hr {width:90%; margin:12px 0 20px 0; border-top:1px #c7c7c7 solid;}
.site-form .red {color:#D8090D;}
.site-form label {margin:0 0 0 8px; font-size:1em; font-weight:300;  color:#353535;}

.fieldsWrap {margin:0 .5%;}
.fieldsFlex {display:flex; flex-flow:row wrap; align-items:flex-start; justify-content:center;}
.singleFields {width:99%;}
.dualFields {width:49%;}
.thirdFields {width:32.3%;}

.site-form .instructions {font-size:14px; color:#777; margin:6px 0 6px 0;}
.site-form .note {width:100%; font-size:12px; font-style:italic; color:#777; text-align:center; margin:8px 0 0 0;}
.site-form .disclaimer {width:100%; font-size:20px; line-height:1.5; font-style:italic; color:#1B1B1B; margin:0px 0 18px 28px;}

.site-form input[type="text"], .site-form input[type="email"], .site-form input[type="number"], .site-form input[type="time"], .site-form input[type="date"], .site-form input[type="month"], .site-form select {
	width:100%; height:44px; margin:6px 0 20px 0; padding:12px 10px; font-size:14px; color:#555; border:1px #ccc solid; background-color:#fff;
    
	-webkit-border-radius:2px; -moz-border-radius:2px; border-radius:2px;
	-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
}

.site-form input[type="date"] {padding:11px 10px;}

.site-form input[type="text"]:focus, .site-form input[type="email"]:focus, .site-form input[type="number"]:focus, .site-form input[type="time"]:focus, .site-form input[type="date"]:focus, .site-form input[type="month"]:focus, .site-form select:focus {border:1px #a5a5a5 solid; background-color:#f5f5f5;}


.site-form textarea {
	box-sizing: border-box; width:100%; padding:10px 12px; height:150px; margin:6px 0 20px 0;  font-size: 15px; border:1px #ccc solid; background-color:#fff; 
	-webkit-border-radius:0; -moz-border-radius:0; border-radius:0;
}

.site-form textarea:focus {background-color:#f9f9f9;}

.site-form .checkFields {display:flex; flex-flow:row wrap; font-family:open-sans, sans-serif !important; margin:6px 0 20px 0;}
.site-form .checkFields .checkbox {width:calc(50% - 16px); margin:0 8px 8px 8px; padding:0; color:#4D4D4D;}
.site-form .checkFields .checkbox label {margin:0; font-size:.95em; text-transform:none;}

.site-form input[type="submit"] {
	margin:20px auto 10px auto; padding:14px 45px 14px 45px; font-size:18px; line-height:1; font-weight:500; text-align:center;
	color:#fff; border:none; background:#0e45b4; letter-spacing:.5px; text-transform:uppercase; font-family: fagun, sans-serif;
	transition:all 0.3s; -moz-transition:all 0.3s; -webkit-transition:all 0.3s; -webkit-appearance: none;
	-webkit-border-radius:2px; -moz-border-radius:2px; border-radius:2px;
}

.site-form input[type="submit"]:hover {color:#fff; background:#3b3b3b; letter-spacing:1px; transform:scale(1.01,1.01); cursor:pointer; -webkit-appearance: none;}

/* FORM CAPTCHA
------------------------------------------------*/	
.CaptchaPanel {width:100%; margin:12px auto 0 auto !important; padding:10px 0 !important;}
.CaptchaImagePanel {padding:5px 0 10px 0 !important;}
.CaptchaMessagePanel {font-weight:100;}

img.CaptchaImage {margin:0 auto;}
.CaptchaWhatsThisPanel a {color:#000;}
.CaptchaAnswerPanel input {padding:12px 0; text-indent:12px; box-sizing: border-box; border:1px #ccc solid;  background-color: #fff;}

/*  CONTACT BANNER
------------------------------------------------*/
.contactBanner {display:flex; flex-flow:row wrap; align-items:center; justify-content:center; padding:20px 0; color:#fff;background:#0e45b4;}

.contactDetails {display:flex; flex-flow:row wrap; align-items:center; margin:0 35px 0 0; font-size:1.0625em; line-height:1.05; font-weight:100; text-transform:uppercase;
	

	-webkit-animation: slide-in-blurred-left 0.85s cubic-bezier(0.230, 1.000, 0.320, 1.000) both;
	        animation: slide-in-blurred-left 0.85s cubic-bezier(0.230, 1.000, 0.320, 1.000) both;


}
.contactDetails:last-of-type {margin:0;}
.contactDetails strong {font-weight:300;}

.hexContactIcon {
	margin:0 10px 0 0; width:45px; height:53px; font-size:1.125em; line-height:53px; text-align:center; color:#fff; background:#d62822;
	-webkit-clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
    		clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
}
  
.locationMap {line-height:0;}
.locationMap iframe {width:100%; height:325px;}

/*  FOOTER
------------------------------------------------*/
.site-footer {padding:20px 7.5%; font-size:.95em; font-weight:200; color:#fff; background:#202020;}
.site-footer span {font-weight:300;}
















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



@media (min-width:1201px) {
  .hexGrid{padding-bottom:4.4%;}
  .hex {
    width: 16.66667%; /* = 100 / 6 */
  }
  .hex:nth-child(9n+7){ /* first hexagon of even rows */
    margin-left:8.3333%;  /* = width of .hex / 2  to indent even rows */
  }
}




@media screen and (max-width: 1575px) {
	img.catIcon {bottom:45%;padding-top:50%;}
	.hex h3 {padding-top:68%;}
}

@media screen and (max-width: 1450px) {
	.hero {
		height:610px; background:url("/siteart/hero/hero-excavator-tablet.jpg") no-repeat top center; background-size:cover;
		-webkit-clip-path: polygon(100% 0%, 100% 100%, 0% 88%, 0% 0%);
    			clip-path: polygon(100% 0%, 100% 100%, 0% 88%, 0% 0%);
	}
	
	.subHero {
		height:250px;
		-webkit-clip-path: polygon(100% 0%, 100% 100%, 0% 95%, 0% 0%);
				clip-path: polygon(100% 0%, 100% 100%, 0% 95%, 0% 0%);
	}
	.subTitle {font-size:3.85em;}
	.brandSlider {
		margin:-64px 0 0 0; height:400px;
		-webkit-clip-path: polygon(100% 18%, 100% 100%, 0% 84%, 0% 0%);
				clip-path: polygon(100% 18%, 100% 100%, 0% 84%, 0% 0%);
	}
	
	
	img.catIcon {width: auto; max-width:100px; height:auto; max-height:74px;}
	
	
	.homeSection {
		-webkit-clip-path: polygon(100% 0%, 100% 95%, 0% 100%, 0% 5%);
				clip-path: polygon(100% 0%, 100% 95%, 0% 100%, 0% 5%);
	}
	
	.homeSection article {}
	
	
	
}

@media screen and (max-width: 1250px) {
	.logo {margin:0; width:300px;}	
	.quickSearch {width: calc(93% - 649px);}
	
	.formPage article {width:100%;}
	.formPage .site-form {width:95%; margin:35px 0 0 0;}
}

@media screen and (max-width: 1200px) {
	img.catIcon {width: auto; max-width:126px; height:auto; max-height:93px;}
	.hex h3 {font-size:2vw;}
}

@media (max-width: 1200px) and (min-width:901px) { /* <- 4-3  hexagons per row */
  .hexGrid{padding-bottom:6.5%;}
  .hex {
    width: 25%; /* = 100 / 4 */
  }
  .hex:nth-child(7n+5){ /* first hexagon of even rows */
    margin-left:12.5%;  /* = width of .hex / 2  to indent even rows */
  }
}


@media screen and (max-width: 1024px) {
	.site-header {display:flex; flex-flow:row wrap; align-items:center; justify-content:space-between; padding: 20px 0 10px 0;}
	
	
	.logo {
		width:90%; margin:0 0 10px 0; padding:0 5% 15px 5%; border-bottom:1px #ebebeb solid;
		-webkit-animation: slide-in-blurred-top 0.85s cubic-bezier(0.230, 1.000, 0.320, 1.000) both;
	        animation: slide-in-blurred-top 0.85s cubic-bezier(0.230, 1.000, 0.320, 1.000) both;
	}
	.logo img {margin:0 auto;}
	
	
	nav.primary{display:none;}
	#menu-button{display:block; margin: 0 0 0 5%; font-size: 1.4735em; line-height:1; position:relative; z-index:400;}
	#menu-button a{color:#000; text-decoration: none; font-weight:100;}
	
	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;
		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 h3 {	
		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; 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;
		text-decoration: none;
		border-right: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-right:4px #C8102E solid;}
	
	/* SECOND LEVEL */
	nav.mobile ul li li:last-child {border:none;}
	nav.mobile ul li li a {color: #ccc; background: #444; border-right: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-right:4px #555 solid;}
	nav.mobile ul li li li a:hover {background:rgba(85,85,85,0.5);}
	
	.nav-footer {color:#777; position:relative; text-align:center; font-size:12px; line-height:12px; padding:15px 0;}
	
	
	.quickSearch {width:calc(93% - 485px); max-width:none;}	
	.headerContact {margin:0 5% 0 0;}
	
	.hero {
		height:610px; background:url("/siteart/hero/hero-excavator-tablet.jpg") no-repeat top center; background-size:cover;
		-webkit-clip-path: polygon(100% 0%, 100% 100%, 0% 92%, 0% 0%);
    			clip-path: polygon(100% 0%, 100% 100%, 0% 92%, 0% 0%);
	}
	
	.heroOverlay {top:40%; left:5%; right: 5%; transform: translateY(-40%);}
	.heroTitle {font-size:3.5em;}
	.heroText {max-width:615px; font-size:1.5em;}
	.heroContact {font-size:1.35em;}

	.subTitle {font-size:3.5em;}
	
	.brandSlider {
		margin:-40px 0 0 0; height:340px; background:url("/siteart/brands-bg-tablet.jpg") no-repeat top center; background-size:cover;
		-webkit-clip-path: polygon(100% 14.5%, 100% 100%, 0% 84%, 0% 0%);
				clip-path: polygon(100% 14.5%, 100% 100%, 0% 84%, 0% 0%);
	}
	
	


	.brandSlider .cycle-slideshow {top:55%; transform: translateY(-55%);}
	.brandSlider .cycle-slideshow img {width:100%; max-width:200px;}	
		
		
	
	.homeSection {
		height:525px;
		-webkit-clip-path: polygon(100% 0%, 100% 95%, 0% 100%, 0% 5%);
				clip-path: polygon(100% 0%, 100% 95%, 0% 100%, 0% 5%);
	}
	
	
	
	.locationMap iframe {height:275px;}
	
	
	
	
	.contactBanner {display:flex; flex-flow:row wrap; align-items:center; justify-content:center; padding:35px 3.5%; color:#fff;background:#0e45b4;}

	.contactDetails {
		display:flex; flex-flow:row wrap; align-items:center;
		width:50%;
		margin:0; font-size:1.0625em; line-height:1.05; font-weight:100; text-transform:uppercase;}
	.contactDetails:nth-of-type(3),
	.contactDetails:last-of-type {margin:20px 0 0 0;}
	
	
	.fieldsWrap {margin:0;}
	.singleFields {width:100%;}
	.dualFields {width:100%;}
	.thirdFields {width:100%;}
	.site-form .checkFields .checkbox {width:calc(100% - 16px);}
}

@media screen and (max-width: 900px) {
	.hex h3 {font-size:2.75vw;}
}

@media (max-width: 900px) and (min-width:601px) { /* <- 3-2  hexagons per row */
  .hexGrid{padding-bottom:8.4%;}
  .hex {
    width: 33.333%; /* = 100 / 3 */
  }
  .hex:nth-child(5n+4){ /* first hexagon of even rows */
    margin-left:16.666%;  /* = width of .hex / 2  to indent even rows */
  }
  .hex:last-child{ 
    margin-left:33.333%;  
  }	
	
}



@media screen and (max-width: 768px) {
	.quickSearch {width:calc(95% - 215px); margin:0 2.5%}		
	.headerContact a, .headerContact a[href^="tel:"] {font-weight:200;color:#3f3f3f;}
	.headerContact a i {color:#0e45b4;}
	.headerContact a[href^="tel:"] i {color:#d62822;}
	
	
	.headerContact span {display:none;}
	
	
	
	
	.hero {height:510px; background:url("/siteart/hero/hero-excavator-mobile.jpg") no-repeat top center; background-size:cover;
	-webkit-clip-path: polygon(100% 0%, 100% 100%, 0% 94%, 0% 0%);
    		clip-path: polygon(100% 0%, 100% 100%, 0% 94%, 0% 0%);
	}
	
	.subHero {height:225px;}
	.subTitle {font-size:3.25em;}
	.brandSlider {
		margin:-23px 0 0 0; height:340px; background:#0e45b4 url("/siteart/brands-bg-mobile.jpg") no-repeat center; background-size:cover;
		-webkit-clip-path: polygon(100% 8.5%, 100% 100%, 0% 90%, 0% 0%);
				clip-path: polygon(100% 8.5%, 100% 100%, 0% 90%, 0% 0%);
	}
	.brandSlider .cycle-slideshow a {margin:0 .5%;}
	
	
	
	
	.homeSection {
		height:600px; padding:5% 0; 
		-webkit-clip-path: polygon(100% 0%, 100% 97%, 0% 100%, 0% 3%);
				clip-path: polygon(100% 0%, 100% 97%, 0% 100%, 0% 3%);
	}
	
	article h1 {margin:0 0 25px 0; font-size:2em;}
	.quickMap iframe{height:275px;}
	.contactDetails {display:flex; flex-flow:row wrap; align-items:center; width:100%; margin:20px 0 0 10%; font-size:1em;}
	.contactDetails:nth-of-type(3),
	.contactDetails:last-of-type {margin:20px 0 0 10%;}
}

@media (max-width: 600px) {
	.hexGrid{padding-bottom:12.6%;}
	.hex {width: 50%;} /* = 100 / 3 */
	.hex:nth-child(3n+3){ /* first hexagon of even rows */
	margin-left:25%;  /* = width of .hex / 2  to indent even rows */
	}
	
	.hero {
		height:400px;
		-webkit-clip-path: polygon(100% 0%, 100% 100%, 0% 96%, 0% 0%);
				clip-path: polygon(100% 0%, 100% 100%, 0% 96%, 0% 0%);
	}
	
	.brandSlider {
		margin:-10px 0 0 0; height:300px;
		-webkit-clip-path: polygon(100% 5.5%, 100% 100%, 0% 94%, 0% 0%);
				clip-path: polygon(100% 5.5%, 100% 100%, 0% 94%, 0% 0%);
	}
	
	
	.hex h3 {font-size:4.5vw;}
	
}


@media screen and (max-width: 480px){
	.quickSearch {display:none;}
	
	.heroTitle {font-size:2.5em;}
	.heroText {max-width:350px; font-size:1.25em;}
	.heroContact {font-size:1.05em;}
	.subTitle {font-size:2.85em;}
	
	img.catIcon {width: auto; max-width:100px; height:auto; max-height:74px;}
	

	

	.homeSection {height:600px; padding:5% 0;}
	article p {font-size:1.275em; line-height:1.5;}
}

@media screen and (max-width: 450px){
	.hero {height:400px; -webkit-clip-path:none; clip-path:none;}
	.subHero {-webkit-clip-path:none; clip-path:none;}
	.brandSlider {margin:7px 0 0 0; width:100%; height:200px; -webkit-clip-path:none; clip-path:none;}
	
	.homeSection {height:auto; padding:7.5% 0; -webkit-clip-path:none; clip-path:none;}
	.homeSection article {top:0; transform:none;}
	
	.contactDetails {display:flex; flex-flow:row wrap; align-items:center; width:100%; margin:20px 0 0 0; font-size:1em;}
	.contactDetails:nth-of-type(3),
	.contactDetails:last-of-type {margin:20px 0 0 0;}
}

@media screen and (max-width: 320px){

}