/* Root Variables */

:root {

  --primary-color: #000000;

  --secondary-color: #0E0EB6;

  --white-color: #ffffff;

  --transparent-color: transparent;

  --font-color: #333;

  --font-family: "Ubuntu", sans-serif;

  --font-family-secondary: "Playfair Display", serif;

  --container-width: 1532px;

  --section-padding: 4rem 1rem;

  --heading-font-weight: 700;

  --text-font-size: 2rem;

  --heading-font-size: 2rem;

  --border-color: #e6e6e6;

  --border-color-dark: #9b9b9b

}



/* Global Styles */

html {

  font-size: clamp(0.520rem, 0.409vw + 0.241rem, 0.625rem);

}

body,html{overflow-x: hidden;}



* {

  margin: 0;

  padding: 0;

  box-sizing: border-box;

}



body {

  font-family: var(--font-family);

  color: var(--font-color);

  line-height: 1.6;

  background-color: #fff;

  font-size: var(--text-font-size);

}



.container {

  max-width: var(--container-width);

  margin: 0 auto;

  padding: 0 1.6rem;

}



h1,

h2,

h3 {

  margin-bottom: 1rem;

  line-height: 1.2;

  font-weight: var(--heading-font-weight);

  font-size: var(--heading-font-size);

}



p {

  margin-bottom: 1.8rem;

  font-size: var(--text-font-size);

  line-height: 3.7rem;

}



img {

  max-width: 100%;

  display: block;

}



.hero-buttons {

  display: flex;

  gap: 25px;

}

.contact-form form br {

    display: none;

}

.hero-buttons .btn {

  display: inline-block;

  padding: 1.55rem 4.2rem 1.55rem 5rem;

  text-decoration: none;

  color: #fff;

  border-radius: 3.5rem;

  font-size: 2rem;

  font-weight: 500;

  border: solid 1px var(--secondary-color);

}

.error-pic img {

    margin: 0 auto 30px;

}

.error-box {

    text-align: center;

    padding: 30px 0;

}

.error-box h1 {

    color: #23A455;

    margin-bottom: 0.5rem;

    font-family: Aclonica, sans-serif;

    font-size: 1.7rem;

    font-weight: 500;

    text-transform: capitalize;

    line-height: normal;

}



.hero-buttons .btn.secondary {

  padding-right: 4.8rem;

}



.btn {

  white-space: nowrap;

  transition: background-color 0.3s ease;

}



.btn.primary {

  background-color: var(--secondary-color);

}



.btn.primary:hover {

  background-color: var(--white-color);

  color: var(--secondary-color);

}



.btn.secondary {

  background-color: var(--transparent-color);

  color: var(--secondary-color);

}



.btn.secondary:hover {

  background-color: var(--secondary-color);

  color: var(--white-color);

}



/* slider dots */



.slick-dots {

  position: absolute;

  bottom: 5rem;

  left: 0;

  width: 100%;

  display: flex;

  justify-content: center;

  gap: 1rem;

}



.slick-dots li {

  list-style: none;

}



.slick-dots li button {

  background-color: #b4b4b4;

  transition: all 0.2s ease;

  border: 0 none;

  cursor: pointer;

  height: 1rem;

  width: 1rem;

  overflow: hidden;

  border-radius: 1rem;

  text-indent: -99px;

  display: block;

  padding: 0;

}



.slick-dots li.slick-active button {

  background-color: var(--secondary-color);

  width: 6.4rem;

}



/* Header */

#header {

  background-color: #fff;

  padding: 2.6rem 0;

  border-bottom: 1px solid #ddd;

  position: relative;

  z-index: 4;

}



#header .container {

  display: flex;

  justify-content: space-between;

  align-items: center;

}



#header .site-title {

  margin: 0;

  max-width: 229px;

  width: 15.4%;

  min-width: 120px;

}



.main-navigation {

  display: flex;

  justify-content: space-between;

  align-items: center;

  flex-wrap: wrap;

  margin-left: 1.2rem;

}



.main-navigation li {

  list-style: none;

}



.menu {

  list-style: none;

  display: flex;

  gap: 5.5rem;

}



.menu .menu-item.current-menu-item>a {

  color: var(--secondary-color);

  position: relative;

}



.menu .menu-item.current-menu-item>a::after {

  content: "";

  position: absolute;

  height: 4px;

  width: calc(100% + 12px);

  left: -6px;

  bottom: -3.3rem;

  background-color: var(--secondary-color);

}



.menu-item a {

  text-decoration: none;

  color: var(--font-color);

  font-weight: 500;

  transition: color 0.3s ease;

  font-size: 2rem;

  text-transform: capitalize;

}



.menu-item a:hover {

  color: var(--secondary-color);

}



.has-submenu {

  position: relative;

}



.has-submenu .sub-menu {

  position: absolute;

  top: 100%;

  left: 0;

  width: 180px;

  background-color: white;

  display: none;

}



.has-submenu .sub-menu li a {

  display: block;

  padding: 10px;

}



/* hamburger button start */



.hamburger {

  position: relative;

  width: 3.4rem;

  height: 3.4rem;

  font-size: inherit;

  transition: all 0.3s ease;

  cursor: pointer;

  background-color: white;

  border: 0 none;

  display: none;

}



button.hamburger:hover {

  background-color: white;

}



.hamburger-line {

  position: absolute;

  right: 0;

  width: 100%;

  height: 3px;

  border-radius: 0.125em;

  background: #000000;

  transition: inherit;

}



.hamburger-line:nth-child(1) {

  top: 3px;

}



.hamburger.is-active .hamburger-line:nth-child(1),

.w-nav-button.w--open .hamburger-line:nth-child(1) {

  top: 50%;

  transform: translateY(-50%) rotateZ(-135deg);

}



.hamburger-line:nth-child(2) {

  top: 11px;

}



.hamburger.is-active .hamburger-line:nth-child(2),

.w-nav-button.w--open .hamburger-line:nth-child(2) {

  right: 50%;

  width: 0;

}



.hamburger-line:nth-child(3) {

  top: 18px;

  width: 0.625em;

}



.hamburger.is-active .hamburger-line:nth-child(3),

.w-nav-button.w--open .hamburger-line:nth-child(3) {

  top: 50%;

  width: 100%;

  transform: translateY(-50%) rotateZ(135deg);

}



/* hamburger button end */



@media (max-width: 767.98px) {

  .hamburger {

    display: block;

  }



  #header {

    position: sticky;

    left: 0;

    top: 0;

    width: 100%;

    z-index: 10;

    padding: 1.8rem;

  }



  nav.main-navigation {

    position: fixed;

    background-color: white;

    padding: 2rem;

    left: 0;

    top: 59px;

    height: calc(100vh - 59px);

    width: 100vw;

    overflow: auto;

    margin: 0;

    left: -100vw;

    transition: left 0.2s ease;

  }



  nav.main-navigation.is-active {

    left: 0;

  }



  #menu-header_menu {

    flex-direction: column;

  }



  .menu-header_menu-container {

    flex: 1;

  }



  .menu-item {

    text-align: center;

  }



  .menu-item a {

    font-size: 4rem;

  }



}



.header-actions {

  display: flex;

  align-items: center;

}



.header-actions .actions-links {

  display: flex;

  align-items: center;

  list-style: none;

}



.header-actions .actions-links>li {

  padding: 0 2.2rem;

  position: relative;

}



.header-actions .actions-links>li::after {

  content: "";

  position: absolute;

  width: 0.2rem;

  height: 15px;

  background-color: #06402B;

  right: 0;

  top: 2px;

}



.header-actions .actions-links>li:last-child {

  padding-right: 0;

}



.header-actions .actions-links>li:last-child::after {

  display: none;

}



.header-actions .actions-links a {

  text-decoration: none;

  color: var(--font-color);

  letter-spacing: 0.5px;

}



.loginDD {

  position: relative;

}



.loginDD::after {

  content: "";

  position: absolute;

  z-index: 1;

  right: -4px;

  top: 0.6rem;

  width: 1.1rem;

  height: 2rem;

  background: url(../images/arrow-down.svg) center center no-repeat;

}



.loginDD>a {

  padding-right: 16px;

  position: relative;

  font-size: 16px;

  z-index: 2;

}



.loginDD .loginLinks {

    position: absolute;

    top: 100%;

    left: 0;

    width: 100%;

    min-width: 120px;

    background-color: #fafafa;

    list-style: none;

    display: none;

    box-shadow: 0px 2px 5px rgba(0, 0, 0, .07);

}



.loginDD:hover .loginLinks {

  display: block;

}



.loginDD .loginLinks li {

  list-style: none;

}

sup {

    color: red;

    font-size: 16px;

    line-height: normal;

}

.loginDD .loginLinks a {

    display: block;

    padding: 0.6rem 1.4rem;

    font-size: 1.6rem;

    transition: all .7s;

}

.loginDD .loginLinks a:hover {

    background: #0e0eb6;

    color: #fff;

}

.account-link {

  display: flex;

  gap: 10px;

}



/* Hero Section */



.homepageSlider {

  overflow: hidden;

}



.homepageSlider .slider-item {

  background-color: #e0e0ff;

  overflow: hidden;

  /* padding: var(--section-padding);

    display: flex;

    flex-wrap: wrap;

    align-items: center;

    justify-content: space-between; */

}



.homepageSlider .slider-item .container {

  display: flex;

  padding-right: 0;

}



.hero-text {

  flex: 1;

  max-width: 650px;

  padding-top: 6.5rem;

  padding-bottom: 8.9rem;

}



.hero-text h2 {

  font-size: 7.4rem;

  color: var(--primary-color);

  font-family: var(--font-family);

  margin-bottom: 3rem;

  line-height: 1.12;

  font-weight: 600;

}



.hero-text p {

  font-size: 2.25rem;

  line-height: 1.9;

  margin-bottom: 5rem;

}



.hero-text .hero-buttons {

  margin-bottom: 2.2rem;

}



.hero-text .hero-buttons .btn {

  font-size: 2.5rem;

}



.hero-text small {

  display: block;

  font-size: 2.27rem;

  color: #666;

}



.hero-img {

  flex: 1;

  position: relative;

}



.hero-img img {

    position: relative;

    left: 0;

    width: 100%;

}



/* About Section */

.about {

  padding: var(--section-padding);

  padding-top: 7rem;

  padding-bottom: 9.7rem;

}



h2.section-title {

  font-family: var(--font-family-secondary);

  margin-bottom: 6.4rem;

}



h2.section-title strong {

  display: block;

  font-size: 4.79rem;

}



h2.section-title small {

  display: inline-block;

  font-size: 2.1rem;

  margin-bottom: 1.6rem;

}



h2.section-title .highlight {

  position: relative;

  display: inline-block;

  padding: 0 2px;

}



h2.section-title .highlight::before {

  content: "";

  position: absolute;

  z-index: 1;

  width: 100%;

  bottom: 0;

  left: 0;

  height: 50%;

  background: #dfdfff;

}



h2.section-title .highlight span {

  position: relative;

  z-index: 2;

}



.features {

  display: flex;

  /* flex-wrap: wrap; */

  gap: 4rem;

  justify-content: space-between;

}



.features article {

  flex: 1 1 30%;

  background-color: #fff;

  padding: 5.6rem 3rem 3.2rem;

  border-radius: 1.5rem;

  text-align: center;

  box-shadow: 0px 7px 14px #72727229;

  border: 1px solid #3C3CB7;

  display: flex;

  flex-direction: column;

  align-items: center;

}



.features article .highlight-icon {

  margin-bottom: 3rem;

  height: 75px;

  width: 75px;

}



.features article h3 {

  font-family: var(--font-family-secondary);

  font-size: 3.4rem;

  margin-bottom: 3rem;

  width: 78%;

}



.features article p {

  line-height: 3.3rem;

  margin-bottom: 5.5rem;

  flex: 1;

  text-align: justify;

}



.highlight {

  color: var(--primary-color);

}



a.arrowLink {

  position: relative;

  padding-right: 32px;

  color: var(--secondary-color);

  text-decoration: underline;

  font-size: 2rem;

}



a.arrowLink::after {

  content: "";

  position: absolute;

  height: 100%;

  width: 24px;

  right: 0;

  top: 0;

  background: url(../images/icon-arrow-right.svg) right center no-repeat;

}



/* How It Works */

.how-it-works {

  /* padding: var(--section-padding);

    background-color: #fff;

    display: flex;

    flex-wrap: wrap;

    gap: 2rem;

    align-items: flex-start;

    justify-content: space-between; */

  overflow: hidden;

  border-top: solid 1px var(--border-color);

  border-bottom: solid 1px var(--border-color);

}



.how-it-works .container {

  display: flex;

  padding-right: 0;

}



.how-it-works .content {

  background-color: white;

  padding: 5.6rem 5rem 2.2rem 0;

  width: calc(46% + 2px);

}



.how-it-works h2.section-title {

  font-size: 4.94rem;

  margin-bottom: 6.6rem;

  font-family: var(--font-family-secondary);

}



.workItem-list {

  list-style: none;

}



.workItem {

  display: flex;

  gap: 3rem;

  margin-bottom: 3.2rem;

  align-items: flex-start;

}



.workItem-icon {

  width: 5.6rem;

}



.workItem-content {

  flex: 1;

}



.workItem-content h3 {

  font-family: var(--font-family);

  font-size: 2.5rem;

  line-height: 1.4;

  margin-bottom: 1.3rem;

}



.workItem-content p {

  font-size: 1.8rem;

  max-width: 82%;

  text-align: justify;

  line-height: 1.4;

}



.how-it-works .container .image-container {

  position: relative;

  flex: 1;

}



.how-it-works .container .image-container img {

    object-fit: cover;

    height: 100%;

}



/* Highlights */

.highlights {

  padding: var(--section-padding);

  padding-top: 6rem;

  padding-bottom: 6.5rem;

}



.highlights .section-title {

  text-align: center;

  margin-bottom: 2.4rem;

  font-family: var(--font-family-secondary);

}



.highlights .section-title strong {

  font-size: 4.64rem;

}



.highlights .title-text {

  margin: 0 auto;

  max-width: 53%;

  text-align: center;

  margin-bottom: 6rem;

}



.highlights .title-text p {

  line-height: 1.6;

}



.highlight-features {

  display: grid;

  grid-template-columns: repeat(auto-fit, minmax(245px, 1fr));

  gap: 3.2rem;

  padding: 1rem 0px;

}



.highlightItem {

  display: flex;

  flex-direction: column;

  padding: 3rem 3.4rem 1rem;

  position: relative;

}



.highlightItem::after {

  content: "";

  position: absolute;

  height: 100%;

  width: 2px;

  top: 0;

  right: -1.8rem;

  background-color: var(--border-color);

}



.highlightItem:last-child::after {

  display: none;

}



.highlightItem-icon {

  margin-bottom: 2.8rem;

}



.highlightItem-icon img {

  width: 5.6rem;

  object-fit: contain;

}



.highlightItem h3 {

  font-family: var(--font-family);

  font-size: 1.95rem;

  font-weight: 500;

  margin-bottom: 1.5rem;

}



.highlightItem p {

  font-size: 1.5rem;

  line-height: 1.7;

}



/* Footer */

footer {

  background: #F5F5F5;

  color: var(--font-color);

  text-align: center;

  padding: 2.6rem 1rem 2.4rem;

  font-size: 1.98rem;

}





/* Responsive Styles */



@media  (min-width: 768px) and (max-width: 1500px) {

    .slick-slide img {

      left: 15px;

      width: auto;

      margin-top: 3rem;

  }

}



@media (max-width: 991.98px) {

  .features {

    gap: 3rem;

  }



  .about {

    padding-bottom: 6rem;

  }

}



@media  (min-width: 768px) and (max-width: 991.98px) {



  .hero-text h2{ font-size: 6rem;}

  .hero-text p{font-size: 2rem;}





}



@media (max-width: 767.98px) {



  .homepageSlider .slider-item .container {

    flex-direction: column;

  }



  .hero-img {

    display: flex;

    justify-content: center;

  }



  .hero-img img {

    width: 50%;

    min-width: 320px;

    position: static;

  }



  .hero-text {

    order: 2;

    max-width: 100%;

    text-align: center;

  }



  .hero-buttons {

    flex-direction: column;

    align-items: center;

  }





  .features {

    flex-direction: column;

    gap: 4rem;

  }



  .how-it-works .container {

    flex-direction: column;

  }



  .how-it-works .content {

    width: 100%;

    order: 2;

    padding-right: 0;

  }



  .how-it-works .container .image-container {

    display: flex;

    justify-content: center;

    padding-top: 6rem;

  }



  .how-it-works .container .image-container img {

    width: 50%;

    min-width: 320px;

    max-width: 100%;

    min-height: 0;

  }



  .highlightItem p {

    font-size: 1.8rem;

  }



  .highlights .title-text {

    max-width: 100%;

  }



  .highlightItem::after {

    display: none;

    bottom: -1.8rem;

    top: auto;

    left: 0;

    right: auto;

    width: 100%;

    height: 2px;

  }



}



@media (max-width: 480px) {



  .loginDD .account-link span {display: none;}



  .header-actions {

    flex-direction: column;

    gap: 0.5rem;

  }



  .highlightItem {

    flex-direction: column;

    align-items: center;

    text-align: center;

  }



  .hero-text h2 {

    font-size: 4.75rem;

  }



  .highlightItem {

    text-align: center;

    align-items: center;

  }



  .highlight-features {

    grid-template-columns: repeat(auto-fit, minmax(100%, 1fr));

  }



}





/* About Page Styles */



.about-hero {

  background-position: center center;

  background-repeat: no-repeat;

  background-size: cover;

  color: white;

  text-align: center;

  padding: 6rem 1rem 3rem;

  min-height: 450px;

  display: flex;

  justify-content: center;

  align-items: center;

}



.about-hero h1 {

  font-size: 6rem;

  font-weight: bold;

  margin-bottom: 0.8rem;

  margin-top: 0.8rem;

}



.about-hero .breadcrumb {

  color: #eee;

  font-size: 2.1rem;

}



.about-hero .breadcrumb a {

  color: var(--white-color);

  text-decoration: none;

}



.about-hero .breadcrumb a:hover {

  text-decoration: underline;

}



.about-intro {

  padding: var(--section-padding);

  padding-top: 5.8rem;

  padding-left: 2.4rem;

  padding-bottom: 6.5rem;

}



.about-intro h2 {

  font-size: 5.8rem;

  margin-bottom: 3.5rem;

  line-height: 1.37;

}



.about-intro small {

  font-size: 2.2rem;

  display: block;

  font-weight: normal;

  margin-bottom: 1rem;

}



.about-intro span {

  display: block;

  color: var(--secondary-color);

}



.about-main-img {

  padding-bottom: 0.3rem;

  margin-bottom: 4.5rem;

}



.about-intro p {

  text-transform: capitalize;

}



.agreement-section {

  background-color: #f4f3fb;

  padding: var(--section-padding);

  padding-top: 5.6rem;

  padding-bottom: 5.4rem;

}



.agreement-grid {

  display: flex;

  flex-wrap: wrap;

  gap: 7.6rem;

  padding-left: 3rem;

}



.agreement-image {

  width: 47.2%;

}



.agreement-text {

  flex: 1;

  min-width: 280px;

  padding-top: 1.5rem;

  padding-right: 2.5rem;

}



.agreement-text h3 {

  font-size: 4.8rem;

  margin-bottom: 2.8rem;

}



.agreement-text p,

.agreement-text li {

  font-size: 1.8rem;

  line-height: 1.7;

  text-transform: capitalize;

}



.agreement-text ul {

  margin: 0;

  padding-left: 0;

  list-style: none;

  padding-top: 1rem;

  padding-bottom: 0.2rem;

}



.agreement-text li {

  position: relative;

  padding-left: 5.3rem;

  font-size: 2rem;

  line-height: 1.66;

  margin-bottom: 2.3rem;

}



.p-20 {

  font-size: 2rem !important;

}



.agreement-text li::before {

  content: '';

  background: url(../images/listStyle-icon.svg) no-repeat;

  background-size: contain;

  width: 2.8rem;

  height: 2.8rem;

  position: absolute;

  left: 0;

  top: 0.5rem;

  ;

}



.legal-link {

  padding-top: 1.8rem;

}



.legal-link a {

  color: var(--secondary-color);

  text-decoration: underline;

  font-weight: 500;

  font-size: 2.45rem;

}



.moveout-consent {

  background-color: #fff;

  padding: var(--section-padding);

  padding-left: 0;

  padding-right: 0;

  padding-top: 5rem;

  padding-bottom: 7.6rem;

}



.moveout-consent .container {

  padding: 0 4rem;

}

.custom_moveout .container {display: flex;align-items: center;justify-content: space-between;}

.moveout-consent h2 {

  font-size: 5.9rem;

  margin-bottom: 4.4rem;

  line-height: 1.35;

  letter-spacing: -0.5px;

}



.moveout-image {

  display: flex;

  min-height: 682px;

}



.moveout-image img {

  object-fit: cover;

}



.consent-form-container {

  margin-top: -27.5rem;

  margin-bottom: 7rem;

  position: relative;

    display: flex;

    justify-content: flex-end;

}



.consent-form-wrapper {

  /* display: flex;

  justify-content: flex-end; */

  margin-bottom: 2rem;

}



.consent-form {

  display: grid;

  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));

  row-gap: 2.4rem;

  column-gap: 2.2rem;

  background-color: #fff;

  padding: 5.2rem 5.5rem 2.7rem;

  border-radius: 14px;

  box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);

  width: 100%;

  max-width: 1024px;

}



.consent-form .formCol {

  display: flex;

  flex-direction: column;

}



.consent-form .formCol > p{margin: 0;}



.consent-form .formCol:last-child {

  grid-column: 1 / -1;

  display: flex;

  align-items: center;

  justify-content: center;

  padding-top: 0.5rem;

}



.consent-form .formCol label {

  font-size: 1.6rem;

  margin-bottom: 0.7rem;

  display: block;

}



.wpcf7-form-control-wrap{display: block;}



.consent-form input {

  padding: 1.45rem 1.75rem;

  font-size: 1.5rem;

  border: 1px solid #ccc;

  border-radius: 6px;

  max-width: 100%;

  outline: none;

  width: 100%;

}



.consent-form [type="submit"].btn {

  padding: 1.85rem 7rem 1.75rem 7rem;

  color: var(--white-color);

  border: solid 1px var(--border-color);

  background-color: var(--secondary-color);

  border-radius: 35px;

  font-size: 1.9rem;

  letter-spacing: 1.2px;

  cursor: pointer;

}



.moveout-consent p {

  font-size: 2rem;

  margin-bottom: 1.6rem;

  line-height: 1.9;

  text-transform: capitalize;

}



.consent-items {

  list-style: none;

  padding-top: 1rem;

}



.consent-items li {

  position: relative;

  padding-left: 4rem;

  font-size: 2rem;

  line-height: 1.66;

  margin-bottom: 1.7rem;

  text-transform: capitalize;

}



.consent-items li::before {

  content: '';

  background: url(../images/listStyle-icon.svg) no-repeat;

  width: 2.1rem;

  height: 2.1rem;

  position: absolute;

  left: 0;

  top: 0.5rem;

  background-size: contain;

}

#myForm br{display:none;}

#myForm input[type="text"], #myForm input[type="email"], #myForm input[type="password"] {height: 50px; outline: none;}







/* Customizing Css */



.login-container .input-group input {

    height: 50px;

}

.login-container .input-group label {

    font-weight: 500;

}

.login-container h2 {

    font-family: var(--font-family-secondary);

    font-size: 3.5rem;

}

.login-container button {

    padding: 14px 50px;

}

.login-container {

    padding: 30px;

    box-shadow: 0px 1px 8px rgba(0, 0, 0, .1);

    width: 600px;

    text-align: center;

    margin: 40px auto;

    border-bottom: 7px solid #1b197d;

    border-radius: 10px;

    background: #f9f9f9;

}



h2{margin-bottom:20px;color:#333}

.input-group{margin-bottom:15px;text-align:left}

.input-group label{display:block;margin-bottom:5px;color:#555}

.input-group input{width:100%;padding:10px;border:1px solid #ccc;border-radius:4px;font-size:14px}

.input-group input:focus{border-color:#007bff;outline:0}

button{width:100%;padding:12px;background-color:#007bff;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:16px}

button:hover{background-color:#0056b3}

.signup{margin-top:15px;font-size:14px}

.signup a{text-decoration:none;color:#007bff}

.signup a:hover{text-decoration:underline}



.custom-user-left {

    margin: 0;

    padding: 30px;

    border: 1px solid #ccc;

    border-radius: 10px;

    background: #f9f9f9;

}







#myForm label{display:block;margin-bottom:6px;font-weight:500;color:#333}

#myForm input[type=email],#myForm input[type=password],#myForm input[type=text]{width:100%;padding:10px;margin-bottom:20px;border:1px solid #ccc;border-radius:6px;box-sizing:border-box}

#myForm input[type=submit]{background-color:#007bff;color:#fff;border:none;padding:12px;width:100%;border-radius:6px;cursor:pointer;font-size:16px}

#myForm input[type=submit]:hover{background-color:#0056b3}

#myForm {

    display: grid;

    grid-template-columns: 4fr 2fr;

    column-gap: 30px;

    max-width: 1320px;

    margin: 40px auto;

    align-items: start;

}







.checkout-box {

    padding: 30px;

    border: 1px solid #ccc;

    border-radius: 10px;

    background: #f9f9f9;

    max-height: 350px;

}

.checkout-box h1 {

    font-family: var(--font-family-secondary);

    font-size: 2.5rem;

    margin-bottom: 2rem;

}

.apply-code input {

    padding: 10px;

    margin-bottom: 20px;

    border: 1px solid #ccc;

    border-radius: 0;

    height: 45px;

    border-radius: 6px;

    flex: 0 0 70%;

}

.apply-code button {

    flex: 0 0 28%;

    height: 45px;

}

.sub-total.cart-total {

    border-bottom: 0;

}

.sub-total,.coupon-code {

    display: flex;

    align-items: center;

    justify-content: space-between;

    border-bottom: 1px solid #ccc;

    margin-bottom: 1.8rem;

}

.apply-code {

    display: flex;

    justify-content: space-between;

    border-bottom: 1px solid #ccc;

    margin-bottom: 1.8rem;

}



@media (max-width:1199px){

.custom-user-box {max-width: fit-content;}     

}

@media (max-width:991px){

.custom-user-box {max-width: 95%; display: block; width: 100%;}  

.checkout-box { max-height: inherit; margin-top: 20px;}

}

@media (max-width:767px){

.login-container {

    width: 88%;

} 

.hero-text h2 {

    font-size: 4.3rem;

}

.contact-box {

    padding: 3.5rem!important;

        margin-top: 0!important;

}

.contact-form .page-title strong {

    font-size: 4rem!important;

}

.about-intro {

    padding-left: 0;

}

}







/* Responsive Fixes */

@media (max-width: 1023.98px) {

  .consent-form-wrapper{width: 100%;}

  .consent-form-container {

      display: flex;

      justify-content: flex-start;

  }

}



@media (max-width: 768px) {



  .about-hero {

        min-height: inherit;

        height: 300px;

  }



  .agreement-grid {

    flex-direction: column;

  }



  .agreement-image {

    width: 100%;

  }



  .consent-form {

    grid-template-columns: 1fr;

  }



  .consent-form button {

    grid-column: span 1;

  }



  .moveout-image {

    min-height: auto;

  }



  .consent-form-container {

    margin-top: -2.5rem;

  }



  .about-intro p,

  .agreement-text p,

  .agreement-text li {

    font-size: 1.8rem;

  }



}







@media (max-width: 480px) {

  .about-hero h1 {

    font-size: 4rem;

  }

    .about-hero {

        min-height: inherit;

    }

  .about-intro h2,

  .moveout-consent h2 {

    font-size: 4.5rem;

  }



  .agreement-text h3 {

    font-size: 3.5rem;

  }



  .consent-form {

    padding: 4rem 2.5rem;

  }

}



/* Contact Page CSS */



.contact-section {

  display: flex;

  gap: 6.5rem;

  max-width: 1620px;

  margin: 0 auto;

  padding: var(--section-padding);

  padding-top: 6.6rem;

}



.contact-form {

  width: 50%;

}



.contact-form .page-title {

  margin-bottom: 3.5rem;

}



.contact-form .page-title small {

  color: var(--secondary-color);

  font-size: 2.2rem;

  margin-bottom: 0.5rem;

  display: block;

  font-weight: 400;

}



.contact-form .page-title strong {

  display: block;

  font-size: 7rem;

  font-weight: 500;

  line-height: 1.2;

}



.contact-form form {

  display: grid;

  grid-template-columns: repeat(2, 1fr);

  row-gap: 2rem;

  column-gap: 3rem;

}



.contact-form form .fullWidth {

  grid-column: 1 / -1;

}



.contact-form form label {

  font-size: 1.7rem;

  margin-bottom: 0.5rem;

  display: block;

}



.contact-form form input,

.contact-form form textarea {

  width: 100%;

  padding: 2.1rem 1.8rem;

  font-size: 1.5rem;

  border: 1px solid var(--border-color);

  border-radius: 0.6rem;

  outline: none;

  font-family: var(--font-family);

}



.contact-form form textarea {

  height: 13.8rem;

  display: block;

}



.contact-form form p {

  margin: 0 0 0.6rem;

}



.contact-form form p small {

  font-size: 1.3rem;

  display: block;

  line-height: 1.4;

  padding-right: 2.7rem;

}



.contact-form [type="submit"] {

  padding: 2.15rem 4rem 1.75rem 4rem;

  color: var(--white-color);

  border: solid 1px var(--secondary-color);

  background-color: var(--secondary-color);

  border-radius: 35px;

  font-size: 1.7rem;

  letter-spacing: 1.2px;

  cursor: pointer;

  width: auto;

}



.contact-box {

  flex: 1;

  background-color: #1b197d;

  color: var(--white-color);

  padding:5.8rem 6.2rem 5.8rem 5rem;

  border-radius: 2rem;

  display: flex;

  flex-direction: column;

  margin-top: 3.3rem;

}



.contact-box h3 {

  font-size: 3.9rem;

  font-weight: 400;

  margin-bottom: 2.6rem;

}



.contact-box p {

  font-size: 1.8rem;

  line-height: 1.7;

}

.rental-info p {



}

.rental-info .comment_info p {

    text-overflow: ellipsis;

    overflow: hidden;

    display: -webkit-box;

    -webkit-line-clamp: 2;

    -webkit-box-orient: vertical;

    background: #fff;

    font-size: 15px;

    line-height: 25px;

}

.section-divider {

  height: 1px;

  background-color: var(--white-color);

  opacity: 0.2;

  margin: 3rem 0;

}



.customercare-info {

  padding-top: 0.4rem;

}



.customercare-info h4 {

  font-size: 2.5rem;

  font-weight: 400;

  margin-bottom: 2rem;

}



.contact-info {

  display: flex;

  align-items: flex-start;

  gap: 1rem;

  margin: 0 0 1.6rem;

  flex-direction: column;

}



.contact-info i {

  font-size: 1.6rem;

  line-height: 1;

}



.contact-info i.contact-phone {

  margin: 0.9rem 0 0.4rem;

}



.contact-info i.contact-map-marker {

  margin: 0.5rem 0 0.3rem;

}



.contact-info a,

.contact-info p {

  color: var(--white-color);

  font-size: 2rem;

  line-height: 1.6;

  word-break: break-word;

  margin-bottom: 0;

  text-decoration: none;

}





@media (max-width: 991.98px) {

  .contact-section {

    gap: 4rem;

    flex-direction: column;

  }



  .contact-form {

    width: 100%;

  }



  .contact-form form p small {

    font-size: 1.6rem;

  }

}



@media (max-width: 767.98px) {



  .contact-form form {

    grid-template-columns: 1fr;

  }

.price-plan-box {

    grid-template-columns: repeat(1, 1fr);

}

.price-plan-info-box {

    margin-bottom: 20px;

}

.price-plan-info {

    min-height: inherit;

}

}











/* Search page styles */



.search-section {

  padding: var(--section-padding);

  font-family: var(--font-family);

  max-width: var(--container-width);

  margin: 0 auto;

  text-align: center;

  color: var(--font-color);

  padding-top: 5.4rem;

}



.search-header {

  padding-bottom: 3rem;

}



.search-header h1.page-title {

  font-size: 4.1rem;

  font-weight: 500;

  margin-bottom: 1.7rem;

}



.search-header h1.page-title span {

  color: var(--secondary-color);

}



.search-header p {

  font-size: 1.8rem;

}



.search-form {

  display: flex;

  justify-content: center;

  align-items: center;

  gap: 1rem;

}



.searchBox {

  border: 2px solid var(--border-color-dark);

  border-radius: 4rem;

  overflow: hidden;

  background-color: white;

  padding: 1px;

  display: flex;

  height: 8rem;

  max-width: 850px;

  width: 100%;

}



.search-form input {

  flex: 1;

  padding: 1.2rem 3.5rem;

  border: 0 none !important;

  font-size: 1.6rem;

  border-radius: 3rem;

}



.search-form input:hover,

.search-form input:focus {

  border: 0 none;

  outline: none;

}



.search-form button {

  padding: 1.2rem 6.4rem;

  background-color: var(--secondary-color);

  color: var(--white-color);

  border: none;

  border-radius: 4rem;

  font-size: 1.6rem;

  cursor: pointer;

}



.search-divider {

  margin: 4rem 0 2rem;

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 1rem;

  color: var(--font-color);

}



.search-results {

  margin-top:6rem;

  border-top: solid 2px var(--border-color-dark);

  position: relative;

}



.search-results .result-title {

  transform: translateY(-52%);

  text-align: center;

}



.search-results .result-title span {

  padding: 2px 4px;

  background-color: white;

}

.popup .content p {

    font-size: 14px;

    line-height: 28px;

}



.result-found {

  padding: 0;

}



.search-results .result-count {

  text-align: left;

  font-size: 1.8rem;

  margin-bottom: 2.7rem;

}

.gallery-image img {

    max-height: 225px;

    min-height: 225px;

        width: 100%;

    object-fit: cover;

}

.comment_info {

    margin-top: 14px;

}



.comment_info strong {

    font-size: 16px;

}

/*.search-results .result-List {*/

/*    display: grid;*/

/*    justify-content: space-between;*/

/*    grid-template-columns: repeat(auto-fit, minmax(1rem, 32rem));*/

/*    gap: 2rem;*/

/*}*/

.search-results .result-List {

    display: grid;

    justify-content: space-between;

    grid-template-columns: repeat(4, 1fr);

    gap: 2rem;

}

.result-card {

  padding: 2.9rem 2rem;

  border: 1px solid var(--border-color-dark);

  border-radius: 1rem;

  text-align: center;

  font-size: 1.4rem;

  background-color: var(--white-color);

  box-shadow: 0 0.2rem 0.5rem rgba(0, 0, 0, 0.05);

  display: flex;

  flex-direction: column;

  align-items: center;

}



.result-card .userImg {

  height: 7rem;

  width: 7rem;

  border-radius: 50%;

  overflow: hidden;

  margin-bottom: 1.6rem;

}



.result-card img {

  object-fit: cover;

}



.result-card h3 {

  font-size: 1.8rem;

  margin-bottom: 0.8rem;

  font-weight: 400;

}



.rating span {

  color: #ffc107;

  font-size: 1.4rem;

}



.rating-text {

  color: #17A974;

  font-weight: 500;

  font-size: 1.6rem;

  margin: 0;

}



.review {

  margin-top: 1rem;

  font-size: 1.2rem;

  line-height: 1.6;

}



/* No Result Found CSS */

.no-result-found {

  padding: 5.4rem 0;

  display: flex;

  flex-direction: column;

  align-items: center;

}



.no-result-found .no-resultImg {

  margin-bottom: 2.4rem;

}



.no-result-found p {

  font-size: 2.9rem;

}



@media (max-width: 768px) {



  .searchBox {

    height: 6rem;

  }



  .search-form {

    flex-direction: column;

  }



  .search-form input {

    width: 100%;

  }



  .search-form button {

    padding: 1.2rem 4rem;

  }



  .result-card {

    margin: 0 auto;

  }

}



body.menu-open {

  overflow: hidden;

}



.form-header{display: flex;}

.form-header h2{flex: 1; font-size: 3rem; margin: 0;}



.custom-modal {

  display: none;

  position: fixed;

  inset: 0;

  z-index: 9999;

  overflow: auto;

}



.custom-modal-backdrop {

  position: fixed;

  inset: 0;

  background: rgba(0, 0, 0, 0.5);

}



.custom-modal-content {

  position: relative;

  background: #fff;

  margin: 2% auto;

  padding: 2rem;

  max-width: 900px;

  width: 80%;

  border-radius: 8px;

  z-index: 1;

  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);

  animation: fadeIn 0.3s ease;

}

.modal-close-btn {

    background: #0e0eb6;

    border: none;

    cursor: pointer;

    border-radius: 50px;

    height: 40px;

    width: 40px;

    display: flex;

    align-items: center;

    justify-content: center;

    padding: 0;

}

.modal-close-btn svg {

    filter: invert(1);

}

.modal-close-btn:hover{

  background-color: #000 !important;

}



@keyframes fadeIn {

  from { opacity: 0; transform: translateY(-10px); }

  to   { opacity: 1; transform: translateY(0); }

}



.custom-modal-content .consent-form-container{

  margin: 0;

  justify-content: normal;

  padding-top: 2.5rem;

}



.custom-modal-content .consent-form [type="submit"].btn{width: auto;}



.custom-modal-content .consent-form-container .consent-form{

  box-shadow: 0 0 0 0;

  padding: 0;

}



.consent-form textarea {

    padding: 2.05rem 1.75rem;

    font-size: 1.5rem;

    border: 1px solid #ccc;

    border-radius: 6px;

    max-width: 100%;

}



select{

  position: relative;

  appearance: none;

  /* Standard */

  -webkit-appearance: none;

  /* Safari & Chrome */

  -moz-appearance: none;

  /* Firefox */

  background-color: #fff;

  border: 1px solid #ccc;

  /* space for arrow */

  font-size: 1rem;

  color: #333;

  width: 100%;

  cursor: pointer;

  background-image: url("data:image/svg+xml;utf8,<svg fill='black' height='11.115' viewBox='0 0 18 11.115' width='18' xmlns='http://www.w3.org/2000/svg'><path d='M11.115,12.885,18,19.755l6.885-6.87L27,15l-9,9L9,15Z' transform='translate(-9 -12.885)'/></svg>");

  background-repeat: no-repeat;

  background-position: right 1rem center;

  background-size: 1rem;

  padding: 1.55rem 1.75rem;

  padding-right: 3rem;

  font-size: 1.5rem;

  border-radius: 6px;

  outline:none;

}



body button{width: auto;}



.rental-info p{font-size: 16px; margin: 0; line-height: 1.3; margin-bottom: 8px; word-break: break-all;}

.rental-info p strong{display: block;}



.rental-info .button {

    text-decoration: none;

    transition: all 0.3s ease-out;

    padding: 0.8rem 0;

    background-color: var(--secondary-color);

    color: var(--white-color);

    border: none;

    border-radius: 4rem;

    font-size: 14px;

    cursor: pointer;

    margin-top: 14px;

    display: block;

}

.rental-info .button:hover {

  background: #0056b3;

}



.overlay {

  position: fixed;

  top: 0;

  bottom: 0;

  left: 0;

  right: 0;

  background: rgb(0 0 0 / 85%);

  transition: opacity 500ms;

  visibility: hidden;

  opacity: 0;

}

.overlay:target {

  visibility: visible;

  opacity: 1;

}



.popup {

  margin: 70px auto;

  padding: 20px;

  background: #fff;

  border-radius: 5px;

  width: 50%;

  position: relative;

  transition: all 5s ease-in-out;

}

.gallery-image-box {

    display: grid;

    column-gap: 10px;

    grid-template-columns: repeat(3, 1fr);

}

.gallery-image {

    margin: 0 0 12px;

}

.popup .close {

    position: absolute;

    top: -20px;

    right: -20px;

    transition: all 200ms;

    font-size: 28px;

    font-weight: bold;

    text-decoration: none;

    color: #ffffff;

    background: #0056b3;

    width: 44px;

    border-radius: 40px;

    height: 44px;

        line-height: 40px;

}

.popup .content {

    text-align: left;

}

.popup .content::-webkit-scrollbar{width:9px}

.popup .content::-webkit-scrollbar-track{background:#fff;border:1px solid #d6d6d6;border-radius:10px}

.popup .content::-webkit-scrollbar-thumb{background-color:#ccc;border-radius:6px}

.popup .content{max-height:440px;overflow:hidden;overflow-y:auto}





.popup h4 {

    font-size: 3rem;

    font-weight: 500;

    margin-bottom: 1.7rem;

    text-align: left;

}

.plan-wrapper {padding: var(--section-padding);padding-top: 7rem;padding-bottom: 9.7rem;}

.price-plan-box {display: flex;gap: 4rem;justify-content: space-between;}

.price-plan-box .price-plan-info-box {flex: 1 1 30%;background-color: #fff;padding: 3rem 1rem;border-radius: 1.5rem;text-align: center;box-shadow: 0px 7px 14px #72727229;border: 1px solid #3C3CB7;display: flex;gap: 2rem;flex-direction: column;align-items: center;}

.price-plan-box .price-plan-info-box .price-plan-info{display: grid;gap: 1rem;}

.price-plan-box .price-plan-info-box .price-plan-info figure{width:50px;margin:0 auto;}

.price-plan-box .price-plan-info-box .price-plan-info figure img{width:100%;}

.price-plan-box .price-plan-info-box .price-plan-info h4{font-family: var(--font-family-secondary);font-size: 3rem;}

.price-plan-box .price-plan-info-box .price-plan-info p{font-size: 1.6rem;line-height:1.4;}

.price-plan-box .static-content ul {  display: grid;gap: 1.2rem;  margin: 0;  padding: 0;  list-style: none;font-size: 1.5rem;}

.price-plan-box .static-content ul li {  display: flex;gap: 0.5rem;  align-items: center;  margin: 0;  padding: 0;}

.price-plan-box .static-content ul li span {  width: 2rem;}

.price-plan-box .static-content ul li span img{width:80%;}