﻿/*===================== 
	Color information
	
	-
	-
	-
	-
		 
=======================*/
/*===================== 
	CSS reset/normalize 
=======================*/

/**Correct `block` display not defined in IE 8/9.**/
article,aside,details,figcaption,figure,footer,header,hgroup,
main,nav,section,summary {display: block;}
pre {white-space: pre-wrap;}
small { font-size: 80%;}


/*===================== 
	@Font-Face 
=======================*/


/*===================== 
	base styles 
=======================*/

html {
    font-family: Arial, sans-serif; /* 1 */
    -ms-text-size-adjust: 100%; /* 2 */
    -webkit-text-size-adjust: 100%; /* 2 */
	}

body {
    margin: 0;
	}

svg:not(:root) {overflow: hidden;/*reset*/}
	
/* clear floats */ 
.group:before,
.group:after {content: ""; display: table;} 
.group:after {clear: both;}
.group {zoom: 1;}	
.clear { clear: both;}
	
/*image replacement*/
.hide-text {
	text-indent:  100%;
	white-space:  nowrap;
	overflow:  hidden;
	}	

hr {
    -moz-box-sizing: content-box;
    box-sizing: content-box;
	border-style: solid;
    height: 0;
	} 

img { border: 0;} 
	
a{
	text-decoration: none;
}




/*===================== 
	HEADER STYLES
=======================*/
.header {
	margin: 0 auto;
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	}
.navlogosection{
	padding: 20px 0px 20px 10%;
}
.headernavsection{
	padding-right: 10%;
}
.topnavsection{
	background-color: #000;
	display: flex;
	padding: 25px 10%;
	justify-content: space-between;
	color: #fff;
	font-family: 'Open Sans', sans-serif;
}
.topnavsection a{
	color: #fff;
	font-family: 'Open Sans', sans-serif;
	text-transform: uppercase;
	padding: 0px 5px;
	font-weight: 600;
	font-size: 15px;
}
.topnavsection a:hover{
	color:#DD1F17;
	text-decoration: none;
}
	
/*===================== 
	hero styles 
=======================*/
.heroimage{
	background: url("../siteart/heroimage.jpg");
	background-color: #000000;
	background-repeat: no-repeat;
	background-size: cover;
	height: 500px;
	background-position: center;
}
.heroheader{
	font-family: 'Open Sans', sans-serif;
    font-size: 30px;
	color: #fff;
	font-weight: 800;
	text-transform: uppercase;
	padding-left: 10%;

}
.redbox{
	border: 2px solid #DD1F17;
	max-width: 500px;
	margin: 20px 10%;
	height: 20px;
}
.herotext{
padding-left: 10%;
font-family: 'Open Sans', sans-serif;
font-size: 15px;
color: #fff;
font-weight: 600;
padding-bottom: 6%;
	
}
.herotextsection{
    width: 51%;
    padding: 16vh 0% 0% 0%;
}
/*===================== 
	explore section styles 
=======================*/
.exploreused{
	background: url("/siteart/used-equip-button.jpg");
	background-repeat: no-repeat;
	background-size: cover;
}
.explorenew{
	background: url("/siteart/new-equip-button.jpg");
	background-repeat: no-repeat;
	background-size: cover;
}
.exploreparts{
	background: url("/siteart/partsandservice.jpg");
	background-repeat: no-repeat;
	background-size: cover;
}
.explorebox{
	width: 20%;
	height: 300px;
	display: flex;
	align-items: flex-end;
	margin: 20px 10px 60px 10px;
}
.exploresection{
	display: flex;
    flex-wrap: wrap;
    justify-content: center;
	margin-top:50px;
}
.blackheader{
	color: #000;
	font-family: 'Open Sans', sans-serif;
    font-size: 25px;
	font-weight: 800;
	font-style: italic;
	text-transform: uppercase;
	
}
.center{
	width: 100%;
	text-align: center;
}
.smredbox{
	border: 2px solid #DD1F17;
    width: 5%;
	margin: 0% 45% 15px 45%;
	height: 20px;
}
.redexploretextsection{
	font-family: 'Open Sans', sans-serif;
	background-color: #DD1F17; 
	font-weight: 700;
	font-style: italic;
	text-transform: uppercase;
	color: #fff;
	padding: 10px 30px;
	width: 85%;
	font-size: 16px;
}
.redexploretextsection a{
	color: #fff;
}
.redexploretextsection a:hover{
	color: #000;
	text-decoration: none;
}
.blackexploretextsection{
	background-color: #000;
	padding: 7px 5px 10px 12px;
	width: 15%;
}
/*===================== 
	home page styles 
=======================*/

/* POPUP */

#popup .popup-window{
	padding: 30px;
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	
	max-width: 700px;
	width: 100%;
	background: #fff;
	box-shadow: 0 4px 4px 0 rgba(0,0,0,0.33);
	z-index: 10005;
	
	text-align: center;
    box-sizing: border-box;
}
#popup{
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0,0,0, 0.33);
	z-index: 10000;
}
#popup i {
    position: absolute;
    left: 31.25%;
    top: 11%;
    cursor: pointer;
    padding: 20px;
    z-index: 10;
    color: #fff;
	transition-duration: 0.2s;

}

.popuptext {
    width: 700px;
    height: auto;
    position: relative;
    left: 30%;
    top: 10%;
	transition-duration: 0.2s;
}

.popuptext img {
    width: 100%;
}


.hp-service-section{
	width: 100%;
	display: flex;
	height: 370px;
}
.hp-service-left{
	width: 40%;
	background-image: url("../siteart/serviceteam.jpg");
	background-size:cover;
	background-position: 35%;
}
.hp-service-right{
	width: 60%;
	background: #000;
	padding: 3% 4%;
}
.hp-service-img{
	width: 100%;
}
.redheader{
	color: #DD1F17;
	font-family: 'Open Sans', sans-serif;
    font-size: 25px;
	font-weight: 800;
	font-style: italic;
	text-transform: uppercase;
}
.hp-service-paragraph{
	color: #fff;
	line-height: 30px;
	font-size: 14px;
	font-family: 'Open Sans', sans-serif;
	padding-bottom: 20px;
}
.redbutton{
	color: #fff;
	 font-size: 15px;
	font-weight: 800;
	font-style: italic;
	background: #DD1F17;
	padding: 10px 50px;
	text-transform: uppercase;
}
.redbutton:hover{
	background: #fff;
	color: #DD1F17;
	text-decoration: none;
	
}
.paddingb30{
	padding-bottom: 30px;
}
.paddingt80{
	padding-top: 80px;
}
.paddingb50{
	padding-bottom: 50px;
}

/*===================== 
job employment styles 
=======================*/
.redline{
	border: 1px solid #DD1F17;
 
}
.employmentcontainer{
	padding: 50px;
}
.lgredheader{
	color: #DD1F17;
	font-family: 'Open Sans', sans-serif;
    font-size: 30px;
	font-weight: 800;
	font-style: italic;
	text-transform: uppercase;
	text-align: center;
}
.employment-boxes{
	border: 1px #a3a3a3 solid;
	margin: 20px 10%;
	padding: 10px 0px;
}
.jobtitlesubhead{
	text-align: center;
	font-family: 'Open Sans', sans-serif;
    font-size: 20px;
	font-weight: 800;
	font-style: italic;
	text-transform: uppercase;
	color: #000;
}
.jobdescription{
	text-align: left!important;
	padding: 0 10%;
}
.jobdescription span{
	font-weight: bold;
}
.application{
	font-size: 15px!important;
	font-weight: bold!important;
	text-align:center;
}
.emaillink{
	color: #000;
}
.emaillink:hover{
	color: #DD1F17;
	text-decoration: none;
}
/*===================== 
	contact page styles 
=======================*/
.contactheader{
	background-image: url("../siteart/contact-us-hero.jpg");
	background-color:#000000;
	background-position: center;
	background-size: cover;
	height: 380px;
	background-repeat: no-repeat;
	display: flex;
	align-items: center;
}
.whiteheader{
	padding-left: 10%;
	font-family: 'Open Sans', sans-serif;
    font-size: 30px;
	font-weight: 800;
	color: #fff;
	text-transform: uppercase;
}
.ctredbanner{
	background-color: #DD1F17;
    padding: 50px 10%;
    color: #fff;
	display: flex;
	justify-content: center;
    text-align: center;
}
.ctredinfosection{
    width: 25%;
    padding: 0px 20px;
}
.whitepara{
		font-family: 'Open Sans', sans-serif;
		line-height: 10px;

}
.whitebold{
	font-weight: 700;
	font-family: 'Open Sans', sans-serif;
	font-size: 14px;
	line-height: 10px;
	color: #fff;
}
.whitelink{
	color: #fff;
}
.whitelink:hover{
	text-decoration: none;
	color: #d5d5d5;
}
.ctmap{
	width: 100%;
	height: 400px;
}
.ctbwhalfsection{
	display: flex;
	text-align: center;

}
.ctwhtsection{
	background-color: #fff;
	width: 50%;
	padding: 40px 0px 50px 0px;

}
.ctblksection{
	background: #000;
	width: 50%;
	padding: 40px 0px 50px 0px;
}
.white{
	color: #fff;
}
.grey{
	color: #242424;
}
.ctgreypara{
	font-family: 'Open Sans', sans-serif;
	line-height: 10px;
	color: #242424;
}
.greylink{
	font-family: 'Open Sans', sans-serif;
	line-height: 10px;
	color: #242424;
}
.greylink:hover{
	color:#DD1F17;
	text-decoration: none;
}
.ctname{
		font-family: 'Open Sans', sans-serif;
	font-weight: 600;
}
/*===================== 
	form styles 
=======================*/
.ctformsection{
	padding: 2% 10%;
}
.fullformfield{
	width: 100%;
	padding: 7px 30px;
	margin-bottom: 15px;
}
.halfformfields{
	width: 49%;
	padding: 7px 30px;
	margin-bottom: 15px;
	
}
.marginrt20{
	margin-right: 22px;
}
.message{
	width: 100%;
	padding: 7px 30px;
	margin-bottom: 15px;
	height: 150px;
}
.width-100{
	width: 100%;
}
.center{
	text-align: center;
}
.submit{
	border: none!important;
	color: #fff;
	font-size: 13px;
	font-weight: 800;
	font-style: italic;
	background: #DD1F17;
	padding: 7px 30px;
	text-transform: uppercase;
	box-sizing: content-box;
	height: 25px;
}
.submit:hover{
	background: #000;
	color: #fff;
}
/*===================== 
service page styles 
=======================*/
.serviceheader{
	background: url("/siteart/service_hero.jpg");
	background-color:#000000;
	background-repeat: no-repeat;
	background-size: cover;
	height: 500px;
	background-position: center;
}


/*===================== 
parts page styles 
=======================*/

.partsheader{
	background: url("/siteart/parts_hero.jpg");
	background-color:#000000;
	background-repeat: no-repeat;
	background-size: cover;
	height: 500px;
	background-position: center;
}
.heroredbutton{
	color: #fff;
	font-size: 15px;
	font-weight: 800;
	font-style: italic;
	background: #DD1F17;
	padding: 12px 40px;
	text-transform: uppercase;
	box-sizing: content-box;
	height: 25px;
	margin-left: 10%;
}
.heroredbutton:hover{
	color: #DD1F17;
	text-decoration: none;
	background: #fff;
}
/*===================== 
maintenance page styles 
=======================*/
.maintenanceimage{
	background: url("/siteart/maintenance-tips-hero.jpg");
	background-color:#000000;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
    height: 380px;
    display: flex;
    align-items: center;
}
.manualsection{
	display: flex;
	justify-content: center;
    align-items: center;
	padding: 6% 0%;
}
.redmanualsection{
	font-family: 'Open Sans', sans-serif;
	background-color: #DD1F17; 
	font-weight: 700;
	font-style: italic;
	text-transform: uppercase;
	color: #fff;
	padding: 20px 30px;
	width: 85%;
	font-size: 16px;
}
.redmanualsection:hover{
	background: #000;
}
.redmanualsection a{
	color: #fff;
}
.redmanualsection a:hover{
	color: #fff;
	text-decoration: none;
}
.blackmanualsection{
	background-color: #000;
	padding: 18px 5px 19px 12px;
	width: 15%;
}
.manualbuttons{
	display: flex;
	width: 23%;
	margin-right: 20px;
	align-items: center;
}
/*===================== 
	lines page styles 
=======================*/

.linesheroimage{
	background: url("/siteart/lines-represented-hero.jpg");
	background-color:#000000;
	background-repeat: no-repeat;
	background-size: cover;
	height: 500px;
	background-position: center;
}

.lineherotextsection {
    width: 100%;
    padding: 20vh 0% 0% 0%;
}
.lineboxes{
	display: flex;
	border: solid 1px #000;
	padding: 2% 5%;
	margin: 4% 12%;
	height: 200px;
	align-items: center;
	width: 75%;
}
.linestextsection{
	padding-left: 40px;
	font-family: 'Open Sans', sans-serif;

}


/*===================== 
	about page styles 
=======================*/

.aboutinfosection{
	padding: 5% 10%;
	display: flex;
	align-items: center;
}
.aboutinfoleft{
	width: 45%;

}
.aboutimage{
	width: 90%;
}

.aboutinforight{
	width: 45%;
}
.aboutblacksection{
	background: #000;
	text-align: center;
	padding: 3% 10% 2% 10%;
}

.aboutpara{
	line-height: 28px;
	padding: 0% 10%;
	font-family: 'Open Sans', sans-serif;

}
.aboutteamfull{
	display: flex;
	padding: 2% 10%;
	align-items: center;
}
.employeephotofull{
	width: 15%;
}
.aboutteaminfofull{
	width: 80%;
	font-family: 'Open Sans', sans-serif;
	color: #242424;
}
.aboutteamname{
	text-transform: uppercase;
	font-weight: 800;
	font-size: 22px;
	line-height: 12px;
}
.aboutteamtitle{
	font-style: italic;
}
.aboutteamcontact{
	line-height: 11px;
	font-weight: 600;
}
.employeebio{
	padding-top: 13px;
}
.blkteamsection{
	background-color: #000;
	display: flex;
	font-family: 'Open Sans', sans-serif;
	justify-content: center;
	
}
.aboutemployeename{
	text-transform: uppercase;
	font-weight: 800;
	font-size: 18px;
	line-height: 12px;
	
}
.whtaboutteamboxes{
	color: #fff;
	text-align: center;
	padding: 2%;
		width: 20%;

}
.whtteamsection{
	display: flex;
	font-family: 'Open Sans', sans-serif;
	justify-content: center;
	
}
.aboutteamboxes{
	color: #242424;
	text-align: center;
	padding: 2%;
	width: 20%;
}
/*===================== 
	thank you styles 
=======================*/
.thankyoupadding{
	padding: 10% 20% 15% 20%;
}
.blacksubhead{
	font-family: 'Open Sans', sans-serif;
	font-size: 18px;
	padding-bottom: 20px;
}
.dkredbutton{
	border: none!important;
	color: #fff;
	font-size: 13px;
	font-weight: 800;
	font-style: italic;
	background: #DD1F17;
	padding: 10px 30px;
	text-transform: uppercase;
	box-sizing: content-box;
	height: 25px;
	text-decoration: none;
}
.dkredbutton:hover{
	background: #000;
	color: #fff;
	text-decoration: none;
}

.invbanner {
    background: #fff;
    padding: 15px 15% 25px 15%;
    text-align: center;
}
.invbanner h2{
    font-family: 'Open Sans', sans-serif;
    font-weight: 900;
    color: #DD1F17;
	font-size: 22px;
}

.invbanner p{
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    color: #000;
	font-size: 14px;
}
.invpadding{
	padding: 20px 0px;
}
/*===================== 
	footer styles 
=======================*/

.footer{
	width: 100%;
}
.footer-brands-section{
	border-top: solid 2px #000;
	display: flex;
	width: 100%;
	align-items: center;
    justify-content: center;

}
.footer-brands{
	width: 15%;
    padding: 15px 10px;
}
.brandlogo{
	width: 75%;
}
.footer-nav-section{
	background: #000;
	display: flex;
	padding: 10px 10%;
	justify-content: center;
}
.footer-nav-section a{
	color: #fff;
}
.footer-nav-section a:hover{
	color: #DD1F17;
	text-decoration: none;
}
.bottomfooter{
	background: #DD1F17;
	color: #fff;
	font-size: 10px;
	line-height: 12px;
	font-family: 'Open Sans', sans-serif;
	padding: 25px;
    text-align: center;
}
.bottom-footer-text a{
	color: #fff;
}
.bottom-footer-text a:hover{
	color: #000;
	text-decoration: none;
}
.footer-nav{
	width: 15%;
	padding-right: 20px;
}
.footer-logo-section{
	width: 25%;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}
.footer-logo{
	width: 62%;	
}
.footer-logo-top{
	width: 100%;
	text-align: center;
}
.redsubheader{
	color: #E71E00;
	font-family: 'Open Sans', sans-serif;
    font-size: 16px;
	font-weight: 800;
	font-style: italic;
	text-transform: uppercase;	
}
.wht-paragraph{
	color: #fff;
	font-family: 'Open Sans', sans-serif;
    font-size: 14px;
	line-height: 16px;
}
/*========================= 
	 Inventory Styles 
===========================*/

.list-top-section .list-title .list-listings-count{
	color: #DD1F17!important;
}

.list-content .media-buttons .print-this, .list-content .media-buttons .email-this{
	background: #DD1F17!important;
	color: #fff!important;
	padding: 8px 35px!important;
	border-radius: 0px!important;
	border: none!important;
	font-family: 'Open Sans', sans-serif!important;

}
.faceted-search-content .selected-facets-container .selected-facet{
	background: #DD1F17!important;
	color: #fff!important;
	border: none!important;
	font-family: 'Open Sans', sans-serif!important;

}
.price{
		color: #DD1F17!important;

}
.view-listing-details-link{
	background: #DD1F17!important;
	color: #fff!important;
	font-family: 'Open Sans', sans-serif!important;
}
.view-listing-details-link:hover{
text-decoration: none;
}
.list-content{
		font-family: 'Open Sans', sans-serif!important;

}
.list-top-section .list-title .list-title-text{
		font-family: 'Open Sans', sans-serif!important;

}
.list-content .list-error-container .info button{
	background: #DD1F17!important;
	color: #fff!important;
	font-family: 'Open Sans', sans-serif!important;
}
.list-content .list-error-container .info .selected-facet button{
	background: transparent!important;
	color: #000!important;
}
.mobile-option-bar .mobile-option-bar-filter{
			color: #DD1F17!important;

}
.faceted-search-content .mobile-done-button-container .mobile-done-button{
	background: #000!important;
	color: #fff!important;
	font-family: 'Open Sans', sans-serif!important;
}
.list-top-section .list-listings-count{
	color: #DD1F17!important;
}
/*========================= 
	 Responsive styles 
===========================*/

/*==========  Non-Mobile First Method  ==========*/


@media only screen and (max-width : 1640px) {
	.marginrt20 {
    margin-right: 16px;
}
		.halfformfields {
		width: 45%;
	}
	.fullformfield {
		width: 92%;
	}
	.message {
		width: 92%;
	}
	
	.ctredinfosection {
	width: 34%;
	}
}
@media only screen and (max-width : 1572px) {
	
	.manualbuttons{
		width: 28%;
	}
	
	.popuptext {
		left: 27%;
	}
	#popup i {
		left: 29.25%;
	}

}
@media only screen and (max-width : 1450px) {
	.footer-nav-section{
		padding: 10px 4%;
	}
.footer-nav {
    width: 18%;
    padding-right: 9px;
}
	.blackexploretextsection{
	padding: 7px 9px 10px 18px;
    width: 24%;	
	}

}



@media only screen and (max-width : 1348px) {
	.thankyoupadding{
		padding: 12vw 10% 22vw 10%;
	}
	.aboutteamfull{
		padding: 2%;
	}
	.employeephotofull {
    width: 30%;
	}
	.whtaboutteamboxes{
		width: 24%;
	}
	.aboutteamboxes{
		width: 24%;
	}
}
@media only screen and (max-width : 1298px) {
	.manualbuttons{
		width: 32%;
		margin-right: 9px;
	}
	.redmanualsection{
 	padding: 22px 12px;
    width: 85%;
    font-size: 14px;
	}
	.blackmanualsection {
    padding: 19px 1px 19px 10px;
    width: 18%;
}
}
@media only screen and (max-width : 1265px) {
	.redexploretextsection{
	    padding: 10px 14px;	
		font-size: 15px;
	}
	.ctredbanner {
	padding: 50px 0%;
	}
	.popuptext {
		left: 17.5%;
	}
	#popup i {
		left: 24.5%;
	}
	
}



@media only screen and (max-width : 1045px) {
	.blkteamsection{
		flex-wrap: wrap;
				padding: 20px 0px

	}
	.whtaboutteamboxes{
		width: 50%;
	}
	.whtteamsection{
		flex-wrap: wrap;
		padding: 20px 0px
	}
	.aboutteamboxes {
    width: 50%;
}
}
@media only screen and (max-width : 1024px) {
	.header{
		justify-content: center;
	}
.lineboxes {
    margin: 4% 3%;
    height: 230px;
    width: 94%;
}
	.explorebox {
		width: 30%;}
	.blackexploretextsection {
		padding: 6px 9px 10px 13px;}
}

@media only screen and (max-width : 992px) {
	.footer-logo {
    padding-bottom: 20px;
		width: 75%;
}
	.footer-nav-section{
	flex-wrap: wrap;
    padding: 15px 4%;	
	}
	.footer-nav {
    width: 24%;
    padding: 10px;
}

.footer-logo-section {
    width: 30%;
	padding-top: 15px;
}
.footer-brands {
    width: 18%;
    padding: 15px 10px;
}
	.brandlogo {
    width: 100%;
}
.ctredbanner {
    padding: 30px 0%;
	flex-wrap: wrap;
}
.ctredinfosection {
    width: 48%;
    padding: 15px 3px;
}
}
@media only screen and (max-width : 915px) {
	.manualsection{
		flex-wrap: wrap;
		padding: 6% 3%;
	}
	.manualbuttons {
    width: 100%;
    margin-right: 0px;
	margin-bottom: 20px;
}
	.redmanualsection {
    padding: 30px 12px;
    font-size: 17px;
}
	.blackmanualsection {
    padding: 30px 0px 29px 34px;
    width: 15%;
}
	.aboutinfosection{
		flex-wrap: wrap-reverse;
	}
	.aboutinfoleft {
    width: 100%;
}
	.aboutimage {
    width: 100%;
}
	.aboutinforight {
    width: 100%;
    padding-bottom: 24px;
}
	.aboutinfosection {
		padding: 5% 3%;}


	.popuptext {
		left: 3%;
		width: 90%;
		top: 4%;
	}
	#popup i {
		left: 3.5%;
		top: 4%;
	}
@media only screen and (max-width : 823px) {
	.herotextsection {
    width: 76%;
    padding: 14vh 0% 0% 0%;
	}
	.ctformsection {
    padding: 2% 4%;
}
	.invbanner{
	padding: 15px 4% 25px 4%;
	}
}
@media only screen and (max-width : 785px) {
.footer-nav {
    width: 33%;
    padding: 7px;
}	
	 .lineboxes {
    margin: 4% 2%;
    height: 250px;
    width: 96%;
}
.linesimage{
		width: 30%;
	} 
	.linebrandlogos{
		width: 100%;
	}
	.linestextsection {
    padding-left: 40px;
    width: 70%;
}
	.halfformfields {
    width: 45%;
	padding: 7px 18px;
}
	.marginrt20 {
    margin-right: 9px;
		
}
	.fullformfields{
	padding: 7px 18px;
	
	}
	.message{
	padding: 7px 18px;
	
	}
	}
@media only screen and (max-width : 700px) {
	.hp-service-section{
		flex-wrap: wrap;
		height: auto;
	}
	.hp-service-left{
		width: 100%;
		height: 250px;
	}
	.hp-service-right{
		width: 100%;
		padding: 7% 4%;
	}
	.explorebox{
		width: 100%;
		height: 180px;
    	margin: 11px 10px 10px 10px;
	}
	.exploreused{
		background-position: center;
	}
	.explorenew{
		background-position: center;
	}
	.blackexploretextsection{
		width: 10%;
	}
	.redexploretextsection{
		width: 90%;
	}
	.exploresection{
		margin-bottom: 60px;
	}
	.employment-boxes{
	  margin: 31px 4%;
		padding: 22px 30px;
	}
	.employmentcontainer {
    padding: 10px;
}
}
@media only screen and (max-width : 620px) {
	.topnavright{
		display: none;
	}
	.topnavleft{
		width: 100%;
		text-align: center;
	}
	.ctredinfosection {
		width: 100%;
	}
	.aboutblacksection{
		padding: 7% 4% 9% 4%;
	}
	.aboutpara{
		padding: 0%;
	}
	.aboutteamfull{
		flex-wrap: wrap;
		justify-content: center;
	}
	.employeephotofull {
    width: 100%;
    text-align: center;
}
	.aboutteaminfofull{
		width: 100%;
		text-align: center;
	}
	
	
}


@media only screen and (max-width : 550px) {
	.footer-nav {
    width: 45%;
    padding: 7px;
}
	.footer-logo-section {
    width: 60%;
    padding-top: 15px;
}
	.footer-logo {
    padding-bottom: 24px;
    width: 68%;
}
	.footer-brands {
    width: 29%;
    padding: 15px 10px;
}
	.footer-brands-section{
		flex-wrap: wrap;
	}
	.herotextsection {
    width: 98%;
    padding: 14vh 0% 0% 0%;
}
	.heroheader{
	padding-left: 6%;	
	}
	.redbox{
	margin: 20px 6%;
	}
	.herotext{
	padding-left: 6%;	
	}
	.halfformfields {
		width: 92%;}
	.message {
	padding: 7px 18px;
	}
	.fullformfield{
	padding: 7px 18px;
	}
	.ctbwhalfsection{
		flex-wrap: wrap;
		
	}
	.ctwhtsection{
		width: 100%;
	}
	.ctblksection{
		width: 100%;
	}
	.blackmanualsection {
    padding: 30px 0px 28px 20px;
	}
	.aboutteamboxes {
    width: 100%;
}
	.whtaboutteamboxes{
	width: 100%;	
	}
	}
@media only screen and (max-width : 500px) {
	.lineboxes {
    margin: 4% 2%;
    height: 40vh;
    width: 96%;
		padding: 2%;
	flex-wrap: wrap;
	align-content: center;
}
	.linesimage {
    width: 100%;
    text-align: center;
    padding-bottom: 25px;
}
	.linebrandlogos {
    width: 75%;
}
	.linestextsection {
    padding-left: 8px;
    width: 100%;
}
}
@media only screen and (max-width : 480px) {
.redexploretextsection {
    width: 83%;
}
	.blackexploretextsection {
    width: 17%;
	padding: 8px 13px 10px 20px;
}
}

@media only screen and (max-width : 415px) {
.footer-logo {
    padding-bottom: 24px;
    width: 65%;
}
.footer-logo-section {
    width: 86%;
    padding-top: 15px;
}
	.footer-nav-section {
    flex-wrap: wrap-reverse;
    padding: 15px 4%;
}
	.footer-nav {
    width: 100%;
    padding: 10px;
}
.hp-service-right {
    padding: 12% 4%;
}
.redbutton{
		padding: 10px 12px;
	}
.invbanner {
	padding: 15px 4% 0px 4%;
	}
.invbanner h2 {
	font-size: 18px;
	}
.invbanner p {
	font-size: 12px;
	}
	.invpadding {
    padding: 0px 0px;
}
}


@media only screen and (max-width : 395px) {
	.footer-brands {
		width: 45%;
	}
	.heroheader{
	padding-left: 2%;	
	}
	.herotext{
	padding-left: 2%;	
	}
	.redbox{
	margin: 20px 2%;
	}
	.redexploretextsection {
    width: 76%;
	    padding: 11px 14px;
}
	.blackexploretextsection {
    width: 24%;
    
}
	.marginrt20 {
    margin-right: 0px;
}
	.ctformsection {
    padding: 15% 2%;
}
	.fullformfield {
    width: 100%;
}
	.halfformfields {
    width: 100%;
}
	.message{
		width: 100%;
	}
	.submit {
	font-size: 12px;
	padding: 7px;
	}
.redmanualsection {
    padding: 32px 12px;
    font-size: 14px;
    width: 89%;
}
	.blackmanualsection{
		width: 15%;
		padding: 31px 0px 28px 7px;
	} 
	.aboutteamfull {
    padding: 10% 2%;
}
	.aboutteamcontact{
		line-height: 20px;
	}
	.aboutteamname{
		line-height: 20px;
	}
}
@media only screen and (max-width : 320px) {

.thankyoupadding {
    padding: 12vw 6% 22vw 4%;
}
	.blacksubhead {
    font-size: 15px;
}
	.dkredbutton{
		font-size: 11px;
	}
	.hp-service-right {
    padding: 22% 4%;
	}
	.whitepara{
		line-height: 20px;
	}
	.employment-boxes {
    margin: 31px 1%;
    padding: 22px 2px;
}
	.manualbuttons{
		flex-wrap: wrap;
	}
	.redmanualsection {
    padding: 22px 9px;
    font-size: 14px;
    width: 100%;
}
	.blackmanualsection {
    width: 100%;
    text-align: right;
    padding: 9px 25px 9px 7px;
}
	.greylink{
		font-size: 13px;
	}
}

@media only screen and (max-width : 285px) {
	.herotextsection {
    padding: 10vh 0% 0% 0%;
}
	.partsheader{
		height: 550px;
	}
	.heroredbutton{
		padding: 12px 6px;
		font-size: 12px;
	 	margin-left: 0%;
	}
}
@media only screen and (max-width : 249px) {
	.navlogosection img{
		width: 100%;
	}
	.topnavsection a{
		font-size: 13px;
	}
	.redsubheader{
		font-size: 14px;
		
	}
	.wht-footer-links{
		font-size: 13px;
	}
	.wht-paragraph{
		font-size: 13px;
	}
	.footer-logo {
    padding-bottom: 24px;
    width: 78%;
}
	.thankyoupadding {
    padding: 12vw 0% 22vw 2%;
}
	.dkredbutton {
	 padding: 10px 15px;
	}
	.footer-brands{
		width: 100%;
		    padding: 15px 14vw;
	}
	.linebrandlogos {
    width: 90%;
}
	.lineboxes{
		padding: 18% 2%;
		height: auto;
	}
	.linestext{
		font-size: 12px;
	}
	.heroheader{
		font-size: 18px;
	}
	.herotext{
		font-size: 13px;
	}
	.redbutton{
		font-size: 13px;
	}
	.hprentals{
		display: flex;
    justify-content: center;
    flex-wrap: wrap;
	}
	.smredbox{
		margin: 0% 2% 15px 2%;
		width: 45%;
	}
	.blackheader{
		font-size: 20px;
	}
	.explorebox{
		flex-wrap: wrap;
		align-content: flex-end;
	}
	.redexploretextsection{
		width: 100%;
	}
	.blackexploretextsection {
    width: 100%;
	text-align: right;
}
	.whiteheader {
		padding-left: 2%;}
	.aboutemployeename{
		line-height: 20px;
	}
	.whitelink{
		font-size: 13px;
	}
}
@media only screen and (max-width : 200px) {
	.redbutton {
    padding: 9px 0px;
}
	.hp-service-right {
    padding: 36% 0%;
}
	.whiteheader{
		font-size: 25px;
	}
	.herotextsection {
    padding: 3vh 0% 0% 0%;
}
}

