/* Variables */ @import url("https://fonts.googleapis.com/css?family=Poppins:500,400,700,600"); @import url("https://fonts.googleapis.com/css?family=Poppins:500,400,700,600"); @import url("https://fonts.googleapis.com/css?family=Poppins:500,400,700,600"); @import url("https://fonts.googleapis.com/css?family=Poppins:500,400,700,600"); :root { --black: rgba(0, 0, 0, 1); --black-rock: rgba(15, 5, 41, 0.149); --black-rock-2: rgba(15, 5, 41, 0.4); --body-dark: rgba(15, 5, 41, 1); --primary-violet: rgba(88, 31, 245, 1); --alabaster: rgba(249, 250, 254, 1); --supernova: rgba(255, 200, 5, 1); --white: rgba(255, 255, 255, 1); --font-size-s: 12px; --font-size-responsive-m: 3.5vw; --font-size-m: 16px; --font-size-responsive-l: 4vw; --font-size-l: 18px; --font-size-responsive-xl: 5vw; --font-size-xl: 24px; --font-size-xxl: 25px; --font-size-responsive-xxl2: 7vw; --font-size-xxl2: 32px; --font-size-xxxxl: 55px; --font-size-responsive-xxxxl: 9vw; --font-size-xxxl2: 42px; --font-size-responsive-xxxl2: 10vw; --font-family-poppins: "Poppins"; } /* Variables */ :root { --black: rgba(0, 0, 0, 1); --black-rock: rgba(15, 5, 41, 0.149); --black-rock-2: rgba(15, 5, 41, 0.4); --body-dark: rgba(15, 5, 41, 1); --primary-violet: rgba(88, 31, 245, 1); --alabaster: rgba(249, 250, 254, 1); --supernova: rgba(255, 200, 5, 1); --white: rgba(255, 255, 255, 1); --font-size-s: 12px; --font-size-responsive-m: 3.5vw; --font-size-m: 16px; --font-size-responsive-l: 4vw; --font-size-l: 18px; --font-size-responsive-xl: 5vw; --font-size-xl: 24px; --font-size-xxl: 25px; --font-size-responsive-xxl2: 7vw; --font-size-xxl2: 32px; --font-size-xxxxl: 55px; --font-size-responsive-xxxxl: 9vw; --font-size-xxxl2: 42px; --font-size-responsive-xxxl2: 10vw; --font-family-poppins: "Poppins"; } @media only screen and (max-width: 1000px) { .menuscreen { height: 0%; width: 100%; overflow-y: hidden; border: 2px none; z-index: 1; top: 0; left: 0; background-color: var(--white); } .cta-white-container-menu a div { color: var(--body-dark); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-l); font-weight: 700; font-style: normal; } .cta-white-container-menu div { color: var(--body-dark); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-l); font-weight: 700; font-style: normal; } .cta-white-container-menu .google-maps-link { color: var(--primary-violet); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-l); font-weight: 600; font-style: normal; } } @media only screen and (min-width: 1001px) { .menuscreen { display: none; } } .flex-row { align-items: center; display: flex; width: 100%; height: auto; margin: 0 auto; gap: 10%; } .contact-me-cta-headerline { color: var(--primary-violet); font-family: var(--font-family-poppins); font-size: var(--font-size-m); font-weight: 600; font-style: normal; letter-spacing: 0; line-height: normal; margin-top: -1px; position: relative; width: fit-content; } .contact-cta-text { color: var(--white); font-family: var(--font-family-poppins); font-size: var(--font-size-m); font-weight: 500; letter-spacing: 0.32px; line-height: normal; position: relative; width: fit-content; } .menu-1 { align-items: flex-start; display: flex; height: 46px; min-width: 46px; padding: 10.3px; } .mobile-menu-cta-container-child { align-items: flex-start; flex-direction: column; gap: 2vw; margin-top: 42px; width: 100%; } .mobile-menu-cta-container-child .mobile-menu-cta-headline { color: var(--primary-violet); font-family: var(--font-family-poppins); font-size: var(--font-size-m); font-weight: 600; font-style: normal; } .mobile-menu-cta-container { align-items: flex-start; flex-direction: column; gap: 16px; width: 100%; } .cta-white-container-menu { align-items: center; border: 2px solid; border-color: var(--black-rock); gap: 10px; justify-content: center; padding: 16px 0px !important; width: calc(100% - 4px); display: flex; position: relative; } .cta-white-container-menu button { border: hidden; background: white; } .cta-white-container-menu .cta-white-container-menu-link { align-items: center; gap: 10px; justify-content: center; padding: 0px 13px !important; display: flex; position: relative; } .contact-cta-text { color: var(--white); font-family: var(--font-family-poppins); font-size: var(--font-size-m); font-weight: 500; letter-spacing: 0.32px; line-height: normal; position: relative; width: fit-content; } .whatsapp { height: 29px; min-width: 29px; position: relative; } .menu-cta { display: flex; align-items: center; background-color: var(--primary-violet); gap: 10px; justify-content: center; padding: 16px 0px !important; width: 100% !important; } .menu-header { align-items: center; background-color: var(--white); display: flex; flex-direction: column; height: auto; width: 100%; } .close-button-container { display: flex; overflow-y: auto; height: auto; position: relative; width: 20%; } .close-button-icon-container { align-items: flex-start; display: flex; height: auto; left: 0; width: 100%; top: 0; } .google-map-icon { height: 24px; min-width: 24px; position: relative; } a { color: var(--primary-violet); font-family: var(--font-family-poppins); font-size: var(--font-size-m); font-weight: 600; font-style: normal; letter-spacing: 0; line-height: normal; margin-top: -2px; position: relative; text-decoration: underline; width: fit-content; } /* Variables */ :root { --black: rgba(0, 0, 0, 1); --black-rock: rgba(15, 5, 41, 0.149); --black-rock-2: rgba(15, 5, 41, 0.4); --body-dark: rgba(15, 5, 41, 1); --primary-violet: rgba(88, 31, 245, 1); --alabaster: rgba(249, 250, 254, 1); --supernova: rgba(255, 200, 5, 1); --white: rgba(255, 255, 255, 1); --font-size-s: 12px; --font-size-responsive-m: 3.5vw; --font-size-m: 16px; --font-size-responsive-l: 4vw; --font-size-l: 18px; --font-size-responsive-xl: 5vw; --font-size-xl: 24px; --font-size-xxl: 25px; --font-size-responsive-xxl2: 7vw; --font-size-xxl2: 32px; --font-size-xxxxl: 55px; --font-size-responsive-xxxxl: 9vw; --font-size-xxxl2: 42px; --font-size-responsive-xxxl2: 10vw; --font-family-poppins: "Poppins"; } @media only screen and (max-width: 1000px) and (min-width: 376px) { .cta-purple-container .cta-purple-text { color: var(--white); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-l); font-weight: 500; font-style: normal; letter-spacing: 0.32px; line-height: normal; position: relative; width: fit-content; } .cta-purple-container .cta-purple-text div { color: var(--white); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-l); font-weight: 500; font-style: normal; } .headline-cta-container .headline { color: var(--black); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-xxxxl); font-weight: 600; text-align: center; width: 100%; height: auto; } p.headline-right { color: var(--black); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-m); font-weight: 400; font-style: normal; flex-direction: column; height: auto; width: 100%; } .x02-picture-section .overlap-group .picture-text-container .picture-text { color: var(--black); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-m); font-weight: 400; font-style: normal; letter-spacing: 0; line-height: normal; } .x03-icons-section .card .card-text { color: var(--black); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-m); font-weight: 500; font-style: normal; letter-spacing: 0; line-height: normal; } .x04-section .section-titlebody .cta-headline { color: var(--black); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-xxxl2); font-weight: 600; font-style: normal; letter-spacing: 0; line-height: normal; } .x04-section .icon-body-section .section-card .section-card-text { letter-spacing: 0; line-height: normal; margin-top: -1px; } .x04-section .icon-body-section .section-card .section-card-text span:nth-child(1) { color: var(--black); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-l); font-weight: 700; font-style: normal; } .x04-section .icon-body-section .section-card .section-card-text span:nth-child(2) { color: var(--black); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-m); font-weight: 400; font-style: normal; } .x04-section .icon-body-section .section-card-2 p { color: var(--black); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-l); font-weight: 700; font-style: normal; } .x05-about-me-section .about-me-header-mobile .about-me-mobile { color: var(--black); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-xxxl2); font-weight: 600; font-style: normal; letter-spacing: 0; line-height: normal; } .x05-about-me-section .about-me-container .about-me-text { color: var(--black); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-m); font-weight: 400; font-style: normal; } .x05-about-me-section .flex-col .headline-about-me { color: var(--black); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-xl); font-weight: 600; letter-spacing: 0; line-height: normal; } .x05-about-me-section .flex-col .carpenter { color: var(--black); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-m); font-weight: 400; font-style: normal; letter-spacing: 0; line-height: normal; } .x05-about-me-section .flex-col .energy-consultant { color: var(--black); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-m); font-weight: 400; font-style: normal; letter-spacing: 0; line-height: normal; } .x06-contact-me-section .contact-me-headline { color: var(--black); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-xxxl2); font-weight: 600; font-style: normal; } .x06-contact-me-section .contact-me-text { color: var(--black); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-m); font-weight: 400; font-style: normal; letter-spacing: 0; line-height: normal; } .footer .footer-group-container .footer-middle-group-container .footer-middle-group .footer-text { color: var(--primary-violet); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-l); font-weight: 600; font-style: normal; } .footer .footer-group-container .footer-middle-group-container .footer-middle-group .phone-link-container { color: var(--body-dark); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-l); font-weight: 700; font-style: normal; } .footer .footer-group-container .footer-middle-group-container .footer-middle-group .phone-link-container .footer-text { color: var(--body-dark); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-l); font-weight: 700; font-style: normal; } .footer .footer-group-container .footer-middle-group-container .footer-middle-group .email-container-footer { color: var(--body-dark); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-l); font-weight: 700; font-style: normal; } .footer .footer-group-container .footer-middle-group-container .footer-middle-group .email-container-footer .footer-text { color: var(--body-dark); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-l); font-weight: 700; font-style: normal; } .footer .footer-group-container .footer-address-container .footer-text { color: var(--primary-violet); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-l); font-weight: 600; font-style: normal; } .footer .footer-group-container .footer-address-container .address-line-container .footer-text { color: var(--body-dark); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-l); font-weight: 700; font-style: normal; } .footer .footer-group-container .footer-address-container .google-maps-location-container a { color: var(--primary-violet); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-l); font-weight: 600; font-style: normal; letter-spacing: 0; } } /* Variables */ :root { --black: rgba(0, 0, 0, 1); --black-rock: rgba(15, 5, 41, 0.149); --black-rock-2: rgba(15, 5, 41, 0.4); --body-dark: rgba(15, 5, 41, 1); --primary-violet: rgba(88, 31, 245, 1); --alabaster: rgba(249, 250, 254, 1); --supernova: rgba(255, 200, 5, 1); --white: rgba(255, 255, 255, 1); --font-size-s: 12px; --font-size-responsive-m: 3.5vw; --font-size-m: 16px; --font-size-responsive-l: 4vw; --font-size-l: 18px; --font-size-responsive-xl: 5vw; --font-size-xl: 24px; --font-size-xxl: 25px; --font-size-responsive-xxl2: 7vw; --font-size-xxl2: 32px; --font-size-xxxxl: 55px; --font-size-responsive-xxxxl: 9vw; --font-size-xxxl2: 42px; --font-size-responsive-xxxl2: 10vw; --font-family-poppins: "Poppins"; } @media only screen and (max-width: 375px) { .cta-purple-container .cta-purple-text { color: var(--white); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-l); font-weight: 500; font-style: normal; letter-spacing: 0.32px; line-height: normal; position: relative; width: fit-content; } .cta-purple-container .cta-purple-text div { color: var(--white); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-l); font-weight: 500; font-style: normal; } .headline-cta-container .headline { color: var(--black); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-xxxxl); font-weight: 600; text-align: center; width: 100%; height: auto; } p.headline-right { color: var(--black); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-m); font-weight: 400; font-style: normal; flex-direction: column; height: auto; width: 100%; } .x02-picture-section .overlap-group .picture-text-container .picture-text { color: var(--black); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-m); font-weight: 400; font-style: normal; letter-spacing: 0; line-height: normal; } .x03-icons-section .card .card-text { color: var(--black); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-m); font-weight: 500; font-style: normal; letter-spacing: 0; line-height: normal; } .x04-section .section-titlebody .cta-headline { color: var(--black); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-xxxl2); font-weight: 600; font-style: normal; letter-spacing: 0; line-height: normal; } .x04-section .icon-body-section .section-card .section-card-text { letter-spacing: 0; line-height: normal; margin-top: -1px; } .x04-section .icon-body-section .section-card .section-card-text span:nth-child(1) { color: var(--black); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-l); font-weight: 700; font-style: normal; } .x04-section .icon-body-section .section-card .section-card-text span:nth-child(2) { color: var(--black); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-m); font-weight: 400; font-style: normal; } .x04-section .icon-body-section .section-card-2 p { color: var(--black); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-l); font-weight: 700; font-style: normal; } .x05-about-me-section .about-me-header-mobile .about-me-mobile { color: var(--black); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-xxxl2); font-weight: 600; font-style: normal; letter-spacing: 0; line-height: normal; } .x05-about-me-section .about-me-container .about-me-text { color: var(--black); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-m); font-weight: 400; font-style: normal; } .x05-about-me-section .flex-col .headline-about-me { color: var(--black); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-xl); font-weight: 600; letter-spacing: 0; line-height: normal; } .x05-about-me-section .flex-col .carpenter { color: var(--black); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-m); font-weight: 400; font-style: normal; letter-spacing: 0; line-height: normal; } .x05-about-me-section .flex-col .energy-consultant { color: var(--black); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-m); font-weight: 400; font-style: normal; letter-spacing: 0; line-height: normal; } .x06-contact-me-section .contact-me-headline { color: var(--black); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-xxxl2); font-weight: 600; font-style: normal; } .x06-contact-me-section .contact-me-text { color: var(--black); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-m); font-weight: 400; font-style: normal; letter-spacing: 0; line-height: normal; } .footer .footer-group-container .footer-middle-group-container .footer-middle-group .footer-text { color: var(--primary-violet); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-l); font-weight: 600; font-style: normal; } .footer .footer-group-container .footer-middle-group-container .footer-middle-group .phone-link-container { color: var(--body-dark); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-l); font-weight: 700; font-style: normal; } .footer .footer-group-container .footer-middle-group-container .footer-middle-group .phone-link-container .footer-text { color: var(--body-dark); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-l); font-weight: 700; font-style: normal; } .footer .footer-group-container .footer-middle-group-container .footer-middle-group .email-container-footer { color: var(--body-dark); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-l); font-weight: 700; font-style: normal; } .footer .footer-group-container .footer-middle-group-container .footer-middle-group .email-container-footer .footer-text { color: var(--body-dark); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-l); font-weight: 700; font-style: normal; } .footer .footer-group-container .footer-address-container .footer-text { color: var(--primary-violet); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-l); font-weight: 600; font-style: normal; } .footer .footer-group-container .footer-address-container .address-line-container .footer-text { color: var(--body-dark); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-l); font-weight: 700; font-style: normal; } .footer .footer-group-container .footer-address-container .google-maps-location-container a { color: var(--primary-violet); font-family: var(--font-family-poppins); font-size: var(--font-size-responsive-l); font-weight: 600; font-style: normal; letter-spacing: 0; } } @media only screen and (max-width: 1000px) { .landing { align-items: flex-start; border: 2px none; height: auto; width: 100%; overflow-y: hidden; overflow-x: hidden; } .header { width: 100%; height: auto; display: flex; margin: 0 auto; gap: 10%; } .logo { flex-direction: row; width: 100%; height: auto; display: flex; } .logo img.logo-top { height: auto; width: 22%; } .logo img.logo-bottom { height: auto; width: 78%; } .menu-container { display: flex; overflow-y: auto; height: auto; position: relative; width: 20%; } .menu-icon-container { align-items: flex-start; display: flex; height: auto; left: 0; width: 100%; position: absolute; top: 0; } .menu-icon { width: 100%; height: auto; } .mobile-switch { display: none; } .cta-purple-container { justify-content: center; width: auto; background-color: var(--primary-violet); display: flex; position: relative; margin: 0 auto; gap: 10px; padding: 16px 25px; } .titlebody { flex-direction: column; height: fit-content; gap: 36px; min-width: inherit; width: 100%; } .x02-picture-section { flex-direction: inherit; min-width: inherit; align-items: inherit; margin-top: 0px; border: inherit; width: inherit; } .x02-picture-section .overlap-group { min-height: 220px; height: auto; margin-top: 62px; width: 100%; background-image: url(./images/header-left.png); } .x02-picture-section .overlap-group .picture-text-container { border: 1.19px solid; border-color: var(--black-rock); gap: 11.86px; padding: 11.86px; width: 60vw; margin: 0 auto; background-color: var(--white); -ms-transform: translate(0%, 30%); transform: translate(0%, 30%); } .x02-picture-section .overlap-group .picture-text-container .picture-text { margin-top: -2px; position: relative; width: fit-content; } .x02-picture-section .house-pic { width: 100%; display: flex; } .x03-icons-section { margin: 0 auto; height: auto; width: 100%; left: 80%; top: 50%; } .x03-icons-section .card { padding-top: 25vw; margin: 0 auto; width: 60%; } .x03-icons-section .card .icon { margin: 0 auto; padding-left: 16vw; height: auto; width: 70%; } .x03-icons-section .card .icon-1 { align-self: flex-end; height: auto; width: 100%; } .x03-icons-section .card .icon-4 { margin-right: 2px; padding-left: 16vw; } .x03-icons-section .card .card-text { min-height: 24px; text-align: center; } .x03-icons-section .card .energy-card-text { min-height: 72px; min-width: 229px; text-align: center; } .x03-icons-section .card .subsidies-card-text { min-height: 48px; min-width: 234px; text-align: center; } .x04-section { flex-direction: column; gap: 113px; } .x04-section .section-titlebody { align-items: flex-start; display: flex; flex-direction: column; gap: 36px; margin-bottom: 1px; position: relative; width: fit-content; } .x04-section .section-titlebody .cta-headline { margin-top: -1px; position: relative; width: 100%; text-align: center; padding-top: 10vw; } .x04-section .section-titlebody .cta-bottom { width: 100% !important; padding: 16px 0px; } .x04-section .icon-body-section .section-card { padding-top: 10vw; flex-direction: row; overflow: auto; align-items: flex-start; position: relative; width: fit-content; display: flex; gap: 10vw; } .x04-section .icon-body-section .section-card .section-card-icon { padding-left: 5vw; } .x04-section .icon-body-section .section-card .section-card-text { position: relative; width: 100%; } .x05-about-me-section { align-items: flex-start; display: flex; height: auto; margin-right: 67px; margin-top: 60px; width: 100%; gap: 5vw; flex-direction: column; } .x05-about-me-section .about-me-header-mobile { display: flex; width: 100%; align-items: center; } .x05-about-me-section .about-me-header-mobile .avatar { width: 30vw; height: auto; padding-right: 10vw; padding-left: 5vw; } .x05-about-me-section .about-me-header-mobile .about-me-mobile { margin-top: -1px; position: relative; } .x05-about-me-section .about-me-container { flex-direction: column; gap: 16px; width: fit-content; display: flex; position: relative; } .x05-about-me-section .about-me-container .about-me { display: none; } .x05-about-me-section .about-me-container .about-me-text { width: 100%; } .x05-about-me-section .flex-col .headline-about-me { min-height: 36px; } .x05-about-me-section .flex-col .carpenter { margin-top: 23px; min-height: 24px; width: 319px; } .x05-about-me-section .flex-col .energy-consultant { min-height: 24px; width: 319px; } .x05-about-me-section .flex-col .expert-logo { height: auto; margin-top: 22px; object-fit: cover; width: 100%; } .x06-contact-me-section { align-items: flex-start; align-self: flex-start; flex-direction: column; gap: 16px; margin-top: 120px; width: 100%; } .x06-contact-me-section .contact-me-text { position: relative; width: 100%; padding: 16px 0px; } .footer { align-items: flex-start; background-color: transparent; display: flex; flex-direction: column; flex-shrink: 1; justify-content: flex-start; margin-left: 4px; margin-top: 10vw; width: 100%; } .footer .footer-group-container { background-color: var(--alabaster); gap: 24px; height: auto; width: 100%; align-items: flex-start; flex-direction: column; display: flex; } .footer .footer-group-container .footer-left-group-container { align-items: center; display: flex; flex-direction: column; gap: 39px; height: auto; width: 100%; } .footer .footer-group-container .footer-left-group-container .bottom-logo-container { flex-direction: row; width: 70%; height: auto; display: flex; align-items: flex-end; padding-right: 30vw; } .footer .footer-group-container .footer-left-group-container .bottom-logo-container .logo-bottom-footer { height: auto; width: 78%; } .footer .footer-group-container .footer-left-group-container .bottom-logo-container .logo-top-footer { height: auto; width: 22%; } .footer .footer-group-container .footer-middle-group-container { align-self: center; gap: 68px; height: auto; min-width: 100%; align-items: flex-start; display: flex; flex-direction: column; } .footer .footer-group-container .footer-middle-group-container .footer-middle-group { flex-direction: column; min-height: 153px; width: 100%; align-items: flex-start; display: flex; gap: 10px; } .footer .footer-group-container .footer-middle-group-container .footer-middle-group .footer-contact-me-headline { letter-spacing: 0; line-height: normal; min-height: 27px; } .footer .footer-group-container .footer-middle-group-container .footer-middle-group .phone-link-container { gap: 10px; padding: 16px 25px 16px 0px; height: 18px; margin-right: 54.5px; min-width: 266px; align-items: flex-start; display: flex; } .footer .footer-group-container .footer-middle-group-container .footer-middle-group .email-container-footer { align-items: flex-start; gap: 10px; padding: 16px 25px 16px 0px; width: 100%; display: flex; position: relative; } .footer .footer-group-container .footer-middle-group-container .footer-middle-group .email-container-footer .email-container-footer-link { align-items: center; gap: 10px; justify-content: center; padding-right: 13px !important; display: flex; position: relative; } .footer .footer-group-container .footer-middle-group-container .footer-middle-group .email-container-footer .email-container-footer-link .email-icon { height: 24px; min-width: 24px; position: relative; } .footer .footer-group-container .footer-middle-group-container .footer-middle-group .email-container-footer button { border: hidden; background: white; } .footer .footer-group-container .footer-address-container { flex-direction: column; min-height: 153px; width: 100%; align-items: flex-start; display: flex; } .footer .footer-group-container .footer-address-container .location { letter-spacing: 0; line-height: normal; min-height: 27px; } .footer .footer-group-container .footer-address-container .address-line-container { align-items: flex-start; gap: 10px; margin-top: 8px; padding: 16px 25px 16px 0px; width: fit-content; display: flex; position: relative; } .footer .footer-group-container .footer-address-container .address-line-container .address { letter-spacing: 0.36px; line-height: normal; margin-top: -2px; position: relative; width: fit-content; } .footer .footer-group-container .footer-address-container .google-maps-location-container { align-items: flex-start; gap: 10px; padding: 16px 25px 16px 0px; width: 100%; display: flex; position: relative; } .footer .footer-group-container .footer-address-container .google-maps-location-container .google-map-icon { height: 24px; min-width: 24px; position: relative; } .footer .footer-group-container .footer-address-container .google-maps-location-container a { line-height: normal; margin-right: -19px; margin-top: -2px; position: relative; text-decoration: underline; width: fit-content; } } a { text-decoration: none; } @media only screen and (min-width: 1001px) { .menuscreen { display: none; } .landing { align-items: center; background-color: var(--white); border: 1px none; display: flex; flex-direction: column; height: 3301px; overflow: hidden; width: 100%; } .header { align-items: center; display: flex; margin-right: 55px; margin-top: 20px; min-width: 1295px; flex-direction: row; } .menu-container { display: None; } .mobile-switch { display: flex; } .call-button-container { margin-left: 370px !important; } .contact-button-container { margin-left: 36px !important; } .cta-white-container { align-items: flex-start; border: 2px solid; border-color: var(--black-rock); gap: 10px; margin-bottom: 1px; padding: 16px 25px; position: relative; width: fit-content; } .cta-white-container .icon-container { height: 24px; min-width: 24px; position: relative; } .cta-white-container a.phone { color: var(--body-dark); font-family: var(--font-family-poppins); font-size: var(--font-size-l); font-weight: 700; font-style: normal; letter-spacing: 1.44px; line-height: normal; margin-top: -2px; position: relative; width: fit-content; padding-right: 24px; } .cta-white-container a.phone .span { color: var(--body-dark); font-family: var(--font-family-poppins); font-size: var(--font-size-l); font-weight: 700; font-style: normal; } .cta-white-container .contact-me-text-top { color: var(--body-dark); font-family: var(--font-family-poppins); font-size: var(--font-size-l); font-weight: 500; font-style: normal; letter-spacing: 0.36px; line-height: normal; margin-top: -2px; position: relative; width: fit-content; } .cta-purple-container { align-items: center; background-color: var(--primary-violet); gap: 10px; padding: 16px 25px; width: fit-content; display: flex; position: relative; } .cta-purple-container .cta-purple-text { color: var(--white); font-family: var(--font-family-poppins); font-size: var(--font-size-l); font-weight: 500; font-style: normal; letter-spacing: 0.36px; line-height: normal; position: relative; width: fit-content; } .cta-purple-container .cta-purple-text div { color: var(--white); font-family: var(--font-family-poppins); font-size: var(--font-size-l); font-weight: 500; font-style: normal; } .menu-container { display: None; } .titlebody { align-items: center; display: flex; gap: 87px; height: 346px; margin-left: 2px; margin-top: 100px; min-width: 1242px; } .titlebody .headline-cta-container .headline { color: var(--black); font-family: var(--font-family-poppins); font-size: var(--font-size-xxxxl); font-weight: 600; letter-spacing: 0; line-height: normal; margin-top: -1px; position: relative; width: 591px; } .titlebody p.headline-right { color: var(--black); font-family: var(--font-family-poppins); font-size: var(--font-size-m); font-weight: 400; font-style: normal; letter-spacing: 0; line-height: normal; min-height: 264px; width: 562px; } .x02-picture-section { align-items: flex-start; display: flex; gap: 16px; margin-top: 120px; min-width: 100%; } .x02-picture-section .overlap-group { align-items: flex-start; background-image: url(./images/header-left.png); background-position: 50% 50%; background-size: cover; display: flex; height: 371px; min-width: 905px; } .x02-picture-section .overlap-group .picture-text-container { align-items: flex-start; background-color: var(--white); border: 2px solid; border-color: var(--black-rock); gap: 20px; padding: 20px; display: flex; position: relative; top: 127px; left: 147px; } .x02-picture-section .overlap-group .picture-text-container .picture-text { color: var(--black); font-family: var(--font-family-poppins); font-size: var(--font-size-m); font-weight: 400; font-style: normal; } .x02-picture-section .house-pic { height: 371px; object-fit: cover; width: 100%; } .x03-icons-section { align-items: flex-start; display: flex; gap: 107px; height: 217px; margin-left: 0.5px; margin-top: 60px; min-width: 1240px; } .x03-icons-section .card { align-items: flex-start; display: flex; flex-direction: column; gap: 18px; min-height: 169px; width: 204px; } .x03-icons-section .card .icon { margin-right: 2px; } .x03-icons-section .card .icon-1 { align-self: flex-end; height: 127px; width: 176px; } .x03-icons-section .card .icon-4 { margin-right: 2px; } .x03-icons-section .card .card-text { color: var(--black); font-family: var(--font-family-poppins); font-size: var(--font-size-m); font-weight: 500; font-style: normal; letter-spacing: 0; line-height: normal; margin-top: -1px; position: relative; width: 600px; } .x03-icons-section .card .energy-card-text { min-height: 72px; min-width: 229px; } .x03-icons-section .card .subsidies-card-text { min-height: 48px; min-width: 234px; } .x04-section { align-items: center; background-color: var(--alabaster); display: flex; gap: 113px; height: 606px; margin-top: 60px; min-width: 100%; padding: 60px; } .x04-section .section-titlebody { align-items: flex-start; display: flex; flex-direction: column; margin-bottom: 1px; position: relative; width: fit-content; } .x04-section .section-titlebody .cta-headline { color: var(--black); font-family: var(--font-family-poppins); font-size: var(--font-size-xxxl2); font-weight: 600; font-style: normal; letter-spacing: 0; line-height: normal; margin-top: -1px; position: relative; width: 437px; margin-left: 100px; } .x04-section .section-titlebody .cta-bottom { align-items: center; align-self: flex-start; margin-left: 100px; } .x04-section .icon-body-section .section-card { align-items: flex-start; gap: 30px; width: fit-content; display: flex; position: relative; } .x04-section .icon-body-section .section-card .section-card-text { letter-spacing: 0; line-height: normal; margin-top: -1px; position: relative; width: 600px; } .x04-section .icon-body-section .section-card .section-card-text span:nth-child(1) { color: var(--black); font-family: var(--font-family-poppins); font-size: var(--font-size-l); font-weight: 700; font-style: normal; } .x04-section .icon-body-section .section-card .section-card-text span:nth-child(2) { color: var(--black); font-family: var(--font-family-poppins); font-size: var(--font-size-m); font-weight: 400; font-style: normal; } .x04-section .icon-body-section .section-card-2 { align-items: center; justify-content: center; } .x04-section .icon-body-section .section-card-2 p { color: var(--black); font-family: var(--font-family-poppins); font-size: var(--font-size-l); font-weight: 700; font-style: normal; } .x05-about-me-section { align-items: flex-start; display: flex; height: 271px; margin-right: 67px; margin-top: 60px; min-width: 1173px; } .x05-about-me-section .about-me-header-mobile .avatar { height: 184px; width: 184px; } .x05-about-me-section .about-me-header-mobile .about-me-mobile { display: none; } .x05-about-me-section .about-me-container { align-items: flex-start; flex-direction: column; gap: 16px; margin-left: 60px; width: 458px; display: flex; position: relative; } .x05-about-me-section .about-me-container .about-me { color: var(--black); font-family: var(--font-family-poppins); font-size: var(--font-size-xxxl2); font-weight: 600; font-style: normal; letter-spacing: 0; line-height: normal; margin-top: -1px; position: relative; width: 426px; } .x05-about-me-section .about-me-container .about-me-text { color: var(--black); font-family: var(--font-family-poppins); font-size: var(--font-size-m); font-weight: 400; font-style: normal; letter-spacing: 0; line-height: normal; position: relative; width: 436px; } .x05-about-me-section .flex-col { align-items: flex-start; align-self: center; display: flex; flex-direction: column; margin-bottom: 34px; margin-left: 88px; min-height: 197px; } .x05-about-me-section .flex-col .headline-about-me { color: var(--black); font-family: var(--font-family-poppins); font-size: var(--font-size-xl); font-weight: 600; letter-spacing: 0; line-height: normal; } .x05-about-me-section .flex-col .carpenter { color: var(--black); font-family: var(--font-family-poppins); font-size: var(--font-size-m); font-weight: 400; font-style: normal; letter-spacing: 0; line-height: normal; margin-top: 23px; min-height: 24px; } .x05-about-me-section .flex-col .energy-consultant { color: var(--black); font-family: var(--font-family-poppins); font-size: var(--font-size-m); font-weight: 400; font-style: normal; letter-spacing: 0; line-height: normal; min-height: auto; font-size: var(--font-size-responsive-m2) !important; } .x05-about-me-section .flex-col .expert-logo { height: 92px; margin-top: 22px; object-fit: cover; } .x06-contact-me-section { align-items: flex-start; align-self: flex-start; flex-direction: column; gap: 16px; margin-left: 100px; margin-top: 120px; width: fit-content; } .x06-contact-me-section .contact-me-headline { color: var(--black); font-family: var(--font-family-poppins); font-size: var(--font-size-xxxl2); font-weight: 600; font-style: normal; } .x06-contact-me-section .contact-me-text { color: var(--black); font-family: var(--font-family-poppins); font-size: var(--font-size-m); font-weight: 400; font-style: normal; letter-spacing: 0; line-height: normal; position: relative; width: 457px; } .cta-bottom-2 { align-self: flex-start; margin-left: 100px; margin-top: 36px; } .footer { align-items: flex-start; background-color: transparent; display: flex; flex-direction: row; flex-shrink: 1; justify-content: flex-start; margin-left: 4px; margin-top: 185px; min-width: 100%; width: auto; } .footer .footer-group-container { background-color: var(--alabaster); gap: 24px; height: 273px; min-width: 100%; align-items: flex-start; display: flex; } .footer .footer-group-container .footer-left-group-container { align-items: center; display: flex; flex-direction: column; gap: 39px; min-height: 195px; width: 410px; } .footer .footer-group-container .footer-left-group-container .bottom-logo-container { align-items: flex-end; background-image: url(./images/rectangle.svg); background-size: 100% 100%; display: flex; height: 138px; min-width: 410px; } .footer .footer-group-container .footer-left-group-container .bottom-logo-container .logo-bottom-footer { height: 40px; margin-bottom: 36px; width: 203px; } .footer .footer-group-container .footer-left-group-container .bottom-logo-container .logo-top-footer { margin-bottom: 31px; height: 50px; width: 51px; margin-left: 35px; } .footer .footer-group-container .footer-middle-group-container { align-self: center; gap: 68px; height: 153px; min-width: 907px; align-items: flex-start; display: flex; } .footer .footer-group-container .footer-middle-group-container .footer-middle-group { flex-direction: column; height: auto; width: 100%; align-items: flex-start; display: flex; } .footer .footer-group-container .footer-middle-group-container .footer-middle-group .footer-text { color: var(--primary-violet); font-family: var(--font-family-poppins); font-size: var(--font-size-l); font-weight: 600; font-style: normal; letter-spacing: 0.36px; line-height: normal; margin-top: -2px; position: relative; width: fit-content; } .footer .footer-group-container .footer-middle-group-container .footer-middle-group .footer-contact-me-headline { letter-spacing: 0; line-height: normal; min-height: 27px; } .footer .footer-group-container .footer-middle-group-container .footer-middle-group .phone-link-container { color: var(--body-dark); font-family: var(--font-family-poppins); font-size: var(--font-size-l); font-weight: 700; font-style: normal; align-items: flex-start; gap: 10px; margin-top: 8px; padding: 16px 25px 16px 0px; width: fit-content; display: flex; position: relative; } .footer .footer-group-container .footer-middle-group-container .footer-middle-group .phone-link-container .footer-text { color: var(--body-dark); font-family: var(--font-family-poppins); font-size: var(--font-size-l); font-weight: 700; font-style: normal; } .footer .footer-group-container .footer-middle-group-container .footer-middle-group .email-container-footer { color: var(--body-dark); font-family: var(--font-family-poppins); font-size: var(--font-size-l); font-weight: 500; font-style: normal; align-items: flex-start; gap: 10px; padding: 16px 25px 16px 0px; width: 415px; display: flex; position: relative; } .footer .footer-group-container .footer-middle-group-container .footer-middle-group .email-container-footer .email-container-footer-link { display: flex; align-items: flex-start; gap: 10px; position: relative; padding-top: 6px; } .footer .footer-group-container .footer-middle-group-container .footer-middle-group .email-container-footer .email-container-footer-link .email-icon { height: 24px; min-width: 24px; position: relative; } .footer .footer-group-container .footer-middle-group-container .footer-middle-group .email-container-footer button { border: hidden; background: white; } .footer .footer-group-container .footer-middle-group-container .footer-middle-group .email-container-footer .footer-text { color: var(--body-dark); font-family: var(--font-family-poppins); font-size: var(--font-size-l); font-weight: 500; font-style: normal; letter-spacing: 0.36px; line-height: normal; margin-top: -2px; position: relative; width: fit-content; } .footer .footer-group-container .footer-address-container { flex-direction: column; min-height: 153px; width: 422px; align-items: flex-start; display: flex; } .footer .footer-group-container .footer-address-container .footer-text { color: var(--primary-violet); font-family: var(--font-family-poppins); font-size: var(--font-size-l); font-weight: 600; font-style: normal; letter-spacing: 0.36px; line-height: normal; margin-top: -2px; position: relative; width: fit-content; } .footer .footer-group-container .footer-address-container .location { letter-spacing: 0; line-height: normal; min-height: 27px; } .footer .footer-group-container .footer-address-container .address-line-container { align-items: flex-start; gap: 10px; margin-top: 8px; padding: 16px 25px 16px 0px; width: fit-content; display: flex; position: relative; } .footer .footer-group-container .footer-address-container .address-line-container .footer-text { color: var(--body-dark); font-family: var(--font-family-poppins); font-size: var(--font-size-l); font-weight: 500; font-style: normal; letter-spacing: 0.36px; line-height: normal; margin-top: -2px; position: relative; width: fit-content; } .footer .footer-group-container .footer-address-container .address-line-container .address { letter-spacing: 0.36px; line-height: normal; margin-top: -2px; position: relative; width: fit-content; } .footer .footer-group-container .footer-address-container .google-maps-location-container { align-items: flex-start; gap: 10px; padding: 16px 25px 16px 0px; width: 420px; display: flex; position: relative; } .footer .footer-group-container .footer-address-container .google-maps-location-container .google-map-icon { height: 24px; min-width: 24px; position: relative; } .footer .footer-group-container .footer-address-container .google-maps-location-container a { color: var(--primary-violet); font-family: var(--font-family-poppins); font-size: var(--font-size-l); font-weight: 600; font-style: normal; letter-spacing: 0; line-height: normal; margin-right: -19px; margin-top: -2px; position: relative; text-decoration: underline; width: fit-content; } } /*# sourceMappingURL=styles.css.map */