/**
* Block Name: hero_klein
*/

section.hero_klein {
  max-height: 854px;
  overflow: hidden;
}

section.hero_klein .image_wrapper {
  position: relative;
  z-index: 997;
}

section.hero_klein .image_wrapper img {
  max-height: 548px;
}

section.hero_klein .svg_container {
  bottom: -2px;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  left: 20px;
}

section.hero_klein .svg_container svg {
  display: block;
  position: relative;
}

section.hero_klein .svg_container .triangle {
  left: 6px;
  transform: scaleX(1) scaleY(1.03);
}

section.hero_klein .svg_container .rectangle {
  shape-rendering: crispEdges;
  left: 3px;
}

section.hero_klein .title_container {
  z-index: 999;
  position: relative;
  top: -43px;
}

section.hero_klein .title_container p {
  opacity: 0.6;
}

section.hero_klein .title_container .pt_10 {
  padding-top: 10px;
}

section.hero_klein .title_container .btn-primary[target="_self"]::after {
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='25' viewBox='0 0 24 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11.46 5.59082V17.6696L5.66771 11.8773L4.95996 12.5908L11.96 19.5908L18.96 12.5908L18.2522 11.8773L12.46 17.6696V5.59082H11.46Z' fill='%23273347'/%3E%3C/svg%3E%0A");
}

section.hero_klein .title_container .btn-primary:hover::after {
  transform: translateY(5px);
}

@media (min-width: 1381px) {
  section.hero_klein .svg_container .rectangle {
    transform: scaleX(1.5);
    left: 22.5%;
  }
}

@media (min-width: 2000px) {
  section.hero_klein .svg_container .rectangle {
    transform: scaleX(2);
    left: 45.5%;
  }
}

@media (min-width: 2655px) {
  section.hero_klein .svg_container .rectangle {
    transform: scaleX(2.5);
    left: 70%;
  }
}

@media (min-width: 3000px) {
  section.hero_klein .svg_container .rectangle {
    transform: scaleX(2.8);
    left: 82.5%;
  }
}
@media (max-width: 1215px) {
  section.hero_klein .svg_container .triangle {
    transform: scaleX(1) scaleY(1.035);
  }
}

@media (max-width: 1136px) {
  section.hero_klein .svg_container .triangle {
    transform: scaleX(1) scaleY(1.04);
  }
}

@media (max-width: 1057px) {
  section.hero_klein .svg_container .triangle {
    transform: scaleX(1) scaleY(1.05);
  }
}

@media (max-width: 999px) {
  section.hero_klein .svg_container .triangle {
    z-index: 9;
  }
}

@media (max-width: 992px) {
  section.hero_klein {
    max-height: none;
  }

  section.hero_klein .svg_container {
    bottom: -8px;
    left: 0;
  }

  section.hero_klein .svg_container .rectangle {
    bottom: -50px;
    width: 100vw;
    transform: scaleX(1.2);
  }

  section.hero_klein .svg_container .triangle {
    display: none;
  }

  section.hero_klein .title_container {
    top: 0;
  }

  section.hero_klein .image_wrapper img {
    height: 548px !important;
  }
}