@charset "UTF-8";

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


:root {
	--white: #fff;
	--nearwhite: #f5f5f5;
	
	--offwhite:#fcfaf6;
	
	--blue: #3969b2;
	--altblue: #062d6c;
	--darkblue: #071935;
	--altdarkblue: #0a1f3f;
	
	--yellow: #fecd08;
	--darkyellow:#CCAD2F;
	
	--red:#D8090D;
	
	--lightgray: #c7c7c7;
	--gray: #353535;
	--lightblack: #2d2d2d;
	--black: #070707;
}

/* GLOBAL SITE FRAMEWORK
------------------------------------------------*/
body {font-size:100%; font-family: "lato", sans-serif !important; background:var(--offwhite);}

/* SELECTION */	
::selection {color:var(--white); background:var(--blue);}


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

em {font-style:italic;}
strong {font-weight: 700;}
.center {text-align:center;}





a.yellow-pill {display:inline-block; position:relative; padding:18px 65px 20px 40px; font-size:20px; line-height:1; font-weight:700; color:var(--black) !important; border-radius:30px; background:var(--yellow); transition:.33s ease-in;}
a.yellow-pill::after {content: "\f105"; position: absolute; top:19px; right:18px; font-size:18px; color:var(--gray); font-family: FontAwesome; transition:.3s ease-in;}
a.yellow-pill strong {font-weight:800; }
a.yellow-pill:hover {color:var(--gray) !important; background:var(--darkyellow); }
a.yellow-pill:hover::after {content: "\f101"; right:16px;}



a.blue-pill {display:inline-block; position:relative; padding:18px 65px 20px 40px; font-size:20px; line-height:1; font-weight:400; color:var(--white) !important; border-radius:30px; background:var(--blue); transition:.33s ease-in;}
a.blue-pill::after {content: "\f105"; position: absolute; top:19px; right:18px; font-size:18px; color:var(--white); font-family: FontAwesome; transition:.3s ease-in;}
a.blue-pill:hover {color:var(--white) !important; background:var(--altblue); }
a.blue-pill:hover::after {content: "\f101"; right:16px;}

/*Wake up, Neo... The Matrix has you... Follow the white rabbit. Knock, knock, Neo.*/

a.red-pill {display:inline-block; position:relative; padding:18px 65px 20px 40px; font-size:20px; line-height:1; font-weight:600; color:white !important; border-radius:30px; background:red; transition:.33s ease-in;}
a.red-pill:hover {color:white !important; background:darkred; }





/* HEADER
------------------------------------------------*/	
.head-top {padding:15px 5%; font-size:18px; font-weight:300; text-align:right; color:var(--white); background:var(--blue);}	

.head-top a {position: relative; transition:.33s ease-in;}
.head-top a[target="_blank"]::before {content: "\f3c5"; position: absolute; top:1px; left:-28px; font-size:23px; color:var(--yellow); font-family: FontAwesome; transition:color .33s ease-in;}
.head-top a[href^="tel:"] {margin:0 0 0 65px;}
.head-top a[href^="tel:"]::before {content: "\f095"; position: absolute; top:2px; left:-33px; font-size:23px; color:var(--yellow); font-family: FontAwesome; transition:color .33s ease-in;}

.head-top a:hover {opacity:.65; ;}
.head-top a:hover::before {color:var(--altblue);}

.site-header {display:flex; flex-flow:row wrap; align-items:center; justify-content:space-between; padding:13px 5%;}	
	

/* LOGO
------------------------------------------------*/	
.logo {}	
.logo img {max-width:100%;}




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

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

nav.primary ul {display:flex; flex-flow:row wrap; align-items:center; justify-content:flex-end; margin:0; padding:0;}
nav.primary ul li {margin:0; padding:0; list-style-type:none; }
				
nav.primary ul li a {
	display:block; margin:0 5px; padding:20px 30px;
    font-size:18px; line-height:1; font-weight:900; text-align:center; text-decoration:none; text-transform:uppercase; color:var(--altblue); transition:.5s ease-in;	
}	

nav.primary ul li a.highlight-link {border-radius:35px; background:var(--yellow);}
nav.primary ul li:last-of-type a {margin-right:0; padding-right:0;}
nav.primary ul li a:hover {color:#121212;}

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

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

/*  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 {background:var(--nearwhite);}


.hero-main::before {content:url("/siteart/diesel-engine-build-on-stand.png"); position: absolute; z-index:2; right:0; top:-25px; }
.hero-main {position:relative; margin-bottom:5%; height:330px; background:var(--darkblue) url("/siteart/hero-engine-build-background.jpg") no-repeat right;}
.hero-main::after {content:""; position: absolute; z-index:1; top:0; left: 0; width:100%; height:100%; background:var(--darkblue); background: linear-gradient(90deg, rgba(7, 25, 53, 1) 0%, rgba(7, 25, 53, 1) 55%, rgba(7, 25, 53, 0) 100%);}

.hero-main .hero-body {
	position:relative; z-index:10; box-sizing:border-box; display:flex; flex-flow:column wrap; align-items:flex-start; justify-content: space-between; 
	width:calc(85% - 700px); min-width: 765px; height:100%; margin:0 0 0 5%; padding:25px 0; font-size:28px; line-height:40px; font-weight:300; color:var(--offwhite);
}


.hero-main h1 {position:relative; z-index:10; margin:0; font-size:68px; font-weight:900; text-transform:uppercase; color:var(--lightgray);}
.hero-main h1 span {color:var(--yellow);}

.hero-main p {margin:0 0 auto 0; text-shadow:0 0 5px rgba(0,0,0,0.8);}




.services-section {display:flex; flex-flow:row wrap;}

.services-hero {overflow:hidden; width: 58%; border-top-right-radius:175px; background:black; }
.services-hero img {object-fit:cover; width:100%; height:100%; aspect-ratio:1.81 / 1;}

.services-highlight {box-sizing:border-box; width:42%; padding:15px 5% 0 0;}

.services-desc {display:flex; flex-flow:row wrap; align-items:center; margin-bottom: 48px;}
.services-desc p {flex:1; font-size:25px; font-weight:300; color:var(--lightblack); }
.services-desc strong {font-size:30px; font-weight:700;}

.services-icon {width:fit-content; margin:0 30px 0 -48px; padding:33px 25px; border:10px var(--nearwhite) solid; border-radius:50%; background:var(--blue);}
.services-icon img {max-width:100%;}





/*  MAIN
------------------------------------------------*/	
.main {margin:8rem 8.5%;}
.inv-main {padding:50px 5%; background:var(--white);}

/*  ARTICLE
------------------------------------------------*/
article {}

article h1 {position:relative; margin:0 0 45px 0; font-size:calc(40px + 1vw); line-height:.9; font-weight:900; text-transform: uppercase; text-align:center; color:var(--blue);}
article h1::after {content:""; position:absolute; right:0; bottom:-18px; left:0; margin:auto;  width:80px; height: 3px; background:var(--darkblue);}
article h2 {margin:0 0 15px 0; font-size:28px; font-weight:400; text-align:center; text-transform: capitalize; font-style: italic; color:var(--gray);}
article h3 {margin:0 0 15px 0; font-size:33px; line-height:1.2; font-weight:800; color:var(--darkblue);}
article p {font-size:22px; line-height:33px; font-weight:300;}

article ul {list-style: inside; margin:0 0 0 45px;}
article ul li {font-size:22px; line-height:30px; font-weight:300;}

article .article-map {border-radius:15px; overflow:hidden; border:1px var(--lightgray) solid; line-height: 0;}




.company-preview-section {margin:calc(6.5% + 50px) 0 25px 0;}
.company-preview-section h2 {margin:0 5%; font-size:calc(40px + 1vw); line-height:.9; font-weight:900; text-transform: uppercase; text-align:center; color:var(--blue);}
.company-preview-section h2 span {font-size:33px; font-weight:400; text-transform: none;  font-style: italic; color:var(--gray);}

.company-preview-item {display:flex; flex-flow:row wrap; justify-content: center; margin:170px 0 80px 0;}

.cpi-image {z-index:1; overflow:hidden; width:650px; height:505px; margin:-75px -45px; border-radius:30px; box-shadow: 5px 5px 15px 0px rgba(0,0,0,0.13);}
.cpi-image img {object-fit: contain;}

.cpi-desc {
	z-index:5; box-sizing: border-box; display:flex; flex-flow:column wrap;align-items:flex-start; justify-content:space-between;
	width:650px; height:540px; /*margin:-30px -80px 0;*/ padding:30px 45px; border-radius:30px; background:#fff;
	box-shadow: 5px 5px 38px 0px rgba(0,0,0,0.13); 
}
.cpi-desc h3 {font-size:28px; font-weight: 800;}
.cpi-desc p {margin:20px 0 auto 0; font-size:22px; line-height:30px; font-weight:300;}
.cpi-desc p strong {font-weight:500;}

.company-preview-item:last-of-type {margin:80px 0 170px 0;}
.company-preview-item:last-of-type .cpi-image {margin:75px -45px;}



















h4.trust-title {width:100%; margin:0 0 45px 0; font-size:42px; line-height:1.2; font-weight:600; text-align: center; color:var(--darkblue);}
h4.trust-title strong {font-weight:900; }

.trust-signals-section {display:flex; flex-flow:row wrap; align-items:center;}
.trust-item {box-sizing:border-box; display:flex; flex-flow:row; align-items:center; width:50%; padding:25px 5%; font-size:26px; line-height:1; font-weight:300; color:var(--white); background:var(--darkblue);}
.trust-item img {margin-right:25px;}
.trust-item strong {font-weight:500;}

.trust-item:nth-child(odd) {padding-left:13.5%;}

/* items one and two - top row*/
.trust-item:nth-child(4n-2), .trust-item:nth-child(4n-3) {}

/* items three and four - bottom row*/
.trust-item:nth-child(4n), .trust-item:nth-child(4n-1) { background:var(--altdarkblue);}























.location-contact-block {
	display:flex; flex-flow:row wrap; 
	margin:140px 0 0 15%; padding:75px 0 0 5%; border-top-left-radius:200px; background:var(--white); box-shadow: 5px 5px 15px 0px rgba(0,0,0,0.13);}

.lc-title {width:100%; font-size:36px; line-height:1.2; font-weight:900;  color:var(--gray);}
.lc-title span {font-size:26px; color:var(--blue);}

.lc-body {box-sizing:border-box; width:455px; padding:130px 4.5% 0 0; font-size:23px; line-height: 36px;}
.lc-body span {font-size: 22px; font-weight:300;}

.lc-body-address {margin-bottom:60px; idth:100%; font-weight:500;}

.lc-body-hours {margin-bottom:60px;display:flex; flex-flow:row wrap; align-items:center; justify-content: space-between;}
.lc-body-hours div {width:50%;}

.lc-body-phone {display:flex; flex-flow:row wrap; align-items:center; justify-content: space-between; width:100%; margin-bottom:75px;}
.lc-body-phone span,
.lc-body-phone a{width:50%;}


.lc-map {width:calc(100% - 455px); overflow:hidden; border-top-left-radius:60px; line-height:0;}
.lc-map iframe {width:100%; height:100%;}




/*  FOOTER
------------------------------------------------*/
.site-footer {display:flex; flex-flow:row wrap; align-items:flex-start; justify-content: space-between; padding:45px 8.5% 65px 8.5%; color:var(--nearwhite); background:#071935; }

.foot-contact {margin:0 auto 0 0; }

.foot-logo {margin:0 0 25px 0;}
.foot-logo img {max-width:100%;}
.foot-intro {max-width:340px; margin:0 0 45px 0; font-size:17px; line-height:21px; font-weight:300;}
.foot-phone {font-size:18px;font-weight:400;}


.foot-nav {margin: 0 8% 0 0; font-size:24px;font-weight:900;}
.foot-nav:last-of-type {margin:0;}

.foot-nav ul li {list-style:none;}
.foot-nav ul li a {font-size:18px;font-weight:400;}

.foot-copyright {margin:85px 0 0 0; width:100%; font-size:15px; font-weight:500;}


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

@media screen and (max-width: 1500px) {
	nav.primary ul li a {padding:20px 20px; font-size:15px;}	
}
@media screen and (max-width: 1375px) {
	.cpi-image {width: 500px;}
}

@media screen and (max-width: 1300px) {
	.site-header {padding: 13px 3.5%;}
	

	.hero-main::before {content:none;}
	.hero-main {position:relative; padding:0; margin-bottom:6.5%; height:auto; background:var(--darkblue) url("/siteart/hero-engine-build-background.jpg") no-repeat center; background-size: cover;}
	.hero-main::after {content:""; position: absolute; z-index:1; top:0; left: 0; width:100%; height:100%; background:var(--darkblue); background: linear-gradient(90deg, rgba(7, 25, 53, 1) 0%, rgba(7, 25, 53, 1) 15%, rgba(7, 25, 53, 0) 100%);}
	.hero-main .hero-body {
		position:relative; z-index:10; box-sizing:border-box; display:flex; flex-flow:column wrap; align-items:flex-start; justify-content: space-between; 
		width:100%; min-width: 0; height:auto; margin:0; padding:25px 5%; font-size:28px; line-height:40px; font-weight:300; color:var(--offwhite); background:rgba(7, 25, 53, .7); 
	}

	.hero-main h1 {margin:0; font-size:60px; line-height:1.2;}
	.hero-main p {margin:30px 0 60px 0; text-shadow:0 0 5px rgba(0,0,0,0.8);}
}

@media screen and (max-width: 1200px) {
	
	.company-preview-item {flex-flow: column wrap; align-items: center;}
	.company-preview-item:last-of-type {margin:170px 0;}
	.cpi-image {order:1; width:630px;}
	.company-preview-item:last-of-type .cpi-image {margin:-75px -45px;}
	.cpi-desc {order:2; width:680px;}
	
	.trust-item {font-size:20px;}

	
	
	nav.primary{display:none;}
	
	.mobilelink {display:inline-block;}

 	.mobilelink a.highlight-link {display:block; margin:0 5px; padding:20px 30px;
    font-size:18px; line-height:1; font-weight:900; text-align:center; text-decoration:none; text-transform:uppercase; color:var(--altblue); transition:.5s ease-in;	 border-radius:35px; background:var(--yellow);}
	
	
	#menu-button{ display: block; font-size: 18px; line-height:60px; position: relative; z-index:400;}
	#menu-button a{padding:0; font-weight:900; text-decoration: none; color:var(--darkblue); cursor:pointer;}
	
	nav.mobile ul li a .fa{
		width:25px;
		font-weight:100;
		padding:8px 3px;
		margin:0 0 0 5px;
		text-align:center;
		background:#292929;
		border-radius: 30px;
		text-shadow: 1px 1px 1px rgba(0,0,0,0.3);
	}
	
	nav.mobile ul li .fa-chevron-down {position:absolute; right:10px; margin:18px 0 0 0;}

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

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

	.services-hero {order:2; width:100%;}

	.services-highlight { width:100%; padding:15px 5% 0 0;}

	.services-desc {display:flex; flex-flow:row wrap; align-items:center; margin-bottom: 48px;}
	.services-desc p {flex:1; font-size:25px; font-weight:300; color:var(--lightblack);}
	.services-desc strong {font-size:30px; font-weight:700;}

	.services-icon {width:fit-content; margin:0 30px; padding:33px 25px; border:10px var(--nearwhite) solid; border-radius:50%; background:var(--blue);}
	.services-icon img {max-width:100%;}

	
	
	
	
	
	
	
	
	.trust-item {justify-content:center; width:100%; padding:25px 8.5% 25px 8.5%; font-size:26px;}	
	.trust-item p {width:65%;}
	.trust-item:nth-child(4n), .trust-item:nth-child(4n-1) { background:inital;}
	.trust-item:nth-child(odd) {padding-left:8.5%; background:var(--altdarkblue);}
	.trust-item:nth-child(even) {background:var(--darkblue);}
	
	
	
	
	
	.location-contact-block {margin:110px 0 0 5%; padding:65px 0 0 8.5%; border-top-left-radius:100px;}
	.lc-body {width:475px; padding:70px 4.5% 0 40px; font-size:22px; line-height: 33px;}
	.lc-body span {font-size: 21px;}
	.lc-body-address {margin-bottom:50px; idth:100%; font-weight:500;}
	.lc-body-hours {margin-bottom:50px;}
	.lc-body-phone {margin-bottom:55px;}
	.lc-map {width:100%; height:450px; border-top-left-radius:15px;}
	
	
	
	
	.foot-contact {margin:0 auto 45px 0; width:100%;}
	.foot-nav {box-sizing:border-box; width:50%; margin:0; padding:0 3% 0 0;}
}

@media screen and (max-width: 768px) {
	.company-preview-item {flex-flow:row  wrap; margin: 80px 0;}
	.company-preview-item:last-of-type {margin: 80px 0 120px 0;}
	.cpi-image {order:1; margin:0; width:100%; height:505px; border-radius:0; box-shadow: 5px 5px 15px 0px rgba(0,0,0,0.05);}
	.company-preview-item:last-of-type .cpi-image {margin:0;}
	.cpi-desc {order:2; display:flex; width:auto; height:auto; margin:-85px 7% 0 7% !important;}
	.cpi-desc p {margin:20px 0 30px 0;}
	
}

@media screen and (max-width: 768px) {	
	.head-top a span {display:none;}
}

@media screen and (max-width: 550px) {	
	.mobilelink {display:none;}
	
	
}

@media screen and (max-width: 500px) {
	a.yellow-pill {font-size:18px;}
	.cpi-image {height: auto;}
	.cpi-image img {object-fit:none; width:100%; margin:0 auto;}
	.cpi-desc {margin:-85px 3.5% 0 3.5% !important;}
	.cpi-desc h3 {font-size:28px;}
	
	
	.trust-item p {width:auto;}
	
	.lc-body-hours,
	.lc-body-phone {margin-bottom:50px;display:flex; flex-flow:column wrap; align-items:flex-start; justify-content: space-between;}
	.lc-body-hours div {width:100%;}
	.lc-body-phone span,
	.lc-body-phone a{width:100%;}
	
	
	.foot-nav {width:100%; margin:0 0 35px 0; padding: 0;}
}

@media screen and (max-width: 475px) {
	.services-highlight { padding:15px 5% 0;}
	.services-desc {flex-flow:column wrap; align-items:center; justify-content:center; text-align: center;}
	.services-hero {display:none;}
	
	
	
}

@media screen and (max-width: 380px){
	.company-preview-section h2 {margin:0 5%; font-size:calc(30px + 1vw);}
}