/***** 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; } 
/***** 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:link, a:visited, a:active { text-decoration: none; } a:hover { text-decoration: none; }
hr { border:#000 1px solid; }

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

.header { position: relative; z-index: 1004; width: 100%; display: flex; flex-direction: column; align-items: flex-start; margin-bottom: -50px; }
.header-main { position: relative; z-index: 2; display: flex; justify-content: center; align-items: flex-end; border-top: 8px solid #e9af10; padding: 8px 20px; box-sizing: border-box; background: #000; width: 100%; }
.header-banner { position: absolute; top: 0; left: calc(50% - 290px); margin: 0 auto; padding: 10px 80px; box-sizing: border-box; background: #e9af10; clip-path: polygon(0% 0%, 100% 0%, calc(100% - 40px) 100%, 40px 100%); }
.header-banner .header-banner-txt { font-family: 'Roboto Condensed', sans-serif; text-transform: uppercase; font-weight: 700; font-size: 38px; text-shadow: 1px 1px 0 rgba(255, 255, 255, .5), -1px -1px 0 rgba(255, 255, 255, .5), 1px -1px 0 rgba(255, 255, 255, .5), -1px 1px 0 rgba(255, 255, 255, .5); color: #000; }
.header-logo1 { margin-right: max(80px, 5vw); }
.header-logo2 { margin-left: max(80px, 5vw); }
.header-logo img { object-fit: contain; height: 120px; }
.header-soc { display: flex; justify-content: center; align-items: center; margin-bottom: 10px; }
.header-soc a.listed { margin: 0 8px; padding: 8px 12px; color: #fff; font-size: 15px; }
.nav-div { position: relative; z-index: 1; transform: skewX(-20deg); margin-left: -40px; padding-left: 70px; padding-right: 20px; box-sizing: border-box; height: 50px; display: flex; justify-content: flex-start; align-items: center; background: rgba(0, 0, 0, .6); }
.header-mobile-soc { display: flex; justify-content: center; align-items: center; height: 100%; }
.header-mobile-soc a.listed { color: #ddd; height: 100%; margin: 0; padding: 0 16px; font-size: 16px; background: rgba(144, 1, 12, 0); /* RED */ }
.header-mobile-soc a.listed i { font-size: 17px; width: 32px; height: 50px; display: flex; justify-content: center; align-items: center; }
.header-mobile-soc a.listed i.fa-whatsapp { font-size: 22px; font-weight: 400; }
.header-mobile-soc a.listed:hover { background: #90010c; }

/*---BODY--------------------------------*/
.bg-yellow { background: #e9af10; }
.bg-gray { background: #bbb; text-shadow: none; }
.bg-metal { background: #222; background-image: url('/siteart/bg-metal.jpg'); background-repeat: repeat; background-size: 20px; background-position: 0% 0%; box-shadow: inset 0 2px 10px #000; }
.bg-metal .title { text-shadow: 0 0 6px rgba(0, 0, 0, 6); }
.bg-metal p { text-shadow: 0 0 6px rgba(0, 0, 0, 6); }
.txt-white { color: #fff!important; }
.txt-default { font-family: 'Roboto', sans-serif; font-size: 15px; line-height: 1.3; color: #000; text-align: center; }

.title { font-family: 'Roboto Condensed', sans-serif; text-align: center; letter-spacing: .5px; color: #000; position: relative; margin-bottom: 40px; }
.title:after { position: absolute; content: ""; top: calc(100% + 6px); height: 6px; left: -40px; right: -40px; background: #90010c; }
h1.title { font-size: 40px; margin-left: 5%; margin-right: 5%; }
h2.title { font-size: 36px; margin-left: 5%; margin-right: 5%; }
h3.title { font-size: 24px; }
h4.title { font-size: 20px; }
.title span.title-sm { font-size: 20px; }

.subhero { width: 100%; height: 220px; padding: 54px 5% 0 5%; box-sizing: border-box; display: flex; justify-content: flex-start; align-items: flex-end; background: #bbb; background-image: url('/siteart/yard-hero1.jpg'); background-size: cover; background-position: center; background-repeat: no-repeat; }
.subhero h1 { color: #fff; text-align: left; text-shadow: 0 0 8px #000; margin: 0 0 40px 0; }
.subhero h1:after { left: 0; box-shadow: 0 0 8px #000; }

.content-sect { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 40px; box-sizing: border-box; }
.content-sect p { font-family: 'Roboto', sans-serif; font-size: 15px; line-height: 1.3; color: #000; text-align: center; margin-bottom: 10px; }
.content-sect .btnclass { margin: 10px 0; }
.content-sect .listed { margin: 10px 0; }

.horiz-soc { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; }
.horiz-soc .btnclass { margin: 10px 20px; }
.horiz-soc .listed { margin: 10px 20px; }
.map-div.fullmap { width: 100%; height: 280px; padding: 0; box-sizing: border-box; display: flex;
justify-content: center; }
.map-div.fullmap iframe { max-width: 2500px; }
.map-div iframe { border: 2px solid #000!important; box-sizing: border-box; }
.shadower-dark { filter: drop-shadow(1px 1px 3px #000); position: relative; z-index: 2; }
.shadower-lighter { filter: drop-shadow(1px 1px 3px rgba(0, 0, 0, 0.6)); position: relative; z-index: 2; }

.btnclass { font-family: 'Roboto Condensed', sans-serif; font-size: 20px; font-weight: 700; text-transform: uppercase; letter-spacing: .5px; text-align: center; color: #fff; background: #90010c; /* USE THIS RED */ padding: 8px 24px; box-sizing: border-box; display: flex; justify-content: center; align-items: center; overflow-wrap: break-word; box-shadow: 0 1px 4px rgba(0, 0, 0, .6); }
.btnclass i { margin-left: 12px; transition: .2s ease all; }
.btnclass:hover { background: #ad010f; /* HOVER RED */ color: #fff; }
.btnclass:hover i { margin-left: 22px; }
.btnclass.btn-black { background: #000; color: #fff; } 
.btnclass.btn-black:hover { background: #ad010f; color: #fff; } 
.btnclass.not-btnclass { color: #000; background: none; box-shadow: none; }
.btnclass.not-btnclass:hover { color: #fff; background: #ad010f; box-shadow: 0 1px 4px rgba(0, 0, 0, .6); }
.bg-metal .btnclass { box-shadow: 0 1px 6px #000; }
.listed { color: #000; font-family: 'Roboto Condensed', sans-serif; font-size: 20px; font-weight: 700; text-align: center; letter-spacing: .5px; padding: 8px 20px; box-sizing: border-box; display: flex; justify-content: center; align-items: center; transition: .25s ease all; overflow-wrap: break-word; }
.listed.listed-sm { font-size: 17px; letter-spacing: .2px; }
.listed i { width: 20px; text-align: center; margin-left: 6px; }
a.listed:hover { background: #ad010f; color: #fff; box-shadow: 0 1px 4px rgba(0, 0, 0, .6); }
a.invisilink { font-family: inherit; font-size: inherit; font-weight: 800; display: inline; color: #000; }
a.invisilink:hover { text-decoration: underline; }

.inv-btns-sect { display: flex; flex-direction: column; align-items: center; }
.inv-btns-sect .title { margin: 0 5% 40px 5%; }
.inv-btns { display: flex; justify-content: center; padding: 0 40px; box-sizing: border-box; width: 100%; }
.inv-btns a { display: flex; justify-content: center; align-items: flex-start; overflow: hidden; width: calc(20% - 5px); max-width: 320px; margin: 5px; height: 200px; border: 1px solid #ddd; position: relative; box-sizing: border-box; }
.inv-btns a img { width: 100%; height: calc(100% - 32px); object-fit: contain; object-position: center; padding: 12px 20px; box-sizing: border-box; position: relative; z-index: 1; }
.inv-btns a.all-inv { background-size: auto calc(100% + 12px); background-position: 0% -10px; background-repeat: no-repeat; background-origin: content-box; padding-bottom: 24px; }
.inv-btns a span { color: #000; font-family: 'Roboto Condensed', sans-serif; font-size: 20px; font-weight: 700; text-transform: uppercase; background: #e9af10; width: 90%; bottom: 0; height: 38px; padding: 6px 20px 0 20px; box-sizing: border-box; position: absolute; z-index: 2; display: flex; justify-content: center; align-items: flex-start; clip-path: polygon(20px 0%, calc(100% - 20px) 0%, 100% 100%, 0% 100%); transition: .15s ease all; }
.inv-btns a:hover span { height: 46px; transition: .3s ease all; }

/* Homepage - default.htm */
.yard-hero { width: 100%; height: 280px; position: relative; z-index: 1; background: #000; overflow: hidden; }
.cycle-slideshow { width: 100%; margin: 0 auto; height: 100%; z-index: 10; position: relative; }
.cycle-pager { display: none!important; }
.cycle-slide-active { display: flex!important; }
.slide { width: 100%; height: 100%; z-index: 5!important; display: flex; align-items: stretch; position: relative; transition: .4s ease all; }
.slide img { width: 100%; height: 100%; object-fit: cover; object-position: center; position: relative; z-index: 2; transition: .4s ease all; }

.pharr-wrapper { position: relative; z-index: 3; width: 100%; height: 500px; margin: -90px auto 0 auto; display: flex; justify-content: center; align-items: center; overflow: hidden; padding-top: 90px; padding-bottom: 80px; box-sizing: border-box; }
.pharr-gallery { position: relative; z-index: 4; width: 100%; height: 100%; }

.homepage.mission { display: flex; justify-content: center; padding: 40px 0 0 5%; box-sizing: border-box; }
.homepage.mission .content-sect { width: 50%; max-width: 1200px; padding-left: 0; }
.homepage.mission .missionimg { width: 50%; max-width: 1200px; padding-left: 40px; box-sizing: border-box; background-size: cover; background-position: center; background-repeat: no-repeat; clip-path: polygon(40px 0, 100% 0, 100% 100%, 0 100%, 0 70px); }
.homepage.contact-sect { display: flex; flex-wrap: wrap; justify-content: center; align-items: stretch; padding: 40px 5%; box-sizing: border-box; }
.homepage.contact-sect .content-sect { width: 100%; padding: 0 0  20px 0; }
.homepage.contact-sect .map-div { width: calc(100% - 480px); max-width: 1000px; }
.homepage.contact-sect .form-div { width: 420px; margin-left: 60px; }

/* contact-us.htm */
.contactpage { display: flex; flex-wrap: wrap; justify-content: center; align-items: flex-start; padding: 40px 0 0 0; box-sizing: border-box; }
.contactpage .shadower-dark { width: 50%; min-width: calc(460px + 5%); display: flex; justify-content: center; align-items: flex-start; padding: 0 40px 40px 5%; box-sizing: border-box; }
.contactpage .content-sect.bg-gray { width: 420px; clip-path: polygon(0 0, calc(100% - 40px) 0, 100% 70px, 100% 100%, 0 100%); }
.contactpage .form-sect { width: 50%; max-width: calc(95% - 460px); display: flex; flex-direction: column; align-items: center; justify-content: flex-start; padding: 0 5% 40px 40px; box-sizing: border-box; }
.contactpage .form-sect .content-sect { padding: 0; }

/* thank-you.htm */
.thankyoupage.inv-btns-sect { margin-bottom: 40px; }

/*--------FORM STYLES--------------------*/
.form-div { display: flex; flex-direction: column; align-items: center; padding: 0; box-sizing: border-box; width: 100%; }
.form-div form { display: flex; flex-wrap: wrap; justify-content: center; width: 90%; margin: 0; max-width: 600px; }
.form-div form .formrow { display: flex; justify-content: center; width: 100%; }
.form-div form .formrow-captcha { display: flex; flex-direction: column; align-items: center; width: 100%; }
.form-div form input[type="text"] { width: 100%; margin: 2px 0; padding: 9px 7px; box-sizing: border-box; color: #000; font-family: 'Roboto', sans-serif; font-size: 16px; border: 1px solid #000; }
.form-div form input[type="email"] { width: 100%; margin: 7px 0; padding: 7px 6px; box-sizing: border-box; color: #000; font-family: 'Roboto', sans-serif; font-size: 16px; border: 1px solid #000; }
.form-div form textarea { width: 100%; height: 110px; margin: 7px 0; padding: 7px 6px; box-sizing: border-box; color: #000; font-family: 'Roboto', sans-serif; font-size: 16px; border: 1px solid #000; }
.form-div form a:not(.invisilink) { margin: 12px auto 0 auto; cursor: pointer; }
.form-div form .CaptchaMessagePanel { font-family: 'Roboto', sans-serif!important; color: #fff!important; }
.form-div form #CaptchaAnswer { padding: 10px; box-sizing: border-box; color: #000; font-family: 'Roboto', sans-serif; font-size: 16px; border: 1px solid #000; }
.form-div form div.CaptchaWhatsThisPanel a { font-family: 'Roboto Condensed', sans-serif!important; color: #57b6ff!important; }
.form-div form div.CaptchaWhatsThisPanel a:hover { text-decoration: underline; }
form button[type="submit"] { border: none; cursor: pointer; }

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

.footer { display: flex; flex-direction: column; background: #e9af10; position: relative; z-index: 2; }
.foot-top { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; padding: 20px 28px 8px 28px; box-sizing: border-box; background: #bbb; margin-bottom: 20px; position: relative; z-index: 2; clip-path: polygon(0% 0%, 100% 0%, 100% calc(100% - 50px), calc(100% - 30px) 100%, 30px 100%, 0% calc(100% - 50px)); }
.foot-top .sect1120 { display: flex; justify-content: center; }
.foot-top .sect1000 { display: flex; justify-content: center; }
.foot-top a.btnclass { margin: 0 16px 16px 16px; padding-left: 16px; padding-right: 16px; }
.foot-bottom { width: 100%; display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: flex-start; padding: 40px 5%; box-sizing: border-box; background: #000; box-shadow: 0 0 4px #000; position: relative; z-index: 2; clip-path: polygon(30px 0%, calc(100% - 30px) 0%, 100% 50px, 100% 100%, 0 100%, 0% 50px); }
.foot-soc { display: flex; flex-direction: column; align-items: flex-end; margin-right: 70px; }
.foot-soc .listed { color: #fff; margin-bottom: 16px; }
.foot-logo img { object-fit: contain; max-width: 90vw; height: 140px; }
.foot-foot { width: 100%; display: flex; justify-content: flex-start; margin-top: 40px; }
.foot-foot p { text-align: left; text-transform: uppercase; font-size: 14px; overflow-wrap: break-word; box-sizing: border-box; }

/*----INVENTORY STYLES - KEEP AT BOTTOM OF CSS----*/
.inv-foot-spacer { width: 100%; height: 100px; background: #000; }

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

@media only screen and (min-width: 2500px) {
	.map-div.fullmap { margin-bottom: 40px; }
}

@media only screen and (min-width: 2000px) {
	.contactpage .shadower-dark { width: 1000px; padding-left: 40px; }
	.contactpage .form-sect { width: 1000px; padding-right: 40px; }
}

@media only screen and (max-width: 1400px) {
	.header-main { justify-content: space-between; }
	.header-logo { margin: 0; }
}

@media only screen and (max-width: 1250px) {
	.homepage.contact-sect .map-div { width: calc(100% - 460px); }
	.homepage.contact-sect .form-div { margin-left: 40px; }
}

@media only screen and (max-width: 1200px) {
	.header-banner { padding: 8px 65px; left: calc(50% - 275px); }
	.header-logo img { height: 100px; }
	.header-soc { margin-bottom: 0; }
	.header-soc a.listed { margin: 0 6px; }
}

@media only screen and (max-width: 1150px) {
	.inv-btns { flex-wrap: wrap; }
	.inv-btns a { width: calc(33.333333% - 10px); }
}

@media only screen and (max-width: 1120px) {
	.homepage.contact-sect { padding-left: 40px; padding-right: 40px; }
	.homepage.contact-sect .map-div { width: calc(60% - 40px); }
	.homepage.contact-sect .form-div { width: 40%; }
	.homepage.contact-sect .form-div form { width: 100%; }
	.foot-top .sect1120 { width: 100%; order: 1; }
	.foot-top a.btnclass { width: 210px; margin: 6px; }
	.foot-top a.not-btnclass { order: 2; }
}

@media only screen and (min-width: 1121px) {
	.show1120 { display: none!important; }
}

@media only screen and (max-width: 1120px) {
	.hide1120 { display: none!important; }
}

@media only screen and (max-width: 1050px) {
	.homepage.mission { flex-wrap: wrap; padding-left: 0; }
	.homepage.mission .content-sect { width: 100%; padding-left: 5%; padding-right: 5%; padding-top: 0; }
	.homepage.mission .missionimg { width: calc(100% - 40px); height: 300px; margin-left: 40px; }
	.pharr-wrapper { height: 450px; }
}

@media only screen and (max-width: 1000px) {
	.header-banner { padding: 3px 54px 8px 54px; left: calc(50% - 230px); }
	.header-banner .header-banner-txt { font-size: 32px; }
	.contactpage .shadower-dark { width: 100%; min-width: unset; padding-right: 5%; }
	.contactpage .content-sect.bg-gray { width: 100%; max-width: 610px; flex-direction: row; flex-wrap: wrap; justify-content: center; align-items: center; }
	.contactpage .form-sect { width: 100%; max-width: unset; padding-left: 5%; }
	.foot-top .sect1120 { flex-wrap: wrap; order: 2; }
	.foot-top .sect1000 { width: 100%; flex-wrap: wrap; }
	.foot-top a.not-btnclass { order: 1; }
}

/* desktop only: */
@media only screen and (min-width: 951px) {
	.header-mobile-soc { display: none!important; }
}

/* switch to mobile nav */
@media only screen and (max-width: 950px) {
	.header-soc { display: none!important; }
	.nav-div { z-index: 3; width: 100%; transform: none; margin-left: 0; padding-left: 0; padding-right: 0; justify-content: space-between; background: rgba(0, 0, 0, .75); }
	.content-sect { padding-left: 5%; padding-right: 5%; }
}

@media only screen and (min-width: 851px) {
	.inv-foot-spacer { display: none!important; }
}

@media only screen and (max-width: 850px) {
	.header-main { justify-content: space-evenly; }
	.header-banner { display: none!important; }
	.inv-btns a { width: calc(50% - 10px); }
	.homepage.contact-sect { padding-left: 0; padding-right: 0; padding-bottom: 0; }
	.homepage.contact-sect .content-sect { order: 1; padding-left: 5%; padding-right: 5%; }
	.homepage.contact-sect .form-div { order: 2; width: 100%; padding-left: 5%; padding-right: 5%; margin-left: 0; margin-bottom: 24px; }
	.homepage.contact-sect .map-div { order: 3; width: 100%; height: 270px; }
	.foot-bottom { justify-content: space-between; }
	.foot-foot { justify-content: center; }
	.foot-foot p { text-align: center; padding-left: 5%; padding-right: 5%; }
}

@media only screen and (max-width: 720px) {
	.foot-bottom { flex-direction: column; align-items: center; padding-left: 0; padding-right: 0; }
	.foot-logo img { height: 120px; }
	.foot-soc { margin-right: 0; margin-bottom: 24px; align-items: center; }
	.foot-soc .listed { max-width: 100%; }
}

@media only screen and (max-width: 700px) {
	.homepage.mission .missionimg { height: 250px; }
	.inv-btns { padding: 0 4%; }
}

@media only screen and (max-width: 650px) {
	.hide650 { display: none!important; }
	.header-main { justify-content: center; }
	.header-logo1 { max-width: 100%; }
	.header-logo1 img { max-width: 100%; }
	.header-logo2 { display: none!important; }
	.header-mobile-soc a.listed { width: 60px; }
	.header-mobile-soc a.listed i { margin: 0; }
	.inv-btns a { height: 160px; }
	.yard-hero { height: 240px; }
}

@media only screen and (max-width: 600px) {
	h1.title { font-size: 34px; }
	h2.title { font-size: 34px; }
	.header-mobile-soc a.listed { padding: 0; width: 50px; }
	.header-mobile-soc a.listed span.hide { display: none!important; }
	.header-mobile-soc a.listed i { margin: 0; }
	.subhero { height: 200px; }
	.listed { font-size: 16px!important; }
	.horiz-soc { display: flex; flex-direction: column; align-items: center; }
	.horiz-soc .btnclass { margin: 10px 0; }
	.horiz-soc .listed { margin: 10px 0; }
	.homepage.mission .missionimg { width: 97%; margin-left: 3%; }
	.contactpage .content-sect.bg-gray { display: flex; flex-direction: column; align-items: center; }
	.contactpage .content-sect.bg-gray .btnclass { margin: 10px 0; }
	.contactpage .content-sect.bg-gray .listed { margin: 10px 0; }
}

@media only screen and (max-width: 550px) {
	.foot-top { padding-left: 24px; padding-right: 24px; }
	.foot-top a.btnclass { width: min(100%, 300px); }
	.foot-top a.home-link { order: 1; }
	.foot-top .sect1200 { order: 2; }
	.foot-top a.contact-link { order: 3; }
}

@media only screen and (max-width: 500px) {
	.title:after { left: -20px; right: -20px; }
	h2.title { font-size: 30px; }
	.inv-btns-sect { overflow: hidden; }
	.inv-btns a { height: 140px; }
	.inv-btns a span { font-size: 16px; }
}

@media only screen and (max-width: 450px) {
	.inv-btns a { width: calc(100% - 10px); }
	.contactpage .shadower-dark { padding-left: 0; padding-right: 0; }
	.contactpage .content-sect.bg-gray { clip-path: none; padding-left: 0; padding-right: 0; }
}

@media only screen and (max-width: 320px) {
	.header-mobile-soc { display: none!important; }
}