:root {
  --primary-color: #57534d;
  --white: white;
  --background-primary: #007a55;
  --secondary-color: #f5f5f4;
  --background-secondary: #ffe9de;
  --black: #292524;
}

.body {
  color: var(--primary-color);
  font-family: Inter, sans-serif;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5em;
}

.navbar {
  z-index: 2;
  background-color: #fffffff2;
  border: 1px solid #e7e5e4;
  padding: .875rem 1.25rem;
  box-shadow: 0 1px 2px -1px #0000001a, 0 1px 3px #0000001a;
}

.container-large {
  width: 100%;
  max-width: 61.25rem;
  margin-left: auto;
  margin-right: auto;
}

.wrap-nav {
  grid-column-gap: 6.5625rem;
  grid-row-gap: 6.5625rem;
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.brand {
  width: 100%;
  max-width: 11.75rem;
}

.img-w-100 {
  width: 100%;
}

.menu-list {
  grid-column-gap: 1.5rem;
  grid-row-gap: 1.5rem;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.nav-menu {
  grid-column-gap: 1.5rem;
  grid-row-gap: 1.5rem;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  display: flex;
}

.nav-link {
  letter-spacing: -.31px;
  margin-left: 0;
  margin-right: 0;
  padding: 0;
  font-weight: 500;
  transition: all .45s;
}

.nav-link:hover {
  opacity: .8;
}

.nav-btn-flex {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  align-items: center;
  display: flex;
}

.phone-link {
  grid-column-gap: .5rem;
  grid-row-gap: .5rem;
  color: var(--primary-color);
  letter-spacing: -.15px;
  align-items: center;
  font-size: .875rem;
  line-height: 1.42857rem;
  text-decoration: none;
  display: flex;
}

.button {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  background-color: var(--background-primary);
  color: var(--white);
  border-radius: .5rem;
  align-items: center;
  padding: 8px 15px;
  font-size: .875rem;
  font-weight: 500;
  line-height: 1.5rem;
  text-decoration: none;
  transition: all .45s;
  display: flex;
}

.button:hover {
  opacity: .8;
}

.button.font-size-18 {
  padding: 12px 19px;
  font-size: 1.125rem;
}

.button.font-size-18.hide-bg {
  border: 1px solid var(--white);
  background-color: #ffffff1a;
}

.button.pd-70 {
  text-align: center;
  justify-content: center;
  align-items: center;
  padding-left: 4.375rem;
  padding-right: 4.375rem;
}

.button.pd-18 {
  border: 1px solid var(--background-primary);
  color: var(--background-primary);
  text-align: center;
  background-color: #0000;
  justify-content: center;
  align-items: center;
  padding-left: 1.125rem;
  padding-right: 1.125rem;
}

.button.pd-18:hover {
  opacity: .5;
}

.button.pd-24 {
  margin-top: 1.375rem;
  padding: 10px 1.5rem;
}

.section-header {
  background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('../images/hero-banner.jpg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
}

.section-hero {
  position: relative;
}

.padding-global {
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}

.container-medium {
  width: 100%;
  max-width: 59.75rem;
  margin-left: auto;
  margin-right: auto;
}

.padding-section-large {
  padding-top: 9rem;
  padding-bottom: 7.1875rem;
}

.padding-section-large.mt-192 {
  padding-top: 10.3rem;
  padding-bottom: 6rem;
}

.wrap-hero-home {
  grid-column-gap: 3.75rem;
  grid-row-gap: 3.75rem;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  max-width: 31.9375rem;
  display: flex;
}

.heading-hero-home {
  grid-column-gap: 3.25rem;
  grid-row-gap: 3.25rem;
  flex-flow: column;
  display: flex;
}

.heading-style-h1 {
  color: var(--white);
  letter-spacing: .12px;
  margin-top: 0;
  margin-bottom: 0;
  font-family: Marcellus, sans-serif;
  font-size: 3.75rem;
  font-weight: 400;
  line-height: 1.2em;
}

.text-size-large {
  color: var(--secondary-color);
  letter-spacing: .07px;
  font-family: Poppins, sans-serif;
  font-size: 1.5rem;
  line-height: 1.625em;
}

.group-btn {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  align-items: center;
  display: flex;
}

.arrow-down {
  border: 2px solid #ffffff80;
  border-radius: 16777200px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  max-width: 1.5rem;
  height: 2.5rem;
  margin-left: auto;
  margin-right: auto;
  padding-top: 8px;
  transition: all .45s;
  display: flex;
  position: absolute;
  bottom: 2rem;
  left: 0;
  right: 0;
}

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

.padding-section-medium {
  padding-top: 6.125rem;
  padding-bottom: 5.875rem;
}

.padding-section-medium.mt-96 {
  padding-top: 6rem;
  padding-bottom: 4.125rem;
}

.wrap-about-home {
  grid-column-gap: 1.5rem;
  grid-row-gap: 1.5rem;
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.about-home-image {
  cursor: pointer;
  width: 100%;
  max-width: 29.125rem;
  transition: all .45s;
}

.about-home-image:hover {
  transform: scale(1.03);
}

.about-componant {
  grid-column-gap: 3.125rem;
  grid-row-gap: 3.125rem;
  flex-flow: column;
  width: 100%;
  display: flex;
}

.items-about-home {
  grid-column-gap: 1.625rem;
  grid-row-gap: 1.625rem;
  flex-flow: column;
  display: flex;
}

.heading-style-h2 {
  color: var(--black);
  letter-spacing: .35px;
  margin-top: 0;
  margin-bottom: 0;
  font-family: Marcellus, sans-serif;
  font-size: 3rem;
  font-weight: 400;
  line-height: 1em;
}

.heading-style-h2.font-inter {
  font-family: Inter, sans-serif;
}

.flex-text-gap-4 {
  grid-column-gap: .25rem;
  grid-row-gap: .25rem;
  flex-flow: column;
  display: flex;
}

.flex-text-gap-4.hrztl {
  flex-flow: row;
  justify-content: flex-start;
  align-items: center;
}

.text-size-small {
  color: var(--primary-color);
  letter-spacing: -.31px;
  text-decoration: none;
}

.text-size-small.font-700 {
  color: var(--black);
  letter-spacing: -.44px;
  font-family: Poppins, sans-serif;
  font-size: 1.125rem;
  font-weight: 700;
}

.text-size-small.size-18 {
  letter-spacing: -.44px;
  font-size: 1.125rem;
}

.text-size-small.text-color-blck {
  color: #44403b;
  font-weight: 700;
}

.text-size-small.text-color-pink {
  color: #c6005c;
  font-size: .875rem;
  font-weight: 500;
  line-height: 1.5em;
}

.text-size-small.text-color-black {
  color: var(--black);
}

.text-size-small.text-color-drk {
  color: #a6a09b;
}

.text-size-small.font-500 {
  color: var(--white);
  font-weight: 500;
}

.text-size-small.text-drk {
  color: #d6d3d1;
}

.pra-size-medium {
  letter-spacing: -.44px;
  margin-bottom: 0;
  font-size: 1.125rem;
}

.text-size-medium {
  letter-spacing: .07px;
  font-size: 1.5rem;
  line-height: 1.33333em;
}

.text-size-medium.text-color-green {
  color: #007a55;
  font-family: Marcellus, sans-serif;
}

.maxw-350 {
  width: 100%;
  max-width: 21.875rem;
}

.grid-icon-text-home {
  grid-column-gap: 1.5rem;
  grid-row-gap: 1.5rem;
  align-items: stretch;
  width: 100%;
  display: flex;
}

.icon-text-flex {
  grid-column-gap: .75rem;
  grid-row-gap: .75rem;
  text-align: center;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  display: flex;
}

.box-icon {
  background-color: #cc8c6b;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 4rem;
  height: 4rem;
  display: flex;
}

.text-size-tiny {
  color: #44403b;
  letter-spacing: -.15px;
  font-size: .875rem;
}

.section-feature {
  background-image: linear-gradient(#fee8df, #fff);
}

.padding-section-small {
  padding-top: 6rem;
  padding-bottom: 6rem;
}

.wrap-feature {
  background-color: var(--white);
  border: 2px solid #096;
  border-radius: .875rem;
  justify-content: flex-start;
  align-items: center;
  display: flex;
  overflow: hidden;
}

.image-feature {
  cursor: pointer;
  width: 100%;
  max-width: 32.5rem;
  transition: all .45s;
}

.image-feature:hover {
  transform: scale(1.02);
}

.componant-feature {
  grid-column-gap: 3rem;
  grid-row-gap: 3rem;
  flex-flow: column;
  width: 100%;
  max-width: 27.3rem;
  padding: 1.125rem;
  display: flex;
}

.heading-style-h3 {
  color: var(--black);
  letter-spacing: .37px;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 2.25rem;
  font-weight: 400;
  line-height: 1.11111em;
}

.heading-style-h3.text-color-green {
  color: #007a55;
  font-size: 1.875rem;
}

.heading-style-h3.text-color-green.h-36 {
  font-size: 2.25rem;
}

.heading-feature {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  flex-flow: column;
  width: 100%;
  max-width: 23.125rem;
  display: flex;
}

.feature-table {
  grid-column-gap: 1.5rem;
  grid-row-gap: 1.5rem;
  flex-flow: column;
  display: flex;
}

.icon-table-yes-feature {
  grid-column-gap: .5rem;
  grid-row-gap: .5rem;
  letter-spacing: -.31px;
  align-items: center;
  line-height: 1.5em;
  display: flex;
}

.table-flex-feature {
  grid-column-gap: .5rem;
  grid-row-gap: .5rem;
  flex-flow: column;
  display: flex;
}

.flex-text-gap {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  align-items: center;
  display: flex;
}

.flex-text-gap.vrtl {
  flex-flow: column;
}

.flex-text-gap.gap-10 {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: column;
}

.flex-text-gap.gap-10.left {
  justify-content: flex-start;
  align-items: flex-start;
}

.flex-text-gap.gap-7 {
  grid-column-gap: 7px;
  grid-row-gap: 7px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
}

.section-services {
  background-color: #fafaf9;
}

.wrap-services {
  grid-column-gap: 4rem;
  grid-row-gap: 4rem;
  flex-flow: column;
  display: flex;
}

.heading-services {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  text-align: center;
  flex-flow: column;
  width: 100%;
  max-width: 43.125rem;
  margin-left: auto;
  margin-right: auto;
  display: flex;
}

.pra-size-small {
  letter-spacing: -.45px;
  margin-bottom: 0;
  font-size: 1.25rem;
  line-height: 1.5em;
}

.blog-services {
  grid-column-gap: 2rem;
  grid-row-gap: 2rem;
  flex-flow: column;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.card-services {
  background-color: #fff;
  border: 1px solid #e7e5e4;
  border-radius: .875rem;
  overflow: hidden;
}

.image-service {
  cursor: pointer;
  transition: all .45s;
  position: relative;
}

.image-service:hover {
  transform: scale(1.03);
}

.mint-box {
  color: var(--white);
  letter-spacing: -.15px;
  background-color: #fff3;
  border-radius: 4px;
  padding: 4px 8px;
  font-size: .875rem;
  line-height: 1.42857em;
  position: absolute;
  bottom: .875rem;
  left: .875rem;
  z-index: 1;
}

.content-service {
  grid-column-gap: 1.75rem;
  grid-row-gap: 1.75rem;
  flex-flow: column;
  padding: 3rem 1.5rem 1.5rem;
  display: flex;
}

.heading-style-h5 {
  color: var(--black);
  letter-spacing: -.45px;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 1.25rem;
  font-weight: 400;
  line-height: 1.4em;
}

.maxw-230 {
  grid-column-gap: .5rem;
  grid-row-gap: .5rem;
  flex-flow: column;
  width: 100%;
  max-width: 14.375rem;
  display: flex;
}

.maxw-230._w-209 {
  max-width: 13.0625rem;
  margin-top: 8px;
}

.maxw-230.btm-8 {
  margin-bottom: 8px;
}

.maxw-230.full {
  max-width: 100%;
}

.maxw-230._w-250 {
  max-width: 15.3rem;
  margin-top: 8px;
}

.items-services {
  grid-column-gap: .75rem;
  grid-row-gap: .75rem;
  border-top: 1px solid #e7e5e4;
  flex-flow: column;
  justify-content: flex-start;
  align-items: stretch;
  padding-top: 1rem;
  display: flex;
}

.box-service {
  grid-column-gap: 1.375rem;
  grid-row-gap: 1.375rem;
  background-image: linear-gradient(#fee8df, #fafaf9);
  border: 1px solid #cd8d6b;
  border-radius: .875rem;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  padding: 1.5rem;
  display: flex;
}

.heading-style-h4 {
  color: var(--black);
  letter-spacing: .4px;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 1.875rem;
  font-weight: 400;
  line-height: 1.2em;
}

.wrap-clothing {
  grid-column-gap: 4.5rem;
  grid-row-gap: 4.5rem;
  text-align: center;
  flex-flow: column;
  display: flex;
}

.content-clothing {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.box-text {
  color: #a3004c;
  background-color: #fce7f3;
  border: 1px solid #0000;
  border-radius: 8px;
  padding: 4px 10px;
  font-weight: 500;
}

.grid-clothing {
  grid-column-gap: 2rem;
  grid-row-gap: 2rem;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.card-clothing {
  background-color: #fff;
  border: 1px solid #e7e5e4;
  border-radius: 14px;
  overflow: hidden;
}

.image-card-clothing {
  cursor: pointer;
  transition: all .45s;
}

.image-card-clothing:hover {
  transform: scale(1.03);
}

.items-clothing {
  text-align: left;
  padding: 2.25rem 1.5rem 4.0625rem;
}

.box-clothing {
  grid-column-gap: 1.5rem;
  grid-row-gap: 1.5rem;
  background-image: linear-gradient(#fdf2f8, #fafaf9);
  border: 2px solid #fccee8;
  border-radius: 14px;
  flex-flow: column;
  padding: 2rem 2rem 1rem;
  display: flex;
}

.flex-box {
  grid-column-gap: 1.5rem;
  grid-row-gap: 1.5rem;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  display: flex;
}

.box-text-clothing {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  background-color: #fff;
  border-radius: 10px;
  flex-flow: column;
  width: 100%;
  padding: 1.5rem;
  display: flex;
}

.box-text-clothing.bg-2 {
  background-color: #fce7f3;
  justify-content: flex-start;
  align-items: center;
}

.box-text-clothing.bg-3 {
  border: 1px solid #e60076;
  padding-top: .5rem;
  padding-bottom: .5rem;
  text-decoration: none;
}

.flex-link {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  display: flex;
}

.link {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: #007a55;
  flex-flow: row;
  align-items: center;
  text-decoration: none;
  display: flex;
}

.line-divider {
  background-color: #a6a09b;
  width: 3px;
  height: 1.5rem;
}

.flex-link-gap-12 {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  display: flex;
}

.section-contact {
  background-color: #fafaf9;
}

.wrap-contact {
  grid-column-gap: 4rem;
  grid-row-gap: 4rem;
  flex-flow: column;
  display: flex;
}

.heading-contact {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  text-align: center;
  flex-flow: column;
  display: flex;
}

.contact-flex {
  grid-column-gap: 1.5rem;
  grid-row-gap: 1.5rem;
  flex-flow: column;
  display: flex;
}

.box-contact {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  background-color: #fff;
  border: 1px solid #e7e5e4;
  border-radius: 14px;
  align-items: flex-start;
  padding: 1.5rem;
  transition: all .45s;
  display: flex;
}

.box-contact:hover, .box-contact.bg {
  background-image: linear-gradient(#ecfdf5, #fafaf9);
  border-color: #a4f4cf;
}

.footer {
  background-color: #292524;
  margin-top: 3rem;
}

.footer-top {
  grid-column-gap: 2rem;
  grid-row-gap: 2rem;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.footer-wrap {
  grid-column-gap: 2rem;
  grid-row-gap: 2rem;
  flex-flow: column;
  display: flex;
}

.footer-logo-text {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.logo-footer {
  color: var(--white);
  font-size: 1.25rem;
  text-decoration: none;
}

.maxw-270 {
  width: 100%;
  max-width: 16.875rem;
}

.footer-menu-flex {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  flex-flow: column;
  display: flex;
}

.menu-list-flex {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.link-2 {
  color: #d6d3d1;
  letter-spacing: -.31px;
  text-decoration: none;
  transition: all .45s;
}

.link-2:hover {
  opacity: .8;
}

.footer-contact-flex {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.footer-icon-contact {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: #d6d3d1;
  letter-spacing: -.31px;
  justify-content: flex-start;
  align-items: flex-start;
  text-decoration: none;
  display: flex;
}

.divider {
  border-top: 1px solid #44403b;
  width: 100%;
}

.footer-btm {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  flex-flow: wrap;
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.padding-section-triny {
  padding-top: 3rem;
  padding-bottom: 3rem;
}

.img-w-100-about {
  width: 100%;
}

.modal-pop-main {
  z-index: 999;
  background-color: #000000a8;
  display: none;
  position: fixed;
  inset: 0%;
}

.modal-pop-componant {
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100vh;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  display: flex;
}

.modal-pop-box {
  grid-column-gap: 1.875rem;
  grid-row-gap: 1.875rem;
  background-color: #fff;
  border-radius: .875rem;
  flex-flow: column;
  width: 100%;
  max-width: 29.4375rem;
  height: auto;
  max-height: 90vh;
  overflow-y: auto;
  padding: 3.375rem;
  padding-bottom: 2.5rem;
  display: flex;
  position: relative;
}

.heading-modal {
  text-align: center;
}

.items-modal {
  grid-column-gap: 1.25rem;
  grid-row-gap: 1.25rem;
  flex-flow: column;
  display: flex;
}

.pluse {
  width: 100%;
  max-width: 2rem;
  height: 2rem;
  position: absolute;
  top: 6px;
  right: 6px;
}

@media screen and (max-width: 991px) {
  .menu-list {
    flex-flow: column;
    margin-bottom: 2rem;
  }

  .nav-menu {
    background-color: var(--white);
    padding-top: 2rem;
    padding-bottom: 2rem;
  }

  .nav-btn-flex {
    justify-content: center;
    align-items: center;
  }

  .menu-button {
    background-color: #0000;
    padding: 10px;
  }

  .menu-button.w--open {
    color: var(--primary-color);
    background-color: #0000;
  }

  .padding-section-large {
    padding-top: 10rem;
  }

  .padding-section-large.mt-192 {
    padding-top: 6rem;
  }

  .padding-section-medium {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }

  .wrap-about-home {
    flex-flow: column;
    justify-content: space-between;
    align-items: flex-start;
  }

  .padding-section-small {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }

  .wrap-feature {
    flex-flow: column;
    justify-content: flex-start;
    align-items: flex-start;
  }

  .blog-services {
    grid-template-columns: 1fr 1fr;
  }

  .box-service {
    text-align: center;
  }

  .grid-clothing {
    grid-template-columns: 1fr 1fr;
  }

  .footer-icon-contact {
    white-space: pre-wrap;
  }
}

@media screen and (max-width: 767px) {
  .padding-section-large.mt-192, .padding-section-medium {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }

  .padding-section-small {
    padding-top: 3rem;
    padding-bottom: 3rem;
  }

  .blog-services {
    grid-template-columns: 1fr;
  }

  .footer-top {
    grid-template-columns: 1fr 1fr;
  }
}

@media screen and (max-width: 479px) {
  .button.pd-70 {
    padding-left: 3rem;
    padding-right: 3rem;
  }

  .button.pd-24 {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .padding-section-large {
    padding-top: 4rem;
    padding-bottom: 6rem;
  }

  .wrap-hero-home, .heading-hero-home {
    grid-column-gap: 2rem;
    grid-row-gap: 2rem;
  }

  .heading-style-h1 {
    font-size: 2.8rem;
  }

  .text-size-large {
    font-size: 1.3rem;
  }

  .group-btn {
    flex-flow: wrap;
    justify-content: flex-start;
    align-items: center;
  }

  .arrow-down {
    bottom: 1.4rem;
  }

  .about-componant {
    grid-column-gap: 3rem;
    grid-row-gap: 3rem;
  }

  .items-about-home {
    grid-column-gap: 1.4rem;
    grid-row-gap: 1.4rem;
  }

  .heading-style-h2 {
    font-size: 2.5rem;
  }

  .componant-feature {
    grid-column-gap: 2rem;
    grid-row-gap: 2rem;
  }

  .grid-clothing {
    grid-template-columns: 1fr;
  }

  .box-clothing {
    padding: 1.5rem;
  }

  .flex-box {
    flex-flow: column;
  }

  .line-divider {
    width: 100%;
    height: 2px;
  }

  .flex-link-gap-12 {
    flex-flow: column;
  }

  .box-contact {
    padding-left: 1rem;
  }

  .footer-top {
    grid-column-gap: 1.4rem;
    grid-row-gap: 1.4rem;
    grid-template-columns: 1fr;
  }

  .modal-pop-box {
    height: auto;
    padding-left: 1rem;
    padding-right: 1rem;
  }
}