@charset "utf-8";  

/* 
CSS Document HPK
Layout 11 - Grundaufbau, Homepage
*/

 :root {
/* !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! */
	/* Farben sind ZWINGEND in RGB anzugeben! */
	/*   !!!SONST EXPLODIERT EIN REHKITZ!!!	  */
	/* !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! */
	
	/*text*/
	--fontMainFamily: Arial, sans-serif;
	--fontHeadingFamily: "nexa_lightregular", Arial, sans-serif;
	--fontH1Size: 2em;
	--fontH2Size: 1.5em;
	--fontH3Size: 1.3em;
	--fontH4Size: 1.2em;
	--fontH5Size: 1.1em;
	--fontH6Size: 1em;
	--fontBodySize: 0.94em;
	--fontSmallerSize: 0.8em;
	--smallText: 0.7em;

	/* Meldungen */
	--successColor:					109, 179,  47;
	--successHoverColor:			 86, 143,  37;
	--warningColor:					255, 117,  18;
	--warningHoverColor:			219, 100,  15;
	--errorColor:					183,   4,   4;
	--errorHoverColor:				148,   3,   3;

	/* Grauabstufungen */
	--blackColor:					  0,   0,   0; /* Zuvor: #000000 */	
	--offBlackColor:				 85,  85,  85; /* Zuvor: #555555 */
	--veryDarkColor:				102, 102, 102; /* Zuvor: #666666 & #696868 */
	--darkColor:					119, 119, 119; /* Zuvor: #777777 */
	--darkGreyColor:				153, 153, 153; /* Zuvor: #999999 */
	--greyColor:					170, 170, 170; /* Zuvor: #AEAEAE & #ACACAC & #AAAAAA */
	--lightColor:					204, 204, 204; /* Zuvor: #CCCCCC */
	--veryLightColor:				221, 221, 221; /* Zuvor: #DDDDDD */
	--offWhiteColor:				234, 234, 234; /* Zuvor: #EAEAEA & #E7E7E7 & #E6E6E6 */
	--whiteColor:					255, 255, 255; /* Zuvor: #FFFFFF */
	--bs-navbar-brand-color:		255, 255, 255; /* Zuvor: #FFFFFF */
 }
 
/* ============= * 
 * Allgemein 	 *
 * ============= */
 

* {
	scroll-behavior: smooth;
	margin: 0;
	padding: 0;
}

body, html {
	height: 100%;
	color: rgb(var(--darkGreyColor));
}

body #umschlag.container-fluid {
	overflow-x: hidden;
}

body h2 {font-size: 113%; font-weight: 600;}
body h3 {font-size: 130%;}
body h4 {font-size: 120%;}
body h5 {font-size: 115%;}
body h6 {font-size: 110%;}

#inhalt h1 {
	color: rgb(var(--mainColor));
	font-size: 200%;
    margin: 0 0 1em 0;
	text-align: center;
    text-transform: uppercase;
	width: 100%;
}

body .tx-hpkfe-pi-impressum .haftungsausschluss h2 {
	font-size: 145%;
}

/*Überschrift bei zB "wir über uns"*/
.frame-layout-6 h2 {
	font-size: 113%;
	font-weight: 600;
}

.cookie-wrapper h2 {
	font-size: 170%;
}

body a { /*mit body, damit bootstrap überschrieben wird*/
	color: rgb(var(--mainColor));
	text-decoration: none;
}


body a:focus, /*mit body, damit bootstrap überschrieben wird*/
body a:hover {
	color: rgb(var(--darkGreyColor));
}

a.link-typ1:focus,
a.link-typ1:hover,
a.link-typ2:focus,
a.link-typ2:hover,
a.link-typ3:focus,
a.link-typ3:hover,
p.detailsansehen a:focus,
p.detailsansehen a:hover {
  background: url("img/typ3-color10.png") no-repeat scroll 0px 6px transparent;
}

#inhalt .box a.link-typ1:not(#inhalt .frame-layout-0 .frame-layout-0 .box a.link-typ1),
#inhalt .box a.link-typ2:not(#inhalt .frame-layout-0 .frame-layout-0 .box a.link-typ2) {
  position: absolute;	
  bottom: 18px;
}

#inhalt .box .textlinks a.link-typ1, 
#inhalt .box .textlinks a.link-typ2 {
  position: static;
}

#inhalt .herstellerlink a {
  text-decoration: none;
}

.navbar-light .navbar-nav a.nav-link,
.navbar #kopfmenue_div a {
	color: rgb(var(--darkGreyColor));
	padding-right: 0.5rem;
	padding-left: 0.5rem;
}

.navbar-light .navbar-nav a.nav-link:hover,
.navbar-light .navbar-nav a.nav-link:active,
.navbar-light .navbar-nav a.nav-link.active,
.navbar #kopfmenue_div  a:hover,
.navbar a.aktiv {
	color: rgb(var(--mainColor));
	background-color: transparent;
}

footer a.nav-link {
	color: white;
	padding: 0;
}

.hpk_impressum a,
a.link-typ-underline,
.hpk_datenschutz a,
.tx-hpkfe-pi-kontakt a { 
  text-decoration: underline; 
}

p { 
  margin-bottom: 8px; 
  line-height: 140%; 
}

iframe { /*was ist das?*/
  border: 0;
}

ul {
	list-style-type: square;
}

.frame-layout-7 .box, /* Box 1/3 von 2*/
.layout-7 .cycle-slideshow, /* Mitarbeitersuche */
.frame-layout-8 .box, /* Box 2/3 von 2*/
.frame-layout-1 .box, /* Box 1/3 von 3*/
.frame-layout-2 .box, /* Box 1/3 von 3*/
.frame-layout-3 .box, /* Box 1/3 von 3*/
.frame-layout-6 .box,
.frame-layout-9 .box,
.frame-layout-10 .box,
.layout-14 .content-text,
.layout-15 .content-text,
.box.layout-6,
#ajaxcontainer .box.layout-6 {
	position: relative;
	margin-bottom: 25px;
	background-color: rgb(var(--lightGreyColor));
	min-height: 200px;
	width: 100%;
}

.frame-layout-7 .box, /* Box 1/3 von 2*/
.frame-layout-8 .box, /* Box 2/3 von 2*/
.frame-layout-1 .box, /* Box 1/3 von 3*/
.frame-layout-2 .box, /* Box 1/3 von 3*/
.frame-layout-3 .box, /* Box 1/3 von 3*/
.frame-layout-6 .box,
.frame-layout-9 .box,
.frame-layout-10 .box,
.layout-14 .content-text,
.layout-15 .content-text,
.box.layout-6,
#ajaxcontainer .box.layout-6 {
	padding: 30px 15px !important;
}

.frame-layout-0 .box::after,
/* .news-latest-container::after, */
.frame-layout-7 .box::after, /* Box 1/3 von 2*/
.layout-7 .cycle-slideshow::after, /* Mitarbeitersuche */
.frame-layout-8 .box::after, /* Box 2/3 von 2*/
.frame-layout-1 .box::after, /* Box 1/3 von 3*/
.frame-layout-2 .box::after, /* Box 1/3 von 3*/
.frame-layout-3 .box::after, /* Box 1/3 von 3*/
.frame-layout-6 .box::after, /* Box mehrspaltig (Kette)*/
.frame-layout-9 .box::after,
.frame-layout-10 .box::after,
.layout-14 .content-text::after,
.layout-15 .content-text::after,
.box.layout-6::after {
	position: absolute;
	width: 100%;
	height: 7px;
	content: '';
	bottom: -8px;
	right: 3px;
	background-position: right;
	background-repeat: no-repeat;
	background-image: url("img/box_bg_330.png");
}

.frame-layout-13 .box::after,
.frame-layout-14 .box::after,
.frame-layout-15::after {
	position: relative;
	width: 100%;
	height: 7px;
	content: '';
	bottom: -23px;
	right: 0;
	background-position: right;
	background-repeat: no-repeat;
	background-image: url("img/box_bg_330.png");
	display: block;
}

.frame-layout-9.col-md-6,
.frame-layout-10.col-md-6 {
	width: 100%;
}

.frame-layout-0 .box { /*Standard*/
	padding: 0!important; /*wo brauchen wir das?*/
	margin-bottom: 50px; /*für Zertifikate*/
	/* test0723:  wird für Partnerschaften gebraucht*/
	display: flex;
	flex-flow: row wrap;
}

.frame-layout-0 .box::after {
	background: none;
	padding: 0;
}

.frame-type-list.frame-layout-0 > .box {
	justify-content: space-between; /*für die gleichmäßige Verteilung der Logos bei Partnerschaften*/
}

.layout-6 ~ .box.layout-0,
.box.layout-0 ~ .box.layout-0 { /*für Mitarbeitersuche*/
  margin-bottom: 0;
}

.frame-layout-0 .box .csc-textpic { /*für Bewertungen*/
	width: 100%;
}

#umschlag,
#umschlag header {
	padding: 0;
	margin: 0;
	width: 100%;
}

#logo {
	margin-top: 57px;
	padding: 15px;
	width: 240px;/*Tegeler&Schlachter*/
	position: relative;
}

#logo #logoimg {
	max-width: 100%;
}

.navbar {
	border-bottom: 1px solid #D8D8DF;
	box-shadow: 0px 0px 0px 1.5px rgb(var(--lightGreyColor));
	background-color: white;
	padding-bottom: 0;
}

header .container-fluid{
	padding: 0;
}

.navbar-light .navbar-toggler {
	margin-left: 15px;
	color: rgb(var(--darkGreyColor));
	border-color: rgba(85, 85, 85, 0.1);
}

.navbar-toggler:focus {
	box-shadow: inset 0 0 0 0.25rem;
}

#navbarNav {
	width: 100%;
}

#navbarNav #logo {
	display: none;
	padding: 0;
}

.navbar-nav .ebene1 {
	padding: 0;
}

ul#navbarNav,
li.ebene1,
li.ebene2:not(:last-child),
li.ebene3:not(:last-child),
#kopfmenue li {
	border-bottom: 1px solid #dcdcdc;
}

li.ebene1 > a,
#kopfmenue a {
	padding: 15px 0 13px 0;
}

.nav-item.ebene1 > a,
#kopfmenue a{
	margin: 0 10px;
}

.ebene2 .ebene2 a {
	margin: 0 10px 0 20px;
	padding: 1rem 0 1rem 0.5rem;
}

li.ebene2:first-child,
li.ebene3:first-child {
	border-top: 1px solid #dcdcdc;
}

.ebene3 .ebene3 a {
	margin-left: 35px;
}

.ebene4 .ebene4 a {
	margin-left: 50px;
}

.ebene5 .ebene5 a {
	margin-left: 75px;
}

nav .navbar-nav {
	position: fixed;
	top: 60px;
	left: 12px;
	width: 100%;
	background: white;
}

#kopfmenue_div {
	padding-top: 10%;
}
 
.dropdown-toggle::after,
.dropend .dropdown-toggle::after {
	content: "\f078";
	font-family: FontAwesome;
	font-size: 35px;
	border: none;
	vertical-align: -5px;
	line-height: 0;
	display: flex;
	justify-content: flex-end;
	position: relative;
	top: -12px;
 }
 
#navbarNav ul li.ebene1:first-child .dropdown-toggle::after {
	 display: none;
 }
 
/* .dropdown-toggle.show::after, */
.dropdown.show .dropdown-toggle:hover {
	content: "\f077";
 }
 
.dropdown-menu {
	border: none;
	padding: 0;
}

.dropdown-menu[data-bs-popper] {
	margin-top: 0;
}

#kopfmenue_div,
.inhalt_menu {
	display: none;
}

ul#kopfmenue {
	list-style-type: none;
	padding-left: 0;
}

.inhalt_menu {
	padding-top: 10%;
}

.inhalt_menu div.box.p-2 {
	padding: 0!important;
}

#umschlag .news-latest-container,
.frame-layout-13,
.frame-layout-14,
.frame-layout-15 {
	padding: 15px;
	background: rgb(var(--lightGreyColor));
	margin-bottom: 25px;
	width: 100%;
}

.frame-layout-0 .box .frame-layout-0 .box {
	margin-bottom: 0px;
}

p.news_latest_title {
	margin-bottom: 4%;
}

span.news_latest_title {
	display: block;
	border-top: 1px dotted rgb(var(--darkGreyColor));
	margin-top: 5px;
	padding-top: 5px;
	font-size: 113%;
	font-weight: bold;
}

.news_latest_image{
	margin-top: 8px;
}

.frame-layout-0 .box .news_latest_image img {
	width: auto;
}

#logo2 {
  width: 30%;  
  top: 13px; 
  right: 15px;
  z-index: 1031; 
  height: auto;
  max-width: 120px;
  position: fixed;
}

#logo2img {
	height: auto;
	width: 100%;
}

#inhalt {	
	clear: both;
	padding-top: 50px;
    padding-bottom: 50px;
}

#inhalt .frame-layout-0::after {
	display: none; /*wofür ist das?*/
}

.frame-layout-0 .ce-textpic {
	width: 100%;
}

.frame-layout-8 .ce-right .ce-gallery {
	width: 50%;
	float: right;
}

.frame-layout-8 .ce-left .ce-gallery {
	width: 50%;
	float: left;
}

#inhalt .frame-layout-0 .tx-emasters-lib-uni-pi-video {
	padding: 30px;
}

button {
    margin: 0 0 0.5em 0;
}

.frame-layout-0 img,
.frame-layout-1 img,
.frame-layout-2 img,
.frame-layout-3 img,
.frame-layout-9 img, /*Zertifikate*/
.frame-layout-10 img /*Zertifikate*/ {
	padding-bottom: 2%; /*Abstand nach unten zum Text*/
}

.frame-layout-0 img {
	width: 100%;
	height: auto;
}

.frame-layout-1 img, /*nicht auf 100%, da Icons auf Startseite sonst zu groß*/
.frame-layout-2 img,
.frame-layout-3 img {
	width: auto;
}

.frame-layout-9 img, /*Zertifikate*/
.frame-layout-10 img /*Zertifikate*/ {
	width: auto;
}

.frame-layout-16 img,
.frame-layout-17 img {
	width: 100%;
}

.csc-textpic-intext-right .csc-textpic-imagewrap {
	float: right;
	margin-left: 1%;
}

.csc-textpic-intext-left .csc-textpic-imagewrap {
	float: left;
	margin-right: 1%;
}

figcaption {
	text-align: center;
}

footer {
	font-size: 13px;
	color: white;
	display: flex;
	padding: 45px 3%;
	text-align: center;
	background: #333;
	box-shadow: 0 2px 10px rgba(30, 30, 30, 0.2), 3px 0 15px rgba(30, 30, 30, 0.2);
	z-index: 100;
}      

footer .row:first-child {
	position: relative;
	left: 50%;
	transform: translateX(-50%);
	width: 100%;
}

footer .row:last-child {
	position: absolute;
}

footer .hpk_adr_firma {
	font-size: 125%;
}

footer .hpk_adr_land,
footer .hpk_adr_firma {
  margin-bottom: 10px;
}

footer ul {
	margin: 0;
}

footer .navbar-nav {
	transform: translateX(-50%);
	left: 50%;
	position: relative;
	justify-content: center;
	margin: 30px 0;
}

footer ul.navbar-nav li,
footer ul.navbar-nav div { 
	padding: 0 7px 0 7px;
}

footer ul.navbar-nav li:not(:last-child),
footer ul.navbar-nav div:not(:last-child) { 
	border-right: 1px solid #e7e7e7;
}

footer a:not(.cookie-icon-wrapper a, .cookie-wrapper a) {
  color: white;
}

footer a:hover:not(.cookie-icon-wrapper a, .cookie-wrapper a) {
  color: rgb(var(--mainColor));
}

#fussmenue,
.zentralfussmenu {
	display: none;
}

#fussmenue {
	font-size: 13px;
}

.ebene1_strong {
	font-weight: bold;
	padding-bottom: 10px;
	font-size: 13px;
}

#socialshareprivacy {
	text-align:	start;
	position: relative;
	bottom:	-227px;
}

#socialshareprivacy .social_share_privacy_area {
	display: flex; 
	margin-bottom: 0 !important;
}

.social_share_privacy_area .facebook.help_info {
	width: 140px;
}

#umschlag #inhalt .frame-layout-12,
.clear {
	display: none;
}

/* ============= *
 * Struktur    	 *
 * ============= */
 
  /********************************************/
 /****************** Border ******************/
/********************************************/

#umschlag #hauptinhalt li,
#fussinhalt,
#inhalt .tx-hpkfe-pi-partner img {
  border-color: rgb(var(--lightGreyColor));
}

#inhalt .tx-hpkfe-pi-partner img:hover {
  border-color: rgb(var(--mainColor));
}

.frame-layout-0 .tx-emasters-lib-uni-pi-video {
	background: rgb(var(--lightGreyColor));
}

#inhalt .frame-layout-0 {
	background: none;
}

body #umschlag #inhalt .frame-layout-30 {
	background: rgb(var(--mainColor));
}

#inhalt .box.inhalt,
#inhalt .IM.box.ID-3.spalte,
#inhalt .IM.box.ID-4.spalte {
	background: none;
}

  /********************************************/
 /**************** Anfahrt *******************/
/********************************************/


#inhalt table {
    width: 100%;
    border: 0;
}

#inhalt .adp-step, 
#inhalt .adp-substep {
	border: 0;
	padding: 1em;
}

.hpk_con_form {
  border: 0;
  background: none;
  padding: 0;
  margin-bottom: 20px;
}

.hpk_con_form label,
.hpk_con_form input {
  width: 100%;
  display: block;
  margin-bottom: 8px;
  float: none;
}

input.hpk_anf_start, 
input.hpk_anf_ziel {
  margin-left: 0;
  margin-right: 0;
  border: 1px solid;
  background: none;
  padding: 1%;  
  width: 100%;
}

  /********************************************/
 /***************** Adresse ******************/
/********************************************/

#umschlag .box.frame-frame-layout-15 .hpk_adr_firma /* Stellenangebote Adressen-Ueberschrift an h1 angleichen */ {
  font-size: 125%; 
  font-weight: normal;
}

  /********************************************/
 /****************** Suche *******************/
/********************************************/

#suche {
	margin-bottom: 0.6em;
	position: fixed;
	width: 170px;
	height: 50px;
	right: 31%;
	top: 9px;
	z-index: 1031;
}

#suche .suchetext_submit {
	background-color: transparent;
	border: 0;
	height: 16px;
	position: absolute;
	right: 10px;
	top: 50%;
	transform: translateY(-50%);
	width: 16px;
}

#suche .suchetext_submit:hover {
	background-image: url("img/lupe-color4.png");
}

#suche .boxsuche_input  {
	border: 1px solid rgb(var(--darkGreyColor));
	height: 38px;
	width: 150px;
	padding: 6px 10px;
}

#suche .boxsuche_submit {    
	border: none;	
	background-image: url("img/lupe-color12.png");
	color: transparent;
	width: 20px;
	height: 20px;
	background-size: cover;
	background-color: white;
	position: relative;
	right: 23px;
	top: 4px;
}

#suche .suchetext_input {
	background-color: transparent;
	background-repeat: no-repeat;
	border: 0;
	box-shadow: 0 0 0;
	height: 48px;
	padding: 7px;  
	position: relative;
	width: 100%;
	background: rgb(var(--lightGreyColor));
	color: rgb(var(--darkGreyColor));
}

#suche .suchetext_input:focus {
	color: black;
}

#tx_indexedsearch label,
#tx_indexedsearch select{
	width: 100%; 
	margin-bottom: 0.75em;
}

#inhalt select {
	height: 38px;
	padding: 5px;
	border: 0;
}

.tx-indexedsearch .tx-indexedsearch-res .tx-indexedsearch-descr .tx-indexedsearch-redMarkup {
  color: green;
}

.tx-indexedsearch-rules {
  display: none;
}

#tx_indexedsearch .tx-indexedsearch-search-submit input,
#tx_indexedsearch .tx-indexedsearch-form input {
	width: 100%;
	margin-bottom: 1em;
	margin-left: 0;
	padding: 0 6px;
	height: 38px;
}

input#tx-indexedsearch-searchbox-button-submit {
	border: 0;
}

#tx_indexedsearch_extResume {
	height: 27px;
	width: 34px;
}

.tx-indexedsearch .tx-indexedsearch-noresults {
	text-align: left;
}

.tx-indexedsearch-res {
    padding: 2em;
}

.tx-indexedsearch-res {
	background: white;
}

.tx-indexedsearch-res:nth-child(even) {
    background: rgb(var(--lightGreyColor));
}

div.tx-indexedsearch-browsebox {
	margin: 2em 0;
}

ul.tx-indexedsearch-browsebox {
	margin-left: 0;
}

.tx-indexedsearch-browsebox li {
	display: inline;
}

.tx-indexedsearch-percent {
    letter-spacing: 0;
    font-weight: normal;
    float: right;
}

span.tx-indexedsearch-icon img {
    max-width: 100%;
    width: auto;
}

.tx-indexedsearch-info {
	display: none;
}

#umschlag .tx-indexedsearch-browsebox ul {
	margin-left: 0;
}

  /*************************************************/
 /******************* Slider **********************/
/*************************************************/

body #headercarousel,
body #slider {
	border-bottom: 30px solid rgb(var(--mainColor));
}

#slider img {
	width: 100%;
	height: auto;
}

.carousel-control-prev,
.carousel-control-next {
	display: none;
}

.carousel-caption {
	text-align: start;
	right: 10%;
	left: 45%;
	bottom: -10px;
}

#headercarousel h5,
#headercarousel p {
	padding: 10px 20px;
	display: inline-block;
}

#headercarousel h5 {
	background: rgb(var(--mainColor));
}

#headercarousel p {
	background: rgba( 255, 255, 255, 0.8);
	color: black;
	font-size: 75%;
}

.carousel-indicators {
	box-sizing: border-box;
	direction: rtl;
	margin-right: 34px;
	top: 0;
	left: unset;
}

.carousel-indicators [data-bs-target] {
	position: relative;
	left: 40%;
	height: 5px;
	width: 20px;
}

  /*************************************************/
 /******************* Partner *********************/
/*************************************************/

.tx-hpkfe-pi-partner {
    display: flex;
    flex-flow: row wrap;
}

#inhalt .tx-hpkfe-pi-partner .partner {
	box-sizing: border-box;
	flex: 0 0 50%;
	width: auto;
}

#inhalt .tx-hpkfe-pi-partner img {
  border: 1px solid rgb(var(--darkGreyColor));
}

#inhalt .tx-hpkfe-pi-partner img:hover {
  border: 1px solid rgb(var(--mainColor));
}

#inhalt .tx-hpkfe-pi-partner .partner {
  float: left; 
  padding: 0px 10px 10px 0px;
  width: 30%;
}

  /*************************************************/
 /********************* News **********************/
/*************************************************/

.frame-layout-0 .frame-layout-0 {
	width: 100%;
}

#inhalt div.news-list-container {
    padding: 0;
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
}

div.news-list-item {
    background: rgb(var(--lightGreyColor));
    border-bottom: 0;
	box-sizing: border-box;
    flex: 0 0 100%;
	margin: 0 0 25px 0;
    max-width: 100%;
    padding: 30px 30px 50px 30px;
	position: relative;
}

span.news_title a {
	font-size: 120%;
}

div.newsdatum,
.news-single-rightbox {
	color: rgb(var(--darkGreyColor));
	float: none;
    font-size: 80%;
    margin: 0 0 15px 0;
	cursor: normal;
}

.newspipe {
	display: none;
}

div.news-list-content {
	border: 0;
	margin: 15px 0 0;
}

div.news-list-content > a {
	display: inline-block;
	margin-bottom: 15px;
}

div.detailsansehen {
    bottom: 15px;
	left: auto;
	position: absolute;
}

.detailsansehen p.detailsansehen a {
	background-position: 0px 7px;
}

.news-single-rightbox {
	float: right;
	margin: 10px 0 15px 0;
	width: auto; /*um die 160px default-Breite zu überschreiben*/
}

.news-single-rightbox h2{
	font-size: 120%
}

.news-single-item hr.cl-right {
	margin: 20px 0;
	background-color: gray;
}
	
.news-single-img {
	margin: 0;
}

.news-single-imgcaption {
	font-size: 80%;
	width: 100% !important;
}

  /*******************************************/
 /********** Produktlösungen ****************/
/*******************************************/

.produktloesungen,
.herstelleruebersicht {
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	width: 100%;
}

.produktloesungen:after {
	content: " ";
	flex: 0 0 32.33%;
	max-width: 32.33%;
}
 
.produktloesungen .box.normal .frame-layout-0 {
	box-sizing: border-box;
	display: flex;
	flex-flow: column;
	height: 100%;
	justify-content: flex-end;
}
 
#inhalt.content .produktloesungen .box.normal .frame-layout-0 {
	background: transparent;
}
 
#inhalt.content .produktloesungen .frame-layout-0:last-child {
	margin-top: 0;
}
 
.herstelleruebersicht {
	align-self: flex-end;
	flex-flow: row wrap;
	justify-content: center;
}
 
hr.hersteller {
	flex: 0 0 100%;
	margin: 15px 0 10px;
	max-width: 100%;
}

#inhalt .herstelleruebersicht .herstellerlink {
	padding: 0;
}
 
#inhalt .herstellerlink a {
	font-size: 0;
}

#inhalt .herstellerlink .fa {
	font-size: 18px;
	margin: 0 0.25em;
}

  /********************************************/
 /**************** Abstaende *****************/
/********************************************/

#inhalt .tx-hpkfe-pi-kontakt,
#inhalt .tx-powermail-pi1,
#inhalt .tx-powermail,
#inhalt .tx-hpkfe-pi-gmap,
#inhalt .tx-hpkfe-pi-adresse,
#inhalt .tx-hpkfe-pi-impressum,
#inhalt .tx-hpkfe-pi-datenschutz,
#inhalt .hpkfe-pi-betroffenenrechte,
#inhalt .tx-hpkfe-pi-referenzen,
#inhalt .tx-indexedsearch,
#inhalt .news-list-container,
#inhalt .box .tx-emasters-lib-uni-pi-video {
  padding: 0 15px;
}

#inhalt .herstelleruebersicht .herstellerlink {
  padding-left: 15px;
}

#inhalt .frame-layout-0 {
	padding-bottom: 0;
	/* min-height: 280px; /*für Unterseite Ladengeschäft?*/
	width: 100%;
}

  /********************************************/
 /*************** Referenzen *****************/
/********************************************/

.tx-hpkfe-pi-referenzen {
  position: relative;
  overflow: hidden;
}

#inhalt .slideholder {
  background: none !important;
}

.tx-hpkfe-pi-referenzen .slideshowContainer {
  margin-bottom: 10px;
}

.tx-hpkfe-pi-referenzen ul,
.tx-hpkfe-pi-referenzen li {
  list-style-type: none;
  margin-bottom: 0;
}

.tx-hpkfe-pi-referenzen a {
  position: absolute; 
  text-decoration: none;
}

.tx-hpkfe-pi-referenzen .prev a { 
  left: 20px;
  top: 10px;
  z-index: 35;
  background: #333333;
  opacity: 0.9;
  width: 35px;
  height: 35px;  
  display: block;  
  color: white;
  border-radius: 30px;
  font-size: 25px;
} 	

.tx-hpkfe-pi-referenzen .next a {
  left: 60px; 
  top: 10px;
  z-index: 35;  
  background: #333333;
  opacity: 0.9;
  width: 35px;
  height: 35px;  
  display: block;  
  color: white;
  border-radius: 30px;
  font-size: 25px;
} 

.tx-hpkfe-pi-referenzen .prev a:before {
  content: "\f053";
  font-family: 'FontAwesome';   
  text-shadow: 1px 1px 1px #333;
  color: white;  
  text-align: center;  
  display: block;
  margin-left: -3px;
} 

.tx-hpkfe-pi-referenzen .next a:before {
  content: "\f054";
  font-family: 'FontAwesome';  
  text-shadow: 1px 1px 1px #333;  
  color: white;
  text-align: center;  
  display: block;  
  margin-right: -3px;
}

.tx-hpkfe-pi-referenzen .slidetext {
  height: auto; 
  padding-top: 1px; 
  padding-left: 2px; 
  line-height: 13pt;
} 

.tx-hpkfe-pi-referenzen a.slider-link {
  position: relative;
}

  /********************************************/
 /*************** Bewertungen ****************/
/********************************************/

.bewertungen-cont-left {
  float: left;
  width: 20%;
}

.bewertungen-cont-right {
  float: left;
  border-left: 1px solid #c7c7c7;
  padding-left: 2%;
  margin-left: 2%;
  width: 73%;
}

.logogoldwert {
  float: right;
  margin-left: 10px;
}

.bewertungen-cont-top {  
  margin-bottom: 10px;
}

.bewertungen-cont-top hr {
  background-color: #c7c7c7;
}

.bewertungen-cont-quertop {
  margin-bottom: 10px;
  border-bottom: 1px solid #c7c7c7;
}

.bewertungen-boxquer-item {
  float: left;
  width: 32.333333%;
  margin-right: 1%;
}

.bodytextcontent .pageinator {
	text-align: center;
}

.bodytextcontent .pageinator .pb_page_first,
.bodytextcontent .pageinator .pb_page_back,
.bodytextcontent .pageinator .pb_page_status,
.bodytextcontent .pageinator .pb_page_next {
	margin-right: 10px;
}

#bewertungen_widget {
	display: block; 
	text-align: center; 
	padding: 5px 0 5px 0; 
	width: 100%;
}

#bewertungen_widget .icon_stars {
	display: inline;
	margin-right: 10px;
}

#innerer_umschlag #bewertungen_widget {
	display: block; 	
	text-align: right;
	padding: 10px 0 5px 0; 
	width: 100%;
}

#innerer_umschlag #bewertungen_widget a {
	color: 000;
}

.bewertungen-list-item  {
  margin-bottom: 10px;
}

.bewertungen_name {
  font-weight: bold;
}

.icon_stars:after {
  font-family: FontAwesome;
  color: #ffba00;
}

.stars_5:after {
  content: '\f005\f005\f005\f005\f005';
}

.stars_4_5:after {
  content: '\f005\f005\f005\f005\f123';
}

.stars_4:after {
  content: '\f005\f005\f005\f005\f006';
}

.stars_3_5:after {
  content: '\f005\f005\f005\f123\f006';
}

.stars_3:after {
  content: '\f005\f005\f005\f006\f006';
}

.stars_2_5:after {
  content: '\f005\f005\f123\f006\f006';
}

.stars_2:after {
  content: '\f005\f005\f006\f006\f006';
}

.stars_1_5:after {
  content: '\f005\f123\f006\f006\f006';
}

.stars_1:after {
  content: '\f005\f006\f006\f006\f006';
}

  /*************************************************/
 /************** Mitarbeitersuche *****************/
/*************************************************/

.layout-7 .csc-header{
	padding: 20px 20px 0;
}

.layout-7 .cycle-slideshow {
	min-height: 450px;
}

.layout-7 .cycle-slideshow img {
	padding: 0 20px;
	height: auto;
	width: 100%;
}

.layout-7 .csc-textpic-text {
	padding: 20px;
}

.layout-7 .cycle-pager {
	transform: translateX(80%);
	right: 60% !important;
	bottom: 0;
	top: unset !important;
}

#umschlag .box.layout-0.ID-2 {
	margin-bottom: 30px;
}

  /********************************************/
 /***** Socialmedia Links und Grafiken *******/
/********************************************/

#sociallinks {
  position: fixed;
  right: 0;
  top: 180px;
  z-index: 100;
}

#sociallinks a {
  display: block;
  width: 35px;
  height: 34px;
  margin-bottom: 10px;
}

#sociallinks .facebook a {
  background:url("img/socialmediabuttons.png") top left no-repeat;
}

#sociallinks .facebook a:hover {
  background:url("img/socialmediabuttons_hover.png") top left no-repeat;
}

#sociallinks .telefon a {
  background:url("colorimg/socialmediabuttons.png") top no-repeat;
  background-position: -321px;
}

#sociallinks .telefon a:hover {
  background:url("colorimg/socialmediabuttons_hover.png") top no-repeat;
  background-position: -321px;
}

#sociallinks .twitter a {
  background:url("img/socialmediabuttons.png") no-repeat;
  background-position: -40px;
}

#sociallinks .twitter a:hover {
  background:url("img/socialmediabuttons_hover.png") no-repeat;
  background-position: -40px;
}

#sociallinks .tiktok a {
  background:url("img/socialmediabuttons.png") top right no-repeat;
  background-position: -80px;
}

#sociallinks .tiktok a:hover {
  background:url("img/socialmediabuttons_hover.png") top right no-repeat;
  background-position: -80px;
}

#sociallinks .youtube a {
  background:url("img/socialmediabuttons.png") top no-repeat;
  background-position: -120px;
}

#sociallinks .youtube a:hover {
  background:url("img/socialmediabuttons_hover.png") top no-repeat;
  background-position: -120px;
}

#sociallinks .whatsapp a {
  background:url("img/socialmediabuttons.png") top right no-repeat;
  background-position: -160px;
}

#sociallinks .whatsapp a:hover {
  background:url("img/socialmediabuttons_hover.png") top right no-repeat;
  background-position: -160px;
}

#sociallinks .xing a {
  background:url("img/socialmediabuttons.png") top no-repeat;
  background-position: -200px;
}

#sociallinks .xing a:hover {
  background:url("img/socialmediabuttons_hover.png") top no-repeat;
  background-position: -200px;
}
#sociallinks .instagram a {
  background:url("img/socialmediabuttons.png") top right no-repeat;
  background-position: -240px;
}

#sociallinks .instagram a:hover {
  background:url("img/socialmediabuttons_hover.png") top right no-repeat;
  background-position: -240px;
}

#sociallinks .linkedin a {
  background:url("img/socialmediabuttons.png") top right no-repeat;
  background-position: -280px;
}

#sociallinks .linkedin a:hover {
  background:url("img/socialmediabuttons_hover.png") top right no-repeat;
  background-position: -280px;
}

#sociallinks .clicktocall a {
  background:url("img/socialmediabuttons.png") top right no-repeat;
  background-position: -320px;
}

#sociallinks .clicktocall a:hover {
  background:url("img/socialmediabuttons_hover.png") top right no-repeat;
  background-position: -320px;
}

  /********************************************/
 /*************** Video Plugin ***************/
/********************************************/

.tx-emasters-lib-uni-pi-video {
	box-sizing: border-box;
	width: 100%;
}

#umschlag .tx-emasters-lib-uni-pi-video .emasters_video,
#umschlag .tx-emasters-lib-pi-video .emasters_video,
#umschlag .elastic-video,
#inhalt .elastic-video {
  position: relative;
  padding-bottom: 55%;
  padding-top: 7px;
  height: 0;
  overflow: hidden;
  z-index: 2;
}

#umschlag .tx-emasters-lib-uni-pi-video .emasters_video video,
#umschlag .tx-emasters-lib-pi-video .emasters_video video,
#umschlag .elastic-video iframe,
#inhalt .elastic-video iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 3;
}

#umschlag .vjs-fullscreen-control.vjs-control /** no fullscreen **/ {
  display: none;
}

#umschlag .vjs-volume-control /** position correctur **/ {
  margin-right: 10px !important;
}

#umschlag .tx-emasters-lib-uni-pi-video .vjs-controls,
#umschlag .tx-emasters-lib-pi-video .vjs-controls {
  z-index: 5;  
}

#umschlag .vjs-big-play-button,
#umschlag .vjs-controls {
  z-index: 15;
}

.emasters_video .vjs-default-skin.vjs-big-play-centered .vjs-big-play-button,
.emasters_video .vjs-default-skin .vjs-big-play-button,
#umschlag .vjs-default-skin .vjs-big-play-button {
  width: 65px;
  height: 65px;
  left: 50%;
  top: 50%;  
  margin: 0;
  border-radius: 50px;
  border: 2px solid #FFFFFF;
  color: #FFFFFF;
  background-color: rgb(85, 85, 85); /* Fallback */
  background-color: rgba(85, 85, 85, 0.7);
  transform: translateX(-50%) translateY(-50%);
  z-index: 5;
}

.emasters_video .vjs-default-skin.vjs-big-play-centered .vjs-big-play-button:before,
.emasters_video .vjs-default-skin .vjs-big-play-button:before,
#umschlag .vjs-default-skin .vjs-big-play-button:before {
  content: "\e001";
  font-family: VideoJS;
  line-height: 0;
  text-shadow: 0px 0px 0px;
  text-align: center;
  position: absolute;
  font-size: 25px;
  left: 50%;
  top: 50%;  
  width: auto;
  height: auto;
  transform: translateX(-50%) translateY(-50%);
}

#umschlag .hpk_pc-klein .vjs-default-skin .vjs-current-time, #headerfoto .vjs-default-skin .vjs-duration {
  width: 11%;
}

#umschlag .vjs-default-skin .vjs-big-play-button:hover {
  background-color: rgb(40, 40, 40); /* Fallback */
  background-color: rgba(40, 40, 40, 0.7);
}

.navbar .inhalt_menu .box.frame-layout-13 .emasters_video .vjs-current-time,
#untermenu_div .box.frame-layout-13 .emasters_video .vjs-current-time,
#submenue_newlbox .box.frame-layout-13 .emasters_video .vjs-current-time {
  width: 15%;
}

  /********************************************/
 /************** Video Overlay ***************/
/********************************************/

.emasters_video {
  position: relative;
}


.slider .tx-emasters-lib-uni-pi-video .emasters_video {
	height: 100% !important;
	padding: 0;
}

.slider .tx-emasters-lib-uni-pi-video .emasters_video video {
	height: auto;
	position: relative;
}

.vjs-default-skin {
	display: flex;
	line-height: 100%;
    max-width: 100%;
    max-height: 100%;
}


.slider .vjs-default-skin {
	display: flex;
	height: 100% !important;
	line-height: 100%;
    max-width: 100%;
    max-height: 100%;
}

.slider .vjs-default-skin.vjs-has-started.vjs-user-inactive.vjs-playing .vjs-control-bar {
	max-width: 100%;
}

.overlay {
  position: absolute;    
  width: 96%;
  padding: 8px 2% 8px 2%;
  bottom: 15%;	
  left: 0;
  z-index: 15;
  background: -moz-linear-gradient(left,  rgba(255,255,255,0.9) 15%, rgba(255,255,255,0.64) 33%, rgba(255,255,255,0.34) 54%, rgba(255,255,255,0.3) 57%, rgba(255,255,255,0.69) 74%, rgba(255,255,255,0.95) 85%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, right top, color-stop(15%,rgba(255,255,255,0.9)), color-stop(33%,rgba(255,255,255,0.64)), color-stop(54%,rgba(255,255,255,0.34)), color-stop(57%,rgba(255,255,255,0.3)), color-stop(74%,rgba(255,255,255,0.69)), color-stop(85%,rgba(255,255,255,0.95))); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(left,  rgba(255,255,255,0.9) 15%,rgba(255,255,255,0.64) 33%,rgba(255,255,255,0.34) 54%,rgba(255,255,255,0.3) 57%,rgba(255,255,255,0.69) 74%,rgba(255,255,255,0.95) 85%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(left,  rgba(255,255,255,0.9) 15%,rgba(255,255,255,0.64) 33%,rgba(255,255,255,0.34) 54%,rgba(255,255,255,0.3) 57%,rgba(255,255,255,0.69) 74%,rgba(255,255,255,0.95) 85%); /* Opera 11.10+ */
  background: -ms-linear-gradient(left,  rgba(255,255,255,0.9) 15%,rgba(255,255,255,0.64) 33%,rgba(255,255,255,0.34) 54%,rgba(255,255,255,0.3) 57%,rgba(255,255,255,0.69) 74%,rgba(255,255,255,0.95) 85%); /* IE10+ */
  background: linear-gradient(to right,  rgba(255,255,255,0.9) 15%,rgba(255,255,255,0.64) 33%,rgba(255,255,255,0.34) 54%,rgba(255,255,255,0.3) 57%,rgba(255,255,255,0.69) 74%,rgba(255,255,255,0.95) 85%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e6ffffff', endColorstr='#f2ffffff',GradientType=1 ); /* IE6-9 */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e6ffffff', endColorstr='#00ffffff',GradientType=1 ); /* IE6-9 */
  border-top: 1px solid #cccccc;
  border-bottom: 1px solid #cccccc;
}

#oinhalt {
  float: left;
  width: 75%;
  color: #363636;
}

#oheader {
  font-size: 150%;  
  margin-bottom: 2px;
}

#ologo {  
  float: right;
  text-align: right;
  width: 20%;  
}

#ologo img {
  max-height: 50px;
  max-width: 100%;
  width: auto;
  height: auto;
}

#umschlag .overlay img {
  box-shadow: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
}

.em-yt-overlay {
    position: absolute;
    z-index: 500;
}

.em-yt-content {
    position: relative;
    z-index: 2;
}

p.youtube-text {
    background: rgba(242,242,242, 0.6);
}

.em-yt-button {
    border: none;
    border-radius: 0;
	display: block;
    margin: 1rem auto 0;
	padding: 0.5rem 1rem;
}

img.em-yt-content-img {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: auto;
}

  /********************************************/
 /***** Video-Vorschauleiste (Uebersicht) ****/
/********************************************/

#umschlag .playlist-components {
  position: relative;
  width: 100%;    
  margin: 8px 0 8px 0;
}

#umschlag .playlist-components .playlist {
  overflow-y: hidden;
  overflow-x: auto;
  white-space: nowrap;
  width: 100%;
}

#inhalt .playlist-components .playlist ul {
  margin-left: 0;
  margin-bottom: 5px;
}

#inhalt .playlist-components .playlist li {
  list-style-type: none;
  display: inline;
}

#inhalt .playlist-components .playlist li img {
  border: 3px solid;
  border-color: rgba(7, 20, 30, 0.7);
  margin: 0 8px 0 0;
  cursor: pointer;
  max-width: 100%;
  width: auto;
  height: auto;
}

#inhalt .playlist-components .playlist li img:hover {
  border-color: #FFFFFF;
}

#inhalt .playlist-components .playlist li.active img {
  border-color: #e40514;
}

#inhalt .playlist-components .playlist #prev,
#inhalt .playlist-components .playlist #next {
  display: none;
}

#umschlag .playlist-components .playlist::-webkit-scrollbar{
  width: 9px;
  height: 9px;
}

#umschlag .playlist-components .playlist::-webkit-scrollbar-track-piece{
  background-color: #FAFAFA;
  -webkit-border-radius: 8px;  
}

#umschlag .playlist-components .playlist::-webkit-scrollbar-thumb:vertical{
  height: 50px;
  background-color: rgba(7, 20, 30, 0.7);
  -webkit-border-radius: 8px;
}

#umschlag .playlist-components .playlist::-webkit-scrollbar-thumb:horizontal{
  width: 50px;
  background-color: rgba(7, 20, 30, 0.7);
  -webkit-border-radius: 8px;
}

  /********************************************/
 /************ Bild Overlay ******************/
/********************************************/

/* Shared styles for lightbox & slimbox*/
#prevLink, #nextLink {
	display:block;
	position:absolute;
	top:0;
	width:35%;
	height:100%;
	background:transparent url(images/lightbox/blank.gif) no-repeat; /* Trick IE into showing hover */
}

#prevLink {
	left:0;
	float:left;
}

#nextLink {
	right:0;
	float:right;
}

#prevLink:hover {
	/* Edit here for a different image!*/
	background:transparent url(images/lightbox/prev.gif) no-repeat 0% 15%;
}

#nextLink:hover {
	/* Edit here for a different image!*/
	background:transparent url(images/lightbox/next.gif) no-repeat 100% 15%;
}

#playLink,#pauseLink,#saveLink,#closeLink {
	display:block;
	float:right;
	/* Set these two to the actual dimensions of your images! If they differ in size you have to set them seperately!*/
	width:26px;
	height:26px;
	/* End*/
	margin-left:1.0em;
}

#playLink {
	/* Edit here for a different image! Add width & height here if needed*/
	background:transparent url(images/lightbox/play.gif) no-repeat center;
}

#pauseLink {
	/* Edit here for a different image! Add width & height here if needed*/
	background:transparent url(images/lightbox/pause.gif) no-repeat center;
}

#saveLink {
	/* Edit here for a different image! Add width & height here if needed*/
	background:transparent url(images/lightbox/save.gif) no-repeat center;
}

#closeLink {
	/* Edit here for a different image! Add width & height here if needed*/
	background:transparent url(images/lightbox/close.gif) no-repeat center;
}

/* Slimbox-only*/
#lbOverlay {
	position:fixed;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background-color:#000;
	cursor:pointer;
	z-index: 0;
}

#lbCenter, #lbBottomContainer {
	position:absolute;
	left:50%;
	overflow:hidden;
	background-color:#fff;
	z-index:101;
}

body #lbBottomContainer {
	z-index:100;
}

#lbCenter a, #lbBottomContainer a {
	text-decoration:none;
	border:none;
	outline:none;
}

.lbLoading {
	background:#fff url(images/lightbox/loading.gif) no-repeat center;
}

#lbImage {
	position:absolute;
	left:0;
	top:0;
	border:10px solid #fff;
	background-repeat:no-repeat;
}

#lbBottom {
	font-family:tahoma, arial, sans-serif;
	font-size:11px;
	color:#666;
	line-height:1.4em;
	text-align:left;
	padding:0 10px 10px 10px;
}

#lbCaption {
	width:66%;
	font-weight:bold;
	margin-bottom:0.1em;
}

#lbNumber {
	width:66%;
	margin-bottom:0.1em;
}

#lbPresent {
	width:66%;
	margin-bottom:0.1em;
}

#lbPresent a {
	position:relative;
	float:left;
	color:#777;
	border-right:0.3em solid #fff;
	border-bottom:0.1em solid #fff;
	border-left:0.4em solid #fff;
	margin-right:0.2em;
}

#lbPresent a.act {
	color:#fff;
	background:#777;
	border-color:#777;
}

/* Lightbox-only*/
#overlay {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background-color:#000;
	z-index:90;
}

#lbLightbox {
	position:absolute;
	left:0;
	width:100%;
	z-index:100;
	text-align:center;
	line-height:0;
}

#lbLightbox #closeLink {
	margin-bottom:10px;
}

#lbLightbox a {
	text-decoration:none;
	border:none;
	outline:none;
}

#lbLightbox img {
	width:auto;
	height:auto;
	border:none;
}

#lbOuterImageContainer {
	position:relative;
	background-color:#fff;
	width:250px;
	height:250px;
	margin:0 auto;
}

#lbImageContainer {
	padding:10px;
}

#lbLoading {
	position:absolute;
	z-index:110;
	top:40%;
	left:0%;
	height:25%;
	width:100%;
	text-align:center;
	line-height:0;
	background:#fff url(images/lightbox/loading.gif) no-repeat center;
}

#lbHoverNav {
	position:absolute;
	top:0;
	left:0;
	height:100%;
	width:100%;
	z-index:10;
}

#lbImageContainer>#lbHoverNav {
	left:0;
}

#lbImageDataContainer {
	font-family:tahoma, arial, sans-serif;
	font-size:11px;
	background-color:#fff;
	margin:0 auto;
	line-height:1.4em;
	overflow:auto;
	width:100%;
}

#lbImageData {
	padding:0 10px;
	color:#666;
}

#lbImageDetails {
	width:66%;
	float:left;
	text-align:left;
	padding-bottom:10px;
}

#lbCaption {
	display:block;
	font-weight:bold;
	margin-bottom:0.1em;
}

#lbNumberDisplay {
	display:block;
	margin-bottom:0.1em;
}

#lbPresent {
	display:block;
	margin-bottom:0.1em;
}

#lbPresent a {
	position:relative;
	float:left;
	color:#777;
	border-right:0.3em solid #fff;
	border-bottom:0.1em solid #fff;
	border-left:0.4em solid #fff;
	margin-right:0.2em;
}

#lbPresent a:hover {
	color:#000;
}

#lbPresent a.act {
	color:#fff;
	background:#777;
	border-color:#777;
}

  /********************************************/
 /************* Share Buttons ****************/
/********************************************/

.shariff ul {
	margin: 15px 0 8px;
}

  /********************************************/
 /************* Accordion Ext ****************/
/********************************************/

.accordion_header {position: relative;}
.accordion_element {padding: 10px 0 10px 0; border-top: 1px solid grey;}
.accordion_element a {text-decoration: none;}
.accordion_header i {position: absolute; top: 2px;}
.accordion_header_content {margin-left: 20px; display: block;}
.accordion_content {margin-left: 21px;}
.accordion_content {margin-top: 8px;}
.accordion_header_content.fa-minus:before {display: none;}

  /********************************************/
 /**************** Google Map ****************/
/********************************************/

.map_hinweis_holder {
    background: #e6e6e6;
    padding: 1em;
    box-sizing: border-box;
    text-align: center;
}

fieldset div.hpk_kon_container2 input.hpk_kon_name2 {
	height: 0;
}

.map_hinweis_button,
input.hpk_kon_subm {
    border: none;
    background: #e70f0f;
	color: #fff;
    padding: 0.5em;
	width: 100%;
}

  /**********************************************/
 /*** Komfortzusatzleistung eigene Formulare ***/
/**********************************************/

.powermail_fieldwrap,
.tx_powermail_pi1_fieldwrap_html {
  width: 100%;
  display: block;
  margin-bottom: 5px;
}

.powermail_radio_inner {
  clear: both;
}

.powermail_fieldwrap_type_text {
	clear: both;
}

.powermail_check_inner input,
.powermail_radio_inner input {
  width: auto;
  float: left;
  margin-right: 1%;
}

.powermail_radio_inner label {
  width: 85%;
}

.tx_powermail_pi1_fieldwrap_html_textarea label {
  width: 29%;
  display: block;
  float: left;
}

.powermail_check_inner label {
  width: 80%;
}

.powermail_fieldwrap_type_check .checkbox label {
	width: 70%;
}

.powermail_fieldwrap_type_check .checkbox label  input[type="checkbox"] {
	width: auto;
}

.tx_powermail_pi1_fieldwrap_html_textarea textarea {
  width: 71%;
  display: block;
}

.powermail_fieldwrap_type_submit {
	margin-top: 30px;
}

  /********************************************/
 /***************** Cookie *******************/
/********************************************/

.cookie-wrapper {
	background: rgba( 0, 0, 0, 0.75 );
    box-shadow: 0 0 5px #aeaeae;
	color: rgb(var(--darkGreyColor));
	text-align: left;
	font-size: 15px;
	display: none;
	height: 100%;
	left: 0;
	overflow-y: auto;
	position: fixed;
	top: 0;
	-webkit-backface-visibility: hidden;
	z-index: 1035;
}

.cookie-content {
	background: white;
    box-shadow: 0 0 5px #acacac;
	left: 50%;
	padding: 2em;
	position: absolute;
	transform: translateX(-50%);
	-webkit-overflow-scrolling:touch;
	width: 100%;
}

.cookie-details-wrapper {
	align-items: center;
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
}

.cookie-details-wrapper,
.cookie-innercontent {
	flex: 0 0 100%;
	max-width: 100%;
	box-sizing: border-box;
}

.cookie-button {
	border: 1px solid rgb(var(--mainColor));
	box-sizing: border-box;
	background-color: rgb(var(--mainColor));
	display: flex;
	color: white; /*btn-Textfarbe im Cookiebanner*/
	justify-content: center;
	margin: 1em 0;
	padding: 1em;
	text-align: center;
	text-decoration: none;
	align-items: center;
	flex: 0 0 100%;
	max-width: 100%;
	font-weight: bold;
}

.cookie-button:hover {
	border: 1px solid rgb(var(--darkGreyColor));
	background-color: rgb(var(--darkGreyColor));
}

.cookie-button-some {
	height: 50px;
}

#cookieButtonSome:target + .cookie-details {
	display: block;
}

.cookie-details h3 {
	margin: 1em 0;
}

.open-cookies {
	display: inline-block;
	margin: 0 0 1.5em;
}

.cookie-content fieldset {
	border: none;
	margin: 0.5em 0;
	padding: 0.5em 1em;
}

.cookie-content .all-cookies {
	margin: 1.5em 0;
}

.cookie-content legend {
	box-sizing: border-box;
	display: block;
	font-weight: 700;
	width: 100%;
}

.cookie-content label {
	align-items: center;
	box-sizing: border-box;
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	margin: 0.5em 0;
	width: 100%;
}

.cookie-element {
	box-sizing: border-box;
	display: block;
}

ul ul .cookie-element {
	padding: 0 1em 0 0;
}

.cookie-checkbox {
	flex: 0 0 5%;
	max-width: 5%;
}

.cookie-info-wrapper {
	margin: 1em 0;
}

.cookie-info-content {
	display: none;
}

.checkbox-description-text {
	box-sizing: border-box;
	display: block;
	margin: 0.5em 0 0;
	width:100%;
}

.cookie-settings-wrapper {
	display: none;
	margin: 0 0 1.5em;
	position: relative;
}

.form-buttons {
	display: flex;
	flex-flow: row wrap;
	justify-content: space-evenly;
}

.cookie-list  .dismiss-cookies.cookie-button {
	margin: 2em auto 1em;
}

.cookie-list-link {
    border-radius: 3em;
	background: #fff;
    border: 1px solid #aaa;
    color: #aaa;
    display: inline-block;
    height: 30px;
    right: 1em;
	overflow: hidden;
    position: absolute;
	text-decoration: none;
	text-indent: 0;
    width: 30px;
	z-index: 1;
}

.cookie-list-link:before {
    content: "i";
	display: block;
    font-size: 1.5em;
    font-weight: 700;
	text-align: center;
	margin-top: -3px;
}

.cookie-list-link.cookie-list-active:before {
	content: "X";
}

.cookie-list {
	background: white;
	box-sizing: border-box;
	display: none;
	left: 0px;
	list-style:none;
	padding: 0;
	top: 0px;
	width: 100%;
} 

.cookie-list li {
	margin: 0.25em 0;
	padding: 1em;
}

.cookie-list li ul {
	list-style:none;
	padding: 0;
}

.cookie-list li li:nth-child(odd),
.cookie-list li li:nth-child(even) {
	background: transparent;
	margin: 0;
	padding: 0.25em 0.25em 0.25em 0;
}

footer .cookie-icon-wrapper { /*mit footer, damit bootstrap überschrieben wird*/
	background: #ddd;
	border-radius: 2em 0 0 0;
	bottom: 0;
	padding: 0.8em 1em;
	position: fixed;
	right: 0;
	width: auto;
}

.cookie-icon-button {
	margin: 0;
}

.cookie-content fieldset:nth-child(odd),
.cookie-list li:nth-child(odd) {
	background: rgb(var(--lightGreyColor));
}

.cookie-content fieldset:nth-child(even),
.cookie-list li:nth-child(even) {
	background: #eaeaea;
}

.cookie-note {
	color: #999;
}

.cookie-list-link:hover {
    background: rgb(var(--mainColor));
    border: 1px solid rgb(var(--mainColor));
    color: white;
}

.cookie-list-link:before:hover {
	color: white;
}

  /**************************************************/
 /**************** Switch-Schalter *****************/
/**************************************************/

.homepage-form .cookie-checkbox,
.cookie-group-switch .cookie-checkbox {
	display: none;
}

.homepage-form label,
.cookie-group-switch label {
	display: flex;
    flex-flow: wrap;
    /* justify-content: flex-end; */
	cursor: pointer;
}

.switch-background {
	background: #ccc;
	border-radius: 10px;
	box-shadow: 1px 1px 1px #aaa inset;
	height: 15px;
	position: relative;
	width: 30px;
}

.switch-button {
	background: #fff;
	border-radius: 15px;
	box-shadow: 1px 1px 1px #aaa;
	height: 20px;
	left: -5px;
	position: absolute;
	top: -3px;
	width: 20px;
}

.homepage-form .cookie-checkbox:checked + label .switch-background,
.cookie-group-switch .cookie-checkbox:checked + label .switch-background {
	background: #e30613;
}

.homepage-form .cookie-checkbox:checked + label .switch-button,
.cookie-group-switch .cookie-checkbox:checked + label .switch-button {
	left: auto;
	right: -5px;
}

.homepage-form .cookie-checkbox:checked + label .switch-background,
.cookie-group-switch .cookie-checkbox:checked + label .switch-background {
	background: rgb(var(--mainColor));
}

/*alert meldung für videobox(thema showcase als layout für mitglieder auch)*/
.videoboxAlert {
  padding: 20px;
  background-color: #ff9800;
  color: white;
  text-align: center;
}

.videoboxClosebtn {
  margin-left: 15px;
  color: white;
  font-weight: bold;
  float: right;
  font-size: 22px;
  line-height: 20px;
  cursor: pointer;
  transition: 0.3s;
}

.videoboxClosebtn:hover {
  color: black;
}

.videoboxBeschreibung {
  margin-bottom: 2px;
}

/*bildunterschrift zentrieren*/
.bodytextcontent .image-caption {
	text-align: center;
}

  /********************************************/
 /*********** Formulare / Powermail **********/
/********************************************/

.tx-hpkfe-pi-kontakt h2 {
	font-size: 120%
}

textarea {
	resize: vertical;
} 

fieldset,
fieldset.hpk_kon_formset {
  border: 0; 
  background: none; 
  padding: 0;
}

div.powermail_fieldwrap_type_radio > label.powermail_label {
  font-size: 130%; 
  margin-bottom: 5px;
}

div.powermail_fieldwrap_type_radio > label.powermail_label {
	width: 100%;
}

#inhalt input.powermail_field.powermail_submit {
  background-color: rgb(var(--mainColor));
  border-color: rgb(var(--mainColor));
}

#inhalt input.powermail_field.powermail_submit:hover {
  background-color: rgb(var(--darkGreyColor));
  border-color: rgb(var(--darkGreyColor));
} 

textarea.hpk_kon_rechempf {
  background: none; 
  width: 98%; 
  height: 150px;
}

textarea.hpk_kon_anfrage {
  background: none; 
  width: 98%; 
  height: 150px;
}

label,
label.label_name, 
label.label_vname, 
label.label_str, 
label.label_plz_ort, 
label.label_tel, 
label.label_fax, 
label.label_email,
label.label_mobil {
  display: block; 
  width: 100%; 
  float: left;
}

input.hpk_kon_name, 
.hpk_kon_vname, 
.hpk_kon_str, 
input.hpk_kon_plz, 
.hpk_kon_ort, 
.hpk_kon_tel, 
.hpk_kon_fax, 
.hpk_kon_email {
	width: 100%;
	border: 0;
	background: #ececec;
	margin: 0 0 0.75em 0;
	box-shadow: none;
}

span.hpk_kon_info {
  padding-top: 2%; 
  padding-bottom: 2%; 
  display: block;
}

.hpk_kon_container input.hpk_kon_plz {
	width: 30%;
}

.hpk_kon_container input.hpk_kon_ort {
	width: 70%;
}

input#akz_ds {
	width: 13px;
	float:left;
	margin-top:3px;
}

div.datenschutztext {
	float:none;
	margin-left: 18px;
}

.tx-powermail h3 {
  display: none;
}

.tx-powermail ul.parsley-errors-list {
  margin-left: 0;
}

.tx-powermail ul.parsley-errors-list li {
  color: red;
  list-style-type: none;
}

.powermail_all dt.powermail_all_label,
.powermail_all dd.powermail_all_value {
  float: left;
  width: 45%;
}

.powermail_all dt.powermail_all_label {
  font-weight: bold;
}

.hpk_kon_container {
	clear: both;
}

.tx-powermail .powermail_captchaimage {
	width: 70% !important;
    padding-left: 29%;
    padding-top: 1%;
}

/*---------------------------------- LANDINGPAGE ------------------------------------*/

.landingpage {
	font-size: 1em;
}

.landingpage h2 {
	font-size: 2.2em;
	font-weight: 700;
}

.landingpage h3 {
	font-size: 2em;
	margin-bottom: 0.5em;
	font-weight: 700;
}

.landingpage h4,
.landingpage h5 {
	font-size: 1.5em;
	margin-bottom: 0.5em;
	font-weight: 700;
}

.landingpage h5 {
	font-weight: 500;
}

.landingpage #sidebar {
	display:none;
}

.landingpage #inhalt {
	width:100%;

	background-color:rgb(var(--whiteColor));
	padding:0 2.5em;

	display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-content: flex-start;
  align-items: flex-start;
  justify-content: center;

  gap:2em 0;
  position: relative;
}

.landingpage #inhalt .align-center {
	text-align: center;
}

.landingpage #inhalt .box {
	min-height: 70px;
}

.landingpage #inhalt .frame-type-image .box {
	padding-bottom: 0;
}

.landingpage #inhalt .frame-layout-40 .bg-light h4 {
	color:rgb(var(--offBlackColor));
}

.landingpage #inhalt .frame-layout-41 {
	max-width:calc(50% - 2.5em);
	margin-left:2em;
}

.landingpage #inhalt .frame-layout-43 {
	max-width:calc(66.66666667% - 2.5em);
	margin-left:2em;
}

.landingpage #inhalt .frame-layout-18,
.landingpage #inhalt .frame-layout-44 {
	max-width:calc(66.66666667% - 2.5em);
	margin-right:2em;
}

.landingpage #inhalt .frame-layout-46 {
	width: calc(88% / 3);
	margin: 2em 2% 0 2%;
}

.landingpage #inhalt .frame-layout-41:nth-child(odd) {
	max-width:50%;
	margin:0;
}

.landingpage #inhalt .frame-layout-18 .box,
.landingpage #inhalt .frame-layout-41 .box,
.landingpage #inhalt .frame-layout-42 .box,
.landingpage #inhalt .frame-layout-43 .box,
.landingpage #inhalt .frame-layout-44 .box,
.landingpage #inhalt .frame-layout-45 .box,
.landingpage #inhalt .frame-layout-46 .box {
	background-color:transparent;
	box-shadow:none;
}

.landingpage #inhalt .frame-layout-18 header *,
.landingpage #inhalt .frame-layout-18 .ce-textpic,
.landingpage #inhalt .frame-layout-41 header *,
.landingpage #inhalt .frame-layout-41 .ce-textpic,
.landingpage #inhalt .frame-layout-43 header *,
.landingpage #inhalt .frame-layout-43 .ce-textpic,
.landingpage #inhalt .frame-layout-44 header *,
.landingpage #inhalt .frame-layout-44 .ce-textpic
 {
	padding:0;
}

.landingpage #inhalt .frame-layout-43 .box p {
	width:100%;
}

.landingpage #inhalt .frame-layout-18 header:before,
.landingpage #inhalt .frame-layout-40 header:before,
.landingpage #inhalt .frame-layout-41 header:before,
.landingpage #inhalt .frame-layout-43 header:before,
.landingpage #inhalt .frame-layout-44 header:before,
.landingpage #inhalt .frame-layout-46 header:before {
	display:none;
}

.landingpage #inhalt .frame-layout-40 .box {
	background-color:transparent;
	box-shadow:none;
}

.landingpage .bg-light {
	margin-bottom: 2.5em;
}

.landingpage #inhalt figure img[src*=".svg"] {
	max-width: 6em;
}

.landingpage #inhalt figure {
	margin:0;
}

.landingpage #inhalt .img-fluid {
	margin: 1em 0;
}

.landingpage .vergleichstabelleInactiveButton {
	background-color: transparent;
}

.landingpage .ctaButton {
  background-color: rgb(var(--mainColor));
  border: 1px solid rgb(var(--mainColor));
  color: rgb(var(--whiteColor));
  padding: 0.5em 1.75em;
  font-size: 1.45em;
  cursor: pointer;
  margin: 1em 0;
  font-weight: 500;
  display: inline-block;
}

.landingpage .ctaCenterWrapper {
	text-align: center;
}

#emastersConfiguratorButton {
	display: none;
}

.landingpage #emastersConfiguratorButton {
	border-radius: unset;
	/*display: block;*/
}

.landingpage #inhalt .frame-type-html .box {
	background-color:transparent;
	box-shadow: none;
}

.landingpage .ce-headline-center {
	text-align:center;
}

.landingpage .frame-type-text.frame-layout-40 header::before {
	display:none;
}

.landingpage #titelueberschrift {
	background: rgb(var(--whiteColor));
  position: absolute;
  left: 1.2em;
  top: -60px;
  text-shadow: none;
  color: rgb(var(--mainColor));
  padding: 20px;
  width: auto;
  font-size: 2em;
}

.landingpage #inhalt ul,
.landingpage #inhalt li {
	list-style:none;
	padding-left: 0;
}

.landingpage #inhalt li {
	line-height:1.5em;
}

.landingpage #inhalt .ce-textpic.ce-right {
	display:flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content:space-between;
	align-items: flex-start;
	gap:2em;
	padding:1em 1.75em;
}

.landingpage #inhalt .ce-textpic.ce-right .ce-gallery {
	order:2;
}

.landingpage #inhalt .ce-textpic.ce-right .ce-bodytext {
	order:1;
}

.landingpage #inhalt .ce-textpic.ce-left {
	display:flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content:space-between;
	align-items: flex-start;
	padding:1em 1.75em;
}

.landingpage #inhalt .frame-layout-40 .ce-textpic.ce-left {
	justify-content:flex-start;
}

.landingpage #inhalt .ce-textpic.ce-left .ce-gallery {
	order:1;
	width:10em;
}

.landingpage #inhalt .ce-textpic.ce-left .ce-bodytext {
	order:2;
	/*width:calc(100% - 10em);*/
}

.landingpage #inhalt ul li:before {
	color: rgb(var(--mainColor));
	content: "\f058";
	font-family: "FontAwesome";
	padding-right:0.75em;


  position: absolute;
  left: 0;
  line-height: 1;
  top: 0.2em;
}

.landingpage #inhalt ul li {
	position: relative;
  padding: 0 0 0.75em 2.0em;
}

.landingpage #inhalt hr {
	display: none;
}

.landingpage #inhalt .bewertungen-boxquer-item {
	float:left;
	width: calc(88% / 3);
  margin: 2em 2% 0 2%;
}

.landingpage #inhalt .bewertungen.bewertungen-boxquer-item p {
  margin:0;
}

.landingpage #inhalt .bewertungen.bewertungen-boxquer-item p:first-child {
  font-size: 1.2em;
  font-weight: 500;
}

.landingpage #inhalt .bewertungen.bewertungen-boxquer-item h3 {
  font-size: 1.5em;
  margin-bottom: 0.5em;
}

.landingpage #inhalt .bewertungen.bewertungen-boxquer-item .bewertungen-cont-querbottom {
	margin-bottom:2em;
}

/*.landingpage #inhalt .accordion_element {
	margin-bottom:1em;
}

.landingpage #inhalt .accordion_element .accordion_header {
	background-color: rgb(var(--primaryColor));
	color:rgb(var(--invertedTextColor));
	padding: 0.75em 1em;
	cursor:pointer;
	border-radius: 0.25em;
}

.landingpage #inhalt .accordion_element .accordion_header a {
	color:rgb(var(--invertedTextColor));
	text-decoration: none;
}*/

.landingpage .configuratorPageFormularWrapper {
	height: calc(100% - 5em);
}


@media only screen and (max-width: 767px) {
  .landingpage {
  	font-size:1.1em;
  }

  .landingpage #inhalt .ce-textpic.ce-right {
  	flex-direction: column;
  	justify-content: center;
  	align-items: center;
  }

  .landingpage #inhalt .ce-textpic.ce-right .ce-gallery {
  	order: 1;
  }

  .landingpage #inhalt .ce-textpic.ce-right .ce-bodytext {
	  max-width: 100%;
  	order: 2;
  }

  .landingpage #inhalt .frame-layout-18,
  .landingpage #inhalt .frame-layout-41,
  .landingpage #inhalt .frame-layout-42,
  .landingpage #inhalt .frame-layout-43,
  .landingpage #inhalt .frame-layout-44,
	.landingpage #inhalt .frame-layout-46  {
  	margin:0;
  	max-width: 100%;
  	width:100%;
  }

  .landingpage #inhalt .box {
		min-height: 30px;
	}

	.landingpage #inhalt .frame-layout-41 .box {
		padding-bottom:0;
	}

	.landingpage #inhalt .bewertungen-boxquer-item {
		width:100%;
		margin:2em 0 0 0;
	}

	.landingpage #inhalt .frame-layout-41:nth-child(odd) {
		max-width:100%;
		margin:0;
	}
	
	.landingpage h2 {
		hyphens: auto;
	}
	
	.landingpage #inhalt .ce-textpic.ce-left,
	.landingpage #inhalt .frame-layout-40 .ce-textpic.ce-right	{
		padding: 0;
	}
}

@media only screen and (max-width: 639px) {
  .landingpage #inhalt .ce-textpic.ce-left .ce-gallery {
  	width:35%;
  }

  .landingpage #inhalt .ce-textpic.ce-left .ce-bodytext {
  	width:65%;
  }

  .landingpage #inhalt .frame-layout-43 .ce-textpic.ce-left .ce-bodytext {
  	width:100%;
  }
}

@media only screen and (max-width: 479px) {
	.landingpage #inhalt {
		padding:0 1.5em;
	}

  .landingpage .slider {
  	height:15.7em;

  	overflow: hidden;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
  }

  .landingpage .slider img {
  	height:100%!important;
  	width: auto!important;
  	max-width: unset;
  }
  
  .landingpage #titelueberschrift {
	  left: 0.75em;
  }

  .landingpage #inhalt .frame-layout-41.frame-type-textpic .ce-textpic.ce-left,
  .landingpage #inhalt .frame-layout-40.frame-type-textpic .bg-light .ce-textpic.ce-left {
  	flex-direction: column;
  	align-items: center;
  	gap:2em;
  	text-align: center;
  	padding: 1em 0;
  }

  .landingpage #inhalt .frame-layout-41.frame-type-textpic .ce-textpic.ce-left .ce-gallery img,
  .landingpage #inhalt .frame-layout-40.frame-type-textpic .bg-light .ce-textpic.ce-left .ce-gallery img {
  	margin: 0;
	  display: inline;
	  float: none !important;
  }

  .landingpage #inhalt .frame-layout-41.frame-type-textpic .ce-textpic.ce-left .ce-bodytext,
  .landingpage #inhalt .frame-layout-40.frame-type-textpic .bg-light .ce-textpic.ce-left .ce-bodytext {
  	width:100%;
  }
  
  .landingpage .configuratorPageHeadbar {
	  height: 160px;
  }
  
  .landingpage .configuratorPageFormularWrapper {
	  height: calc(100% - 160px);
  }
}


@media only screen and (min-width: 768px) {
  .landingpage .col-md-8 {
  	width:calc(66.66666667% - 2.5em);
  }

  .landingpage .col-md-4 {
  	width:calc(33.333% - 0.5em);
  }
}

/* ============= *
 * Media-queries *
 * ============= */

@media only screen and (min-width: 410px) {
	
	#suche {
		right: 130px;
	}
}


@media only screen and (min-width: 576px) {
	
/* 	.frame-layout-1, 
	.frame-layout-2,
	.frame-layout-3 {
		height: 160px;
	} nötig? */
	
	.frame-layout-0 img:not(.news-single-img img, .news-list-content img),
	.frame-layout-9 img {
		width: auto; /*nicht 50% bei layout-0, da die Bilder zu breit werden und die Backend-Breite überschreiben*/
	}

	.frame-layout-0 img.float-end {
		padding-left: 2%;
	}

	.frame-layout-0 img.float-start {
		padding-right: 2%;
	}
		
	#ajaxcontainer .box.layout-6 img{
		width: 100%;
	}
	
	#tx_indexedsearch label{
		width: 25%; 
	}

	#tx_indexedsearch select{
		width: 37%; 
	}
	
	select#tx-indexedsearch-selectbox-desc {
		width: 37%;
		margin-left: 5px;
	}
	
	.news-single-img {
		margin: 10px 0 10px 10px;
		width: 47%;
	}
}

@media only screen and (min-width: 641px) {
	header .li_act > ul {
		display: block;
		visibility: visible;
	}
}

@media only screen and (min-width: 768px) {

	#inhalt h1 {
		font-size: 250%;
	}
	
	h2 {
		font-size: 150%;
	}
	
	.IM.ID-4.inhalt.box h2 {
		font-size: 130%;
	}
	
	#logo {
		display: none;
	}
	
	#logo {
		margin-top: 57px;
		padding: 15px;
		/* max-width: 240px; doof bei Tegeler&Schlachter*/
		position: relative;
		left: 50%;
		transform: translateX(-50%);
	}
	
	#logo_menu {
		position: absolute;
		box-shadow: -3px -2px 5px rgba(175, 175, 255, 0.2), 3px -2px 5px rgba(175, 175, 175, 0.2);
		width: 35%; 
		padding: 3% 2% 5% 2%; 
		border-bottom: 0;
		margin-left: 3%;
		z-index: 100;
	}
	
	#navbarNav #logo {
		display: block;
		margin-top: 0;
		z-index: 1;
		width: 100%;
		left: 50%;
		transform: translateX(-50%);
	}  
	
	#navbarNav li {
		padding-bottom: 3%;
	}
	
	#logo2img {
		width: 164px;
	}
	
	nav .navbar-nav {
		position: relative;
		top: 0;
		left: 0;
		padding: 20px 0 0 0;
		margin: 0;
	}
	
	.navbar-light .navbar-nav a.nav-link, 
	.navbar #kopfmenue_div a {
		padding: 0;
		display: inline-block;
	}
	
	.nav-item.ebene1 > a, 
	#kopfmenue a {
		margin: 0;
	}
	
	.navbar-nav .ebene1,
	#kopfmenue li	{
		padding: 3% 0;
	}
	
	ul.navbar-nav ul.ebene2,
	ul.navbar-nav div.ebene2	{
		list-style-type: square;
		color: rgb(var(--mainColor));
	}
	
	ul.navbar-nav ul.ebene2 li::marker,
	ul.navbar-nav div.ebene2 li::marker	{
		padding-bottom: 10px;
		color: rgb(var(--lightGreyColor));
	}
	
	li.ebene2:not(:last-child),
	li.ebene3:not(:last-child)	{
		border: none;
	}
	
	.ebene2 .ebene2 a.nav-link {
		padding: 0;
		margin: 0;
	}
	
	.dropdown-menu {
		border: none;
		font-size: 13px;
		padding: 3% 0 0 15px;
	}
	
	li.dropdown .dropdown-toggle::after {
		content: ""!important;
	}
	
	.navbar-expand-md .navbar-nav .dropdown-menu {
		position: static;
	}
	
	#kopfmenue_div,
	.inhalt_menu,
	#navbarNav	{
		display: block!important;
	}
	
	#suche {
		right: 190px;
		width: 235px;
		position: absolute;
		top: 30px;
		z-index: 100;
	}
	
	#suche .boxsuche_input {
		height: 55px;
		width: 230px;
		border: 1px solid rgb(var(--lightGreyColor));
		color: rgb(var(--lightGreyColor));
	}
	
	#suche .boxsuche_submit {
		position: absolute;
		top: 19px;
		right: 20px;
	}
	
	select#tx-indexedsearch-selectbox-desc {
		width: 36%;
		margin-left: -5px;
	}
	
	#logo2 {
		max-width: 150px;
		top: 30px;
		right: 30px;
		position: absolute;
		z-index: 100;
	}
	
	#logo2img {
		background-color: white;
		padding: 15px;
	}
	
	#inhalt {
		padding-left: 45%;
		display: flex;
		flex-flow: row wrap;
		align-items: stretch;
		justify-content: center;
	}
	
/* 	.frame-layout-1, 
	.frame-layout-2,
	.frame-layout-3	{
		height: 210px;
	} stört auf Startseite*/
	
	.frame-layout-1, 
	.frame-layout-2,
	.frame-layout-3,
	.frame-layout-7,
	.layout-7,
	.frame-layout-8 {
		width: 100%; /*100% für Startseite, width um bootstrap zu überschreiben bei col-md-4*/
		display: flex;
		margin-bottom: 0;
	}
		
	.frame-layout-6	{
		margin-right: 1%;
	}
	
	.frame-layout-14.col-md-6 {
		margin-right: 1%;
		flex: 49%;
	}
	
	.newstitlesingle {
		font-size: 110%;
		text-align: left;
	}
	
	#tx_indexedsearch .tx-indexedsearch-search-submit input {
		width: 100%;
	}
	
	#tx_indexedsearch .tx-indexedsearch-form input {
		width: 74.5%;
		border: 0;
		background: #e9e9ed;
	}
	
	footer {
		font-size: 11px;
	}
	
	footer .navbar-nav {
		display: none!important;
	}
	
	footer .row:first-child {
		left: 52%;
	}
	
	footer .row:last-child {
		left: 31px;
	}
	
	footer ul.zentralfussmenu li.ebene2 {
		border: none;
	}
		
	footer .tx-hpkfe-pi-adresse {
		width: 40%;
		text-align: left;
		padding: 0;
	}
	
	footer .hpk_adr_firma {
		font-size: 157%;
	}
	
	footer span.hpk_adr_strasse, 
	footer .hpk_adr_plzort, 
	footer .hpk_adr_tel, 
	footer .hpk_adr_fax, 
	footer .hpk_adr_mail, 
	footer .hpk_adr_land, 
	footer .hpk_adr_mobil {
		font-size: 15px;
	}
	
	#fussmenue {
		display: block;
		text-align: left;
		width: 15%;
		right: 0;
		position: absolute;
	}
	
	ul#fussmenue li,
	ul.zentralfussmenu {
		list-style-type: none;
		text-align: left;
		padding-bottom: 10px;
	}
	
	ul#fussmenue li {
		padding-left: 18px;
	}
	
	ul#fussmenue li {
		background: url("img/fusspfeil-weiss.png") 0 2px no-repeat;
	}
	
	ul#fussmenue li:hover {
		background: url("img/fusspfeil-schwarz.png") 0 2px no-repeat;
	}
	
/* 	#fussmenue li a { Wofür brauchen wir das?
		padding-left: 20px;
		background: url("img/typ3-color10.png") no-repeat scroll 0px 6px transparent;
	} */
	
 	#socialshareprivacy {
		bottom: -147px;
	} 
}

@media only screen and (min-width: 900px) {
	
	#inhalt h1 {
		font-size: 300%;
	}
	
	header h2,
	.frame-layout-6 h2 {
		font-size: 170%;
		line-height: 1.2em;
	}
	
	#ajaxcontainer h2	{
		font-size: 160%;
	}
	
	.flex-control-nav {
		padding: 0 3% 0 2%;
	}
	
	.frame-layout-1, 
	.frame-layout-3,
	.frame-layout-7,
	.layout-7 {
		margin-right: 1%;
	}
	
	.frame-layout-1, 
	.frame-layout-2,
	.frame-layout-3 {
		min-height: 260px;
		flex: 49%
	}
	
	.frame-layout-7:not(.inhalt_menu .frame-layout-7),
	.layout-7,
	.frame-layout-8,
	.frame-layout-9.col-md-6,
	.frame-layout-10.col-md-6 {
		flex: 49.5%;
	}
	
	.frame-layout-9.col-md-6 {
		float: left;
		margin-right: 1%;
	}
	
	.frame-layout-10.col-md-6 {
		float: right;
	}
	
	footer .tx-hpkfe-pi-adresse {
		width: 43%;
		padding: 0;
	}
	
/* 	#umschlag .zentralfussmenu {
		display: block;
		width: 20%;
	} */
		
	div.news-list-item  {
		flex: 0 0 49%;
		max-width: 49%;
	}
	
	.cookie-element {
		display: inline-block;
		padding-right: 1em;
		text-align: right;
		vertical-align: top;
		width: 15%;
	}
	
	.cookie-note {
		display: inline-block;
		width: 84%;
	}
	
	ul ul .cookie-element {
		text-align: right;
	}
	
	.dismiss-cookies {
		margin: 1em 0;
	}	
		
	.cookie-button {
		flex: 0 0 30%;
		max-width: 30%;
	} 
}

@media only screen and (min-width: 980px) {
	
	#inhalt .tx-hpkfe-pi-partner .partner {
		flex: 0 0 33%;
	}
}

@media only screen and (min-width: 1080px) {
	
	#logo_menu {
		width: 30%;
	}
	
	#inhalt {
		padding-left: 37%;
	}
	
	.cookie-content {
		width: 75%;
	}	

	.carousel-caption {
		right: 20%;
		left: 37%;
	}
		
	#headercarousel p {
		font-size: 94%;
	}
	
	#headercarousel h5 {
		font-size: 131%;
	}
	
	.frame-layout-16,
	.frame-layout-17 {
		width: 49.5%;
	}
	
	.frame-layout-16 {
		margin-right: 1%;
	}
		
	.frame-layout-7,
	.layout-7,
	.frame-layout-8 {
		min-height: 300px;
		height: auto;
	}
	
	#ajaxcontainer .box.layout-6 {
		width: 50%;
	}
	
	#ajaxcontainer .layout-6:nth-child(2n) {
		float: left;
		margin-right: 1%;
		width:49%;
	}
	
	footer .tx-hpkfe-pi-adresse {
		width: 33%;
		padding: 0;
	}
		
	.zentralfussmenu {
		display: block;
		width: 16%;
	}
	
	.zentralfussmenu.erstes,
	.zentralfussmenu.erstes + .zentralfussmenu	{
		width: 11%;
	}
	
	#fussmenue {
		width: 14%;
	}
}

@media only screen and (min-width: 1300px) {
		
	#inhalt {
		padding-left: 32%;
		padding-right: 5%;
	}
	
	#suchzeile {
		right: 4%;
	}
	
	h2 {
		font-size: 150%;
	}

	.carousel-caption {
		right: 40%;
		left: 32%;
	}
	
	#headercarousel p {
		font-size: 100%;
	}
	
	#headercarousel h5 {
		font-size: 140%;
	}
	
	#logo_menu {
		width: 25%;
		margin-left: 3%;
	}
	
	.box.frame-frame-layout-0 > .tx-hpkfe-pi-gmap {
		display: flex;
		flex-flow: row wrap;
		justify-content: space-between;
	}
	
	.flex-control-nav {
		padding: 0 4% 0 2%;
	}
		
	.frame-layout-1, 
	.frame-layout-2,
	.frame-layout-3,
	.frame-layout-7:not(.inhalt_menu .frame-layout-7),
	.layout-7 {
		flex: 32.5%;
		min-height: 240px;
	}
	
	.frame-layout-2 {
		margin-right: 1%;
	}

 	.frame-layout-3 {
		margin-right: 0;
	} /*nicht gut auf Startseite?*/
	
	.frame-layout-6 {
		flex: 32.3%;
	}
	
	.frame-layout-8 {
		width: 66.5%;
		margin-right: 0;
	}
	
	.tx-hpkfe-pi-gmap .hpk_con_form,
	div#hpk_con_map {
		box-sizing: border-box;
		flex: 0 0 49%;
		max-width: 49%;
	}
	
	#inhalt .tx-hpkfe-pi-partner .partner {
		flex: 0 0 25%;
	}
	
	#hpk_routenbeschreibung {
		flex: 0 0 100%;
		max-width: 100%;
	}
		
	.tx-hpkfe-pi-gmap .hpk_con_form {
		padding: 2em;
		margin: 0;
	}	
	
	.tx-hpkfe-pi-gmap .hpk_con_form {
		background: rgb(var(--lightGreyColor));
	} 
	
	table tr:nth-child(even) {
		background: rgb(var(--lightGreyColor));
	}
		
	.newstitlesingle {
		font-size: 135%;
	}
	
	footer {
		display: flex;
		flex-flow: row wrap;
		justify-content: space-between;
		margin-right: 2%;
	}
		
/* 	#umschlag footer {
		padding-left: 31.5%;
		padding-right: 7%;
	} */
		
	footer .tx-hpkfe-pi-adresse {
		width: 31%;
	}
	
	footer .hpk_adr_firma {
		font-size: 167%;
	}
	
	footer span.hpk_adr_strasse, 
	footer .hpk_adr_plzort, 
	footer .hpk_adr_tel, 
	footer .hpk_adr_fax, 
	footer .hpk_adr_mail, 
	footer .hpk_adr_land, 
	footer .hpk_adr_mobil {
		font-size: 16px;
	}
		
	#fussmenue {
		width: 15%;
	}
	
	#socialshareprivacy {
	    width: 100%;
	}
	
	#socialshareprivacy .social_share_privacy_area {
		justify-content: flex-end;
	}
}

@media only screen and (min-width: 1600px) {
	
	#inhalt h1 {
		font-size: 350%;
	}
	
	h2 {
		font-size: 170%;
		margin-bottom: 0.75em;
	}
	
	.frame-layout-8 .ce-right .ce-gallery {
		width: 50%;
		float: right;
	}
	
	#inhalt .tx-hpkfe-pi-partner .partner {
		flex: 0 0 20%;
	}
	
	div.news-list-item  {
		flex: 0 0 32%;
		max-width: 32%;
	}
		
	footer .tx-hpkfe-pi-adresse {
		width: 28%;
	}
	
	.cookie-content {
		width: 65%;
	}
}

@media only screen and (min-width: 1800px) {
	
	#logo_menu {
		width: 23%;
	}
	
	#inhalt {
		padding-right: 7%;
	}
	
	h2 {
		font-size: 175%;
		margin-bottom: 0.75em;
	}
	
	footer .row:first-child {
		left: 66%;
		width: 66%;
	}

	.cookie-content {
		width: 55%;
	}
	
}