﻿/***** BEGIN RESET *****/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	background: transparent;
	border: 0;
	margin: 0;
	padding: 0;	
}

ol, ul {
	list-style: none;
}

table{border-collapse:collapse; width:100%;}
td{vertical-align:top;}

/* Make HTML 5 elements display block-level for consistent styling */  
header, nav, article, footer, address {  
    display: block;  
} 

/*-------- COLORS --------

*/

/***** END RESET *****/
::-moz-selection {
    background: #000; 
    color: #fff;
    text-shadow: none;
}
::selection {
    background: #000;
    color: #fff;
    text-shadow: none;
}


/* Clearfix */
.cf:before,
.cf:after {
    content: " ";
    display: table;
}
.cf:after {
    clear: both;
}
.cf {
    *zoom: 1;
}

/*-------- BODY STYLES --------*/

body {

}

a {font-family: 'Spartan', sans-serif;}
a:link, a:visited, a:active {text-decoration:none;}
a:hover {text-decoration:none;}


hr{border:#000 1px solid;}

h1{font-family: 'Spartan', sans-serif;font-size: 60px;}
h2{font-family: 'Spartan', sans-serif;font-size: 40px;}
h3{font-family: 'Spartan', sans-serif;font-size: 20px;}
h4{font-family: 'Spartan', sans-serif;font-size: 15px;}
p{font-family: 'Spartan', sans-serif;}

/*--- HEADER STYLES ---------------------*/
header {}

.mobile{display:none;}
#menu-button{display:none;}

.header{
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: center;
	align-content: stretch;
	padding: 10px 60px;
	max-height: 120px;
}

.grey-bg-header{background-color: #262626;}
.logo img{max-height: 65px;}

.primary-menu ul li a, .mobile ul li a{
	color: white;
    font-size: 17px;
    padding-left: 30px;
	font-family: 'Spartan', sans-serif;
	font-weight: 700;
	-webkit-transition:.4s ease-in;  
	-moz-transition:.2s ease-in;  
	-o-transition:.2s ease-in;  
	transition:.2s ease-in;
}

.primary-menu ul li a:hover, .mobile ul li a:hover{color: #6d8392;}

.primary-menu ul li a img, .mobile ul li a img{
	max-height: 20px;
	width: auto;
	filter: brightness(1.1);
}

.horizontal-menu{
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: center;
	align-content: stretch;
}

	/* Appearance of the sub-level links */
			nav.primary-menu ul li li a { 
				font-size:15px;
				line-height:16px;
				padding:5px;
				color:#fff;
				text-align:left;
				border-right:none;
				border-left:none;
			}
			/* Appearance of the sub-level links on hover */
			nav.primary-menu ul li li a:hover { 
			}
/* This controls the Primary nav dropdowns for sublinks. Should not have to edit this too muuch */
nav.primary-menu ul ul {
    display: none;
    position: absolute; 
}
nav.primary-menu ul ul ul {
    position: absolute; 
    left: 100%;
    top:0; 
}
nav.primary-menu ul li:hover > ul {  
    display: block;
    line-height:18px; 
    z-index: 100;
	padding-right: 23px;
	padding-left: 23px;
    padding-top: 36px;
}
nav.primary-menu ul ul li {
    float: none; 
	width: 200px;
    position: relative;
    margin:0;
	display: block;
	background: #262626;
	padding: 7%;
	border-top: #303030 solid 1px;
	-webkit-transition:.4s ease-in;  
	-moz-transition:.2s ease-in;  
	-o-transition:.2s ease-in;  
	transition:.2s ease-in;
}
nav.primary-menu ul ul li:hover{
	background:  #6d8392;
}

/*---BODY--------------------------------*/

/*==================================*/
/**********  HOME PAGE  **********/
/*=================================*/

.hero-content{
	position: relative;
    height: 900px;
}

.hero-content img{
	max-height: 900px;
    height: 100%;
    width: 100%;
    object-fit: cover;
    position: absolute;
}

.hero-title{
	max-height: 900px;
    height: 100%;
    position: relative;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: flex-start;
    align-content: stretch;
    padding: 0 10%;
}

.hero-content h1{
	color: white;
	padding-bottom: 22px;
}

.hero-content a{
    color: white;
    font-size: 20px;
    padding: 20px 50px;
    background: #6d8392;
    border-radius: 12px;
    -webkit-transition: .4s ease-in;
    -moz-transition: .2s ease-in;
    -o-transition: .2s ease-in;
    transition: .2s ease-in;
}

.hero-content a:hover{
	color: #6d8392;
	background: white;
}

/************ we buy used equipment ************/

.used-equipment{
	height: 862px;
	background-color: white;
}

.used-wrapper{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	align-content: center;
	padding: 8% 20%;
}

.used-left h2{
	margin-bottom: 40px;
}

.used-left a{
	color: white;
	font-size: 18px;
    padding: 18px 50px;
    background: #6d8392;
	border-radius: 12px;
	border: 1px solid #6d8392;
	-webkit-transition:.4s ease-in;  
	-moz-transition:.2s ease-in;  
	-o-transition:.2s ease-in;  
	transition:.2s ease-in;
}

.used-left a:hover{
	color: #6d8392;
	background: white;
	border: 1px solid #6d8392;
}

.used-right ul li{
	font-family: 'Spartan', sans-serif;
	font-weight: 700;
	font-size: 30px;
	text-align: right;
	text-decoration: underline;
	padding-bottom: 3px;
}

/************ services we offer ************/

#services-large{display:none;}
.used-serv-image{
	width: 100%;
    position: relative;
    top: -23%;
}

.used-serv-image img{
	width: 60%;
    padding: 0% 20%;
    max-height: 500px;
    object-fit: cover;
    object-position: top;

}

.services{
	height: 942px;
	background-color:  #6d8392;
}

.service-wrapper{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	align-content: center;
	padding: 8% 20%;
	padding-top: 0;
	top: -6%;
    position: relative;
}

.services-left a{
	color: black;
	font-size: 18px;
    padding: 18px 50px;
    background: white;
	border-radius: 12px;
	border: 1px solid white;
	-webkit-transition:.4s ease-in;  
	-moz-transition:.2s ease-in;  
	-o-transition:.2s ease-in;  
	transition:.2s ease-in;
}

.services-left a:hover{
	color: white;
	background: #6d8392;
	border: 1px solid white;
}

.services-right h2{
	text-align: right;
	margin-bottom: 40px;
	color: white !important;
}

.services-right ul li{
	font-family: 'Spartan', sans-serif;
	font-weight: 700;
	font-size: 25px;
	color: white !important;
	text-align: right;
	text-decoration: underline;
	padding-bottom: 3px;
}

/************** our blog **************/

.blog{
	background: #262626;
    z-index: 1;
    height: 1035px;
}

.blog-title-container{
	top: -7%;
    position: relative;
}

.blog-title {
	color: #262626 !important;
	text-align: center;
	background: #fff;
	margin: 0% 36%;
    padding: 2% 7%;
	z-index: 1;
    position: relative;
	font-size: 2vw !important;
}

.blog-wrap{
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: baseline;
	align-content: stretch;
	width: 100%;	
}

.blog-col{
	width: 33.15%;
	padding-top: 3%;
	text-align: center;
}

.blog-col img{
	width: 100%;
	object-fit: cover;
	border: white solid 1px;
}

.blog-content{
	display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
    align-content: stretch;
	padding: 14%;
}

.blog-content p{
	font-size: 11px;
	color: white;
	background: #6d8392;
	border-radius: 60px;
    padding: 13px 24px;
	padding-top: 16px;
}

.blog-content h3{
	color: white;
	padding-top: 40px;
    padding-bottom: 25px;
}

.blog-content a{
	color: white;
	font-style: italic;
	padding-bottom: 10%;
}

.blog-content a:hover{
	text-decoration: underline;
}

/************ Brands we work with ************/

.brands{
	background:white;
	height: 446px;
}

.brands-title{
	color: white !important;
    text-align: center;
    background: #6d8392;
    margin: 0% 30%;
    padding: 2% 7%;
    z-index: 1;
    position: relative;
	top: -14%;
	font-size: 2vw !important;
}

.brands-wrap{padding: 31px 60px;}
.slick-slide img{width:83%;}

/************ Contact Us ************/

.contact-bg{
	background: #6d8392;
	height: 1000px;
}

.contact-wrap{
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: center;
	align-content: stretch;
    padding: 8% 20%;
	padding-top: 4%;
}

.contact-title{
	padding: 8%;
    text-align: center;
    padding-bottom: 0;
	color: white; 
}

.map {width: 50%;  position:relative; overflow:hidden; padding-top: 50%;}

.contact-info-wrap{ width: 40%; padding-left: 8%;}

.contact-info h3{
	font-size: 30px !important;
	color: white;
	padding-bottom: 6px;
}

.contact-info p{
	font-size: 20px;
	color: white;
	padding-bottom: 5px;
	-webkit-transition:.4s ease-in;  
	-moz-transition:.2s ease-in;  
	-o-transition:.2s ease-in;  
	transition:.2s ease-in;
}
.contact-info p:hover {color:black;}

/*==================================*/
/**********  ABOUT PAGE  **********/
/*=================================*/
.page-title h1{ font-size: 3.5vw!important; padding: 5%; padding-top: 10%; color: #6d8392; text-align: center;}
.about-us-wrap{
	margin: 8%;
	margin-top: 0;
    background: white;
    padding: 0 6%;
}
.about-us-wrap p{color: black; font-size: 17px;}

.team-wrap{
	margin: 8%;
	margin-top: 0;
    background: #6d8392;
    padding: 6%;
}
.team{
	display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
    align-content: stretch;
	padding-bottom: 5%;
	width: 100%;
}
.team img{border: 6px solid white; width: 20%;}
.team p{ padding: 3%; color: white; width: 80%;}

/*==================================*/
/**********  BLOG PAGE  **********/
/*=================================*/

.blog-page-wrap{ 
	display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: stretch;
    align-content: stretch;
    margin: 0 8%;
    margin-bottom: 8%;
    padding: 4%;
    background: #6d8392;
}
.blog-page-col{width: 30%;}
.blog-page-col img{width: 100%; outline: 3px white solid; outline-offset: -3px; }
.blog-page-content{padding: 12%;text-align: center;}
.blog-page-content h3{color: white; padding-bottom: 8%;}
.blog-page-content a{color: white; font-style: italic;}
.blog-page-content a:hover{text-decoration: underline;}

/* blog sub pages */
.blog-header-img{width: 100%;}
.blog-header-img img {width: 100%; max-height: 400px; object-fit: cover; position: absolute;}
.blog-header-img h1{position: relative; text-align: center; color: white; padding: 8%; padding-bottom: 3%;}
.content-wrap{ background: white; margin: 8%; margin-top: 0; padding: 5%; position: relative;}
/*	end of sub blog pages */


/*==================================*/
/**********  CONTACT PAGE  **********/
/*=================================*/

.contact-page-wrap{
	display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
    align-content: stretch;
	margin: 8%;
}

.contact-map{width:60%; position:relative; overflow:hidden; padding-top: 40%;}
.resp-iframe{position: absolute; top: 0; left: 0; width: 100%; height:100%; border: 0;}
.contact-page-info-wrap{width:30%; padding-left: 7%;}
.contact-page-info h3 {font-size: 1.5vw!important; padding-bottom: 7px;}
.contact-page-info p {font-size: 1vw; line-height: 1.5vw; }
.contact-page-info a {color: black; -webkit-transition:.4s ease-in;  
	-moz-transition:.2s ease-in;  
	-o-transition:.2s ease-in;  
	transition:.2s ease-in;}
.contact-page-info a:hover {color:  #6d8392;}


/*==================================*/
/**********  PRODUCTS PAGE  **********/
/*=================================*/
.manu-logos{
	display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: baseline;
    align-content: stretch;
    margin: 8%;
    margin-top: 0;
}
.logo-wrap{width: 25%; padding: 4%;}
.logo-wrap img{width: 100%;}
.logo-wrap p{text-align: center; padding-top: 7%;}


/*==================================*/
/**********  SERVICES PAGE  **********/
/*=================================*/
#services-hz{display:none;}
.service-page-wrap{
	display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: stretch;
    align-content: flex-start;
    padding: 11vw;
    padding-top: 0;
}
.service-img-left{
	width: 30%;
}
.service-img-left img{
	min-width: 100%;
    object-fit: cover;
    height: 44vw;
	object-position: 36%;
}
.service-list-right{
	width: 70%;
    background: #6d8392;
    height: 44vw;
	z-index: 0;
}
.list-wrap{
	
	padding: 5vw;
    color: white;
}
.list-wrap h3{font-size: 1.2vw!important;}
.list-wrap p{font-size: 1vw;}

/*==================================*/
/********  THANK YOU PAGE  ********/
/*=================================*/

.ty-wrapper{
	margin: 8%;
    margin-top: 0;
    background: #6d8392;
    padding: 5%;
    color: white;
}
.ty-wrapper h2{font-size: 2.8vw!important;padding-bottom: 2%; }
.ty-wrapper p{font-size: 1.3vw;}

/*--------FORM STYLES--------------------*/

.form-text h3{font-size: 26px !important;}
.form-text p{font-size: 19px ;}
.contact-form-wrap{
	display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: baseline;
    align-content: stretch;
    margin: 8%;
    margin-top: 0;
    margin-bottom: 4%;
    background: #6d8392;
    padding: 6%;
}
.form-text{width: 30%; color: white;}
.form-main{ width: 70%; padding-left: 5%; color: white;}
.form-row{font-family:  'Spartan', sans-serif; font-size: 12px;}
.form-row input{width:100%; margin-bottom: 15px; padding: 7px;font-family: 'Spartan';}
.form-row h4{padding-bottom: 8px;}
input.radio{width: auto; font-family: 'Spartan', sans-serif; }
textarea{width:100%; font-family: 'Spartan', sans-serif; padding: 7px;}
input.bttn-base, .bttn-green {
	padding: 1.5% 0%;
    font-family: 'Spartan';
    background: white;
    text-decoration: none;
    border: black solid 1px;
	width:100%;
}
.CaptchaPanel {
    margin: 10px 0px 10px 0px;
    text-align: center;
    padding: 10px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding-left: 0 !important;
}
.CaptchaMessagePanel {
    padding: 5px 5px 10px 5px;
    font-weight: 400;
    font-size: 14px;
    font-family: 'Spartan', sans-serif;
	text-align: left;
}
.CaptchaWhatsThisPanel a {
    padding: 5px 5px 10px 5px;
    font-size: 12px;
    color: white !important;
}

/*-------- FOOTER STYLES ----------------*/
footer{}

.footer{padding: 60px;}
.grey-bg-footer{background-color: #262626;}

.column-wrap{
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: flex-start;
	align-content: stretch;
	width: 100%;
}

.column{width: 20%;color: white;}
.column p{font-size: 14px;}
.column ul li {padding-bottom: 5px;}

.column ul li a{
	font-size: 14px;
	color: white;
	padding-bottom: 5px;
	-webkit-transition:.4s ease-in;  
	-moz-transition:.2s ease-in;  
	-o-transition:.2s ease-in;  
	transition:.2s ease-in;
}

.column ul li a:hover{color: #87949a;}

.column a {
	color: white;
	-webkit-transition:.4s ease-in;  
	-moz-transition:.2s ease-in;  
	-o-transition:.2s ease-in;  
	transition:.2s ease-in;
}

.column a:hover {color: #87949a;}
.column img{max-width: 80%;}

/*==================================*/
/********  Inventory PAGE  ********/
/*=================================*/

.inv-filter{padding: 5%; margin: 11vw; margin-top: 0; background:#6d8392; }
.inv-btn{width: 100%; text-align: center; display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: space-between; align-items: center;}
.inv-btn a{box-sizing: unset; width: 18%; padding: 1.5% 5%; font-size: 16px;  border: 2px solid white; border-radius: 10px; color: white; -webkit-transition:.4s ease-in; -moz-transition:.2s ease-in; -o-transition:.2s ease-in; transition:.2s ease-in;}
.inv-btn a:hover{color: #6d8392; background: white;}

/*----INVENTORY STYLES - KEEP AT BOTTOM OF CSS----*/

.hosted-content .attachment-search .search-checkboxes label .row {margin-left:0 !important;margin-right:0 !important;margin-bottom:0px !important;}

.list-content .list-main-section .list-container .list-listing .listing-top-right .view-listing-details-link, .faceted-search-content .selected-facets-container .selected-facet, .list-content .list-listing-mobile .view-listing-details-link, .list-content .list-listing-mobile .buy-now-link, .list-content .list-listing-mobile .check-availability-link, .list-content .list-listing-mobile .email-seller-link, .detail-content .detail-main-body .main-detail-data .offer-btn, .detail-content .detail-main-body .main-detail-data .buy-btn, .detail-content-mobile .detail-main-body .main-detail-data .dealer-phone-mobile-container .dealer-phone-mobile, .detail-content-mobile .detail-main-body .main-detail-data .offer-btn-mobile, .detail-content-mobile .detail-main-body .main-detail-data .send-email-btn-mobile, .detail-content-mobile .detail-main-body .main-detail-data .send-wholesale-email-btn-mobile, .detail-content-mobile .detail-main-body .main-detail-data .fin-calc-btn-mobile, .list-container-flexrow .view-listing-details-link {background: #6d8392 !important; }
.list-content .list-title .list-title-text, .detail-content-mobile .detail-main-body .detail-mobile-top .detail-title {font-size: 22px; line-height: 26px;}

.detail-content .detail-additional-data .data-row .data-label, .detail-content-mobile .detail-additional-data .data-row .data-label {background: #6d8392 !important;text-transform: uppercase; letter-spacing: 1px;}
.detail-content-mobile .detail-contact-bar .contact-bar-btn, .faceted-search-content .mobile-done-button-container .mobile-done-button {background: #000 !important;}

.detail-content .detail-main-body .main-detail-data .offer-btn, .detail-content .detail-main-body .main-detail-data .buy-btn {float:none;}

.list-content {padding: 4vw!important; padding-top: 0!important;}
.list-listings-count{color: #6d8392 !important; }
.legal-text-content{margin-bottom: 9%!important;}
.inv-emptyspace{height: 0vw;}
.mobile-breadcrumb{background-color: #6d8392 !important; }

@media only screen and (max-width: 1024px){
    .inv-btn{flex-direction: column;}
    .inv-btn a{font-size: 14px; width: 55%; margin-bottom: 3%;}
}
@media only screen and (max-width: 874px){
	.list-content {padding: 7vw!important;  padding-top: 0!important;}
	.listing-option-mobile {display: block !important;}
	.listing-option-bar-content{display:none!important;}
	.has-search-bar { width: 100%!important; float: none!important;}
	.list-content .faceted-search-content {
		position: fixed!important;
		left: 0!important;
		top: 0!important;
		bottom: 0!important;
		width: 100%!important;
		background-color: #fff!important;
		opacity: 0!important;
		visibility: hidden!important;
		transition: opacity .3s 0s,visibility 0s .3s!important;
		z-index: 999999999999999!important;
		overflow-y: auto!important;
		float: none!important;
		margin: 0!important;}
	.inv-emptyspace{height: 16vw;}
}

@media only screen and (max-width: 602px){
	.list-content {padding-top: 0!important;}
	.inv-emptyspace{height: 18vw;}
}

@media only screen and (max-width: 425px){
	.list-content {padding-top: 2vw!important;}
	.inv-emptyspace{height: 23vw;}
    .inv-filter{padding: 10% 5%!important;}
}

@media only screen and (max-width: 320px){
	.inv-emptyspace{height: 27vw;}
}


/*---------- RESPONSIVE STYLES ----------*/

/*mainly background sizes for each section on the landing page*/

@media only screen and (max-width: 2560px){

	.used-equipment {height: 956px;}
	.services {height: 956px;}
	.blog {height: 1350px;}
	.blog-title {font-size: 2vw !important;}
	.brands {height: 550px;	}
	.brands-title {font-size: 2vw !important;}
	.contact-bg {height: 1200px;}
	.contact-title {font-size: 2vw !important; padding-top: 6%;}
}

@media only screen and (max-width: 2090px) and (min-width: 1880px){
	.used-equipment {height: 880px;}
	.services {height: 915px;}
	.blog {height: 1100px;}
	.brands {height: 470px;	}
	.contact-bg {height: 900px;}
}

@media only screen and (max-width: 1879px) and (min-width: 1601px){
	.used-equipment {height: 845px;}
	.services {height: 900px;}
	.blog {height: 1100px;}
	.brands {height: 460px;	}
	.contact-bg {height: 880px;}
}

@media only screen and (max-width: 1600px){
	.used-equipment {height: 815px;}
	.used-left{width: 50%;}
	.services {height: 830px;}
	.blog {height: 970px;}
	.blog-title-container{top: -5%;}
	.brands {height: 410px;	}
	.contact-bg {height: 840px;}
}

@media only screen and (max-width: 1440px){
	
	.hero-content {height: 791px;}
	.used-equipment{height: 718px;}
	.used-left h2{font-size: 2.5vw !important;}
	.used-left a{font-size: 1vw;}
	.used-right ul li {font-size: 2vw;}
	.used-serv-image { top: -19%;}
	.services {height: 710px;}
	.services-right h2 {font-size: 2.5vw !important; margin-bottom: 22px;}
	.services-right ul li {font-size: 1.6vw;}
	.services-left a {font-size: 1.1vw;}	
	.blog-title-container{top: -5%;}
	.blog {height: 893px;}
	.brands {height: 370px;}
	.contact-bg {height: 765px;}
	.contact-title{font-size: 35px !important;}
	.contact-info h3 {font-size: 25px !important;}
	.contact-info p {font-size: 17px;}
	
	.service-img-left img {height: 47vw;}
	.service-list-right {height: 47vw;}
}

@media only screen and (max-width: 1342px){
	
	.used-equipment{height: 635px;}
	.services { height: 710px;}
}

@media only screen and (max-width: 1256px){
	
	.used-equipment{height: 600px;}
	.services { height: 570px;}
	.blog-title-container{top: -5%;}
	.blog {height: 760px;}
	.brands {height: 310px;}
	.contact-bg {height: 635px;}
	
	.service-img-left img {height: 61vw;}
	.service-list-right {height: 61vw;}
	.list-wrap h3{ font-size: 1.4vw!important;}
	.list-wrap p{ font-size: 1.2vw;}
	
	.contact-page-info h3 {font-size: 1.8vw!important; padding-bottom: 7px;}
	.contact-page-info p {font-size: 1.5vw; line-height: 1.9vw; }
}

@media only screen and (max-width: 1024px){
	.hero-content {height: 637px;}
	.hero-content h1 {font-size: 45px!important;}
	.hero-content a {font-size: 15px; padding: 15px 43px;}
	.used-equipment{height: 573px;}
	.used-wrapper{padding: 10% 20%;}
	.services { height: 500px;}
	.blog { height: 690px;}
	.blog-title{margin: 0% 33%; font-size: 25px!important;}
	.blog-content h3{font-size:16px;}
	.blog-content p{font-size:9px;}
	.blog-content a {font-size: 14px;}
	.brands { height: 277px;}
	.brands-title{margin: 0% 26%; font-size: 25px!important;}
	.contact-bg {height: 515px;}
	.contact-title{font-size: 27px !important;}
	.contact-info h3 {font-size: 19px !important;}
	.contact-info p {font-size: 14px;}
	.column a {font-size: 12px;}
	.column p{font-size: 12px;}
	
	.blog-page-content h3 {font-size: 15px;}
	.blog-page-content a {font-size: 12px;}
	
	.service-img-left img {height: 65vw;}
	.service-list-right {height: 65vw;}
	.list-wrap h3{ font-size: 1.6vw!important;}
	.list-wrap p{ font-size: 1.3vw;}
	
	.team img{border: 3px solid white; width: 30%;}
	.team p{ padding: 3%; color: white; width: 70%;}
	
}


@media only screen and (max-width: 1160px) {
	
	nav ul li a{ font-size: 15px; padding-left: 25px;}
	.column h3{font-size:16px!important;}
	.column a {font-size: 11px;}
	.column p{font-size: 11px;}
	
	
	.service-img-left img {height: 70vw;}
	.service-list-right {height: 70vw;}
	
	.form-text h3{font-size: 23px !important;}
	.form-text p{font-size: 16px ;}
}

@media only screen and (max-width: 1023px) {
	
	
	.primary-menu{display:none;}
	/*==============================
			Mobile Nav Styles			
	================================*/	
	.header{position: absolute; z-index: 1; padding: 20px;}
	.grey-bg-header{background: transparent;}
	#menu-button{ /* initially will need to be hidden */
		display: block;
		font-size: 32px;
		z-index: 9;/* needs to be lower than nav.mobile, adjust as needed */
		padding-top: 3%;
		background:transparent;
		text-align: center;
		text-align: right;
		position: absolute;
		width: 100%;
	}
	#menu-button a{color:black;text-decoration: none; padding: 5%;}
	#menu-button a:hover{color:#6d8392;}
	
	nav.mobile {
		display:block;
		position: fixed;
		top: 0;
		left: -250px;
		width: 250px;
		height: 100%;
		background: #262626;
		z-index: 10; /* needs to be higher than #menu-button, adjust as needed */
		overflow:auto;
	}
	nav.mobile h3 { /* Menu header styles */
		position: relative;
		padding: 12px 10px;
		color: #fff;
		font-size: 22px;
		font-weight: normal;
		border-bottom: 4px solid #222;
		letter-spacing:1px;
	}
	nav.mobile .menu-toggle { /* Menu close button */
		position: absolute;
		top: 12px;
		right: 10px;
		display: inline-block;
		padding: 6px 9px 5px;
		font-family: Arial, sans-serif;
		font-weight: bold;
		line-height: 1;
		background: #262626;
		color: #999;
		text-decoration: none;
		vertical-align: top;
	}
	nav.mobile .menu-toggle:hover { /* Menu close button on hoveer */
		color: white;
	}
	nav.mobile ul {
		list-style: none;
		font-weight: 300;
		margin:0;
		padding:0;
	}
	nav.mobile ul li {
/*
		border-top: 1px solid #454545;
		border-bottom: 1px solid #151515;
*/
	}
	nav.mobile ul li a {
		position: relative;
		display: block;
		padding: 15px;
		text-decoration: none;
		font-size:16px;
	}
	nav.mobile ul li a:hover {
		background: #fff;
		color: #6d8392;
	}
	nav.mobile ul li li a { /* appearance of the sub-level links */
		background: #444;
		position: relative;
		display: block;
		border-top: 0.5px #262626 solid;
   		padding: 12px 12px 12px 30px;
		color: #ccc;
		text-decoration: none;
	}
	nav.mobile ul li li li a { /* appearance of third level sub-level links if needed */
		background: #666;
		position: relative;
		display: block;
		padding: 10px 10px 10px 25px;
		color: #000;
		text-decoration: none;
	}
	nav.mobile ul li span.click{/* dropdown menu idicator arrow be sure to include this image with your image files */ 
		background:url(../siteart/arrow.png) 10px 12px no-repeat;
		background-size:55%;
		position:relative;
		display:block;
		float:right;
		margin:-44px 0 0 0;
		cursor:pointer;
		z-index: 12399994;
		width:44px;
		height:44px;
		-webkit-transition:background-size .3s ease-in-out;
		-moz-transition:background-size .3s ease-in-out;
		transition:background-size .3s ease-in-out;
	}
	nav.mobile ul li span.click:hover{
		background-size:60%;
	}
	
	.nav-footer{
		font-family: 'Spartan', sans-serif;
		font-weight: 400;
		color: #87949a;
		padding: 15px;
		font-size: 10px;
	}
	
	/*  	end of Mobile Nav Styles    */
	
	.hero-title{justify-content: center; align-items: center;}
	.hero-content {
		height: 500px;
		position: relative;}
	.hero-content h1 {font-size: 40px!important; padding-bottom: 14px; padding-top: 7%; text-align: center;}
	.hero-content a {font-size: 14px; padding: 15px 43px;}
	.used-equipment{height: 530px;}
	.used-left h2{font-size: 3vw !important;}
	.used-left a{font-size: 1.5vw;}
	.used-right ul li {font-size: 2.4vw;}
	.used-wrapper {padding: 10%;}
	.used-serv-image img { width: 80%;  padding: 0% 10%; max-height: 330px;}
	.services { height: 540px;}
	.service-wrapper {padding: 10%; padding-top: 0;}
	.services-right h2 {font-size: 3vw !important; margin-bottom: 22px;}
	.services-right ul li {font-size: 2vw;}
	.services-left a {font-size: 1.5vw;}
    .blog { height: 620px;}
	.brands { height: 230px;}
	.brands-title{margin: 0% 20%; font-size: 24px!important; padding: 3% 7%;}
	.brands-wrap {padding-top: 0; padding-left: 10%; padding-right: 10%; padding-bottom: 4%;}
	.contact-bg { height: 524px;}
	.contact-wrap{padding: 10%; padding-top: 5%;}
	.contact-info h3 {  font-size: 2vw !important;}
	.contact-info p {font-size: 1.5vw;}
	
	.page-title h1{padding-top: 27%;}
	
	.blog-page-wrap{ margin-bottom: 15%;}
	/*	sub blog page */
	.blog-header-img h1{position: relative; text-align: center; color: white; padding: 8%; padding-bottom: 3%; padding-top: 21%;}
	/*	end of sub blog pages */
	
	#services-vt{display:none;}
	#services-hz{display:block;}
	.service-page-wrap{flex-direction: column;}
	.service-img-left { width: 100%; height: 30vw;}
	.service-img-left img { object-position: top; height: 30vw;}
	.service-list-right{ width: 100%;}
	
	.logo-wrap p{font-size: 14px;}
	
}


@media only screen and (max-width: 768px){
	#services-large{display: block;}
	#services{display: none;}
	.used-equipment {height: 479px;}
	.services { height: 546px;}
	.contact-bg { height: 474px;}
	.footer { padding: 12%;  padding-bottom: 1px;}
	.column-wrap{ flex-direction: row;flex-wrap: wrap; justify-content: space-between;  align-items: flex-start; align-content: center;}
	.column{width: 42%;padding-bottom: 19%; text-align: center;}
	.column ul li { text-align: center;}
	.column a { text-align: center;}
	.column p { text-align: center;}
	
	.service-list-right {height: 79vw;}
    .list-wrap{background: #6d8392;}
	.list-wrap h3{ font-size: 2.2vw!important;}
	.list-wrap p{ font-size: 1.6vw;}
	
	.team img{border: 6px solid white; width: 40%;}
	.team p{ padding: 3%; color: white; width: 60%; font-size: 14px;}
	
	.contact-form-wrap{
		flex-direction: column;
		flex-wrap: nowrap;
		justify-content: flex-start;
		align-items: baseline;
		align-content: stretch;
	}
	.form-text {width: 100%; padding-bottom: 5%;}
	.form-main {width: 100%; padding-left: 0;}
	.form-row input {width: -webkit-fill-available;}
	textarea {width: -webkit-fill-available;}
	input.bttn-base, .bttn-green {width: -webkit-fill-available;}
	
}

@media only screen and (max-width: 688px){
	
	.used-equipment { height: 441px;}
	.services {height: 560px;}
	.blog { height: 575px;}
	.blog-title  {font-size: 3.5vw!important;}
	.brands-title {font-size: 3.7vw!important;}
	.contact-bg {height: 430px;}
	
	.service-list-right {height: 90vw;}
	.list-wrap h3{ font-size: 2.4vw!important;}
	.list-wrap p{ font-size: 1.8vw;}
	
}

@media only screen and (max-width: 602px){
	/*	Home page CSS */
	.header { padding: 20px;}
	.logo img {  max-height: 45px;}
	nav.mobile{ left:-100%; width:100%;}
	
	.hero-content {height: 655px;}
	.hero-content h1 {font-size: 37px!important;padding-bottom: 25px; padding-top: 15%; width: 100%;}
	.hero-content a { font-size: 14px; padding: 15px 43px;}
	
	.used-equipment { height: 163vw;}
	.used-wrapper {padding: 19vw;flex-direction: column;flex-wrap: wrap; align-items: stretch; justify-content: space-between;}
	.used-left{padding-bottom: 27%; width: 80%;}
	.used-left h2 { font-size: 5.5vw!important;}
	.used-left a {font-size: 2.5vw !important;}
	.used-right ul li {font-size: 4vw ;}
	
	.services {  height: 142vw;}
	.used-serv-image img {width: 70%; padding: 0% 15%;}
	.used-serv-image { top: -19%;}
	.service-wrapper { padding: 19vw; top: -19%; flex-direction: column-reverse; flex-wrap: wrap; justify-content: space-between; align-items: flex-start;}
	.services-left{padding-top: 17%;}
	.services-left a { font-size: 2.3vw;}
	.services-right{width: 100%;}
	.services-right h2 { font-size: 5.5vw!important; text-align: left;}
	.services-right ul { padding: 5% 0;}
	.services-right ul li { font-size: 4vw; padding-bottom: 6px; text-align: left;}
	
	.blog { height: 302vw;}
	.blog-title-container {top: -2.5%;}
	.blog-title { font-size: 4.5vw!important; margin: 0% 20%;  padding: 4% 7%;}
	.blog-wrap { display: block; width: 60%; margin: 0 auto; padding-top: 8%;}
	.blog-col { width: 100%; padding-top: 3%; text-align: center;}
	.blog-col img { width: 100%;}
	.blog-content{ padding: 10%;}
	.blog-content p {font-size: 2vw; padding: 10px 19px;}
	.blog-content h3 {font-size: 3.5vw !important; padding-top: 25px;padding-bottom: 14px;}
	.blog-content a {font-size: 2.5vw; padding-bottom: 10%;}
	
	.brands {height: 42vw;}
	.brands-title { margin: 0% 20%;font-size:3.7vw!important; padding: 4% 7%; top: -18%; line-height: 31px;}
	.brands-wrap { padding-left: 20%;  padding-right: 20%;}
	
	.contact-bg {height: 168vw;}
	.contact-title { font-size: 5.5vw !important; padding-top: 13%;}
	.contact-wrap { flex-direction: column; flex-wrap: nowrap; align-items: center; align-content: stretch; padding: 20%;  padding-top: 10%;}
	.map { width: 100%; padding-top: 100%;}
	.contact-info-wrap { width: 100%; padding-top: 15%; padding-left: 0;}
	.contact-info{text-align: center;}
	.contact-info h3 { font-size: 4vw !important;}
	.contact-info p {font-size: 3vw !important;}
	
	.footer { padding: 20%; padding-bottom: 10%;}
	.column-wrap{ flex-direction: column; flex-wrap: wrap; justify-content: flex-start;  align-items: center; align-content: center;  text-align: center; width: 100%;}
	.column {  width: 78%; padding-bottom: 17%;}
	
	/******	CSS for other pages ******/
	.page-title h1 {font-size: 7vw!important; padding-top: 35%;}
	.coming-soon p{font-size: 3vw;}
	
	.blog-page-wrap{
		display: flex;
		flex-direction: column;
		flex-wrap: nowrap;
		justify-content: flex-start;
		align-items: center;
		align-content: center; padding-top: 6%; margin-top: 6%;}
	.blog-page-col {width: 90%; height: 100%;}
	/*	sub blog pages */
	.blog-header-img h1{font-size: 8vw!important; padding-bottom: 5%; padding-top: 26%; }
	.content-wrap h3{font-size: 18px!important;}
	.content-wrap p{font-size: 15px;}
	/*	end of sub blog pages */
	
	.contact-page-wrap{display: block;}
	.contact-map{width: 85%; margin: 0 auto; padding-top: 70%;}
	.contact-page-info-wrap {
		width: 70%;
		padding: 11%;
		padding-top: 18%;
		text-align: center;
		margin: 0 auto;
	}
	.contact-page-info h3 {
		font-size: 3.5vw!important;
		padding-bottom: 7px;
	}
	.contact-page-info p {
		font-size: 3vw;
		line-height: 4vw;
	}
	
	.about-us-wrap{text-align: center; }
	.team{flex-direction: column; }
	.team img {width: 50%;}
	.team p { text-align: center; width: 90%;}
	
	.service-list-right {height: 145vw;}
	.service-img-left {height: 36vw;}
	.service-img-left img {height: 36vw;}
	.list-wrap{padding: 8vw;}
	.list-wrap h3{ font-size: 3.1vw!important;}
	.list-wrap p{ font-size: 2.4vw;}
	
	.logo-wrap{width: 40%;}
	
	.ty-wrapper h2{font-size: 3.8vw!important; }
	.ty-wrapper p{font-size: 2.5vw;}

}

@media only screen and (max-width: 520px){
	.service-page-wrap{padding: 18vw 11vw;}
	.service-list-right {height: 172vw;}
	.list-wrap h3{ font-size: 3.5vw!important;}
	.list-wrap p{ font-size: 2.6vw;}
}

@media only screen and (max-width: 425px) {
	
	#menu-button{padding-top: 5%;}
	#menu-button a{padding: 6%;}
	.used-equipment { height: 172vw;}
	.services {height: 148vw;}
	.blog { height: 315vw;}
	.blog-title { font-size: 5.5vw!important;}
	.brands {height: 52vw;}
	.brands-title {  font-size: 5.2vw!important;}
	.contact-bg {height: 178vw;}
	.footer { padding: 20%; padding-bottom: 10%;}
	.column-wrap{ flex-direction: column; flex-wrap: wrap; justify-content: flex-start;  align-items: center; align-content: center;  text-align: center; width: 100%;}
	.column {  width: 78%; padding-bottom: 17%;}
	
	/*	sub blog pages */
	.content-wrap{ padding: 8% 7%;}
	.content-wrap h3{font-size: 15px!important;}
	.content-wrap p{font-size: 13px;}
	/*	end of sub blog pages */
    
	.service-list-right {height: 204vw;}
	.list-wrap h3{ font-size: 4vw!important;}
	.list-wrap p{ font-size: 3vw;}
	
	.about-us-wrap p { font-size: 15px;}
	.team-wrap{ padding: 8% 6%;}
	
	.manu-logos{padding-top: 10%;}
	.logo-wrap {width: 80%;}
	.logo-wrap p{font-size: 13px;}
	
	.form-text {padding-bottom: 11%;}
	.form-text h3 { font-size: 5vw !important;}
	.form-text p { font-size: 3.6vw;}
	.CaptchaMessagePanel { font-size: 3.6vw;}
	.CaptchaWhatsThisPanel a { font-size: 2.7vw;}

}


@media only screen and (max-width: 375px){
	
	nav.mobile{ left:-100%; width:100%;}
	
	.hero-content h1{font-size: 32px!important;}
	.hero-content a { font-size: 11px; padding: 14px 35px;}
	
	.used-equipment { height: 755px;}
	.used-wrapper {padding: 30% 20%;}
	.used-left h2 { font-size: 23px !important; margin-bottom: 27px;}
	.used-left a {font-size: 12px; padding: 12px 32px;}
	.used-right ul li {font-size: 18px;}
	
	.services {height: 731px;}
	.used-serv-image {top: -12%;}
	.service-wrapper { padding: 30% 20%; top: -14%;}
	.services-left a {font-size: 12px; padding: 13px 32px;}
	.services-right h2 { font-size: 24px !important;}
	.services-right ul li {font-size: 18px;} 
	
	.blog { height: 1239px;}
	.blog-wrap{padding-top: 14%;}
	.blog-title { font-size: 22px!important;}
	
	.brands { height: 240px;}
	.brands-title {  font-size: 19px!important; padding: 3% 9%; top: -18%;}
	
	.contact-bg { height: 740px;}
	.contact-title { font-size: 24px !important; padding-top: 20%;}
	.contact-info h3 { font-size: 17px !important;}
	.contact-info p {font-size: 13px;}
	
	.service-list-right {height: 254vw;}
	.list-wrap h3{ font-size: 4.5vw!important;}
	.list-wrap p{ font-size: 3.4vw;}
	
	/*	sub blog pages */
	.content-wrap p { font-size: 13px;}
	/*	end of sub blog pages */
}


@media only screen and (max-width: 320px){
	
	nav.mobile{ left:-100%; width:100%;}
	#menu-button{font-size: 30px; padding-top: 7%;}
	#menu-button a{padding: 8%;}
	.used-equipment { height: 770px;}
	.services {height: 708px;}
	.blog { height: 1122px;}
	.brands {height: 226px;}
	.contact-bg {height: 662px;}
}

