.background-child {
  width: 1920px;
  height: 595px;
  position: relative;
  background-color: var(--color-forestgreen);
  display: none;
  max-width: 100%;
}
.facebook {
  align-self: stretch;
  position: relative;
  z-index: 1;
}
.facebook-wrapper {
  width: 17px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  padding: var(--padding-220xl) 0 0;
  box-sizing: border-box;
}
.facebook1,
.logo-icon {
  position: relative;
  z-index: 1;
}
.logo-icon {
  width: 345px;
  max-height: 100%;
  object-fit: contain;
  mix-blend-mode: normal;
  max-width: 100%;
}
.facebook1 {
  display: inline-block;
  min-width: 91px;
}
.facebook-parent {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  padding: 0 var(--padding-mid) 0 0;
  font-family: var(--h2);
}
.twitter,
.twitter1 {
  position: relative;
  z-index: 1;
}
.twitter {
  width: 17px;
  display: inline-block;
  flex-shrink: 0;
}
.twitter1 {
  flex: 1;
  font-family: var(--h2);
}
.social-media-links {
  flex: 1;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: flex-start;
  gap: var(--gap-7xs);
  min-width: 75px;
}
.instagram,
.linked-in {
  position: relative;
  z-index: 1;
}
.instagram {
  width: 18px;
  display: inline-block;
  flex-shrink: 0;
}
.linked-in {
  flex: 1;
  font-family: var(--h2);
}
.social-media-links1 {
  flex: 1;
  flex-direction: row;
  gap: var(--gap-7xs);
  min-width: 75px;
}
.content,
.footer-container,
.footer-links,
.social-media-links1 {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
}
.footer-links {
  align-self: stretch;
  flex-direction: row;
  gap: var(--gap-xs);
}
.content,
.footer-container {
  max-width: 100%;
}
.footer-container {
  flex: 1;
  flex-direction: column;
  gap: var(--gap-mid);
  min-width: 235px;
}
.content {
  width: 385px;
  flex-direction: row;
  gap: var(--gap-6xs);
  min-width: 385px;
}
.about-solar4africa {
  margin: 0;
  position: relative;
  font-size: inherit;
  line-height: 40px;
  text-transform: capitalize;
  font-weight: 700;
  font-family: inherit;
  z-index: 1;
}
.african-based-green {
  align-self: stretch;
  position: relative;
  font-size: var(--tagline-size);
  line-height: 28px;
  color: var(--color-gray);
  z-index: 1;
}
.about-solar4africa-parent {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: var(--gap-6xl);
  min-width: 283px;
  max-width: 100%;
}
.subscribe-to-our {
  margin: 0;
  position: relative;
  font-size: inherit;
  line-height: 40px;
  text-transform: capitalize;
  font-weight: 700;
  font-family: inherit;
  z-index: 1;
}
.subscribe-to-our-newsletter-wrapper {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: flex-start;
  padding: 0 var(--padding-12xs);
  box-sizing: border-box;
  max-width: 100%;
}
.subscribe-email-and {
  align-self: stretch;
  position: relative;
  line-height: 28px;
  z-index: 1;
}
.bar-child {
  height: 60px;
  width: 440px;
  position: relative;
  border-radius: var(--br-11xl);
  border: 2px solid var(--color-darkgray-200);
  box-sizing: border-box;
  display: none;
  max-width: 100%;
}
.enter-your-email {
  position: relative;
  text-transform: capitalize;
  z-index: 1;
}
.email-input {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  padding: var(--padding-base) 0 0;
}
.button-icon {
  height: 50px;
  width: 50px;
  position: relative;
  z-index: 2;
}
.bar {
  align-self: stretch;
  border-radius: var(--br-11xl);
  border: 2px solid var(--color-darkgray-200);
  box-sizing: border-box;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: space-between;
  padding: var(--padding-11xs) var(--padding-6xs) var(--padding-11xs)
    var(--padding-14xl);
  max-width: 100%;
  gap: var(--gap-xl);
  z-index: 1;
}
.frame-group,
.newsletter-details {
  flex-direction: column;
  justify-content: flex-start;
}
.newsletter-details {
  align-self: stretch;
  display: flex;
  align-items: flex-start;
  gap: var(--gap-lgi);
  max-width: 100%;
  font-size: var(--tagline-size);
  color: var(--color-gray);
}
.frame-group {
  flex: 1;
  gap: var(--gap-6xl);
  min-width: 286px;
}
.container-inner,
.frame-group,
.frame-parent {
  display: flex;
  align-items: flex-start;
  max-width: 100%;
}
.frame-parent {
  align-self: stretch;
  flex-direction: row;
  justify-content: flex-start;
  gap: var(--gap-23xl);
}
.container-inner {
  width: 917px;
  flex-direction: column;
  justify-content: flex-end;
  padding: 0 0 var(--padding-8xs);
  box-sizing: border-box;
  min-width: 917px;
  font-size: var(--font-size-3xl);
  color: var(--color-white);
  font-family: var(--h2);
}
.container {
  width: 1400px;
  display: flex;
  flex-direction: row;
  align-items: flex-end;
  justify-content: space-between;
  max-width: 100%;
  gap: var(--gap-xl);
}
.phone-no-child {
  height: 98px;
  width: 440px;
  position: relative;
  border-radius: var(--br-61xl);
  background-color: var(--color-orange);
  display: none;
  max-width: 100%;
}
.icon {
  height: 74px;
  width: 74px;
  position: relative;
  z-index: 1;
}
.email-address,
.phone-no1 {
  position: relative;
  display: inline-block;
  min-width: 96px;
  z-index: 1;
}
.email-address {
  font-size: var(--tagline-size);
  min-width: 116px;
}
.address-container,
.contact-location {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.address-container {
  justify-content: flex-start;
  gap: var(--gap-5xs);
}
.contact-location {
  justify-content: flex-end;
  padding: 0 0 var(--padding-3xs);
}
.location-child,
.phone-no {
  border-radius: var(--br-61xl);
  background-color: var(--color-orange);
  max-width: 100%;
}
.phone-no {
  flex: 0.9598;
  display: flex;
  flex-direction: row;
  align-items: flex-end;
  justify-content: flex-start;
  padding: var(--padding-2xs) var(--padding-mid) var(--padding-smi);
  box-sizing: border-box;
  gap: var(--gap-sm);
  min-width: 330px;
  z-index: 1;
}
.location-child {
  height: 98px;
  width: 440px;
  position: relative;
  display: none;
}
.icon1 {
  height: 74px;
  width: 74px;
  position: relative;
  z-index: 1;
}
.decora-street-valencia {
  align-self: stretch;
  position: relative;
  line-height: 28px;
  z-index: 1;
}
.decora-street-valencia-mbomb-wrapper {
  width: 296px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  padding: var(--padding-xs) 0 0;
  box-sizing: border-box;
}
.background-item,
.location {
  border-radius: var(--br-61xl);
  background-color: var(--color-orange);
  max-width: 100%;
}
.location {
  flex: 0.9598;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: flex-start;
  padding: var(--padding-2xs) var(--padding-mid) var(--padding-smi);
  box-sizing: border-box;
  gap: var(--gap-mid);
  min-width: 330px;
  z-index: 1;
  font-size: var(--tagline-size);
}
.background-item {
  height: 98px;
  width: 440px;
  position: relative;
  display: none;
}
.icon2 {
  height: 74px;
  width: 74px;
}
.contactsolar4africaorg,
.email-address1,
.icon2 {
  position: relative;
  z-index: 2;
}
.contactsolar4africaorg {
  align-self: stretch;
  font-size: var(--tagline-size);
  line-height: 28px;
  white-space: nowrap;
}
.background-inner,
.email-address-parent {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.email-address-parent {
  align-self: stretch;
  justify-content: flex-start;
  gap: var(--gap-5xs);
}
.background-inner {
  flex: 1;
  justify-content: flex-end;
  padding: 0 0 var(--padding-11xs);
  box-sizing: border-box;
  min-width: 218px;
  max-width: 100%;
}
.background1,
.contact-details {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  max-width: 100%;
}
.background1 {
  flex: 1;
  border-radius: var(--br-61xl);
  background-color: var(--color-orange);
  align-items: flex-end;
  padding: var(--padding-2xs) 0 var(--padding-smi) var(--padding-mid);
  box-sizing: border-box;
  gap: var(--gap-sm);
  min-width: 330px;
  z-index: 1;
}
.contact-details {
  align-self: stretch;
  align-items: flex-start;
  gap: var(--gap-21xl);
}
.copyright-solar4africa2024-al {
  position: relative;
  font-size: var(--tagline-size);
  line-height: 40px;
  text-transform: capitalize;
  color: var(--color-gray);
  white-space: pre-wrap;
  display: inline-block;
  max-width: 100%;
  z-index: 1;
}
.contact-details-parent {
  width: 1400px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: var(--gap-21xl);
  max-width: 100%;
  font-size: var(--paragraph-size);
  color: var(--color-white);
  font-family: var(--h2);
}
.background,
.child {
  position: absolute;
  left: 0;
  width: 100%;
}
.background {
  top: 6371px;
  background-color: var(--color-forestgreen);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  padding: var(--padding-9xl) var(--padding-xl) var(--padding-18xl);
  box-sizing: border-box;
  gap: var(--gap-74xl);
  max-width: 100%;
  text-align: left;
  font-size: var(--tagline-size);
  color: var(--color-gray);
  font-family: var(--font-font-awesome-5-brands);
}
.child {
  top: 0;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
  border-radius: var(--br-11xl);
  background-color: var(--color-white);
  height: 100%;
}
.image-8-icon {
  height: calc(100% - 28px);
  top: 14px;
  bottom: 14px;
  left: 30px;
  max-height: 100%;
  width: 200px;
  object-fit: cover;
}
.div,
.image-8-icon,
.item {
  position: absolute;
}
.div {
  top: 6098px;
  left: 351px;
  width: 260px;
  height: 140px;
  display: none;
}
.item {
  top: 0;
  left: 0;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
  border-radius: var(--br-11xl);
  background-color: var(--color-white);
  width: 100%;
  height: 100%;
}
.image-9-icon {
  position: absolute;
  width: calc(100% - 12px);
  top: 7px;
  right: 5px;
  left: 7px;
  max-width: 100%;
  overflow: hidden;
  height: 126px;
  object-fit: cover;
}
.div1 {
  position: absolute;
  top: 6098px;
  left: 631px;
  width: 260px;
  height: 140px;
  display: none;
}
.image-10-icon,
.inner {
  position: absolute;
  height: 100%;
  top: 0;
}
.inner {
  left: 0;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
  border-radius: var(--br-11xl);
  background-color: var(--color-white);
  width: 100%;
}
.image-10-icon {
  bottom: 0;
  left: 44px;
  max-height: 100%;
  width: 168px;
  object-fit: cover;
}
.div2 {
  position: absolute;
  top: 6098px;
  left: 911px;
  width: 260px;
  height: 140px;
  display: none;
}
.rectangle-div {
  position: absolute;
  top: 0;
  left: 0;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
  border-radius: var(--br-11xl);
  background-color: var(--color-white);
  width: 100%;
  height: 100%;
}
.image-11-icon {
  top: 15px;
  left: 39px;
  width: 186px;
  height: 110px;
  object-fit: cover;
}
.child1,
.div3,
.image-11-icon {
  position: absolute;
}
.div3 {
  top: 6098px;
  left: 1191px;
  width: 260px;
  height: 140px;
  display: none;
}
.child1 {
  top: 0;
  left: 0;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
  border-radius: var(--br-11xl);
  background-color: var(--color-white);
  width: 100%;
  height: 100%;
}
.image-4-icon {
  position: absolute;
  top: 15px;
  left: 50px;
  width: 142px;
  height: 114px;
  object-fit: cover;
}
.div4 {
  position: absolute;
  top: 6098px;
  left: 1471px;
  width: 260px;
  height: 140px;
  display: none;
}
.background-child1 {
  align-self: stretch;
  height: 604px;
  position: relative;
  background-color: var(--color-gray);
}
.quote-container-child {
  width: 1400px;
  height: 520px;
  position: relative;
  border-radius: var(--br-11xl);
  background-color: var(--color-olive);
  display: none;
  max-width: 100%;
}
.request-a-quote {
  align-self: stretch;
  position: relative;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  z-index: 2;
}
.request-quote-container-child {
  width: 87px;
  height: 2px;
  position: relative;
  background-color: var(--color-orange);
  z-index: 2;
}
.request-quote-container {
  width: 556px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: var(--gap-mini);
  max-width: 100%;
  color: var(--color-orange);
}
.talk-about-how {
  margin: 0;
  flex: 1;
  position: relative;
  font-size: inherit;
  line-height: 70px;
  text-transform: capitalize;
  font-weight: 700;
  font-family: inherit;
  display: inline-block;
  max-width: 100%;
  z-index: 2;
}
.talk-about-how-we-can-help-you-wrapper {
  width: 556px;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: flex-start;
  padding: 0 0 var(--padding-xs);
  box-sizing: border-box;
  max-width: 100%;
  font-size: var(--font-size-31xl);
}
.costs-and-successfully {
  width: 559px;
  position: relative;
  font-size: var(--paragraph-size);
  line-height: 32px;
  display: inline-block;
  max-width: 100%;
  z-index: 2;
}
.quote-container {
  width: 1400px;
  border-radius: var(--br-11xl);
  background-color: var(--color-olive);
  flex-direction: column;
  justify-content: flex-start;
  padding: 84px 80px 83px;
  box-sizing: border-box;
  gap: var(--gap-mini);
  z-index: 1;
}
.background2,
.quote-container,
.quote-container-wrapper {
  display: flex;
  align-items: flex-start;
  max-width: 100%;
}
.quote-container-wrapper {
  align-self: stretch;
  flex-direction: row;
  justify-content: center;
  padding: 0 var(--padding-xl);
  box-sizing: border-box;
  margin-top: -249px;
}
.background2 {
  position: absolute;
  top: 4880px;
  left: 1px;
  width: 100%;
  flex-direction: column;
  justify-content: flex-start;
  text-align: left;
  font-size: var(--tagline-size);
  color: var(--color-white);
  font-family: var(--h2);
}
.background-child2 {
  width: 1920px;
  height: 1722px;
  position: relative;
  background-color: var(--color-gray);
  display: none;
  max-width: 100%;
  z-index: 0;
}
.icon3 {
  height: 100%;
  width: 100%;
  position: absolute;
  margin: 0 !important;
  right: 0;
  bottom: -150px;
  left: 0;
  max-width: 100%;
  overflow: hidden;
  z-index: 2;
}
.icon4 {
  height: 156.5px;
  width: 156.5px;
  position: relative;
  z-index: 3;
}
.icon-parent {
  margin: 0 !important;
  position: absolute;
  top: 797px;
  left: 239px;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: flex-start;
}
.frame-child {
  height: 1.5px;
  flex: 1;
  position: relative;
  background-color: var(--fe5716);
  z-index: 1;
}
.benefit-item-inner {
  width: 129px;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: flex-start;
  padding: 0 var(--padding-2xl);
  box-sizing: border-box;
}
.save-time {
  margin: 0 !important;
  position: absolute;
  top: 57px;
  right: -128.5px;
  font-size: inherit;
  line-height: 38px;
  font-weight: 700;
  font-family: inherit;
  z-index: 1;
}
.icon5 {
  height: 156.5px;
  width: 156.5px;
  position: relative;
  z-index: 4;
}
.save-time-parent {
  position: absolute;
  top: 163.6px;
  left: 0;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: flex-start;
}
.why-contact-solar4africa {
  margin: 0;
}
.why-contact-solar4africa-container {
  margin: 0;
  position: absolute;
  top: 0;
  left: 21px;
  font-size: var(--h2-size);
  line-height: 80px;
  text-transform: capitalize;
  font-weight: 700;
  font-family: inherit;
  display: inline-block;
  width: 560px;
  height: 176.6px;
  z-index: 5;
}
.benefit-details {
  align-self: stretch;
  height: 320.1px;
  position: relative;
}
.benefit-item {
  align-self: stretch;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 13.9px;
}
.save-money {
  margin: 0;
  position: relative;
  font-size: inherit;
  line-height: 38px;
  font-weight: 700;
  font-family: inherit;
  z-index: 1;
}
.save-money-wrapper {
  width: 459px;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: center;
  padding: 0 var(--padding-xl) 55.5px;
  box-sizing: border-box;
  max-width: 100%;
}
.free-and-no {
  margin: 0;
  position: relative;
  font-size: inherit;
  line-height: 38px;
  font-weight: 700;
  font-family: inherit;
  z-index: 1;
}
.free-and-no-obligation-wrapper {
  align-self: stretch;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: center;
  padding: 0 var(--padding-xl) 0 48px;
}
.benefit-item-parent,
.benefits-content-inner {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  max-width: 100%;
}
.benefit-item-parent {
  align-self: stretch;
  gap: 52.5px;
}
.benefits-content-inner {
  height: 638px;
  width: 581px;
  min-width: 581px;
}
.image-child {
  position: absolute;
  top: 67px;
  left: -225px;
  border-radius: var(--br-11xl);
  background-color: var(--color-dimgray-200);
  width: 800px;
  height: 478px;
  display: none;
}
.whatsapp-image-2024-05-14-at-1 {
  position: absolute;
  top: 0;
  left: 0;
  border-radius: var(--br-13xl);
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: none;
}
.image {
  height: 541px;
  width: 405px;
  position: relative;
  border-radius: var(--br-13xl);
  background-image: url(./public/whatsapp-image-20240514-at-1414-1@2x.png);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: top;
  max-width: 100%;
  z-index: 1;
}
.image-wrapper {
  width: 745px;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: center;
  padding: 0 var(--padding-xl);
  box-sizing: border-box;
  max-width: 100%;
}
.background-child3 {
  align-self: stretch;
  width: 800px;
  position: relative;
  border-radius: var(--br-11xl);
  background-color: var(--color-orange);
  display: none;
  max-width: 100%;
}
.call-for-a,
.empty {
  position: relative;
  text-transform: uppercase;
  z-index: 2;
}
.empty {
  font-size: var(--font-size-5xl);
  text-transform: capitalize;
  white-space: nowrap;
}
.quote-information,
.quote-information-wrapper {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
}
.quote-information {
  gap: var(--gap-4xs);
}
.quote-information-wrapper {
  height: 99px;
}
.email-information-child {
  width: 429px;
  height: 140px;
  position: relative;
  border-radius: var(--br-11xl);
  background-color: var(--color-white);
  display: none;
  max-width: 100%;
}
.contactsolar4africaorg1,
.email-address2 {
  position: relative;
  text-transform: uppercase;
  z-index: 2;
}
.contactsolar4africaorg1 {
  margin: 0;
  font-size: var(--font-size-5xl);
  text-transform: lowercase;
  font-weight: 700;
  font-family: inherit;
  color: var(--color-orange);
  display: inline-block;
  white-space: nowrap;
  max-width: 100%;
}
.background4,
.email-information {
  border-radius: var(--br-11xl);
  display: flex;
  box-sizing: border-box;
  max-width: 100%;
  z-index: 1;
}
.email-information {
  width: 429px;
  background-color: var(--color-white);
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  padding: var(--padding-22xl) var(--padding-xl) var(--padding-21xl)
    var(--padding-30xl);
  gap: var(--gap-4xs);
  min-width: 429px;
  color: var(--color-dimgray-100);
}
.background4 {
  align-self: stretch;
  background-color: var(--color-orange);
  flex-direction: row;
  align-items: flex-end;
  justify-content: space-between;
  padding: 0 0 0 var(--padding-31xl);
  gap: var(--gap-xl);
}
.benefits-content,
.frame-container {
  display: flex;
  align-items: flex-end;
  justify-content: flex-start;
  max-width: 100%;
}
.frame-container {
  flex: 1;
  flex-direction: column;
  gap: var(--gap-5xl);
  min-width: 520px;
  font-size: var(--tagline-size);
  color: var(--color-white);
}
.benefits-content {
  align-self: stretch;
  flex-direction: row;
  gap: var(--gap-21xl);
}
.articles-and-podcasts {
  align-self: stretch;
  position: relative;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  z-index: 1;
}
.benefit-visual-child {
  height: 2px;
  width: 87px;
  position: relative;
  background-color: var(--color-olive);
  z-index: 1;
}
.benefit-visual {
  align-self: stretch;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: center;
  padding: 0 var(--padding-xl) 0 var(--padding-2xl);
}
.articles-details {
  align-self: stretch;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: flex-start;
  gap: var(--gap-mini);
}
.recent {
  margin: 0;
  align-self: stretch;
  position: relative;
  font-size: var(--h2-size);
  line-height: 80px;
  text-transform: capitalize;
  font-weight: 700;
  font-family: inherit;
  color: var(--title-color);
  z-index: 1;
}
.money-benefit,
.recent-content {
  display: flex;
  align-items: flex-start;
  max-width: 100%;
}
.recent-content {
  width: 1000px;
  flex-direction: column;
  justify-content: flex-start;
  gap: var(--gap-lgi);
}
.money-benefit {
  align-self: stretch;
  flex-direction: row;
  justify-content: center;
  padding: 0 var(--padding-xl);
  box-sizing: border-box;
}
.image1,
.image2,
.image3 {
  border: 0;
  background-color: var(--color-dimgray-200);
  height: 280px;
  width: auto;
  outline: 0;
  flex: 1;
  position: relative;
  border-radius: var(--br-11xl);
  min-width: 330px;
  max-width: 100%;
  z-index: 1;
}
.articles-images {
  align-self: stretch;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: center;
  gap: var(--gap-21xl);
  max-width: 100%;
}
.background3,
.money-benefit-parent {
  width: 1400px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 32px;
  max-width: 100%;
  text-align: center;
  font-size: var(--tagline-size);
  color: var(--color-olive);
}
.background3 {
  position: absolute;
  top: 2194px;
  left: 0;
  background-color: var(--color-gray);
  width: 100%;
  align-items: flex-end;
  padding: 401px 260px var(--padding-8xs) var(--padding-220xl);
  box-sizing: border-box;
  gap: 163px;
  text-align: left;
  font-size: var(--title-1-size);
  color: var(--title-color);
  font-family: var(--h2);
}
.solar-pv-battery {
  position: absolute;
  top: 1282.3px;
  left: 1085px;
  font-size: var(--tagline-size);
  line-height: 32px;
  color: var(--color-white);
  text-align: center;
  display: none;
  width: 470px;
  height: 59.2px;
}
.background-child4 {
  width: 680px;
  height: 370px;
  position: relative;
  border-radius: var(--br-11xl);
  background-color: var(--color-saddlebrown-100);
  display: none;
  max-width: 100%;
}
.icon6 {
  height: 130px;
  width: 130px;
  position: relative;
  z-index: 1;
}
.installation-icons {
  width: 334px;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: center;
  max-width: 100%;
}
.domestic-installation {
  margin: 0;
  position: relative;
  font-size: inherit;
  line-height: 80px;
  text-transform: capitalize;
  font-weight: 700;
  font-family: inherit;
  display: inline-block;
  max-width: 100%;
  z-index: 1;
}
.background-child5,
.background5 {
  border-radius: var(--br-11xl);
  background-color: var(--color-saddlebrown-100);
  max-width: 100%;
}
.background5 {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  padding: var(--padding-31xl) var(--padding-xl) 105px;
  box-sizing: border-box;
  gap: var(--gap-8xs);
  min-width: 510px;
}
.background-child5 {
  width: 680px;
  height: 370px;
  position: relative;
  display: none;
}
.icon7 {
  height: 130px;
  width: 130px;
  position: relative;
  z-index: 1;
}
.icon-wrapper {
  width: 376px;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: center;
  max-width: 100%;
}
.commercial-installation {
  margin: 0;
  width: 376px;
  height: 148px;
  position: relative;
  font-size: inherit;
  line-height: 80px;
  text-transform: capitalize;
  font-weight: 700;
  font-family: inherit;
  display: inline-block;
  flex-shrink: 0;
  max-width: 100%;
  z-index: 1;
}
.background6,
.installation-types {
  display: flex;
  justify-content: flex-start;
  max-width: 100%;
}
.background6 {
  flex: 1;
  border-radius: var(--br-11xl);
  background-color: var(--color-saddlebrown-100);
  flex-direction: column;
  align-items: center;
  padding: var(--padding-31xl) var(--padding-xl) var(--padding-7xl);
  box-sizing: border-box;
  gap: var(--gap-base);
  min-width: 510px;
}
.installation-types {
  align-self: stretch;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: var(--gap-22xl);
}
.welcome-to-solar4africa {
  align-self: stretch;
  position: relative;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.welcome-details-child {
  width: 107px;
  height: 2px;
  position: relative;
  background-color: #1c60a9;
}
.welcome-details {
  width: 654px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: var(--gap-mini);
  max-width: 100%;
}
.african-based-green1 {
  height: 191px;
  width: 559px;
  position: relative;
  font-size: var(--paragraph-size);
  line-height: 32px;
  color: var(--color-dimgray-100);
  display: inline-block;
  flex-shrink: 0;
  min-width: 559px;
  max-width: 100%;
}
.welcome-container {
  align-self: stretch;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: space-between;
  max-width: 100%;
  gap: var(--gap-xl);
}
.improve-standard-of {
  width: 681px;
  position: relative;
  font-size: var(--h2-size);
  line-height: 80px;
  text-transform: capitalize;
  font-weight: 700;
  font-family: inherit;
  color: var(--title-color);
  display: inline-block;
  max-width: 100%;
  margin: -125px 0 0;
}
.welcome-container-parent {
  align-self: stretch;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  max-width: 100%;
}
.image-icon {
  align-self: stretch;
  height: 302px;
  position: relative;
  max-width: 100%;
  overflow: hidden;
  flex-shrink: 0;
  object-fit: cover;
  z-index: 1;
}
.gallery-image {
  height: 516px;
  width: 606px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  min-width: 606px;
  max-width: 100%;
}
.image-icon1 {
  height: 780px;
  flex: 1;
  position: relative;
  max-width: 100%;
  overflow: hidden;
  object-fit: cover;
  min-width: 507px;
  z-index: 1;
}
.content-wrapper,
.images-container {
  align-self: stretch;
  display: flex;
  align-items: flex-end;
  justify-content: flex-start;
  max-width: 100%;
}
.images-container {
  flex-direction: row;
  padding: 0 0 0 var(--padding-10xs);
  box-sizing: border-box;
  gap: var(--gap-xs);
}
.content-wrapper {
  flex-direction: column;
  gap: var(--gap-2xl);
  text-align: left;
  font-size: var(--tagline-size);
  color: var(--background-color);
}
.installation-types-parent,
.solar-pv-battery1 {
  position: absolute;
  color: var(--color-white);
  text-align: center;
}
.installation-types-parent {
  top: 1015px;
  left: 259px;
  width: 1401px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: var(--gap-100xl);
  max-width: 100%;
  font-size: var(--title-3-size);
  font-family: var(--h2);
}
.solar-pv-battery1 {
  top: 1277px;
  left: 364px;
  font-size: var(--tagline-size);
  line-height: 32px;
  display: none;
  width: 470px;
}
.backround-pic {
  position: absolute;
  top: 0;
  left: -0.2px;
  box-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
  background-color: var(--color-dimgray-200);
  width: 1920px;
  height: 786px;
}
.c7146de8-1-icon {
  position: absolute;
  top: 9.3px;
  left: 1px;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 1;
}
.empowerment-image-inner-wrappe {
  position: absolute;
  top: 0;
  left: 0.2px;
  width: 100%;
  height: 100%;
}
.empowerment-through-innovation {
  margin: 0;
  position: absolute;
  top: 252.3px;
  left: 259.2px;
  font-size: inherit;
  line-height: 84px;
  text-transform: capitalize;
  font-weight: 700;
  font-family: inherit;
  display: inline-block;
  width: 700px;
  z-index: 3;
}
.image4 {
  position: absolute;
  top: 94.7px;
  left: -0.2px;
  width: 100%;
  height: 805.3px;
  text-align: left;
  font-size: var(--h1-size);
  color: var(--color-white);
  font-family: var(--h2);
}
.solution-box {
  width: 1041.2px;
  height: 673.6px;
  position: absolute;
  margin: 0 !important;
  top: 474.52px;
  left: -47px;
  border-radius: 336.79px;
  background-color: var(--color-saddlebrown-200);
  transform: rotate(-36.7deg);
  transform-origin: 0 0;
  z-index: 2;
}
.to-empower-off-grid {
  width: 592px;
  position: relative;
  line-height: 32px;
  display: inline-block;
  max-width: 100%;
  z-index: 4;
}
.quote-button-shape {
  height: 100%;
  width: 100%;
  position: absolute;
  margin: 0 !important;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  border-radius: var(--br-11xl);
  background-color: var(--color-orange);
}
.request-a-quote1 {
  position: relative;
  font-size: var(--tagline-size);
  font-family: var(--h2);
  color: #1e56a1;
  text-align: center;
  z-index: 1;
}
.button,
.solar-solutions-inner {
  display: flex;
  align-items: flex-start;
  position: relative;
}
.button {
  cursor: pointer;
  border: 0;
  padding: var(--padding-2xl-4) var(--padding-18xl) var(--padding-lg-6);
  background-color: transparent;
  flex-direction: row;
  justify-content: flex-start;
  white-space: nowrap;
  z-index: 3;
}
.solar-solutions-inner {
  width: 1190.4px;
  flex-direction: column;
  justify-content: flex-end;
  padding: 587.7px var(--padding-xl) 273.2px 258.8px;
  box-sizing: border-box;
  gap: 62px;
  max-width: 100%;
}
.background-child6 {
  height: 109px;
  width: 1920px;
  position: relative;
  background-color: var(--color-olive);
  display: none;
  max-width: 100%;
}
.icon8 {
  height: 40px;
  width: 40px;
  position: relative;
  min-height: 40px;
  z-index: 4;
}
.contactsolar4africaorg2 {
  position: relative;
  white-space: nowrap;
  z-index: 4;
}
.contact-information {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  padding: var(--padding-3xs) var(--padding-9xs) 0 0;
}
.icon9 {
  width: 40px;
  height: 40px;
  position: relative;
  z-index: 4;
}
.location-icon-container {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  padding: 0 var(--padding-10xs) 0 0;
}
.decora-street-valencia1 {
  position: relative;
  z-index: 4;
}
.decora-street-valencia-mbomb-container {
  flex-direction: column;
  justify-content: flex-start;
  padding: var(--padding-3xs) 0 0;
  box-sizing: border-box;
}
.background7,
.decora-street-valencia-mbomb-container,
.solar-solutions-wrapper {
  display: flex;
  align-items: flex-start;
  max-width: 100%;
}
.background7 {
  align-self: stretch;
  background-color: var(--color-olive);
  flex-direction: row;
  justify-content: center;
  padding: var(--padding-4xs) var(--padding-xl) var(--padding-41xl)
    var(--padding-433xl);
  box-sizing: border-box;
  gap: var(--gap-6xs);
  z-index: 3;
  margin-top: -1014.9px;
  font-size: var(--tagline-size);
  color: var(--color-white);
}
.solar-solutions-wrapper {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  flex-direction: column;
  justify-content: flex-start;
  min-height: 1015px;
  text-align: left;
  font-size: var(--paragraph-size);
  color: var(--color-gainsboro-100);
  font-family: var(--h2);
}
.background-child7 {
  position: absolute;
  width: 100%;
  top: 0;
  right: 0;
  left: 0;
  border-radius: var(--br-61xl);
  background-color: var(--color-white);
  height: 100%;
  display: none;
}
.search-icon {
  position: absolute;
  top: 35px;
  left: 1502px;
  width: 30px;
  height: 30px;
  z-index: 5;
}
.nav-items,
.nav-items1,
.nav-items2,
.nav-items3,
.nav-items4 {
  position: absolute;
  top: 59px;
  left: 909px;
  background-color: var(--color-darkgray-100);
  width: 1px;
  height: 21px;
  transform: rotate(180deg);
  transform-origin: 0 0;
  z-index: 5;
}
.nav-items1,
.nav-items2,
.nav-items3,
.nav-items4 {
  left: 786px;
}
.nav-items2,
.nav-items3,
.nav-items4 {
  left: 644px;
}
.nav-items3,
.nav-items4 {
  top: 60px;
  left: 1062px;
}
.nav-items4 {
  left: 1162px;
}
.about-us,
.contact,
.services {
  position: absolute;
  top: 40px;
  left: 914px;
  font-weight: 300;
  display: inline-block;
  width: 139px;
  cursor: pointer;
  z-index: 5;
}
.about-us,
.contact {
  top: 39px;
  left: 1069px;
  width: 88px;
}
.about-us {
  top: 40px;
  left: 779px;
  width: 129px;
  white-space: nowrap;
  z-index: 6;
}
.active-child {
  position: absolute;
  top: 0;
  left: calc(50% - 55px);
  border-radius: var(--br-11xl);
  background-color: var(--color-orange);
  width: 100%;
  height: 100%;
  display: none;
}
.home1 {
  position: absolute;
  top: 15px;
  left: calc(50% - 48px);
  display: inline-block;
  width: 100px;
  z-index: 1;
}
.active,
.background8 {
  position: absolute;
  top: 23px;
  left: 659px;
  border-radius: var(--br-11xl);
  background-color: var(--color-orange);
  width: 110px;
  height: 50px;
  z-index: 5;
  color: var(--color-saddlebrown-100);
}
.background8 {
  top: 6px;
  left: 0;
  border-radius: var(--br-61xl);
  background-color: var(--color-white);
  width: 100%;
  height: 100px;
  z-index: 4;
  text-align: center;
  font-size: var(--tagline-size);
  color: var(--title-color);
  font-family: var(--h2);
}
.logo-07-1-icon,
.navbar {
  position: absolute;
  height: 108.3px;
}
.logo-07-1-icon {
  top: 0;
  left: 67px;
  width: 226px;
  object-fit: cover;
  z-index: 5;
}
.navbar {
  top: 50px;
  left: 167px;
  width: 1579px;
}
.main-quote-button-shape {
  height: 100%;
  width: 100%;
  position: absolute;
  margin: 0 !important;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  border-radius: var(--br-11xl);
  background-color: var(--fe5716);
}
.request-a-quote2 {
  position: relative;
  text-decoration: underline;
  font-weight: 700;
  color: inherit;
  display: inline-block;
  min-width: 119px;
  z-index: 1;
}
.button1,
.quote-button {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
}
.button1 {
  justify-content: flex-start;
  padding: var(--padding-2xl-4) 59.2px var(--padding-lg-6) 60.8px;
  position: relative;
  white-space: nowrap;
}
.quote-button {
  align-self: stretch;
  justify-content: center;
  padding: 0 var(--padding-5xl) var(--padding-22xl) var(--padding-xl);
}
.expectation-box {
  height: 2px;
  width: 87px;
  position: relative;
  background-color: var(--fe5716);
}
.expectation-container {
  align-self: stretch;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: center;
  padding: 0 var(--padding-2xl) 0 var(--padding-xl);
}
.what-you-can {
  margin: 0;
  align-self: stretch;
  position: relative;
  font-size: inherit;
  line-height: 80px;
  text-transform: capitalize;
  font-weight: 700;
  font-family: inherit;
}
.mission-statement,
.welcome-content {
  display: flex;
  align-items: flex-start;
  max-width: 100%;
}
.welcome-content {
  width: 1000px;
  flex-direction: column;
  justify-content: flex-start;
  gap: var(--gap-mid);
}
.mission-statement {
  align-self: stretch;
  flex-direction: row;
  justify-content: center;
  padding: 0 var(--padding-6xl) 0 var(--padding-xl);
  box-sizing: border-box;
  font-size: var(--h2-size);
  color: var(--title-color);
}
.background-child8 {
  position: absolute;
  top: 0;
  left: 0;
  border-radius: var(--br-11xl);
  background-color: var(--color-white);
  border: 5px solid var(--color-gainsboro-200);
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  display: none;
}
.appointment-1-icon {
  position: absolute;
  top: 303px;
  left: 44px;
  width: 60px;
  height: 60px;
  overflow: hidden;
  z-index: 3;
}
.our-mission-is {
  margin: 0;
}
.our-mission-is-container {
  position: absolute;
  top: 168px;
  left: 44px;
  line-height: 28px;
  display: inline-block;
  width: 330px;
  height: 84px;
  z-index: 3;
}
.background9 {
  position: absolute;
  top: 0;
  left: 20px;
  border-radius: var(--br-11xl);
  background-color: var(--color-white);
  border: 5px solid var(--color-gainsboro-200);
  box-sizing: border-box;
  width: 410px;
  height: 399.7px;
  z-index: 2;
}
.background-child9,
.buttons-inner-child {
  position: absolute;
  top: 0;
  left: 0;
  border-radius: var(--br-11xl);
  background-color: var(--color-gray);
  width: 100%;
  height: 100%;
  display: none;
}
.buttons-inner-child {
  border-radius: var(--br-21xl);
  background-color: var(--color-saddlebrown-100);
}
.button-spacer {
  position: absolute;
  top: 41px;
  left: 29px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  z-index: 4;
}
.buttons-inner {
  position: absolute;
  height: 100%;
  top: 0;
  bottom: 0;
  left: 335px;
  border-radius: var(--br-21xl);
  background-color: var(--color-saddlebrown-100);
  width: 70px;
  z-index: 1;
}
.book-a-free {
  margin: 0;
  position: absolute;
  top: 24px;
  left: 64px;
  font-size: var(--title-1-size);
  line-height: 36px;
  font-weight: 700;
  font-family: inherit;
  color: var(--title-color);
  text-align: left;
  display: inline-block;
  width: 271px;
  z-index: 4;
}
.background10 {
  position: absolute;
  top: 25px;
  left: 0;
  border-radius: var(--br-11xl);
  background-color: var(--color-gray);
  width: 405px;
  height: 120px;
  z-index: 3;
  text-align: center;
  font-size: var(--title-3-size);
  color: var(--color-white);
}
.mission-consultation-inner {
  height: 399.7px;
  flex: 1;
  position: relative;
  min-width: 322px;
  max-width: 100%;
}
.background-child10 {
  position: absolute;
  top: 0;
  left: 0;
  border-radius: var(--br-11xl);
  background-color: var(--color-white);
  border: 5px solid var(--color-gainsboro-200);
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  display: none;
}
.calculating-1-icon {
  position: absolute;
  top: 306px;
  left: 44px;
  width: 60px;
  height: 60px;
  overflow: hidden;
  z-index: 3;
}
.we-will-give {
  margin: 0;
}
.we-will-give-container {
  position: absolute;
  top: 168px;
  left: 44px;
  line-height: 28px;
  display: inline-block;
  width: 330px;
  height: 56px;
  z-index: 3;
}
.background11 {
  position: absolute;
  top: 0;
  left: 20px;
  border-radius: var(--br-11xl);
  background-color: var(--color-white);
  border: 5px solid var(--color-gainsboro-200);
  box-sizing: border-box;
  width: 410px;
  height: 399.7px;
  z-index: 2;
}
.background-child11,
.estimate-inner-child {
  position: absolute;
  top: 0;
  left: 0;
  border-radius: var(--br-11xl);
  background-color: var(--color-gray);
  width: 100%;
  height: 100%;
  display: none;
}
.estimate-inner-child {
  border-radius: var(--br-21xl);
  background-color: var(--color-saddlebrown-100);
}
.estimate-spacer {
  position: absolute;
  top: 41px;
  left: 26px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  z-index: 4;
}
.estimate-inner {
  position: absolute;
  height: 100%;
  top: 0;
  bottom: 0;
  left: 335px;
  border-radius: var(--br-21xl);
  background-color: var(--color-saddlebrown-100);
  width: 70px;
  z-index: 1;
}
.estimate-the-calculation {
  margin: 0;
  position: absolute;
  top: 24px;
  left: 64px;
  font-size: var(--title-1-size);
  line-height: 36px;
  font-weight: 700;
  font-family: inherit;
  color: var(--title-color);
  text-align: left;
  display: inline-block;
  width: 271px;
  z-index: 4;
}
.background12 {
  position: absolute;
  top: 25px;
  left: 0;
  border-radius: var(--br-11xl);
  background-color: var(--color-gray);
  width: 405px;
  height: 120px;
  z-index: 3;
  text-align: center;
  font-size: var(--title-3-size);
  color: var(--color-white);
}
.calculation-inner {
  align-self: stretch;
  height: 399.7px;
  position: relative;
}
.calculation-inner-wrapper {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
  padding: 0 var(--padding-8xs) var(--padding-11xl) 0;
  box-sizing: border-box;
  min-width: 326px;
  max-width: 100%;
}
.background-child12 {
  position: absolute;
  top: 0;
  left: 0;
  border-radius: var(--br-11xl);
  background-color: var(--color-white);
  border: 5px solid var(--color-gainsboro-200);
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  display: none;
}
.hired-1-1 {
  position: absolute;
  top: 303px;
  left: 44px;
  width: 60px;
  height: 60px;
  overflow: hidden;
  z-index: 3;
}
.hire-us-and {
  margin: 0;
}
.hire-us-and-container {
  position: absolute;
  top: 168px;
  left: 44px;
  line-height: 28px;
  display: inline-block;
  width: 330px;
  height: 56px;
  z-index: 3;
}
.background-child13,
.background13 {
  position: absolute;
  top: 0;
  border-radius: var(--br-11xl);
}
.background13 {
  left: 20px;
  background-color: var(--color-white);
  border: 5px solid var(--color-gainsboro-200);
  box-sizing: border-box;
  width: 410px;
  height: 399.7px;
  z-index: 2;
}
.background-child13 {
  left: 0;
  background-color: var(--color-gray);
  width: 100%;
  height: 100%;
  display: none;
}
.b,
.frame-item {
  position: absolute;
}
.frame-item {
  top: 0;
  left: 0;
  border-radius: var(--br-21xl);
  background-color: var(--color-saddlebrown-100);
  width: 100%;
  height: 100%;
  display: none;
}
.b {
  top: 41px;
  left: 26px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  display: inline-block;
  min-width: 22px;
  z-index: 4;
}
.rectangle-parent {
  position: absolute;
  height: 100%;
  top: 0;
  bottom: 0;
  left: 335px;
  border-radius: var(--br-21xl);
  background-color: var(--color-saddlebrown-100);
  width: 70px;
  z-index: 1;
}
.hire-us-for {
  margin: 0;
  position: absolute;
  top: 24px;
  left: 64px;
  font-size: var(--title-1-size);
  line-height: 36px;
  font-weight: 700;
  font-family: inherit;
  color: var(--title-color);
  text-align: left;
  display: inline-block;
  width: 271px;
  z-index: 4;
}
.background14 {
  position: absolute;
  top: 25px;
  left: 0;
  border-radius: var(--br-11xl);
  background-color: var(--color-gray);
  width: 405px;
  height: 120px;
  z-index: 3;
  text-align: center;
  font-size: var(--title-3-size);
  color: var(--color-white);
}
.mission-consultation-inner1 {
  height: 399.7px;
  flex: 1;
  position: relative;
  min-width: 322px;
  max-width: 100%;
}
.mission-consultation-wrapper {
  align-self: stretch;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: center;
  padding: 0 0 98.3px;
  box-sizing: border-box;
  gap: var(--gap-31xl);
  max-width: 100%;
  text-align: left;
  color: var(--color-dimgray-100);
}
.background-child14 {
  width: 592px;
  height: 554px;
  position: relative;
  border-radius: var(--br-11xl);
  background-color: var(--color-orange);
  display: none;
  max-width: 100%;
}
.complete-name,
.email-address3,
.phone-no2 {
  width: 100%;
  border: 0;
  outline: 0;
  background-color: var(--color-white);
  height: 60px;
  border-radius: var(--br-11xl);
  flex-direction: row;
  box-sizing: border-box;
  font-family: var(--h2);
  font-size: var(--tagline-size);
  color: var(--color-dimgray-100);
  min-width: 250px;
  z-index: 3;
}
.complete-name,
.email-address3 {
  align-self: stretch;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  padding: var(--padding-3xl) var(--padding-17xl) var(--padding-lg);
}
.phone-no2 {
  padding: var(--padding-2xl) var(--padding-17xl) var(--padding-lgi);
}
.form-content,
.message,
.phone-no2 {
  align-self: stretch;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
}
.message {
  border: 0;
  background-color: var(--color-white);
  height: 140px;
  width: auto;
  outline: 0;
  border-radius: var(--br-11xl);
  flex-direction: row;
  padding: var(--padding-4xl) var(--padding-17xl);
  box-sizing: border-box;
  font-family: var(--h2);
  font-size: var(--tagline-size);
  color: var(--color-dimgray-100);
  z-index: 3;
}
.form-content {
  flex-direction: column;
  gap: 20.7px;
}
.form-button-shape {
  height: 100%;
  width: 100%;
  position: absolute;
  margin: 0 !important;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  border-radius: var(--br-11xl);
  background-color: var(--color-saddlebrown-100);
}
.request-a-quote3 {
  position: relative;
  font-size: var(--tagline-size);
  display: inline-block;
  font-family: var(--h2);
  color: var(--color-white);
  text-align: center;
  min-width: 120px;
  z-index: 1;
}
.button2 {
  cursor: pointer;
  border: 0;
  padding: var(--padding-2xl-4) var(--padding-27xl) var(--padding-lg-6);
  background-color: transparent;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: flex-start;
  position: relative;
  white-space: nowrap;
  z-index: 3;
}
.background-wrapper,
.background15 {
  display: flex;
  align-items: flex-start;
  box-sizing: border-box;
  max-width: 100%;
}
.background15 {
  flex: 1;
  border-radius: var(--br-11xl);
  background-color: var(--color-orange);
  flex-direction: column;
  justify-content: flex-start;
  padding: var(--padding-22xl) var(--padding-22xl) var(--padding-21xl);
  gap: var(--gap-12xl);
  z-index: 2;
}
.background-wrapper {
  width: 672px;
  flex-direction: row;
  justify-content: flex-end;
  padding: 0 var(--padding-21xl) 77px;
}
.price-we-win {
  margin: 0;
  position: relative;
  font-size: inherit;
  text-decoration: underline;
  text-transform: uppercase;
  font-weight: 700;
  font-family: inherit;
}
.impact-highlight {
  align-self: stretch;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: center;
  padding: 0 var(--padding-2xl) 0 var(--padding-xl);
}
.innovation-for-social {
  margin: 0;
  position: relative;
  font-size: inherit;
  text-transform: uppercase;
  font-weight: 700;
  font-family: inherit;
  color: var(--title-color);
}
.expectation-inner,
.expectation-sub-wrapper {
  display: flex;
  align-items: flex-start;
  max-width: 100%;
}
.expectation-inner {
  width: 466px;
  flex-direction: column;
  justify-content: flex-start;
  gap: 91px;
}
.expectation-sub-wrapper {
  align-self: stretch;
  flex-direction: row;
  justify-content: center;
  padding: 0 var(--padding-4xl) 0 var(--padding-xl);
  box-sizing: border-box;
  text-align: left;
  font-size: var(--title-1-size);
  color: var(--color-olive);
}
.quote-button-parent {
  position: absolute;
  top: 4170px;
  left: 265px;
  width: 1395px;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: flex-start;
  gap: 126px;
  max-width: 100%;
  text-align: center;
  font-size: var(--tagline-size);
  color: var(--color-white);
  font-family: var(--h2);
}
.comment1 {
  position: absolute;
  top: 3px;
  left: 27px;
  text-transform: capitalize;
}
.chat-2-1,
.comment {
  position: absolute;
  height: 24px;
}
.chat-2-1 {
  top: 0;
  left: 0;
  width: 24px;
  overflow: hidden;
}
.comment {
  top: 4075px;
  left: 1426px;
  width: 117px;
  display: none;
  text-align: center;
}
.by-thomas-walkar {
  position: absolute;
  top: 16px;
  left: 58px;
  text-transform: capitalize;
}
.admin-child {
  position: absolute;
  height: 100%;
  top: 0;
  bottom: 0;
  left: 0;
  border-radius: 50%;
  background-color: var(--color-dimgray-200);
  width: 50px;
}
.admin {
  position: absolute;
  top: 4062px;
  left: 1220px;
  width: 186px;
  height: 50px;
  display: none;
}
.design-process,
.solar-energys-exceptional {
  position: absolute;
  left: 1220px;
  line-height: 36px;
  display: none;
  width: 440px;
}
.solar-energys-exceptional {
  top: 3965px;
  font-size: var(--title-1-size);
  text-transform: capitalize;
  color: var(--title-color);
}
.design-process {
  top: 3930px;
  text-decoration: underline;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.date-child {
  position: absolute;
  top: 0;
  left: 0;
  border-radius: var(--br-11xl);
  background-color: var(--color-forestgreen);
  width: 100%;
  height: 100%;
}
.december-12-2023 {
  position: absolute;
  top: 6px;
  left: 16px;
  text-transform: capitalize;
}
.comment3,
.date {
  position: absolute;
}
.date {
  top: 3871px;
  left: 1230px;
  width: 169px;
  height: 30px;
  display: none;
  text-align: center;
  color: var(--color-white);
}
.comment3 {
  top: 3px;
  left: 27px;
  text-transform: capitalize;
}
.chat-2-11,
.comment2 {
  position: absolute;
  height: 24px;
}
.chat-2-11 {
  top: 0;
  left: 0;
  width: 24px;
  overflow: hidden;
}
.comment2 {
  top: 4075px;
  left: 946px;
  width: 117px;
  display: none;
  text-align: center;
}
.by-thomas-walkar1 {
  position: absolute;
  top: 16px;
  left: 58px;
  text-transform: capitalize;
}
.admin-item {
  position: absolute;
  height: 100%;
  top: 0;
  bottom: 0;
  left: 0;
  border-radius: 50%;
  background-color: var(--color-dimgray-200);
  width: 50px;
}
.admin1 {
  position: absolute;
  top: 4062px;
  left: 740px;
  width: 186px;
  height: 50px;
  display: none;
}
.design-process1,
.solar-energys-exceptional1 {
  position: absolute;
  left: 740px;
  line-height: 36px;
  display: none;
  width: 440px;
}
.solar-energys-exceptional1 {
  top: 3965px;
  font-size: var(--title-1-size);
  text-transform: capitalize;
  color: var(--title-color);
}
.design-process1 {
  top: 3930px;
  text-decoration: underline;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.date-item {
  position: absolute;
  top: 0;
  left: 0;
  border-radius: var(--br-11xl);
  background-color: var(--color-forestgreen);
  width: 100%;
  height: 100%;
}
.december-12-20231 {
  position: absolute;
  top: 6px;
  left: 16px;
  text-transform: capitalize;
}
.date1 {
  position: absolute;
  top: 3871px;
  left: 750px;
  width: 169px;
  height: 30px;
  display: none;
  text-align: center;
  color: var(--color-white);
}
.comment5 {
  position: absolute;
  top: 3px;
  left: 27px;
  text-transform: capitalize;
}
.chat-2-12,
.comment4 {
  position: absolute;
  height: 24px;
}
.chat-2-12 {
  top: 0;
  left: 0;
  width: 24px;
  overflow: hidden;
}
.comment4 {
  top: 4075px;
  left: 466px;
  width: 117px;
  display: none;
  text-align: center;
}
.by-thomas-walkar2 {
  position: absolute;
  top: 16px;
  left: 58px;
  text-transform: capitalize;
}
.admin-inner {
  position: absolute;
  height: 100%;
  top: 0;
  bottom: 0;
  left: 0;
  border-radius: 50%;
  background-color: var(--color-dimgray-200);
  width: 50px;
}
.admin2 {
  position: absolute;
  top: 4062px;
  left: 260px;
  width: 186px;
  height: 50px;
  display: none;
}
.design-process2,
.solar-energys-exceptional2 {
  position: absolute;
  left: 260px;
  line-height: 36px;
  display: none;
  width: 440px;
}
.solar-energys-exceptional2 {
  top: 3965px;
  font-size: var(--title-1-size);
  text-transform: capitalize;
  color: var(--title-color);
}
.design-process2 {
  top: 3930px;
  text-decoration: underline;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.date-inner {
  position: absolute;
  top: 0;
  left: 0;
  border-radius: var(--br-11xl);
  background-color: var(--color-forestgreen);
  width: 100%;
  height: 100%;
}
.december-12-20232 {
  position: absolute;
  top: 6px;
  left: 16px;
  text-transform: capitalize;
}
.date2 {
  position: absolute;
  top: 3871px;
  left: 270px;
  width: 169px;
  height: 30px;
  display: none;
  text-align: center;
  color: var(--color-white);
}
.home {
  width: 100%;
  height: 6966px;
  position: relative;
  background-color: var(--color-white);
  overflow: hidden;
  line-height: normal;
  letter-spacing: normal;
  text-align: left;
  font-size: var(--font-size-sm);
  color: var(--color-dimgray-100);
  font-family: var(--h2);
}
@media screen and (max-width: 1625px) {
  .container-inner,
  .content {
    flex: 1;
  }
  .container {
    flex-wrap: wrap;
  }
  .benefits-content-inner {
    flex: 1;
  }
  .benefits-content {
    flex-wrap: wrap;
  }
  .home {
    height: auto;
    min-height: 6966;
  }
}
@media screen and (max-width: 1275px) {
  .container-inner {
    min-width: 100%;
  }
  .contact-details {
    flex-wrap: wrap;
  }
  .benefits-content-inner {
    min-width: 100%;
  }
  .email-information {
    flex: 1;
    min-width: 100%;
  }
  .background4 {
    flex-wrap: wrap;
    justify-content: center;
    padding: var(--padding-xl);
    box-sizing: border-box;
  }
  .frame-container {
    min-width: 100%;
  }
  .background3 {
    gap: 81px;
    padding-left: 119px;
    padding-right: var(--padding-111xl);
    box-sizing: border-box;
  }
  .african-based-green1 {
    flex: 1;
  }
  .welcome-container {
    flex-wrap: wrap;
  }
  .image-icon {
    align-self: stretch;
    width: auto;
  }
  .gallery-image {
    flex: 1;
  }
  .background7,
  .images-container {
    flex-wrap: wrap;
  }
  .background7 {
    padding-left: var(--padding-207xl);
    box-sizing: border-box;
  }
}
@media screen and (max-width: 900px) {
  .frame-parent {
    flex-wrap: wrap;
  }
  .contact-details,
  .contact-details-parent {
    gap: var(--gap-xl);
  }
  .background {
    gap: var(--gap-27xl);
  }
  .talk-about-how {
    font-size: var(--font-size-21xl);
    line-height: 56px;
  }
  .quote-container {
    padding-left: var(--padding-21xl);
    padding-right: var(--padding-21xl);
    box-sizing: border-box;
  }
  .why-contact-solar4africa-container {
    font-size: var(--font-size-29xl);
    line-height: 64px;
  }
  .benefit-item-parent {
    gap: var(--gap-7xl);
  }
  .benefits-content {
    gap: var(--gap-xl);
  }
  .recent {
    font-size: var(--font-size-29xl);
    line-height: 64px;
  }
  .articles-images {
    gap: var(--gap-xl);
  }
  .money-benefit-parent {
    gap: var(--gap-base);
  }
  .background3 {
    gap: var(--gap-22xl);
    padding-left: 59px;
    padding-right: 65px;
    box-sizing: border-box;
  }
  .domestic-installation {
    font-size: var(--font-size-5xl);
    line-height: 64px;
  }
  .background5 {
    min-width: 100%;
  }
  .commercial-installation {
    font-size: var(--font-size-5xl);
    line-height: 64px;
  }
  .african-based-green1,
  .background6 {
    min-width: 100%;
  }
  .improve-standard-of {
    font-size: var(--font-size-29xl);
    line-height: 64px;
  }
  .gallery-image,
  .image-icon1 {
    min-width: 100%;
  }
  .empowerment-through-innovation {
    font-size: var(--font-size-37xl);
    line-height: 67px;
  }
  .solar-solutions-inner {
    gap: var(--gap-12xl);
    padding-left: var(--padding-110xl);
    box-sizing: border-box;
  }
  .background7 {
    padding-left: var(--padding-94xl);
    box-sizing: border-box;
  }
  .what-you-can {
    font-size: var(--font-size-29xl);
    line-height: 64px;
  }
  .b,
  .button-spacer,
  .estimate-spacer {
    font-size: var(--font-size-5xl);
  }
}
@media screen and (max-width: 450px) {
  .content,
  .footer-links {
    flex-wrap: wrap;
  }
  .content {
    min-width: 100%;
  }
  .about-solar4africa,
  .subscribe-to-our {
    font-size: var(--paragraph-size);
    line-height: 32px;
  }
  .bar {
    flex-wrap: wrap;
  }
  .frame-parent {
    gap: var(--gap-2xl);
  }
  .location,
  .phone-no {
    flex-wrap: wrap;
    flex: 1;
  }
  .background1 {
    flex-wrap: wrap;
    padding-right: var(--padding-mid);
    box-sizing: border-box;
  }
  .background {
    gap: var(--gap-4xl);
  }
  .talk-about-how {
    font-size: var(--title-3-size);
    line-height: 42px;
  }
  .save-time {
    font-size: var(--font-size-2xl);
    line-height: 30px;
  }
  .why-contact-solar4africa-container {
    font-size: var(--font-size-17xl);
    line-height: 48px;
  }
  .free-and-no,
  .save-money {
    font-size: var(--font-size-2xl);
    line-height: 30px;
  }
  .free-and-no-obligation-wrapper {
    padding-left: var(--padding-xl);
    box-sizing: border-box;
  }
  .contactsolar4africaorg1,
  .empty {
    font-size: var(--font-size-lgi);
  }
  .email-information {
    padding-left: var(--padding-xl);
    box-sizing: border-box;
  }
  .recent {
    font-size: var(--font-size-17xl);
    line-height: 48px;
  }
  .commercial-installation,
  .domestic-installation {
    font-size: var(--paragraph-size);
    line-height: 48px;
  }
  .improve-standard-of {
    font-size: var(--font-size-17xl);
    line-height: 48px;
  }
  .empowerment-through-innovation {
    font-size: var(--font-size-23xl);
    line-height: 50px;
  }
  .solar-solutions-inner {
    gap: var(--gap-mini);
  }
  .background7,
  .solar-solutions-inner {
    padding-left: var(--padding-xl);
    box-sizing: border-box;
  }
  .what-you-can {
    font-size: var(--font-size-17xl);
    line-height: 48px;
  }
  .button-spacer {
    font-size: var(--paragraph-size);
  }
  .book-a-free {
    font-size: var(--font-size-2xl);
    line-height: 29px;
  }
  .estimate-spacer {
    font-size: var(--paragraph-size);
  }
  .estimate-the-calculation {
    font-size: var(--font-size-2xl);
    line-height: 29px;
  }
  .b {
    font-size: var(--paragraph-size);
  }
  .hire-us-for {
    line-height: 29px;
  }
  .hire-us-for,
  .innovation-for-social,
  .price-we-win {
    font-size: var(--font-size-2xl);
  }
  .solar-energys-exceptional,
  .solar-energys-exceptional1,
  .solar-energys-exceptional2 {
    font-size: var(--font-size-2xl);
    line-height: 29px;
  }
}