/* ------------------------------------------------------------ *\
#################################################################
	Telekomkonfigurator
#################################################################
\* ------------------------------------------------------------ */

/* ------------------------------------------------------------ *\
	Gemeinde Auswahl
\* ------------------------------------------------------------ */
.konfigurator-gemeinde {}
.page-template-04-konfigurator-telekom-geschaeft .konfigurator-gemeinde {padding-bottom: 120px;}
.konfigurator-gemeinde h3 {margin-bottom: 20px !important}
/* Liste gemeinde */
.liste-gemeinde {}
.liste-gemeinde ul{display:-webkit-box;display:-ms-flexbox;display:flex;list-style-type:none;}
.liste-gemeinde li{margin-right:10px;}
.liste-gemeinde li:last-child{margin-right:0;}
.liste-gemeinde a.is-active img{opacity:0;}

@media (max-width:1023px){
.liste-gemeinde ul{-ms-flex-wrap:wrap;flex-wrap:wrap;}
.liste-gemeinde li{margin-bottom:10px;}
}
 
@media (max-width:767px), screen and (max-width:812px) and (orientation:landscape){
.liste-gemeinde{margin-bottom:0px;}
.page-template-04-konfigurator-telekom-geschaeft .konfigurator-gemeinde {padding-bottom: 80px;}
}



/* ------------------------------------------------------------ *\
	Anschluss Auswahl
\* ------------------------------------------------------------ */
.konfigurator-anschluss {padding-top: 20px;}
.konfigurator-anschluss-inner{ display: none;}
.konfigurator-anschluss-content {display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap; -webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}
.anschlussart {margin: 0 50px;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap; -webkit-box-orient:vertica;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center}
.anschlussart .btn {margin-top: 30px;}

.gemeinde.is-active, .anschlussartbutton.is-active {  padding: 0 30px 0 30px !important;}
@media (max-width:767px), screen and (max-width:812px) and (orientation:landscape){
.gemeinde.is-active, .anschlussartbutton.is-active { padding: 0 15px 0 15px !important;}
.konfigurator-anschluss-content {-ms-flex-pack:distribute;justify-content:space-around}
.anschlussart {margin: 0 0;}
}




/* ------------------------------------------------------------ *\
	Telekom-Konfigurator Overlay
\* ------------------------------------------------------------ */
.konfigurator-overlay { position: relative; background-color: #D9E3EC;}
.konfigurator-overlay-inner {position: absolute; height: 100%;background-color: transparent; opacity: 0;; top: 0; left: 0; right: 0; bottom: 0; z-index: 9; }
.konfigurator-overlay.active > * {opacity: 0.5;}


.konfigurator-mobile, .konfigurator-tv { position: relative;}
.konfigurator-mobile .overlay-active > *, .konfigurator-tv .overlay-active > *{opacity: 0.5;}


.mobile-overlay,.tv-overlay {opacity: 1; width: 100%;height: 100%;position: absolute;z-index: 4;background-color: transparent; top: 0; left: 0; right: 0; bottom: 0; z-index: 9;display:-webkit-box;display:-ms-flexbox;display:flex; -ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:cente;-ms-flex-pack:center;justify-content:center;}
.mobile-overlay, .tv-overlay{ visibility: hidden;}
.mobile-overlay-inner, .tv-overlay-inner { opacity: 1;  width: 80%; background: #10275E; border-radius: 8px; color: #FFF;margin: 0 auto;text-align: center; padding: 40px;}
.mobile-overlay-inner .btn--white, .tv-overlay-inner .btn--white {color: #10275E !important; }
.mobile-overlay-inner .btn--white:hover, .tv-overlay-inner .btn--white:hover {background: #D12626 }





/* ------------------------------------------------------------ *\
	Telekom-Konfigurator �bersicht - Actions
\* ------------------------------------------------------------ */
.section-actions .col a.btn + a.btn {margin-left: 10px;}
.section-actions-buttons {display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}
.section-actions-buttons .btn--transparent-alt {margin-left: 15px;}





/* ------------------------------------------------------------ *\
	Module-Titel mit Icons
\* ------------------------------------------------------------ */
/*
h2.title-konfigurator {margin-bottom: 40px !important; position: relative}
h2.title-konfigurator-internet:before { background: url("../images/icon-konfigurator-internet.svg") no-repeat; width: 100px; height: 49px; margin: -10px 0 0 0; content: ""; display: block; float: left; background-position: left;}
h2.title-konfigurator-tv:before { background: url("../images/icon-konfigurator-tv.svg") no-repeat; width: 100px; height: 38px; margin:  -10px 0 0 0; content: ""; display: block; float: left; background-position: left;}
h2.title-konfigurator-festnetz:before { background: url("../images/icon-konfigurator-festnetz.svg") no-repeat; width: 100px; height: 50px; margin:  -15px 0 0 0; content: ""; display: block; float: left; background-position: left;}
h2.title-konfigurator-mobile:before { background: url("../images/icon-konfigurator-mobile.svg") no-repeat; width: 100px; height: 52px; margin:  -20px 0 0 0; content: ""; display: block; float: left; background-position: left;}


h2.title-konfigurator {margin-bottom: 40px !important; display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}
h2.title-konfigurator span:first-of-type {width: 90px;}
*/

.title-konfigurator {margin-bottom: 40px !important; display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}
.title-konfigurator span:first-of-type {width: 90px; margin-top: 5px}

@media (max-width:1023px){
.title-konfigurator span:first-of-type {width: 80px; }
.title-konfigurator span:first-of-type img { transform: scale(0.9);; }
}

@media (max-width:767px), screen and (max-width:812px) and (orientation:landscape){
.title-konfigurator span:first-of-type {width: 55px; }
.title-konfigurator span:first-of-type img { transform: scale(0.7); }
}

/* ------------------------------------------------------------ *\
	Button-Block (ohne Internet, ...)
\* ------------------------------------------------------------ */
.section-konfigurator-action {padding-top: 20px; padding-bottom: 35px;}

.btn--noselect {width: 100%; padding:0 25px 0 25px; height: 50px; color:#10275E;background-color: rgba(255, 255, 255, 0.5); border-radius:8px; font-weight:300;
display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-align:center!important;-ms-flex-align:center!important;align-items:center!important;-webkit-box-pack:center!important;-ms-flex-pack:center!important;justify-content:center!important;
-webkit-transition:all .3s ease;transition:all .3s ease;-o-transition:all .3s ease;transition:all .3s ease;transition:all .3s ease;}
.btn--noselect:hover{background-color:#10275E; color: #FFF}
.btn--noselect.active{background-color:#10275E; color: #FFF}
@media (max-width:767px), screen and (max-width:812px) and (orientation:landscape){
.btn--noselect {font-size:16px; height: 45px;}
}

.row.inactive {
    opacity: .5;
}


/* ------------------------------------------------------------ *\
	Aktiv oder inaktive Elemente
\* ------------------------------------------------------------ */
.tile-alt.active {background-color: rgba(255,255,255,1);}
.tile-alt.inactive {background-color: rgba(255,255,255,0.5);}

.tile-alt .btn--transparent svg {opacity: 0;}
.tile-alt.active .btn--transparent { background-color: #18275C;}
.tile-alt.active .btn--transparent span { display: none;}
.tile-alt.active .btn--transparent svg {opacity: 1;}


/* Telekom-Konfigurator Mobile Button wechselt zu Button mit  + -  */
.konfigurator-mobile .tile-alt .tile__actions {display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap; -webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}
.konfigurator-mobile .tile-alt.active .tile__btn {width: 50% !important}
.konfigurator-mobile .tile-alt .anzahlmobile{ display: none; }
.konfigurator-mobile .tile-alt.active .anzahlmobile{ display: inline-flex;}









/* ------------------------------------------------------------ *\
	Mein Paket
\* ------------------------------------------------------------ */
.generator-mein-paket {padding-bottom: 0px;}

.mein-paket-col {}
.mein-paket-col .zusatz {color: #10275E; font-weight:700}

/*.mein-paket {position:relative; margin:0 0 30px;background-color:#fff;border-radius:8px;color:#10275E;border:2px solid transparent;}*/
.mein-paket {position:relative; margin:0;background-color:#fff;border-radius:8px;color:#10275E;border:2px solid transparent; height: 95%}

.mein-paket .mein-paket__inner{padding:50px 20px 120px;}
.mein-paket .mein-paket__content{margin-bottom:15px;padding-bottom:15px;border-bottom:1px solid #B2C6D8;}

.mein-paket .mein-paket__entry{position:absolute;left:20px;right:20px; bottom:30px; }
.mein-paket .mein-paket__entry span{display:block;margin:0;font-size:15px;letter-spacing:.02em;color:#D12626;text-transform:uppercase; font-weight: 600; margin-bottom: -5px;display: -webkit-box;display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;}
.mein-paket .mein-paket__price{color:#D12626;}

.mein-paket h2{margin:0 0 30px;color:#10275E;-ms-word-break: break-all; word-break: break-all; word-break: break-word;-webkit-hyphens: auto; -moz-hyphens: auto; hyphens: auto;}
.mein-paket h3{margin:0 0 7px; text-transform:uppercase;font-weight:600;font-size:15px;display: -webkit-box;display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;}
.mein-paket h4{margin:0 0 5px ; font-weight: 300; padding-left: 30px;}
.mein-paket h4:before{content: "\2192";margin-right: 10px; margin-left: -33px;}


.section-konfigurator-anschluss {color: #10275E; padding:10px 0 40px }

@media (max-width:767px), screen and (max-width:812px) and (orientation:landscape){
.mein-paket {margin:0 0 30px; height: auto;}
.mein-paket h2{margin:0 0 30px;}
.mein-paket .mein-pake__inner{padding:35px 15px 160px;}

.mein-paket .mein-pake__entry{bottom:65px;}
.mein-paket .mein-pake__entry span{margin:10px 0 0;}
}







/* ------------------------------------------------------------ *\
	Dunkler Balken unten am Screen
\* ------------------------------------------------------------ */
.bottomselection { display: none; background: #10275E;padding: 15px 0; position:fixed; bottom:0; width: 100%; z-index:9; }
.bottomselector {display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap; align-items: flex-start; -webkit-box-pack:justify!important;-ms-flex-pack:justify!important;justify-content:space-between!important}

.bottomselectorcontainer {display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;}
.bottomselectorbox {width: 128px; padding: 5px 8px; background: #FFF; border: 2px solid #FFF;border-radius: 4px; font-size: 15px; color: #10275E; text-transform: uppercase; letter-spacing: 0.02; font-weight: 700; }
.bottomselectorbox.ohne {background: transparent; border: 2px solid #FFF; color: #FFF;}
.bottomselectorbox + .bottomselectorbox {margin-left: 10px; }
.bottomselectorbox span{ border-left: 1px solid black;padding-right: 5px;padding-left: 5px; display: inline-block;}

.bottomselectorbox-selection { text-overflow: ellipsis; text-overflow: "�"; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 1;  -webkit-box-orient: vertical;}
.bottomselectorbox-x { font-size: 9px; position: relative; bottom: 2px;padding-right: 0px !important;}

.bottomselectoractions {display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap; align-items: flex-start; -webkit-box-align:center!important;-ms-flex-align:center!important;align-items:center!important}
.bottomselectoractions .price {color: #FFF; text-align: right; font-size: 40px; font-weight: 700; line-height: .8; margin-right: 20px;}
.bottomselectoractions .price span {font-size: 15px; display: block}
/* Musste gemacht werden, damit Nur Price angesprochen werden kann*/
#priceSummary{ font-size: 40px !important;}

#mobilesummary span:first-of-type{ padding-left: 0; border-left: none;}

/* Btn Bestellen */
.btn-bestellen{padding:0 25px; height: 50px; border:2px solid #D12626 !important; border-radius:8px; background-color:#D12626;color:#fff;letter-spacing:.02em;font-weight:400; 
display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;
-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-align:center!important;-ms-flex-align:center!important;align-items:center!important;-webkit-box-pack:center!important;-ms-flex-pack:center!important;justify-content:center!important;
-webkit-transition:all .3s ease;transition:all .3s ease;-o-transition:all .3s ease;transition:all .3s ease;transition:all .3s ease;
}
.btn-bestellen:hover{background-color:#FFF; border:2px solid #FFF !important; color:#10275E;}

/* Button Disabled */
.disabled-button, .disabled-button:hover{cursor: not-allowed; opacity: .5;}


/* Btn Beratung */
.btn-beratung{padding:0 25px; height: 50px; border: 2px solid #FFF !important; border-radius:8px; background-color:transparent;color:#fff;letter-spacing:.02em;font-weight:400; margin-left: 15px;
display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;
-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-align:center!important;-ms-flex-align:center!important;align-items:center!important;-webkit-box-pack:center!important;-ms-flex-pack:center!important;justify-content:center!important;
-webkit-transition:all .3s ease;transition:all .3s ease;-o-transition:all .3s ease;transition:all .3s ease;transition:all .3s ease;
}
.btn-beratung:hover{background-color:#D12626; border: 2px solid #D12626 !important;color:#FFF;}

.bottomselectortooltip{position: absolute; top: -80px; padding:20px 15px 20px;background-color:#D12626;border-radius:8px;font-family:"Sofia Pro", Verdana, Arial, sans-serif; color:#fff; font-size: 18px; font-weight: 300; border: none; box-shadow: none; max-width: 300px; margin-left: 70px;}
.bottomselectortooltip{ visibility: hidden;}
.bottomselectortooltip.visible{ visibility: visible;}



@media (max-width:1199px){
.bottomselection { padding: 10px 0;  }
.bottomselectoractions {width: 100%;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}

.bottomselectorcontainer {display: none !important} 
.btn-bestellen {padding:0 20px; height: 45px;}
.btn-beratung {padding:0 20px; height: 45px;}

.bottomselectoractions .price { font-size: 32px; text-align: left; line-height:.8}
.bottomselectoractions .price span {font-size: 14px; }
#priceSummary{ font-size: 32px !important;}
}

@media (max-width:767px), screen and (max-width:812px) and (orientation:landscape){
.bottomselection { padding: 10px 0;  }
.bottomselectoractions {width: 100%;align-items: flex-start;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;}

.bottomselectoractions .price { font-size: 32px; text-align: left; line-height:.8}
.bottomselectoractions .price span {font-size: 14px; }
#priceSummary{ font-size: 32px !important;}

.btn-bestellen {padding:0 20px; height: 45px;}

.btn-beratung {display: none !important}

.bottomselectortooltip{top: -75px; max-width: 300px; margin-left: 0; right: 15px;}
}




/* ------------------------------------------------------------ *\
	Form Optionen
\* ------------------------------------------------------------ */
.radio { margin: 0.5rem 0 0 0;}
.radio label{  color: #18275C;}
.radio input[type="radio"] { position: absolute; opacity: 0;}
.radio input[type="radio"] + .radio-label:before{content:'';background:#FFF;border-radius:100%;border:2px solid #18275C;display:inline-block;width:1em;height:1em;position:relative;margin-right:1em;vertical-align:top;cursor:pointer;text-align:center;transition:all 250ms ease;top:3px}
.radio input[type="radio"]:checked + .radio-label:before { background-color: #18275C; box-shadow: inset 0 0 0 3px #fff;}
.radio input[type="radio"]:focus + .radio-label:before { outline: none; border-color: #18275C;}
.radio input[type="radio"] + .radio-label:empty:before { margin-right: 0;}





/*checkbox css start*/
[type="checkbox"]:checked,[type="checkbox"]:not(:checked){position:absolute;visibility:hidden;}
[type="checkbox"]:checked + label,[type="checkbox"]:not(:checked) + label{position:relative;padding-left:40px;cursor:pointer;line-height:20px;display:inline-block;color:#273869;}
[type="checkbox"]:checked + label:before,[type="checkbox"]:not(:checked) + label:before{content:'';position:absolute;left:0;top:0;width:24px;height:24px;border:2px solid #18275C;background:#FFF;border-radius:0px;}
[type="checkbox"]:checked + label:after,[type="checkbox"]:not(:checked) + label:after{content:'';background:#273869;height:16px;width:16px;position:absolute;top:4px;left:4px;border:0;}
[type="checkbox"]:not(:checked) + label:after{opacity:0;-webkit-transform:scale(0);transform:scale(0);}
[type="checkbox"]:checked + label:after{opacity:1;-webkit-transform:scale(1);transform:scale(1);}



/* Anzahl + - */
.input-group { border: 2px solid #10275E; display: inline-block; border-radius: 8px; padding: 2px 0;}
.btn-minus {background-color: transparent;border: 0; padding: 5px 5px 8px 15px;outline: none;color: #10275E;}
.btn-plus {background-color: transparent;border: 0;padding: 5px 15px 7px 5px;margin-right: 0;outline: none;color: #10275E;}
.imputnumber { background-color: transparent;border: 0; border-radius: 0;width: 25px; text-align: center; display: inline-block; vertical-align: middle; color: #10275E;}
.minus, .plus{display: inline-block;vertical-align: middle;text-align: center;}
			



.section-konfigurator-options .input-group {margin-top: -25px;}
.section-konfigurator-options .m-padding-left {padding-left: 55px;}
@media (max-width:992px){
.section-konfigurator-options .input-group {margin: 15px 0;}
}



.section-konfigurator-options h3 {margin-bottom: 1em !important;line-height: 1;}




/* ------------------------------------------------------------ *\
#################################################################
	Gaskonfigurator
#################################################################
\* ------------------------------------------------------------ */
.konfigurator-gaskonfigurator {}
.konfigurator-gaskonfigurator .konfigurator-inner {  padding: 30px 15px 50px;}

#gasslider{  margin-right: 185px; margin-left: 235px;position: relative;}

/* links vom handle roter slider */
#gasslider .leftcolor{background-color: #D12626;display: block;position: absolute;top: 0;left: 0;bottom: 0;}
/* links/rechts vom Slider roter Ueberschuss (gehoert nicht zum slider */
#gasslider .ueberschuss-links { background: #D12626; width: 235px; margin-left: -235px; height: 7px; border-radius: 5px 0px 0px 5px; -moz-border-radius: 5px 0px 0px 5px;-webkit-border-radius: 5px 0px 0px 5px;}
#gasslider .ueberschuss-rechts { background: #9FA9BF;width: 185px; position: absolute; height: 7px; right: -185px; top: 0; border-radius: 0px 5px 5px 0px; -moz-border-radius: 0px 5px 5px 0px; -webkit-border-radius: 0px 5px 5px 0px;}


.gasslider-outher .imagewrapper{display: flex;justify-content: space-between; align-items: center;margin-left: 200px;margin-right: 190px;}

.gasslidericon{background-repeat: no-repeat;background-position: center; background-size: contain; cursor: pointer;margin-bottom: 30px;}

.emptyicon{cursor: auto;}
.einfamilienhaus{width: 31px;height: 32px; background-image: url(../images/gas-icon-1.svg);}
.einfamilienhaus.active{width: 31px;height: 32px; background-image: url(../images/gas-icon-red-1.svg);}
.doppeleinfamilienhaus{width: 49px;height: 36px;background-image:url(../images/gas-icon-2.svg);}
.doppeleinfamilienhaus.active{width: 49px;height: 36px;background-image:url(../images/gas-icon-red-2.svg);}
.mehrfamilienhaus{width: 31px;height: 42px;background-image:url(../images/gas-icon-3.svg);}
.mehrfamilienhaus.active{width: 31px;height: 42px;background-image:url(../images/gas-icon-red-3.svg);}

.konfigurator-gaskonfigurator input.sliderValue {margin-top:10px}

@media (max-width:1599px){
#gasslider{margin-right: 40px; margin-left: 80px;}
#gasslider .ueberschuss-links { width: 80px;  margin-left: -80px;}
#gasslider .ueberschuss-rechts { width: 40px; right: -40px; }
.gasslider-outher .imagewrapper{margin-top: 20px; margin-left: 40px;margin-right: 45px;}
}

@media (max-width:991px){
#gasslider{margin-right: 40px; margin-left: 80px;}
#gasslider .ueberschuss-links { width: 80px;  margin-left: -80px;}
#gasslider .ueberschuss-rechts { width: 40px; right: -40px; }
.gasslider-outher .imagewrapper{margin-top: 20px; margin-left: 40px;margin-right: 45px;}
}

@media (max-width:767px), screen and (max-width:812px) and (orientation:landscape){
#gasslider{margin-right: 40px; margin-left: 80px;}
#gasslider .ueberschuss-links { width: 80px;  margin-left: -80px;}
#gasslider .ueberschuss-rechts { width: 40px; right: -40px; }
.gasslider-outher .imagewrapper{margin-top: 20px; margin-left: 40px;margin-right: 45px;}
}









/* ------------------------------------------------------------ *\
#################################################################
	Stromkonfigurator
#################################################################
\* ------------------------------------------------------------ */
.konfigurator-stromkonfigurator {}
.konfigurator-stromkonfigurator .konfigurator-inner {  padding: 30px 15px 50px;}

#stromslider{  margin-right: 100px; margin-left: 150px;position: relative;}

/* links vom handle roter slider */
#stromslider .leftcolor{background-color: #D12626;display: block;position: absolute;top: 0;left: 0;bottom: 0;}
/* links/rechts vom Slider roter Ueberschuss (gehoert nicht zum slider */
#stromslider .ueberschuss-links { background: #D12626; width: 150px; height: 7px; margin-left: -150px; border-radius: 5px 0px 0px 5px; -moz-border-radius: 5px 0px 0px 5px;-webkit-border-radius: 5px 0px 0px 5px;}
#stromslider .ueberschuss-rechts { background: #9FA9BF;width: 120px; height: 7px; position: absolute; right: -120px; top: 0; border-radius: 0px 5px 5px 0px; -moz-border-radius: 0px 5px 5px 0px; -webkit-border-radius: 0px 5px 5px 0px;}

.konfigurator-slider .ui-slider-handle{margin-left: -22px !important;}

.stromslider-outher .imagewrapper{display: flex;justify-content: space-between;margin-left: 100px;margin-right: 90px;}


.stromslidericon{width: 60px;height: 33px;background-repeat: no-repeat;background-position: center; background-size: contain; cursor: pointer;margin-bottom: 30px;}
.emptyicon{cursor: auto;}
.singlehaushalt{background-image: url(../images/strom-icon-1.svg);}
.singlehaushalt.active{background-image: url(../images/strom-icon-red-1.svg);}
.paar{background-image:url(../images/strom-icon-2.svg);}
.paar.active{background-image:url(../images/strom-icon-red-2.svg);}
.familie{background-image:url(../images/strom-icon-3.svg);}
.familie.active{background-image:url(../images/strom-icon-red-3.svg);}
.haus{background-image:url(../images/strom-icon-4.svg);}
.haus.active{background-image:url(../images/strom-icon-red-4.svg);}
.individuell{background-image:url(../images/strom-icon-5.svg);}
.individuell.active{background-image:url(../images/strom-icon-red-5.svg);}

@media (max-width:1023px){
#stromslider{margin-right: 40px; margin-left: 70px;}
#stromslider .ueberschuss-links { width: 70px;  margin-left: -70px;}
#stromslider .ueberschuss-rechts { width: 50px; right: -50px; }

.stromslider-outher .imagewrapper{margin-top: 20px; margin-left: 30px;margin-right: 40px;}
.stromslidericon{width: 40px;height: 25px; }
}

@media (max-width:767px), screen and (max-width:812px) and (orientation:landscape){
.stromslider-outher .imagewrapper{margin-top: 0px;}
#stromslider .ueberschuss-rechts { width: 40px; right: -40px; }
.stromslider-outher .imagewrapper{margin-top: 30px; margin-right: 50px;}
.stromslidericon{width: 32px;height: 19px;}
}




/* ------------------------------------------------------------ *\
	Slider-maximun-Hinweiws
\* ------------------------------------------------------------ */
.slider-tip {
    position: absolute;
    right: -100px;
    padding-bottom: 15px;
    pointer-events: none;
    font-size: 18px;
    color: #fff;
    bottom: 30px;
	display: none;
}
.slider-tip:before{content:'';position:absolute;width:0;height:0;left:50%;top:100%;-webkit-transform:translate(-50%, -15px);-ms-transform:translate(-50%, -15px);transform:translate(-50%, -15px);border-style:solid;border-width:12px 12px 0 12px;border-color:#D12626 transparent transparent transparent;}
.slider-tip .slider-tip__inner {
    width: 270px;
    padding: 15px;
    background-color: #D12626;
    border-radius: 8px;
    font-weight: 300;
}
@media (max-width:767px), screen and (max-width:812px) and (orientation:landscape){
.eingabefeld {margin-top: 50px;}
.eingabefeld h3{margin-bottom: 0px;}
.slider-tip {right: 0;}
.slider-tip:before{left:85%;}
}











/* ------------------------------------------------------------ *\
#################################################################
	Gaskonfigurator
#################################################################
\* ------------------------------------------------------------ */
.konfigurator-gaskonfigurator {}




/* ------------------------------------------------------------ *\
#################################################################
	Allgemeines
#################################################################
\* ------------------------------------------------------------ */
.konfigurator-inner {border-radius:8px; padding: 30px 15px}


/* ------------------------------------------------------------ *\
	JQUERY UI SLIDER
\* ------------------------------------------------------------ */
.konfigurator-slider { border: none !important; background: #9FA9BF !important; height: 7px !important;}
.ui-corner-all { border-radius: 10px;}
.konfigurator-slider.ui-corner-all{ border-radius: 0px;}
.konfigurator-slider .ui-slider-handle { top: -18px !important; margin-left: -44px !important;border: 2px solid #CF292D !important; background: #fff !important; font-weight: normal !important; color: #454545 !important; border-radius: 50% !important; width: 45px !important; height: 45px !important;}

/* ------------------------------------------------------------ *\
	kWh - Input-field
\* ------------------------------------------------------------ */
input.sliderValue { width: 100%; border: none !important;  border-bottom: 1px solid #40527E !important;  border: 0; outline: 0; border-radius: 0; font-size: 48px;font-weight: 700;color: #18275C;background: transparent;padding: 0;}









/* ------------------------------------------------------------ *\
#################################################################
	Bestell-Abschluss / Best�tigung
#################################################################
\* ------------------------------------------------------------ */
body.page-template-01-konfigurator-strom-abschluss {background: #D9E3EC;}
.bestellabschluss {padding-bottom: 100px;}
.bestellabschluss__inner {}

.section-adresse h3 {padding-top: 100px;}

@media (max-width:767px), screen and (max-width:812px) and (orientation:landscape){
.section-adresse h3 {padding-top: 60px;}
}


/* ------------------------------------------------------------ *\
	Table
\* ------------------------------------------------------------ */
.table{margin:0;text-align:right;overflow:hidden; border-bottom: 2px solid #40527E; padding-bottom: 15px;}
.table table {border-collapse: inherit;}

.table td {-webkit-transition:all .4s;-o-transition:all .4s;transition:all .4s; border: none; border-bottom:1px solid #B8C6D7;padding:7px 0;font-variant-numeric: tabular-nums;-moz-font-feature-settings: "tnum";-webkit-font-feature-settings:"tnum";font-feature-settings: "tnum";}




.tabelle-total_inner {border-top: 2px solid #40527E; padding-top: 25px; margin-top: 20px;}
table.rechnung td:nth-child(1){text-align:left;width:65%; font-weight: 700;}
table.rechnung td:nth-child(2){text-align:left; width:20%; color:#D12626; font-size: 48px; font-weight: 700;}
table.rechnung td:nth-child(3){color:#D12626; font-size: 48px; font-weight: 700;}
table.rechnung tr:first-of-type td{ border-bottom: none; }

.tabelle-rechnung {padding-top: 25px;}
table.abschluss td:nth-child(1){text-align:left;width:75%;}
table.abschluss td:nth-child(2){text-align:left; width:10%; }
table.abschluss td:nth-child(3){}
table.abschluss tr:last-of-type td{ border-bottom: none; }
table.abschluss tr:hover td {background:#FFF;}

@media (max-width:1023px){
table.rechnung td:nth-child(2){font-size:35px; }
table.rechnung td:nth-child(3){font-size: 35px;}
}

@media (max-width:767px), screen and (max-width:812px) and (orientation:landscape){
table.rechnung td:nth-child(1){text-align:left;width:40%;}
table.rechnung td:nth-child(2){font-size:32px; }
table.rechnung td:nth-child(3){font-size: 32px;}
}