.whiteText[data-v-38981380] {
  color: white;
}
.langselect[data-v-38981380] {
  margin-top: -4em;
  margin-bottom: 4em;
  padding: 2em;
  background-color: rgba(0, 0, 0, 0.7);
}


.configurator-start-text-box-headline[data-v-33d39f4c] {
  color: #fff;
  text-shadow: 4px 2px 5px rgba(0, 0, 0, 0.75);
  line-height: 1.5;
}
.configurator-content-container[data-v-33d39f4c] {
  position: absolute;
  bottom: 50px;
  left: 5%;
  width: 450px;
}

/************************************************/
/**** MEDIA QUERIES FOR RESPONSIVE BEHAVIOUR ****/
/***********************************************/
@media screen and (max-width: 1007px) {
.configurator-content-container[data-v-33d39f4c] {
    right: 27%;
    width: 450px;
}
}
@media (max-width: 768px) {
.configurator-content-container[data-v-33d39f4c] {
    right: 32%;
    bottom: 5%;
    width: 270px;
}
}


.configurator-rainwater-rooftype-image {
  height: 70px;
  width: 70px;
  border: 2px solid #FFF;
}
@media screen and (max-width: 768px) {
.configurator-rainwater-rooftype-image {
    height: 60px;
    width: 60px;
}
}


.configurator-package-image {
  width: 100%;
  border: 2px solid white;
}


.configurator-tank-image {
  width: 100%;
  border: 2px solid #FFF;
}
.opacity-active {
  opacity: 0.7;
}



.configurator-waterdemand-icon {
  display: inline-block;
  height: 27px;
  background-repeat: no-repeat;
}
.configurator-waterdemand-icon.m-man {
  width: 13px;
  background-image: url(/assets/images/icon_man.svg);
}
.configurator-waterdemand-icon.m-pair {
  width: 31px;
  background-image: url(/assets/images/icon_pair.svg);
}
.configurator-waterdemand-icon.m-pair-child {
  width: 43px;
  background-image: url(/assets/images/icon_pair_child.svg);
}
.configurator-waterdemand-icon.m-pair-2child {
  width: 57px;
  background-image: url(/assets/images/icon_pair_2children.svg);
}
.configurator-waterdemand-icon.m-pair-3child {
  width: 68px;
  background-image: url(/assets/images/icon_pair_3children.svg);
}
.configurator-waterdemand-usage-icon {
  height: 60px;
  width: 60px;
}



.configurator-attachment[data-v-1191d0dc] {
  height: 2rem;
}
.small-font[data-v-1191d0dc] {
  font-size: 0.9em;
}



img[data-v-df9502a6] {
  max-height: 175px;
}
.configurator-followupaction-option-icon[data-v-df9502a6] {
  height: 35px;
  width: 35px;
}
.form-check--size-medium[data-v-df9502a6] {
  align-items: start;
}


.accordion {
  width: 100%;
  overflow: hidden;
}
.accordion-parts {
  width: 100%;
  height: 100%;
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
}


.accordion-conf-button.m-back {
  display: none;
}
.accordion-conf-button.m-back,
.accordion-conf-button.m-next {
  position: absolute;
  bottom: 10px;
  right: 30px;
}
.accordion-conf-button.m-top {
  top: 10px;
  bottom: auto;
}
.accordion-item-content.scroll-activate {
  position: absolute;
  overflow-y: auto;
  bottom: 5rem;
  top: 1rem;
  left: 1rem;
}
.accordion-item {
  position: relative;
  list-style: none;
  flex: initial;
  width: 5%;
  transition: all 500ms ease-in;
}
.accordion-item.is-expanded {
  width: 75% !important;
}
.accordion-item-content {
  opacity: 0;
  transition: opacity 100ms ease-out;
}
.accordion-item.is-expanded .accordion-item-content {
  opacity: 1;
}
.accordion-item-icon {
  position: absolute;
  bottom: 13px;
  left: 8px;
  cursor: pointer;
  display: block;
  width: 23px;
  height: 23px;
  line-height: 23px;
  background-color: #fff;
  text-align: center;
  border-radius: 50%;
}
.is-resolved {
  background: #cc0000;
  color: #fff;
}
@media screen and (max-width: 1007px) {
.accordion-item {
    width: 0 !important;
}
.accordion-item.is-expanded {
    width: 100% !important;
}
.accordion-conf-button.m-back {
    display: block;
    right: 123px;
}
.accordion-conf-button.m-next {
    right: 30px;
}
}


.configurator-tank-image {
  width: 100%;
  border: 2px solid #FFF;
}
.red-border {
  border: 2px solid #cc0000;
}



.warning {
  color: #cc0000;
  margin-top: 1em;
}
.configurator-retention-icon {
  display: inline-block;
  height: 27px;
  background-repeat: no-repeat;
}
.configurator-retention-icon.m-man {
  width: 13px;
  background-image: url(/assets/images/icon_man.svg);
}
.configurator-retention-icon.m-pair {
  width: 31px;
  background-image: url(/assets/images/icon_pair.svg);
}
.configurator-retention-icon.m-pair-child {
  width: 43px;
  background-image: url(/assets/images/icon_pair_child.svg);
}
.configurator-retention-icon.m-pair-2child {
  width: 57px;
  background-image: url(/assets/images/icon_pair_2children.svg);
}
.configurator-retention-icon.m-pair-3child {
  width: 68px;
  background-image: url(/assets/images/icon_pair_3children.svg);
}
.configurator-retention-usage-icon {
  height: 60px;
  width: 60px;
}



#rain4me {
  width: 100%;
  height: 100vh;
  max-height: 800px;
  background-color: #ccc;
  opacity: 0;
  transition: opacity 2000ms ease-in;
}
#rainwater-accordion {
  height: 100vh;
  max-height: 800px;
}
#rain4me.is-rendered {
  opacity: 1;
}
.configurator-background {
  background-repeat: no-repeat;
  background-size: auto 100%;
}
.configurator-background.m-startpage {
  background-image: url(/assets/images/nick-page-Q0-S1qs1Bvc-unsplash.jpg);
  background-position: top left;
  background-size: cover;
}
.configurator-background.m-groundwater {
  background-image: url(/assets/images/Grundwassertiefe.jpg) !important;
  background-position: bottom right !important;
  background-size: cover !important;
}
.configurator-background.m-rainwater {
  background-image: url(/assets/images/Regenrinne.jpg) !important;
  background-position: bottom right !important;
  background-size: cover !important;
}
.configurator-background.m-waterdemand {
  background-image: url(/assets/images/Wasserbedarf.jpg) !important;
  background-position: center !important;
  background-size: cover !important;
}
.configurator-background.m-retention {
  background-image: url(/assets/images/retention3.jpg) !important;
  background-position: center !important;
  background-size: cover !important;
}
.configurator-background.m-packages {
  background-image: url(/assets/images/Ausstattung.jpg);
  background-position: top;
  background-size: cover;
}
.configurator-background.m-tank {
  background-image: url(/assets/images/Ausrichtung.jpg);
  background-position: center;
  background-size: cover;
}
.configurator-background.m-recommendation {
  background-image: url(/assets/images/Seite_4.jpg);
  background-position: center;
  background-size: cover;
}
.configurator-background.m-empty {
  background-image: url(/assets/images/Ausrichtung.jpg);
  background-position: center;
  background-size: cover;
}
.configurator-icon-startpage {
  background-image: url(/assets/images/Icons_Home_white.svg);
}
.configurator-icon-startpage.is-resolved {
  background-image: url(/assets/images/Icons_Home_green.svg);
}
.configurator-icon-groundwater {
  background-image: url(/assets/images/Icons_Grundwasser_white.svg);
}
.configurator-icon-groundwater.is-resolved {
  background-image: url(/assets/images/Icons_Grundwasser_green.svg);
}
.configurator-icon-rainwater {
  background-image: url(/assets/images/Icons_Eingabe_white.svg);
}
.configurator-icon-rainwater.is-resolved {
  background-image: url(/assets/images/Icons_Eingabe_green.svg);
}
.configurator-icon-waterdemand {
  background-image: url(/assets/images/Icons_Tropfen_white.svg);
}
.configurator-icon-waterdemand.is-resolved {
  background-image: url(/assets/images/Icons_Tropfen_green.svg);
}
.configurator-icon-retention {
  background-image: url(/assets/images/Icons_Retention_white.svg);
}
.configurator-icon-retention.is-resolved {
  background-image: url(/assets/images/Icons_Retention_green.svg);
}
.configurator-icon-packages {
  background-image: url(/assets/images/Icons_Paket_white.svg);
}
.configurator-icon-packages.is-resolved {
  background-image: url(/assets/images/Icons_Paket_green.svg);
}
.configurator-icon-tank {
  background-image: url(/assets/images/Icons_Ausrichtung_white.svg);
}
.configurator-icon-tank.is-resolved {
  background-image: url(/assets/images/Icons_Ausrichtung_green.svg);
}
.configurator-icon-recommendation {
  background-image: url(/assets/images/Icons_Rechner_white.svg);
}
.configurator-icon-recommendation.is-resolved {
  background-image: url(/assets/images/Icons_Rechner_green.svg);
}
.configurator-headline {
  color: #000;
}
.configurator-transparent-box {
  margin-bottom: 15px;
  padding: 15px;
  background-color: rgba(255, 255, 255, 0.8);
  color: #000;
}

/********************/
/*Tooltip Overwrites*/
/********************/
.config-tooltip--xl {
  max-width: 100vw;
  min-width: 20vw;
  background: #fff !important;
  opacity: 1 !important;
  padding: 5px;
}
.config-tooltip {
  border-radius: 6px;
  background: #fff !important;
}
.tooltip-inner {
  border: none !important;
  box-shadow: none !important;
  min-width: 20vw;
}
.tooltip-image {
  width: 15rem;
}
.config-tooltip[aria-hidden="true"] {
  visibility: hidden;
  opacity: 0;
}
.config-tooltip[aria-hidden="false"] {
  visibility: visible;
  opacity: 1;
}
.before-label {
  color: #999;
}
/* __________________ */
.configurator-invalid {
  border-style: solid !important;
  border-width: 3px 3px 3px 3px !important;
  border-color: red !important
}
.modal-mask {
  position: fixed;
  z-index: 9998;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, .5);
  display: table;
  transition: opacity .3s ease;
}
.modal-wrapper {
  display: table-cell;
  vertical-align: middle;
}
.modal-container {
  width: 300px;
  margin: 0px auto;
  padding: 20px 30px;
  background-color: #fff;
  border-radius: 2px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, .33);
  transition: all .3s ease;
  font-family: Helvetica, Arial, sans-serif;
}
.modal-header h3 {
  margin-top: 0;
  color: #42b983;
}
.modal-body {
  margin: 20px 0;
}
.modal-default-button {
  float: right;
}
@media screen and (max-width: 1007px) {
.configurator-content-container {
    padding-left: 10px;
    padding-right: 10px;
}
.configurator-background.m-startpage {
    background-image: url(/assets/images/nick-page-Q0-S1qs1Bvc-unsplash.jpg);
    background-position: top left 31%;
}
}
@media screen and (max-width: 767px) {
.configurator-content-container {
    padding-left: 0;
    padding-right: 0;
}
.configurator-transparent-box {
    padding: 15px 10px;
}
.configurator-pack-firstcol {
    margin-top: 3em;
}
}