/***** 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 --------*/
a:link, a:visited, a:active {text-decoration:none;}
a:hover {text-decoration: none; cursor: pointer !important;}
button:hover {cursor: pointer !important;}
hr{border:#000 1px solid;}
html {font-family: "poppins", sans-serif;}
/*--- HEADER STYLES ---------------------*/
.header-search {
display: none;
top: 100%;
right: 0;
background: #313236;
z-index: 9999;
padding: 10px 0;
}
.header-search.active {
display: block;
}
.header-search form {display: flex; width: 95%; margin: 0 auto; gap: 10px; align-items: center;}
.header-search input {width: 100% !important; background: #313236 !important; border: none !important; padding: 12px 0 8px 20px !important; font-family: "poppins", sans-serif !important; font-size: 15px !important; line-height: 25px !important; color: #fff !important;}
.header-search input::placeholder {color: #fff !important;}
.header-search button {background: #313236; border: none; color: #fff; font-size: 20px; padding: 0px}
.header-search button i {width: 40px; height: 40px; background: #86B039; border-radius: 50px; display: flex; justify-content: center; align-items: center; font-size: 16px; line-height: 16px; border: 1px transparent solid;}
.header-search button:hover i {background: none; border: 1px #fff solid; transition: .8s;}
header {width: 95%; margin: 0 auto; padding-top: 50px;}
header a img {margin-top: 10px;}
.mobile-logo {display: none;}
/*---BODY--------------------------------*/
/*---DEFAULT---*/
.hero-bkgrd {background: url("/siteart/hero.jpg") no-repeat; background-position: center; background-size: cover;}
.hero-overlay {background: #26272B; background: linear-gradient(180deg, rgba(38, 39, 43, 0.65) 0%, rgba(38, 39, 43, 1) 100%);}
.hero-wrap {width: 95%; margin: 0 auto; padding: 200px 0 100px 0;}
.hero-wrap h1 span {font-family: "poppins", sans-serif; font-weight: 500; font-size: 35px; line-height: 45px; color: #fff; text-transform: uppercase;}
.hero-wrap h1 {font-family: "poppins", sans-serif; font-weight: 600; font-size: 70px; line-height: 75px; color: #fff; text-transform: uppercase;}
.hero-wrap > p {font-family: "poppins", sans-serif; font-weight: 500; font-size: 16px; line-height: 26px; color: #fff; width: 500px; margin: 15px 0 30px 0;}
.hero-wrap button {border: 1px #fff solid; padding: 12px 18px; display: flex; align-items: center; gap: 20px; font-family: "poppins", sans-serif; font-weight: 500; font-size: 16px; line-height: 26px; border-radius: 50px; background: none; color: #fff;}
.hero-wrap button p {padding-top: 2px;}
.hero-wrap button i {color: #86B039; font-size: 25px; line-height: 25px;}
.hero-wrap button:hover {gap: 30px; transition: .8s;}
.body-bkgrd {background: #26272B;}
.body-wrap {width: 95%; margin: 0 auto;}
.equip-cat {text-align: center;}
.equip-cat h2 span {font-family: "poppins", sans-serif; font-weight: 500; font-size: 35px; line-height: 45px; color: #fff; text-transform: uppercase;}
.equip-cat h2 {font-family: "poppins", sans-serif; font-weight: 600; font-size: 35px; line-height: 45px; color: #fff; text-transform: uppercase;}
.equip-flex {display: flex; gap: 10px; justify-content: center; margin-top: 50px;}
.equip-flex > div {background: #2A2B2F; border-radius: 5px; padding: 40px 20px; width: 100%;}
.equip-flex img {margin-bottom: 30px;}
.equip-flex h3 {font-family: "poppins", sans-serif; font-weight: 500; font-size: 25px; line-height: 35px; color: #fff;}
.equip-flex p {font-family: "poppins", sans-serif; font-weight: 500; font-size: 15px; line-height: 25px; color: #fff; margin: 20px 0 30px 0;}
.equip-flex button {border: 1px #86B039 solid; padding: 12px 30px 10px 30px; font-family: "poppins", sans-serif; font-weight: 500; font-size: 14px; line-height: 24px; border-radius: 50px; color: #313236; background: #86B039;}
.equip-flex button:hover {border: 1px #fff solid; color: #fff; background: none; transition: .8s;}
.in-touch {padding: 100px 0; display: flex; gap: 50px;}
.in-touch > div {width: 100%;}
.in-touch-form {background: #2A2B2F; border-radius: 5px; padding: 75px 50px;}
.in-touch-link {padding-top: 50px;}
.in-touch h2 span {font-family: "poppins", sans-serif; font-weight: 500; font-size: 35px; line-height: 45px; color: #fff; text-transform: uppercase;}
.in-touch h2 {font-family: "poppins", sans-serif; font-weight: 600; font-size: 35px; line-height: 45px; color: #fff; text-transform: uppercase; margin-bottom: 20px;}
.in-touch p {font-family: "poppins", sans-serif; font-weight: 500; font-size: 16px; line-height: 26px; color: #fff;}
.in-touch-form form {margin-top: 30px;}
.in-touch-form .form-flex > div {display: flex; gap: 10px; margin-bottom: 10px;}
.in-touch-form .form-textarea {display: flex;}
.in-touch-form input {width: 100%; background: #313236; border: none; padding: 15px 0 10px 20px; font-family: "poppins", sans-serif; font-size: 15px; line-height: 25px; color: #fff; border-radius: 3px;}
.in-touch-form textarea {width: 100%; background: #313236; border: none; padding: 15px 0 0 20px; font-family: "poppins", sans-serif; font-size: 15px; line-height: 25px; color: #fff; border-radius: 3px; height: 150px;}
.in-touch-form input::placeholder, .in-touch-form textarea::placeholder {color: #fff;}
.in-touch-form .submitselect {width: 150px; display: flex; justify-content: center; align-items: center; padding: 12px 0 10px 0; border-radius: 50px; font-family: "poppins", sans-serif; font-size: 15px; line-height: 25px; color: #313236; background: #86B039; margin-top: 30px; border: 1px #86B039 solid;}
.in-touch-form .submitselect:hover, .in-touch-form .submit:hover {border: 1px #fff solid; background: none; transition: .8s; color: #fff; cursor: pointer !important;}
.in-touch-form .CaptchaMessagePanel {color: #fff;}
.in-touch-form .CaptchaAnswerPanel input {width: auto;}
.in-touch-form .submit {width: 150px; margin: 0 auto; display: flex; justify-content: center; align-items: center; padding: 12px 0 10px 0; border-radius: 50px; font-family: "poppins", sans-serif; font-size: 15px; line-height: 25px; color: #313236; background: #86B039; border: 1px #86B039 solid;}
.in-touch-form .CaptchaWhatsThisPanel a {color: #fff; text-decoration: underline;}
.contact-links {margin-top: 50px;}
.contact-links a {display: flex; gap: 15px; align-items: center; margin-bottom: 20px;}
.contact-links a > div:first-child {background: rgba(134,176,57,0.80); width: 62px; height: 62px; border-radius: 50px; display: flex; justify-content: center; align-items: center;}
.contact-links a i {background: #86B039; width: 50px; height: 50px; border-radius: 50px; display: flex; justify-content: center; align-items: center; color: #26272B; font-size: 22px; line-height: 22px;}
.contact-links a p span {font-family: "poppins", sans-serif; font-weight: lighter; font-size: 15px; line-height: 25px; text-transform: none;}
.contact-links a p {font-family: "poppins", sans-serif; font-weight: bold; font-size: 25px; line-height: 35px; text-transform: uppercase;}
/*---SERVICES---*/
.sub-hero-wrap {width: 95%; margin: 0 auto; padding: 100px 0;}
.sub-hero-wrap h1 {text-align: center; color: #fff; text-transform: uppercase; font-size: 70px; line-height: 75px;}
.sub-hero-wrap h1 span {font-weight: lighter;}
.breadcrumbs {display: flex; justify-content: center; gap: 10px; margin-top: 5px; flex-wrap: wrap;}
.breadcrumbs a, .breadcrumbs p {font-family: "poppins", sans-serif; font-size: 16px; line-height: 26px; color: #fff;}
.breadcrumbs a:hover {color: #86B039; transition: .8s;}
.ag-services {padding-bottom: 100px; display: flex; gap: 100px; align-items: center;}
.ag-services > div {width: 100%;}
.ag-services h2 {font-family: "poppins", sans-serif; font-weight: 600; font-size: 35px; line-height: 45px; color: #fff; text-transform: uppercase; margin-bottom: 10px;}
.ag-services h2 span {font-weight: lighter;}
.ag-services p {font-family: "poppins", sans-serif; font-weight: 500; font-size: 16px; line-height: 26px; color: #fff;}
.ag-services button {border: 1px #fff solid; padding: 12px 18px; display: flex; align-items: center; gap: 20px; font-family: "poppins", sans-serif; font-weight: 500; font-size: 16px; line-height: 26px; border-radius: 50px; background: none; color: #fff; margin-top: 25px;}
.ag-services button p {padding-top: 2px;}
.ag-services button i {color: #86B039; font-size: 25px; line-height: 25px;}
.ag-services button:hover {gap: 30px; transition: .8s;}
.ag-services img {width: 100%; border-radius: 5px;}
/*---ABOUT US---*/
.about-us {align-items: center;}
.about-us .contact-links {margin-top: 0px;}
.about-us .in-touch-link {padding: 0px;}
.about-us > div:first-child {width: 100%;}
.about-us > div:last-child {width: auto;}
/*---CONTACT US---*/
.contact-us {padding-top: 0px;}
/*---THANK YOU---*/
.thankyou-hero {padding: 100px 0 50px 0;}
.thankyou {display: block; text-align: center;}
.thankyou button {padding: 12px 30px 10px 30px; margin: 0 auto; margin-top: 25px; background: #86B039; border: 1px #86B039 solid; color: #313236;}
.thankyou button:hover {background: none; border: 1px #fff solid; transition: .8s; color: #fff;}
/*--------FORM STYLES--------------------*/
/*-------- FOOTER STYLES ----------------*/
footer {background: #2A2B2F;}
.footer-wrap {width: 95%; margin: 0 auto; padding: 80px 0; display: flex; justify-content: space-between;}
footer p {font-family: "poppins", sans-serif; font-weight: bold; font-size: 20px; line-height: 30px; text-transform: uppercase; color: #fff; margin-bottom: 15px;}
footer li {margin-bottom: 5px;}
footer a {font-family: "poppins", sans-serif; font-size: 15px; line-height: 25px; color: #fff;}
.quick-links {display: flex; gap: 50px;}
/*----INVENTORY STYLES - KEEP AT BOTTOM OF CSS----*/
.list-content {padding: 80px 0 !important; font-family: "poppins", sans-serif !important;}
.list-top-section .list-title .list-title-text {font-family: "poppins", sans-serif !important;}
.list-top-section .list-title .list-title-text {color: #fff !important;}
.list-top-section .list-listings-count {color: #86B039 !important;}
.list-content .list-main-section {background: #fff !important;}
.list-redesign .side-container {padding-left: 0px !important;}
.faceted-search-content .selected-facets-container .selected-facet {background: #86B039 !important;}
/*---------- RESPONSIVE STYLES ----------*/
@media only screen and (max-width: 1400px) {
header a img {width: 500px;}
.about-us {align-items: flex-start;}
}
@media only screen and (max-width: 1300px) {
header a img {width: 450px;}
}
@media only screen and (max-width: 1200px) {
.mobile-logo {display: contents;}
.mobile-logo a {display: block; width: 100%; text-align: center;}
header a img {width: 556px;}
.equip-flex {flex-wrap: wrap; justify-content: center;}
.equip-flex > div {width: 45%;}
.in-touch {flex-wrap: wrap;}
.hero-wrap {padding: 150px 0 100px 0;}
.ag-services {flex-wrap: wrap;}
.about-us > div:last-child {width: 100%;}
}
@media only screen and (max-width: 1000px) {
.equip-flex > div {width: 44%;}
}
@media only screen and (max-width: 850px) {
.equip-flex > div {width: 43%;}
.in-touch-form {padding: 75px 25px;}
}
@media only screen and (max-width: 750px) {
.equip-flex > div {width: 42%;}
}
@media only screen and (max-width: 650px) {
.equip-flex > div {width: 100%;}
}
@media only screen and (max-width: 620px) {
header a img {width: 95%;}
}
@media only screen and (max-width: 600px) {
.footer-wrap {flex-wrap: wrap; gap: 50px;}
.footer-wrap > div {width: 100%;}
}
@media only screen and (max-width: 550px) {
.in-touch-form .form-flex > div {flex-wrap: wrap;}
.contact-links a > div:first-child {display: none;}
.hero-wrap > p {width: 100%;}
}
@media only screen and (max-width: 500px) {
.hero-wrap h1, .sub-hero-wrap h1 {font-size: 60px; line-height: 65px;}
.hero-wrap h1 span {font-size: 30px; line-height: 40px;}
.hero-wrap {padding: 100px 0;}
}
@media only screen and (max-width: 450px) {
.contact-links a p span {font-size: 14px; line-height: 24px;}
.contact-links a p {font-size: 22px; line-height: 32px;}
.in-touch h2 span, .in-touch h2, .equip-cat h2, .equip-cat h2 span, .ag-services h2 {font-size: 32px; line-height: 42px;}
.hero-wrap h1, .sub-hero-wrap h1 {font-size: 50px; line-height: 55px;}
.hero-wrap h1 span {font-size: 25px; line-height: 35px;}
}
@media only screen and (max-width: 400px) {
.contact-links a p {font-size: 20px; line-height: 30px;}
.in-touch h2 span, .in-touch h2, .equip-cat h2, .equip-cat h2 span, .ag-services h2 {font-size: 30px; line-height: 40px;}
}
@media only screen and (max-width: 380px) {
.contact-links a p {font-size: 18px; line-height: 28px;}
}
@media only screen and (max-width: 350px) {
.contact-links a p {font-size: 16px; line-height: 26px;}
.hero-wrap h1, .sub-hero-wrap h1 {font-size: 40px; line-height: 45px;}
.hero-wrap h1 span {font-size: 20px; line-height: 30px;}
.equip-flex h3 {font-size: 22px; line-height: 32px;}
.in-touch h2 span, .in-touch h2, .equip-cat h2, .equip-cat h2 span, .ag-services h2 {font-size: 28px; line-height: 38px;}
.in-touch-form {padding: 75px 20px;}
.hero-wrap, .sub-hero-wrap {padding: 80px 0 100px 0;}
.in-touch {padding: 80px 0;}
.ag-services {padding-bottom: 80px;}
.thankyou-hero {padding: 80px 0 50px 0;}
}
@media only screen and (max-width: 300px) {
.contact-links a p {font-size: 15px; line-height: 25px;}
}