/***** 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 {
	background: #fff;
	overflow-x: hidden;
	line-height: 1.6;
}
h1{font-family: 'Teko', sans-serif; font-size: 56px; line-height: 56px;}
h2{font-family: 'Teko', sans-serif; font-size: 32px; line-height: 32px;}
h3{font-family: 'Teko', sans-serif; font-size: 22px; line-height: 22px;}
p{}
a{}
a:link, a:visited, a:active {text-decoration:none;}
a:hover {text-decoration:none;}


hr{border:#000 1px solid;}

html { scroll-behavior: smooth;}

/*--- HEADER STYLES ---------------------*/
header {}




/*---BODY--------------------------------*/
.home-main{background: url("../siteart/home.jpg") no-repeat; background-size: cover; background-position: top;}
.home-main-txt{width: 30%; }
.home-main .home-main-txt {
    position: relative;
    z-index: 1;
    height: 100%;
    padding: 14% 20% 14% 10%;
}
.home-main .home-main-txt :after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);
    transform-origin: 0 0%;
    transform: skew(-21deg);
    z-index: -1;
}

.home-main-txt h1{ 
	letter-spacing: 3px;
    font-weight: 800;
    color: #fff;
	font-style: italic;
}
.home-cta{
	text-align: left;
    width: 100%;
    display: flex;
}
.home-cta a{
	color: white;
	font-family: 'Teko', sans-serif;
    width: 90%;
    margin: 5% 0 0 0;
    border: 2px solid white;
    padding: 1% 0;
    text-align: center;
	font-size: 25px;
	font-style: italic;
    font-weight: 600;
    letter-spacing: 1px;
	 -webkit-transition:.4s ease-in; 
	-moz-transition:.2s ease-in;  
	-o-transition:.2s ease-in; 
	transition:.2s ease-in;
}
.home-cta a:hover{ background: #c2272d; border: 2px solid #c2272d;}
.inv-wrap{
	position: relative;
    margin: 5%;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
}
.polygon{
	position: relative;
    top: 37px;
    left: -8%;
    width: 30%;
    padding: 2%;
    height: 100%;
    background: #cccccc;
    transform-origin: 0 100%;
    transform: skew( -21deg);
    z-index: 1;
    text-align: center;
	box-shadow: -8px 8px;
}
.poly-wrap{
	width: 35.5%;
    margin-left: 70%;
    float: right;
    transform: translateY(-40px);
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-items: flex-end;
}
.polygon2{
	display: inline-flex;
    justify-content: flex-end;
    margin: 0;
    position: relative;
    z-index: 4;
    width: 50%;
}
.polygon2:before{
	content: '';
    position: relative;
    top: 0;
    left: 13px;
    width: 100%;
/*    padding: 18% 0;*/
    height: 100%;
    background: #cccccc;
    transform-origin: 0 100%;
    transform: skew( -23deg);
    z-index: 0;
    box-shadow: -8px 8px;
}
.polyfill{ 
	width: 50%;
/*    padding: 9% 0;*/
    height: 100%;
    background: #cccccc;
    box-shadow: 0px 8px;
    z-index: 2;
    position: relative;
}
.inv-disp{
	background: #f3f3f3; 
	z-index: 0; 
	display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
	padding: 5% 0 8% 0;
}
.inv-img{
	width: 30%;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
	padding-bottom: 2%;
}
.inv-img a{text-align: center; font-family: 'Teko', sans-serif;}
.inv-img p{
	font-size: 20px;
    font-style: italic;
    font-weight: 600;
    color: #c2272d;
}
.welcome{
	text-align: center;
    background: #c2272d;
    padding: 8% 5%;
    margin: 7% 5% 9% 5%;
	color: #cccccc;
    box-shadow: -8px 8px;
}
.welcome h2{padding-bottom: 2%; font-style: italic; color: white;}
.welcome p{font-family: 'Montserrat'!important; padding: 0 7%; color: white;}
.welcome-cta{
	text-align: left;
    width: 100%;
    display: flex;
}
.welcome-cta a{
	color: white;
	font-family: 'Teko', sans-serif;
    width: 18%;
    margin: 1% auto 0% auto;
    border: 2px solid white;
    padding: 0.7% 0;
    text-align: center;
    font-size: 18px;
    font-style: italic;
    font-weight: 600;
    letter-spacing: 1px;
    -webkit-transition: .4s ease-in;
    -moz-transition: .2s ease-in;
    -o-transition: .2s ease-in;
    transition: .2s ease-in;
}
.welcome-cta a:hover{color:#c2272d; background: white; }

.about-main{background: url("../siteart/parts.jpg") no-repeat; background-size: cover; background-position: top;}
.about-main-txt{width: 30%; margin-left: 56%;}
.about-main .about-main-txt {
    position: relative;
    z-index: 1;
    height: 100%;
    padding: 14% 10% 14% 4%;
	background: black;
    text-align: right;
}
.about-main .about-main-txt :after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);
    transform-origin: 0 0%;
    transform: skew(-21deg);
    z-index: -1;
}

.about-main-txt h2{ 
	letter-spacing: 3px;
    font-weight: 800;
    color: #fff;
	font-style: italic;
	padding-bottom: 4%;
}
.about-main-txt p{font-family: 'Montserrat'!important; color: white;}

/*=========================*/
/*     SUBPAGE HEADER      */
/*=========================*/
.page-main{position: relative; height: 200px; overflow: hidden;}

.page-img{
	background: url("../siteart/home.jpg");
    width: 100%;
    position: absolute;
    top: 0;
    left: 0px;
    height: 200px;
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    background-repeat: no-repeat;
}
.page-txt{
	width: 45%;
    top: 0;
    left: 0;
    text-align: left;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: baseline;
    align-content: stretch;
}

.page-main .page-txt {
    position: relative;
    z-index: 1;
    height: 100%;
}
.page-main .page-txt :after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.8);
    transform-origin: 0 0%;
    transform: skew(-21deg);
    z-index: -1;
}

.page-txt h1{ 
	letter-spacing: 4px;
    font-weight: 800;
    color: #fff;
	font-size: 48px;
	line-height: 48px;
	padding-left: 10%;
	font-style: italic;
}
/*==============================
		 SERVICE PAGE			
================================*/

.service{padding: 6% 6% 0 6%;}
.service h2{padding-bottom: 3%; font-style: italic;}
.service p{font-family: 'Montserrat';}

/*==============================
		   PARTS PAGE			
================================*/
.parts{padding: 6%;}
.parts h2{padding-bottom: 3%; font-style: italic;}
.parts p{font-family: 'Montserrat';}
.parts-img{
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: center;
	padding-top: 6%;
}
.parts-img img{width: 45%;}
/*==============================
		 ABOUT PAGE			
================================*/

.about{padding: 6% 6% 0 6%;}
.about h2{padding-bottom: 3%; font-style: italic;}
.about p{font-family: 'Montserrat';}

/*==============================
		 CONTACT PAGE			
================================*/
.contact-top{padding: 6%;}
.contact-top h2{padding-bottom: 3%; font-style: italic;}
.contact-top p{font-family: 'Montserrat';}
.contact-top a{color: black; -webkit-transition:.4s ease-in; -moz-transition:.2s ease-in;  -o-transition:.2s ease-in; transition:.2s ease-in;}
.contact-top a:hover{color:#c2272d;}
.contact-wrap{
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: center;
	background: #c2272d;
}
.contact-l{width: 50%; font-size: 20px; background: #c2272d;}
.contact-l h2{padding-bottom: 3%; letter-spacing: 2px; color: white; font-weight: 800; font-style: italic;}
.contact-l p{padding-bottom: 6%;}
.contact-r{width: 50%;}
.g-maps iframe{ height: 800px; width: 100%;}

/*==============================
		 THANK YOU PAGE			
================================*/
.ty-wrapper{padding: 10% 15%;}
.ty-wrapper h2{font-size: 35px; font-weight: 800; color:#c2272d;  letter-spacing: 2px; font-style: italic;}
.ty-wrapper p{font-size: 21px; font-family: 'Montserrat';}
.ty-wrapper a{color:black; -webkit-transition:.4s ease-in; -moz-transition:.2s ease-in;  -o-transition:.2s ease-in; transition:.2s ease-in;}
.ty-wrapper a:hover{color:#c2272d;  cursor:pointer;}



/*-------- FOOTER STYLES ----------------*/
footer{}

.footer-wrap {    
	width: 90%;
    background: #fff;
    padding: 5%;
    color: #000;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: flex-end;
}
.column-l{
	width: 60%;
	display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: baseline;
}
.column-l h3{padding-bottom: 4%; font-style: italic;}
.column-l a{font-size: 14px; font-family: 'Montserrat'; color: #c2272d; -webkit-transition:.4s ease-in; -moz-transition:.2s ease-in;  -o-transition:.2s ease-in; transition:.2s ease-in; padding-bottom: 1%;}
.column-l a:hover{color:#000;}
.col-50{
	display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: baseline;
    width: 50%;
}
.column-r{width: 40%;  text-align: right; font-family: 'Teko'; font-style:italic; font-weight: 600;}
.column-r a{ color: #000; -webkit-transition:.4s ease-in; -moz-transition:.2s ease-in;  -o-transition:.2s ease-in; transition:.2s ease-in;}
.column-r a:hover{color:#c2272d;}
.column-r img{width: 30%; padding-bottom: 2%;}

/*--------FORM STYLES--------------------*/
.contact-form{padding: 6%; text-align: center;}
.form-main{ color: #000;}
.form-row{font-family: 'Montserrat', sans-serif; font-size: 14px;}
.form-row input{ font-size: 17px; width:96%; margin-bottom: 15px; padding: 7px;font-family: 'Montserrat', sans-serif;}
.form-row h4{padding-bottom: 8px;}
input.radio{width: auto; font-family: 'Montserrat', sans-serif; }
textarea{width:96.5%; font-family: 'Montserrat', sans-serif; padding: 7px;  margin-bottom: 15px; font-size: 17px;}
input.bttn-base, .bttn-green {
	padding: 1% 0%;
    font-family: 'Teko', sans-serif;
	font-style: italic;
	font-weight: 600;
    background:#fff;
    text-decoration: none;
    border: black solid 1px;
	width:100%;
	font-size: 18px;
	letter-spacing: 2px;
	text-transform:uppercase;
	cursor: pointer;
}
.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: 'Montserrat', sans-serif;
	text-align: left;
	color: white!important;
}
.CaptchaWhatsThisPanel a {
    padding: 5px 5px 10px 5px;
    font-size: 12px;
	font-family: 'Montserrat', sans-serif!important;
    color: white !important;
}

@media only screen and (max-width: 1024px){
	.form-row input{font-size: 13px;}
	.formpage textarea{font-size: 13px;}
	input.bttn-base, .bttn-green{font-size: 13px;}
}
@media only screen and (max-width: 968px){
}
@media only screen and (max-width: 768px){
	.form-main {width: 100%; padding-left: 0;}
	.form-row input {width: -webkit-fill-available;}
	textarea {width: -webkit-fill-available;}
	input.bttn-base, .bttn-green { font-size: 13px; padding: 1.5% 0%; width: -webkit-fill-available;}
}
@media only screen and (max-width: 453px){
	.CaptchaMessagePanel { font-size: 3.6vw;}
	.CaptchaWhatsThisPanel a { font-size: 2.7vw;}
}



/*---------- RESPONSIVE STYLES ----------*/

@media only screen and (max-width: 2560px) {
	.home-main-txt h1{font-size: 90px; line-height: 90px;}
	.polygon2:before{ padding: 15% 0;}
	.polyfill{ padding: 7.5% 0;}
}

@media only screen and (max-width: 2250px) {
	.home-main-txt h1{font-size: 80px; line-height: 80px;}

}

@media only screen and (max-width: 2000px) {
	.home-main-txt h1{font-size: 70px; line-height: 70px;}
}

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

	.home-main-txt{height: 145px;}
	.home-main-txt h1{font-size: 62px; line-height: 62px;}

}

@media only screen and (max-width: 1440px) {
	.home-main-txt h1{font-size: 50px; line-height: 50px;}
	.polygon2:before{ padding: 18% 0;}
	.polyfill{ padding: 9% 0;}
	
	/*	footer  */
	.footer-wrap p{font-size: 14px;}	
}

@media only screen and (max-width: 1230px){
	.home-main-txt h1 {font-size: 45px;line-height: 45px;}
	.polygon{left: -9%;  width: 33%;}
}

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

	.home-main-txt h1{letter-spacing: 2px; font-size: 40px; line-height: 40px;}
	
	/*	footer  */
	.footer-wrap p{font-size: 12px;}
	
	/********	sub pages css  ********/
	.page-main{height: 130px;}
	.page-txt h1{font-size: 33px; line-height: 33px;}
	
	/*	contact page  */
	.contact-wrap{flex-direction: column;}
	.contact-form{padding: 8%;}
	.contact-l, .contact-r{width: 100%;}
	.contact-l h2{font-size: 22px; line-height: 22px;}
	.g-maps {background: #c2272d;}
	.g-maps iframe{height: 400px;}
	
}

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

	.home-img{background-size: cover;}
	.home-main-txt{
		display: flex;
		flex-direction: column;
		flex-wrap: nowrap;
		justify-content: center;
		width: 50%;
	}
	.home-main .home-main-txt{height: 260px;}
	.home-main .home-main-txt :after{background: rgba(0, 0, 0, 0.4);}
	.home-cta a{
		width: 60%;
    	margin: 4% 0 0 0;
		font-size: 21px;
	}
	.polygon h2{font-size: 25px;}
	.inv-img{width: 45%;}
	.welcome h2{font-size: 25px;}
	.welcome p{font-size: 14px;}
	.welcome-cta a{font-size: 16px;}
	.about-main-txt h2{font-size: 25px; line-height: 25px;}
	.about-main-txt { font-size: 15px; width: 45%; margin-left: 41%;}
	/*	footer  */
	.footer-wrap p{font-size: 12px;}
	
	/********	sub pages css  ********/
	.page-img{height: 130px;}
	.page-txt h1 { font-size: 27px; line-height: 27px;}
	
	/*	about page  */
	.about h2{font-size: 25px; line-height: 25px;}
	.about p{ font-size: 14px;}
	
	/*	parts page  */
	.parts h2{font-size: 25px; line-height: 25px;}
	.parts p{font-size: 14px;}
	
	/*	service page  */
	.service h2{font-size: 25px; line-height: 25px;}
	.service p{ font-size: 14px;}
	
	/*	contact page  */
	.contact-top h2{font-size: 25px; line-height: 25px;}
	.contact-top p{ font-size: 14px;}
	.g-maps iframe{ height: 350px;}
	
	/*	thank you  */
	.ty-wrapper {text-align: center; padding: 15%;}
	.ty-wrapper h2{font-size: 28px;}
	.ty-wrapper p{ font-size: 15px;}

}
	
@media only screen and (max-width: 768px) {
	.home-main-txt {height: 130px; }
	.home-main-txt h1{font-size: 30px; line-height: 30px;}
	
	/********	sub pages css  ********/
	/*	footer  */
	.footer-wrap p{font-size: 12px;}
}

@media only screen and (max-width: 650px){
	.home-main .home-main-txt{padding: 14% 10% ;}
	.home-main-txt{width: 80%; align-items: center;}
	.home-main .home-main-txt :after { transform: skew(0deg); background: rgba(0, 0, 0, 0.3);}
	.home-main-txt h1 {font-size: 40px;line-height: 40px;}
	.home-cta a{font-size: 21px; margin: 4% auto 0 auto;}
	.inv-wrap{margin: 11%;}
	.inv-img { width: 55%;}
	.polygon{ top: 25px; left: 21%; width: 50%;}
	.inv-disp{padding: 10% 0;}
	.poly-wrap{display: none;}
	.welcome{ margin: 7% 10% 13% 10%;}
	.welcome h2{padding-bottom: 4%;}
	.welcome-cta a{width: 37%; padding: 1%; margin: 3% auto 0% auto;}
	.about-main .about-main-txt :after{transform: skew(0deg); background: rgba(0, 0, 0, 0.4);}
	.about-main-txt{margin-left: 0; width: 72%;}
	.about-main .about-main-txt{background: rgba(0, 0, 0, 0.3);  padding: 14%; text-align: center;}
	/*	footer  */
	.footer-wrap{
		flex-direction: column;
		justify-content: center;
    	align-items: center;
		padding: 12% 5% 10% 5%;
	}
	.column-l{
		flex-direction: column;
		justify-content: center;
    	align-items: center;
	}
	.col-50{
		justify-content: center;
		align-items: center;
		width: 56%;
		padding-bottom: 15%;
		text-align: center;
	}
	.footer-wrap p{font-size: 12px;}
	.column-r{text-align: center;}
	.column-r img{width: 50%;}
	/********	sub pages css  ********/
	.page-txt h1{padding-left: 0; text-align: center; width: 100%;}
	.page-txt{width: 100%;}
	.page-main .page-txt :after{transform: skew(0deg);}
	
	/*	about us page  */
	.about { padding: 10% 10% 0 10%; text-align: center;}
	
	/*	parts page  */
	.parts {padding: 10%; text-align: center;}
	
	/*	service page  */
	.service { padding: 10% 10% 0 10%; text-align: center;}
	
	/*	contact page  */
	
	.contact-top { padding: 10%; text-align: center;}
	.contact-l{ padding: 3% 0;}
	.contact-l h2{padding-bottom: 5%;}
	
	/*	thank you  */
	.ty-wrapper {padding: 20%;}
	.ty-wrapper h2{font-size: 25px;}
	.ty-wrapper p{ font-size: 14px;}
	
	
}

@media only screen and (max-width: 500px){
	.home-main-txt{ height: 100px; padding-right: 0; }
	.home-main-txt h1 { font-size: 32px; line-height: 32px;}
	
	/*	footer  */
	
	/********	sub pages css  ********/
	.page-txt { align-items: center; }
	
}


@media only screen and (max-width: 453px){
	.home-main-txt{height: 135px;}
	.home-main-txt h1 { font-size: 30px; line-height: 30px; letter-spacing: 2px; }
	.home-cta a {font-size: 17px;}
	.polygon{box-shadow: -5px 5px;}
	.polygon h2 { font-size: 18px;}
	.inv-disp { padding: 16% 0;}
	.inv-img img{width: 85%;}
	.inv-img p{font-size: 17px;}
	.welcome h2 { font-size: 18px;}
	.welcome-cta a{width: 56%;}
	.about-main-txt h2{ line-height: 18px; font-size: 18px;}
	.about-main-txt p{font-size: 14px;}
	/*	footer  */
	.column-l h3{font-size: 17px; line-height: 17px;}
	.column-l a{font-size: 12px;}
	.col-50{width: 80%;}
	.column-r{width: 60%;}
	/********	sub pages css  ********/
	.page-txt {align-items: center; }
	
	/*	about page  */
	.about{padding: 15% 15% 0 15%;}
	.about h2{font-size: 18px; line-height: 18px; padding-bottom: 9%;}
	.about p { font-size: 13px;}
	/*	parts page  */
	.parts{padding: 15% 15% 2% 15%;}
	.parts h2{font-size: 18px; line-height: 18px; padding-bottom: 9%;}
	.parts p{ffont-size: 13px;}
	.parts-img{flex-direction: column; justify-content: center; padding-top: 16%;}
	.parts-img img{width: 100%; padding-bottom: 5%;}
	/*	service page  */
	.service{padding: 15% 15% 0 15%;}
	.service h2{font-size: 18px; line-height: 18px; padding-bottom: 9%;}
	.service p { font-size: 13px;}
	/*	contact page  */
	.contact-top{padding: 15%;}
	.contact-top h2{padding-bottom: 9%; font-size: 18px; line-height: 18px;}
	.contact-top p{ font-size: 13px;}
	.contact-l { padding: 10% 0;}
	.contact-l h2 { padding-bottom: 9%;}
	/*	thank you  */
	.ty-wrapper {padding: 22%;}
	.ty-wrapper h2{font-size: 20px;}
	.ty-wrapper p{ font-size: 13px;}

}

@media only screen and (max-width: 376px){
	.home-main-txt h1 { padding-bottom: 0; padding-left: 0; letter-spacing: 1px;}
	
	/* footer */
	.footer-wrap p { font-size: 10px;}
	
	/********	sub pages css  ********/
	
}

@media only screen and (max-width: 336px){
	
	
	/********	sub pages css  ********/
	/*	thank you  */
	.ty-wrapper { padding: 25% 23%;}
	.ty-wrapper h2{ line-height: 20px;}
}