.home-page-banner-mother-container {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 35vh 0rem 35vh;
  background-image: url(../../images/BGthree.jpg);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  color: #fff;
}
.home-page-banner-mother-container::before {
  content: "";
  position: absolute;
  top: 0rem;
  left: 0rem;
  background-color: rgba(0, 0, 0, 0.404);
  width: 100%;
  height: 100%;
}
.home-page-banner-mother-container .heading-texts {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin: 0rem 0rem 8vh;
  z-index: 1;
}
.home-page-banner-mother-container .heading-texts h1 {
  margin: 0rem;
  padding: 0rem;
  font-size: 4rem;
  line-height: 4rem;
  font-weight: 500;
  text-align: center;
}
.home-page-banner-mother-container .home-page-services-btn {
  padding: 1rem 1.5rem;
  font-size: 1rem;
  background-color: #000;
  color: #fff;
  border: 1px solid #7a7a7a;
  z-index: 1;
  transition: all 0.5s ease-in-out;
  cursor: pointer;
}
.home-page-banner-mother-container .home-page-services-btn:hover {
  background-color: red;
}
.home-page-banner-mother-container .left-side-boxes {
  display: grid;
  grid-template-columns: repeat(4, 8vw);
  grid-template-rows: repeat(3, 16vh);
  position: absolute;
  bottom: 0rem;
  left: 0rem;
}
.home-page-banner-mother-container .left-side-boxes .box {
  width: 100%;
  height: 100%;
  background-color: #000;
}
.home-page-banner-mother-container .left-side-boxes #left-box-one,
.home-page-banner-mother-container .left-side-boxes #left-box-six,
.home-page-banner-mother-container .left-side-boxes #left-box-seven,
.home-page-banner-mother-container .left-side-boxes #left-box-twelve {
  background: rgba(238, 234, 234, 0.075);
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
}
.home-page-banner-mother-container .left-side-boxes #left-box-two,
.home-page-banner-mother-container .left-side-boxes #left-box-three,
.home-page-banner-mother-container .left-side-boxes #left-box-four,
.home-page-banner-mother-container .left-side-boxes #left-box-eight {
  background-color: transparent;
}
.home-page-banner-mother-container .left-side-boxes #left-box-five {
  background-color: khaki;
}
.home-page-banner-mother-container .left-side-boxes #left-box-nine,
.home-page-banner-mother-container .left-side-boxes #left-box-ten {
  background-color: #fff;
}
.home-page-banner-mother-container .left-side-boxes #left-box-elleven {
  background-color: rgb(128, 185, 166);
}
.home-page-banner-mother-container .right-side-boxes {
  display: grid;
  grid-template-columns: repeat(4, 8vw);
  grid-template-rows: repeat(3, 16vh);
  position: absolute;
  bottom: 0rem;
  right: 0rem;
}
.home-page-banner-mother-container .right-side-boxes .box {
  width: 100%;
  height: 100%;
  background-color: #000;
}
.home-page-banner-mother-container .right-side-boxes #right-box-one,
.home-page-banner-mother-container .right-side-boxes #right-box-two,
.home-page-banner-mother-container .right-side-boxes #right-box-five,
.home-page-banner-mother-container .right-side-boxes #right-box-nine {
  background-color: transparent;
}
.home-page-banner-mother-container .right-side-boxes #right-box-four {
  background: rgba(255, 255, 255, 0.075);
  backdrop-filter: blur(6.4px);
  -webkit-backdrop-filter: blur(6.4px);
}
.home-page-banner-mother-container .right-side-boxes #right-box-three {
  background: rgba(238, 234, 234, 0.034);
  backdrop-filter: blur(1px);
  -webkit-backdrop-filter: blur(1px);
}
.home-page-banner-mother-container .right-side-boxes #right-box-eight {
  background-color: burlywood;
}
.home-page-banner-mother-container .right-side-boxes #right-box-elleven,
.home-page-banner-mother-container .right-side-boxes #right-box-twelve {
  background-color: #fff;
}
.home-page-banner-mother-container .right-side-boxes #right-box-six,
.home-page-banner-mother-container .right-side-boxes #right-box-ten {
  background: rgba(238, 234, 234, 0.075);
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
}

/* ANIMATIONS */
.home-banner-anim {
  color: transparent;
  text-shadow: 0 0 2rem white;
  animation: unblur 2s forwards;
}

@keyframes unblur {
  to {
    text-shadow: 0 0 0 white;
  }
}
.anim {
  opacity: 0;
  transform: translateY(3rem);
  animation: moveup 1s linear forwards;
}

@keyframes moveup {
  100% {
    opacity: 1;
    transform: translateY(0rem);
  }
}
.text-review {
  opacity: 0;
  filter: blur(5px);
  transition: all 1s;
}

.text-show {
  opacity: 1;
  filter: blur(0);
}

/* MEDIA SCREEN RESPONSIVENESS */
@media (max-width: 1100px) {
  .home-page-banner-mother-container {
    padding: 20vh 0rem 25vh;
  }
  .home-page-banner-mother-container .heading-texts {
    margin: 0rem 0rem 8vh;
  }
  .home-page-banner-mother-container .home-page-services-btn {
    padding: 1rem 1.5rem;
    font-size: 1rem;
    background-color: #000;
    color: #fff;
    border: 1px solid #7a7a7a;
    z-index: 1;
  }
  .home-page-banner-mother-container .left-side-boxes {
    display: grid;
    grid-template-columns: repeat(4, 13vw);
    grid-template-rows: repeat(3, 10vh);
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-one,
  .home-page-banner-mother-container .left-side-boxes #left-box-six {
    background: rgba(238, 234, 234, 0.075);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-two,
  .home-page-banner-mother-container .left-side-boxes #left-box-three,
  .home-page-banner-mother-container .left-side-boxes #left-box-four,
  .home-page-banner-mother-container .left-side-boxes #left-box-eight {
    background-color: transparent;
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-five {
    background-color: khaki;
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-seven,
  .home-page-banner-mother-container .left-side-boxes #left-box-twelve {
    background-color: transparent;
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-nine {
    background-color: #fff;
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-ten {
    background-color: rgb(128, 185, 166);
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-elleven {
    background: rgba(238, 234, 234, 0.075);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
  }
  .home-page-banner-mother-container .right-side-boxes {
    display: grid;
    grid-template-columns: repeat(4, 13vw);
    grid-template-rows: repeat(3, 10vh);
    position: absolute;
    bottom: 0rem;
    right: 0rem;
  }
  .home-page-banner-mother-container .right-side-boxes .box {
    width: 100%;
    height: 100%;
    background-color: #000;
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-one,
  .home-page-banner-mother-container .right-side-boxes #right-box-two,
  .home-page-banner-mother-container .right-side-boxes #right-box-five,
  .home-page-banner-mother-container .right-side-boxes #right-box-nine {
    background-color: transparent;
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-four {
    background: rgba(255, 255, 255, 0.075);
    backdrop-filter: blur(6.4px);
    -webkit-backdrop-filter: blur(6.4px);
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-three {
    background: transparent;
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-eight {
    background-color: burlywood;
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-elleven {
    background-color: #000;
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-twelve {
    background-color: #fff;
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-six {
    background: transparent;
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-seven {
    background: rgba(238, 234, 234, 0.075);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-ten {
    background: transparent;
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
  }
}
@media (max-width: 900px) {
  .home-page-banner-mother-container {
    padding: 20vh 0rem 25vh;
  }
  .home-page-banner-mother-container .heading-texts {
    margin: 0rem 0rem 8vh;
  }
  .home-page-banner-mother-container .left-side-boxes {
    display: grid;
    grid-template-columns: repeat(4, 12vw);
    grid-template-rows: repeat(3, 8vh);
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-one,
  .home-page-banner-mother-container .left-side-boxes #left-box-six {
    background: rgba(238, 234, 234, 0.075);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-two,
  .home-page-banner-mother-container .left-side-boxes #left-box-three,
  .home-page-banner-mother-container .left-side-boxes #left-box-four,
  .home-page-banner-mother-container .left-side-boxes #left-box-eight {
    background-color: transparent;
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-five {
    background-color: khaki;
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-seven,
  .home-page-banner-mother-container .left-side-boxes #left-box-twelve {
    background-color: transparent;
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-nine {
    background-color: #fff;
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-ten {
    background-color: rgb(128, 185, 166);
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-elleven {
    background: rgba(238, 234, 234, 0.075);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
  }
  .home-page-banner-mother-container .right-side-boxes {
    display: grid;
    grid-template-columns: repeat(4, 12vw);
    grid-template-rows: repeat(3, 8vh);
    position: absolute;
    bottom: 0rem;
    right: 0rem;
  }
  .home-page-banner-mother-container .right-side-boxes .box {
    width: 100%;
    height: 100%;
    background-color: #000;
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-one,
  .home-page-banner-mother-container .right-side-boxes #right-box-two,
  .home-page-banner-mother-container .right-side-boxes #right-box-five,
  .home-page-banner-mother-container .right-side-boxes #right-box-nine {
    background-color: transparent;
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-four {
    background: rgba(255, 255, 255, 0.075);
    backdrop-filter: blur(6.4px);
    -webkit-backdrop-filter: blur(6.4px);
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-three {
    background: transparent;
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-eight {
    background-color: burlywood;
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-elleven {
    background-color: #000;
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-twelve {
    background-color: #fff;
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-six {
    background: transparent;
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-seven {
    background: rgba(238, 234, 234, 0.075);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-ten {
    background: transparent;
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
  }
}
@media (max-width: 600px) {
  .home-page-banner-mother-container {
    padding: 30vh 0rem 40vh;
  }
  .home-page-banner-mother-container .heading-texts {
    margin: 0rem 0rem 8vh;
    padding: 0rem 1rem;
    text-align: center;
  }
  .home-page-banner-mother-container .heading-texts h1 {
    font-size: 3rem;
    line-height: 3rem;
    font-weight: 500;
  }
  .home-page-banner-mother-container .left-side-boxes {
    display: grid;
    grid-template-columns: repeat(4, 18vw);
    grid-template-rows: repeat(3, 13vh);
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-one,
  .home-page-banner-mother-container .left-side-boxes #left-box-six {
    background: rgba(238, 234, 234, 0.075);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-two,
  .home-page-banner-mother-container .left-side-boxes #left-box-three,
  .home-page-banner-mother-container .left-side-boxes #left-box-four,
  .home-page-banner-mother-container .left-side-boxes #left-box-eight {
    background-color: transparent;
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-five {
    background-color: khaki;
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-seven,
  .home-page-banner-mother-container .left-side-boxes #left-box-twelve {
    background-color: transparent;
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-nine {
    background-color: #fff;
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-ten {
    background-color: rgb(128, 185, 166);
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-elleven {
    background: rgba(238, 234, 234, 0.075);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
  }
  .home-page-banner-mother-container .right-side-boxes {
    display: grid;
    grid-template-columns: repeat(4, 18vw);
    grid-template-rows: repeat(3, 13vh);
    position: absolute;
    bottom: 0rem;
    right: 0rem;
  }
  .home-page-banner-mother-container .right-side-boxes .box {
    width: 100%;
    height: 100%;
    background-color: #000;
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-one,
  .home-page-banner-mother-container .right-side-boxes #right-box-two,
  .home-page-banner-mother-container .right-side-boxes #right-box-five,
  .home-page-banner-mother-container .right-side-boxes #right-box-nine {
    background-color: transparent;
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-four {
    background: rgba(255, 255, 255, 0.075);
    backdrop-filter: blur(6.4px);
    -webkit-backdrop-filter: blur(6.4px);
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-three {
    background: transparent;
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-eight {
    background-color: burlywood;
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-elleven {
    background-color: #000;
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-twelve {
    background-color: #fff;
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-six {
    background: transparent;
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-seven {
    background: rgba(238, 234, 234, 0.075);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-ten {
    background: transparent;
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
  }
}
@media (max-width: 500px) {
  .home-page-banner-mother-container {
    padding: 30vh 0rem 40vh;
  }
  .home-page-banner-mother-container .heading-texts {
    margin: 0rem 0rem 8vh;
    padding: 0rem 1rem;
    text-align: center;
  }
  .home-page-banner-mother-container .heading-texts h1 {
    font-size: 3rem;
    line-height: 3rem;
    font-weight: 500;
  }
  .home-page-banner-mother-container .left-side-boxes {
    display: grid;
    grid-template-columns: repeat(4, 4.5rem);
    grid-template-rows: repeat(3, 4.5rem);
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-one,
  .home-page-banner-mother-container .left-side-boxes #left-box-six {
    background: rgba(238, 234, 234, 0.075);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-two,
  .home-page-banner-mother-container .left-side-boxes #left-box-three,
  .home-page-banner-mother-container .left-side-boxes #left-box-four,
  .home-page-banner-mother-container .left-side-boxes #left-box-eight {
    background-color: transparent;
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-five {
    background-color: khaki;
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-seven,
  .home-page-banner-mother-container .left-side-boxes #left-box-twelve {
    background-color: transparent;
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-nine {
    background-color: #fff;
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-ten {
    background-color: rgb(128, 185, 166);
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-elleven {
    background: rgba(238, 234, 234, 0.075);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
  }
  .home-page-banner-mother-container .right-side-boxes {
    display: grid;
    grid-template-columns: repeat(4, 4.5rem);
    grid-template-rows: repeat(3, 4.5rem);
    position: absolute;
    bottom: 0rem;
    right: 0rem;
  }
  .home-page-banner-mother-container .right-side-boxes .box {
    width: 100%;
    height: 100%;
    background-color: #000;
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-one,
  .home-page-banner-mother-container .right-side-boxes #right-box-two,
  .home-page-banner-mother-container .right-side-boxes #right-box-five,
  .home-page-banner-mother-container .right-side-boxes #right-box-nine {
    background-color: transparent;
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-four {
    background: rgba(255, 255, 255, 0.075);
    backdrop-filter: blur(6.4px);
    -webkit-backdrop-filter: blur(6.4px);
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-three {
    background: transparent;
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-eight {
    background-color: burlywood;
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-elleven {
    background-color: #000;
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-twelve {
    background-color: #fff;
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-six {
    background: transparent;
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-seven {
    background: rgba(238, 234, 234, 0.075);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-ten {
    background: transparent;
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
  }
}
@media (max-width: 400px) {
  .home-page-banner-mother-container {
    padding: 27vh 0rem 40vh;
  }
  .home-page-banner-mother-container .heading-texts {
    margin: 0rem 0rem 8vh;
    padding: 0rem 1rem;
    text-align: center;
  }
  .home-page-banner-mother-container .heading-texts h1 {
    font-size: 3rem;
    line-height: 3rem;
    font-weight: 500;
  }
  .home-page-banner-mother-container .left-side-boxes {
    display: grid;
    grid-template-columns: repeat(4, 4.2rem);
    grid-template-rows: repeat(3, 4.2rem);
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-one,
  .home-page-banner-mother-container .left-side-boxes #left-box-six {
    background: rgba(238, 234, 234, 0.075);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-two,
  .home-page-banner-mother-container .left-side-boxes #left-box-three,
  .home-page-banner-mother-container .left-side-boxes #left-box-four,
  .home-page-banner-mother-container .left-side-boxes #left-box-eight {
    background-color: transparent;
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-five {
    background-color: khaki;
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-seven,
  .home-page-banner-mother-container .left-side-boxes #left-box-twelve {
    background-color: transparent;
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-nine {
    background-color: #fff;
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-ten {
    background-color: rgb(128, 185, 166);
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-elleven {
    background: rgba(238, 234, 234, 0.075);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
  }
  .home-page-banner-mother-container .right-side-boxes {
    display: grid;
    grid-template-columns: repeat(4, 4.2rem);
    grid-template-rows: repeat(3, 4.2rem);
    position: absolute;
    bottom: 0rem;
    right: 0rem;
  }
  .home-page-banner-mother-container .right-side-boxes .box {
    width: 100%;
    height: 100%;
    background-color: #000;
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-one,
  .home-page-banner-mother-container .right-side-boxes #right-box-two,
  .home-page-banner-mother-container .right-side-boxes #right-box-five,
  .home-page-banner-mother-container .right-side-boxes #right-box-nine {
    background-color: transparent;
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-four {
    background: rgba(255, 255, 255, 0.075);
    backdrop-filter: blur(6.4px);
    -webkit-backdrop-filter: blur(6.4px);
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-three {
    background: transparent;
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-eight {
    background-color: burlywood;
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-elleven {
    background-color: #000;
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-twelve {
    background-color: #fff;
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-six {
    background: transparent;
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-seven {
    background: rgba(238, 234, 234, 0.075);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-ten {
    background: transparent;
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
  }
}
@media (max-width: 380px) {
  .home-page-banner-mother-container {
    padding: 28vh 0rem 30vh;
  }
  .home-page-banner-mother-container .heading-texts {
    margin: 0rem 0rem 8vh;
    padding: 0rem 1rem;
    text-align: center;
  }
  .home-page-banner-mother-container .heading-texts h1 {
    font-size: 3rem;
    line-height: 3rem;
    font-weight: 500;
  }
  .home-page-banner-mother-container .left-side-boxes {
    display: grid;
    grid-template-columns: repeat(4, 4rem);
    grid-template-rows: repeat(3, 4rem);
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-one,
  .home-page-banner-mother-container .left-side-boxes #left-box-six {
    background: rgba(238, 234, 234, 0.075);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-two,
  .home-page-banner-mother-container .left-side-boxes #left-box-three,
  .home-page-banner-mother-container .left-side-boxes #left-box-four,
  .home-page-banner-mother-container .left-side-boxes #left-box-eight {
    background-color: transparent;
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-five {
    background-color: khaki;
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-seven,
  .home-page-banner-mother-container .left-side-boxes #left-box-twelve {
    background-color: transparent;
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-nine {
    background-color: #fff;
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-ten {
    background-color: rgb(128, 185, 166);
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-elleven {
    background: rgba(238, 234, 234, 0.075);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
  }
  .home-page-banner-mother-container .right-side-boxes {
    display: grid;
    grid-template-columns: repeat(4, 4rem);
    grid-template-rows: repeat(3, 4rem);
    position: absolute;
    bottom: 0rem;
    right: 0rem;
  }
  .home-page-banner-mother-container .right-side-boxes .box {
    width: 100%;
    height: 100%;
    background-color: #000;
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-one,
  .home-page-banner-mother-container .right-side-boxes #right-box-two,
  .home-page-banner-mother-container .right-side-boxes #right-box-five,
  .home-page-banner-mother-container .right-side-boxes #right-box-nine {
    background-color: transparent;
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-four {
    background: rgba(255, 255, 255, 0.075);
    backdrop-filter: blur(6.4px);
    -webkit-backdrop-filter: blur(6.4px);
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-three {
    background: transparent;
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-eight {
    background-color: burlywood;
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-elleven {
    background-color: #000;
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-twelve {
    background-color: #fff;
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-six {
    background: transparent;
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-seven {
    background: rgba(238, 234, 234, 0.075);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-ten {
    background: transparent;
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
  }
}
@media (max-width: 370px) {
  .home-page-banner-mother-container {
    padding: 25vh 0rem 35vh;
  }
  .home-page-banner-mother-container .heading-texts {
    margin: 0rem 0rem 8vh;
    padding: 0rem 1rem;
    text-align: center;
  }
  .home-page-banner-mother-container .heading-texts h1 {
    font-size: 3rem;
    line-height: 3rem;
    font-weight: 500;
  }
  .home-page-banner-mother-container .left-side-boxes {
    display: grid;
    grid-template-columns: repeat(4, 3.7rem);
    grid-template-rows: repeat(3, 3.7rem);
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-one,
  .home-page-banner-mother-container .left-side-boxes #left-box-six {
    background: rgba(238, 234, 234, 0.075);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-two,
  .home-page-banner-mother-container .left-side-boxes #left-box-three,
  .home-page-banner-mother-container .left-side-boxes #left-box-four,
  .home-page-banner-mother-container .left-side-boxes #left-box-eight {
    background-color: transparent;
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-five {
    background-color: khaki;
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-seven,
  .home-page-banner-mother-container .left-side-boxes #left-box-twelve {
    background-color: transparent;
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-nine {
    background-color: #fff;
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-ten {
    background-color: rgb(128, 185, 166);
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-elleven {
    background: rgba(238, 234, 234, 0.075);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
  }
  .home-page-banner-mother-container .right-side-boxes {
    display: grid;
    grid-template-columns: repeat(4, 3.7rem);
    grid-template-rows: repeat(3, 3.7rem);
    position: absolute;
    bottom: 0rem;
    right: 0rem;
  }
  .home-page-banner-mother-container .right-side-boxes .box {
    width: 100%;
    height: 100%;
    background-color: #000;
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-one,
  .home-page-banner-mother-container .right-side-boxes #right-box-two,
  .home-page-banner-mother-container .right-side-boxes #right-box-five,
  .home-page-banner-mother-container .right-side-boxes #right-box-nine {
    background-color: transparent;
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-four {
    background: rgba(255, 255, 255, 0.075);
    backdrop-filter: blur(6.4px);
    -webkit-backdrop-filter: blur(6.4px);
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-three {
    background: transparent;
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-eight {
    background-color: burlywood;
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-elleven {
    background-color: #000;
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-twelve {
    background-color: #fff;
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-six {
    background: transparent;
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-seven {
    background: rgba(238, 234, 234, 0.075);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-ten {
    background: transparent;
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
  }
}
@media (max-width: 350px) {
  .home-page-banner-mother-container {
    padding: 30vh 0rem 35vh;
  }
  .home-page-banner-mother-container .heading-texts {
    margin: 0rem 0rem 8vh;
    padding: 0rem 1rem;
    text-align: center;
  }
  .home-page-banner-mother-container .heading-texts h1 {
    font-size: 3rem;
    line-height: 3rem;
    font-weight: 500;
  }
  .home-page-banner-mother-container .left-side-boxes {
    display: grid;
    grid-template-columns: repeat(4, 3.7rem);
    grid-template-rows: repeat(3, 3.6rem);
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-one,
  .home-page-banner-mother-container .left-side-boxes #left-box-six {
    background: rgba(238, 234, 234, 0.075);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-two,
  .home-page-banner-mother-container .left-side-boxes #left-box-three,
  .home-page-banner-mother-container .left-side-boxes #left-box-four,
  .home-page-banner-mother-container .left-side-boxes #left-box-eight {
    background-color: transparent;
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-five {
    background-color: khaki;
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-seven,
  .home-page-banner-mother-container .left-side-boxes #left-box-twelve {
    background-color: transparent;
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-nine {
    background-color: #fff;
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-ten {
    background-color: rgb(128, 185, 166);
  }
  .home-page-banner-mother-container .left-side-boxes #left-box-elleven {
    background: rgba(238, 234, 234, 0.075);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
  }
  .home-page-banner-mother-container .right-side-boxes {
    display: grid;
    grid-template-columns: repeat(4, 3.7rem);
    grid-template-rows: repeat(3, 3.6rem);
    position: absolute;
    bottom: 0rem;
    right: 0rem;
  }
  .home-page-banner-mother-container .right-side-boxes .box {
    width: 100%;
    height: 100%;
    background-color: #000;
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-one,
  .home-page-banner-mother-container .right-side-boxes #right-box-two,
  .home-page-banner-mother-container .right-side-boxes #right-box-five,
  .home-page-banner-mother-container .right-side-boxes #right-box-nine {
    background-color: transparent;
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-four {
    background: rgba(255, 255, 255, 0.075);
    backdrop-filter: blur(6.4px);
    -webkit-backdrop-filter: blur(6.4px);
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-three {
    background: transparent;
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-eight {
    background-color: burlywood;
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-elleven {
    background-color: #000;
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-twelve {
    background-color: #fff;
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-six {
    background: transparent;
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-seven {
    background: rgba(238, 234, 234, 0.075);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
  }
  .home-page-banner-mother-container .right-side-boxes #right-box-ten {
    background: transparent;
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
  }
}
.who-we-are-mother-container {
  margin: 12vh 0vh;
}
.who-we-are-mother-container .grid-section {
  display: grid;
  grid-template-columns: 1fr 1.5fr;
  gap: 6rem;
  height: 65vh;
}
.who-we-are-mother-container .grid-section .image-container {
  position: relative;
  background-image: url(../../images/blackManWorkingSHARP.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.who-we-are-mother-container .grid-section .image-container .single-black-box,
.who-we-are-mother-container .grid-section .image-container .boxes-container div {
  width: 8vw;
  height: 16vh;
}
.who-we-are-mother-container .grid-section .image-container .single-black-box {
  background-color: #000;
  position: absolute;
  right: 0rem;
}
.who-we-are-mother-container .grid-section .image-container .boxes-container {
  display: flex;
  flex-direction: column;
  position: absolute;
  bottom: 0rem;
}
.who-we-are-mother-container .grid-section .image-container .boxes-container .box-one {
  background-color: pink;
}
.who-we-are-mother-container .grid-section .image-container .boxes-container .box-two {
  background-color: white;
}
.who-we-are-mother-container .grid-section .text-container {
  display: flex;
  align-items: center;
  padding: 0rem 8rem 0rem 0rem;
}
.who-we-are-mother-container .grid-section .text-container .whoweare-text h4 {
  font-size: 0.9rem;
  font-weight: lighter;
  padding: 0rem;
  margin: 0rem 0rem 1rem;
}
.who-we-are-mother-container .grid-section .text-container .whoweare-text h1 {
  font-size: 2.5rem;
  font-weight: 480;
  padding: 0rem;
  margin: 0rem 0rem 1.5rem;
}
.who-we-are-mother-container .grid-section .text-container .whoweare-text p {
  font-size: 0.9rem;
  line-height: 1.4rem;
  padding: 0rem;
  margin: 0rem 0rem 1.5rem;
}
.who-we-are-mother-container .grid-section .text-container .whoweare-text button {
  padding: 1rem 1.5rem;
  font-size: 1rem;
  border: none;
  background-color: burlywood;
  margin: 1rem 0rem 0rem;
  transition: all 0.5s ease-in-out;
  cursor: pointer;
}
.who-we-are-mother-container .grid-section .text-container .whoweare-text button:hover {
  background-color: red;
  color: #fff;
}

/* MEDIA SCREEN RESPONSIVENESS */
@media (max-width: 1100px) {
  .who-we-are-mother-container {
    margin: 8vh 0vh;
    padding: 0rem 1rem;
  }
  .who-we-are-mother-container .grid-section {
    display: grid;
    grid-template-columns: 1fr 1.3fr;
    gap: 2rem;
    height: 40vh;
  }
  .who-we-are-mother-container .grid-section .image-container .single-black-box,
  .who-we-are-mother-container .grid-section .image-container .boxes-container div {
    width: 13vw;
    height: 10vh;
  }
  .who-we-are-mother-container .grid-section .text-container {
    padding: 0rem 0rem 0rem 0rem;
  }
}
@media (max-width: 900px) {
  .who-we-are-mother-container {
    margin: 8vh 0vh;
    padding: 0rem 1rem;
  }
  .who-we-are-mother-container .grid-section {
    display: grid;
    grid-template-columns: 1fr 1.3fr;
    gap: 2rem;
    height: 45vh;
  }
  .who-we-are-mother-container .grid-section .image-container .single-black-box,
  .who-we-are-mother-container .grid-section .image-container .boxes-container div {
    width: 12vw;
    height: 8vh;
  }
  .who-we-are-mother-container .grid-section .text-container {
    padding: 0rem;
  }
}
@media (max-width: 600px) {
  .who-we-are-mother-container {
    margin: 8vh 0vh;
    padding: 0rem;
  }
  .who-we-are-mother-container .grid-section {
    display: grid;
    grid-template-columns: 100%;
    gap: 2rem;
    height: -moz-max-content;
    height: max-content;
  }
  .who-we-are-mother-container .grid-section .image-container {
    height: 43vh;
  }
  .who-we-are-mother-container .grid-section .image-container .single-black-box,
  .who-we-are-mother-container .grid-section .image-container .boxes-container div {
    width: 18vw;
    height: 13vh;
  }
  .who-we-are-mother-container .grid-section .text-container {
    padding: 0rem 1rem;
  }
  .who-we-are-mother-container .grid-section .text-container .whoweare-text h4 {
    font-size: 1rem;
    font-weight: 300;
    padding: 0rem;
    margin: 0rem 0rem 1rem;
  }
  .who-we-are-mother-container .grid-section .text-container .whoweare-text h1 {
    font-size: 2rem;
    font-weight: 480;
    padding: 0rem;
    margin: 0rem 0rem 1rem;
  }
  .who-we-are-mother-container .grid-section .text-container .whoweare-text p {
    font-size: 1rem;
    line-height: 1.5rem;
    padding: 0rem;
    margin: 0rem 0rem 1rem;
    word-spacing: 0.5em;
  }
  .who-we-are-mother-container .grid-section .text-container .whoweare-text button {
    padding: 1rem 1.5rem;
    font-size: 1rem;
    border: none;
    background-color: burlywood;
    margin: 1rem 0rem 0rem;
  }
}
@media (max-width: 500px) {
  .who-we-are-mother-container {
    margin: 8vh 0vh;
    padding: 0rem;
  }
  .who-we-are-mother-container .grid-section {
    display: grid;
    grid-template-columns: 100%;
    gap: 2rem;
    height: -moz-max-content;
    height: max-content;
  }
  .who-we-are-mother-container .grid-section .image-container {
    height: 15rem;
  }
  .who-we-are-mother-container .grid-section .image-container .single-black-box,
  .who-we-are-mother-container .grid-section .image-container .boxes-container div {
    width: 4.5rem;
    height: 4.5rem;
  }
  .who-we-are-mother-container .grid-section .text-container {
    padding: 0rem 1rem;
  }
  .who-we-are-mother-container .grid-section .text-container .whoweare-text h4 {
    font-size: 1rem;
    font-weight: 300;
    padding: 0rem;
    margin: 0rem 0rem 1rem;
  }
  .who-we-are-mother-container .grid-section .text-container .whoweare-text h1 {
    font-size: 2rem;
    font-weight: 480;
    padding: 0rem;
    margin: 0rem 0rem 1rem;
  }
  .who-we-are-mother-container .grid-section .text-container .whoweare-text p {
    font-size: 1rem;
    line-height: 1.5rem;
    padding: 0rem;
    margin: 0rem 0rem 1rem;
    word-spacing: 0.5em;
  }
  .who-we-are-mother-container .grid-section .text-container .whoweare-text button {
    padding: 1rem 1.5rem;
    font-size: 1rem;
    border: none;
    background-color: burlywood;
    margin: 1rem 0rem 0rem;
  }
}
@media (max-width: 400px) {
  .who-we-are-mother-container {
    margin: 8vh 0vh;
    padding: 0rem;
  }
  .who-we-are-mother-container .grid-section {
    display: grid;
    grid-template-columns: 100%;
    gap: 2rem;
    height: -moz-max-content;
    height: max-content;
  }
  .who-we-are-mother-container .grid-section .image-container {
    height: 15rem;
  }
  .who-we-are-mother-container .grid-section .image-container .single-black-box,
  .who-we-are-mother-container .grid-section .image-container .boxes-container div {
    width: 4.2rem;
    height: 4.2rem;
  }
  .who-we-are-mother-container .grid-section .text-container {
    padding: 0rem 1rem;
  }
  .who-we-are-mother-container .grid-section .text-container .whoweare-text h4 {
    font-size: 1rem;
    font-weight: 300;
    padding: 0rem;
    margin: 0rem 0rem 1rem;
  }
  .who-we-are-mother-container .grid-section .text-container .whoweare-text h1 {
    font-size: 2rem;
    font-weight: 480;
    padding: 0rem;
    margin: 0rem 0rem 1rem;
  }
  .who-we-are-mother-container .grid-section .text-container .whoweare-text p {
    font-size: 1rem;
    line-height: 1.5rem;
    padding: 0rem;
    margin: 0rem 0rem 1rem;
    word-spacing: 0.5em;
  }
  .who-we-are-mother-container .grid-section .text-container .whoweare-text button {
    padding: 1rem 1.5rem;
    font-size: 1rem;
    border: none;
    background-color: burlywood;
    margin: 1rem 0rem 0rem;
  }
}
@media (max-width: 380px) {
  .who-we-are-mother-container {
    margin: 8vh 0vh;
    padding: 0rem;
  }
  .who-we-are-mother-container .grid-section {
    display: grid;
    grid-template-columns: 100%;
    gap: 2rem;
    height: -moz-max-content;
    height: max-content;
  }
  .who-we-are-mother-container .grid-section .image-container {
    height: 15rem;
  }
  .who-we-are-mother-container .grid-section .image-container .single-black-box,
  .who-we-are-mother-container .grid-section .image-container .boxes-container div {
    width: 4rem;
    height: 4rem;
  }
  .who-we-are-mother-container .grid-section .text-container {
    padding: 0rem 1rem;
  }
  .who-we-are-mother-container .grid-section .text-container .whoweare-text h4 {
    font-size: 1rem;
    font-weight: 300;
    padding: 0rem;
    margin: 0rem 0rem 1rem;
  }
  .who-we-are-mother-container .grid-section .text-container .whoweare-text h1 {
    font-size: 2rem;
    font-weight: 480;
    padding: 0rem;
    margin: 0rem 0rem 1rem;
  }
  .who-we-are-mother-container .grid-section .text-container .whoweare-text p {
    font-size: 1rem;
    line-height: 1.5rem;
    padding: 0rem;
    margin: 0rem 0rem 1rem;
    word-spacing: 0.5em;
  }
  .who-we-are-mother-container .grid-section .text-container .whoweare-text button {
    padding: 1rem 1.5rem;
    font-size: 1rem;
    border: none;
    background-color: burlywood;
    margin: 1rem 0rem 0rem;
  }
}
@media (max-width: 370px) {
  .who-we-are-mother-container {
    margin: 8vh 0vh;
    padding: 0rem;
  }
  .who-we-are-mother-container .grid-section {
    display: grid;
    grid-template-columns: 100%;
    gap: 2rem;
    height: -moz-max-content;
    height: max-content;
  }
  .who-we-are-mother-container .grid-section .image-container {
    height: 15rem;
  }
  .who-we-are-mother-container .grid-section .image-container .single-black-box,
  .who-we-are-mother-container .grid-section .image-container .boxes-container div {
    width: 3.7rem;
    height: 3.7rem;
  }
  .who-we-are-mother-container .grid-section .text-container {
    padding: 0rem 1rem;
  }
  .who-we-are-mother-container .grid-section .text-container .whoweare-text h4 {
    font-size: 1rem;
    font-weight: 300;
    padding: 0rem;
    margin: 0rem 0rem 1rem;
  }
  .who-we-are-mother-container .grid-section .text-container .whoweare-text h1 {
    font-size: 2rem;
    font-weight: 480;
    padding: 0rem;
    margin: 0rem 0rem 1rem;
  }
  .who-we-are-mother-container .grid-section .text-container .whoweare-text p {
    font-size: 1rem;
    line-height: 1.5rem;
    padding: 0rem;
    margin: 0rem 0rem 1rem;
    word-spacing: 0.5em;
  }
  .who-we-are-mother-container .grid-section .text-container .whoweare-text button {
    padding: 1rem 1.5rem;
    font-size: 1rem;
    border: none;
    background-color: burlywood;
    margin: 1rem 0rem 0rem;
  }
}
body {
  padding: 0rem;
  margin: 0rem;
  box-sizing: border-box;
  font-family: sans-serif;
}

body::-webkit-scrollbar {
  display: none;
}

.max-width {
  max-width: 1200px;
  margin: 0rem auto;
}

/* MEDIA SCREEN RESPONSIVENESS */
@media (max-width: 1100px) {
  .max-width {
    max-width: 100%;
    margin: 0rem;
    overflow: hidden;
  }
}
.video-plus-experience-mother-container {
  position: relative;
  background-image: linear-gradient(180deg, white 36%, pink 0.1%, pink 64%);
  padding: 0vh 0vh 10vh;
}
.video-plus-experience-mother-container::after {
  content: "";
  position: absolute;
  bottom: 0rem;
  right: 0rem;
  height: 16vh;
  width: 8vw;
  background-color: #fff;
}
.video-plus-experience-mother-container .video-container {
  position: relative;
  width: 100%;
  height: 80vh;
  justify-self: center;
  display: flex;
  align-items: center;
  justify-content: center;
}
.video-plus-experience-mother-container .video-container .play-vidz {
  position: relative;
  width: 6rem;
  height: 5rem;
  font-size: 1rem;
  position: absolute;
  font-size: 2rem;
  top: 30vh;
  left: 46%;
  background-color: #fff;
  color: #000;
  transition: all 0.5s ease-in-out;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
}
.video-plus-experience-mother-container .video-container .play-vidz:hover {
  background-color: #000;
  color: #fff;
}
.video-plus-experience-mother-container .video-container #companyVidz {
  width: 100%;
  height: 100%;
  cursor: pointer;
}
.video-plus-experience-mother-container .video-container video::-webkit-media-controls {
  position: relative;
}
.video-plus-experience-mother-container .video-container .top-boxes {
  position: absolute;
  left: 0;
  top: 0;
  display: flex;
  flex-direction: column;
  z-index: 1;
}
.video-plus-experience-mother-container .video-container .top-boxes div {
  width: 8vw;
  height: 16vh;
  background-color: #fff;
}
.video-plus-experience-mother-container .video-container .top-boxes .second-box {
  background-color: bisque;
}
.video-plus-experience-mother-container .video-container .thumbnail {
  width: 100%;
  height: 100%;
  position: absolute;
}
.video-plus-experience-mother-container .video-container .right-boxes {
  position: absolute;
  right: 0;
  top: 0;
  display: flex;
  flex-direction: column;
  z-index: 1;
}
.video-plus-experience-mother-container .video-container .right-boxes .bhox {
  width: 8vw;
  height: 16vh;
  background-color: #fff;
}
.video-plus-experience-mother-container .video-container .right-boxes .half-box {
  width: 8vw;
  height: 8vh;
  background-color: transparent;
}
.video-plus-experience-mother-container .video-container .right-boxes .almost-box {
  width: 8vw;
  height: 8vh;
  background-color: transparent;
}
.video-plus-experience-mother-container .video-container .right-boxes .second-box {
  background-color: rgb(149, 207, 207);
  position: relative;
  right: -4vw;
}
.video-plus-experience-mother-container .video-container .right-boxes .forth-box {
  background-color: transparent;
}
.video-plus-experience-mother-container .video-container .right-boxes .fifth-box {
  background-color: pink;
}
.video-plus-experience-mother-container .straight-line {
  height: 1px;
  background-color: rgba(122, 122, 122, 0.4784313725);
  margin: 10vh 0vh 4vh;
}
.video-plus-experience-mother-container .projects-plus-years {
  display: flex;
  align-items: center;
  justify-content: space-around;
}
.video-plus-experience-mother-container .projects-plus-years .number-text-first {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.video-plus-experience-mother-container .projects-plus-years .number-text-first h1 {
  font-size: 3.5rem;
  font-weight: 500;
  margin: 0rem;
}
.video-plus-experience-mother-container .projects-plus-years .number-text-first p {
  font-size: 0.8rem;
  line-height: 1.3rem;
  width: 4rem;
  margin: 0rem;
}
.video-plus-experience-mother-container .projects-plus-years .number-text-second {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.video-plus-experience-mother-container .projects-plus-years .number-text-second h1 {
  font-size: 3.5rem;
  font-weight: 500;
  margin: 0rem;
}
.video-plus-experience-mother-container .projects-plus-years .number-text-second p {
  font-size: 0.8rem;
  line-height: 1.3rem;
  width: 8rem;
  margin: 0rem;
}
.video-plus-experience-mother-container .projects-plus-years .number-text-third {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.video-plus-experience-mother-container .projects-plus-years .number-text-third h1 {
  font-size: 3.5rem;
  font-weight: 500;
  margin: 0rem;
}
.video-plus-experience-mother-container .projects-plus-years .number-text-third p {
  font-size: 0.8rem;
  line-height: 1.3rem;
  width: 10rem;
  margin: 0rem;
}

/* MEDIA SCREEN RESPONSIVENESS */
@media (max-width: 1100px) {
  .video-plus-experience-mother-container {
    position: relative;
    background-image: linear-gradient(180deg, white 36%, pink 0.1%, pink 64%);
    padding: 0vh 0vh 10vh;
  }
  .video-plus-experience-mother-container::after {
    content: "";
    position: absolute;
    bottom: 0rem;
    right: 0rem;
    height: 7vh;
    width: 10vw;
    background-color: #fff;
  }
  .video-plus-experience-mother-container .video-container {
    height: 33vh;
  }
  .video-plus-experience-mother-container .video-container .play-vidz {
    width: 4rem;
    height: 3.5rem;
    font-size: 2rem;
    top: 14vh;
    left: 46%;
  }
  .video-plus-experience-mother-container .video-container #companyVidz {
    width: 100%;
    height: 100%;
    cursor: pointer;
  }
  .video-plus-experience-mother-container .video-container video::-webkit-media-controls {
    position: relative;
  }
  .video-plus-experience-mother-container .video-container .top-boxes div {
    width: 12vw;
    height: 9vh;
    background-color: #fff;
  }
  .video-plus-experience-mother-container .video-container .top-boxes .second-box {
    background-color: bisque;
  }
  .video-plus-experience-mother-container .video-container .thumbnail {
    width: 100%;
    height: 100%;
    position: absolute;
  }
  .video-plus-experience-mother-container .video-container .right-boxes .bhox {
    width: 12vw;
    height: 9vh;
    background-color: #fff;
  }
  .video-plus-experience-mother-container .video-container .right-boxes .half-box {
    width: 8vw;
    height: 3vh;
    background-color: transparent;
  }
  .video-plus-experience-mother-container .video-container .right-boxes .almost-box {
    display: none;
  }
  .video-plus-experience-mother-container .video-container .right-boxes .second-box {
    right: -5vw;
    background-color: rgb(104, 172, 192);
  }
  .video-plus-experience-mother-container .video-container .right-boxes .forth-box {
    background-color: transparent;
    height: 3.2vh;
  }
  .video-plus-experience-mother-container .video-container .right-boxes .fifth-box {
    background-color: pink;
  }
  .video-plus-experience-mother-container .straight-line {
    height: 1px;
    background-color: rgba(122, 122, 122, 0.4784313725);
    margin: 5vh 0vh 2vh;
  }
  .video-plus-experience-mother-container .projects-plus-years .number-text-first {
    display: flex;
    align-items: center;
    gap: 0.5rem;
  }
  .video-plus-experience-mother-container .projects-plus-years .number-text-first h1 {
    font-size: 3.5rem;
    font-weight: 500;
    margin: 0rem;
  }
  .video-plus-experience-mother-container .projects-plus-years .number-text-first p {
    font-size: 0.8rem;
    line-height: 1.3rem;
    width: 4rem;
    margin: 0rem;
  }
  .video-plus-experience-mother-container .projects-plus-years .number-text-second {
    display: flex;
    align-items: center;
    gap: 0.5rem;
  }
  .video-plus-experience-mother-container .projects-plus-years .number-text-second h1 {
    font-size: 3.5rem;
    font-weight: 500;
    margin: 0rem;
  }
  .video-plus-experience-mother-container .projects-plus-years .number-text-second p {
    font-size: 0.8rem;
    line-height: 1.3rem;
    width: 8rem;
    margin: 0rem;
  }
  .video-plus-experience-mother-container .projects-plus-years .number-text-third {
    display: flex;
    align-items: center;
    gap: 0.5rem;
  }
  .video-plus-experience-mother-container .projects-plus-years .number-text-third h1 {
    font-size: 3.5rem;
    font-weight: 500;
    margin: 0rem;
  }
  .video-plus-experience-mother-container .projects-plus-years .number-text-third p {
    font-size: 0.8rem;
    line-height: 1.3rem;
    width: 10rem;
    margin: 0rem;
  }
}
@media (max-width: 600px) {
  .video-plus-experience-mother-container {
    position: relative;
    background-image: linear-gradient(180deg, white 36%, pink 0.1%, pink 64%);
    padding: 0vh 0vh 10vh;
  }
  .video-plus-experience-mother-container::after {
    content: "";
    position: absolute;
    bottom: 0rem;
    right: 0rem;
    height: 7vh;
    width: 10vw;
    background-color: #fff;
  }
  .video-plus-experience-mother-container .video-container {
    height: 35vh;
  }
  .video-plus-experience-mother-container .video-container .play-vidz {
    width: 4rem;
    height: 3.5rem;
    font-size: 2rem;
    top: 14vh;
    left: 46%;
  }
  .video-plus-experience-mother-container .video-container #companyVidz {
    width: 100%;
    height: 100%;
    cursor: pointer;
  }
  .video-plus-experience-mother-container .video-container video::-webkit-media-controls {
    position: relative;
  }
  .video-plus-experience-mother-container .video-container .top-boxes div {
    width: 13vw;
    height: 10vh;
    background-color: #fff;
  }
  .video-plus-experience-mother-container .video-container .top-boxes .second-box {
    background-color: bisque;
  }
  .video-plus-experience-mother-container .video-container .thumbnail {
    width: 100%;
    height: 100%;
    position: absolute;
  }
  .video-plus-experience-mother-container .video-container .right-boxes .bhox {
    width: 13vw;
    height: 10vh;
    background-color: #fff;
  }
  .video-plus-experience-mother-container .video-container .right-boxes .half-box {
    width: 8vw;
    height: 3vh;
    background-color: transparent;
  }
  .video-plus-experience-mother-container .video-container .right-boxes .almost-box {
    display: none;
  }
  .video-plus-experience-mother-container .video-container .right-boxes .second-box {
    right: -5vw;
    background-color: rgb(104, 172, 192);
  }
  .video-plus-experience-mother-container .video-container .right-boxes .forth-box {
    background-color: transparent;
    height: 3.2vh;
  }
  .video-plus-experience-mother-container .video-container .right-boxes .fifth-box {
    background-color: pink;
  }
  .video-plus-experience-mother-container .straight-line {
    height: 1px;
    background-color: rgba(122, 122, 122, 0.4784313725);
    margin: 5vh 0vh 2vh;
  }
  .video-plus-experience-mother-container .projects-plus-years {
    display: flex;
    align-items: flex-start;
    padding: 0rem 1rem;
  }
  .video-plus-experience-mother-container .projects-plus-years .number-text-first {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.5rem;
  }
  .video-plus-experience-mother-container .projects-plus-years .number-text-first h1 {
    font-size: 3rem;
    font-weight: 500;
    margin: 0rem;
  }
  .video-plus-experience-mother-container .projects-plus-years .number-text-first p {
    font-size: 0.8rem;
    line-height: 1.3rem;
    width: 4rem;
    margin: 0rem;
  }
  .video-plus-experience-mother-container .projects-plus-years .number-text-second {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.5rem;
  }
  .video-plus-experience-mother-container .projects-plus-years .number-text-second h1 {
    font-size: 3.5rem;
    font-weight: 500;
    margin: 0rem;
  }
  .video-plus-experience-mother-container .projects-plus-years .number-text-second p {
    font-size: 0.8rem;
    line-height: 1.3rem;
    width: 8rem;
    margin: 0rem;
  }
  .video-plus-experience-mother-container .projects-plus-years .number-text-third {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.5rem;
  }
  .video-plus-experience-mother-container .projects-plus-years .number-text-third h1 {
    font-size: 3.5rem;
    font-weight: 500;
    margin: 0rem;
  }
  .video-plus-experience-mother-container .projects-plus-years .number-text-third p {
    font-size: 0.8rem;
    line-height: 1.3rem;
    width: 10rem;
    margin: 0rem;
  }
}
@media (max-width: 500px) {
  .video-plus-experience-mother-container {
    position: relative;
    background-image: linear-gradient(180deg, white 36%, pink 0.1%, pink 64%);
    padding: 0vh 0vh 10vh;
  }
  .video-plus-experience-mother-container::after {
    content: "";
    position: absolute;
    bottom: 0rem;
    right: 0rem;
    height: 3.5rem;
    width: 3.5rem;
    background-color: #fff;
  }
  .video-plus-experience-mother-container .video-container {
    height: 15rem;
  }
  .video-plus-experience-mother-container .video-container .play-vidz {
    width: 0rem;
    height: 0rem;
    padding: 1.2rem 1.5rem 1.5rem 1.8rem;
    font-size: 2rem;
    top: 6rem;
    left: 44%;
  }
  .video-plus-experience-mother-container .video-container #companyVidz {
    width: 100%;
    height: 100%;
    cursor: pointer;
  }
  .video-plus-experience-mother-container .video-container video::-webkit-media-controls {
    position: relative;
  }
  .video-plus-experience-mother-container .video-container .top-boxes div {
    width: 3.4rem;
    height: 3.4rem;
    background-color: #fff;
  }
  .video-plus-experience-mother-container .video-container .top-boxes .second-box {
    background-color: bisque;
  }
  .video-plus-experience-mother-container .video-container .thumbnail {
    width: 100%;
    height: 100%;
    position: absolute;
  }
  .video-plus-experience-mother-container .video-container .right-boxes .bhox {
    width: 3.4rem;
    height: 3.4rem;
    background-color: #fff;
  }
  .video-plus-experience-mother-container .video-container .right-boxes .half-box {
    width: 8vw;
    height: 2rem;
    background-color: transparent;
  }
  .video-plus-experience-mother-container .video-container .right-boxes .almost-box {
    display: none;
  }
  .video-plus-experience-mother-container .video-container .right-boxes .second-box {
    right: -7vw;
    background-color: rgb(104, 172, 192);
  }
  .video-plus-experience-mother-container .video-container .right-boxes .forth-box {
    background-color: transparent;
    height: 3rem;
  }
  .video-plus-experience-mother-container .video-container .right-boxes .fifth-box {
    background-color: pink;
  }
  .video-plus-experience-mother-container .straight-line {
    height: 1px;
    background-color: rgba(122, 122, 122, 0.4784313725);
    margin: 5vh 0vh 2vh;
  }
  .video-plus-experience-mother-container .projects-plus-years {
    justify-content: space-between;
    flex-wrap: wrap;
    padding: 0rem 0.5rem;
  }
  .video-plus-experience-mother-container .projects-plus-years .number-text-first {
    display: flex;
    align-items: center;
    gap: 0.5rem;
  }
  .video-plus-experience-mother-container .projects-plus-years .number-text-first h1 {
    font-size: 2.5rem;
    font-weight: 500;
    margin: 0rem;
  }
  .video-plus-experience-mother-container .projects-plus-years .number-text-first p {
    font-size: 0.8rem;
    line-height: 1rem;
    width: 4rem;
    margin: 0rem;
  }
  .video-plus-experience-mother-container .projects-plus-years .number-text-second {
    display: flex;
    align-items: center;
    gap: 0.5rem;
  }
  .video-plus-experience-mother-container .projects-plus-years .number-text-second h1 {
    font-size: 2.5rem;
    font-weight: 500;
    margin: 0rem;
  }
  .video-plus-experience-mother-container .projects-plus-years .number-text-second p {
    font-size: 0.8rem;
    line-height: 1rem;
    width: 8rem;
    margin: 0rem;
  }
  .video-plus-experience-mother-container .projects-plus-years .number-text-third {
    display: flex;
    align-items: center;
    gap: 0.5rem;
  }
  .video-plus-experience-mother-container .projects-plus-years .number-text-third h1 {
    font-size: 2.5rem;
    font-weight: 500;
    margin: 0rem;
  }
  .video-plus-experience-mother-container .projects-plus-years .number-text-third p {
    font-size: 0.8rem;
    line-height: 1rem;
    width: 10rem;
    margin: 0rem;
  }
}
@media (max-width: 400px) {
  .video-plus-experience-mother-container {
    position: relative;
    background-image: linear-gradient(180deg, white 36%, pink 0.1%, pink 64%);
    padding: 0vh 0vh 10vh;
  }
  .video-plus-experience-mother-container::after {
    content: "";
    position: absolute;
    bottom: 0rem;
    right: 0rem;
    height: 3.5rem;
    width: 3.5rem;
    background-color: #fff;
  }
  .video-plus-experience-mother-container .video-container {
    height: 13rem;
  }
  .video-plus-experience-mother-container .video-container .play-vidz {
    width: 0rem;
    height: 0rem;
    padding: 1.2rem 1.5rem 1.5rem 1.8rem;
    font-size: 2rem;
    top: 5rem;
    left: 44%;
  }
  .video-plus-experience-mother-container .video-container #companyVidz {
    width: 100%;
    height: 100%;
    cursor: pointer;
  }
  .video-plus-experience-mother-container .video-container video::-webkit-media-controls {
    position: relative;
  }
  .video-plus-experience-mother-container .video-container .top-boxes div {
    width: 3rem;
    height: 3rem;
    background-color: #fff;
  }
  .video-plus-experience-mother-container .video-container .top-boxes .second-box {
    background-color: bisque;
  }
  .video-plus-experience-mother-container .video-container .thumbnail {
    width: 100%;
    height: 100%;
    position: absolute;
  }
  .video-plus-experience-mother-container .video-container .right-boxes .bhox {
    width: 3.2rem;
    height: 3.2rem;
    background-color: #fff;
  }
  .video-plus-experience-mother-container .video-container .right-boxes .half-box {
    width: 1.8rem;
    height: 1rem;
    background-color: transparent;
  }
  .video-plus-experience-mother-container .video-container .right-boxes .almost-box {
    display: none;
  }
  .video-plus-experience-mother-container .video-container .right-boxes .second-box {
    right: -7vw;
    background-color: rgb(104, 172, 192);
  }
  .video-plus-experience-mother-container .video-container .right-boxes .forth-box {
    background-color: transparent;
    height: 2.5rem;
  }
  .video-plus-experience-mother-container .video-container .right-boxes .fifth-box {
    background-color: pink;
  }
  .video-plus-experience-mother-container .straight-line {
    height: 1px;
    background-color: rgba(122, 122, 122, 0.4784313725);
    margin: 5vh 0vh 2vh;
  }
  .video-plus-experience-mother-container .projects-plus-years {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    justify-content: center;
    align-items: start;
    gap: 1rem;
    padding: 0rem 0.5rem;
  }
  .video-plus-experience-mother-container .projects-plus-years .number-text-first {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0rem;
  }
  .video-plus-experience-mother-container .projects-plus-years .number-text-first h1 {
    font-size: 2rem;
    font-weight: 500;
    margin: 0rem;
  }
  .video-plus-experience-mother-container .projects-plus-years .number-text-first p {
    font-size: 0.8rem;
    line-height: 1rem;
    width: 100%;
    margin: 0rem;
    text-align: center;
  }
  .video-plus-experience-mother-container .projects-plus-years .number-text-second {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0rem;
  }
  .video-plus-experience-mother-container .projects-plus-years .number-text-second h1 {
    font-size: 2rem;
    font-weight: 500;
    margin: 0rem;
  }
  .video-plus-experience-mother-container .projects-plus-years .number-text-second p {
    font-size: 0.8rem;
    line-height: 1rem;
    width: 100%;
    margin: 0rem;
    text-align: center;
  }
  .video-plus-experience-mother-container .projects-plus-years .number-text-third {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0rem;
  }
  .video-plus-experience-mother-container .projects-plus-years .number-text-third h1 {
    font-size: 2rem;
    font-weight: 500;
    margin: 0rem;
  }
  .video-plus-experience-mother-container .projects-plus-years .number-text-third p {
    font-size: 0.8rem;
    line-height: 1rem;
    width: 100%;
    margin: 0rem;
    text-align: center;
  }
}
.what-we-offer-mother-container {
  position: relative;
  padding: 12vh 0vh 10vh;
}
.what-we-offer-mother-container .two-grid-sections {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 5rem;
}
.what-we-offer-mother-container .two-grid-sections .construction-services h4 {
  font-size: 0.9rem;
  font-weight: lighter;
  margin: 0rem 0rem 1rem;
}
.what-we-offer-mother-container .two-grid-sections .construction-services h1 {
  font-size: 2.5rem;
  font-weight: 500;
  margin: 0rem 0rem 1.5rem;
}
.what-we-offer-mother-container .two-grid-sections .construction-services p {
  font-size: 0.9rem;
  line-height: 1.4rem;
  margin: 0rem 0rem 2rem;
}
.what-we-offer-mother-container .two-grid-sections .construction-services button {
  padding: 0.8rem 1.5rem;
  font-size: 1rem;
  border: 1px solid #000;
  background-color: transparent;
  transition: all 0.5s ease-in-out;
  cursor: pointer;
}
.what-we-offer-mother-container .two-grid-sections .construction-services button:hover {
  background-color: red;
  color: #000;
}
.what-we-offer-mother-container .two-grid-sections .construction-services .image-of-employee-at-work {
  position: relative;
  background-image: url(../../images/BlackConstructores.webp);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  height: 16rem;
  margin: 3rem 0rem 0rem;
}
.what-we-offer-mother-container .two-grid-sections .construction-services .image-of-employee-at-work .two-boxes-flex {
  position: absolute;
  bottom: 0rem;
  display: flex;
}
.what-we-offer-mother-container .two-grid-sections .construction-services .image-of-employee-at-work .two-boxes-flex div {
  width: 7vw;
  height: 13vh;
  background-color: #fff;
}
.what-we-offer-mother-container .two-grid-sections .construction-services .image-of-employee-at-work .two-boxes-flex .different {
  background-color: bisque;
}
.what-we-offer-mother-container .two-grid-sections .details-on-services {
  padding: 0rem 5rem 0rem 0rem;
}
.what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li {
  list-style: none;
  border-bottom: 1px solid #c2c2c2;
  padding: 1rem 0rem;
}
.what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li input {
  margin: 0rem;
}
.what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li input[type=radio] {
  display: none;
}
.what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li input[type=radio]:checked + label + .content {
  max-height: -moz-max-content;
  max-height: max-content;
  padding: 1px;
}
.what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li label {
  font-size: 1.1rem;
  font-weight: 600;
  display: flex;
  align-items: center;
  cursor: pointer;
}
.what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li label::before {
  content: "+";
  margin-right: 0.8rem;
  font-size: 1.2rem;
  font-weight: 600;
}
.what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li .content {
  font-size: 0.9rem;
  line-height: 1.5rem;
  max-height: 0rem;
  overflow: hidden;
  transition: all 0.5s;
}
.what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li .content p {
  margin: 1.5rem 0rem 0rem;
}
.what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li .content ul {
  padding: 1rem 1rem 0rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li .content ul li {
  list-style: disc;
  font-size: 1.2rem;
  color: burlywood;
  border: none;
  padding: 0rem;
}
.what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li .content ul li span {
  font-size: 0.9rem;
  color: #000;
  font-weight: 600;
}
.what-we-offer-mother-container .pink-boxe {
  width: 8vw;
  height: 16vh;
  background-color: pink;
  position: absolute;
  bottom: 0rem;
  right: 0rem;
}

/* MEDIA SCREEN RESPONSIVENESS */
@media (max-width: 1100px) {
  .what-we-offer-mother-container {
    position: relative;
    padding: 6vh 1rem 6vh;
  }
  .what-we-offer-mother-container .two-grid-sections {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
  }
  .what-we-offer-mother-container .two-grid-sections .construction-services .image-of-employee-at-work {
    height: 13rem;
    margin: 3rem 0rem 0rem;
  }
  .what-we-offer-mother-container .two-grid-sections .construction-services .image-of-employee-at-work .two-boxes-flex div {
    width: 10vw;
    height: 7vh;
    background-color: #fff;
  }
  .what-we-offer-mother-container .two-grid-sections .construction-services .image-of-employee-at-work .two-boxes-flex .different {
    background-color: bisque;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services {
    padding: 0rem;
    margin: 0rem;
  }
  .what-we-offer-mother-container .pink-boxe {
    width: 10vw;
    height: 7vh;
  }
}
@media (max-width: 900px) {
  .what-we-offer-mother-container {
    position: relative;
    padding: 6vh 1rem 10vh;
  }
  .what-we-offer-mother-container .two-grid-sections {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0rem;
  }
  .what-we-offer-mother-container .two-grid-sections .construction-services .image-of-employee-at-work {
    height: 13rem;
    margin: 3rem 0rem 0rem;
  }
  .what-we-offer-mother-container .two-grid-sections .construction-services .image-of-employee-at-work .two-boxes-flex div {
    width: 10vw;
    height: 7vh;
    background-color: #fff;
  }
  .what-we-offer-mother-container .two-grid-sections .construction-services .image-of-employee-at-work .two-boxes-flex .different {
    background-color: bisque;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services {
    padding: 0rem;
    margin: 0rem;
  }
  .what-we-offer-mother-container .pink-boxe {
    width: 10vw;
    height: 7vh;
  }
}
@media (max-width: 600px) {
  .what-we-offer-mother-container {
    position: relative;
    padding: 8vh 0rem 12vh;
  }
  .what-we-offer-mother-container .two-grid-sections {
    display: grid;
    grid-template-columns: 100%;
    gap: 0rem;
  }
  .what-we-offer-mother-container .two-grid-sections .construction-services h4 {
    font-size: 1rem;
    font-weight: 300;
    margin: 0rem 0rem 0.5rem;
    padding: 0rem 1rem;
  }
  .what-we-offer-mother-container .two-grid-sections .construction-services h1 {
    font-size: 2rem;
    font-weight: 500;
    line-height: 2rem;
    margin: 0rem 0rem 0.9rem;
    padding: 0rem 1rem;
  }
  .what-we-offer-mother-container .two-grid-sections .construction-services p {
    font-size: 1rem;
    line-height: 1.5rem;
    margin: 0rem 0rem 2rem;
    padding: 0rem 1rem;
    word-spacing: 0.5rem;
  }
  .what-we-offer-mother-container .two-grid-sections .construction-services button {
    padding: 0.8rem 1.5rem;
    margin-left: 1rem;
    font-size: 1rem;
    border: 1px solid #000;
    background-color: transparent;
  }
  .what-we-offer-mother-container .two-grid-sections .construction-services .image-of-employee-at-work {
    height: 35vh;
    margin: 2rem 0rem 0rem;
  }
  .what-we-offer-mother-container .two-grid-sections .construction-services .image-of-employee-at-work .two-boxes-flex div {
    width: 18vw;
    height: 13vh;
    background-color: #fff;
  }
  .what-we-offer-mother-container .two-grid-sections .construction-services .image-of-employee-at-work .two-boxes-flex .different {
    background-color: bisque;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services {
    padding: 0rem;
    margin: 0rem;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services .accordion {
    padding: 0rem 1rem;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li {
    padding: 1rem 0rem;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li label {
    font-size: 1.1rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    cursor: pointer;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li label::before {
    content: "+";
    margin-right: 0.8rem;
    font-size: 1.2rem;
    font-weight: 600;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li .content {
    font-size: 1rem;
    line-height: 1.5rem;
    word-spacing: 0.5em;
    max-height: 0rem;
    overflow: hidden;
    transition: all 0.5s;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li .content p {
    margin: 1.5rem 0rem 0rem;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li .content ul {
    padding: 1rem 1.1rem 0rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li .content ul li {
    list-style: disc;
    font-size: 1.2rem;
    color: burlywood;
    border: none;
    padding: 0rem;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li .content ul li span {
    font-size: 0.9rem;
    color: #000;
    font-weight: 600;
  }
  .what-we-offer-mother-container .pink-boxe {
    width: 10vw;
    height: 8vh;
  }
}
@media (max-width: 500px) {
  .what-we-offer-mother-container {
    position: relative;
    padding: 8vh 0rem 12vh;
  }
  .what-we-offer-mother-container .two-grid-sections {
    display: grid;
    grid-template-columns: 100%;
    gap: 0rem;
  }
  .what-we-offer-mother-container .two-grid-sections .construction-services h4 {
    font-size: 1rem;
    font-weight: 300;
    margin: 0rem 0rem 1rem;
    padding: 0rem 1rem;
  }
  .what-we-offer-mother-container .two-grid-sections .construction-services h1 {
    font-size: 2rem;
    font-weight: 500;
    line-height: 2rem;
    margin: 0rem 0rem 0.9rem;
    padding: 0rem 1rem;
  }
  .what-we-offer-mother-container .two-grid-sections .construction-services p {
    font-size: 1rem;
    line-height: 1.5rem;
    margin: 0rem 0rem 2rem;
    padding: 0rem 1rem;
    word-spacing: 0.5rem;
  }
  .what-we-offer-mother-container .two-grid-sections .construction-services button {
    padding: 0.8rem 1.5rem;
    margin-left: 1rem;
    font-size: 1rem;
    border: 1px solid #000;
    background-color: transparent;
  }
  .what-we-offer-mother-container .two-grid-sections .construction-services .image-of-employee-at-work {
    height: 13rem;
    margin: 2rem 0rem 0rem;
  }
  .what-we-offer-mother-container .two-grid-sections .construction-services .image-of-employee-at-work .two-boxes-flex div {
    width: 4.5rem;
    height: 4.5rem;
    background-color: #fff;
  }
  .what-we-offer-mother-container .two-grid-sections .construction-services .image-of-employee-at-work .two-boxes-flex .different {
    background-color: bisque;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services {
    padding: 0rem;
    margin: 0rem;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services .accordion {
    padding: 0rem 1rem;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li {
    padding: 1rem 0rem;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li label {
    font-size: 1.1rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    cursor: pointer;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li label::before {
    content: "+";
    margin-right: 0.8rem;
    font-size: 1.2rem;
    font-weight: 600;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li .content {
    font-size: 1rem;
    line-height: 1.5rem;
    word-spacing: 0.5em;
    max-height: 0rem;
    overflow: hidden;
    transition: all 0.5s;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li .content p {
    margin: 1.5rem 0rem 0rem;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li .content ul {
    padding: 1rem 1.2rem 0rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li .content ul li {
    list-style: disc;
    font-size: 1.2rem;
    color: burlywood;
    border: none;
    padding: 0rem;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li .content ul li span {
    font-size: 0.9rem;
    color: #000;
    font-weight: 600;
  }
  .what-we-offer-mother-container .pink-boxe {
    width: 4.5rem;
    height: 4.5rem;
  }
}
@media (max-width: 400px) {
  .what-we-offer-mother-container {
    position: relative;
    padding: 8vh 0rem 12vh;
  }
  .what-we-offer-mother-container .two-grid-sections {
    display: grid;
    grid-template-columns: 100%;
    gap: 0rem;
  }
  .what-we-offer-mother-container .two-grid-sections .construction-services h4 {
    font-size: 1rem;
    font-weight: 300;
    margin: 0rem 0rem 1rem;
    padding: 0rem 1rem;
  }
  .what-we-offer-mother-container .two-grid-sections .construction-services h1 {
    font-size: 2rem;
    font-weight: 500;
    line-height: 2rem;
    margin: 0rem 0rem 0.9rem;
    padding: 0rem 1rem;
  }
  .what-we-offer-mother-container .two-grid-sections .construction-services p {
    font-size: 1rem;
    line-height: 1.5rem;
    margin: 0rem 0rem 2rem;
    padding: 0rem 1rem;
    word-spacing: 0.5rem;
  }
  .what-we-offer-mother-container .two-grid-sections .construction-services button {
    padding: 0.8rem 1.5rem;
    margin-left: 1rem;
    font-size: 1rem;
    border: 1px solid #000;
    background-color: transparent;
  }
  .what-we-offer-mother-container .two-grid-sections .construction-services .image-of-employee-at-work {
    height: 13rem;
    margin: 2rem 0rem 0rem;
  }
  .what-we-offer-mother-container .two-grid-sections .construction-services .image-of-employee-at-work .two-boxes-flex div {
    width: 4.2rem;
    height: 4.2rem;
    background-color: #fff;
  }
  .what-we-offer-mother-container .two-grid-sections .construction-services .image-of-employee-at-work .two-boxes-flex .different {
    background-color: bisque;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services {
    padding: 0rem;
    margin: 0rem;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services .accordion {
    padding: 0rem 1rem;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li {
    padding: 1rem 0rem;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li label {
    font-size: 1.1rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    cursor: pointer;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li label::before {
    content: "+";
    margin-right: 0.8rem;
    font-size: 1.2rem;
    font-weight: 600;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li .content {
    font-size: 1rem;
    line-height: 1.5rem;
    word-spacing: 0.5em;
    max-height: 0rem;
    overflow: hidden;
    transition: all 0.5s;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li .content p {
    margin: 1.5rem 0rem 0rem;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li .content ul {
    padding: 1rem 1.2rem 0rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li .content ul li {
    list-style: disc;
    font-size: 1.2rem;
    color: burlywood;
    border: none;
    padding: 0rem;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li .content ul li span {
    font-size: 0.9rem;
    color: #000;
    font-weight: 600;
  }
  .what-we-offer-mother-container .pink-boxe {
    width: 4.2rem;
    height: 4.2rem;
  }
}
@media (max-width: 380px) {
  .what-we-offer-mother-container {
    position: relative;
    padding: 8vh 0rem 12vh;
  }
  .what-we-offer-mother-container .two-grid-sections {
    display: grid;
    grid-template-columns: 100%;
    gap: 0rem;
  }
  .what-we-offer-mother-container .two-grid-sections .construction-services h4 {
    font-size: 1rem;
    font-weight: 300;
    margin: 0rem 0rem 1rem;
    padding: 0rem 1rem;
  }
  .what-we-offer-mother-container .two-grid-sections .construction-services h1 {
    font-size: 2rem;
    font-weight: 500;
    line-height: 2rem;
    margin: 0rem 0rem 0.9rem;
    padding: 0rem 1rem;
  }
  .what-we-offer-mother-container .two-grid-sections .construction-services p {
    font-size: 1rem;
    line-height: 1.5rem;
    margin: 0rem 0rem 2rem;
    padding: 0rem 1rem;
    word-spacing: 0.5rem;
  }
  .what-we-offer-mother-container .two-grid-sections .construction-services button {
    padding: 0.8rem 1.5rem;
    margin-left: 1rem;
    font-size: 1rem;
    border: 1px solid #000;
    background-color: transparent;
  }
  .what-we-offer-mother-container .two-grid-sections .construction-services .image-of-employee-at-work {
    height: 13rem;
    margin: 2rem 0rem 0rem;
  }
  .what-we-offer-mother-container .two-grid-sections .construction-services .image-of-employee-at-work .two-boxes-flex div {
    width: 4rem;
    height: 4rem;
    background-color: #fff;
  }
  .what-we-offer-mother-container .two-grid-sections .construction-services .image-of-employee-at-work .two-boxes-flex .different {
    background-color: bisque;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services {
    padding: 0rem;
    margin: 0rem;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services .accordion {
    padding: 0rem 1rem;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li {
    padding: 1rem 0rem;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li label {
    font-size: 1.1rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    cursor: pointer;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li label::before {
    content: "+";
    margin-right: 0.8rem;
    font-size: 1.2rem;
    font-weight: 600;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li .content {
    font-size: 1rem;
    line-height: 1.5rem;
    word-spacing: 0.5em;
    max-height: 0rem;
    overflow: hidden;
    transition: all 0.5s;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li .content p {
    margin: 1.5rem 0rem 0rem;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li .content ul {
    padding: 1rem 1.2rem 0rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li .content ul li {
    list-style: disc;
    font-size: 1.2rem;
    color: burlywood;
    border: none;
    padding: 0rem;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li .content ul li span {
    font-size: 0.9rem;
    color: #000;
    font-weight: 600;
  }
  .what-we-offer-mother-container .pink-boxe {
    width: 4rem;
    height: 4rem;
  }
}
@media (max-width: 370px) {
  .what-we-offer-mother-container {
    position: relative;
    padding: 8vh 0rem 12vh;
  }
  .what-we-offer-mother-container .two-grid-sections {
    display: grid;
    grid-template-columns: 100%;
    gap: 0rem;
  }
  .what-we-offer-mother-container .two-grid-sections .construction-services h4 {
    font-size: 1rem;
    font-weight: 300;
    margin: 0rem 0rem 1rem;
    padding: 0rem 1rem;
  }
  .what-we-offer-mother-container .two-grid-sections .construction-services h1 {
    font-size: 2rem;
    font-weight: 500;
    line-height: 2rem;
    margin: 0rem 0rem 0.9rem;
    padding: 0rem 1rem;
  }
  .what-we-offer-mother-container .two-grid-sections .construction-services p {
    font-size: 1rem;
    line-height: 1.5rem;
    margin: 0rem 0rem 2rem;
    padding: 0rem 1rem;
    word-spacing: 0.5rem;
  }
  .what-we-offer-mother-container .two-grid-sections .construction-services button {
    padding: 0.8rem 1.5rem;
    margin-left: 1rem;
    font-size: 1rem;
    border: 1px solid #000;
    background-color: transparent;
  }
  .what-we-offer-mother-container .two-grid-sections .construction-services .image-of-employee-at-work {
    height: 13rem;
    margin: 2rem 0rem 0rem;
  }
  .what-we-offer-mother-container .two-grid-sections .construction-services .image-of-employee-at-work .two-boxes-flex div {
    width: 3.7rem;
    height: 3.7rem;
    background-color: #fff;
  }
  .what-we-offer-mother-container .two-grid-sections .construction-services .image-of-employee-at-work .two-boxes-flex .different {
    background-color: bisque;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services {
    padding: 0rem;
    margin: 0rem;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services .accordion {
    padding: 0rem 1rem;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li {
    padding: 1rem 0rem;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li label {
    font-size: 1.1rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    cursor: pointer;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li label::before {
    content: "+";
    margin-right: 0.8rem;
    font-size: 1.2rem;
    font-weight: 600;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li .content {
    font-size: 1rem;
    line-height: 1.5rem;
    word-spacing: 0.5em;
    max-height: 0rem;
    overflow: hidden;
    transition: all 0.5s;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li .content p {
    margin: 1.5rem 0rem 0rem;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li .content ul {
    padding: 1rem 1.2rem 0rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li .content ul li {
    list-style: disc;
    font-size: 1.2rem;
    color: burlywood;
    border: none;
    padding: 0rem;
  }
  .what-we-offer-mother-container .two-grid-sections .details-on-services .accordion li .content ul li span {
    font-size: 0.9rem;
    color: #000;
    font-weight: 600;
  }
  .what-we-offer-mother-container .pink-boxe {
    width: 3.7rem;
    height: 3.7rem;
  }
}
.company-projects-gallery-mother-container {
  position: relative;
  background-color: #000;
  color: #fff;
  padding: 12vh 0vh;
}
.company-projects-gallery-mother-container .heading-container {
  margin: 0rem 0rem 1.5rem;
}
.company-projects-gallery-mother-container .heading-container h6 {
  font-size: 0.9rem;
  margin: 0rem 0rem 1rem;
  color: #cacaca;
}
.company-projects-gallery-mother-container .heading-container h1 {
  font-size: 2.5rem;
  margin: 0rem;
  font-weight: 500;
}
.company-projects-gallery-mother-container .projects-carousel-container {
  width: 1200px;
  margin: 0rem auto;
}
.company-projects-gallery-mother-container .projects-carousel-container .gallery-filter-links-cover {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  margin: 0rem 0rem 3rem;
}
.company-projects-gallery-mother-container .projects-carousel-container .gallery-filter-links-cover button {
  padding: 1rem 1.5rem;
  background-color: transparent;
  border: none;
  color: #cacaca;
  font-size: 0.9rem;
  cursor: pointer;
  transition: all 0.3s ease-in-out;
}
.company-projects-gallery-mother-container .projects-carousel-container .gallery-filter-links-cover button:hover {
  color: red;
}
.company-projects-gallery-mother-container .projects-carousel-container .gallery-filter-links-cover button.active-btn {
  border: 1px solid #fff;
  color: #fff;
}
.company-projects-gallery-mother-container .projects-carousel-container #container {
  position: relative;
}
.company-projects-gallery-mother-container .projects-carousel-container #container .navigation-btn-container {
  position: absolute;
  top: 25%;
  z-index: 1;
  width: 100%;
}
.company-projects-gallery-mother-container .projects-carousel-container #container .navigation-btn-container .buttons-cover {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 90%;
}
.company-projects-gallery-mother-container .projects-carousel-container #container .navigation-btn-container .buttons-cover button {
  padding: 0.8rem 0.9rem;
  font-size: 1.2rem;
}
.company-projects-gallery-mother-container .projects-carousel-container #container .navigation-btn-container .buttons-cover #prev {
  position: absolute;
  left: -1rem;
  display: none;
}
.company-projects-gallery-mother-container .projects-carousel-container #container .navigation-btn-container .buttons-cover #next {
  position: absolute;
  right: 0rem;
}
.company-projects-gallery-mother-container .projects-carousel-container #container #slider-container {
  position: relative;
}
.company-projects-gallery-mother-container .projects-carousel-container #container #slider-container #slider {
  width: 1200px;
  margin: 0rem auto;
  display: flex;
  flex-direction: row;
  gap: 1rem;
  height: 70vh;
  overflow-x: auto;
  scroll-behavior: smooth;
  transition: all 0.5s;
}
.company-projects-gallery-mother-container .projects-carousel-container #container #slider-container #slider::-webkit-scrollbar {
  display: none;
}
.company-projects-gallery-mother-container .projects-carousel-container #container #slider-container #slider .slide {
  min-width: 30%;
}
.company-projects-gallery-mother-container .projects-carousel-container #container #slider-container #slider .slide .project-image {
  height: 16rem;
  background-image: url(../../images/bg2.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100%;
  cursor: pointer;
  transition: all 0.3s ease-in;
}
.company-projects-gallery-mother-container .projects-carousel-container #container #slider-container #slider .slide .project-image:hover {
  background-size: 110%;
}
.company-projects-gallery-mother-container .projects-carousel-container #container #slider-container #slider .slide .texts-cover h5 {
  font-size: 0.9rem;
  color: burlywood;
  text-decoration: underline;
  font-weight: 500;
  margin: 1.5rem 0rem 0rem;
}
.company-projects-gallery-mother-container .projects-carousel-container #container #slider-container #slider .slide .texts-cover h3 {
  font-size: 1.2rem;
  font-weight: 500;
  margin: 1rem 0rem 0rem;
}
.company-projects-gallery-mother-container .projects-carousel-container #container #slider-container #slider .slide .texts-cover .description {
  font-size: 0.9rem;
  line-height: 1.4rem;
  color: #cacaca;
  margin: 1rem 0rem 0rem;
}
.company-projects-gallery-mother-container .top-right-boxes {
  position: absolute;
  right: 0rem;
  top: 0rem;
  display: grid;
  grid-template-columns: repeat(2, 8vw);
  grid-template-rows: repeat(2, 16vh);
}
.company-projects-gallery-mother-container .top-right-boxes .box-top-right {
  width: 100%;
  height: 100%;
  background-color: #fff;
}
.company-projects-gallery-mother-container .top-right-boxes .box-top-right:first-child {
  background-color: burlywood;
}
.company-projects-gallery-mother-container .top-right-boxes .box-top-right:nth-child(2),
.company-projects-gallery-mother-container .top-right-boxes .box-top-right:nth-child(3) {
  background-color: transparent;
}
.company-projects-gallery-mother-container .top-right-boxes .box-top-right:nth-child(4) {
  background-color: rgb(132, 185, 168);
}
.company-projects-gallery-mother-container .bottom-left-box {
  position: absolute;
  width: 8vw;
  height: 16vh;
  background-color: burlywood;
  bottom: 0rem;
  left: 0rem;
}

/* MEDIA SCREEN RESPONSIVENESS */
@media (max-width: 1100px) {
  .company-projects-gallery-mother-container {
    padding: 10vh 0rem 12vh 1rem;
  }
  .company-projects-gallery-mother-container .projects-carousel-container {
    width: 100%;
    margin: 0rem;
  }
  .company-projects-gallery-mother-container .projects-carousel-container .gallery-filter-links-cover {
    gap: 1rem;
    margin: 0rem 0rem 3rem;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container {
    position: relative;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container .navigation-btn-container {
    top: 25%;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container .navigation-btn-container .buttons-cover {
    width: 90%;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container .navigation-btn-container .buttons-cover button {
    padding: 0.8rem 0.9rem;
    font-size: 1.2rem;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container .navigation-btn-container .buttons-cover #prev {
    left: 0rem;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container .navigation-btn-container .buttons-cover #next {
    right: 0rem;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container #slider-container #slider {
    width: 100%;
    margin: 0rem;
    height: 35vh;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container #slider-container #slider .slide {
    min-width: 35%;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container #slider-container #slider .slide .project-image {
    height: 16rem;
  }
  .company-projects-gallery-mother-container .top-right-boxes {
    display: grid;
    grid-template-columns: repeat(2, 10vw);
    grid-template-rows: repeat(2, 7vh);
  }
  .company-projects-gallery-mother-container .bottom-left-box {
    position: absolute;
    width: 10vw;
    height: 7vh;
  }
}
@media (max-width: 900px) {
  .company-projects-gallery-mother-container {
    padding: 10vh 0rem 12vh 1rem;
  }
  .company-projects-gallery-mother-container .projects-carousel-container .gallery-filter-links-cover {
    gap: 1rem;
    margin: 0rem 0rem 3rem;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container .navigation-btn-container {
    top: 25%;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container .navigation-btn-container .buttons-cover {
    width: 90%;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container .navigation-btn-container .buttons-cover button {
    padding: 0.8rem 0.9rem;
    font-size: 1.2rem;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container .navigation-btn-container .buttons-cover #prev {
    left: 0rem;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container .navigation-btn-container .buttons-cover #next {
    right: 0rem;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container #slider-container #slider {
    width: 100%;
    margin: 0rem;
    height: -moz-max-content;
    height: max-content;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container #slider-container #slider .slide {
    min-width: 40%;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container #slider-container #slider .slide .project-image {
    height: 16rem;
  }
  .company-projects-gallery-mother-container .top-right-boxes {
    display: grid;
    grid-template-columns: repeat(2, 10vw);
    grid-template-rows: repeat(2, 7vh);
  }
  .company-projects-gallery-mother-container .bottom-left-box {
    position: absolute;
    width: 10vw;
    height: 7vh;
  }
}
@media (max-width: 600px) {
  .company-projects-gallery-mother-container {
    padding: 10vh 0rem 12vh 1rem;
  }
  .company-projects-gallery-mother-container .projects-carousel-container .gallery-filter-links-cover {
    gap: 1rem;
    margin: 0rem 0rem 2rem;
    scroll-behavior: smooth;
    overflow-x: auto;
  }
  .company-projects-gallery-mother-container .projects-carousel-container .gallery-filter-links-cover::-webkit-scrollbar {
    display: none;
  }
  .company-projects-gallery-mother-container .projects-carousel-container .gallery-filter-links-cover button {
    padding: 1rem 1.5rem;
    background-color: transparent;
    border: none;
    color: #cacaca;
    font-size: 0.9rem;
    min-width: -moz-max-content;
    min-width: max-content;
  }
  .company-projects-gallery-mother-container .projects-carousel-container .gallery-filter-links-cover button:hover {
    color: #fff;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container .navigation-btn-container {
    top: 30%;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container .navigation-btn-container .buttons-cover {
    width: 90%;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container .navigation-btn-container .buttons-cover button {
    padding: 0.8rem 0.9rem;
    font-size: 1.2rem;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container .navigation-btn-container .buttons-cover #prev {
    left: 0rem;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container .navigation-btn-container .buttons-cover #next {
    right: 0rem;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container #slider-container #slider {
    width: 100%;
    margin: 0rem;
    height: -moz-max-content;
    height: max-content;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container #slider-container #slider .slide {
    min-width: 60%;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container #slider-container #slider .slide .project-image {
    height: 16rem;
  }
  .company-projects-gallery-mother-container .top-right-boxes {
    display: grid;
    grid-template-columns: repeat(2, 10vw);
    grid-template-rows: repeat(2, 7vh);
  }
  .company-projects-gallery-mother-container .bottom-left-box {
    position: absolute;
    width: 10vw;
    height: 7vh;
  }
}
@media (max-width: 500px) {
  .company-projects-gallery-mother-container {
    padding: 12vh 0rem 14vh 1rem;
  }
  .company-projects-gallery-mother-container .heading-container {
    margin: 0rem 0rem 1rem;
  }
  .company-projects-gallery-mother-container .heading-container h6 {
    font-size: 1rem;
    margin: 0rem 0rem 1rem;
    color: #cacaca;
  }
  .company-projects-gallery-mother-container .heading-container h1 {
    font-size: 2rem;
    margin: 0rem;
    font-weight: 500;
  }
  .company-projects-gallery-mother-container .projects-carousel-container .gallery-filter-links-cover {
    gap: 1rem;
    margin: 0rem 0rem 2rem;
    scroll-behavior: smooth;
    overflow-x: auto;
  }
  .company-projects-gallery-mother-container .projects-carousel-container .gallery-filter-links-cover::-webkit-scrollbar {
    display: none;
  }
  .company-projects-gallery-mother-container .projects-carousel-container .gallery-filter-links-cover button {
    padding: 1rem 1.5rem;
    background-color: transparent;
    border: none;
    color: #cacaca;
    font-size: 0.9rem;
    min-width: -moz-max-content;
    min-width: max-content;
  }
  .company-projects-gallery-mother-container .projects-carousel-container .gallery-filter-links-cover button:hover {
    color: #fff;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container .navigation-btn-container {
    top: 25%;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container .navigation-btn-container .buttons-cover {
    width: 90%;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container .navigation-btn-container .buttons-cover button {
    padding: 0.5rem 0.6rem;
    font-size: 1rem;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container .navigation-btn-container .buttons-cover #prev {
    left: 0rem;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container .navigation-btn-container .buttons-cover #next {
    right: 0rem;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container #slider-container #slider {
    width: 100%;
    margin: 0rem;
    height: -moz-max-content;
    height: max-content;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container #slider-container #slider .slide {
    min-width: 80%;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container #slider-container #slider .slide .project-image {
    height: 16rem;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container #slider-container #slider .slide .texts-cover h5 {
    margin: 1rem 0rem 0rem;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container #slider-container #slider .slide .texts-cover .description {
    font-size: 0.9rem;
    line-height: 1.4rem;
    word-spacing: 0.5em;
    color: #cacaca;
    margin: 1rem 0rem 0rem;
  }
  .company-projects-gallery-mother-container .top-right-boxes {
    display: grid;
    grid-template-columns: repeat(2, 4.5rem);
    grid-template-rows: repeat(2, 4.5rem);
  }
  .company-projects-gallery-mother-container .bottom-left-box {
    position: absolute;
    width: 4.5rem;
    height: 4.5rem;
  }
}
@media (max-width: 400px) {
  .company-projects-gallery-mother-container {
    padding: 12vh 0rem 14vh 1rem;
  }
  .company-projects-gallery-mother-container .heading-container {
    margin: 0rem 0rem 1rem;
  }
  .company-projects-gallery-mother-container .heading-container h6 {
    font-size: 1rem;
    margin: 0rem 0rem 1rem;
    color: #cacaca;
  }
  .company-projects-gallery-mother-container .heading-container h1 {
    font-size: 2rem;
    margin: 0rem;
    font-weight: 500;
  }
  .company-projects-gallery-mother-container .projects-carousel-container .gallery-filter-links-cover {
    gap: 1rem;
    margin: 0rem 0rem 2rem;
    scroll-behavior: smooth;
    overflow-x: auto;
  }
  .company-projects-gallery-mother-container .projects-carousel-container .gallery-filter-links-cover::-webkit-scrollbar {
    display: none;
  }
  .company-projects-gallery-mother-container .projects-carousel-container .gallery-filter-links-cover button {
    padding: 1rem 1.5rem;
    background-color: transparent;
    border: none;
    color: #cacaca;
    font-size: 0.9rem;
    min-width: -moz-max-content;
    min-width: max-content;
  }
  .company-projects-gallery-mother-container .projects-carousel-container .gallery-filter-links-cover button:hover {
    color: #fff;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container .navigation-btn-container {
    top: 25%;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container .navigation-btn-container .buttons-cover {
    width: 90%;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container .navigation-btn-container .buttons-cover button {
    padding: 0.5rem 0.6rem;
    font-size: 1rem;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container .navigation-btn-container .buttons-cover #prev {
    left: 0rem;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container .navigation-btn-container .buttons-cover #next {
    right: 0rem;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container #slider-container #slider {
    width: 100%;
    margin: 0rem;
    height: -moz-max-content;
    height: max-content;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container #slider-container #slider .slide {
    min-width: 80%;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container #slider-container #slider .slide .project-image {
    height: 16rem;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container #slider-container #slider .slide .texts-cover h5 {
    margin: 1rem 0rem 0rem;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container #slider-container #slider .slide .texts-cover .description {
    font-size: 0.9rem;
    line-height: 1.4rem;
    word-spacing: 0.5em;
    color: #cacaca;
    margin: 1rem 0rem 0rem;
  }
  .company-projects-gallery-mother-container .top-right-boxes {
    display: grid;
    grid-template-columns: repeat(2, 4.2rem);
    grid-template-rows: repeat(2, 4.2rem);
  }
  .company-projects-gallery-mother-container .bottom-left-box {
    position: absolute;
    width: 4.2rem;
    height: 4.2rem;
  }
}
@media (max-width: 380px) {
  .company-projects-gallery-mother-container {
    padding: 12vh 0rem 14vh 1rem;
  }
  .company-projects-gallery-mother-container .heading-container {
    margin: 0rem 0rem 1rem;
  }
  .company-projects-gallery-mother-container .heading-container h6 {
    font-size: 1rem;
    margin: 0rem 0rem 1rem;
    color: #cacaca;
  }
  .company-projects-gallery-mother-container .heading-container h1 {
    font-size: 2rem;
    margin: 0rem;
    font-weight: 500;
  }
  .company-projects-gallery-mother-container .projects-carousel-container .gallery-filter-links-cover {
    gap: 1rem;
    margin: 0rem 0rem 2rem;
    scroll-behavior: smooth;
    overflow-x: auto;
  }
  .company-projects-gallery-mother-container .projects-carousel-container .gallery-filter-links-cover::-webkit-scrollbar {
    display: none;
  }
  .company-projects-gallery-mother-container .projects-carousel-container .gallery-filter-links-cover button {
    padding: 1rem 1.5rem;
    background-color: transparent;
    border: none;
    color: #cacaca;
    font-size: 0.9rem;
    min-width: -moz-max-content;
    min-width: max-content;
  }
  .company-projects-gallery-mother-container .projects-carousel-container .gallery-filter-links-cover button:hover {
    color: #fff;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container .navigation-btn-container {
    top: 25%;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container .navigation-btn-container .buttons-cover {
    width: 90%;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container .navigation-btn-container .buttons-cover button {
    padding: 0.5rem 0.6rem;
    font-size: 1rem;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container .navigation-btn-container .buttons-cover #prev {
    left: 0rem;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container .navigation-btn-container .buttons-cover #next {
    right: 0rem;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container #slider-container #slider {
    width: 100%;
    margin: 0rem;
    height: -moz-max-content;
    height: max-content;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container #slider-container #slider .slide {
    min-width: 80%;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container #slider-container #slider .slide .project-image {
    height: 16rem;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container #slider-container #slider .slide .texts-cover h5 {
    margin: 1rem 0rem 0rem;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container #slider-container #slider .slide .texts-cover .description {
    font-size: 0.9rem;
    line-height: 1.4rem;
    word-spacing: 0.5em;
    color: #cacaca;
    margin: 1rem 0rem 0rem;
  }
  .company-projects-gallery-mother-container .top-right-boxes {
    display: grid;
    grid-template-columns: repeat(2, 4rem);
    grid-template-rows: repeat(2, 4rem);
  }
  .company-projects-gallery-mother-container .bottom-left-box {
    position: absolute;
    width: 4rem;
    height: 4rem;
  }
}
@media (max-width: 370px) {
  .company-projects-gallery-mother-container {
    padding: 12vh 0rem 14vh 1rem;
  }
  .company-projects-gallery-mother-container .heading-container {
    margin: 0rem 0rem 1rem;
  }
  .company-projects-gallery-mother-container .heading-container h6 {
    font-size: 1rem;
    margin: 0rem 0rem 1rem;
    color: #cacaca;
  }
  .company-projects-gallery-mother-container .heading-container h1 {
    font-size: 2rem;
    margin: 0rem;
    font-weight: 500;
  }
  .company-projects-gallery-mother-container .projects-carousel-container .gallery-filter-links-cover {
    gap: 1rem;
    margin: 0rem 0rem 2rem;
    scroll-behavior: smooth;
    overflow-x: auto;
  }
  .company-projects-gallery-mother-container .projects-carousel-container .gallery-filter-links-cover::-webkit-scrollbar {
    display: none;
  }
  .company-projects-gallery-mother-container .projects-carousel-container .gallery-filter-links-cover button {
    padding: 1rem 1.5rem;
    background-color: transparent;
    border: none;
    color: #cacaca;
    font-size: 0.9rem;
    min-width: -moz-max-content;
    min-width: max-content;
  }
  .company-projects-gallery-mother-container .projects-carousel-container .gallery-filter-links-cover button:hover {
    color: #fff;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container .navigation-btn-container {
    top: 25%;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container .navigation-btn-container .buttons-cover {
    width: 90%;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container .navigation-btn-container .buttons-cover button {
    padding: 0.5rem 0.6rem;
    font-size: 1rem;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container .navigation-btn-container .buttons-cover #prev {
    left: 0rem;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container .navigation-btn-container .buttons-cover #next {
    right: 0rem;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container #slider-container #slider {
    width: 100%;
    margin: 0rem;
    height: -moz-max-content;
    height: max-content;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container #slider-container #slider .slide {
    min-width: 80%;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container #slider-container #slider .slide .project-image {
    height: 16rem;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container #slider-container #slider .slide .texts-cover h5 {
    margin: 1rem 0rem 0rem;
  }
  .company-projects-gallery-mother-container .projects-carousel-container #container #slider-container #slider .slide .texts-cover .description {
    font-size: 0.9rem;
    line-height: 1.4rem;
    word-spacing: 0.5em;
    color: #cacaca;
    margin: 1rem 0rem 0rem;
  }
  .company-projects-gallery-mother-container .top-right-boxes {
    display: grid;
    grid-template-columns: repeat(2, 3.7rem);
    grid-template-rows: repeat(2, 3.7rem);
  }
  .company-projects-gallery-mother-container .bottom-left-box {
    position: absolute;
    width: 3.7rem;
    height: 3.7rem;
  }
}
.testimonials-mother-container {
  padding: 10vh 0vh;
}
.testimonials-mother-container .testimonial-text {
  font-size: 0.9rem;
  font-weight: 500;
  color: #000;
  margin: 0rem 0rem 1rem;
  text-align: center;
}
.testimonials-mother-container .customer-opinion-heading {
  font-size: 2.5rem;
  font-weight: 500;
  margin: 0rem 0rem 2rem;
  text-align: center;
}
.testimonials-mother-container .customer-text-plus-image {
  display: grid;
  grid-template-columns: 1.5fr 1fr;
  gap: 5rem;
  height: 70vh;
  margin: 4rem 0rem 0rem;
}
.testimonials-mother-container .customer-text-plus-image .customer-testimonial {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.testimonials-mother-container .customer-text-plus-image .customer-testimonial .text-cover .text {
  font-size: 1.5rem;
  line-height: 2.5rem;
}
.testimonials-mother-container .customer-text-plus-image .customer-testimonial .text-cover .client-name {
  margin: 0rem 0rem 2rem;
}
.testimonials-mother-container .customer-text-plus-image .customer-testimonial .text-cover .client-name h5 {
  font-size: 1rem;
  margin: 0rem 0rem 0.3rem;
}
.testimonials-mother-container .customer-text-plus-image .customer-testimonial .text-cover .client-name h6 {
  font-size: 0.9rem;
  margin: 0rem;
  font-weight: 300;
}
.testimonials-mother-container .customer-text-plus-image .customer-testimonial .text-cover .navigation-buttons {
  display: flex;
  gap: 1rem;
}
.testimonials-mother-container .customer-text-plus-image .customer-testimonial .text-cover .navigation-buttons button {
  background-color: #000;
  border: none;
  color: #fff;
  padding: 0.8rem 1rem;
  font-size: 1rem;
  cursor: pointer;
  transition: all 0.5s ease-in-out;
}
.testimonials-mother-container .customer-text-plus-image .customer-testimonial .text-cover .navigation-buttons button:hover {
  background-color: red;
}
.testimonials-mother-container .customer-text-plus-image .customer-image {
  position: relative;
  background-image: url(../../images/oldManparttwo.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.testimonials-mother-container .customer-text-plus-image .customer-image .top-right {
  position: absolute;
  top: 0rem;
  right: 0rem;
}
.testimonials-mother-container .customer-text-plus-image .customer-image .top-right div {
  width: 8vw;
  height: 16vh;
  background-color: rgb(82, 145, 124);
}
.testimonials-mother-container .customer-text-plus-image .customer-image .top-right div:nth-child(2) {
  background-color: #fff;
}
.testimonials-mother-container .customer-text-plus-image .customer-image .bottom-left {
  position: absolute;
  left: 0rem;
  bottom: 0rem;
  width: 8vw;
  height: 16vh;
  background-color: pink;
}

/* MEDIA SCREEN RESPONSIVENESS */
@media (max-width: 1100px) {
  .testimonials-mother-container {
    padding: 5vh 1rem;
  }
  .testimonials-mother-container .customer-text-plus-image {
    display: grid;
    grid-template-columns: 1.5fr 1fr;
    gap: 2rem;
    height: 40vh;
    margin: 4rem 0rem 0rem;
  }
  .testimonials-mother-container .customer-text-plus-image .customer-image .top-right div {
    width: 10vw;
    height: 7vh;
    background-color: rgb(82, 145, 124);
  }
  .testimonials-mother-container .customer-text-plus-image .customer-image .top-right div:nth-child(2) {
    background-color: #fff;
  }
  .testimonials-mother-container .customer-text-plus-image .customer-image .bottom-left {
    position: absolute;
    left: 0rem;
    bottom: 0rem;
    width: 10vw;
    height: 7vh;
    background-color: pink;
  }
}
@media (max-width: 900px) {
  .testimonials-mother-container {
    padding: 7vh 1rem 8vh;
  }
  .testimonials-mother-container .customer-opinion-heading {
    font-size: 2.5rem;
    font-weight: 500;
    margin: 0rem 0rem 1rem;
    text-align: center;
  }
  .testimonials-mother-container .customer-text-plus-image {
    display: grid;
    grid-template-columns: 1.5fr 1fr;
    gap: 2rem;
    height: 40vh;
    margin: 2rem 0rem 0rem;
  }
  .testimonials-mother-container .customer-text-plus-image .customer-testimonial .text-cover .text {
    font-size: 1.3rem;
    line-height: 2rem;
  }
  .testimonials-mother-container .customer-text-plus-image .customer-image .top-right div {
    width: 10vw;
    height: 7vh;
    background-color: rgb(82, 145, 124);
  }
  .testimonials-mother-container .customer-text-plus-image .customer-image .top-right div:nth-child(2) {
    background-color: #fff;
  }
  .testimonials-mother-container .customer-text-plus-image .customer-image .bottom-left {
    position: absolute;
    left: 0rem;
    bottom: 0rem;
    width: 10vw;
    height: 7vh;
    background-color: pink;
  }
}
@media (max-width: 600px) {
  .testimonials-mother-container {
    padding: 8vh 1rem 9vh;
  }
  .testimonials-mother-container .testimonial-text {
    margin: 0rem 0rem 1rem;
    font-weight: 300;
    font-size: 1rem;
  }
  .testimonials-mother-container .customer-opinion-heading {
    font-size: 2.5rem;
    line-height: 2.5rem;
    margin: 0rem 0rem 1rem;
    padding: 0rem 1rem;
  }
  .testimonials-mother-container .customer-text-plus-image {
    display: flex;
    flex-direction: column-reverse;
    gap: 0rem;
    height: -moz-max-content;
    height: max-content;
    margin: 2rem 0rem 0rem;
  }
  .testimonials-mother-container .customer-text-plus-image .customer-testimonial .text-cover .text {
    font-size: 1.3rem;
    line-height: 2rem;
  }
  .testimonials-mother-container .customer-text-plus-image .customer-testimonial .text-cover .client-name {
    margin: 0rem 0rem 1.2rem;
  }
  .testimonials-mother-container .customer-text-plus-image .customer-testimonial .text-cover .client-name h5 {
    font-size: 1rem;
    margin: 0rem 0rem 0.1rem;
  }
  .testimonials-mother-container .customer-text-plus-image .customer-testimonial .text-cover .navigation-buttons {
    display: flex;
    gap: 1rem;
  }
  .testimonials-mother-container .customer-text-plus-image .customer-testimonial .text-cover .navigation-buttons button {
    background-color: #000;
    border: none;
    color: #fff;
    padding: 0.8rem 1rem;
    font-size: 1rem;
  }
  .testimonials-mother-container .customer-text-plus-image .customer-image {
    height: 28vh;
    width: 45vw;
  }
  .testimonials-mother-container .customer-text-plus-image .customer-image .top-right div {
    width: 10vw;
    height: 7vh;
    background-color: rgb(82, 145, 124);
  }
  .testimonials-mother-container .customer-text-plus-image .customer-image .top-right div:nth-child(2) {
    background-color: #fff;
  }
  .testimonials-mother-container .customer-text-plus-image .customer-image .bottom-left {
    position: absolute;
    left: 0rem;
    bottom: 0rem;
    width: 10vw;
    height: 7vh;
    background-color: pink;
  }
}
@media (max-width: 500px) {
  .testimonials-mother-container {
    padding: 8vh 1rem 9vh;
  }
  .testimonials-mother-container .testimonial-text {
    margin: 0rem 0rem 0.5rem;
    font-weight: 300;
  }
  .testimonials-mother-container .customer-opinion-heading {
    font-size: 2rem;
    line-height: 2rem;
    margin: 0rem 0rem 1rem;
  }
  .testimonials-mother-container .customer-text-plus-image {
    display: flex;
    flex-direction: column-reverse;
    gap: 0rem;
    height: -moz-max-content;
    height: max-content;
    margin: 2rem 0rem 0rem;
  }
  .testimonials-mother-container .customer-text-plus-image .customer-testimonial .text-cover .text {
    font-size: 1.3rem;
    line-height: 2rem;
  }
  .testimonials-mother-container .customer-text-plus-image .customer-testimonial .text-cover .client-name {
    margin: 0rem 0rem 1.2rem;
  }
  .testimonials-mother-container .customer-text-plus-image .customer-testimonial .text-cover .client-name h5 {
    font-size: 1rem;
    margin: 0rem 0rem 0.1rem;
  }
  .testimonials-mother-container .customer-text-plus-image .customer-testimonial .text-cover .navigation-buttons {
    display: flex;
    gap: 1rem;
  }
  .testimonials-mother-container .customer-text-plus-image .customer-testimonial .text-cover .navigation-buttons button {
    background-color: #000;
    border: none;
    color: #fff;
    padding: 0.8rem 1rem;
    font-size: 1rem;
  }
  .testimonials-mother-container .customer-text-plus-image .customer-image {
    height: 13rem;
    width: 60vw;
  }
  .testimonials-mother-container .customer-text-plus-image .customer-image .top-right div {
    width: 3rem;
    height: 3rem;
    background-color: rgb(82, 145, 124);
  }
  .testimonials-mother-container .customer-text-plus-image .customer-image .top-right div:nth-child(2) {
    background-color: #fff;
  }
  .testimonials-mother-container .customer-text-plus-image .customer-image .bottom-left {
    position: absolute;
    left: 0rem;
    bottom: 0rem;
    width: 3rem;
    height: 3rem;
    background-color: pink;
  }
}
@media (max-width: 350px) {
  .testimonials-mother-container {
    padding: 8vh 1rem 9vh;
  }
  .testimonials-mother-container .testimonial-text {
    margin: 0rem 0rem 0.5rem;
    font-weight: 300;
  }
  .testimonials-mother-container .customer-opinion-heading {
    font-size: 2rem;
    line-height: 2rem;
    margin: 0rem 0rem 1rem;
  }
  .testimonials-mother-container .customer-text-plus-image {
    display: flex;
    flex-direction: column-reverse;
    gap: 0rem;
    height: -moz-max-content;
    height: max-content;
    margin: 2rem 0rem 0rem;
  }
  .testimonials-mother-container .customer-text-plus-image .customer-testimonial .text-cover .text {
    font-size: 1.3rem;
    line-height: 2rem;
  }
  .testimonials-mother-container .customer-text-plus-image .customer-testimonial .text-cover .client-name {
    margin: 0rem 0rem 1.2rem;
  }
  .testimonials-mother-container .customer-text-plus-image .customer-testimonial .text-cover .client-name h5 {
    font-size: 1rem;
    margin: 0rem 0rem 0.1rem;
  }
  .testimonials-mother-container .customer-text-plus-image .customer-testimonial .text-cover .navigation-buttons {
    display: flex;
    gap: 1rem;
  }
  .testimonials-mother-container .customer-text-plus-image .customer-testimonial .text-cover .navigation-buttons button {
    background-color: #000;
    border: none;
    color: #fff;
    padding: 0.8rem 1rem;
    font-size: 1rem;
  }
  .testimonials-mother-container .customer-text-plus-image .customer-image {
    height: 13rem;
    width: 80vw;
  }
  .testimonials-mother-container .customer-text-plus-image .customer-image .top-right div {
    width: 3.5rem;
    height: 3.5rem;
    background-color: rgb(82, 145, 124);
  }
  .testimonials-mother-container .customer-text-plus-image .customer-image .top-right div:nth-child(2) {
    background-color: #fff;
  }
  .testimonials-mother-container .customer-text-plus-image .customer-image .bottom-left {
    position: absolute;
    left: 0rem;
    bottom: 0rem;
    width: 3.5rem;
    height: 3.5rem;
    background-color: pink;
  }
}
.contact-mother-container {
  position: relative;
  height: 54vh;
  overflow: hidden;
}
.contact-mother-container img {
  height: 150%;
  width: 91vw;
}
.contact-mother-container .text-section {
  position: absolute;
  top: 0rem;
  display: flex;
  align-items: center;
  width: 100%;
  height: 100%;
}
.contact-mother-container .text-section .texts-button-cover {
  width: 1200px;
  margin: 0rem auto;
}
.contact-mother-container .text-section .texts-button-cover h1 {
  font-size: 2.5rem;
  font-weight: 500;
  margin: 0rem;
  color: #fff;
}
.contact-mother-container .text-section .texts-button-cover button {
  background-color: burlywood;
  border: none;
  padding: 1rem 1.5rem;
  font-size: 1rem;
  font-weight: 600;
  margin: 2rem 0rem 0rem;
  cursor: pointer;
  transition: all 0.5s ease-in-out;
}
.contact-mother-container .text-section .texts-button-cover button:hover {
  background-color: red;
  color: #fff;
}
.contact-mother-container .boxes-grid-right {
  position: absolute;
  display: grid;
  grid-template-columns: repeat(3, 9vw);
  grid-template-rows: repeat(2, 18vh);
  right: 0rem;
  bottom: 0rem;
}
.contact-mother-container .boxes-grid-right div {
  background-color: burlywood;
  width: 100%;
  height: 100%;
}
.contact-mother-container .boxes-grid-right div:first-child {
  background-color: transparent;
}
.contact-mother-container .boxes-grid-right div:nth-child(4) {
  background-color: rgb(141, 194, 176);
}
.contact-mother-container .boxes-grid-right div:nth-child(5) {
  background-color: #000;
}
.contact-mother-container .boxes-grid-right div:nth-child(2),
.contact-mother-container .boxes-grid-right div:nth-child(6) {
  background-color: #fff;
}

/* MEDIA SCREEN RESPONSIVENESS */
@media (max-width: 1100px) {
  .contact-mother-container {
    position: relative;
    height: 30vh;
    overflow: hidden;
  }
  .contact-mother-container img {
    height: 150%;
    width: 86vw;
  }
  .contact-mother-container .text-section {
    padding: 0rem 0rem 0rem 1rem;
  }
  .contact-mother-container .text-section .texts-button-cover {
    width: 100%;
    margin: 0rem;
  }
  .contact-mother-container .boxes-grid-right {
    display: grid;
    grid-template-columns: repeat(3, 14vw);
    grid-template-rows: repeat(2, 10vh);
  }
  .contact-mother-container .boxes-grid-right div {
    background-color: burlywood;
    width: 100%;
    height: 100%;
  }
  .contact-mother-container .boxes-grid-right div:first-child {
    background-color: transparent;
  }
  .contact-mother-container .boxes-grid-right div:nth-child(4) {
    background-color: rgb(141, 194, 176);
  }
  .contact-mother-container .boxes-grid-right div:nth-child(5) {
    background-color: #000;
  }
  .contact-mother-container .boxes-grid-right div:nth-child(2),
  .contact-mother-container .boxes-grid-right div:nth-child(6) {
    background-color: #fff;
  }
}
@media (max-width: 600px) {
  .contact-mother-container {
    position: relative;
    height: 35vh;
    overflow: hidden;
  }
  .contact-mother-container img {
    height: 100%;
    width: 100vw;
  }
  .contact-mother-container .text-section {
    padding: 0rem 0rem 0rem 1rem;
  }
  .contact-mother-container .text-section .texts-button-cover {
    width: 100%;
    margin: 0rem;
  }
  .contact-mother-container .text-section .texts-button-cover h1 {
    font-size: 2rem;
    font-weight: 500;
    margin: 0rem;
    color: #fff;
  }
  .contact-mother-container .text-section .texts-button-cover button {
    background-color: burlywood;
    border: none;
    padding: 0.5rem 1rem;
    font-size: 1rem;
    font-weight: 600;
    margin: 2rem 0rem 0rem;
  }
  .contact-mother-container .boxes-grid-right {
    display: grid;
    grid-template-columns: repeat(3, 13vw);
    grid-template-rows: repeat(2, 9vh);
  }
  .contact-mother-container .boxes-grid-right div {
    background-color: burlywood;
    width: 100%;
    height: 100%;
  }
  .contact-mother-container .boxes-grid-right div:first-child {
    background-color: transparent;
  }
  .contact-mother-container .boxes-grid-right div:nth-child(4) {
    background-color: rgb(141, 194, 176);
  }
  .contact-mother-container .boxes-grid-right div:nth-child(5) {
    background-color: #000;
  }
  .contact-mother-container .boxes-grid-right div:nth-child(2),
  .contact-mother-container .boxes-grid-right div:nth-child(6) {
    background-color: #fff;
  }
}
@media (max-width: 500px) {
  .contact-mother-container {
    position: relative;
    height: 18rem;
    overflow: hidden;
  }
  .contact-mother-container img {
    height: 100%;
    width: 100vw;
  }
  .contact-mother-container .text-section {
    padding: 0rem 0rem 0rem 1rem;
  }
  .contact-mother-container .text-section .texts-button-cover {
    width: 100%;
    margin: 0rem;
  }
  .contact-mother-container .text-section .texts-button-cover h1 {
    font-size: 2rem;
    font-weight: 500;
    margin: 0rem;
    color: #fff;
    width: 98%;
  }
  .contact-mother-container .text-section .texts-button-cover button {
    background-color: burlywood;
    border: none;
    padding: 0.5rem 1rem;
    font-size: 1rem;
    font-weight: 600;
    margin: 2rem 0rem 0rem;
  }
  .contact-mother-container .boxes-grid-right {
    display: grid;
    grid-template-columns: repeat(3, 4rem);
    grid-template-rows: repeat(2, 4rem);
  }
  .contact-mother-container .boxes-grid-right div {
    background-color: burlywood;
    width: 100%;
    height: 100%;
  }
  .contact-mother-container .boxes-grid-right div:first-child {
    background-color: transparent;
  }
  .contact-mother-container .boxes-grid-right div:nth-child(4) {
    background-color: rgb(141, 194, 176);
  }
  .contact-mother-container .boxes-grid-right div:nth-child(5) {
    background-color: #000;
  }
  .contact-mother-container .boxes-grid-right div:nth-child(2),
  .contact-mother-container .boxes-grid-right div:nth-child(6) {
    background-color: #fff;
  }
}
@media (max-width: 400px) {
  .contact-mother-container {
    position: relative;
    height: 18rem;
    overflow: hidden;
  }
  .contact-mother-container img {
    height: 100%;
    width: 100vw;
  }
  .contact-mother-container .text-section {
    padding: 0rem 0rem 0rem 1rem;
  }
  .contact-mother-container .text-section .texts-button-cover {
    width: 100%;
    margin: 0rem;
  }
  .contact-mother-container .text-section .texts-button-cover h1 {
    font-size: 2rem;
    font-weight: 500;
    line-height: 2.5rem;
    margin: 0rem;
    color: #fff;
    width: 90%;
  }
  .contact-mother-container .text-section .texts-button-cover button {
    background-color: burlywood;
    border: none;
    padding: 0.5rem 1rem;
    font-size: 1rem;
    font-weight: 600;
    margin: 2rem 0rem 0rem;
  }
  .contact-mother-container .boxes-grid-right {
    display: grid;
    grid-template-columns: repeat(3, 3.2rem);
    grid-template-rows: repeat(2, 3.2rem);
  }
  .contact-mother-container .boxes-grid-right div {
    background-color: burlywood;
    width: 100%;
    height: 100%;
  }
  .contact-mother-container .boxes-grid-right div:first-child {
    background-color: transparent;
  }
  .contact-mother-container .boxes-grid-right div:nth-child(4) {
    background-color: rgb(141, 194, 176);
  }
  .contact-mother-container .boxes-grid-right div:nth-child(5) {
    background-color: #000;
  }
  .contact-mother-container .boxes-grid-right div:nth-child(2),
  .contact-mother-container .boxes-grid-right div:nth-child(6) {
    background-color: #fff;
  }
}
@media (max-width: 380px) {
  .contact-mother-container {
    position: relative;
    height: 18rem;
    overflow: hidden;
  }
  .contact-mother-container img {
    height: 100%;
    width: 100vw;
  }
  .contact-mother-container .text-section {
    padding: 0rem 0rem 0rem 1rem;
  }
  .contact-mother-container .text-section .texts-button-cover {
    width: 100%;
    margin: 0rem;
  }
  .contact-mother-container .text-section .texts-button-cover h1 {
    font-size: 2rem;
    font-weight: 500;
    line-height: 2.5rem;
    margin: 0rem;
    color: #fff;
    width: 90%;
  }
  .contact-mother-container .text-section .texts-button-cover button {
    background-color: burlywood;
    border: none;
    padding: 0.5rem 1rem;
    font-size: 1rem;
    font-weight: 600;
    margin: 2rem 0rem 0rem;
  }
  .contact-mother-container .boxes-grid-right {
    display: grid;
    grid-template-columns: repeat(3, 3rem);
    grid-template-rows: repeat(2, 3rem);
  }
  .contact-mother-container .boxes-grid-right div {
    background-color: burlywood;
    width: 100%;
    height: 100%;
  }
  .contact-mother-container .boxes-grid-right div:first-child {
    background-color: transparent;
  }
  .contact-mother-container .boxes-grid-right div:nth-child(4) {
    background-color: rgb(141, 194, 176);
  }
  .contact-mother-container .boxes-grid-right div:nth-child(5) {
    background-color: #000;
  }
  .contact-mother-container .boxes-grid-right div:nth-child(2),
  .contact-mother-container .boxes-grid-right div:nth-child(6) {
    background-color: #fff;
  }
}
@media (max-width: 370px) {
  .contact-mother-container {
    position: relative;
    height: 18rem;
    overflow: hidden;
  }
  .contact-mother-container img {
    height: 100%;
    width: 100vw;
  }
  .contact-mother-container .text-section {
    padding: 0rem 1rem 0rem 1rem;
  }
  .contact-mother-container .text-section .texts-button-cover {
    width: 100%;
    margin: 0rem;
  }
  .contact-mother-container .text-section .texts-button-cover h1 {
    font-size: 2rem;
    font-weight: 500;
    line-height: 2.5rem;
    margin: 0rem;
    color: #fff;
    width: 90%;
  }
  .contact-mother-container .text-section .texts-button-cover button {
    background-color: burlywood;
    border: none;
    padding: 0.5rem 1rem;
    font-size: 1rem;
    font-weight: 600;
    margin: 2rem 0rem 0rem;
  }
  .contact-mother-container .boxes-grid-right {
    display: grid;
    grid-template-columns: repeat(3, 3rem);
    grid-template-rows: repeat(2, 3rem);
  }
  .contact-mother-container .boxes-grid-right div {
    background-color: burlywood;
    width: 100%;
    height: 100%;
  }
  .contact-mother-container .boxes-grid-right div:first-child {
    background-color: transparent;
  }
  .contact-mother-container .boxes-grid-right div:nth-child(4) {
    background-color: rgb(141, 194, 176);
  }
  .contact-mother-container .boxes-grid-right div:nth-child(5) {
    background-color: #000;
  }
  .contact-mother-container .boxes-grid-right div:nth-child(2),
  .contact-mother-container .boxes-grid-right div:nth-child(6) {
    background-color: #fff;
  }
}
@media (max-width: 350px) {
  .contact-mother-container {
    position: relative;
    height: 40vh;
    overflow: hidden;
  }
  .contact-mother-container img {
    height: 100%;
    width: 100vw;
  }
  .contact-mother-container .text-section {
    padding: 0rem 1rem 0rem 1rem;
  }
  .contact-mother-container .text-section .texts-button-cover {
    width: 100%;
    margin: 0rem;
  }
  .contact-mother-container .text-section .texts-button-cover h1 {
    font-size: 2rem;
    font-weight: 500;
    line-height: 2.5rem;
    margin: 0rem;
    color: #fff;
    width: 90%;
  }
  .contact-mother-container .text-section .texts-button-cover button {
    background-color: burlywood;
    border: none;
    padding: 0.5rem 1rem;
    font-size: 1rem;
    font-weight: 600;
    margin: 2rem 0rem 0rem;
  }
  .contact-mother-container .boxes-grid-right {
    display: grid;
    grid-template-columns: repeat(3, 14vw);
    grid-template-rows: repeat(2, 6vh);
  }
  .contact-mother-container .boxes-grid-right div {
    background-color: burlywood;
    width: 100%;
    height: 100%;
  }
  .contact-mother-container .boxes-grid-right div:first-child {
    background-color: transparent;
  }
  .contact-mother-container .boxes-grid-right div:nth-child(4) {
    background-color: rgb(141, 194, 176);
  }
  .contact-mother-container .boxes-grid-right div:nth-child(5) {
    background-color: #000;
  }
  .contact-mother-container .boxes-grid-right div:nth-child(2),
  .contact-mother-container .boxes-grid-right div:nth-child(6) {
    background-color: #fff;
  }
}
.footer-mother-container {
  padding: 12vh 0vh 4vh;
}
.footer-mother-container .footer-wrapper {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.footer-mother-container .footer-wrapper .first-grid h1 {
  font-size: 2rem;
  font-weight: lighter;
  margin: 0rem;
}
.footer-mother-container .footer-wrapper .first-grid p {
  font-size: 0.9rem;
  line-height: 1.5rem;
  color: #7a7a7a;
  margin: 0.5rem 0rem 1.5rem;
  width: 15rem;
}
.footer-mother-container .footer-wrapper .first-grid h2 {
  margin: 0rem;
  font-size: 1.3rem;
  font-weight: lighter;
  text-decoration: underline;
}
.footer-mother-container .footer-wrapper .first-grid h2:nth-child(4) {
  margin: 1rem 0rem 0rem;
}
.footer-mother-container .footer-wrapper .another-one {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.footer-mother-container .footer-wrapper .another-one h3 {
  font-size: 0.9rem;
  font-weight: lighter;
  color: #7a7a7a;
  margin: 0rem;
}
.footer-mother-container .footer-wrapper .another-one ul {
  padding: 0rem;
  margin: 0rem;
  list-style-type: none;
  font-size: 1rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.footer-mother-container .footer-wrapper .fifth-grid {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.footer-mother-container .footer-wrapper .fifth-grid h3 {
  font-size: 0.9rem;
  font-weight: lighter;
  color: #7a7a7a;
  margin: 0rem;
}
.footer-mother-container .footer-wrapper .fifth-grid .socials-link {
  display: flex;
  gap: 1rem;
}
.footer-mother-container .footer-wrapper .fifth-grid .socials-link a {
  padding: 1rem 1rem;
  text-decoration: none;
  background-color: #000;
  color: #fff;
  font-size: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.footer-mother-container .stright-grayline {
  height: 1px;
  background-color: #c2c2c2;
  margin: 3rem 0rem 2rem;
}
.footer-mother-container .copyright {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
}
.footer-mother-container .copyright .copy-cover {
  color: #7a7a7a;
  font-size: 1rem;
}
.footer-mother-container .copyright .creator h5 {
  font-size: 1rem;
  color: #7a7a7a;
  font-weight: 300;
  margin: 0rem;
}
.footer-mother-container .copyright .creator h5 a {
  text-decoration: underline;
  font-style: italic;
  color: darkgreen;
  font-weight: 600;
}
.footer-mother-container .copyright .creator h5 a strong {
  color: lawngreen;
}

/* MEDIA SCREEN RESPONSIVENESS */
@media (max-width: 1100px) {
  .footer-mother-container {
    padding: 6vh 1rem 2vh;
  }
}
@media (max-width: 900px) {
  .footer-mother-container {
    padding: 6vh 1rem 2vh;
  }
  .footer-mother-container .footer-wrapper {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 3vw;
  }
  .footer-mother-container .footer-wrapper .first-grid h1 {
    font-size: 2rem;
    font-weight: lighter;
    margin: 0rem;
  }
  .footer-mother-container .footer-wrapper .first-grid p {
    font-size: 0.9rem;
    line-height: 1.5rem;
    color: #7a7a7a;
    margin: 0.5rem 0rem 1.5rem;
    width: 15rem;
  }
  .footer-mother-container .footer-wrapper .first-grid h2 {
    margin: 0rem;
    font-size: 1.3rem;
    font-weight: lighter;
    text-decoration: underline;
  }
  .footer-mother-container .footer-wrapper .first-grid h2:nth-child(4) {
    margin: 1rem 0rem 0rem;
  }
  .footer-mother-container .footer-wrapper .another-one {
    display: flex;
    flex-direction: column;
    gap: 1rem;
  }
  .footer-mother-container .footer-wrapper .another-one h3 {
    font-size: 0.9rem;
    font-weight: lighter;
    color: #7a7a7a;
    margin: 0rem;
  }
  .footer-mother-container .footer-wrapper .another-one ul {
    padding: 0rem;
    margin: 0rem;
    list-style-type: none;
    font-size: 1rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
  }
  .footer-mother-container .footer-wrapper .fifth-grid {
    display: flex;
    flex-direction: column;
    gap: 1rem;
  }
  .footer-mother-container .footer-wrapper .fifth-grid h3 {
    font-size: 0.9rem;
    font-weight: lighter;
    color: #7a7a7a;
    margin: 0rem;
  }
  .footer-mother-container .footer-wrapper .fifth-grid .socials-link {
    display: flex;
    gap: 1rem;
  }
  .footer-mother-container .footer-wrapper .fifth-grid .socials-link a {
    padding: 1rem 1rem;
    text-decoration: none;
    background-color: #000;
    color: #fff;
    font-size: 1.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
  }
}
@media (max-width: 500px) {
  .footer-mother-container {
    padding: 5vh 1rem 2vh;
  }
  .footer-mother-container .footer-wrapper {
    gap: 6vw;
  }
  .footer-mother-container .footer-wrapper .first-grid {
    flex-basis: 100%;
  }
  .footer-mother-container .footer-wrapper .first-grid h1 {
    font-size: 2rem;
    font-weight: bolder;
    margin: 0rem;
  }
  .footer-mother-container .footer-wrapper .first-grid p {
    font-size: 0.9rem;
    line-height: 1.5rem;
    color: #7a7a7a;
    margin: 0.5rem 0rem 1rem;
    width: 15rem;
  }
  .footer-mother-container .footer-wrapper .first-grid h2 {
    margin: 0rem;
    font-size: 1.3rem;
    font-weight: 500;
    text-decoration: underline;
  }
  .footer-mother-container .footer-wrapper .first-grid h2:nth-child(4) {
    margin: 1rem 0rem 0rem;
  }
  .footer-mother-container .footer-wrapper .another-one {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
  }
  .footer-mother-container .footer-wrapper .another-one h3 {
    font-size: 0.9rem;
    font-weight: 300;
    color: #7a7a7a;
    margin: 0rem;
  }
  .footer-mother-container .footer-wrapper .another-one ul {
    padding: 0rem;
    margin: 0rem;
    list-style-type: none;
    font-size: 1rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
  }
  .footer-mother-container .footer-wrapper .fifth-grid {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
  }
  .footer-mother-container .footer-wrapper .fifth-grid h3 {
    font-size: 0.9rem;
    font-weight: 300;
    color: #7a7a7a;
    margin: 0rem;
  }
  .footer-mother-container .footer-wrapper .fifth-grid .socials-link {
    display: flex;
    gap: 1rem;
  }
  .footer-mother-container .footer-wrapper .fifth-grid .socials-link a {
    padding: 1rem 1rem;
    text-decoration: none;
    background-color: #000;
    color: #fff;
    font-size: 1.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .footer-mother-container .copyright {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 0rem;
  }
  .footer-mother-container .copyright .copy-cover {
    color: #7a7a7a;
    font-size: 1rem;
  }
  .footer-mother-container .copyright .creator {
    margin: 0rem;
    padding: 0rem;
  }
  .footer-mother-container .copyright .creator h5 {
    font-size: 1rem;
    color: #7a7a7a;
    font-weight: 300;
    margin: 0rem 0rem 0rem;
    padding: 0rem;
  }
  .footer-mother-container .copyright .creator h5 a {
    text-decoration: underline;
    font-style: italic;
    color: darkgreen;
    font-weight: 600;
  }
  .footer-mother-container .copyright .creator h5 a strong {
    color: lawngreen;
  }
}
@media (max-width: 400px) {
  .footer-mother-container {
    padding: 5vh 1rem 2vh;
  }
  .footer-mother-container .footer-wrapper {
    gap: 6vw;
  }
  .footer-mother-container .footer-wrapper .first-grid {
    flex-basis: 100%;
  }
  .footer-mother-container .footer-wrapper .first-grid h1 {
    font-size: 2rem;
    font-weight: bolder;
    margin: 0rem;
  }
  .footer-mother-container .footer-wrapper .first-grid p {
    font-size: 0.9rem;
    line-height: 1.5rem;
    color: #7a7a7a;
    margin: 0.5rem 0rem 1rem;
    width: 15rem;
  }
  .footer-mother-container .footer-wrapper .first-grid h2 {
    margin: 0rem;
    font-size: 1.3rem;
    font-weight: 500;
    text-decoration: underline;
  }
  .footer-mother-container .footer-wrapper .first-grid h2:nth-child(4) {
    margin: 1rem 0rem 0rem;
  }
  .footer-mother-container .footer-wrapper .another-one {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
  }
  .footer-mother-container .footer-wrapper .another-one h3 {
    font-size: 0.9rem;
    font-weight: 300;
    color: #7a7a7a;
    margin: 0rem;
  }
  .footer-mother-container .footer-wrapper .another-one ul {
    padding: 0rem;
    margin: 0rem;
    list-style-type: none;
    font-size: 1rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
  }
  .footer-mother-container .footer-wrapper .fifth-grid {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
  }
  .footer-mother-container .footer-wrapper .fifth-grid h3 {
    font-size: 0.9rem;
    font-weight: 300;
    color: #7a7a7a;
    margin: 0rem;
  }
  .footer-mother-container .footer-wrapper .fifth-grid .socials-link {
    display: flex;
    gap: 1rem;
  }
  .footer-mother-container .footer-wrapper .fifth-grid .socials-link a {
    padding: 1rem 1rem;
    text-decoration: none;
    background-color: #000;
    color: #fff;
    font-size: 1.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.5s ease-in-out;
  }
  .footer-mother-container .footer-wrapper .fifth-grid .socials-link a:hover {
    background-color: red;
  }
  .footer-mother-container .copyright {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 0rem;
  }
  .footer-mother-container .copyright .copy-cover {
    color: #7a7a7a;
    font-size: 1rem;
  }
  .footer-mother-container .copyright .creator {
    margin: 0rem;
    padding: 0rem;
  }
  .footer-mother-container .copyright .creator h5 {
    font-size: 1rem;
    color: #7a7a7a;
    font-weight: 300;
    margin: 0rem 0rem 0rem;
    padding: 0rem;
  }
  .footer-mother-container .copyright .creator h5 a {
    text-decoration: underline;
    font-style: italic;
    color: darkgreen;
    font-weight: 600;
  }
  .footer-mother-container .copyright .creator h5 a strong {
    color: lawngreen;
  }
}
.header-mother-container {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  color: #fff;
  z-index: 100;
  padding: 1rem 0rem;
}
.header-mother-container .nav-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.header-mother-container .nav-container .logo {
  font-size: 2rem;
  margin: 0rem;
  font-weight: bolder;
  color: #d99201;
}
.header-mother-container .nav-container .logo span {
  color: red;
}
.header-mother-container .nav-container .nav-links {
  display: flex;
  align-items: center;
  justify-content: center;
  list-style: none;
  gap: 3rem;
}
.header-mother-container .nav-container .nav-links li {
  font-weight: normal;
  transition: all 0.3s ease-in-out;
  cursor: pointer;
}
.header-mother-container .nav-container .nav-links li:hover {
  color: red;
}
.header-mother-container .nav-container .nav-links.view-nav {
  transform: translateX(0%);
}
.header-mother-container .nav-container #close-btn {
  display: none;
}
.header-mother-container .nav-container .contact-btn {
  padding: 1rem 1rem;
  background: none;
  border: 2px solid #fff;
  color: #fff;
  font-size: 1rem;
  transition: all 0.5s ease-in-out;
  cursor: pointer;
}
.header-mother-container .nav-container .contact-btn:hover {
  background-color: red;
}

.header-mother-container.scrolled {
  background: linear-gradient(135deg, rgba(189, 17, 40, 0.3764705882), rgba(23, 136, 180, 0.3764705882), rgba(0, 0, 0, 0.7058823529));
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

/* MOBILE VIEW NAV LINK MENU */
.mobile-contacting-link {
  display: none;
}

.nav-btn {
  cursor: pointer;
}

.toggle {
  position: relative;
  width: 3rem;
  height: 2.5rem;
  border-radius: 10px;
  display: none;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  transition: transform 0.3s ease-in-out;
}

.toggle span {
  position: absolute;
  width: 2rem;
  height: 2px;
  background-color: #fff;
  border-radius: 2px;
  transition: 0.5s;
}

.toggle span:nth-child(1) {
  transform: translateY(-7px);
  width: 1.5rem;
  right: 8px;
}

.toggle.active span:nth-child(1) {
  width: 1.5rem;
  transform: translateY(0px) rotate(45deg);
  transition-delay: 0.125s;
}

.toggle span:nth-child(2) {
  transform: translateY(7px);
  width: 0.9rem;
  right: 8px;
}

.toggle.active span:nth-child(2) {
  width: 1.5rem;
  transform: translateY(0px) rotate(315deg);
  transition-delay: 0.25s;
}

.toggle.active span:nth-child(3) {
  transform: translateX(-3rem);
}

/* MEDIA SCREEN RESPONSIVENESS */
@media (max-width: 1100px) {
  .header-mother-container .nav-container {
    padding: 0rem 1rem;
  }
  .header-mother-container .nav-container .nav-links {
    gap: 2rem;
  }
}
@media (max-width: 900px) {
  .header-mother-container .nav-container {
    padding: 0rem 1rem;
  }
  .header-mother-container .nav-container .nav-links {
    gap: 0rem;
    position: absolute;
    top: -1rem;
    left: 0rem;
    flex-direction: column;
    justify-content: start;
    align-items: start;
    height: 100vh;
    width: 50vw;
    background: linear-gradient(135deg, rgba(26, 5, 8, 0.9098039216), rgba(5, 25, 34, 0.9529411765), #020214);
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    padding: 0rem;
    color: #fff;
    z-index: 200;
    transition: transform 0.5s ease-in-out;
    transform: translateX(-110%);
  }
  .header-mother-container .nav-container .nav-links li {
    padding: 1rem 2rem;
    width: 100%;
    box-sizing: border-box;
    border-top: 1px solid #fff;
    border-bottom: 1px solid #fff;
    text-align: center;
    transition: background-color 0.5s ease-in-out;
  }
  .header-mother-container .nav-container .nav-links li:hover {
    background-color: burlywood;
  }
  .header-mother-container .nav-container .nav-links #close-btn {
    display: flex;
    font-size: 1.5rem;
    align-self: flex-end;
    margin: 1rem;
  }
  .header-mother-container .nav-container .nav-links .mobile-contacting-link {
    display: block;
  }
  .header-mother-container .nav-container .contact-btn {
    display: none;
  }
  .toggle {
    position: relative;
    width: 3rem;
    height: 2.5rem;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    transition: transform 0.3s ease-in-out;
  }
}
@media (max-width: 600px) {
  .header-mother-container {
    padding: 0.8rem 0rem;
  }
  .header-mother-container .nav-container {
    padding: 0rem 0.5rem 0rem 0.9rem;
  }
  .header-mother-container .nav-container .logo {
    padding: 0rem;
    margin: 0rem;
    font-size: 1.5rem;
    list-style: 1.5rem;
  }
  .header-mother-container .nav-container .nav-links {
    gap: 0rem;
    position: absolute;
    top: -1rem;
    left: 0rem;
    flex-direction: column;
    justify-content: start;
    align-items: start;
    height: 100vh;
    width: 90vw;
    background: linear-gradient(135deg, rgba(26, 5, 8, 0.9098039216), rgba(5, 25, 34, 0.9529411765), #020214);
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    padding: 0rem;
    color: #fff;
    z-index: 200;
    transition: transform 0.5s ease-in-out;
    transform: translateX(-110%);
  }
  .header-mother-container .nav-container .nav-links li {
    padding: 1rem 2rem;
    width: 100%;
    box-sizing: border-box;
    border-top: 0.5px solid #fff;
    border-bottom: 0.5px solid #fff;
    text-align: center;
    transition: background-color 0.5s ease-in-out;
  }
  .header-mother-container .nav-container .nav-links li:hover {
    background-color: burlywood;
  }
  .header-mother-container .nav-container .nav-links #close-btn {
    display: flex;
    font-size: 1.5rem;
    align-self: flex-end;
    margin: 1rem;
  }
  .header-mother-container .nav-container .nav-links .mobile-contacting-link {
    display: block;
  }
  .header-mother-container .nav-container .contact-btn {
    display: none;
  }
}/*# sourceMappingURL=style.css.map */