* {
  scrollbar-width: none;
}
::-webkit-scrollbar {
  display: none; /* Hide the scrollbar */
}

body {
  margin: 0;
  padding: 0;
  font-size: 1rem;
  zoom: 1;
  -webkit-user-zoom: fixed;
  width: 100%;
  background-size: cover;
}

.container {
  background-color: #fff;
  color: #1d3d34;
  margin: 0;
  padding: 0;
  font-family: "Roboto", sans-serif;
  font-weight: 100;
  font-style: normal;
  line-height: 1.4rem;

  /*min-width: 200px;
  max-width: 700px;*/
  height: 100vh;
}

p,
span {
  font-family: "Chivo", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}

.section-titles {
  display: flex;
  flex-direction: column;
  flex-basis: 80vw;
  align-items: center;
  padding-top: 4rem;
  padding-bottom: 2rem;
  border-radius: 50% 50% 0 0; /* Creates a curved top border */
  margin-top: -4rem; /* Adjust margin to position the curve within the top section */
  font-weight: bold;
}

.section-titles span {
  font-size: 2.5rem;
  font-family: "Gabriela", serif;
  font-weight: 600;
  font-style: normal;
  line-height: 1.4rem;
}

.section-border-line {
  border-bottom: 0.1rem solid hsl(164, 37%, 17%);
  width: 20vw; /* Adjust length */
  display: inline-block; /* Ensure it respects width */
}
.mobile-menu-div {
  display: none;
}

.navbar {
  display: flex;
  height: 5rem;
  gap: 15rem;
  background-color: rgba(255, 255, 255, 0.5);
  justify-content: space-between;
  width: 100%;
  z-index: 21;
}

#main-navbar-div {
  display: flex;
  flex-direction: column;
  top: 0px;
  z-index: 20;
  position: fixed;
  width: 100%;
  transition: top 0.3s;
}

.nav-logo-section {
  display: flex;
  gap: 0.2rem;
  align-self: center;
  justify-content: flex-start;
  margin-left: 1rem;
}

.logo {
  max-height: 6.3rem;
  width: auto;
  max-width: 12rem;
  cursor: pointer;
  margin-top: 0.5rem;
}

.logo-name {
  display: flex;
  font-size: 0.2rem;
  font-weight: bold;
  align-items: center;
  font-family: Butler;
  border-right: 0.2rem solid #1d3d34;
  padding: 0.5rem 0.5rem;
}

.logo-slogan {
  display: flex;
  align-items: center;
  width: 17rem;
  font-size: 0.9rem;
  font-weight: 600;
  margin: 0.5rem;
}

.nav-items-section {
  display: flex;
  gap: 1rem;
  align-self: center;
  justify-content: end;
  margin-right: 9rem;
}

.nav-item {
  font-weight: bold;
  font-size: 1.2rem;
  font-size: clamp(1rem, 1.2rem, 1.3rem);
  padding: 0.7rem 0.7rem;
  cursor: pointer;
}

.nav-item:hover {
  background-color: rgba(29, 61, 52, 0.9);
  color: #f1f1ef;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.nav-item-anchor {
  text-decoration: none;
  color: inherit;
  outline: none;
}

.hamburger-div {
  display: none;
}

.contact-button {
  display: flex;
  font-size: 1.2rem;
  line-height: 1.4rem;
  font-weight: 800;
  font-family: Butler;
  background-color: #1d3d34;
  color: #f1f1ef;
  max-width: fit-content;
  padding: 1rem 2rem;
}

.contact-button:hover {
  box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.4), 0 12px 40px 0 rgba(0, 0, 0, 0.38);
}

.hero-section {
  background-size: cover;
  background-repeat: no-repeat;
  /*background-image: linear-gradient(
      to right,
      rgba(0, 0, 0, 0.4),
      rgba(0, 0, 0, 0.4)
    ),
    url(../img/main-background\ -\ Copy.jpg);
*/
  color: #fff;

  display: flex;
  height: 90vh;
  padding-top: 14rem;
  padding-bottom: 15rem;
  gap: 8rem;

  justify-content: center;
  align-items: center;
}

.hero-section::before {
  content: "";
  position: absolute;
  padding-top: 14rem;
  padding-bottom: 15rem;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
  height: 90vh;
  animation: slideshow 30s infinite;
  z-index: -1;
}

@keyframes slideshow {
  0%,
  20% {
    background-image: linear-gradient(
        to right,
        rgba(0, 0, 0, 0.45),
        rgba(0, 0, 0, 0.45)
      ),
      url(../img/hero-background-1.jpg);
    opacity: 1;
  }
  21%,
  22% {
    opacity: 0;
  }
  23%,
  45% {
    background-image: linear-gradient(
        to right,
        rgba(0, 0, 0, 0.45),
        rgba(0, 0, 0, 0.45)
      ),
      url(../img/hero-background-2.jpg);
    opacity: 1;
  }
  46%,
  47% {
    opacity: 0;
  }
  48%,
  70% {
    background-image: linear-gradient(
        to right,
        rgba(0, 0, 0, 0.45),
        rgba(0, 0, 0, 0.45)
      ),
      url(../img/hero-background-3.jpg);
    opacity: 1;
  }
  71%,
  72% {
    opacity: 0;
  }
  73%,
  97% {
    background-image: linear-gradient(
        to right,
        rgba(0, 0, 0, 0.45),
        rgba(0, 0, 0, 0.45)
      ),
      url(../img/hero-background-4.jpg);
    opacity: 1;
  }
  98%,
  100% {
    opacity: 0;
  }
}

.hero-section-logo-container {
  display: flex;
  width: 95vw;
  align-self: center;
  justify-content: center;
}

.hero-section-logo {
  width: auto;
  height: auto;
}

.sub-hero-title {
  background-color: #f1f1ef;
}

.sub-hero {
  background-color: #f1f1ef;
  width: 100%;
  display: flex;
  justify-content: center;
  padding-bottom: 8rem;
  padding-top: 4rem;
}

.hero-text {
  display: flex;
  align-self: center;
  flex-direction: column;
  justify-content: center;
  width: 55vw;
  margin-left: auto;
  margin-right: auto;
  padding-bottom: 3rem;
}

.hero-left-text {
  margin-bottom: 6rem;
  font-size: 5rem;
  line-height: 7rem;
}

blockquote {
  margin: 0px 0px 30px 0; /*   background: rgba(241, 241, 239, 0.85); background: rgba(241, 241, 239, 0.95);*/
  padding: 1rem 1rem 0px 1rem;
  letter-spacing: 0.02em;

  font-weight: 100;
  font-style: italic;
}

blockquote q {
  line-height: 5rem;
}

.hero-text-quote {
  font-size: 3.5rem;
  margin-bottom: 3rem;
  font-family: "Gabriela", serif;
  font-weight: 400;
  font-style: normal;
}

.hero-text-line-two {
  font-size: 1.5rem;
  line-height: 2rem;
  margin-bottom: 2.5rem;
}

.hero-button {
  background-color: #f1f1ef;
  padding: 0.5rem;
  color: #1d3d34;
  margin-left: 1rem;
  border: none;
  font-family: "Lobster Two", sans-serif;
  border: none;
  font-weight: 100;
  font-style: italic;
  font-size: 1.5rem;
  line-height: 1.5rem;
}

.hero-text-line_1 {
  margin-bottom: 2rem;
}

.hero-image {
  max-width: 35rem;
  max-height: 30rem;
  padding: 1rem 0;
}

/* Cottage description */

.about-us-title {
  background-color: #cad4bf;
}

.cottage-description {
  background-color: #cad4bf;
  color: #1d3d34;
  display: flex;
  height: fit-content;
  padding-top: 5rem;
  padding-bottom: 10em;
  gap: 3rem;
  justify-content: space-between;
}

.about-us-page-title {
  background-color: #f1f1ef;
  padding-top: 15rem;
}

.about-us-page-description {
  background-color: #f1f1ef;
  color: #1d3d34;
  display: flex;
  height: fit-content;
  padding-top: 5rem;
  padding-bottom: 10rem;
  gap: 3rem;
  justify-content: space-between;
}

.about-us-page-image {
  max-width: 30vw;
  max-height: 50vh;
  margin-top: 1rem;
  border-radius: 3rem;
}

.about-us-home-button {
  background-color: #f1f1ef;
  color: #1d3d34;
}

.about-us-buttons {
  display: flex;
  gap: 2rem;
  margin-top: 3rem;
}

button a {
  text-decoration: none;
  color: inherit;
  outline: none;
}

.cottage-right {
  display: flex;
  align-self: center;
  flex-direction: column;
  justify-content: center;
  max-width: 60rem;
  line-height: 3rem;
  font-size: 2rem;
  margin-right: 8rem;
  padding: 0 0;
}

.cottage-right-text {
  font-family: "Roboto", sans-serif;
  font-weight: 400;
}

.cottage-left {
  position: relative;
  display: flex;
  flex-direction: column;
  margin-left: 4rem;
  justify-content: center;
  align-items: center;
}

.cottage-left-img1 {
  display: flex;
}

.cottage-left-img2 {
  display: flex;
  margin-left: 13rem;
  margin-top: -8rem;
  z-index: 1;
}

.cottage-left-img3 {
  display: flex;
  margin-left: 3rem;
  margin-top: -2rem;
  z-index: 2;
}

.cottage-card {
  transition: transform 0.3s ease, z-index 0.3s ease;
  position: relative;
}
.cottage-card:hover {
  transform: scale(1.3); /* Slightly enlarge on hover */
  z-index: 10; /* Move to the front */
}
.cottage-card.active {
  transform: scale(1.3);
  z-index: 10;
}

.cottage-image {
  max-width: 30vw;
  max-height: 50vh;
  border-radius: 3rem;
}

.cottage-description-button {
  background-color: #cad4bf;
  padding: 0.5rem;
  color: #1d3d34;
  font-family: "Lobster Two", sans-serif;
  border: none;
  font-weight: 100;
  font-style: italic;
  font-size: 1.5rem;
  line-height: 1.5rem;
}

/*Accommodation */

.accommodation-title {
  background-color: #e9ead8;
}

.accommodation-section {
  background-color: #e9ead8;
  display: none;
  height: fit-content;
  padding-top: 5rem;
  padding-bottom: 10rem;
  justify-content: center;
  align-content: center;
  flex-direction: column;
  gap: 3rem;
}
.accommodation-text-section {
  margin-left: 20vw;
  margin-right: 20vw;
  justify-content: center;
  align-content: center;
  margin-bottom: 1rem;
}

.accommodation-text {
  line-height: 3rem;
  font-size: 1.8rem;
}

.accommodation-main {
  margin-left: 4rem;
  margin-right: 4rem;
  display: flex;
  background-color: #e9ead8;
  justify-content: center;
  align-content: center;
  gap: 7rem;
}

.accommodation-description {
  display: flex;
  background-color: #f1f1ef;
  background: radial-gradient(
    circle,
    rgba(241, 241, 239, 1) 0%,
    rgba(233, 234, 216, 1) 99%
  );

  border-radius: 2rem; /* Adjust corner roundness as needed */
  flex-direction: column;
  padding: 2rem;
}

.dot {
  display: none;
}

.accommodation-description:hover {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
.accommodation-name {
  font-family: "Lobster Two", sans-serif;
  font-size: 2.5rem;
  font-weight: 800;
  padding-top: 2rem;
}

.accommodation-details-list {
  margin-left: -1.5rem;
  margin-top: 3rem;
}

.accommodation-details-item {
  font-size: 1.2rem;
  line-height: 3rem;
}

.accommodation-image {
  max-width: 30vw;
  max-height: 40vh;
  display: flex;
  width: auto;
  padding-bottom: 2rem;
  border-radius: 1rem;
}

.accommodation-buttons {
  display: flex;
  gap: 2rem;
  margin-top: 3rem;
}

.view-accommodation-images {
  background-color: #f1f1ef;
  color: #1d3d34;
}

.accommodation-prev,
.accommodation-next {
  display: none;
}

/*units - Be Out Guest */

.unit-container {
  width: 100%;
  display: flex;
  height: 50rem;
  background-color: #f1f1ef;
  transition: transform 0.5s ease;
  cursor: none;
  padding-top: 5rem;
  padding-bottom: 10rem;
}

.unit-title {
  background-color: #f1f1ef;
}

.unit {
  width: 100%;
  background-color: #f1f1ef;
  padding-top: 5rem;
  padding-bottom: 5rem;
  display: flex;
  flex-shrink: 0;
  transition: opacity 1s ease;
}

.unit-left {
  background-color: #f1f1ef;
  display: flex;
  width: 64vw;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 1rem;
  margin-left: 5rem;
}

.unit-cottage {
  display: flex;
}

.unit-left-img-container {
  width: 42vw;
}

.unit-left-img {
  width: 32vw;
  margin-top: 1.5rem;
  height: auto;
  border-radius: 15px;
}

.unit-left-text-container {
  padding: 0.5rem;
  margin-top: 4rem;
}

.unit-left-text-header {
  font-family: "Lobster Two", sans-serif;
  font-weight: 100;
  font-style: italic;
  font-size: 3rem;
  line-height: 3rem;
}

.unit-left-text-description {
  padding-left: 2rem;
  padding-right: 1rem;
  margin-top: 2rem;
}
.unit-left-text-description p {
  font-family: "Roboto", sans-serif;
  font-size: 1.2rem;
  line-height: 1.45rem;
}

.unit-left-text-description li {
  font-family: "Roboto", sans-serif;
  font-size: 1.2rem;
  line-height: 1.8rem;
  font-weight: 400;
}

.unit-left-text-button {
  margin-top: 3rem;
  font-family: "Lobster Two", sans-serif;
  font-weight: 100;
  font-style: italic;
  font-size: 1.5rem;
  line-height: 1.5rem;
  background-color: #f1f1ef;
  padding: 0.5rem;
  color: #1d3d34;
  border: none;
}
.unit-right {
  display: flex;
  flex-direction: column;
  gap: 2rem;
}

.unit-right-img-vertical-container {
  margin-top: -8rem;
}
.unit-right-img-vertical {
  width: 28vw;
  border-radius: 15px;
  height: auto;
}
.unit-right-img-horizontal-container {
  margin-top: 13rem;
  margin-left: -3rem;
}
.unit-right-img-horizontal {
  width: 19vw;
  border-radius: 15px;
  height: auto;
}

.unit-farmhouse {
  display: none;
}

.unit[style*="display:flex"] {
  opacity: 1;
}
/* Custom cursor styling */
#custom-cursor {
  position: absolute;
  width: 100px;
  height: 100px;
  border-radius: 50%;
  background-color: rgba(0, 0, 0, 0.7);
  color: white;
  display: flex;
  justify-content: center;
  align-items: center;
  pointer-events: none; /* Ensures it doesn't interfere with clicks */
  font-size: 14px;
  transform: translate(-50%, -50%);
  transition: opacity 0.3s ease, transform 0.5s ease;
  z-index: 1000;
  opacity: 0;
}

/* ========================================= */

/* Amenities */
.services-title {
  background-color: #cad4bf;
}

.services {
  background-color: #cad4bf;
  color: #1d3d34;
  display: flex;
  height: fit-content;
  padding-top: 5rem;
  padding-bottom: 10rem;
  justify-content: center;
  flex-direction: column;
}

.services h4 {
  width: 100%;
}

.all-services {
  display: flex;
  gap: 2rem;
  margin-left: 4rem;
  margin-right: 4rem;
  margin-bottom: 4rem;
  flex-wrap: wrap;
}

.services-column {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  flex-grow: 1;
}

.service-item {
  height: 10rem;
  width: 20vw;
  background-color: #cad4bf;
  display: flex;
  gap: 1.5rem;
  padding: 0.5rem;
  padding-bottom: 0.7rem;
}

.service-text {
  display: flex;
  flex-direction: column;

  flex-basis: 20rem;
}

.service-name {
  display: flex;
  font-size: 1.3rem;
  flex-direction: column;
  color: #1d3d34;
}

.service-description {
  font-size: 1rem;
}

.service-logo {
  display: flex;
  width: 3rem;
  height: 3rem;
  align-self: center;
  stroke: #1d3d34;
}

.more-services-accordion {
  background-color: #cad4bf;
  margin-left: 4rem;
  margin-right: 4rem;
  display: flex;
  flex-direction: column;
}

.more-services-title {
  font-family: "Roboto", sans-serif;
  font-size: 1.3rem;
  font-weight: 600;
  display: flex;
  align-content: center;
  justify-content: flex-start;
  padding-left: 5rem;
  padding-top: 1rem;
}

/* ACTIVITIES SECTION */

.activities-title {
  background-color: #cad4bf;
}

.activities {
  background-color: #f1f1ef;
  color: #1d3d34;
  display: flex;
  height: fit-content;
  padding-top: 5rem;
  padding-bottom: 10rem;
  justify-content: center;
  flex-direction: column;
}

.activities h4 {
  width: 100%;
}

.all-activities {
  display: flex;
  gap: 2rem;
  margin-left: 4rem;
  margin-right: 4rem;
  margin-bottom: 4rem;
  flex-wrap: wrap;
}

.activities-column {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  flex-grow: 1;
}

.activities-item {
  height: 5rem;
  width: 20vw;
  padding: 1rem;
  display: flex;
  gap: 1.5rem;
}

.activities-text {
  display: flex;
  flex-direction: column;

  flex-basis: 20rem;
}

.activities-name {
  display: flex;
  font-size: 1.3rem;
  flex-direction: column;
  color: #1d3d34;
}

.activities-description {
  font-size: 1rem;
}

.activities-logo {
  display: flex;
  width: 3rem;
  height: 3rem;
  align-self: flex-start;
  padding-top: 2rem;
  stroke: #1d3d34;
}

.more-activities-accordion {
  background-color: #f1f1ef;
  margin-left: 2rem;
  margin-right: 2rem;
  display: flex;
  flex-direction: column;
}

.more-activities-title {
  display: flex;
  align-content: center;
  justify-content: flex-start;
  padding-left: 4rem;
  padding-top: 1rem;
}

.more-activities-anchor {
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 2rem;
  color: #1d3d34;

  padding: 0.1rem 0.2rem;
}

.more-activities-anchor:hover {
  background-color: #1d3d34;
  color: #f1f1ef;
}

.carousel-wrapper {
  display: none;
}
/*
.
.
.
.
. TESTIMONIALS
.
.
.
.
.
*/

.testimonial-section-title {
  background-color: #f1f1ef;
}

.testimonial-section {
  background-color: #f1f1ef;
  padding: 5rem 2rem;
  display: flex;
  flex-direction: column;
  justify-items: center;
  gap: 3rem;
}

.customer-testimonial-container {
  background-color: #f1f1ef;
  display: flex;
  justify-self: flex-start;
  flex-direction: column;
  gap: 2rem;
  padding-bottom: 7rem;
}

.testimonial-slogan-text {
  display: flex;
  line-height: 1.5rem;
  font-size: 1.6rem;
  justify-content: center;
}

.testimonial-block {
  display: flex; /* Enables positioning of child elements */
  overflow: hidden;

  width: 45vw;
  height: 75vh;

  max-width: 45vw;
  max-height: 75vh;
}

.testimonial-block-image {
  position: relative;
  background-position: center;
  cursor: pointer;
  transition: transform 0.5s ease;
  display: flex;
  flex: 1; /* Makes image section fill remaining space */
  background-size: cover; /* Ensures image covers the entire section */
  justify-content: flex-end;
}

.testimonial-block-text {
  position: relative;
  z-index: 2;
  opacity: 1;
  padding: 1rem;
  max-width: 35vw;
  max-height: 50vh;
  align-self: flex-end;
  background: radial-gradient(
    circle,
    rgba(0, 0, 0, 0.6) 0%,
    rgba(0, 0, 0, 0.6) 99%
  );
  font-size: 1.6rem;
  color: #fff;
}

.testimonial-block-image:hover .testimonial-block-text,
.testimonial-block-image.active .testimonial-block-text {
  opacity: 0; /* Hide content */
  z-index: 0;
}

.testimonial-block-image:hover,
.testimonial-block-image.active {
  transform: scale(1.1);
}

.testimonial-block-image:not(:hover):not(.active) {
  transform: scale(1);
}

.testimonial-block-left {
  border-radius: 15px;
  align-self: flex-start;
  margin-top: -12rem;
}

.testimonial-block-right {
  border-radius: 15px;
  align-self: flex-end;
  margin-top: -12rem;
}

.testimonial-text-left {
  border-radius: 5px;
}

.testimonial-text-right {
  border-radius: 5px;
}

.testimonial1 {
  margin: 0;
}

.customer-testimonial {
  background-color: #f1f1ef;
  max-width: 15vw;
  font-size: 1.15rem;
  display: flex;
  flex-direction: column;
  justify-items: center;
  align-items: center;
  padding: 0.5rem;
  gap: 0.5rem;
}

.customer-testimonial:hover {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.review-odd {
  flex-direction: column-reverse;
}

.customer-testimonial-image-container {
  display: flex;
  flex-direction: column;
  justify-items: center;
  align-items: center;
}
.customer-testimonial-image {
  max-width: 14vw;
  max-height: 35vh;
  border: 1px solid #1d3d34;
  border-radius: 1rem;
}
.customer-testimonial-text-container {
  font-style: italic;
  line-height: 1.55rem;
  overflow: scroll;
}

.text-container-odd {
  padding-top: 1.5rem;
}

.customer-testimonial-text {
  font-family: "Chivo", sans-serif;
  font-weight: 400;
  font-size: 0.9em;
  line-height: 1.5em;
  font-style: normal;
}

.customer-testimonial-name {
  font-family: "Roboto", sans-serif;
  font-weight: 500;
  font-size: 1em;
  line-height: 1.5em;
  font-style: normal;
}

.testimonial-prev,
.testimonial-next {
  display: none;
}

/*
  CONTACT US FORM STYLES
*/
.contact-form-title {
  background-color: #f1f1ef;
}

.form-title {
  text-align: center;
  font-size: 2rem;
  margin-bottom: 3rem;
  font-weight: bold; /* or other desired styles */
}

.contact-us-section {
  background-color: #f1f1ef;
}

.contact-middle {
  /* background-size: cover;
  background-repeat: no-repeat;
  background-image: linear-gradient(
      to right,
      rgba(0, 0, 0, 0.4),
      rgba(0, 0, 0, 0.4)
    ),
    url(../img/Contact-Section-Images/cottage-back-new.jpg);*/

  color: #1d3d34;
  background-color: #f1f1ef;
  display: flex;
  height: 90vh;
  padding-top: 5rem;
  padding-bottom: 12rem;
  justify-content: center;
}

.contact-section-images {
  max-width: 27vw;
  max-height: 50vh;
}

.contact-left-img1 {
  max-width: 35vw;
  height: auto;
  margin-right: -5rem;
  margin-left: 3rem;
  margin-top: -4rem;
  z-index: 1;
  border: 1px solid #1d3d34;
  border-radius: 1rem;
}

.contact-left-img2 {
  max-width: 35vw;
  height: auto;
  margin-right: -5rem;
  border: 1px solid #1d3d34;
  border-radius: 1rem;
}

.contact-left-img3 {
  max-width: 25vw;
  height: auto;
}

.contact-right-img1 {
  max-width: 35vw;
  height: auto;
  margin-left: -14rem;
  margin-top: -3rem;
  border: 1px solid #1d3d34;
  border-radius: 1rem;
}

.contact-right-img2 {
  max-width: 40vw;
  height: auto;
  margin-top: 2rem;
  margin-left: -25rem;
  border: 1px solid #1d3d34;
  border-radius: 1rem;
}

.contact-right-img3 {
  max-width: 20vw;
  height: auto;
  margin-left: -15rem;
}

.contact-form-div {
  font-weight: 800;
  display: flex;
  flex-direction: column;
  align-self: flex-start;
  justify-self: center;
  padding-top: 2rem;
  padding-left: 3rem;
  padding-right: 3rem;
  padding-bottom: 2rem;
  background-color: #f1f1ef;
  width: 35vw;
  margin-left: 2rem;
  margin-top: -3rem;
  margin-right: 2rem;
  border: 1px solid #1d3d34;
  background: radial-gradient(
    circle,
    rgba(241, 241, 239, 1) 0%,
    rgba(233, 234, 216, 1) 100%
  );
}

.contact-us-title {
  background-color: #f1f1ef;
}

.contact-form-div:hover {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

form {
  display: flex;
  flex-direction: column;
  width: 30vw; /* Adjust form width as needed */
  margin: 0 auto;
}

.sub-2 {
  display: flex;
  gap: 3rem;
}

.sub-3 {
  display: flex;
  gap: 3rem;
}

.sub-4 {
  display: flex;
  gap: 3rem;
}

.contact-left {
  width: 40%;
}

.contact-right {
  width: 40%;
}

label {
  margin-bottom: 10px;
  display: block;
}

input,
select {
  padding: 1rem;
  border: 1px solid black;
  border-radius: 4px;
  margin-bottom: 3em;
  width: 90%;
  font-size: 1.1rem;
}

input:hover,
select:hover {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
#name {
  width: 85%;
}
#interest {
  width: 100%;
}

button {
  background-color: #1d3d34;
  color: #f1f1ef;
  padding: 10px 20px;
  border-radius: 4px;
  cursor: pointer;
}

.form_button {
  padding-left: 2rem;
  padding-right: 2rem;
  font-family: "Roboto", sans-serif;
  font-weight: bold;
  font-size: 1.4rem;
  letter-spacing: 0.04rem;
  line-height: 1.5rem;
}
.map-section {
  display: flex;
  gap: 2rem;
  flex-direction: column;
}

.map {
  width: 40vw;
}

/*.address {
  display: flex;
  flex-direction: column;


  background-image: radial-gradient(
    closest-side at 42% 52%,
    #f1f1ef,
    #f1f1ef,
    #f1f1ef,
    #f1f1ef,
    #f1f1ef,
    #e9ead8
  );
  width: 30vw;
  padding-top: 5rem;
  padding-left: 5rem;
}  

.address {
  display: flex;
  flex-direction: column;
  width: 25vw;
  border: 1px solid #1d3d34;
  justify-content: center;
  align-content: center;
  justify-self: center;
  align-self: center;
  padding: 3rem;
  border-radius: 1rem;
  background-color: #f1f1ef;
  background: radial-gradient(
    circle,
    rgba(241, 241, 239, 1) 0%,
    rgba(233, 234, 216, 1) 100%
  );
}*/

/*
.
.

.
*/

.footer {
  background-color: #1d3d34;
  color: #fff;
  display: flex;
  margin: 0;
  margin-left: auto;
  margin-right: auto;
  padding: 2rem;
  gap: 3rem;
  padding-bottom: 2rem;
  padding-left: 15vw;
  border-bottom: 1px solid #f1f1ef;
}

.footer-information {
  display: flex;
  align-content: center;
  justify-content: center;
  gap: 20rem;
}

.footer-logo {
  display: flex;
  flex-direction: column;
  flex-grow: 0;
  flex-basis: 18rem;
  border-right: 3px solid #1d3d34;
  padding: 2rem;
  padding-top: 0;
  padding-bottom: 0;
}

.footer-logo-img {
  display: flex;
  height: auto;
  max-width: 150px;
  max-height: 170px;
  margin-bottom: 2rem;
}

.footer-company-name {
  font-size: 32px;
  font-weight: 800;
}

.footer-company-slogan {
  display: flex;
  width: 85%;
  line-height: 1.5em;
}

copyright {
  display: flex;
  font-size: 0.8rem;
  font-weight: 400;
  background-color: #1d3d34;
  height: 2.4rem;
  align-items: center;
  justify-content: center;
  color: #f1f1ef;
}

.pic {
  width: 50rem;
  height: 35rem;
}

.footer_sitelink_logo_container {
  display: flex;
  flex-direction: column;
  margin-left: 2rem;
}

.footer_logo {
  max-height: 4rem;
  width: auto;
  cursor: pointer;
}

.footer_logo_container {
  background-color: #fff;
  padding-left: 0.2rem;
  padding-right: 0.2rem;
}

.footer_sitelink_container {
  margin-top: 2rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.footer_sitelink_container span a {
  text-decoration: none;
  font-size: 1.2rem;
  color: #fff;
}

.address-contact-information {
  display: flex;
  margin-top: 6rem;
  flex-direction: column;
  gap: 1.5rem;
}

.address-contact-details {
  display: flex;
  gap: 1rem;
}

.address-contact-details-icon {
  display: flex;
  align-self: center;
  justify-content: center;
  width: 32px;
  height: 32px;
}

.address-contact-details-text {
  display: flex;
  flex-direction: column;
  width: 25rem;
}

.address-contact-details-header {
  font-size: 1.1rem;
  font-weight: 400;
  display: flex;
  align-self: flex-start;
  margin-bottom: 0.5rem;
}

.address-contact-details-description {
  font-size: 1.1rem;
  font-weight: 400;
  display: flex;
  color: #fff;
  text-decoration: none;
  align-self: flex-start;
  padding: 0;
  margin: 0;
}

.footer-socials {
  display: flex;
  gap: 2rem;
  flex-direction: column;
  justify-content: center;
}

.footer-socials-container {
  display: flex;
  gap: 0.5rem;
  justify-content: center;
}

.footer-socials-title {
  font-size: 1.4rem;
}
.fa {
  padding: 0.5rem;
  font-size: 1px;
  width: 50px;
  text-align: center;
  text-decoration: none;
  margin: 0.2rem 0.2rem;
}

.fa:hover {
  opacity: 0.5;
}

.fa-facebook {
  background: white;
  color: #3b5998;
}

.fa-twitter {
  background: white;
  color: #55acee;
}

.fa-youtube {
  background: white;
  color: #bb0000;
}

.fa-instagram {
  background: radial-gradient(
    circle at 30% 107%,
    #fdf497 0%,
    #fdf497 5%,
    #fd5949 45%,
    #d6249f 60%,
    #285aeb 90%
  );
  background: -webkit-radial-gradient(
    circle at 30% 107%,
    #fdf497 0%,
    #fdf497 5%,
    #fd5949 45%,
    #d6249f 60%,
    #285aeb 90%
  );
  color:white;
}

.fa-whatsapp {
  background: #25d366;
  color: white;
}

.disclaimer {
  display: none;
}

.thank-you-div {
  padding-left: 2rem;
  padding-right: 2rem;
}
.thank-you-div p {
  font-size: 1.2rem;
  font-weight: 500;
}

/* .
.
.
.
.
RESPONSIVE CODE
.
.
.
.
.
.
. 
*/