@import url('https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,300;0,400;0,600;0,700;1,300;1,400;1,600;1,700&display=swap');
/* TRY POPPINS FONT */
@import url('https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,300;0,400;0,600;0,700;1,300;1,400;1,600;1,700&family=Poppins:wght@400;600;700&display=swap');
:root {
  --main-bg-color: #006AA3;
  --main-light-contrast-color: #D6F1FF;
  --main-button-color: #0179ba;
  --secondary-bg-color: #45be8b;
  --secondary-light-contrast-color:#D2EFE3;
  --tertiary-bg-color:#CCB78F;
  --tertiary-light-contrast-color:#F2EDE3;
  --full-bleed-bg-color:#fcf9f5;
  --off-white: #fffdfb;
  --off-black: #32313b;
  --bs-body-color: #32313b;
}

body {
  padding:10px;
  font-family: 'Poppins', sans-serif;
  background-color: var(--off-white);
  color:var(--bs-body-color);
}

h1,h2,h3,h4 {
  font-weight: 700;
}
h1 {
  font-size:2.5rem; /* Was previously 5rem before the SEO update */
}
h1#services {
  font-size:2.4rem;
}

h2 {
  font-size:2.5rem;
}

h3 {
  font-size:2.4rem;
}
h4 {
  font-size:2rem;
}

a {
  text-decoration:none;
}

.lead {
  font-size: 1rem;
}

.navbar, .navbar-brand {
  background:var(--off-white);
  border-radius: 24px;
  padding:6px 0px 6px 0px;
  font-size:1.5rem;
  /*margin-top:40px;*/
}

.nav-bar .logo, .navbar-brand .logo {
  padding:0px;
  width:190px;
}

.btn {
  font-weight:bold;
  border-radius: 16px;
  /*padding:12px;*/
}

.btn-secondary {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--main-bg-color);
  --bs-btn-border-color: #fff;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--main-button-color);;
  --bs-btn-hover-border-color: #fff;
  --bs-btn-focus-shadow-rgb: 49,132,253;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #0a58ca;
  --bs-btn-active-border-color: #fff;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #0d6efd;
  --bs-btn-disabled-border-color: #0d6efd;
}

.btn-primary {
  --bs-btn-color: var(--main-button-color);
  --bs-btn-bg: #fff;
  --bs-btn-border-color: #fff;
  --bs-btn-hover-color: var(--main-button-color);
  --bs-btn-hover-bg: #fff;
  --bs-btn-hover-border-color: #fff;
  --bs-btn-focus-shadow-rgb: 49,132,253;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #0a58ca;
  --bs-btn-active-border-color: #fff;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #0d6efd;
  --bs-btn-disabled-border-color: #0d6efd;
}

.container {
    max-width: 1080px;
  }

section {
  border-radius: 32px;
  padding-top:32px;
  color:var(--off-white);
  position:relative;
}

.hero-with-nav {
  background:var(--main-bg-color);
  /*padding-bottom:150px;*/
}

.flex-even {
  flex: 1;
}

.footer {
  background:var(--bs-body-color);
  color:var(--off-white);
  min-height:300px;
  padding-top:0px;
}

.footer a {
  color:var(--off-white);
}

.footer a:hover {
  opacity: 70%;
}
.green-section .w-50, .brown-section .w-50, .blue-section .w-50 {
  width:100% !important;
}
.blue-section {
  background:var(--main-bg-color);
  margin-top:60px
}

.blue-border {
  border-color: var(--main-bg-color) !important;
}

.green-section {
  background:var(--secondary-bg-color);
}

.green-section .btn-primary {
  color:var(--secondary-bg-color);
}

.green-section .btn-secondary {
  background-color:var(--secondary-bg-color);
}

.green-border {
  border-color: var(--secondary-bg-color) !important;
}

.brown-section {
  background:var(--tertiary-bg-color);
  margin-top:60px;
}

.brown-section .btn-primary {
  color:var(--tertiary-bg-color);
}

.brown-section .btn-secondary {
  background-color:var(--tertiary-bg-color);
}

.full-bleed {
  color:var(--off-black);
  /*background-color:var(--full-bleed-bg-color);*/
  border-radius:0;
  margin:0;
  /*padding-bottom: 90px;*/
}

.full-bleed .btn-primary {
  color:var(--main-bg-color);
  background-color:transparent;
  border-color:var(--main-bg-color);
}

.full-bleed .btn-secondary {
  background-color:var(--tertiary-bg-color);
}

.clear-section {
  color:var(--off-black);
}

.intro {
  width:100%;
}
.intro-image {
  width:100%;
  text-align:center;
}
.flipped {
  transform: scaleX(-1);
}


.modal-body {
  text-align: right;
}

.modal-body section {
  padding:0rem;
}
.waste-widget {
  background-color: var(--off-white);
  border:10px solid var(--main-light-contrast-color);
  border-bottom:none;
  border-top-right-radius: 32px;
  border-top-left-radius: 32px;
  border-bottom-right-radius: 0px;
  border-bottom-left-radius: 0px;
  padding-top:32px;
  height:auto;
  position: relative;
  max-width: 1080px;
  margin-top:60px;
  color:var(--off-black);
  /*transform: translateY(50%);*/
  /*background-color: lightblue;*/
  /*padding: 10px;*/
}
.waste-widget-inset {
  background:transparent;
  border:none;
  padding-top:0px;
  min-height:400px;
  position: relative;
  max-width: 1080px;
  margin-top:0px;
  padding-bottom:1px;
  color:var(--off-black);
  /*transform: translateY(50%);*/
  /*background-color: lightblue;*/
  /*padding: 10px;*/
}

.standalone.waste-widget {
  height:605px;
}
.standalone.waste-widget-inset {
  margin-top:-555px;
}

/*ccb78f brown*/
/*66b4c8 blue*/
/*62d69f green*/


.services-card-img {
  border-radius: calc(0.875rem - 1px) !important;
  padding: 30px;
  height: 222px;
}

.services-card-img .card-img-top {
  width: 80%;
  text-align: center;
  margin: -8% 12%;
}

#carouselOneStop .carousel-inner {
  width:inherit;
}

.bottom-bucket {
  background:#fff;
  color:var(--bs-body-color);
  border-top-right-radius: 32px;
  border-top-left-radius: 32px;
  padding-top:32px;
  height:300px;
  position: relative;
  max-width: 1080px;
}

.bottom-bucket.tall {
  height:270px;
  background:var(--off-white);
}

.standalone .bottom-bucket {
  min-height:270px;
  height:inherit;
  background:var(--off-white);
}

.standalone .bottom-bucket.tall {
  height:inherit;
  background:var(--off-white);
}

.modal-content .bottom-bucket {
  padding:0rem;
  width:100%;
}

.blue {
  background-color:var(--main-light-contrast-color) !important;
}
.text-blue {
  color:var(--main-bg-color);
}

.green {
  background-color:var(--secondary-light-contrast-color) !important;
}
.text-green {
  color:var(--secondary-bg-color);
}

.brown {
  background-color:var(--tertiary-light-contrast-color) !important;
}
.text-brown {
  color:var(--tertiary-bg-color);
}

.bottom-200 {
  margin-bottom:200px;
}

.gsap-container {
  width: 100%;
  height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  overflow: hidden;
  border: 1px solid black;
}

.services-header {
  flex-direction:column;
}

#services h2 {
  font-size:1.8rem !important;
}

.services-copy ul[style*="list-style-type:square;"] {
  list-style: none !important;
  padding-left: 1em; /* Adjust for custom marker spacing */
}
.services-copy ul[style*="list-style-type:square;"] li::before {
  content: "✓ ";
  color: green; /* Optional: Style the checkmark */
  font-size: 1.2em; /* Optional: Adjust size */
  margin-right: 0.5em; /* Optional: Add spacing */
}

/*p {*/
/*  width: 100%;*/
/*  display: flex;*/
/*  justify-content: center;*/
/*  align-items: center;*/
/*  margin-bottom: 10px;*/
/*}*/

.center {
  font-weight: bold;
  margin: 0 5px;
}

.scroll-container {
  /*perspective: 1000px;*/
  height: 85vh;
  overflow-x: hidden;
  overflow-y: auto;
  margin-top:100px;
  margin-bottom:0;
  position:relative;
}

.scroll-section {
  /*height: 20vh; !* Adjust this value to control when the animation starts *!*/
  overflow:hidden;
  width:120%;
  margin-left:-40px;
  margin-right:-40px;
  position:absolute;
}

.panel {
  position: relative;
  width: 300%;
  /*overflow: hidden;*/
  margin-left:-50%;
  /*line-height: 20vh;*/
  font-size: calc(1rem);
  text-align: center;
  color: #32313b;
  /*word-spacing:10px;*/
  /*opacity: 0;*/
}

.emoji {
  display: inline-block;
  padding: 0 15px !important;
  font-size: 1em !important;
  background: none !important;
}

.panel .text-start {
  width:50%;
  white-space: nowrap;
}

.panel .text-end {
  width:50%;
  white-space: nowrap;
}

.panel .text-center {
  margin:0px 20px;
}

.scroll-container span {
  display:inline-block;
  padding:0px 20px;
  background:#f3f3f3;
  border-radius: 32px;
  font-size: 2.75rem;
  font-weight:800;
}

/* SCROLLMAGIC for panel slider */
.panel-1, .panel-3 {
  /*transition: transform 0.5s ease;*/
  /*opacity: 0;*/
  /*-webkit-transform: translateX(-400px);*/
  /*-moz-transform: translateX(-400px);*/
  /*-ms-transform: translateX(-400px);*/
  /*-o-transform: translateX(-400px);*/
  /*transform: translateX(-400px);*/
  /*-webkit-transition: all 0.8s ease-out;*/
  /*-moz-transition: all 0.8s ease-out;*/
  /*-ms-transition: all 0.8s ease-out;*/
  /*-o-transition: all 0.8s ease-out;*/
  /*transition: all 1.2s ease-out;*/
}
.panel-2 {
  /*transition: transform 0.5s ease;*/
  /*opacity: 0;*/
  /*-webkit-transform: translateX(400px);*/
  /*-moz-transform: translateX(400px);*/
  /*-ms-transform: translateX(400px);*/
  /*-o-transform: translateX(400px);*/
  /*transform: translateX(400px);*/
  /*-webkit-transition: all 0.8s ease-out;*/
  /*-moz-transition: all 0.8s ease-out;*/
  /*-ms-transition: all 0.8s ease-out;*/
  /*-o-transition: all 0.8s ease-out;*/
  /*transition: all 1.2s ease-out;*/
}
.panel.visible {
  opacity: 1;
  -webkit-transform: none;
  -moz-transform: none;
  -ms-transform: none;
  -o-transform: none;
  transform: none;
}

.graphic-like {
  background:#fff;
  color:#000;
  font-weight: 800;
  border-radius: 32px;
  color:#373737;
}

.card {
  border-radius:32px;
  border-color: var(--tertiary-bg-color);
}

.card-text {
  font-size:1em;
}

.card-title {
  font-weight:700;
}

.card-img-top {
  border-radius:calc(0.875rem - 1px) !important;
}

#carouselLogos .carousel-control-next {
  right: -12px;
}
#carouselLogos .carousel-control-prev {
  left: -12px;
}

#testimonialCards .carousel-control-next {
  right: -40px;
}
#testimonialCards .carousel-control-prev {
  left: -40px;
}

.testimonialTitle {
  font-size:.8em;
}

.bio-box, .blog-box {
  flex-basis: 100%;
}
.bio {
  border-radius: 32px;
  background-repeat: no-repeat;
  background-size: cover;
  height:400px;
  position: relative; /* To position the overlay correctly */

  /*background:#f8f4f0;*/
}
.bio-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0); /* Initially transparent */
  border-radius: 32px; /* Match the border radius */
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: all 0.5s ease; /* Smooth transition */
}

.bio-overlay .bio-text {
  color: white;
  text-align: center;
  padding: 0 20px; /* Adjust as needed */
  display: none; /* Hide initially */
}

.bio:hover .bio-overlay {
  background: rgba(0, 0, 0, 0.7); /* Darken on hover */
  opacity: 1;
}

.bio:hover .bio-overlay .bio-text {
  display: block; /* Show the text on hover */
}
.tullio {
  background-image: url("../images/tullio.jpeg");
}
.chris {
  background-image: url(../images/chris.png);
}

.bruce {
  background-image: url("../images/tullio-flip.jpeg");
}

.modal {
  --bs-modal-padding:0px !important;
}

.form-control {
  border: 1px solid #45be8b;

}

#blog-entry img {
  width:100%;
  border-radius:var(--bs-border-radius) !important;
  margin:0 0 30px 0;
}

#blog-entry img.main-image {
  margin:0;
}

.standalone {
  max-width:880px;
  /*margin-top:-280px;*/
}

  @media (min-width: 768px) {
    .flex-md-equal > * {
      flex: 1;
    }
    .f1kp0esb {
      align-items: center;
      display: flex;
      flex-wrap: nowrap;
      justify-content: space-between;
    }
  }

.logo {
  padding: 15px; /* Equal padding around images */
  display: flex;
  justify-content: end;
  align-items: center;
}
.logo img {
  width: 100%; /* Make images responsive */
  max-width: 100px; /* Maximum size of logos */
  height: auto; /* Maintain aspect ratio */
}

#carouselLogos .carousel-inner {
  height:235px;
}

.carousel-control-prev-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%230179ba' viewBox='0 0 8 8'%3E%3Cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3E%3C/svg%3E") !important;
}

.carousel-control-next-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%230179ba' viewBox='0 0 8 8'%3E%3Cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3E%3C/svg%3E") !important;
}

#carouselWhy {
  width:90%;
}
.carousel-item img {
  width:60%;
}

/* OWL STUFF */
.owl-nav button.owl-next, .owl-nav button.owl-prev {
  font-size: 2.5em;
  line-height:2rem;
  color: var(--full-bleed-bg-color);
  background: var(--main-bg-color);
  border: none;
  border-radius: 100px;
  width: 44px;
  height: 44px;
  padding: 0px;
  margin-right:20px;
}
.owl-dots {
  display:none;
  }

/*(1) owl-stage box*/
.owl-carousel .owl-stage { display: flex; }
/*(2) the direct div of each element in the owl carousel*/
.owl-stage .item { height: 100%; }

#wasteSearch, #searchResult {
  font-size:1.2em;
  text-align:left;
}

#searchResult {
  /*border:1px solid #45be8b;*/
  /*border-radius: .33em;*/
}

.textRecycling {
  color: #006AA3;
}
.textOrganics {
  color: #45be8b;
}

.legal-container {
  font-size: .80em;
  /* position: absolute; */
  margin: 100px 0 0 0;
  padding-bottom: 35px;
  /* bottom: 35px; */
  padding: 0px;
}