:root {
  --red: #ee2737;
  --blue: #00a3e0;
  --light-gray: #ddd;
  --dark-gray: #757575;

  /* CSS HEX */
  /* https://coolors.co/edf418-cdf21b-acf01d-8cee1f-6beb21-62da25-59c828-47a42e-358135 */
  --xanthic: #edf418ff;
  --arctic-lime: #cdf21bff;
  --green-lizard: #acf01dff;
  --green-lizard-2: #8cee1fff;
  --lawn-green: #6beb21ff;
  --lime-green: #62da25ff;
  --lime-green-2: #59c828ff;
  --yellow-green-color-wheel: #47a42eff;
  --forest-green-web: #358135ff;

  /* CSS HSL */
  --xanthic: hsla(62, 91%, 53%, 1);
  --arctic-lime: hsla(70, 89%, 53%, 1);
  --green-lizard: hsla(79, 88%, 53%, 1);
  --green-lizard-2: hsla(88, 86%, 53%, 1);
  --lawn-green: hsla(98, 83%, 53%, 1);
  --lime-green: hsla(100, 71%, 50%, 1);
  --lime-green-2: hsla(102, 67%, 47%, 1);
  --yellow-green-color-wheel: hsla(107, 56%, 41%, 1);
  --forest-green-web: hsla(120, 42%, 36%, 1);
}

/* html {
    scroll-behavior: smooth;
} */

.reviews-score {
  display: none;
}

.d-none {
  display: none;
}

button:focus {
  outline: none;
}

.visually-hidden {
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  height: 1px;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}

.sm-w-25 {
  width: 25%;
}

.sm-w-33 {
  width: 33%;
}

.sm-w-50 {
  width: 50%;
}

.sm-w-66 {
  width: 66%;
}

.sm-w-75 {
  width: 75wh;
}

.sm-h-25 {
  height: 25vh;
}

.sm-h-33 {
  height: 33vh;
}

.sm-h-50 {
  height: 50vh;
}

.sm-h-66 {
  height: 66vh;
}

.sm-h-75 {
  height: 75vh;
}

.sm-h-85 {
  height: 85vh;
}

.sm-h-90 {
  height: 90vh;
}

.h-fit-content {
  height: fit-content;
}

.text-shadow-white-2-3 {
  text-shadow: 0 2px 3px rgba(255, 255, 255, 0.9);
}

.text-shadow-black-2-3 {
  text-shadow: 0 2px 3px rgba(0, 0, 0, 0.5);
}

.text-shadow-black-1-4-dark {
  text-shadow: 0 1px 5px rgba(0, 0, 0, 0.8);
}

.filter-shadow-black-2-3 {
  filter: drop-shadow(0 2px 3px rgba(0, 0, 0, 0.5));
}
.transition-delay-3s {
  transition-delay: 3s;
}

.transition-all-10s {
  transition: all 10s linear;
}

.relative-area {
  position: relative;
  overflow: hidden;
}

p.text-xs,
p.text-sm,
p.text-base,
p.text-lg,
p.xl\:text-base {
  margin-top: 0;
  margin-bottom: 1rem;
}

.relative-area::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: -2;
  background-image: url(../../img/air-o-truck-HERO.jpg);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  transition: all 10s linear 1s;
}

.relative-area::after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: -1;
  background: rgba(0, 0, 0, 0.375);
}

/* SAFARI DOESN'T LIKE THIS FOR SOME REASON I HAVE AN OVERRIDE FOR THIS IN SAFARI.CSS */
.in-view.relative-area::before {
  transform: scale(1.25);
}

.blur-6 {
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}

.blur-8 {
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}

.bg-black-gradient-60-to-0 {
  background: rgb(0, 0, 0);
  background: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0.6) 0%,
    rgba(0, 0, 0, 0) 100%
  );
}

.bg-white-gradient-96-to-70 {
  background: rgb(255, 255, 255);
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.96) 0%,
    rgba(255, 255, 255, 0.7) 100%
  );
}

.bg-white-gradient-90-to-60 {
  background: rgb(255, 255, 255);
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.9) 0%,
    rgba(255, 255, 255, 0.6) 100%
  );
}

.bg-white-gradient-80-to-50 {
  background: rgb(255, 255, 255);
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.8) 0%,
    rgba(255, 255, 255, 0.5) 100%
  );
}

.bg-white-gradient-70-to-20 {
  background: rgb(255, 255, 255);
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.7) 0%,
    rgba(255, 255, 255, 0.2) 100%
  );
}

.bg-white-gradient-60-to-20 {
  background: rgb(255, 255, 255);
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.6) 0%,
    rgba(255, 255, 255, 0.2) 100%
  );
}

.bg-white-transparent-60 {
  background-color: rgba(255, 255, 255, 0.6);
}

.bg-gray-gradient-70-to-0 {
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.365) 0%, transparent);
}

.header-logo #company_logo,
.header-logo svg {
  width: 100%;
  max-width: 160px;
  height: auto;
}

/* White */

.company_logo #a .st2 {
  fill: #000;
}

header .company_logo #a .st2 {
  fill: #fff;
}

header #mobile-nav .company_logo .st2 {
  fill: #000;
}
.hero-container .company_logo #a .st2 {
  fill: #fff;
}

header #mobile-nav .company_logo {
  margin-top: 2rem;
  margin-bottom: 1rem;
}

/* Red Pantone 1788C EE2737 */
.company_logo #b .st1 {
  fill: #ee2737;
}

/* Blue Pantone 299C #00A3E0*/
.company_logo #c .st0 {
  fill: #00a3e0;
}

.text-red-600 {
  color: #ee2737;
}

.bg-red-600 {
  background-color: #ee2737;
}
a.bg-blue-600,
button.bg-blue-600,
h1.bg-blue-600 {
  background-color: #00a3e0;
}

.text-blue-300 {
  color: #1cc0fd;
}

.text-blue-600 {
  color: #00a3e0;
}

.hover\:text-blue-700:hover {
  color: #00a3e0;
}

.hero-area {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-bottom: 6%;
}

.hero-area .company_logo {
  display: block;
  margin: 0 auto 2rem auto;
  width: 100%;
  max-width: 600px;
  filter: drop-shadow(0 0 3px rgba(0, 0, 0, 0.375));
}

.hero-area .higher-standard-seal {
  position: absolute;
  bottom: 0.625rem;
  left: 0.625rem;
  display: inline-block;
  width: 6.25rem;
  height: auto;
  margin: 0;
}

#about .company_logo {
  display: block;
  margin: 0 auto;
  width: 100%;
  max-width: 600px;
  filter: drop-shadow(0 2px 3px rgba(255, 255, 255, 0.8));
}

.grecaptcha-badge {
  display: none;
}

.services-section {
  background-color: rgba(43, 80, 147, 0.9);
  color: #fff;
  text-shadow: 0 1px 10px rgba(0, 0, 0, 0.6);
  padding: 0.6rem 1.4rem;
  margin: 2rem 0;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
}

.services {
  font-size: 1rem;
  line-height: 1.4rem;
  text-transform: capitalize;
}

.call-to-action {
  width: 100%;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}

.call-to-action .text-container {
  position: absolute;
  z-index: 2;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

.call-to-action .text-container h2,
.call-to-action .text-container p {
  text-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
}

.call-to-action::after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
  background: rgba(0, 0, 0, 0.35);
}

.call-to-action-a {
  background-image: url(../../img/call-to-action-a.webp);
}

.call-to-action-b {
  background-image: url(../../img/commercial-02.webp);
}

.call-to-action-c {
  background-image: url(../../img/call-to-action-b.webp);
}

.showcase--head {
  transition: all 0.5s ease-in-out 0.25;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  background-blend-mode: multiply;
}
#residential .showcase--head h2.text-4xl,
#commercial .showcase--head h2.text-4xl,
#home-generators .showcase--head h2.text-4xl {
  line-height: 2.4rem;
}

/* #residential .showcase--head,
#commercial .showcase--head,
#home-generators .showcase--head {
    background-color: rgba(44, 82, 130, .25)
} */

#residential .showcase--head-img-a {
  background-image: url(../../img/residential-04.webp);
}

#residential .showcase--head-img-b {
  background-image: url(../../img/residential-01.webp);
}

#residential .showcase--head-img-c {
  background-image: url(../../img/residential-02.webp);
}

#residential .showcase--head-img-d {
  background-image: url(../../img/residential-00.webp);
}

#commercial .showcase--head-img-a {
  background-image: url(../../img/commercial-00.webp);
}

#commercial .showcase--head-img-b {
  background-image: url(../../img/commercial-01.webp);
}

#commercial .showcase--head-img-c {
  background-image: url(../../img/commercial-02.webp);
}

#commercial .showcase--head-img-d {
  background-image: url(../../img/commercial-02.webp);
}

#home-generators .showcase--head-img-a {
  background-image: url(../../img/home-generators-01.webp);
}

#home-generators .showcase--head-img-b {
  background-image: url(../../img/home-generators-02.webp);
}

#home-generators .showcase--head-img-c {
  background-image: url(../../img/home-generators-03.webp);
}

#home-generators .showcase--head-img-d {
  background-image: url(../../img/home-generators-04.webp);
}

#careers .showcase--head-img-a {
  background-image: url(../../img/air-o-truck-HERO.jpg);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}

footer {
  background-color: #fff;
  padding: 1rem;
}

footer .business_address [itemprop="name"] ,
footer .business_address [itemtype="http://schema.org/PostalAddress"]
{
  display: block;
}
footer .business_address [itemprop="address"],
footer .business_address [itemprop="addressLocality"],
footer .business_address [itemprop="addressRegion"],
footer .business_address [itemprop="postalCode"] {
  display: inline-block;
}

footer .business_address [itemprop="telephone"] {
  display: block;
}

.social_links {
  display: inline-block;
}

footer .footer-social-icons svg[aria-labelledby="fb_title"] {
  fill: #00a3e0;
}

footer .footer-social-icons svg[aria-labelledby="instagram_title"] {
  fill: #00a3e0;
}

footer .footer-social-icons svg[aria-labelledby="linkedin_title"] {
  fill: #00a3e0;
}

.slider-container {
  position: relative;
}

button[data-action="start"],
button[data-action="stop"],
.slider-container .tns-nav {
  display: none;
}

.slider-container .controls [data-controls="next"],
.slider-container .controls [data-controls="prev"] {
  position: absolute;
  top: calc(50% - 0.75rem);
  width: 1.5rem;
  height: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
}

.slider-container .controls [data-controls="prev"] {
  left: -1rem;
}

.slider-container .controls [data-controls="next"] {
  right: -1rem;
}

.slider-container .controls [data-controls="prev"] svg,
.slider-container .controls [data-controls="next"] svg {
  fill: #00a3e0;
  opacity: 0.75;
  width: 15px;
}

#residential .slider-container .controls [data-controls="prev"],
#commercial .slider-container .controls [data-controls="prev"],
#home-generators .slider-container .controls [data-controls="prev"] {
  left: 0;
}

#residential .slider-container .controls [data-controls="next"],
#commercial .slider-container .controls [data-controls="next"],
#home-generators .slider-container .controls [data-controls="next"] {
  right: 0;
}

.slider-pager {
  display: flex;
  flex: 1 0 auto;
  background: yellow;
  justify-content: center;
}

/* FAQ */

summary:hover {
  cursor: pointer;
}

summary::-webkit-details-marker {
  background-color: transparent;
  visibility: hidden;
  display: none;
}

/* /FAQ */

/* modal */

.modal {
  transition: opacity 0.25s ease;
}

/* /modal */

.showcase--content {
  padding-top: 2rem;
  padding-bottom: 2rem;
}

div[itemprop="image"] {
  display: none;
}

.pb-160 {
  padding-bottom: 10rem;
}

#reviews {
  overflow: hidden;
}

.social_area {
    display: flex;
    flex-direction: row;
    /* justify-content: flex-start; */
    justify-content: center;
    align-items: center;
}

.social_area .footer-social-icons {
    margin-right: 1.25rem;
}

.social_area .footer-social-icons:last-child {
    margin-right: 0;
}

@media (min-width: 48rem) {
  .hero-area .higher-standard-seal {
    width: 7.5rem;
  }

  h6 {
    font-size: 1rem;
    line-height: 1.2rem;
  }

  /* this is used on the about employees section */

  .lg-w-25 {
    width: 25%;
  }

  .lg-w-33 {
    width: 33%;
  }

  .lg-w-50 {
    width: 50%;
  }

  .lg-w-66 {
    width: 66%;
  }

  .lg-w-75 {
    width: 75%;
  }

  .lg-h-25 {
    height: 25vh;
  }

  .lg-h-33 {
    height: 33vh;
  }

  .lg-h-50 {
    height: 50vh;
  }

  .lg-h-66 {
    height: 66vh;
  }

  .lg-h-75 {
    height: 75vh;
  }

  .lg-h-85 {
    height: 85vh;
  }

  .lg-h-90 {
    height: 90vh;
  }

  .lg-h-100 {
    height: 100vh;
  }

  .services {
    font-size: 1.4rem;
    line-height: 2rem;
    text-transform: capitalize;
  }

  .about-slider .slide .container {
    min-height: 516px;
    justify-content: center;
    margin-top: 16px;
  }

  #reviews {
    padding-top: 6.625rem;
    padding-bottom: 1.875rem;
  }
  .main-menu-container {
    width: calc(100% - 21.25rem);
    flex-wrap: wrap;
  }

  .header-menu-inner-container {
    width: calc(100% - 2.5rem);
    padding: 0.5rem 0 0 0;
  }
}

@media (min-width: 64rem) {
  .showcase--content {
    padding-top: initial;
    padding-bottom: initial;
  }

  .social_area {
      justify-content: flex-start;
  }
}