/* ------------------------------------- Produkte ------------------------------------- */
.produkte, .produkte .container, .produkt-box, .produktInfos, .detailText, .produktDownloads{
	position: relative;
}
.produkte .container, .produkt-box, .detailText{
	z-index: 10;
}
.produkte h2{
	margin-bottom: 2.5rem;
	line-height: 1.1;
}
.produkt-box{
	border-radius: 1rem;
	padding: 1rem;
	margin: 1%;
}
.produkt-text, .produkt-preis{
	color: #fff;
	text-align: center;
	width: 300px;
	padding: 1rem;
	line-height: 1.1;
	font-weight: 700;
}
.produkt-text{
	border-top-left-radius: 1rem;
	border-top-right-radius: 1rem;
}
#strom-produkte .produkt-text, .produkt-text.strom, .produkt-text.strom-oeko, .produkt-text.wasser, .produkt-text.waerme{
	background-color: #004994;
}
#gas-produkte .produkt-text, .produkt-text.gas, .produkt-text.gas-oeko{
	background-color: #EF7D00;
}
.produkt-text.waerme{
	background-color: #f6a300;
}
.produkt-box h3{
	font-size: 1.35rem;
	margin-bottom: 0.5rem;
	min-height: 55px;
}
.produkt-icon{
	border-radius: 1rem;
	background-color: #fff;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 75%;
	width: 360px;
	height: 200px;
	box-shadow: 0px 3px 10px #959595;
}
.produkt-preis{
	border-bottom-left-radius: 1rem;
	border-bottom-right-radius: 1rem;
}
.produkt-preis p{
	font-size: 2rem;
	color: #fff;
	margin-bottom: 0;
}
.produkt-preis small{
	font-size: 1.25rem;
}
.produkt-preis span{
	font-size: 4rem;
}
.produkt-preis button{
	width: 90%;
	border-radius: 1rem;
	border: solid 2px #fff;
	color: #fff;
	font-weight: 700;
	padding: 1rem 5rem 1rem 1rem;
	margin: 1.5rem 0 0.8rem 0;
	background-color: transparent;
	font-size: 1.25rem;
	text-align: left;
	background: transparent url("/layout/pfeil-weiss.svg") no-repeat 95% center;
	background-size: 60px;
}
.produkte-bg{
	-webkit-mask-image: url("/layout/wavy-products-mask.svg");
	mask-image: url("/layout/wavy-products-mask.svg");
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-size: 100%;
	mask-size: 100%;
	-webkit-mask-position: top left;
	mask-position: top left;
	width: 101vw;
	height: 100%;
	position: absolute;
	top: 0;
	right: -6px;
	left: -6px;
	z-index: -1;
}
#produkte-home .produkte-bg{
	-webkit-mask-position: top left;
	mask-position: top left;
}
.produkt-preis.strom{
	background-image: linear-gradient(180deg, #004994 0%, #009EE3 75%);
}
.produkt-preis.strom-oeko{
	background-image: linear-gradient(180deg, #004994 0%, #76B82A 75%);
}
.produkt-preis.strom-steuerbar{
	background-image: linear-gradient(180deg, #004994 0%, #F37921 75%);}
.produkt-preis.gas{
	background-image: linear-gradient(180deg, #EF7D00 0%, #f6a300 75%);
}
.produkt-preis.gas-oeko{
	background-image: linear-gradient(180deg, #EF7D00 0%, #76B82A 75%);
}
.produkt-preis.wasser{
	background-image: linear-gradient(180deg, #004994 0% , #009FE3 75%);
}
.produkt-preis.waermepumpe{
	background-image: linear-gradient(180deg, #004994 0%, #f6a300 75%);
}
.produkt-preis.waerme{
	background-image: linear-gradient(180deg, #f6a300 0%, #EF7D00 75%);
}

#woinemer-strom{
	background-image: url("/layout/produkte/produkte_strom.jpg");
}
#woinemer-dynamisch{
	background-image: url("/layout/produkte/produkte_strom_dynamisch.jpg");
}
#woinemer-steuerbar{
	background-image: url("/layout/produkte/produkte_strom_steuerbar.jpg");
}
#woinemer-oeko{
	background-image: url("/layout/produkte/produkte_oekostrom.jpg");
}
#woinemer-mobil{
	background-image: url("/layout/produkte/produkte_emobil.jpg");
}
#woinemer-gas{
	background-image: url("/layout/produkte/produkte_gas.jpg");
}
#woinemer-oekogas{
	background-image: url("/layout/produkte/produkte_biogas.webp");
}
#woinemer-zero-gas{
	background-image: url("/layout/produkte/produkte_zerogas.png");
}
#woinemer-klares{
	background-image: url("/layout/produkte/produkte_wasser.jpg");
}
#waermepumpe{
	background-image: url("/layout/produkte/produkte_waermepumpe.webp");
}
#nachtspeicher{
	background-image: url("/layout/produkte/produkte_nachtspeicher.jpg");
}
#erdgastanken{
	background-image: url("/layout/produkte/produkte_gastankstelle.jpg");
}
#waerme-tarif{
	background-image: url("/layout/waerme_navi.png");
}
.produktInfos .produkte-bg{
	left: calc(((100vw - (1280px - 2.25rem)) / 2)* -1);
}
.produktInfos h2, .produktInfos h3{
	font-size: 1.5rem;
}
.produktInfos h2{
	font-size: 2rem;
}
.detailText img{
	margin: 1rem;
	float: right;
	border-radius: 50%;
	width: 150px;
	height: auto;
}
.produktDownloads{
	padding-bottom: 1.5rem;
}
.produktDownloads p{
	margin-bottom: 0;
}
.produktDownloads a{
	display: inline-block;
	margin: 0.5rem 0;
	background-color: #fff;
	border-radius: 0.5rem;
	width: 100%;
	padding: 1rem 1rem 1rem 3.5rem;
	box-shadow: 0px 0px 10px #C1C1C1;
	background-position: 1rem center;
	position: relative;
	z-index: 10;
}
.produktDownloads .hinweis-boxen .clickbox a{
	background-position: center center;
	box-shadow: none;
}
.produktDownloads .dots-bg{
	width: 100vw;
	height: calc(100% - 80px);
	bottom: 0;
	left: calc(((100vw - (1280px - 1.5rem)) / 2)* -1);
}
.produktDownloadsWaerme .dots-bg{
	height: 15%;
}
.produktDetails{
	padding: 2rem 0;
	position: relative;
}
.produktDetails .dots-bg{
	width: 45vw;
  	height: 140px;
  	bottom: 0;
  	left: calc(((100vw - (1280px - 1.5rem)) / 2)* -1);
  	z-index: 0;
}
.produktDetails .shape-mask{
	right: -10%;
	top: 2rem;
	background-image: linear-gradient(120deg, rgba(0,159,227,0.25) 25% , rgba(239,124,0,0.25) 75%);
}
.produktDetails .arrowUp{
	width: 35px;
	right: -1rem;
	top: 4rem;
}
.produktDetails .arrowUp:nth-child(2){
	width: 25px;
	right: calc(1.5rem + 25px);
	top: 2.5rem;
}

.emobil-box{
	position: relative;
	padding: 0;
	box-shadow: 0px 3px 10px #959595;
	border-radius: 1rem;
	margin: 1%;
	z-index: 10;
	justify-content: flex-start;
}
.emobil-box p, .emobil-box h3{
	color: #004994;
}
.emobil-box p{
	margin-bottom: 0;
}
.emobil-box th{
	border-bottom: 0px solid #004994;
}
.emobil-box td{
	padding: 0.25rem 0;
	min-width: 50%;
	/*border-top: 1px solid #004994;*/
	vertical-align: top;
}
.emobil-box td:nth-child(2){
	text-align: right;
}
.emobil-text{
	background-color: #fff;
  	width: 100%;
	border-top-left-radius: 1rem;
  	border-top-right-radius: 1rem;
	text-align: center;
	padding: 1rem;
  	line-height: 1.1;
  	font-weight: 700;
	height: 130px;
}
.emobil-text .darkBlueBG{
	width: calc(100% + 2rem);
  	height: auto;
  	padding: 0.5rem 1rem;
  	border-top-left-radius: 1rem;
  	border-top-right-radius: 1rem;
  	margin-bottom: 1rem;
	margin-top: -1rem;
	color: #fff;
}
.emobil-box:first-of-type .emobil-text .darkBlueBG{
	/*margin-top: -2.5rem;*/
}
.emobil-text p{
	margin-bottom: 0;
}
.emobil-text h3{
	margin-bottom: 0.5rem;
	font-size: 1.5rem;
}
.emobil-preis{
	background-color: #efefef;
	color: #004994;
	width: 100%;
	border-bottom-left-radius: 1rem;
  	border-bottom-right-radius: 1rem;
	padding: 1rem;
}
.emobil-box hr{
	border-top: 2px dotted #004994;
	margin: 1rem 0;
}
@media only screen and (max-width: 1280px){
	.produkt-icon{
		width: 100%;
	}
	.produkt-text, .produkt-preis{
		width: 90%;
	}
	.produktInfos .produkte-bg, .produktDetails .dots-bg, .produktDownloads .dots-bg{
		left: -20px;
	}
	.produktInfos .produkte-bg{
		top: 0;
	}
	.produktDetails .dots-bg{
		bottom: 0.5rem;
	}
	
}
@media only screen and (max-width:1024px){
	#strom-produkte .produkt-box{
		width: 48%;
	}
	.produkt-icon{
		background-size: 60%;
		height: 200px;
	}
}
/*@media only screen and (max-width: 960px){
	#strom-produkte .produkt-box:nth-of-type(3){
		margin: 2rem auto;
	}
}*/
@media only screen and (max-width: 820px){
	/*#strom-produkte .produkt-box:nth-of-type(3){
		margin: 0;
	}*/
	#strom-produkte .produkt-box{
		/*width: 100%;*/
		margin: 2.5rem auto 0 auto;
	}
	.produkt-box h3{
		min-height: 25px;
	}
	/*.produkt-icon{
		background-size: 40%;
	}*/
	.produkte-bg{
		mask-size: 200vw;
		-webkit-mask-size: 200vw;
	}
	.produktDetails .shape-mask{
		-webkit-mask-position: center right;
		mask-position: center right;
	}
}
@media only screen and (max-width: 680px){
	#strom-produkte .produkt-box{
		width: 100%;
	}
	.produkt-icon{
		background-size: 40%;
		height: 150px;
	}
	.emobil-box{
		margin: 5% 1%;
	}
	
}
@media only screen and (max-width: 560px){
	.produkt-icon{
		background-size: 65%;
	}
}
.orderButton {
	
}