/* Tabs_no_image CSS (root element for tabs) */
ul.css-tabs {  
	margin:0 !important; 
	padding:0 !important;
	border-bottom:0px solid #999999;
	width: 100%;
}
ul.css-tabs::before {  
    content: "";
    clear: both;
    display: block;
	margin-top:2em;
}

/* single tab */
ul.css-tabs li {
	padding:0;
	margin:0;
	border:0px solid #FFF;
	list-style:none;
	white-space: nowrap;
	display: table-cell;
	width: 1%;
}
ul.css-tabs li:nth-child(1) {
	border-left:0px solid #FFF;
} 
ul.css-tabs li:nth-child(1) a{

}
ul.css-tabs li:nth-last-child(1) a{
	border-right:0px solid #FFF;
}

ul.css-tabs a {
	font-weight:bold;
	border:0px solid #FFF;
	border-right:3px solid #FFF;
	border-bottom:3px solid #FFF;
	display:block;
	padding:4px 6px;
	color:#fff;
	cursor:pointer;
}

div ul.kennzeichnung_head a{
	padding: 6px 8px;
	border-width: 0px 6px 6px 0px;
	line-height: 1.1;
}

/* orange table */
ul.css-tabs.orange a.current  {
	background-color:#EFEFEF;
	cursor:default;
	color:#E88C29;
}
.css-tabs.orange a {
	background-color:#E88C29;
}
ul.css-tabs.orange a:hover {
	background-color: #EFEFEF;
	color:#E88C29;
}

/* Green Table */
ul.css-tabs.oekogreen a.current {
	background-color:#EFEFEF;
	color:#54A121;
	cursor:default;
}
.css-tabs.oekogreen a {
	background-color:#54A121;
}
.css-tabs.oekogreen a:hover {
	background-color: #EFEFEF;
	color:#54A121;
}

/* Grey Table */
ul.css-tabs.grey a.current {
	background-color:#EFEFEF;
	color:#CCC;	
	cursor:default;
}
.css-tabs.grey a {
	background-color:#CCC;
}
.css-tabs.grey a:hover {
	background-color: #EFEFEF;
	color:#CCC;
}

/* Blue Table */
ul.css-tabs.blue a.current {
	background-color:#EFEFEF;
	color:#026BAF;	
	cursor:default;
}
.css-tabs.blue a {
	background-color:#026BAF;
}
.css-tabs.blue a:hover {
	background-color: #EFEFEF;
	color:#026BAF;
}

/* tab pane */
.css-panes div {
	display:none;
	min-height:1rem;
	height: auto;
	background-color:#EFEFEF;
}
ul.css-tabs li.wrap {
    display: none;
}

@media only screen and (max-width: 768px){
	ul.css-tabs li.wrap {
    	display:table-row;
	}
}



/* Tabelle Produkt-Seiten */
.preistabelle {
	border-collapse: collapse;
	position: relative;
	float:left;
	clear: both;
	border: none;
	padding:0.5rem;
	font-size:0.9rem;
	width:100%;
	height: auto;
}
.preistabelle tr{
	background-color:#F9F9F9;
}
.preistabelle tr.dark{
	background-color: #E3E3E3;
}
.preistabelle tr:nth-child(2n){
	background-color:#E3E3E3;
}
.preistabelle td {
	border-bottom:3px solid #FFF;
	border-right:3px solid #FFF;
	padding: 0.5rem;
	vertical-align:baseline;
}
.preistabelle th {
	border-bottom:3px solid #FFF;
	border-right:3px solid #FFF;
	padding:0.8rem 0.5rem;
	vertical-align:baseline;
	font-size:1.1rem;
	text-align:left;
}
.preistabelle td:nth-child(4n){
	border-right:none;
}
.preistabelle td:nth-child(3n){
	border-right:none;
}


/* CSS Boxen 2015 */
/* Boxen Festlegung */
.produkt-text{
	/*float-left;*/
	padding-top:1rem;
	clear: left;
}
.produktfelder{
	/*margin:0 0 1rem 0;*/
	padding:0px;
	width:100%;
	height:11rem;
}

/*.produktfelder:after {
  content: '';
  clear: both;
  display: block;
}
*/
.produktfelder .text H2{
	color:#FFF;
	margin:0;
}
.produktfelder .text{
	background-color:#999;
	position:absolute;
	padding: 0.6rem 1rem;
	padding-right:0;
	font-weight:bold;
	top:0px;
	right:0px;
	height:50%;
	width:100%;
}
.produktfelder .preis{
	position:absolute;
	padding: 1rem 1rem;
	padding-right:0;
	bottom:0px;
	right:0px;
	height:50%;
	width:100%;
	color:#FFF;
}
.produktfelder .textonly {
    padding:0px;
	height:56%;
}
.p-left{
	position:relative;
	height:100%;
	width:50%;
	float:left;
	background-color: #FFF;
	-webkit-box-shadow: inset 0px 0px 30px 30px rgba(50, 50, 50, 0.65);
	-moz-box-shadow: inset 0px 0px 30px 30px rgba(50, 50, 50, 0.65);
	box-shadow: inset 0px 0px 30px 30px rgba(239, 239, 239, 1);
}
.p-left .p-inner{
	background-size: 85% auto;
	background-repeat:no-repeat;
	background-position:center center;
	width:100%;
	height:100%;
}
.p-left .shift{ /* Nachtstrom + Wärmepumpen*/
	background-size: auto 80% ;
	/*background-position:center bottom;*/
}
.p-right{
	position:relative;
	height:100%;
	width:50%;
	float:left;
	color:#FFF;
}
.p-right:after{
  content: '';
  clear: both;
  display: block;
}

.bestellen, .bestellen2018{
	position:absolute;
	padding: 0.5rem 0.75rem 0.5rem 0.75rem;
	background-color:#EFEFEF;
	font-weight: bold;
	line-height: 1;
	height: 2rem;
	width: 7rem;
	bottom:0px;
	right:0px;
	/*z-index:999;*/
}
.bestellen a, .bestellen2018 a {
	background-size: 6px 10px;
	background-repeat:no-repeat;
	background-position:0px 9px;
	padding-left:10px;
}

.preis .ab{
	float:left;
	margin-right:0.6rem;
	font-size: 1.2rem;
	font-weight: bold;
}
.preis .kosten{
	float:left;
	margin-top: -1rem;
	font-size: 3.6rem;
	font-weight:bold;
	color:#FFF;
}
.preis .einheit{
	float:left;
	font-size:0.8rem;
	margin-left: 0.5rem;
	margin-top: 0.5rem;
	text-align: left;
}

.produkt_text:before {
  content: '';
  clear: both;
  display: block;
}


/* Produkt-Boxen Mittel */
.pb-wrap{
	position:relative;
	margin:0.5rem 0 2rem 0;
	padding:0;
	float:left;
	width:100%;
	height:100%;
}
.pb-wrap .combined .pbs-wrap{
	width:100%;
}
div.produkt-boxen div:nth-child(4){
	margin-right:0;
}
.produkt-boxen{
	position: relative;
	padding: 0px;
	height: 18rem;
	width: 48%;
	float: left;
	margin-bottom: 2rem;
}
.right{
	float: right !important;
	margin-right: 0px;
}
.left{
	float: left !important;
}
.pb-top{
	position:relative;
	height:50%;
	width:100%;
	background-color: #FFF;
	-webkit-box-shadow: inset 0px 0px 30px 30px rgba(239, 239, 239, 1);
	-moz-box-shadow: inset 0px 0px 30px 30px rgba(239, 239, 239, 1);
	box-shadow: inset 0px 0px 30px 30px rgba(239, 239, 239, 1);
}

.pb-top a{
	width: 100%;
    height: 100%;
    float: left;
}

.pb-inner{
	background-size: 80%  auto;
	background-repeat:no-repeat;
	background-position:center center;
	width:100%;
	height:100%;
}
.pb-headline p{
	text-align:center;
	vertical-align:center;
	font-weight:bold;
}

.duoboxen{
	float:left;
	width:48%;
	position: relative;
	height: 100%;
	margin-bottom: 2rem;
	color: #FFF;
}


.pb-bot{
	position:relative;
	height:50%;
	width:100%;
}
.pb-text{
	padding:1rem;
	color:#FFF;
}

/* Produkt-Boxen Klein */
.pb-small{
	position: relative;
	padding: 0px;
	height:100%;
	width: 49%;
	float: left;
}
.pbs-wrap{
	width:48%;
	height: 18rem;
	float:left;
}
.pbs-top{
	background-color:#EFEFEF;
	width:100%;
	height:45%;
	background-color: #FFF;
	-webkit-box-shadow: inset 0px 0px 30px 15px rgba(50, 50, 50, 0.65);
	-moz-box-shadow: inset 0px 0px 30px 15px rgba(50, 50, 50, 0.65);
	box-shadow: inset 0px 0px 30px 15px rgba(239, 239, 239, 1);
}
/* Boxen Klein Strom */
.pbs-inner{
	/*background-size: 80% auto;*/
	background-size: auto 70%;
	background-repeat:no-repeat;
	background-position:center center;
	width:100%;
	height:100%;
}

/* Boxen Servive */
#service-wrap .pbs-inner{
	background-size: auto 45%;
	background-repeat:no-repeat;
	background-position:center center;
	width:100%;
	height:100%;
}
.service_video{background: url("/images/icons/videoberatung.svg") ;}
.service_digital{background: url("/images/icons/digitale_rechnung.svg") ;}
.service_kontakt{background: url("/images/icons/kontakt.svg");}
.service_faq{background: url("/images/icons/faq.svg");}
.service_formular{background: url("/images/icons/formulare.svg");}
.service_strom{background: url("/images/icons/strom.svg");}
.service_gas {background: url("/images/icons/gas.svg");}
.service_wasser{background: url("/images/icons/wasser.svg");}
.service_waerme{background: url("/images/icons/waerme.svg");}
.service_info{background: url("/images/icons/info.svg");}
.service_download{background: url("/images/icons/download.svg");}
.service_angebote{background: url("/images/icons/angebote.svg") ;}
.service_informationsblaetter{background: url("/images/icons/informationsblaetter.svg") ;}
.service_energieausweis{background: url("/images/icons/energieausweis.svg") ;}
.service_sparen{background: url("/images/icons/sparen.svg") ;}
.service_infoservice{background: url("/images/icons/infoservice.svg") ;}
.service_newsletter{background: url("/images/icons/newsletter.svg") ;}
.service_nahverkehr{background: url("/images/icons/nahverkehr.svg") ;}
.service_planauskunft{background: url("/images/icons/planauskunft.svg") ;}
.service_beleuchtung{background: url("/images/icons/beleuchtung.svg") ;}
.service_baustellen{background: url("/images/icons/baustellen.svg") ;}
.service_msh{background: url("/images/icons/icons_hausanschluss-01.svg") ;}
.service_grabenprofil{background: url("/images/icons/icons_hausanschluss-02.svg") ;}
.service_hausanschlussraum{background: url("/images/icons/icons_hausanschluss-03.svg") ;}
.service_bauherren{background: url("/images/icons/bauherren.svg") ;}
.service_links{background: url("/images/icons/icon_factory.png") ;}


.pbs-bot{
	background-color:#E7E7E7;
	position:relative;
	padding:0.5rem 0.5rem 0rem 0.5rem;
	width:100%;
	height:55%;
}
.pbs-bot .bestellen a{
	color:#999;
}
.pbs-bot .bestellen a{
	background-image: url("/layout/arrow-right-gray.png");
	color:#999;
}
.pbs-text{
	color:#026BAF;
	font-size:0.9rem;
}

/* Untere Boxen auf Startseite 2017*/
.homebox .pbs-inner{
	background-size: auto 45%;
	background-repeat:no-repeat;
	background-position:center center;
	width:100%;
	height:100%;
}
.homebox a {
	font-size: 0.9em;
}
.homebox a:hover {
	text-decoration: underline;
}
.logo_portalbetreuung{
	background-image: url("/images/icons/portalbetreuung.svg");
	background-size: 45% auto;
}

/* ---- Top Infos --- */
.pb-aktuelles .pbs-text{
	color:#FFF;
}
.pb-aktuelles .pbs-top{
	height:55%;
}
.pb-aktuelles .top_infos .pbs-inner{
	background-size:100% 100%;
}
.pb-aktuelles .pbs-bot{
	height:45%;
	background-color:none;
}
.pb-aktuelles .pbs-wrap{
	height:20rem;
}

.kennzeichnung_head li a{
	height:3rem;
}

.stromkennzeichnung{
	background:#EFEFEF;
	min-height:20rem;
}
.stromkennzeichnung div{
	display:block;
}
.stromkennzeichnung .pane_wrap{
	height:100%;
	width:100%;
	margin:0;
	padding:0;
}
.stromkennzeichnung .diagramm{
	display:block;
	margin:0 auto;
	padding: 1rem 10rem 0rem 4rem;
}
.stromkennzeichnung .diagramm img{
	width:100%;
	height:100%;
	/*background-size:80%;*/
}

/*
.stromkennzeichnung .diagramm stromerzeugung{
	background: url("/images/strom/stromerzeugung.svg");
}
.stromkennzeichnung .diagramm gesamtstromlieferung{
	background: url("/images/strom/gesamtstromlieferung.svg");
}
.stromkennzeichnung .diagramm oekostrom_produkte{
	background: url("/images/strom/oekostrom_produkte.svg");
}
.stromkennzeichnung .diagramm energiemix{
	background: url("/images/strom/verbleibender_energiemix.svg");
}*/

.legende{
	margin-top:1rem;
	margin-left:0.1rem;
}
.legende img{
	max-width:100%;
	height:auto;
}

/* Bad Index */
#bad .left{
	width:50%;
}


/* Blaue Boxen */
.bg_blau {
    background-color: #026BAF;
}
.bg_blau .bestellen a {
	background-image: url("/layout/arrow-right-blue.png");
	color:#026BAF;
}

/* Orange Boxen */
.bg_orange {
    background-color: #E88C29;
}
.bg_orange .bestellen a {
	background-image: url("/layout/arrow-right-orange.png");
	color:#E88C29;
}

/* Grüne Boxen */
.bg_green {
    background-color: #54A121;
}
.bg_green .bestellen a {
	background-image: url("/layout/arrow-right-green.png");
	color:#54A121;
}

/* Graue Boxen */
.bg_gray {
    background-color: #999;
}
.bg_gray .bestellen a{
	background-image: url("/layout/arrow-right-gray.png");
	color:#999;
}

/*  Strom Produkte Logos */
.logo_strom101 {
	background-image: url("/images/logos/produkte_strom101.png");
}
.logo_strom {
	background-image: url("/images/logos/produkte_strom.png");
}
.logo_oekostrom{
	background-image: url("/images/logos/produkte_oekostrom.png");
}
.logo_e-mobil {
	background-image: url("/images/logos/produkte_e-mobil.png");
}
.logo_e-mobil-oeko{
	background-image: url("/images/logos/produkte_e-mobil-oeko.png");
}
.logo_smart{
	background-image: url("/images/logos/produkte_smart.png");
}

/* Boxen Klein Strom 09.10.2015 RZ */
.logo_waermepumpe{
	background-image: url("/images/logos/waermepumpen.svg");
}
.logo_nachtstrom{
	background-image: url("/images/logos/nachtspeicherheizung.svg");
}
.logo_grundversorgung{
	background-image: url("/images/logos/grundversorgung.svg");
}
.logo_stromkennzeichnung{
	background-image: url("/images/logos/stromkennzeichnung.svg");
}

/*  Gas Produkte */
.logo_gas{
	background-image: url("/images/logos/produkte_gas.png");
}
.logo_zerogas{
	background-image: url("/images/logos/produkte_zerogas.png");
}
.logo_biogas{
	background-image: url("/images/logos/produkte_biogas.png");
}
/* 03.08.2016 */
.logo_gas2018 {
	background-image: url("/images/logos/produkte_gas2018.png");
}
.logo_biogas2018{
	background-image: url("/images/logos/produkte_biogas2018.png");
}
/* 26.06.2017 */
.logo_gas2019 {
	background-image: url("/images/logos/produkte_gas2019.png");
}
.logo_biogas2019{
	background-image: url("/images/logos/produkte_biogas2019.png");
}
/* 16.07.2018 */
.logo_gas2020 {
	background-image: url("/images/logos/produkte_gas2020.png");
}
.logo_biogas2020{
	background-image: url("/images/logos/produkte_biogas2020.png");
}


/* Andere Produkte */
.logo_tanken{
	background-image: url("/images/logos/produkte_erdgas_tanken.png");
}
.logo_trinkwasser{
	background-image: url("/images/logos/produkte_wasser.png");
}
.logo_webu{
	background-image: url("/images/logos/produkte_webu.png");
}
.logo_hawei{
	background-image: url("/images/logos/produkte_hawei.png");
}


/*/~~~Bestellformular~~~ */
 
form .preistabelle{
	color:#026BAF;
}
#bestellformular{
	float:left;
	width:100%;
	margin-bottom: 4rem;
}
.bestellformular form .preistabelle{
	font-weight:500;
}
.obactive{
/*	background-color:#ECECEC !important;
	border-bottom:3px solid #ECECEC !important;*/
	color:#026BAF!important;	
}
.obpassive{
	background-color:#026BAF;
}
ul.css-tabs li div.obpassive a{
	border-width: 0px;
	border-style: none;
	padding: 0px 0px 0px 18px;
	background: transparent url("/layout/haken.svg") no-repeat scroll 0px 3px / 17px 16px;
}
.orderform-header li div{
	float:left;
	color:#FFF;
	font-size:1.0em;
	font-weight:bold;
	border:0px solid #FFF;
	border-right:3px solid #FFF;
	border-bottom:3px solid #FFF;
	display:block;
	padding: 1px 10px;
	margin-right:3px;
	width:100%;
	text-decoration:none;
	position:relative;
	height: 30px;
}

.orderform-header .preistabelle tr td{
	border-right: 0px solid #FFF;
}
.tariffelder{
	display:none;
	padding: 1rem;
	color: #4E4E4E;
	border: 1px solid #026BAF;
	margin-top: 15px;
}
.orderform{
	position:relative;
	float:left;
	width:100%;
}
.orderform div{
	background-color:#FF0000;
}
.orderform div:nth-child(2n){
	background-color:#00FF00;
}
.orderform div p{
	color:#999;
}
.orderform_segment td{
	height:4rem;
}
.orderform_segment td input.left_{
	float:left;
	height:100%;
	margin-right:2%;
	vertical-align:middle;
}

.vertrag_type input[type="radio"]{
	margin-right: 5px;
	margin-bottom: 10px;
}

.orderform_segment a img{
	margin-top: -2px;
}

.bestellform_left{
	position:relative;
	float:left;
	width:65%;
	margin-top: .79rem;
}
.bestellform_right{
	position:relative;
	float:left;	
}
.vertrag_type{
	width:100%;
	float:left;
}
.vertrag_form{
	float:left;
	width:100%;
	display:none;
}
.vertrag_daten{
	border-collapse: collapse;
	position: relative;
	float: left;
	clear: both;
	border: medium none;
	padding-left: 0.5rem;
	font-size: 0.8rem;
	min-width: 80%;
}
.vertrag_daten td{
	border-bottom: 3px solid rgba(255, 255, 255, 0);
	border-right: 3px solid rgba(255, 255, 255, 0);
	height:auto;
}
.vertrag_daten td input{
	float:none;
}
.vertrag_daten tr:nth-child(2n){
	background-color: rgba(255, 255, 255, 0);
}
.vertrag_daten td:nth-child(2n){
	border-right:none;
}

.orderform_wrap{
	max-width: 1060px;
	height:100%;
	padding:1rem;
	margin: 0 auto;
}
.orderform{
	float:left;
	border: 1px solid red;
}
.orderform_bottom{
	position:relative;
	/*border-bottom:0px solid #FFF !important;*/
	margin:0;
	/*padding:0 !important;*/
	width:100%;
	height:4rem !important;
}
.weiterbutton, .backbutton{
	position:absolute;
	bottom:8px;
	color:#FFF;
	background-color: #026BAF;
	border:none;
	min-width:12rem;
	height:3rem;
	font-weight:600;
}

.lockicon{
	padding-top:8px;
}

.lockicon img,
.lockicon p {
	float: left;
}

.lockicon img{
	margin-right: 10px;
	fill: #026BAF;
}

.backbutton{
    text-align: center;
    left: 8px;
    padding-top: .9rem;
}
.weiterbutton{
	right:8px;
}
.formerror p{
	color:#FF0000;
}
#postanschrift{
	display:none;
}
#postanschrift table{
	padding: 0.8rem 0.5rem;
}
#hide_tab{
	padding:0;
	border-bottom: 0px solid #FFF;
}
.boxtarifsub {
	/*color: #235093;*/
	display: block;
	height: 30px;
}

/*PF 19.10.2015*/

.rechner_ergebniss_small{
	display: none;
}


/*PF 19.10.2015 ENDE*/

@media screen and (max-width: 980px)  {
/*	.pbs-wrap{
		width:100%;
		margin-bottom:1rem;
	}*/
	.pb-small {
		width:100%;
		margin-bottom:1rem;
	}
	.pbs-wrap{
		width:49%;
	}
/*	.pbs-inner{
		background-size: 45%;
	}*/
}

@media screen and (max-width: 769px)  {
	.rechner_ergebniss_big{
		display: none;
	}
	.rechner_ergebniss_small{
		display: block
	}
	/* Produkt-Tabelle small */
	.b-strom li:nth-child(2) a{
		border-right:none;
	}
	.b-gas li:nth-child(3) a{
		border-right:none;
	}
	.kennzeichnung_head li:nth-child(2) a{
		border-right:none;
	}
/*	#bad .left{
	width:100%;
	}
*/	.bestellform_left{
		width:90%;
	}
}

@media screen and (max-width: 639px) {
    .p-left, .p-right, .duoboxen{
        width:100%;
    }	
	.p-left .p-inner{
		background-size: auto 60%;
	}
	.p-left .shift {
		background-size:  auto 85%;
		background-position: center center;
	}
	.vertrag_daten{
		min-width:100%;
	}
	.stromkennzeichnung .diagramm{
		padding:0rem;
	}
	.legende img{
		width:65%;
		margin-top:0rem;
	}
}

@media screen and (max-width: 480px) {
	.pb-small{
		height: 100%;
		width:100%;
	}
	.pb-inner{
		background-size: 75%;
	}
/*	.pbs-inner{
		background-size: 75%;
	}*/
	.weiterbutton, .backbutton{
		min-width: 9rem;
	}
	.produkt-boxen{
		position: relative;
		padding: 0px;
		height: 18rem;
		width: 100%;
	}
	.legende {
		margin-top: 1rem;
	}
}
@media screen and (max-width: 380px) {
	.pbs-wrap{
		width:100%;
		margin-bottom:1rem;
	}
/*	.pbs-inner{
		background-size: 45% auto;
	}*/
}
