/********************************************************************************************************************************/
/********************** MOBILE VERSION @ 390px Breite ***************************************************************************/

@media screen and (max-width: 680px) {

    
    

.mediaViewInfo {
	--web-view-name: main_wrapper;
	--web-view-id: main_wrapper;
	--web-enable-scale-up: false;	
	--web-scale-to-fit: false;
	--web-scale-to-fit-type: width;
	--web-enable-scale-up: false;
	--web-scale-on-resize: false;
	--web-center-horizontally: false;
	--web-enable-deep-linking: false;
}
:root {
	--web-view-ids: main_wrapper, header;
}
#main_wrapper {
	position: relative;
	overflow: hidden;
	--web-view-name: main_wrapper;
	--web-view-id: main_wrapper;
	--web-enable-scale-up: false;
	--web-scale-to-fit: false;
	--web-scale-to-fit-type: width;
	--web-enable-scale-up: false;
	--web-scale-on-resize: false;
	--web-center-horizontally: false;
	--web-enable-deep-linking: false;
}
#header {
	position: fixed;
	--web-view-name: header;
	--web-view-id: header;
	--web-enable-scale-up: false;
	--web-scale-to-fit: false;
	--web-scale-to-fit-type: width;
	--web-enable-scale-up: false;
	--web-scale-on-resize: false;
	--web-center-horizontally: false;
	--web-enable-deep-linking: false;
}	

/********************************************************************************************************************************/
/********************** WEBFONT OPENSANS ****************************************************************************************/

@font-face {
	font-family: 'Open Sans';
	font-style: normal;
	font-weight: 400;
	src: local('Open Sans'), local('OpenSans'), url('./OpenSans/OpenSans-Regular-400.woff') format('woff');
}

@font-face {
	font-family: 'Open Sans';
	font-style: normal;
	font-weight: 600;
	src: local('Open Sans Semibold'), local('OpenSans-Semibold'), url('./OpenSans/OpenSans-Semibold-600.woff') format('woff');
}

@font-face {
	font-family: 'Open Sans';
	font-style: normal;
	font-weight: 800;
	src: local('Open Sans Bold'), local('OpenSans-Bold'), url('./OpenSans/OpenSans-Bold.woff') format('woff');
}

@font-face {
	font-family: 'Open Sans';
	font-style: normal;
	font-weight: 1000;
	src: local('Open Sans Extrabold'), local('OpenSans-ExtraBold'), url('./OpenSans/OpenSans-ExtraBold.woff') format('woff');
}

/********************************************************************************************************************************/

@font-face {
	font-family: 'Open Sans Semibold';
	font-style: normal;
	font-weight: normal;
	src: local('Open Sans Semibold'), local('OpenSans-Semibold'), url('./OpenSans/OpenSans-Semibold-600.woff') format('woff');
}

@font-face {
	font-family: 'Open Sans Bold';
	font-style: normal;
	font-weight: normal;
	src: local('Open Sans Bold'), local('OpenSans-Bold'), url('./OpenSans/OpenSans-Bold.woff') format('woff');
}

@font-face {
	font-family: 'Open Sans Extrabold';
	font-style: normal;
	font-weight: normal;
	src: local('Open Sans Extrabold'), local('OpenSans-ExtraBold'), url('./OpenSans/OpenSans-ExtraBold.woff') format('woff');
}


/********************************************************************************************************************************/
/********************** CSS-ANIMATIONS ******************************************************************************************/

.faq_box_arrow,
.blick_box_arrow  {
	-webkit-transition-property: all;
	-moz-transition-property: all;
	-o-transition-property: all;
	transition-property: all;
	-webkit-transition-duration: 0.10s;
	-moz-transition-duration: 0.10s;
	-o-transition-duration: 0.10s;
	transition-duration: 0.10s;
	-webkit-transition-timing-function: linear;
	-moz-transition-timing-function: linear;
	-o-transition-timing-function: linear;
	transition-timing-function: linear;
}


.sub_navi_menue,
.faq_box_brown,
.blick_box_brown,
.text_window,
#result_content {
	-webkit-transition-property: all;
	-moz-transition-property: all;
	-o-transition-property: all;
	transition-property: all;
	-webkit-transition-duration: 0.30s;
	-moz-transition-duration: 0.30s;
	-o-transition-duration: 0.30s;
	transition-duration: 0.30s;
	-webkit-transition-timing-function: ease-in;
	-moz-transition-timing-function: ease-in;
	-o-transition-timing-function: ease-in;
	transition-timing-function: ease-in;
}

/********************************************************************************************************************************/
/********************** GLOBAL ELEMENTS *****************************************************************************************/


* {
	margin: 0;
	padding: 0;
	border: 0;
	box-sizing: border-box;
	border: medium;
}

html {
	-ms-text-size-adjust: none;
	-moz-text-size-adjust: none;
	-o-text-size-adjust: none;
	-webkit-text-size-adjust: none;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;		
}

body {
	-ms-text-size-adjust: none;
	-moz-text-size-adjust: none;
	-o-text-size-adjust: none;
	-webkit-text-size-adjust: none;
	background-color: #f8fdff;
	font-family: 'Open Sans', sans-serif, Arial;	
	letter-spacing: 0.01em;
	font-size: 14px;
	line-height: 18px;	
  color: rgba(0,0,0,1);
  text-align: left;
  font-style: normal;
  font-weight: normal;  
  max-width: 100%;
	overflow-x: hidden;
}

#main_wrapper {
	width: 390px;
	margin: 0px auto;
	overflow: hidden;
	position: absolute;
}

.no_mobile,
.no_mobile.showme {
	display: none !important;
}

.showme,
.mobile_element {
	display: block !important;
}

.section {
	padding: 70px 0px;
	min-height: 100px;
	width: 100%;
	clear: both;
}

.wrapper {
	width: 320px;
	height: inherit;
	margin: 0px auto;
	overflow: hidden;
}


/***********************************************************/
/********************** NO INPUT HIGHLIGHTS ****************/

input[type="file"] > input[type="button"]:-moz-focus-inner,
*:focus, *:visited, *:active, *:hover {
	outline: none !important;
	outline-style: none;
}

input[type="tel"]:focus, input[type="number"]:focus, input[type="text"]:focus, select:focus, textarea {
	outline: none !important;
	outline-style: none;
	box-shadow: 0 0 0px rgba(81, 203, 238, 0) !important;
}

input[type="checkbox"]:-moz-focusring,
input[type="radio"]:-moz-focusring,
input[type="tel"]:-moz-focusring,
select:-moz-focusring {
	color: transparent;
	text-shadow: 0 0 0 #000;
	outline: none !important;
	shadow: none;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
	-webkit-appearance: none !important;
	margin: 0;
}

input[type="number"] {
	-moz-appearance: textfield !important;
	-webkit-appearance: textfield !important;
}

input, select, option, textarea {
	font-family: 'Open Sans', sans-serif, Arial;
}



/***********************************************************/
/********************** CLAIMS *****************************/

.section_claim_white,
.section_claim_grey {
	position: relative;
	white-space: wrap;
	text-align: left;
	text-transform: uppercase;
	color: rgb(104, 105, 105);
	letter-spacing: 0px;
}

.section_claim_white {
	color: rgb(255, 255, 255);
}

.claim_top {
	overflow: visible;
	white-space: wrap;
	text-align: left;
	font-weight: 1000;
	font-size: 46px;
	line-height: 50px;
	color: rgb(251, 203, 61);
	text-transform: uppercase;
	margin-left: 0px;
	letter-spacing: 0px;
}

.claim_text {
	overflow: visible;
	font-size: 34px;
	line-height: 40px;
	font-weight: normal;
	letter-spacing: 0px;
	white-space: wrap;
}

.claim_sub {
	width: 194px;
	text-transform: uppercase;
	text-align: right;
	font-weight: 800;
	font-size: 14px;
	margin-top: -5px;
}

.claim_line {
	overflow: visible;
	margin-left: 1px;
	width: 194px;
	height: 3px;	
	transform: matrix(1, 0, 0, 1, 0, -5);
}

.claim_line path {
	fill: transparent;
	stroke-width: 4px;
	stroke-linejoin: miter;
	stroke-linecap: butt;
	stroke-miterlimit: 4;
	shape-rendering: auto;
	stroke: rgb(104, 105, 105);
}

.section_claim_white .claim_line path {
	stroke: rgb(255, 255, 255);
}


/***********************************************************/
/********************** TEXT-BOXEN ************************/

.text_box {
	position: relative;
	width: 100%;
	height: auto;
	margin-bottom: 30px;
}

.text_box .text_window {
	overflow: hidden;
	position: relative;
	width: 100%;
	min-height: 125px;
	max-height: 125px;
}

.text_box .text_window.open {
  /*max-height: 700px;*/
}

.text_box span {
	
}

.text_box .headline {
	font-weight: 1000;
	font-size: 16px;
	line-height: 24px;
	color: rgb(255, 255, 255);
	text-transform: uppercase;
	display: block;
	margin-bottom: 15px;
}

.text_box .highlight {
	font-weight: 800;
	color: #eb690b;
	padding: 0px;
}

.text_box .link {
	font-weight: 800;
	text-decoration: underline;
	display: block;
	margin-top: 18px;
	cursor: pointer;
	float: left;
	/*margin-bottom: 50px;*/
	clear: both;
}


/***********************************************************/
/********************** ARROW-BUTTONS **********************/

.button_arrow_yel,
.button_arrow_grey,
.button_arrow {
	position: relative;
	max-width: 320px;
	width: auto;
	height: 80px;
	padding-top: 7px;
	clear: both;
}

.button_label {
	white-space: nowrap;
	text-align: left;
	font-weight: bold;
	font-size: 18px;
	color: rgb(255, 255, 255);
	text-transform: uppercase;
	height: 62px;
	line-height: 60px;
	color: #fff;
	padding: 0px 30px 0px 90px;
	cursor: pointer;
	background-color: rgba(108,149,192,1);
	border-radius: 50px;
	float: left;
	width: 100%;
}

.button_circle {
	background-image: url('../img/pfeil_grey.svg');
	width: 75px;
	height: 75px;
	overflow: hidden;
	border-radius: 100%;
	border: 5px solid #6c95c0;
	background-size: auto 42px;
	background-position: center;
	background-repeat: no-repeat;
	background-color: #fff;
	margin-top: -7px;
	position: absolute;
	float: left;
}

.button_arrow_grey .button_label {
	background-color: rgb(104, 105, 105);
}

.button_arrow_grey .button_circle {
	border-color: rgb(104, 105, 105);
}

.button_arrow_yel .button_label {
	background-color: rgb(251,203,61);
	color: rgb(104, 105, 105);
}

.button_arrow_yel .button_circle {
	border-color: rgb(251,203,61);
}


/***********************************************************/
/********************** HOVER OBJECTS **********************/

.button_arrow_yel:hover .button_label,
.button_arrow_grey:hover .button_label,
.button_arrow:hover .button_label {
	background-color: rgb(234, 105, 16);
	color: rgb(255, 255, 255);
}

.button_arrow_yel:hover .button_circle,
.button_arrow_grey:hover .button_circle,
.button_arrow:hover .button_circle {
	border-color: rgb(234, 105, 16);
}

a {
	color: inherit;
	text-decoration: none;
}

.navigation a:hover,
.navigation a.active,
.sub_navi_menue a:hover,
.sub_navi_menue a.active,
.footer a:hover .footer_tab {
	color: rgb(234, 105, 16);
	padding-bottom: 0px;
	border-bottom: 0px solid rgb(234, 105, 16);
}


/***********************************************************/
/********************** SHADOW OBJECTS *********************/

.mail_button,
.navigation,
.filter_box:hover,
.shadow_on,
.sub_navi_menue,
.e-tool img {
	filter: drop-shadow(rgba(0, 0, 0, 0.16) 0px 3px 6px);
}

.filter_on1 {
	filter: drop-shadow(rgba(26, 67, 147, 0.4) 0px 2px 3px);
	border: 3px solid #0ce724;
	background-size: 110% !important;
}
.filter_on2 {
  filter: drop-shadow(rgba(26, 67, 147, 0.4) 0px 2px 3px);
  border: 3px solid #50d7de;
  background-size: 110% !important;
}
filter_on3 {
  filter: drop-shadow(rgba(26, 67, 147, 0.4) 0px 2px 3px);
  border: 3px solid #63d36a;
  /*background-size: 110% !important;*/
}

/********************************************************************************************************************************/
/********************** SECTIONS + ELEMENTS *************************************************************************************/


/***********************************************************/
/********************** TOP + NAVI *************************/
	
.header {
	position: fixed;
	top: 0px;
	z-index: 100;
	width: 100%;
	background-image: none;
	margin: 0px;
}

.header .wrapper {
	overflow: visible;
  height: 140px;
  width: 390px;
}

.navigation {
	background-image: url('../img/navigation_background_mobil.png');
	height: 110px;
	overflow: visible;
  background-size: 394px 110px;
  background-position: center bottom;
	background-repeat: no-repeat;
	z-index: 100;
	position: relative;
	padding-top: 0px;
  padding-left: 0px;
}

.logo {
	float: left;
	width: 100px;
	height: 83px;
	margin-top: 14px;
	margin-left: 35px;
}

.menue_button {
	float: right;
	width: 79px;
	height: 72px;
	margin-right: 37px;
	margin-top: 21px;
	cursor: pointer;
}

.logo a,
.menue_button a,
.logo a:hover,
.menue_button a:hover,
.logo img,
.menue_button img {
	width: inherit;
	height: inherit;
	border: 0px !important;
	padding: 0px !important;
}

.navigation a {
	float: right;
	text-decoration: none;
	color: #686969;
	margin-left: unset;
}

.nav_tab {
	margin-top: 10px;
}

.sub_navi_menue {
	background-color: #6c95c0;
	width: 390px;
	height: 875px;
	padding-top: 115px;
	padding-bottom: 50px;
	border-bottom-left-radius: 0%;
  border-bottom-right-radius: 0%;
	overflow: hidden;
	text-align: center;
	clear: both;
	position: absolute;
	z-index: 90;
	margin-top: -990px;
	margin-left: 0px;
	font-size: 20px;
	letter-spacing: 0.05em;
}

.sub_navi_menue.showme {
	margin-top: -110px;
}


#e-tool_logo_menue {
	width: 100%;
	height: 150px;
	margin: 0px auto;
	background-color: #f8fdff;
	bottom: 0px;
	position: absolute;
}

#e-tool_logo_menue img {
	width: 230px;
  height: 114px;
  margin: 17px auto;
}

.sub_navi_menue a {	
	text-decoration: none;
	font-weight: 400;
	color: #ffffff;
	display: block;
	border-bottom: 0px !important;
	padding-bottom: 0px !important;
}

.sub_navi_menue a .nav_tab {
	display: block;
	width: 100%;
	height: 20px;
	border-bottom: 0px !important;
	padding-bottom: 0px !important;
}

.sub_navi_menue a .nav_tab_top {
	display: block;
	font-weight: 1000;
	width: 100%;
	height: 25px;
	padding-bottom: 0px;
	margin-top: 30px;
}

.tab_top_line {
	overflow: visible;
	position: relative;
	width: 110px;
	height: 4px;
	transform: matrix(1,0,0,1,0,0);
	margin: 0px auto 5px;
}

.tab_top_line path {
	fill: transparent;
	stroke: rgba(255,255,255,1);
	stroke-width: 3px;
	stroke-linejoin: miter;
	stroke-linecap: butt;
	stroke-miterlimit: 4;
	shape-rendering: auto;
}


.mail_button {
	width: 64px;
	height: auto;
	position: absolute;
	top: 140px;
	margin-left: 293px;
}

.mail_button a,
.mail_button a svg {
	width: inherit;
	height: inherit;
}

.mail_button a:hover #Rechteck_13 {
          	stroke: #eb690b;
}
         
.mail_button a:hover #Ellipse_6 {
          	fill: #eb690b;
}



/***********************************************************/
/********************** TOP LIGHT **************************/

.section.top_light {
    background-image: url('../img/Gluhbirne_grau_web_mobil.png');
    background-color: #686969;
    color: #ffffff;
    height: 845px;
    background-size: auto 845px;
    background-position: center 0px;
    background-repeat: no-repeat;
    padding: 0px;
}

.section.top_text {
	background-color: #6c95c0;
	color: #ffffff;
	height: 345px;
	padding: 0px;
}

#top_light_claim {
    width: 320px;
    height: 222px;
    margin-left: 0px;
    top: 567px;
    left: unset;
}

#top_text_claim {
	width: 320px;
	height: 222px;
	margin-left: 0px;
	top: 190px;
	left: unset;
}

#top_light_claim .claim_line {
	margin-left: 2px;
}

#top_light_claim .small_add_claim {
	/*white-space: nowrap;*/
	margin-top: 30px;
	color: rgb(255, 255, 255);
	font-size: 20px;
	line-height: 22px;
	text-transform: none;
	padding-left: 2px;
}

#top_light_blue_ellipse {
	position: absolute;
	overflow: visible;
	width: 366px;
  height: 366px;
  left: 195px;
  top: -28px;
}

.top_light_blue_ellipse {
	fill: rgb(108, 149, 192);
}

#top_light_blue_white_fancy {
	position: absolute;
	width: 397px;
  height: 409px;
  left: 270px;
  top: 74px;
	overflow: hidden;
}

#top_light_blue_white_fancy img {
	width: 397px;
	height: 409px;
	left: 0px;
	top: 0px;
	overflow: visible;
}


/***********************************************************/
/********************** ABOUT US ***************************/

.section.about_us {
	padding: 40px 0px;
}

#about_us_logo {
	position: absolute;
	width: 260px;
	height: 43px;
	margin-left: 0px;
}

#about_us_logo img {
	width: inherit;
}

.news_details_big_text,
#about_us_big_text_gewerke,
#about_us_big_text {
	margin-left: 0px;
	position: relative;
	overflow: visible;
	width: 100%;
	margin-bottom: 0px;
}

.news_details_texts1, 
.news_details_texts2,
#about_us_texts1,
#about_us_texts2 {
	overflow: hidden;
	width: 100%;
	float: left;
	font-weight: 600;	
	margin-bottom: 30px;
}

#about_us_text2,
#about_us_text {
	margin-left: 0px;
	position: relative;
	overflow: visible;
	width: 100%;
	margin-bottom: 30px;
}

.news_details_big_text .headline,
#about_us_big_text_gewerke .headline,
#about_us_big_text .headline,
#about_us_text .headline {
	font-weight: 1000;
	font-size: 20px;
	color: rgb(108, 149, 192);
	text-transform: uppercase;
	display: block;
	margin-bottom: 15px;
}

#about_us_button {
	margin-left: 0px;	
}


/***********************************************************/
/********************** GEWERKE ****************************/

.section.gewerke {
	padding-top: 20px;
}

.section.gewerke .wrapper {
	padding-left: 0px;
}

.gewerke_boxen {
	margin-left: 0px;
	width: 320px;
	height: 450px;
	position: relative;
	margin-top: 0px;
	float: none;
}

.gewerke_boxen_row3 {
	clear: both;
	float: left;
	margin-bottom: 40px;
}

.gewerke_box {
	width: 100px;
	height: 100px;
	float: left;
	border-radius: 100%;
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	text-align: center;
	padding-top: 100px;
}

.gewerke_box span {
	font-size: 16px;
	font-weight: 800;
}

.gewerke_boxen_row3 .gewerke_box:nth-child(2) {
	margin: 0px 10px;
}

.gewerke_boxen_row2 {
	clear: both;
	float: left;
	padding: 0px 40px;
}

.gewerke_boxen_row2 .gewerke_box {
	margin: 0px 10px;
}

#gewerke_baecker {
	background-image: url('../img/gewerke_baecker.svg');
	border: 0px solid  #fbcb3d;
	color: #fbcb3d;
}

#gewerke_fleischer {
	background-image: url('../img/gewerke_fleischer.svg');
	border: 0px solid  #ea6910;
	color: #ea6910;
}

#gewerke_friseur {
	background-image: url('../img/gewerke_friseur.svg');
	border: 0px solid  #ea9b65;
	color: #ea9b65;
}

#gewerke_kfz {
	background-image: url('../img/gewerke_kfz.svg');
	border: 0px solid  #a7bfd9;
	color: #a7bfd9;
}

#gewerke_metall {
	background-image: url('../img/gewerke_metall.svg');
	border: 0px solid  #a4a5a5;
	color:  #a4a5a5;
}

#gewerke_textilreiniger {
	background-image: url('../img/gewerke_textilreiniger.svg');
	border: 0px solid  #6c95c0;
	color: #6c95c0;
}

#gewerke_tischler {
	background-image: url('../img/gewerke_tischler.svg');
	border: 0px solid  #329354;
	color: #329354;
}

#gewerke_weitere {
	background-image: url('../img/gewerke_weitere.svg');
	border: 0px solid  #8966a4;
	color: #8966a4;
}

#gewerke_baecker.invert {
	background-image: url('../img/gewerke_baecker_invert.svg');
	border: 0px solid  #fbcb3d;
}

#gewerke_fleischer.invert {
	background-image: url('../img/gewerke_fleischer_invert.svg');
	border: 0px solid  #ea6910;
}

#gewerke_friseur.invert {
	background-image: url('../img/gewerke_friseur_invert.svg');
	border: 0px solid  #ea9b65;
}

#gewerke_kfz.invert {
	background-image: url('../img/gewerke_kfz_invert.svg');
	border: 0px solid  #a7bfd9;
}

#gewerke_metall.invert {
	background-image: url('../img/gewerke_metall_invert.svg');
	border: 0px solid  #a4a5a5;
}

#gewerke_textilreiniger.invert {
	background-image: url('../img/gewerke_textilreiniger_invert.svg');
	border: 0px solid  #6c95c0;
}

#gewerke_tischler.invert {
	background-image: url('../img/gewerke_tischler_invert.svg');
	border: 0px solid  #329354;
}

#gewerke_weitere.invert {
	background-image: url('../img/gewerke_weitere_invert.svg');
	border: 0px solid  #8966a4;
}


#gewerke_claim {
	width: 100%;
  height: 150px;
  margin-left: 0px;
  float: none;
  margin-right: 0px;
}

#gewerke_text {
	margin-left: 0px;
	position: relative;
	overflow: visible;
	width: 100%;
	margin-bottom: 30px;
	min-height: 155px;
	float: none;
  margin-right: 0px;
}

#gewerke_button {
	margin-top: 30px;
	margin-left: 0px;
}


/***********************************************************/
/********************** HANDWERK ***************************/

#slide1 {
    background-image:url('/img/slider_1_mobil.png');
    height:522px;
}
#slide2 {
    background-image:url('/img/slider_2_mobil.png');
    height:522px;
}
#slide3 {
    background-image:url('/img/slider_3_mobil.png');
    height:522px;
}

#swiffy-animation {
    left:0px;
    width: 100% !important;
}

.section.handwerk {
	/*background-image: url('/img/handwerk_mobil.jpg');*/
	min-height: 585px;
	background-size: 390px auto;
	background-position: center 0px;
	background-repeat: no-repeat;
	padding: 0px;
}

#handwerk_claim {
	width: 280px;
	height: 174px;
	margin-left: 0px;
	margin-top: 300px;
	z-index: 90;
}

#handwerk_claim .claim_line {
	width: 100%;
}

#handwerk_blue_ellipse {
	position: absolute;
	overflow: hidden;
	width: 366px;
	height: 366px;
	margin-left: 205px;	
	margin-top: -255px;
}

.handwerk_blue_ellipse {
	fill: rgb(108, 149, 192);
}

#handwerk_blue_white_fancy {
	position: absolute;
	overflow: hidden;
	width: 397px;
	height: 409px;
	margin-left: 273px;
	margin-top: -510px;
}

#handwerk_blue_white_fancy img {
	width: 397px;
  height: 409px;
	left: 0px;
	top: 0px;
	overflow: visible;
}


/***********************************************************/
/********************** PARTNER ****************************/

.section.partner {
	background-image: url('../img/betriebe_und_partner_mobil.png');
	color: #ffffff;
	min-height: 322px;
	background-size: auto 322px;
	background-position: center center;
	background-repeat: no-repeat;
	margin: 50px 0px 100px;
}


/***********************************************************/
/********************** ENERGIEKOSTEN **********************/

.section.energiekosten {
	background-image: url('../img/energiekosten_background_mobil.png');
	background-color: #6c95c0;
	color: #ffffff;
	height: auto;
	min-height: 650px;
  background-size: 390px auto;
	background-position: center top;
	background-repeat: no-repeat;
	padding: 70px 0px 20px 0px;
	margin: 0px;
}

#energiekosten_claim {
	margin-left: 0px;
}

#energiekosten_text {
	margin-left: 0px;
	color: #ffffff;
	width: 100%;
	margin-top: 40px;
	height: 100%;
	overflow: visible;
}

#energiekosten_text .headline {
	font-weight: 1000;
  font-size: 24px;
  line-height: normal;
  color: rgb(255, 255, 255);
  text-transform: uppercase;
  display: block;
  margin-bottom: 10px;
}

#energiekosten_button {
	margin-left: 0px;
}

#e-tool_circle {
	margin: 20px auto;
	text-align: center;
}


/***********************************************************/
/********************** NEWS *******************************/

.section.news {
	padding-bottom: 30px;
}

.section.news .wrapper {
	overflow: visible;
}

#news_claim {
	width: 100%;
	margin-left: 0px;
}

.news_boxen {
	padding-top: 50px;
	margin-left: 0px;
	height: 610px;
	overflow: hidden;
	width: 1080px;
}

.news_box {
	position: relative;
	height: 550px;
	width: 320px;
	margin-right: 35px;
	float: left;
}

.news_box::before {
	content: '!';
	height: 94px;
	width: 94px;
	position: absolute;
	border-radius: 100%;
	white-space: nowrap;
	font-weight: bold;
	font-size: 70px;
	line-height: 95px;
	text-align: center;
	color: rgba(255,255,255,1);
	background-color: rgb(235, 105, 11);
	text-transform: uppercase;
	margin-left: 250px;
	margin-top: -20px;
}

.news_bild {
	width: 320px;
	height: 240px;
	background-color: #686969;
	border-top-left-radius: 180px;
	overflow: hidden;
}

.news_bild img {
	width: inherit;
	height: inherit;
}

.news_content {
	width: 320px;
	height: 320px;
	background-color: #686969;
}

.news_text {
	padding: 20px 30px 0px 30px;
	color: #ffffff;
	width: 100%;
	height: 210px;
	overflow: hidden;
	display: block;
}

.news_text .datetime {
	margin-bottom: 10px;
	display: block;
}

.news_text .headline {
	font-weight: 1000;
  font-size: 16px;
  margin-bottom: 20px;
  display: block;
  color: rgb(255, 255, 255);
  text-transform: uppercase;
}

.news_button {
	margin: 15px 15px;
}

.news_button .button_label {
	width: auto;
}


/***********************************************************/
/********************** FAQ ********************************/

.section.faq {
	padding-bottom: 0px;
}

#faq_claim {
	width: 100%;
	min-height: 140px;
}

.faq_boxen {
	margin-top: 10px;
}

.faq_box {
	position: relative;
	min-height: 130px;
	margin-left: 0px;
	width: 100%;
}

.faq_box_blue {
	position: absolute;
	width: 100%;
	height: 140px;
	cursor: pointer;
	background-color: rgba(108,149,192,1);
	border-radius: 0px;
	border: 10px solid #fff;
	border-left: 0px;
	border-right: 0px;
	margin-left: 0px;
	margin-top: -20px;
}

.faq_box_text {
	white-space: nowrap;
	text-align: left;
	font-weight: bold;
	font-size: 18px;
	color: rgba(255,255,255,1);
	text-transform: uppercase;
	line-height: normal;
	margin-left: 35px;
	width: 250px;
	height: 60px;
}

.faq_box .faq_box_arrow {
	overflow: visible;
	position: absolute;
	width: 25px;
    height: 20px;
	right:20px;
    top:50px;
    transform: rotateZ(-90deg);
}

.faq_box.open .faq_box_arrow {
	overflow: visible;
	position: absolute;
	width: 25px;
	height: 20px;
    right:20px;
    top:50px;
	transform: rotateZ(0deg);
}

.faq_box_arrow_path {
	fill: rgba(0,0,0,0);
	stroke: rgba(255,255,255,1);
	stroke-width: 6px;
	stroke-linejoin: miter;
	stroke-linecap: butt;
	stroke-miterlimit: 6;
	shape-rendering: auto;
}

.faq_box.open .faq_box_brown {
	max-height: 800px;
	display: block;
	margin-bottom: 12px;
}

.faq_box_brown {
	overflow: visible;
	position: relative;
	z-index: 10;
	width: 100%;
	background-color: rgba(104,105,105,1);
	border-radius: 0px;
	border: 5px solid #ffffff;
	border-left: 0px;
	border-right: 0px;
	min-height: 10px;
	max-height: 10px;
}

.faq_box_brown_texts {
	position: relative;
	width: 340px;
	height: auto;
	margin-left: 30px;
	margin-top: 140px;
	overflow: hidden;
	color: rgba(255,255,255,1);
}

.faq_box.open .faq_box_brown_texts {
	display: block;
	padding-bottom: 25px;
}

.faq_box_brown_text_1,
.faq_box_brown_text_2 {
	float: left;
	width: 45%;
	padding: 2%;
}


/***********************************************************/
/********************** GLOSSAR ****************************/

.section.glossar {
	background-image: url('../img/energiesparglossar_background_mobil.png');
	background-color: #686969;
	color: #ffffff;
	height: auto;
	min-height: 604px;
	background-size: 390px auto;
	background-position: center top;
	background-repeat: no-repeat;
	padding: 26px 0px 30px 0px;
}

#glossar_claim {
	margin-left: 0px;
	margin-top: 30px;
}

#glossar_text {
	margin-left: 0px;
	color: #ffffff;
	margin-bottom: 30px;
	width: 100%;
	margin-top: 60px;
	height: auto;
	overflow: visible;
}

#glossar_text .headline {
	font-weight: 1000;
  font-size: 24px;
  line-height: normal;
  color: rgb(255, 255, 255);
  text-transform: uppercase;
  display: block;
  margin-bottom: 30px;
}

#glossar_button {
	margin-left: 0px;
}


/***********************************************************/
/********************** DOWNLOADS **************************/

.section.downloads {
	padding: 40px 0px 70px 0px;	
}

.section.downloads .wrapper {
	width: 100%;
}

#downloads_claim {
	width: 100%;
	margin-left: 35px;
	margin-bottom: 20px;
}

.download_texte .headline {
	font-weight: 800;
	font-size: 16px;
	color: rgba(104,105,105,1);
	text-transform: uppercase;
	display: block;
	width: 100%;
	margin-bottom: 20px;
	margin-top: 20px;
	float: left;
	clear: both;
	margin-left: 35px;
}

.download_boxen {
	width: 100%;
	margin-left: 0px;
	margin-top: 10px;
}

.download_box {
	float: left;
	margin-right: 30px;
	width: 100%;
	height: 105px;
	color: #fff;
	padding-left: 35px;
	cursor: pointer;
	background-color: rgba(108,149,192,1);
	border-radius: 0px;
	margin-bottom: 10px;
}

.download_titel, 
.download_text {
	font-weight: bold;
  width: 250px;
  height: auto;
  float: left;
  line-height: 22px;
  margin-top: 25px;
  text-transform: uppercase;
  font-size: 18px;
}

.download_text {
	font-weight: normal;
	margin-top: 0px;
	text-transform: unset;
}

.download_circle {
	background-image: url('../img/download_arrow_white.png');
	width: 32px;
	height: 32px;
	overflow: hidden;
	border-radius: 0%;
	border: 0px solid #6c95c0;
	background-size: 32px;
	background-position: center;
	background-repeat: no-repeat;
	background-color: transparent;
	margin-top: 35px;
	position: absolute;
	margin-left: 290px;
}

#downloads_button {
	margin: 0px auto;
	max-width: 315px;
}


/***********************************************************/
/********************** MAPS *******************************/

.maps_wrapper {
    position: absolute;
    right: 0px;
    bottom: -100px;
    width: 100%;
    height: 550px;
    margin-bottom:60px;
}

.maps_map_wrapper {
    margin: 0px;
  background-color: rgb(0, 255, 0);
  width: 800px;
  border-radius: 50%;
  overflow: hidden;
  z-index: 2000 !important;
  position: absolute;
  top: 400px !important;
  transform: translate(-50%, -50%);
}

.section.maps {
	background-color: #686969;
    color: #ffffff;
    padding: 0px;
    margin-bottom: 40px;
}

.maps .wrapper {
	position: relative;
    overflow: visible;
    height: 900px;
    width:auto;
}

#maps_content {
	margin-left: 0px;
	color: #ffffff;
	margin-top: 30px;
}

#maps_globus {
    height: 500px;
    left:50%;
    display:block !important;
}

#maps_text {
	width: 100%;
	margin-bottom: 40px;
	height: auto;
	overflow: visible;
    padding-left:20px;
    padding-right:20px;
}

#maps_text .headline {
	font-weight: 1000;
	font-size: 24px;
	color: #fbcb3d;
	text-transform: uppercase;
	display: block;
	margin-bottom: 40px;
	word-wrap: anywhere;
	line-height: normal;
}

.maps_suche {
	width: 100%;
	float: left;	
	margin-bottom: 440px;
    padding-left:20px;
    margin-top:20px;
}

#maps_search {
	width: 320px;
	height: 48px;
	padding: 0px 20px;
	background-image: url('../img/lupe.png');
	background-position: 275px center;
	background-repeat: no-repeat;
	background-size: 28px auto;
	border-radius: 50px;
	background-color: #ffffff;
	border: 0px;
	margin-bottom: 30px;
	font-size: 18px;
	::placeholder {
		opacity: 1;
		color: #000000;
	}
}

.maps_select_group {
	float: left;
	margin-right: 15px;
	color: #ffffff;
}

.maps_select_group .headline {
	font-weight: 1000;
  font-size: 16px;
  color: #fbcb3d;
  text-transform: uppercase;
  display: block;
  margin-bottom: 10px;
}

.maps_select_group input {
  margin-right: 8px;
}

.maps_select_group label {	
	line-height: 22px;
}


/***********************************************************/
/********************** FOOTER *****************************/

.footer {
	background-color: #6c95c0;
	height: 250px;
	width: 100%;
	bottom: 0px;
}

.footer .wrapper {
	padding-top: 10px;
}

.footer a {
	text-decoration: none;
	color: #ffffff;
	display: block;
	float: none;
}

.footer_tab {
	margin: 10px auto;
	border-bottom: 0px !important;
	text-align: center;
	font-size: 20px;
	line-height: 24px;
}

.footer .footer_logos {
	display: block;
	width: 180px;
	margin-right: auto;
	margin-left: auto;
	margin-top: unset;
	float: none;
}

.footer .footer_logos svg {
	width: 60px;
	height: 60px;
	float: left;
	margin: 10px 15px;
}
         
.footer .footer_logos a:hover svg #Rechteck_53,
.footer .footer_logos a:hover svg #Rechteck_54,
.footer .footer_logos a:hover svg path {
	fill: #eb690b;
}


/********************************************************************************************************************************/
/********************** GLOSSAR STYLES ******************************************************************************************/


/***********************************************************/
/********************** TOP DETAILS ************************/

.section.top_details {
	background-color: #6c95c0;
	color: #ffffff;
	height: 240px;
	padding: 0px;
}

#top_details_claim {
	height: 75px;
	margin-left: 0px;
	margin-top: 160px;
}

#top_details_claim .claim_top {
	float: left;
	margin-bottom: 10px;
}

#top_details_claim .claim_text {
	float: left;
	margin-top: 20px;
	margin-left: 10px;
}

#top_details_claim .claim_line {
	margin-left: -5px;
	clear: both;
	float: left;
}


/***********************************************************/
/********************** TOP ALLES **************************/

.section.top_alles {
	background-image: url('../img/bunte_Kreise.png');
	background-color: #6c95c0;
	color: #ffffff;
	height: 308px;
	background-size: auto 308px;
	background-position: center 0px;
	background-repeat: no-repeat;
	padding: 0px;
}

#top_alles_claim {
	width: 150px;
	min-height: 222px;
	margin-left: 0px;
	margin-top: 165px;
}

#top_alles_claim .claim_top {
	float: left;
	margin-bottom: 0px;
}

#top_alles_claim .claim_text {
	float: left;
	margin-bottom: 10px;
	margin-left: 0px;
}

#top_alles_claim .claim_line {
	margin-left: 2px;
	clear: both;
	float: left;
}


/***********************************************************/
/********************** TOP NEWS ***************************/

.section.top_news {
	background-color: #6c95c0;
	color: #ffffff;
	height: 308px;
	background-size: auto 308px;
	background-position: center 0px;
	background-repeat: no-repeat;
	padding: 0px;
}

#top_news_claim {
	width: 220px;
	height: 145px;
	margin-left: 0px;
	margin-top: 135px;
}

#top_news_claim .claim_top {
	float: left;
	margin-bottom: 0px;
}

#top_news_claim .claim_text {
	float: left;
	margin-bottom: 10px;
	margin-left: 0px;
}

#top_news_claim .claim_line {
	margin-left: 2px;
	clear: both;
	float: left;
}


/***********************************************************/
/*********************** NEWS OVERVIEW *********************/

.section.news_overview {
	padding: 20px 0px 0px;
}

.news_overview_claim {
	width: 100%;
	height: 150px;
	margin-left: 0px;
}

.news_overview_boxen {
	margin-left: 0px;
	padding-top: 50px;
	border-top: 2px solid rgb(211, 225, 238);
}

.news_overview_box {
	min-height: 550px;
	float: left;
	margin-bottom: 70px;
	width: 100%;
}

.news_overview_bild {
	border-radius: 100%;
	overflow: hidden;
	width: 300px;
	height: 300px;	
	margin: 0px auto 20px;
}

.news_overview_bild img {
	width: inherit;
	height: inherit;
}

.news_overview_textbox {
	width: 100%;
	padding: 0px;
	clear: both;
	float: right;
}
 
.news_overview_text {
	color: rgb(0, 0, 0);
	margin-bottom: 20px;
	padding-right: 0px;
}

.news_overview_button {
	margin: 0px;
	max-width: 320px
}


/***********************************************************/
/********************** NEWS DETAILS ***********************/

.section.news_details_top {
	padding: 30px 0px 30px 0px;
}

.news_details_top_claim {
	width: 100%;
	margin: 0px 0px 30px 0px;
	height: auto;
}

.news_details_top_claim .claim_top,
.news_details_top_claim .claim_text {
	font-size: 20px;
	word-wrap: break-word;
	line-height: normal;
	white-space: wrap;
    width: 100%;
}

.section.news_details {
	padding: 0px 0px 70px 0px;
}

.news_details_claim {
	width: 100%;
	margin: 0px 0px 20px 0px;
}

.moments_top_left {
	float: left;
	width: 100%;
	margin: 0px 0px 20px 0px;
}

.moments_top_right {
	float: left;
    width: 100%;
	margin: 0px 0px 0px 0px;
}

.moments1 {
	background-size: cover;
	float: right;
    width: 100%;
    height: 152px;
    margin: 0px 0px 20px 0px;
	border-top-left-radius: 75px;
    background-color: #e2e7e9;
    overflow: hidden;
}

.moments_left {
	float: left;
	width: 100%;
	margin: 0px 0px 0px 0px;
}

.moments2 {
	background-size: cover;
    background-color: #e2e7e9;
	float: left;
	width: 100%;
    height: 320px;
	margin: 0px 0px 20px 0px;
}

.moments3 {
	background-size: cover;
    background-color: #e2e7e9;
	float: left;
	width: 100%;
    height: 320px;
	margin: 0px 0px 20px 0px;
}

.moments6 {
	background-size: cover;
	clear: both;
	float: left;
	width: 100%;
    height: 152px;
    margin: 0px 0px 20px 0px;
	border-bottom-left-radius: 75px;
    background-color: #e2e7e9;
    overflow: hidden;
}

.moments_right {
	float: right;
	width: 100%;
	margin: 0px 0px 20px 0px;
}

.moments4 {
	background-size: cover;
    background-color: #e2e7e9;
	float: left;
	width: 100%;
    height: 320px;
    margin: 0px 0px 20px 0px;
}

.moments5 {
	background-size: cover;
    background-color: #e2e7e9;
	float: left;
	width: 100%;
    height: 320px;
    margin: 0px 0px 20px 0px;
}

.moments7 {
	background-size: cover;
	float: left;
	width: 100%;
    height: 320px;
    margin: 0px 0px 20px 0px;
	border-bottom-right-radius: 165px;
    background-color: #e2e7e9;
    overflow: hidden;
}

.news_details_quellen {
	margin: 0px 0px 70px 0px;
	clear: both;
	height: 50px;
	color: #787a7a;
}

/***********************************************************/
/********************** SUCHEN WISSEN **********************/

.section.suche_wissen {
	padding: 40px 0px 0px;
}

#suche_wissen_text {
	margin-left: 0px;
	position: relative;
	overflow: visible;
	width: 100%;
	margin-bottom: 50px;
	float: left;
}

#newsarchiv_button {
	margin-top: 30px;
}

#suche_wissen_text .headline, 
.filter_boxen .headline {
	font-weight: 1000;
	font-size: 16px;
	color: rgb(108, 149, 192);
	text-transform: uppercase;
	display: block;
	margin-bottom: 10px;
	line-height: 24px;
}

.suche_wissen_box {
	width: 100%;
	height: 45px;
	color: #fff;
	background-color: #a4a5a5;
	border-radius: 50px;
	margin-bottom: 40px;
	float: left;
	margin-left: 0px;
	overflow: hidden;
}

.suche_wissen_titel {
	font-weight: bold;
	height: 45px;
	float: left;
	line-height: 45px;
	margin-top: 0px;
	text-transform: uppercase;
}

#search {
	width: 100%;
	height: 45px;
	padding: 0px 0px 1px 30px;
	border-radius: 50px;
	background-color: #a4a5a5;
	color: #ffffff;
	border: 0px;
	margin-bottom: 30px;
	line-height: 45px;
	font-size: 15px;
	font-weight: 800;
	text-transform: uppercase;
}

.section.suche_wissen
	::placeholder {
	  color: #ffffff;
	  opacity: 1;
}

.suche_wissen_circle {
	background-image: url('../img/lupe.png');
	width: 62px;
	height: 62px;
	overflow: hidden;
	border-radius: 100%;
	border: 4px solid #a4a5a5;
	background-size: 32px;
	background-position: center;
	background-repeat: no-repeat;
	background-color: #fff;
	margin-top: -8px;
	position: absolute;
	margin-left: 260px;
	cursor: pointer;
}

#suchen_wissen_filter_boxen.filter_boxen {
	margin-left: 0px;
	width: 100%;
	float: left;
}

.filter_boxen_row {
	clear: both;
	float: left;
	margin: 10px 0px;
}

.filter_box {
	width: 70px;
	height: 70px;
	float: left;
	margin-right: 13px;
	border-radius: 100%;
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	cursor: pointer;
	margin-bottom: 15px;
}

.filter_boxen_row .filter_box:nth-child(4) {
	margin-right: 0px;
}

.filter_boxen_row .filter_box:nth-child(5) {
	margin-left: 42px;
}

.filter_text {
	min-width: 220px;
	float: left;
	clear: both;
	margin-right: 0px;
	font-weight: 800;
	cursor: pointer;
	height: 30px;
	margin-bottom: 8px;
	border-bottom: 2px solid transparent;
	font-size: 18px;
	padding-left: 20px;
}

.filter_text_long {
	width: 220px;
	margin-right: 0px;
	float: left;
}

.filter_text_long .filter_text {
	float: left;
	margin-right: 0px;
	clear: both;
}

.filter_text:hover {	
	border-color: rgb(235, 105, 11);
}

.filter_text:hover,
.filter_text.active {
	color: rgb(235, 105, 11);
}

.filter_text.active:hover {
	color: inherit;
	border-color: rgb(0, 0, 1);
}



/***********************************************************/
/********************** RESULTS ****************************/

.section.results {
	padding: 0px;
	min-height: 0px;
}

#result_content {
	position: relative;
	height: 0px;
	width: 100%;
	overflow: hidden;
	border-top: 0px solid transparent;
	border-bottom: 0px solid transparent;
	margin: 0px auto;
	
}

#result_content.showme {
	border-top: 2px solid #d3e1ee;
	border-bottom: 2px solid #d3e1ee;
	height: auto !important;
	padding: 30px 0px;
}


.result_text {
	overflow: hidden;
	color: #686969;
	width: 100%;
	height: 150px;
	margin-bottom: 30px;
	float: left;	
}

.result_text span {
	padding-right: 25px;
}

.result_text .headline {
	font-weight: 1000;
	font-size: 17px;
	line-height: 24px;
	text-transform: uppercase;
	display: block;
	margin-bottom: 10px;	
}

.result_text .highlight {
	font-weight: 800;
	color: #eb690b;
	padding: 0px;
}

.result_text .link {
	font-weight: 800;
	text-decoration: underline;
	display: block;
	margin-top: 20px;
}


/***********************************************************/
/********************** BLICK ******************************/

.section.blick {
	padding: 40px 0px;
}

#blick_claim {
}

#blick_filter_boxen.filter_boxen {
	width: 100%;
	height: 200px;
	float: none;
	margin-left: 0px;
	margin-top: 30px;
}

.blick_boxen {
	margin-top: 20px;
}

.blick_box {
	position: relative;
	min-height: 55px;
	margin-left: 0px;
	width: 100%;
}

.blick_box_blue {
	position: absolute;
	width: 320px;
	height: 55px;
	cursor: pointer;
	background-color: rgba(108,149,192,1);
	border-radius: 50px;
	border: 5px solid #fff;
	margin-left: -5px;
	margin-top: -10px;
}

.blick_box_text {
	white-space: nowrap;
	text-align: left;
	font-weight: bold;
	font-size: 14px;
	color: rgba(255,255,255,1);
	text-transform: uppercase;
	line-height: 45px;
	margin-left: 30px;
}

.blick_box .blick_box_arrow {
	overflow: visible;
	position: absolute;
	width: 35px;
	height: 12px;
	transform: translate(-213px, -6606.296px) matrix(1,0,0,1,1607.8712,6983.5621) rotate(-90deg);
	transform-origin: center;
	margin-left: -395px;
	margin-top: -405px;
}

.blick_box.open .blick_box_arrow {
	overflow: visible;
	position: absolute;
	width: 35px;
	height: 12px;
	margin-left: 995px;
	margin-top: -28px;
	transform: matrix(1,0,0,1,0,0);
}

.blick_box_arrow_path {
	fill: rgba(0,0,0,0);
	stroke: rgba(255,255,255,1);
	stroke-width: 6px;
	stroke-linejoin: miter;
	stroke-linecap: butt;
	stroke-miterlimit: 4;
	shape-rendering: auto;
}

.blick_box.open .blick_box_brown {
	height: 420px;
	display: block;
	margin-bottom: 12px;
}

.blick_box_brown {
	overflow: visible;
	position: relative;
	z-index: 10;
	/*width: 1049px;*/
	width: 100% !important;
	margin-left: 0px !important;
	background-color: rgba(104,105,105,1);
	border-radius: 50px;
	border: 5px solid #ffffff;
	height: 10px;
}

.blick_box_brown_texts {
	position: relative;
	width: 810px;
	height: 251px;
	margin-left: 140px;
	margin-top: 100px;
	overflow: hidden;
	color: rgba(255,255,255,1);
    display:none;
}

.blick_box.open .blick_box_brown_texts {
	display: block;
}

.blick_box_brown_text_1,
.blick_box_brown_text_2 {
	float: left;
	width: 45%;
	padding: 2%;
}

#blick_gewerk_circle {
	width: 390px;
	margin: 20px -35px 50px;
	overflow: visible;
	height: 200px;	
}

#blick_gewerk_circle img {
	width: 100%;
	z-index: 80;
	position: absolute;
}


/***********************************************************/
/********************** VIDEOS *****************************/

.section.videos {
	padding: 30px 0px;
}

#videos_claim {
	width: 100%;
	height: 174px;
	margin-left: 0px;
}

.videos_link_boxen {
	margin-top: 20px;
	margin-left: 0px;
}

.videos_link_boxen_row {
	float: left;
	clear: both;
	margin-bottom: 0px;
}

.videos_link_box {
	float: left;
	position: relative;
	height: 80px;
	margin-right: 0px;
	width: 100%;	
}

.videos_play {
	float: left;
	width: 48px;
    height: 48px;
	border-radius: 100%;
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	margin-right: 10px;
}

.videos_text {
	float: left;
	color: rgba(104,105,105,1);
	width: calc(100% - 58px) !important;
}

.videos_text span {
	display: block;
	height: 20px;
}

.videos_text .headline {
	font-weight: 1000;
	font-size: 16px;  
	text-transform: uppercase;
	display: block;
	margin-top: 5px !important;
}

.yellow_circle {
	background-image: url('../img/play_yellow_circle.svg');
}

.orange_circle {
	background-image: url('../img/play_orange_circle.svg');
}

.lightorange_circle {
	background-image: url('../img/play_lightorange_circle.svg');
}

.lightblue_circle {
	background-image: url('../img/play_lightblue_circle.svg');
}

.grey_circle {
	background-image: url('../img/play_grey_circle.svg');
}

.blue_circle {
	background-image: url('../img/play_blue_circle.svg');
}

.green_circle {
	background-image: url('../img/play_green_circle.svg');
}

.lila_circle {
	background-image: url('../img/play_lila_circle.svg');
}


/***********************************************************/
/********************** PRAXIS *****************************/

.section.praxis {
}

#praxis_claim {
	width: 100%;
	/*height: 174px;*/
	margin-bottom: 15px;
}

#praxis_claim .claim_top {
	font-size: 38px;
}

#praxis_bild {
	background-image: url('../img/praxisbeispiele_y.png');
	color: #ffffff;
	height: 550px;
	background-size: 1344px auto;
	background-position: center 0px;
	background-repeat: no-repeat;
	padding: 0px;
	margin-bottom: 80px;
}

#praxis_texte {
	position: absolute;
	width: 300px;
	height: 300px;
	/* margin-left: 860px; */
	margin-top: 220px;
	color: rgba(255,255,255,1);
}

#praxis_text .headline,
#praxis_text .bottomline {
	font-weight: 1000;
	font-size: 18px;
	margin-bottom: 15px;
	color: rgba(255,255,255,1);
	text-transform: uppercase;
	display: block;
}

#praxis_text .bottomline {
	margin: 15px 0px 30px 0px;
}

#praxis_text .bottomline span {
	margin: 0px 20px;
}

#praxis_blue_white_fancy {
	position: absolute;
	overflow: hidden;
	z-index: 70;
	width: 683px;
	height: 705px;
	margin-left: 285px;
	margin-top: -145px;
	/* display: none; */
}

#praxis_blue_white_fancy img {
	width: 684px;
  	height: 705px;
}

.praxis_blue_ellipse {
	position: absolute;
	overflow: visible;
	width: 550px;
	height: 550px;
	margin-left: -77px;
	margin-top: 105px;
}

#praxis_blue_ellipse {
	fill: rgba(108,149,192,1);
}

.faqboxtextmobile {
    display: flex;
	align-items: center;
	height: 120px;
}




/********************************************************************************************************************************/
/********************** GEWERKE STYLES ******************************************************************************************/


/***********************************************************/
/********************** TOP BACKEN *************************/

.section.top_backen {
	background-image: url('../img/backen_top_background.png');
	color: #ffffff;
	height: 588px;
	background-size: auto 588px;
	background-position: center 0px;
	background-repeat: no-repeat;
	padding: 0px;
}

#top_backen_claim {
	width: 567px;
	height: 222px;
	top: 280px;
}

#top_backen_claim .claim_line {
	margin-left: 2px;
}

#top_backen_claim .small_add_claim {
	white-space: nowrap;
	margin-top: 15px;
	color: rgb(255, 255, 255);
	font-size: 14px;
	text-transform: none;
	padding-left: 3px;
}


.top_backen_yel_ellipse {
	position: absolute;
  overflow: visible;
  width: 547px;
  height: 547px;
  margin-left: 852px;
  top: 306px;
}

#top_backen_yel_ellipse {
	fill: rgba(108,149,192,1);
}

#top_backen_yel_white_fancy {
	position: absolute;
	width: 683px;
	height: 705px;
	margin-left: 883px;
	top: -86px;
	overflow: visible;
}

#top_backen_yel_white_fancy img {
	width: 683px;
	height: 705px;
	left: 0px;
	top: 0px;
	overflow: visible;
}


/***********************************************************/
/********************** BERATUNG ***************************/

#beratung_big_text {
	margin-left: 0px;
	position: relative;
	overflow: visible;
	width: 100%;
	margin-bottom: 0px;
}

.beratung_text .headline {
	font-weight: 1000;
	font-size: 18px;
	color: rgba(251,203,61,1);
	text-transform: uppercase;
	display: block;
	margin-bottom: 15px;
}

.beratung_text {
	overflow: hidden;
	width: 320px;
	float: left;
	margin-right: 30px;
	font-weight: 600;
}

.beratung_text span {
	display: block;
}

.beratung_text .highlight {
	font-weight: 800;
	color: #eb690b;
	padding: 0px;
	display: inline;
}

#beratung_button {
  margin-top: 20px;	
  float: left;
}



/***********************************************************/
/********************** EINBLICK *************************/

.section.einblick {
	padding-top: 40px;
}

#einblick_claim {
	width: 100%;
	height: 100px;
	position: relative;
	z-index: 80;
}

#einblick_claim .claim_top {
	margin-bottom: 10px;
}

.einblick_playbox {
	background-image: url('../img/einblicke_y.png');
	color: #ffffff;
	height: 150px;
	background-size: 320px auto;
	background-position: center 0px;
	background-repeat: no-repeat;
	padding: 0px;
}

#einblick_text .headline {
	font-weight: 1000;
	font-size: 14px;
	color: rgba(104,105,105,1);
	text-transform: uppercase;
	display: block;
}

#einblick_playbutton {
	background-image: url('../img/play_button_y.png');
	background-size: contain;
	background-position: center center;
	background-repeat: no-repeat;
	position: absolute;
	width: 120px;
	height: 120px;
	margin-left: 110px;
	margin-top: 15px;
	/*z-index: 100;*/
}


#einblick_text {
	margin-top: 10px;
}

.einblick_yel_ellipse {
	display: none;
}

#einblick_yel_ellipse {
	fill: rgba(251,203,61,1);
}

#einblick_yel_white_fancy {
	display: none;
}

#einblick_yel_white_fancy img {
	display: none;
}

#einblick_button {
	margin-top: 20px;
}


/***********************************************************/
/********************** GLOSSAR ****************************/

.section.glossar_y {
	background-image: url('../img/energiesparglossar_background_y.png');
	color: #ffffff;
	height: 604px;
	background-size: 1454px auto;
	background-position: center 0px;
	background-repeat: no-repeat;
	padding: 0px;
}

#glossar_y_claim {
	margin-top: 30px;
	font-size: 36px;
}

#glossar_y_text {
	color: rgba(104,105,105,1);
	margin-bottom: 30px;
	margin-top: 60px;
	height: 155px;
	overflow: hidden;
}

#glossar_y_text .headline {
	font-weight: 1000;
	font-size: 16px;
	color: rgba(104,105,105,1);
	text-transform: uppercase;
	display: block;
	margin-bottom: 30px;
}


#glossar_y_text br {
	display: none;
}

#glossar_y_button {
	margin-left: 0px;
}



/********************************************************************************************************************************/
/********************** GEWERKE STYLES ******************************************************************************************/


/***********************************************************/
/********************** TOP GEWERKE ************************/

.section.top_gewerke {
	background-image: url('../img/gewerkeoverview_background.png');
	background-color: #f8fdff;
	color: #ffffff;
	height: 845px;
	background-size: auto 610px;
	background-position: center top;
	background-repeat: no-repeat;
	padding: 0px;
}

#top_gewerke_claim {
	width: 320px;
    height: 222px;
    margin-left: 0px;
    top: 625px;
    left: unset;
    color: rgb(104, 105, 105);
}

#top_gewerke_claim .claim_top {
}

#top_gewerke_claim .claim_text {
}

#top_gewerke_claim .claim_line {
	color: rgb(104, 105, 105);
}

#top_gewerke_claim .claim_line path {
	stroke: rgb(104, 105, 105);
}


/***********************************************************/
/*********************** GEWERKE OVERVIEW ******************/

.section.gewerkeoverview {
	padding: 0px;
}

.gewerkeoverview_boxen {
	margin-left: 0px;
	width: 100%;
	position: relative;
}

.gewerkeoverview_boxen_row3 {
	clear: both;
	float: left;
	margin-bottom: 0px;
}

.gewerkeoverview_box {
	float: left;
    position: relative;
    height: 180px;
    margin-right: 0px;
    width: 320px;
}
	
.gewerkeoverview_icon {
	width: 150px;
	height: 150px;
	float: left;
	border-radius: 100%;
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
}

.gewerkeoverview_text {
	float: left;
	width: 150px;
	margin-left: 20px;
}

.gewerkeoverview_text span {
	display: block;
	height: 20px;
	font-size: 14px;
	font-weight: 400;
}

.gewerkeoverview_text .headline {
	font-weight: bold;
	font-size: 16px;
	color: rgb(108, 149, 192);
	margin-top: 40px;
	margin-bottom: 5px;
}


/********************************************************************************************************************************/
/********************** ABOUT US STYLES ******************************************************************************************/


/***********************************************************/
/********************** TOP ABOUTUS ************************/

.section.top_aboutus {
	background-image: url('../img/aboutus_background_mobil.png');
	background-color: #f8fdff;
    color: #ffffff;
    height: 700px;
    background-size: auto 845px;
    background-position: center 0px;
    background-repeat: no-repeat;
    padding: 0px;
}

#top_aboutus_claim {
	width: 320px;
	height: 222px;
	margin-left: 0px;
	top: 605px;
	left: unset;	
	color: rgb(104, 105, 105);
}

#top_aboutus_claim .claim_top {
	font-weight: 1000;
}

#top_aboutus_claim .claim_text {
	line-height: 38px;
}

#top_aboutus_claim .claim_line {
	color: rgb(104, 105, 105);
}

#top_aboutus_claim .claim_line path {
	stroke: rgb(104, 105, 105);
}

#top_aboutus_blue_ellipse {
	position: absolute;
	overflow: visible;
	width: 417px;
	height: 417px;
	left: -169px;
	top: -43px;
}

#top_aboutus_blue_white_fancy {
	position: absolute;
	width: 397px;
	height: 409px;
	left: 110px;
	top: -40px;
	overflow: hidden;
}

#top_aboutus_blue_white_fancy img {
	width: 397px;
	height: 409px;
	left: 0px;
	top: 0px;
	overflow: visible;
}

/***********************************************************/
/*********************** TEAM ******************************/

.section.team {
	padding: 30px 0px;
}

#team_claim {
	width: 380px;
	height: 174px;
	margin-left: 0px;
}

.team_member_boxen {
	margin-top: 0px;
	margin-left: 0px;
}

.team_member {
	width: 100%;
	height: 660px;
	float: left;
	clear: both;
}

.teambild {
	border-radius: 100%;
	overflow: hidden;
	width: 250px;
	height: 250px;	
	margin: 0px auto;
	clear: both;
}

.teambild img {
	width: inherit;
	height: inherit;
}
 
.team_textbox {
	width: 100%;
	padding: 0px;
}

.team_name {
	font-weight: bold;
	font-size: 20px;
	color: rgba(108,149,192,1);
	text-transform: uppercase;
	margin: 15px 0px;
}

.team_position {
	line-height: 20px;
	font-weight: bold;
	font-size: 18px;
	color: rgba(104,105,105,1);	
	margin-bottom: 15px;
}

.team_text {
	color: rgba(0,0,0,1);
	margin-bottom: 5px;
}

.team_kontakt {
	line-height: 35px;
	font-weight: bold;
	font-size: 18px;
	color: rgba(108,149,192,1);	
}

.team_kontakt a {
	text-decoration: none;
}

.team_email {
	background-image: url('../img/team_email_icon.svg');
	height: 35px;
    background-size: 35px auto;
    background-position: left center;
    background-repeat: no-repeat;
    padding-left: 50px;
    margin-top: 15px;
}

.team_phone {
	background-image: url('../img/team_phone_icon.svg');
	height: 35px;
    background-size: 35px auto;
    background-position: left center;
    background-repeat: no-repeat;
    padding-left: 50px;
    margin-top: 15px;
}


/***********************************************************/
/********************** AKTUELLES *************************/

.section.aktuelles {
	padding-top: 0px;
    padding-bottom: 0px;
    min-height: 800px;
}

.section.aktuelles .wrapper {
	width: 100%;
}

#aktuelles_claim {
	width: 100%;
    height: 140px;
    margin-left: 35px;
    margin-bottom: 30px;
}

#aktuelles_bild {
	background-image: url('../img/aboutus_aktuelles.png');
	color: #ffffff;
	height: 550px;
	background-size: 1344px auto;
	background-position: center 0px;
	background-repeat: no-repeat;
	padding: 0px;
	margin-bottom: 80px;
}

#aktuelles_texte {
	position: absolute;
	width: 350px;
	height: 300px;
	margin-left: 35px;
	margin-top: 250px;
	color: rgb(255, 255, 255);
}

#aktuelles_text .headline,
#aktuelles_text .bottomline {
	font-weight: 1000;
	font-size: 16px;
	margin-bottom: 0px;
	color: rgba(255,255,255,1);
	text-transform: uppercase;
	display: block;
}

#aktuelles_text .bottomline {
	margin: 15px 0px 30px 0px;
}

#aktuelles_text .bottomline span {
	margin: 0px 20px;
}

#aktuelles_blue_white_fancy {
	position: absolute;
	overflow: hidden;
	z-index: 70;
	width: 409px;
    height: 409px;
	margin-left: 290px;
	margin-top: -110px;
}

#aktuelles_blue_white_fancy img {
	width: inherit;
	height: inherit;
}

#aktuelles_blue_ellipse {
	position: absolute;
	overflow: visible;
	width: 550px;
	height: 550px;
	margin-left: 0px;
	margin-top: 105px;
}

.aktuelles_blue_ellipse {
	fill: rgba(108,149,192,1);
}


/***********************************************************/
/********************** NEWSLETTER *************************/

.section.newsletter {
	padding-top: 40px;
}

.section.newsletter .wrapper {
	width: 100%;
}

#newsletter_claim {
	width: 360px;
	height: 140px;
	margin-left: 35px;
}

#newsletter_text {
	color: rgb(255, 255, 255);
	margin: 45px 0px;
	width: calc(100% - 35px);
	padding-left: 35px;
}

#newsletter_text .headline {
	font-weight: 1000;
	font-size: 28px;
	margin-bottom: 0px;
	color: rgb(255, 255, 255);
	text-transform: uppercase;
	display: block;
	line-height: 30px;
}

.formfield {
	white-space: nowrap;
	text-align: left;
	font-weight: bold;
	font-size: 16px;
	height: 60px;
	line-height: 46px;
	padding: 0px 35px;
	width: 100%;
	background-color: rgb(255, 255, 255);
	float: left;
	clear: both;
	margin-top: 10px;
}

#newsletter_hint {
	margin-left: 35px;
	width: 100%;
	line-height: 28px;
}

#newsletter_hint .texts {
	width: 100%;
}

#newsletter_hint span {
	font-size: 14px;
	margin-bottom: 0px;
	color: rgb(255, 255, 255);
	font-weight: 100;
}

#newsletter_hint input {
	width: 25px;
	height: 25px;
	vertical-align: middle;
}

#newsletter_hint label {
	font-weight: 800;
	font-size: 16px;
	margin-left: 20px;
	cursor: pointer;
}

#newsletter_button {
	margin: 30px 0px 0px 0px;
	max-width: 320px;
	cursor: pointer;
}

.newsletter_bluebox {
	float: left;
	margin-right: 0px;
	height: 820px;
	color: rgb(255, 255, 255);
	background-color: rgb(108, 149, 192);
	border-top-right-radius: 0px;
	margin-bottom: 30px;
	margin-left: 0px;
	width: 100%;
	margin-top: 0px;
}



/********************************************************************************************************************************/
/********************************************************************************************************************************/

}

/********************************************************************************************************************************/
/********************************************************************************************************************************/