.desktop {
  background-color: #f4f4f4;
  display: flex;
  flex-direction: row;
  justify-content: center;
  width: 100%;
}

.desktop .div {
  background-color: #f4f4f4;
  overflow: hidden;
  width: 1440px;
  height: 3681px;
  position: relative;
}

.desktop .overlap {
  position: absolute;
  width: 343px;
  height: 121px;
  top: 218px;
  left: 188px;
  background-color: #ffffff99;
}

.desktop .text-wrapper {
  position: absolute;
  top: 30px;
  left: 86px;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 500;
  color: #1f3b6f;
  font-size: 28px;
  text-align: center;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .p {
  position: absolute;
  top: 70px;
  left: 91px;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 400;
  color: #1a1a1a;
  font-size: 16px;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .license {
  position: absolute;
  width: 24px;
  height: 24px;
  top: 37px;
  left: 54px;
}

.desktop .overlap-group {
  position: absolute;
  width: 1063px;
  height: 806px;
  top: 353px;
  left: 188px;
  background-color: #ffffff;
}

.desktop .group {
  position: absolute;
  width: 325px;
  height: 633px;
  top: 86px;
  left: 25px;
}

.desktop .overlap-group-2 {
  position: relative;
  height: 633px;
  top: 25%;
}

.desktop .stahlbeton {
  position: absolute;
  width: 325px;
  height: 187px;
  top: 120px;
  left: 0;
  object-fit: cover;
}

.desktop .bitumenlack-VS {
  position: absolute;
  width: 325px;
  height: 92px;
  top: 120px;
  left: 0;
  object-fit: cover;
}

.desktop .BIKUPLAN-EGV {
  position: absolute;
  width: 325px;
  height: 93px;
  top: 118px;
  left: 0;
  object-fit: cover;
}

.desktop .PIR-alu-wrmedmmung {
  position: absolute;
  width: 325px;
  height: 160px;
  top: 49px;
  left: 0;
  object-fit: cover;
}

.desktop .img {
  position: absolute;
  width: 325px;
  height: 93px;
  top: 48px;
  left: 0;
  object-fit: cover;
}

.desktop .BIKUTOP-WF-s {
  position: absolute;
  width: 325px;
  height: 94px;
  top: 46px;
  left: 0;
  object-fit: cover;
}

.desktop .drain {
  position: absolute;
  width: 325px;
  height: 102px;
  top: 36px;
  left: 0;
  object-fit: cover;
}

.desktop .splittbett {
  position: absolute;
  width: 325px;
  height: 115px;
  top: 19px;
  left: 0;
  object-fit: cover;
}

.desktop .gehbelag-nutzschicht {
  position: absolute;
  width: 325px;
  height: 112px;
  top: 0;
  left: 0;
  object-fit: cover;
}

.desktop .untergrund {
  position: absolute;
  width: 301px;
  top: 668px;
  left: 448px;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 400;
  color: #1a1a1a;
  font-size: 13px;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .span {
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 400;
  color: #1a1a1a;
  font-size: 13px;
  letter-spacing: 0;
}

.desktop .text-wrapper-2 {
  font-weight: 500;
  font-size: 16px;
}

.desktop .group-2 {
  position: absolute;
  width: 327px;
  height: 39px;
  top: 102px;
  left: 424px;
}

.desktop .div-2 {
  position: absolute;
  width: 301px;
  top: 0;
  left: 24px;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 400;
  color: #1a1a1a;
  font-size: 13px;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .ellipse {
  top: 6px;
  left: 0;
  position: absolute;
  width: 8px;
  height: 8px;
  background-color: #f0434e;
  border-radius: 4px;
}

.desktop .group-3 {
  position: absolute;
  width: 327px;
  height: 39px;
  top: 165px;
  left: 424px;
}

.desktop .group-4 {
  position: absolute;
  width: 327px;
  height: 39px;
  top: 291px;
  left: 424px;
}

.desktop .group-5 {
  position: absolute;
  width: 327px;
  height: 39px;
  top: 228px;
  left: 424px;
}

.desktop .group-6 {
  position: absolute;
  width: 327px;
  height: 39px;
  top: 354px;
  left: 424px;
}

.desktop .group-7 {
  position: absolute;
  width: 327px;
  height: 39px;
  top: 417px;
  left: 424px;
}

.desktop .group-8 {
  position: absolute;
  width: 327px;
  height: 39px;
  top: 480px;
  left: 424px;
}

.desktop .group-9 {
  position: absolute;
  width: 327px;
  height: 39px;
  top: 543px;
  left: 424px;
}

.desktop .group-10 {
  position: absolute;
  width: 327px;
  height: 39px;
  top: 606px;
  left: 424px;
}

.desktop .ellipse-2 {
  top: 675px;
  left: 424px;
  position: absolute;
  width: 8px;
  height: 8px;
  background-color: #f0434e;
  border-radius: 4px;
}

.desktop .text-wrapper-3 {
  top: 669px;
  left: 859px;
  color: #f0434e;
  font-size: 16px;
  text-align: right;
  position: absolute;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 400;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .expand-more {
  position: absolute;
  width: 20px;
  height: 20px;
  top: 671px;
  left: 989px;
}

.desktop .text-wrapper-4 {
  position: absolute;
  top: 542px;
  left: 898px;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 400;
  color: #f0434e;
  font-size: 16px;
  text-align: right;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .expand-more-2 {
  top: 544px;
  left: 989px;
  position: absolute;
  width: 20px;
  height: 20px;
}

.desktop .text-wrapper-5 {
  top: 480px;
  position: absolute;
  left: 898px;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 400;
  color: #f0434e;
  font-size: 16px;
  text-align: right;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .expand-more-3 {
  top: 482px;
  left: 989px;
  position: absolute;
  width: 20px;
  height: 20px;
}

.desktop .text-wrapper-6 {
  position: absolute;
  top: 480px;
  left: 802px;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 400;
  color: #f0434e;
  font-size: 16px;
  text-align: right;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .expand-more-4 {
  top: 482px;
  left: 846px;
  position: absolute;
  width: 20px;
  height: 20px;
}

.desktop .text-wrapper-7 {
  top: 418px;
  position: absolute;
  left: 898px;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 400;
  color: #f0434e;
  font-size: 16px;
  text-align: right;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .expand-more-5 {
  top: 420px;
  left: 989px;
  position: absolute;
  width: 20px;
  height: 20px;
}

.desktop .text-wrapper-8 {
  position: absolute;
  top: 418px;
  left: 802px;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 400;
  color: #f0434e;
  font-size: 16px;
  text-align: right;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .expand-more-6 {
  top: 420px;
  left: 846px;
  position: absolute;
  width: 20px;
  height: 20px;
}

.desktop .text-wrapper-9 {
  top: 356px;
  position: absolute;
  left: 898px;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 400;
  color: #f0434e;
  font-size: 16px;
  text-align: right;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .expand-more-7 {
  top: 358px;
  left: 989px;
  position: absolute;
  width: 20px;
  height: 20px;
}

.desktop .text-wrapper-10 {
  top: 294px;
  position: absolute;
  left: 898px;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 400;
  color: #f0434e;
  font-size: 16px;
  text-align: right;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .expand-more-8 {
  top: 296px;
  left: 989px;
  position: absolute;
  width: 20px;
  height: 20px;
}

.desktop .text-wrapper-11 {
  top: 232px;
  position: absolute;
  left: 898px;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 400;
  color: #f0434e;
  font-size: 16px;
  text-align: right;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .expand-more-9 {
  top: 234px;
  left: 989px;
  position: absolute;
  width: 20px;
  height: 20px;
}

.desktop .line {
  position: absolute;
  width: 595px;
  height: 1px;
  top: 655px;
  left: 418px;
  object-fit: cover;
}

.desktop .line-2 {
  position: absolute;
  width: 595px;
  height: 1px;
  top: 591px;
  left: 418px;
  object-fit: cover;
}

.desktop .line-3 {
  position: absolute;
  width: 595px;
  height: 1px;
  top: 528px;
  left: 418px;
  object-fit: cover;
}

.desktop .line-4 {
  position: absolute;
  width: 595px;
  height: 1px;
  top: 465px;
  left: 418px;
  object-fit: cover;
}

.desktop .line-5 {
  position: absolute;
  width: 595px;
  height: 1px;
  top: 403px;
  left: 418px;
  object-fit: cover;
}

.desktop .line-6 {
  position: absolute;
  width: 595px;
  height: 1px;
  top: 340px;
  left: 418px;
  object-fit: cover;
}

.desktop .line-7 {
  position: absolute;
  width: 595px;
  height: 1px;
  top: 276px;
  left: 418px;
  object-fit: cover;
}

.desktop .line-8 {
  position: absolute;
  width: 595px;
  height: 1px;
  top: 213px;
  left: 418px;
  object-fit: cover;
}

.desktop .line-9 {
  position: absolute;
  width: 595px;
  height: 1px;
  top: 151px;
  left: 418px;
  object-fit: cover;
}

.desktop .overlap-2 {
  position: absolute;
  width: 1063px;
  height: 196px;
  top: 1179px;
  left: 188px;
  background-color: #ffffff;
}

.desktop .text-wrapper-12 {
  position: absolute;
  top: 45px;
  left: 50px;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 500;
  color: #1a1a1a;
  font-size: 24px;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .text-wrapper-13 {
  position: absolute;
  top: 102px;
  left: 50px;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 400;
  color: #1a1a1a;
  font-size: 16px;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .frame {
  display: flex;
  width: 315px;
  height: 48px;
  gap: 10px;
  padding: 13px 16px;
  top: 89px;
  left: 367px;
  background-color: #f0f0f0;
  border-radius: 4px;
  overflow: hidden;
  border: 1px solid;
  border-color: #a2a2a2;
  align-items: center;
  position: absolute;
}

.desktop .text-wrapper-14 {
  position: relative;
  width: fit-content;
  margin-top: -0.5px;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 300;
  color: #6d6d6d;
  font-size: 16px;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .frame-2 {
  display: flex;
  width: 315px;
  height: 48px;
  justify-content: space-between;
  padding: 13px 16px;
  top: 89px;
  left: 698px;
  background-color: #f0f0f0;
  border-radius: 4px;
  overflow: hidden;
  border: 1px solid;
  border-color: #a2a2a2;
  align-items: center;
  position: absolute;
}

.desktop .chevron-down {
  position: relative;
  width: 24px;
  height: 24px;
  margin-top: -1px;
  margin-bottom: -1px;
}

.desktop .overlap-3 {
  position: absolute;
  width: 1063px;
  height: 260px;
  top: 1395px;
  left: 188px;
  background-color: #ffffff;
}

.desktop .text-wrapper-15 {
  position: absolute;
  top: 46px;
  left: 50px;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 500;
  color: #1a1a1a;
  font-size: 24px;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .frame-3 {
  display: inline-flex;
  height: 48px;
  justify-content: center;
  gap: 16px;
  padding: 12px 20px;
  top: 90px;
  left: 50px;
  border: 1.5px solid;
  border-color: #f0434e;
  align-items: center;
  position: absolute;
}

.desktop .text-wrapper-16 {
  position: relative;
  width: fit-content;
  margin-top: -1px;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 500;
  color: #f0434e;
  font-size: 18px;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .download {
  position: relative;
  width: 24px;
  height: 24px;
}

.desktop .frame-4 {
  display: inline-flex;
  height: 48px;
  justify-content: center;
  gap: 16px;
  padding: 12px 20px;
  top: 90px;
  left: 505px;
  border: 1.5px solid;
  border-color: #f0434e;
  align-items: center;
  position: absolute;
}

.desktop .frame-5 {
  display: inline-flex;
  height: 48px;
  justify-content: center;
  gap: 16px;
  padding: 12px 20px;
  top: 152px;
  left: 235px;
  border: 1.5px solid;
  border-color: #f0434e;
  align-items: center;
  position: absolute;
}

.desktop .frame-6 {
  display: inline-flex;
  height: 48px;
  justify-content: center;
  gap: 16px;
  padding: 12px 20px;
  top: 90px;
  left: 683px;
  border: 1.5px solid;
  border-color: #f0434e;
  align-items: center;
  position: absolute;
}

.desktop .frame-7 {
  display: inline-flex;
  height: 48px;
  justify-content: center;
  gap: 16px;
  padding: 12px 20px;
  top: 152px;
  left: 488px;
  border: 1.5px solid;
  border-color: #f0434e;
  align-items: center;
  position: absolute;
}

.desktop .frame-8 {
  display: inline-flex;
  height: 48px;
  justify-content: center;
  gap: 16px;
  padding: 12px 20px;
  top: 152px;
  left: 50px;
  border: 1.5px solid;
  border-color: #f0434e;
  align-items: center;
  position: absolute;
}

.desktop .frame-9 {
  display: inline-flex;
  height: 48px;
  justify-content: center;
  gap: 16px;
  padding: 12px 20px;
  top: 90px;
  left: 286px;
  border: 1.5px solid;
  border-color: #f0434e;
  align-items: center;
  position: absolute;
}

.desktop .overlap-4 {
  position: absolute;
  width: 342px;
  height: 121px;
  top: 218px;
  left: 549px;
  background-color: #ffffff99;
}

.desktop .eco {
  position: absolute;
  top: 30px;
  left: 158px;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 500;
  color: #1f3b6f;
  font-size: 28px;
  text-align: center;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .text-wrapper-17 {
  position: absolute;
  top: 70px;
  left: 90px;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 400;
  color: #1a1a1a;
  font-size: 16px;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .text-wrapper-17-custom {
  left: 84px;
}

.desktop .eco-2 {
  position: absolute;
  width: 24px;
  height: 24px;
  top: 36px;
  left: 126px;
}

.desktop .overlap-5 {
  position: absolute;
  width: 342px;
  height: 135px;
  top: 218px;
  left: 909px;
  background-color:#ffffff;
}

.desktop .premium {
  position: absolute;
  top: 30px;
  left: 127px;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 500;
  color: #1f3b6f;
  font-size: 28px;
  text-align: center;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .grade {
  position: absolute;
  width: 26px;
  height: 26px;
  top: 35px;
  left: 93px;
}

.desktop .overlap-6 {
  position: absolute;
  width: 1063px;
  height: 888px;
  top: 1675px;
  left: 188px;
  background-color: #ffffff;
}

.desktop .overlap-7 {
  position: absolute;
  width: 302px;
  height: 611px;
  top: 153px;
  left: 50px;
  background-color: #f6f6f6;
}

.desktop .untergrund-2 {
  top: 557px;
  left: 17px;
  color: #1a1a1a;
  font-size: 13px;
  position: absolute;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 400;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .nutzschicht {
  position: absolute;
  top: 53px;
  left: 17px;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 400;
  color: #1a1a1a;
  font-size: 13px;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .zweite {
  position: absolute;
  top: 179px;
  left: 17px;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 400;
  color: #1a1a1a;
  font-size: 13px;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .schutzschicht-fleece {
  position: absolute;
  top: 116px;
  left: 17px;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 400;
  color: #1a1a1a;
  font-size: 13px;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .erste {
  position: absolute;
  top: 242px;
  left: 17px;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 400;
  color: #1a1a1a;
  font-size: 13px;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .w-rmed-mmung-EPS {
  position: absolute;
  top: 305px;
  left: 17px;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 400;
  color: #1a1a1a;
  font-size: 13px;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .gef-lled-mmung-EPS {
  position: absolute;
  top: 368px;
  left: 17px;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 400;
  color: #1a1a1a;
  font-size: 13px;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .dampfbremse {
  position: absolute;
  top: 431px;
  left: 17px;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 400;
  color: #1a1a1a;
  font-size: 13px;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .haftvermittler {
  position: absolute;
  top: 494px;
  left: 17px;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 400;
  color: #1a1a1a;
  font-size: 13px;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .line-10 {
  position: absolute;
  width: 280px;
  height: 1px;
  top: 544px;
  left: 10px;
  object-fit: cover;
}

.desktop .line-11 {
  position: absolute;
  width: 280px;
  height: 1px;
  top: 480px;
  left: 10px;
  object-fit: cover;
}

.desktop .line-12 {
  position: absolute;
  width: 280px;
  height: 1px;
  top: 417px;
  left: 10px;
  object-fit: cover;
}

.desktop .line-13 {
  position: absolute;
  width: 280px;
  height: 1px;
  top: 354px;
  left: 10px;
  object-fit: cover;
}

.desktop .line-14 {
  position: absolute;
  width: 280px;
  height: 1px;
  top: 292px;
  left: 10px;
  object-fit: cover;
}

.desktop .line-15 {
  position: absolute;
  width: 280px;
  height: 1px;
  top: 229px;
  left: 10px;
  object-fit: cover;
}

.desktop .line-16 {
  position: absolute;
  width: 280px;
  height: 1px;
  top: 165px;
  left: 10px;
  object-fit: cover;
}

.desktop .line-17 {
  position: absolute;
  width: 280px;
  height: 1px;
  top: 102px;
  left: 10px;
  object-fit: cover;
}

.desktop .line-18 {
  position: absolute;
  width: 280px;
  height: 3px;
  top: 39px;
  left: 10px;
}

.desktop .text-wrapper-18 {
  position: absolute;
  top: 71px;
  left: 249px;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 500;
  color: #1a1a1a;
  font-size: 16px;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .text-wrapper-19 {
  top: 134px;
  left: 249px;
  position: absolute;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 500;
  color: #1a1a1a;
  font-size: 16px;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .text-wrapper-20 {
  top: 197px;
  left: 249px;
  position: absolute;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 500;
  color: #1a1a1a;
  font-size: 16px;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .text-wrapper-21 {
  top: 260px;
  left: 249px;
  position: absolute;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 500;
  color: #1a1a1a;
  font-size: 16px;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .text-wrapper-22 {
  top: 323px;
  left: 249px;
  position: absolute;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 500;
  color: #1a1a1a;
  font-size: 16px;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .text-wrapper-23 {
  top: 386px;
  left: 249px;
  position: absolute;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 500;
  color: #1a1a1a;
  font-size: 16px;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .text-wrapper-24 {
  top: 449px;
  left: 249px;
  position: absolute;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 500;
  color: #1a1a1a;
  font-size: 16px;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .text-wrapper-25 {
  top: 512px;
  left: 249px;
  position: absolute;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 500;
  color: #1a1a1a;
  font-size: 16px;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .text-wrapper-26 {
  top: 575px;
  left: 249px;
  position: absolute;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 500;
  color: #1a1a1a;
  font-size: 16px;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .schichten {
  position: absolute;
  top: 13px;
  left: 17px;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 400;
  color: #1a1a1a;
  font-size: 14px;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .text-wrapper-27 {
  position: absolute;
  top: 13px;
  left: 254px;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 400;
  color: #1a1a1a;
  font-size: 14px;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .overlap-8 {
  position: absolute;
  width: 302px;
  height: 57px;
  top: 776px;
  left: 50px;
  background-color: #f6f6f6;
}

.desktop .text-wrapper-28 {
  position: absolute;
  top: 17px;
  left: 17px;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 500;
  color: #1a1a1a;
  font-size: 16px;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .text-wrapper-29 {
  top: 17px;
  left: 231px;
  position: absolute;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 500;
  color: #1a1a1a;
  font-size: 16px;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .overlap-9 {
  position: absolute;
  width: 302px;
  height: 57px;
  top: 776px;
  left: 381px;
  background-color: #f6f6f6;
}

.desktop .overlap-10 {
  position: absolute;
  width: 302px;
  height: 57px;
  top: 776px;
  left: 711px;
  background-color: #f6f6f6;
}

.desktop .overlap-11 {
  position: absolute;
  width: 302px;
  height: 611px;
  top: 153px;
  left: 711px;
  background-color: #f6f6f6;
}

.desktop .overlap-12 {
  position: absolute;
  width: 302px;
  height: 611px;
  top: 153px;
  left: 381px;
  background-color: #f6f6f6;
}

.desktop .group-11 {
  position: absolute;
  width: 148px;
  height: 26px;
  top: 114px;
  left: 128px;
}

.desktop .license-2 {
  position: absolute;
  width: 24px;
  height: 24px;
  top: 1px;
  left: 0;
}

.desktop .text-wrapper-30 {
  position: absolute;
  top: 0;
  left: 28px;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 500;
  color: #1f3b6f;
  font-size: 20px;
  text-align: center;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .group-12 {
  position: absolute;
  width: 64px;
  height: 26px;
  top: 114px;
  left: 500px;
}

.desktop .eco-3 {
  position: absolute;
  width: 24px;
  height: 24px;
  top: 0;
  left: 0;
}

.desktop .group-13 {
  position: absolute;
  width: 111px;
  height: 27px;
  top: 113px;
  left: 807px;
}

.desktop .grade-2 {
  position: absolute;
  width: 26px;
  height: 26px;
  top: 0;
  left: 0;
}

.desktop .text-wrapper-31 {
  position: absolute;
  top: 1px;
  left: 30px;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 500;
  color: #1f3b6f;
  font-size: 20px;
  text-align: center;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .overlap-13 {
  position: absolute;
  width: 396px;
  height: 34px;
  top: 44px;
  left: 617px;
}

.desktop .div-wrapper {
  display: inline-flex;
  justify-content: center;
  gap: 10px;
  padding: 8px 16px;
  top: 0;
  left: 0;
  background-color: #1f3b6f;
  border: 1px solid;
  align-items: center;
  position: absolute;
}

.desktop .text-wrapper-32 {
  position: relative;
  width: fit-content;
  margin-top: -1px;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 14px;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .frame-10 {
  display: inline-flex;
  justify-content: center;
  gap: 10px;
  padding: 8px 16px;
  top: 0;
  left: 333px;
  border: 1px solid;
  border-color: #d9d9d9;
  align-items: center;
  position: absolute;
}

.desktop .text-wrapper-33 {
  position: relative;
  width: fit-content;
  margin-top: -1px;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 400;
  color: #1a1a1a;
  font-size: 14px;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .frame-11 {
  display: inline-flex;
  justify-content: center;
  gap: 10px;
  padding: 8px 16px;
  top: 0;
  left: 144px;
  border: 1px solid;
  border-color: #d9d9d9;
  align-items: center;
  position: absolute;
}

.desktop .overlap-14 {
  position: absolute;
  width: 1440px;
  height: 104px;
  top: 0;
  left: 0;
  background-color: #ffffff;
}

.desktop .logo {
  position: absolute;
  width: 170px;
  height: 48px;
  top: 28px;
  left: 80px;
}

.desktop .user {
  position: absolute;
  width: 24px;
  height: 24px;
  top: 28px;
  left: 1319px;
}

.desktop .text-wrapper-34 {
  position: absolute;
  top: 53px;
  left: 1301px;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 400;
  color: #a2a2a2;
  font-size: 13px;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .text-wrapper-35 {
  position: absolute;
  top: 37px;
  left: 520px;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 500;
  color: #000000;
  font-size: 22px;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .bildschirmfoto {
  position: absolute;
  width: 1438px;
  height: 592px;
  top: 3089px;
  left: 2px;
  object-fit: cover;
}

.desktop .overlap-15 {
  position: absolute;
  width: 1442px;
  height: 9px;
  top: 104px;
  left: 0;
  border-radius: 0px 20px 20px 0px;
}

.desktop .rectangle {
  width: 1440px;
  height: 8px;
  background-color: #ebebeb;
  position: absolute;
  top: 0;
  left: 0;
}

.desktop .rectangle-2 {
  width: 1442px;
  height: 9px;
  background-color: #f0434e;
  border-radius: 0px 20px 20px 0px;
  position: absolute;
  top: 0;
  left: 0;
}

.desktop .sie-haben-fragen-zu {
  position: absolute;
  top: 2651px;
  left: 317px;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 500;
  color: #1f3b6f;
  font-size: 24px;
  text-align: center;
  letter-spacing: 0;
  line-height: normal;
}

.desktop .frame-12 {
  display: inline-flex;
  height: 48px;
  justify-content: center;
  gap: 10px;
  padding: 12px 20px;
  top: 2758px;
  left: 563px;
  background-color: #f0434e;
  align-items: center;
  position: absolute;
}

.desktop .text-wrapper-36 {
  position: relative;
  width: fit-content;
  margin-top: -0.5px;
  font-family: "Hanken Grotesk", Helvetica;
  font-weight: 500;
  color: #ffffff;
  font-size: 18px;
  letter-spacing: 0;
  line-height: normal;
}


.thickness-selector-toggle {
  cursor: pointer;
}

.invisible {
  visibility: hidden;
}

.hidden {
  display: none;
}

.rotate-180 img {
  animation: rotation-180 0.25s linear;
  animation-fill-mode: forwards;
}

@keyframes rotation-180 {
  0% {
    rotate: 0deg;
  }
  100% {
    rotate: 180deg;
  }
}

/* Colors: Default (blue) */
.toggle-radio {background:#f5f5f5; border:1px solid #ccc;}
.toggle-radio > input:checked + label {background:lightblue;}
.toggle-radio > input + label:not(:last-of-type) {border-right:1px solid #ccc;}

.toggle-radio {
  display: inline-flex;
  position: absolute;
  z-index: 2;
  top: 20px;
  left: 5px;
  border: 2px solid #1f3b6f;
  border-radius: 5px;
}
.toggle-radio > input[type='radio'] {display:none;}
.toggle-radio > input[disabled] + label {opacity:0.50;}
.toggle-radio > input[disabled] + label:hover {cursor:not-allowed;}
.toggle-radio > input + label {display:inline-block; margin-bottom:0; padding:5px 10px; float:left; cursor:pointer;}

/* Transitions */
.toggle-radio > input:checked + label {transition:background 300ms linear;}

.desktop .walk-stahlbeton {
  position: absolute;
  width: 530px;
  top: 108px;
  left: -100px;
}

.desktop .walk-bitumenlack-VS {
  position: absolute;
  width: 530px;
  top: 109px;
  left: -100px;
}

.desktop .walk-BIKUVAP_LL-EVA {
  position: absolute;
  width: 530px;
  top: 105px;
  left: -100px;
}

.desktop .walk-PIR_Premium {
  position: absolute;
  width: 530px;
  top: 64px;
  left: -100px;
}

.desktop .grass-BIKUPLAN_EGV_3_5 {
  position: absolute;
  width: 530px;
  top: 50px;
  left: -100px;
}

.desktop .walk-BIKUTOP_LL {
  position: absolute;
  width: 530px;
  top: 56px;
  left: -100px;
}

.desktop .walk-BIKUPLAN_LL-Multi {
  position: absolute;
  width: 530px;
  top: 53px;
  left: -100px;
}

.desktop .walk-drain {
  position: absolute;
  width: 530px;
  top: 45px;
  left: -100px;
}

.desktop .walk-splittbett {
  position: absolute;
  width: 530px;
  top: 26px;
  left: -100px;
}

.desktop .walk-gehbelag-nutzschicht {
  position: absolute;
  width: 530px;
  left: -100px;
  top: 6px;
}

.desktop .grass-stahlbeton_untergrund {
  position: absolute;
  width: 530px;
  top: 130px;
  left: -100px;
}

.desktop .grass-bitumenlack-vs-100 {
  position: absolute;
  width: 530px;
  top: 129px;
  left: -100px;
}

.desktop .grass-BIKUPLAN_EGV_3_5 {
  position: absolute;
  width: 530px;
  top: 120px;
  left: -100px;
}

.desktop .grass-EPS_Roof {
  position: absolute;
  width: 530px;
  top: 59px;
  left: -100px;
}

.desktop .grass-PROTECT_LIGHT {
  position: absolute;
  width: 530px;
  top: 58px;
  left: -100px;
}

.desktop .grass-drain {
  position: absolute;
  width: 530px;
  top: 58px;
  left: -100px;
}

.desktop .grass-BIKUPLAN_ECO {
  position: absolute;
  width: 530px;
  top: 57px;
  left: -100px;
}

.desktop .grass-BIKUTOP_pro {
  position: absolute;
  width: 530px;
  top: 56px;
  left: -100px;
}

.desktop .grass-Dachbegruenung {
  position: absolute;
  width: 530px;
  left: -100px;
}

.desktop .walk-thickness-layer-10 {

  width: 325px !important;
  height: 134px !important;

}

.desktop .thickness-layers-grass-20 .grass-PROTECT_LIGHT {

  top: 45px;

}

.desktop .thickness-layers-grass-20 .grass-BIKUPLAN_EGV_3_5 {

  top: 181px;

}

.desktop .thickness-layers-grass-20 .grass-bitumenlack-vs-100 {

  top: 189px;

}

.desktop .thickness-layers-grass-20 .grass-stahlbeton_untergrund {

  top: 190px;

}

.desktop .thickness-layers-walk-20 .walk-BIKUVAP_LL-EVA {

  top: 140px;

}

.desktop .thickness-layers-walk-20 .walk-bitumenlack-VS {

  top: 144px;

}

.desktop .thickness-layers-walk-20 .walk-stahlbeton {

  top: 145px;

}