:root {
	/* Farbschema */
	--midcolor: #c0252d;
	/* 20% heller bzw. dunkler */
	--lightcolor: #e2696f;
	--darkcolor: #6a1519; 
	--contrastcolor: #F8CE46; 
  /* Grau Nuancen */
  --lightgrey1: #f9f9f9;
  --lightgrey2: #f2f2f2;
  --lightgrey3: #e5e5e5;
  --lightgrey4: #d8d8d8;
  --lightgrey5: #dcdcdc;
  --lightgrey6: #c1c1c1; 
  --lightgrey7: #b2b2b2; 
}



body, html { 
  padding-right: 0 !important; 
  padding-left: 0 !important;
}


.lightcolorstop {
  stop-color: var(--lightcolor, #15a4ff);
}

.midcolorstop {
  stop-color: var(--midcolor, #006AAE);
}

.darkcolorstop {
  stop-color: var(--darkcolor, #002c48);
}

.haussvg {
  max-height: 60vh;
  margin-top: 20px;
  
}

.whitebox {
  margin-top:10px;
}

.mainbox { 
  background-image: url("/elektrotreff/assets/img/etreff-muster-20.png");
  background-repeat: no-repeat;
  background-position: bottom left;  
}


/* Popover */

.popover-header {
  background-color: var(--darkcolor, #002c48);
  color: #fff;
  border-bottom-color: var(--darkcolor, #002c48) !important;
  border-bottom: 0px;
  border-bottom-left-radius: calc(.3rem - 1px);
  border-bottom-right-radius: calc(.3rem - 1px);
}

.popover-body {
  display: none;
}

.bs-popover-auto[x-placement^="top"] .arrow::after, .bs-popover-top .arrow::after {
  border-top-color:var(--darkcolor, #002c48) !important;
}



/* svg klassen */
.lightgrey1 {
  fill: var(--lightgrey1, #f9f9f9);
}

.lightgrey2 {
  fill: var(--lightgrey2, #f2f2f2);
}

.lightgrey3 {
  fill: var(--lightgrey3, #e5e5e5);
}

.lightgrey4 {
  fill: var(--lightgrey4, #d8d8d8);
}

.lightgrey5 {
  fill: var(--lightgrey5, #dcdcdc);
}

.lightgrey6 {
  fill: var(--lightgrey6, #c1c1c1);
}

.lightgrey7 {
  fill: var(--lightgrey7, #b2b2b2);
}

.lightcolor {
  fill: var(--lightcolor, #15a4ff);
}

.midcolor {
  fill: var(--midcolor, #006AAE);
}

.darkcolor {
  fill: var(--darkcolor, #002c48);
}

.stroke2, .stroke05 {
  stroke: var(--midcolor, #006AAE);
}

.colorstroke {
  stroke: var(--lightcolor, #15a4ff);
}

.colorgradientfillbase {
  fill: url(#colorgradientbase);
}

.colorgradientfill1 {
  fill: url(#colorgradient1);
}

.colorgradientfill2 {
  fill: url(#colorgradient2);
}

.colorgradientfill3 {
  fill: url(#colorgradient3);
}

.colorgradientfill4 {
  fill: url(#colorgradient4);
}

.greygradientfillbase {
  fill: url(#greygradientbase);
}

.greygradientfill1 {
  fill: url(#greygradient1);
}

.greygradientfill2 {
  fill: url(#greygradient2);
}

.greygradientfill3 {
  fill: url(#greygradient3);
}

.greygradientfill4 {
  fill: url(#greygradient4);
}

.colorstroke, .greystroke, .stroke2, .stroke05 {
  fill: none;
  stroke-miterlimit: 10;
}

.stroke05 {
  stroke-width: 0.5px;
}

.greystroke {
  stroke: var(--lightgrey3, #e5e5e5);
  stroke-width: 0.25px;
}

/* temp weg

.haus-element {
  cursor: pointer;
  opacity: 0.7;
  webkit-transition: all 500ms ease-in-out;
  -ms-transition: all 500ms ease-in-out;
  transition: all 500ms ease-in-out;
}

.haus-element:hover {
  opacity: 1;
  webkit-transition: all 500ms ease-in-out;
  -ms-transition: all 500ms ease-in-out;
  transition: all 500ms ease-in-out;
}

.haus-element:hover .glow path, .haus-element:hover .glow polygon, .haus-element:hover .glow ellipse, .haus-element:hover .glow circle {
  fill: var(--contrastcolor, #F8CE46) !important;
  webkit-transition: all 500ms ease-in-out;
  -ms-transition: all 500ms ease-in-out;
  transition: all 500ms ease-in-out;
}

*/

#waermepumpen, #kompensationsanlagen, #elektro-klein-und-grossgeraete, #sicherheitstechnik, #garagentor, #fussbodenheizungen, #haustuer-sprechanlagen-audio-video, #licht-und-leuchten, #antriebe-fuer-rolllaeden-jalousien-und-markisen, #elektroinstallation, #heizung-klima, #raumklima-geraete, #home-automation, #kommunikationstechnik, #daten-und-netzwerktechnik, #dezentrale-warmwasserversorgung, #photovoltaik-und-solartechnik, #solarthermie, #antriebe-fuer-rolllaeden-jalousien-und-markisen, #ueberspannungsschutz-blitzschutz, #sat-anlagen, #bewegungsmelder-und-aussenleuchten, #heizsysteme-fuer-wasserleitungen-zufahrt-freiflaeche-und-dachrinne, #elektromobilitaet, #badplanung, #bhkw-blockheizkraftwerk, #unterhaltungselektronik, #kamin, #jalousie {
  cursor: pointer;
  opacity: 0.7;
  webkit-transition: all 500ms ease-in-out;
  -ms-transition: all 500ms ease-in-out;
  transition: all 500ms ease-in-out;
}

#waermepumpen:hover, #kompensationsanlagen:hover, #elektro-klein-und-grossgeraete:hover, #sicherheitstechnik:hover, #garagentor:hover, #fussbodenheizungen:hover, #haustuer-sprechanlagen-audio-video:hover, #licht-und-leuchten:hover, #antriebe-fuer-rolllaeden-jalousien-und-markisen:hover, #elektroinstallation:hover, #heizung-klima:hover, #raumklima-geraete:hover, #home-automation:hover, #kommunikationstechnik:hover, #daten-und-netzwerktechnik:hover, #dezentrale-warmwasserversorgung:hover, #photovoltaik-und-solartechnik:hover, #solarthermie:hover, #antriebe-fuer-rolllaeden-jalousien-und-markisen:hover, #ueberspannungsschutz-blitzschutz:hover, #sat-anlagen:hover, #bewegungsmelder-und-aussenleuchten:hover, #heizsysteme-fuer-wasserleitungen-zufahrt-freiflaeche-und-dachrinne:hover, #elektromobilitaet:hover, #badplanung:hover, #bhkw-blockheizkraftwerk:hover, #unterhaltungselektronik:hover, #kamin:hover, #jalousie:hover {
  opacity: 1;
  webkit-transition: all 500ms ease-in-out;
  -ms-transition: all 500ms ease-in-out;
  transition: all 500ms ease-in-out;
}

#elektromobilitaet:hover .glow path, #elektromobilitaet:hover .glow polygon, #daten-und-netzwerktechnik:hover .glow polygon, #sicherheitstechnik:hover .glow path, #sicherheitstechnik:hover .glow ellipse, #photovoltaik-und-solartechnik:hover .glow polygon, #solarthermie:hover .glow polygon, #unterhaltungselektronik:hover .glow polygon, #kamin:hover .glow path, #licht-und-leuchten:hover .glow circle {
  fill: var(--contrastcolor, #F8CE46) !important;
  webkit-transition: all 500ms ease-in-out;
  -ms-transition: all 500ms ease-in-out;
  transition: all 500ms ease-in-out;
}


.tvbild {
  opacity: 0;
}

.tvbild image {
  -moz-transform: skew(0deg, 30deg);
  -webkit-transform: skew(0deg, 30deg);
  -o-transform: skew(0deg, 30deg);
  -ms-transform: skew(0deg, 30deg);
  transform: skew(0deg, 30deg);
}

#unterhaltungselektronik:hover .tvbild {
  opacity: 1;
}

#elektro-klein-und-grossgeraete:hover {
  animation-name: waschmaschine;
  webkit-transition: all 150ms ease-in-out;
  -ms-transition: all 150ms ease-in-out;
  transition: all 150ms ease-in-out;
  animation-duration: 150ms;
  animation-iteration-count: infinite;
}

#garagentor .hoverstep1, #kompensationsanlagen .hoverstep1, #antriebe-fuer-rolllaeden-jalousien-und-markisen .hoverstep1, #jalousie .hoverstep1 {
  opacity: 0;
}

#garagentor:hover .hoverstep2, #kompensationsanlagen:hover .hoverstep2, #antriebe-fuer-rolllaeden-jalousien-und-markisen:hover .hoverstep2, #jalousie:hover .hoverstep2 {
  opacity: 0;
  webkit-transition: all 500ms ease-in-out;
  -ms-transition: all 500ms ease-in-out;
  transition: all 500ms ease-in-out;
}

#garagentor:hover .hoverstep1, #kompensationsanlagen:hover .hoverstep1, #antriebe-fuer-rolllaeden-jalousien-und-markisen:hover .hoverstep1, #jalousie:hover .hoverstep1 {
  opacity: 1;
  webkit-transition: all 500ms ease-in-out;
  -ms-transition: all 500ms ease-in-out;
  transition: all 500ms ease-in-out;
}

@keyframes waschmaschine {
  0% {
    transform: translate(0px, 0px);
    -ms-transform: translate(0px, 0px);
    /* IE 9 */
    -webkit-transform: translate(0px, 0px);
    /* Safari and Chrome */
    -o-transform: translate(0px, 0px);
    /* Opera */
    -moz-transform: translate(0px, 0px);
    /* Firefox */
  }
  16% {
    transform: translate(1px, 1px);
    -ms-transform: translate(1px, 1px);
    /* IE 9 */
    -webkit-transform: translate(1px, 1px);
    /* Safari and Chrome */
    -o-transform: translate(1px, 1px);
    /* Opera */
    -moz-transform: translate(1px, 1px);
    /* Firefox */
  }
  70% {
    transform: translate(-1px, -1px);
    -ms-transform: translate(-1px, -1px);
    /* IE 9 */
    -webkit-transform: translate(-1px, -1px);
    /* Safari and Chrome */
    -o-transform: translate(-1px, -1px);
    /* Opera */
    -moz-transform: translate(-1px, -1px);
    /* Firefox */
  }
  70% {
    transform: translate(1px, -1px);
    -ms-transform: translate(1px, -1px);
    /* IE 9 */
    -webkit-transform: translate(1px, -1px);
    /* Safari and Chrome */
    -o-transform: translate(1px, -1px);
    /* Opera */
    -moz-transform: translate(1px, -1px);
    /* Firefox */
  }
  100% {
    transform: translate(0px, 0px);
    -ms-transform: translate(0px, 0px);
    /* IE 9 */
    -webkit-transform: translate(0px, 0px);
    /* Safari and Chrome */
    -o-transform: translate(0px, 0px);
    /* Opera */
    -moz-transform: translate(0px, 0px);
    /* Firefox */
  }
}

/* Liste aller IDs

    keller
        ug
        bhkw-blockheizkraftwerk
        waermepumpen
        kompensationsanlagen
        elektro-klein-grossgeraete
    garage
        sicherheitstechnik
        garagentor
    terrasse
    tisch
    sofa
    einfahrt
        heizsystemefreiflaechen
        elektromobilitaet
    fussbodenheizungen
    haustuersprechanlagen
    licht-beleuchtung
    rollaeden
    elektroinstallation
    heizkoerper
    klima
    home-automation
    kommunikationstechnik
    tvmoebel
    unterhaltungselektronik
    og
        badplanung
        daten-netzwerktechnik
        warmwasser_dezentral
    dachbereich
        dach
        gaube
        schornstein
        photovoltaik-solartechnik
        solarthermie
        jalousie
        ueberspannungsschutz
        antennen-satellitenanlagen	
    bewegungsmelder
	

    */