XXdiv {border: 0px solid black;}
XXtd, li {border: 0px dotted red;}
ul {border: 0px solid green;}

html {height: 100%;}
body { 	
	background: #fff;
	/*background: #fff url(img/bodybg.png) repeat-x 0 0;*/
	margin: 0; padding: 0;
	height:100%;
	width:100%;
}

/* Popup */
#overlay {
	position: fixed; top: 0;	bottom: 0;  left: 0;  right: 0;
	z-index: 9999;	
	width: 100%; height: 2000px;  
	transition: opacity 200ms;
  visibility: none;
  background: rgba(0,0,0,0.5);
  /* background: rgba(255,255,255,0.5); */
}
.infobox-container {
	position: fixed; top: 30px; 
  z-index: 9999;  
  width: 100%;   
}
.infobox-long {
	display: block;
	position: relative;
  overflow-x: hidden; overflow-y: scroll;
  margin: 0 auto;
  width: 92%; max-width: 1000px; 
  height: 70%; max-height: 70vh;
  padding: 50px 4%;
  text-align: center;
  background: #fff;
}

.infobox-long h2 {margin: 80px 0 5px 0; font-size: 30px; color: #272a29; font-weight: 700;}
.infobox-long h3 {margin: 0px 0 20px 0;  font-size: 24px; color: #272a29; font-weight: 400; line-height: 24px;}
.infobox-long p {font-size: 17px;}

.header-outer {display: inline-block; width: 100%; background-color: #e5a100;}
.header-wrapper {display: block; margin: 0 auto; width: 100%; max-width: 1280px; height: 40px;}
.headerbox {text-align: right; width: 100%; max-width: 1280px; padding: 0px 0% 0px 0%;}
.headerbox p, .headerbox a {margin-top: 10px; font-size: 24px; color: #fff; /*color: #272a29;*/ font-weight: 500;}

#topmenubox.page-id-1 .logo.mobile-only img {display: none;}
	
#topspacerbox {position: fixed; top: 0; left: 0; z-index: -1; width: 100%; margin: 0 auto; margin-top: 250px;  padding: 0; transition: 0.5s all;}	
.wrapper-content.page-id-1 #topspacerbox {margin-top: 250px;}

.topspacer {width: 100%; max-width: 1280px; margin: 0 auto;}
/*#topspacerbox {width: 100%; margin: 0 auto; margin-top: 0px; padding: 0;}	*/
/*.topspacer {display: none;} */
/*.topspacer img {padding-top: 120px !important; display: block; height: auto !important; max-width: 100%; width: auto !important;}*/	

/* Navigation oben-rechts */
#nav-right {position: absolute; top: 30px; right: 0%; text-align: right; margin: 0; padding:0; }
/*#topmenubox.page-id-1 #nav-right {position: absolute; top: 70px; right: 0%;}*/
#nav-right a, #nav-right {color: #555354; font-size: 14px; line-height: 20px;}
#nav-right a:hover, 
#nav-right a.active {color: #79295b;}
#nav-right li {list-style: none; margin: 0; padding: 0; line-height: 20px;}

.pic {display: none;}
.slider-wrapper.page-id-2 {display: block;}


/* Mini Slider */
#slideshow {
  /*margin: 80px auto;*/
  position: relative;
  width: 100%;
  height: auto;
  padding-top: 0px;
  /*box-shadow: 0 0 20px rgba(0, 0, 0, 0.4);*/
}
#slideshow > div {
  position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px;
}



/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	Layout Blocks
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
.outer {width: 100%;  /* margin: 0 auto 0 auto;*/ background-color: transparent;}

.wrapper {width: 100%; max-width: 1280px; margin: 0 auto; padding: 0; position: relative;}
.wrapper-content {width: 100%; max-width: 1280px; margin: 0 auto; margin-top: 250px; padding: 0; position: relative;}
.wrapper-content.page-id-1 {margin-top: 400px;}

.infobox-long img, #slider img, .headerbox img, .button-box a img, .topspacer img, img.spacer-img, img.bg_content, .header img, img.logo, .gallery-box a img, #button-kontakt img, .content img, img.img-start, .aktuell-content img, .logo.mobile-only img {
	margin: 0px; padding: 0; display: block; height: auto !important; max-width: 100%; width: auto !important; /*max-height: 880px;*/}
img.bg_content {padding-top: 35px;}
.topspacer img {margin-top: -10px;}


.topheader {position:relative;  padding-bottom: 12%; width:100%; background: #fff url(img/header.jpg) no-repeat fixed center top; background-size: 100% auto, auto;}
.topheader p {bottom:10%; width:90%; position:absolute; text-align: center; padding: 0 5%; font-size:1.6em; line-height:110%; color:#fff; text-shadow: 0px 2px 30px #000; }

#static_headerbox {width:100%; height: 550px; overflow: hidden; background-repeat: no-repeat; background-position: center center; background-size: cover;}

/*frontpage*/
#topparallax {width:100%; position:relative; padding-top:40%; background: #fff url(img/parallaxheader.jpg) no-repeat; background-position: center 0; background-size: 100% auto, auto;}
.ptext {bottom:20%; width:90%; position:absolute; text-align: center; padding: 3% 5%; background: rgba(0,0,0,0.1); border-top: 1px solid #fff; border-bottom: 1px solid #fff;  }
.ptext * {text-shadow: 0px 2px 30px #000;  color: #fff ! important;}
#topparallax a.topdown img {width:100px; margin-top: 20px}


/* Button-Boxen */
.button-box-outer {display: inline-block; width: 100%; margin: 0; padding: 100px 0 70px 0;}
.button-box-wrapper {margin: 0 auto; width: 85%; margin-bottom: 50px;}

.button-box {float: left; width: 21.7%; margin: 0 0 0 0; padding: 0 1.5% 0 1.5%; }
.button-box a img {border: none !important;}
.button-box a:hover {opacity:0.6;}
/*
.button-box-outer { margin-left: 10%; width: 90%}
.button-box-wrapper {float: left; width: 92%; margin-bottom: 50px;}
table.box-table {border-spacing: 40px; border-collapse: separate;}
td.button-box {width: 220px; height: 220px; margin: 0 2% 0 2%; vertical-align: middle; text-align: center;}
.button-box.one   {background: #79295b;}
.button-box.two   {background: #ae4f8f;}
.button-box.three {background: #e5a100;}
.button-box.four  {background: #bcbeba;}
.button-box a {color: #fff;}
.button-box.four a {color: #272a29;}
.button-box a:hover {opacity:0.6;}
*/




/*=== Contentbereich */
.container {/*margin: 0 auto 0 auto;*/ width: 100%; padding-top: 0px;}


/*====================================================
Alles rechts neben left
ab hier: 1/3 grid
*/
.contentbox {/*min-height: 1000px;*/ width: 92%; background: #fff; margin-top: 0px; padding: 30px 4% 70px 4%;}
.contentbox.page-id-1 {min-height: auto;}
.contentbox.page-id-3, .contentbox.page-id-6 {width: 100%; padding: 30px 0% 50px 0%;}
.contentbox.relative {position: relative;}

.content, .top_content {display:inline-block; padding-right: 0%; margin-left: 0; }
.content.narrow {width: 28%; margin-top: 90px; padding-right: 0%; }
.content.contentnarrow {float: left; width: 60%;}
.contentbox.page-id-1 .content.contentnarrow {width: 60%;}
.contentbox.page-id-2 .content {display: inline-block;}
.contentbox.page-id-3 .content {display: inline; padding-bottom: 50px;}
.contentbox.page-id-5 h3 {margin: 30px 0 30px 0; font-weight: 700; color: #79295b;}

.top_content {display:block; margin-top: 0; /*color: #fff;*/}
.top_content.ref h2 {margin-top: 0; padding-top: 20px; /*color: #fff;*/}
.top_content.kunden h2 {margin: 0 0 20px 0; padding-top: 50px; }
._top_content p {margin: 0;}

.content.desktop, .gallery-text-box.desktop, span.desktop {display: block;}
 
.slogan {text-align: center; padding-top: 20px; color: #79295b; font-weight: bold;}



.content.contentwide  {width:100%; margin:0 0 0 0; }
.contentwide.center {text-align: center;}

.two-column {column-count: 2; column-gap: 50px;}

.content.narrow img { max-width:100%; height:auto ! important;}


/* Leistungen */
.leistungsbox-wrapper {display: inline-block; width: 100%; padding-top: 50px;}
.leistungsbox-wrapper .spacer {clear: both; width: 100%; height: 1px; }
.leistungsbox {float: left; position: relative; display: block; position: relative; width: 29.75%; min-height: 230px;  margin: 0 5.0% 0 0; padding: 10px 0 10px 0; text-align: center; font-size: 19px;}
.leistungsbox.last-box, .team-box.last-box, .team-box.page-id-4.last-box {margin: 0 0 0 0;}
.leistungsbox-label {width: 100%; height: 25px; padding: 7px 0% 2px 0%; color: #f89d00; font-size: 21px; line-height: 25px; font-weight: 500;}
.leistungsbox-short p {display: inline;} 
.leistungsbox-full {position: relative;  padding: 0 0 30px 0;}

.contentbox.page-id-2 .arrow {width: 100%; padding: 5px 0; text-align: center;}
.contentbox.page-id-5 .arrow {position: absolute; bottom: 0px; right: 20px;}
a.more, .arrow a {font-weight: 500;}

.leistungsbox img {margin: 0 auto; padding: 0 0 10px 0; height: auto !important; max-width: 100%; width: auto !important;}	
.leistungsbox .title {padding: 10px 0 0 0; font-weight: 500;}
.leistungsbox p {margin: 0;}
.leistungsbox p.lineheight {line-height: 50px;}
.leistungsbox #post25 li {list-style: none;}
.leistungsbox ul {margin-top: 0; margin-bottom: 0; margin-left: 0; padding-left: 0;}
.leistungsbox li {padding: 3px 0;}
.leistungsbox  br {line-height: 150%;}
.leistungsbox span.list-style {font-size: 30px;}
/*
.leistungsbox p strong {line-height: 35px;}
.leistungsbox #down25, .leistungsbox #post25 {padding: 8px 0;}
*/
.abrev {text-align: center;}
.abrev p {margin: 5px 0; font-size: 16px; font-style: italic;}

/* =========================== Teambox =============================== */
.teambox-wrapper.page-id-4 {
	padding-top: 80px;
}
.team-box {
  float: left;
  width: 30.5%;
  min-width: 165px; XXmin-height: 450px;
  margin: 0px 4.0% 80px 0%; padding: 0px;
}
.team-box.page-id-4 {
  width: 30.4%;
  margin: 0px 4.0% 80px 0%; padding: 0px;
}

.team-box img {
	display: block;
	width: auto !important; max-width: 100%; 
	height: auto !important; max-height: 600px; 
	margin: 0px; padding: 0;
}
.team-box .mobile-content {display: none;}


/* hover mit Text */
.imageWrapper {
  position: relative;
  width: 100%;
  height: auto;
}
.imageWrapper img {
  display: block;
}
.imageWrapper .hoverLink {
  opacity: 0;
  position: absolute;top: 0;left: 0;  
  -webkit-backface-visibility:hidden;
  backface-visibility: hidden;
  
  XXbackground: #000000;
  text-align: center;
  -webkit-transition: opacity 500ms;
  -moz-transition: opacity 500ms;
  -o-transition: opacity 500ms;
  transition: opacity 500ms;    
}
.imageWrapper:hover .hoverLink {
  opacity: 0.9;
}
.imageWrapper .back-content {
	position: absolute; top: 50%; left: 0%; 
	transform: translateY(-50%);
	text-align: center; 
  width: 100%; XXheight: 100%;   
}
.imageWrapper .hoverLink,
.imageWrapper .back-content h2 {color: #000;}
.imageWrapper .back-content h4 {color: #79295b;}
/* ====================================================================== */



img.news_post_image {float: right; padding-left: 20px;}

.post_short_img img{max-width: 300px;}
.post_short {padding: 20px;}
.news-more {padding: 0 0 12px 0; text-align: right; }
.news-more a {font-size: 15px; color: #2a6065;}	

a.section_anchor {}


/* Infos */
.yellow-box {padding: 20px 3%; font-size: 22px; background: #e5a100;}
.contentbox.page-id-5 .yellow-box h3 {margin-top: 10px; font-weight: 500; color: #272a29;}

.infobox {position: relative; display: block; position: relative; width: 94%; mXXin-height: 250px;  margin: 0 5.0% 0 0; padding: 10px 3% 10px 3%; font-size: 19px;}
.infobox p.inline {display: inline;}
.infobox a.more {font-weight: 500;}
.infobox h4 {margin-bottom: 5px; font-size: 22px; color: #272a29;}


/* Kontakt */
.kontakt-wrapper .col1 {float: left; width: 51.5%; padding-right: 3%;} 
.kontakt-wrapper .col2 {float: left; width: 42%; padding-left: 3%;}
.kontakt-wrapper ul li {list-style-type: "- ";}
table.kontakt {width: 84%; margin: 0 8%;}
table.kontakt td {padding-right: 3%; /*white-space: nowrap;*/}
table.kontakt td.col1 {width: 43%;}
table.kontakt td.col2 {width: 32%; white-space: nowrap;}
table.kontakt td.col3 {width: 35%; padding-right: 0%; white-space: nowrap;}
table.sprechzeiten {margin-top: 10px;}
table.sprechzeiten td.col1a {padding-right: 10px;}
table.sprechzeiten td.col1c {text-align: right;}


/* FAQ */
.box-faq {clear: both;	display: block;	position: relative; width: 100%; margin-right: 30px; margin-bottom: 5px; padding: 0px;}
.box-faq a, .box-faq p {line-height: 130%;}
.box-faq a {}
.box-faq p, .box-faq li {margin-top: 10px; font-size: 18px;}
.box-faq li {margin-top: 0px;}

.box-faq-top {display: block; width: 100%; margin-top: 0px; color: #000; line-height: 15px; }
.box-faq-top-left {width: 96.5%; padding: 14px 0% 0px 3.5%;}
.box-faq-top-left a {line-height: 125%; color: #272a29; font-weight: bold;}

.box-faq-top-right {position: absolute; top: 10px; left: 0px; width: 30px; height: 30px;}
.box-faq-top-right.arrow-up {background-image: url("img/arrow-up.png"); background-repeat: no-repeat; display: none;}
.box-faq-top-right.arrow-down {background-image: url("img/arrow-down.png"); background-repeat: no-repeat;}
.box-faq-bottom {clear:both; padding: 0px 0px 10px 3.5%; /* background: #fff; border: 1px solid #6c6c6c;*/ }


/* Impressum, Datenschutz */
.contentbox.page-id-8 h2, .contentbox.page-id-9 h2 {font-weight: 700;}
.contentbox.page-id-9 li {padding: 5px 0;}


img.initiale {float: left;  margin-top: 0px;  padding: 0px 5px 0px 0px;}


.dummy-block {width: 100%; text-align: center;}
hr.hr-bottom {margin: 50px 0px 0px 0px;}

.clearcontent {clear:both; }


.bottomspacer {display: block; padding-bottom: 0px;  width:100%; }
.bottomspacerbox {width: 100%; max-width: 1280px; margin: 0 auto; padding: 0;}


/* ------ Footer ------ */
.footer-outer {width: 100%; background-color: #79295b;}
.footerbox {display: inline-block; margin: 0px auto; width: 100%; max-width: 1280px; padding: 20px 0% 20px 0%;}
.footerbox, .footerbox a, .footerbox p {line-height: 125%; color: #fff; font-weight: 300;}
.footerbox p {/*margin: 0;*/}
.footerbox .left, 
.footerbox .center {float:left; width: 37%; margin: 0;}
.footerbox .center {padding-top: 0px; width: auto;}
.footerbox .right {float: right; width: auto; margin: 0 0 0 0; padding-right: 0px;}
.footerbox .right a {color: #fff;}
.footer-title {font-weight: bold; letter-spacing: 0px;}
.footerbox .mobile-only {display: none;}
.footerbox i.fas, .footerbox i.fab {padding-right: 10px; font-size: 18px; color: #fff;}
.footerbox i.fab.fa-wpforms {padding: 0 12px 0 1px;}
.footerbox table {margin-bottom: 20px;}
.footerbox td {min-width: 80px; line-height: 110%;}

.bottom-outer {width: 100%; background-color:#e5a100;}
.bottombox {margin: 0px auto; width: 100%; max-width: 1280px; padding: 0px 0% 0px 0%;}
.bottombox .left {float:left; margin: 0;}
.bottombox .right {float: right;  margin: 0 0 0 0; padding-right: 0px;}
.bottombox p, .bottombox a {color: #fff;}




.back {text-align: right;}
.backLink {padding: 10px 0 0 0;}

#gototopswitch {float:right; margin: 10px 10px 0 0}



/* --- Top and Menu Box --- */

#topmenubox {width: 100%; height:250px; margin:0; position:fixed; z-index:5000; top:0; left:0%;  transition: 0.5s all; background: transparent; /* border-bottom: 2px solid #a8afb6;*/}
#topmenubox.page-id-1 {height:400px;}

#topmenubox .m_inner {margin: 0 auto; position:relative; height:190px; width: 100%; max-width: 1280px; padding: 0; background-color: #fff; transition: 0.5s all;}
#topmenubox.page-id-1 .m_inner {height:340px;}

#topmenubox a.logo.desktop-only {display: none;}
#topmenubox a.logo.mobile-only img {padding: 40px 0 30px 0;}
#topmenubox.page-id-1 a.logo.desktop-only {display: block; transition: 0.5s all;}
#topmenubox.page-id-1 a.logo.mobile-only  {display: none; transition: 0.5s all;}
#topmenubox a.logo.special, #topmenubox.page-id-1 a.logo.special {display: none; transition: 0.5s all;}


/* reduced */
#topmenubox.reduced {height: 60px; transition: 0.5s all; }
#topmenubox.page-id-1.reduced {height: 60px; transition: 0.5s all;}

#XXtopspacerbox.reduced {margin-top: 120px; transition: 0.5s all;}
.wrapper-content.page-id-1 #topspacerbox.reduced {margin-top: 250px; transition: 0.5s all;}

#topmenubox.page-id-1.reduced a.logo.desktop-only {display: none; transition: 0.5s all;}
#topmenubox.page-id-1.reduced a.logo.mobile-only  {display: block; transition: 0.5s all;}
#topmenubox.page-id-1.reduced a.logo.mobile-only img {display: block; transition: 0.5s all;}

#topmenubox.reduced .m_inner {background: rgba(255, 255, 255, 0.9); transition: 0.5s all;}
#topmenubox.page-id-1.reduced .m_inner {height:190px; transition: 0.5s all;}

#topmenubox.page-id-1.reduced #nav {position: absolute; right: 0%; bottom: 32px;}
#topmenubox.page-id-1.reduced #nav-right {position: absolute; top: 30px; right: 0%}


/* Search Box in header */
li.search_box_li a {border: none ! important;}

.menuebox {width: 75%; height:100%; float:left; position:relative;} 
.toggleMobileMenu {display:none;}
#openrightboxswitch, #closerightboxswitch{display:none;}


#aprevnext {display:block; width:90px; height:27px; float:right;}
#aprevnext a {display:block; width:40px; height:27px; float:right; opacity:0.5; border:none;}
#aprevnext a.aprev {background: url(img/prev.png) no-repeat center top;  }
#aprevnext a.anext {background: url(img/next.png) no-repeat center top;  }
#aprevnext a:hover {opacity:0.8}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ 
	####	Header Menu #####
	#######################

	Horizontal Drop-Down Menu based off :
	http://www.tanfa.co.uk/css/examples/menu/tutorial-h.asp
	
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~  */


/* Remove List Formattings
~~~~~~~~~~~~~~~~~~~~  */
#nav {position: absolute;	right: 0%; bottom: 32px;	border: 0;	padding: 0;}
#topmenubox.page-id-1 #nav {position: absolute;	right: 0%; bottom: 45px;}

#nav ul,  #nav2 ul {
	list-style-type: none;
	list-style-image: none;
	margin: 0;
	padding: 0;
	width: auto;
	position: relative;
	z-index: 800;
	/* background: #eee; */

}
#nav ul li,  #nav2 ul li {
	list-style-type: none;
	list-style-image: none;
	margin: 0;
	padding: 0;
}

/* Root Level Link Formatting */
#nav ul li {float: left; display:inline; color: #aaa; text-align: left; font-weight: normal; list-style-type: none; list-style-image: none ;}
#nav ul li a {display: block; padding: 0px 0px 0px 40px; font-size: 18px; line-height: 31px; border-right:0px #ddd solid; color: #272a29; text-decoration: none; font-weight: bold; text-transform: uppercase; letter-spacing: 0px; background-repeat: no-repeat;}
#nav ul li a span {display:block; padding: 9px 0px 5px 0px; }
/* Root Level link hover */
#nav ul li a:hover , #nav li a:focus , #nav li a:active, #nav ul li a.active, #nav a.menu-current, #nav a.menu-parent  {color: #9295b; /*background: #fff;*/ border: none;}
/* #nav ul li a:hover, #nav li a:focus, #nav li a:active, #nav ul li a.active, #nav a.menu-current, #nav a.menu-parent {color: #fff; background: #2a6065 ; } */
/*
#nav ul li.menu-first a:hover span, #nav ul li.menu-first a.menu-current span {border-bottom: 2px solid #ecc111; padding-bottom: 4px;}
*/
#nav ul li.Kontakt,
#nav ul li.Anfahrt,
#nav ul li.FAQ,
#nav ul li.Impressum, 
#nav ul li.Datenschutz {display: none;}

/*Current page Customisations*/
/* #nav a.menu-current		{font-weight: bold;} */

/* 2nd Child menu */
#nav  li ul {position: absolute; right:10000px; width: 180px; margin-top: 0px; opacity:0.0; border-bottom: 0px solid #fff; border-left: 0px solid #fff; background: transparent; /* box-shadow: 0px 10px 10px -4px rgba(0, 0, 0, 0.4);*/}
#nav  li ul li {text-align: left; font-weight: normal; margin: 0; margin-left: 37px; padding: 0; line-height: 1.2em; background: #fff }
#nav  li ul li a {width: 180px; margin:0; padding: 0px 20px 0px 20px; text-align:left; background: none;}
#nav  li ul li a span {display:block; padding:0px; text-shadow: none;  color: #333;  font-weight: normal; font-size: 14px; line-height:45px; text-transform: uppercase; border-top: 2px solid #ecc111; }

/* 2nd Child menu: kurze Trennlinie oben */
#nav  li ul li.menu-first a span {border: none;}
#nav  li ul li.menu-first a span:after {content: ""; display: block; position:absolute; top: 0; left: 20px; width: 38%; border-top: 2px solid #ecc111; }

#nav ul li.menu-first ul li a:hover span {border-bottom: none; padding-bottom: 0px; color: #ecc111;}
#nav ul li ul li.menu-last { border-bottom: 5px solid #fff; }



/* 2nd Child link hover */
#nav  li ul a:hover,  #nav  li ul a.menu-current { /* text-shadow: 1px 2px 4px #000;*/}
#nav  li ul li a:hover span {color: #ecc111;}
#nav  li ul a.menu-expand {background: transparent url(img/arr-right.png) no-repeat right 5px ; }
#nav  li ul a.menu-parent {background: #2a6065 url(img/arr-right.png) no-repeat right 5px; }

/* Show and hide */
#nav  li:hover ul, #nav  li a:focus ul, #nav li.tabselected ul {right:-20px; XXmargin: -3px 0 0 0; opacity:1; transition:0.5s opacity;}
#nav  li ul ul { margin-left: -10000px; opacity:0.0; transition:0.5s opacity;}
#nav  li:hover ul ul, #nav  li.subMenu ul ul { margin-left: -10000px; opacity:0.0; transition:0.5s opacity;}
#nav  li:hover>ul, #nav  li li:hover>ul { opacity:1; margin-left: 0;  transition:0.5s opacity; z-index: 1000;}
#nav  ul li ul li:hover>ul {margin-left: -30%;  opacity:0.9;}

/* 3rd Child Menu Appreances */
#nav  li ul li ul	{ width: 180px; margin: 10px 0 0 -40%; z-index: 2000; }
#nav  li ul li ul li	{width: 100%;}
#nav  li ul li ul li a 	{ width: 100%;}

/* Positioning the Pop-out Drops */
#nav li {position: relative;}

#nav ul ul ul {
	position: absolute;
	top: 1px;
	left: 100%;
}

/* Better: */
#nav li:hover {
	z-index: 1000;	/* ...and here. this makes sure active item is always above anything else in the menu */
	white-space: normal;/* required to resolve IE7 :hover bug (z-index above is ignored if this is not present)
							see http://www.tanfa.co.uk/css/articles/pure-css-popups-bug.asp for other stuff that work */													
}

.nav_kontakt {float: right; text-align: right; width: 10%; padding: 18px 6% 0 0;}	
.nav_kontakt a {font-size: 14px; color: #fff; text-transform: uppercase;}

/* end menu */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

#footer_menu {padding-bottom: 10px;}
#footer_menu a { display: inline-block; padding: 2px 10px; border-right: 1px solid #999;}
#footer_menu a:first-child {border-left: 1px solid #999;}
#footer_menu a.menu-current {font-weight:bold;}



/*COuld bee visible on Desktop*/
#nav2 {width:250px; height: auto; position:absolute; left:-300px; }	

.showonmobiles  {display:none;}




/* ============================= Responsive =================== */

@media screen and (max-width: 1280px) {
	div {border: 0px solid red;}
	
	.headerbox p, .headerbox a {font-size: 20px; line-height: 30px;}

	.outer, .mainbox {width:100%; margin: 0 0 0 0;}
	.headerbox,	#topmenubox .m_inner, .bottombox, .kontakt-wrapper {width: 94%; padding: 0 3%;}
	.contentbox {width: 94%; padding: 20px 3%;}
	.contentbox.page-id-3 {width: 94%; padding: 30px 3%;}
	.contentbox.page-id-7 {width: 94%; padding-bottom: 30px;}
	.footerbox {width: 94%; padding: 20px 3%;}
	
	#topmenubox #nav, 
	#topmenubox.page-id-1 #nav,
	#topmenubox.page-id-1.reduced #nav,
	#topmenubox.page-id-1.reduced #nav-right {
  	position: absolute; right: 3%;
  }
	#nav ul li a {padding: 0px 0px 0px 25px; font-size: 16px;}
	
	#nav-right {position: absolute; right: 3%;}
	#nav-right a, #nav-right {XXfont-size: 17px;}
	
	.contentbox h1 {font-size: 36px;}	
	
	h4, .infobox h4 {font-size: 1.1em; }
	
	.back-content p {margin: 5px 0; font-size: 16px;}
	
	.box-faq, .box-faq a, .box-faq p, .box-faq h4, .contentbox.page-id-5 h3 {font-size: 20px; line-height: 130%;}
}



@media screen and (max-width: 1170px) {	
	div {border: 0px solid blue;}
	
	#nav ul li a {font-size: 14px;}
	p, td, li, .back-content h4, .infobox {font-size: 16px;}
	.teambox.page-id-3 .back-content p {margin: 5px 0; font-size: 12px;}
	
	.infobox-container {width: 94%; padding: 0 3%;}
}



@media screen and (max-width: 1024px) {
	div {border: 0px solid yellow;}
	
	.headerbox {text-align: center;}
	
	#logo-wrap, #nav-right, .flex-direction-nav, .content.desktop, .zusatz-text {display: none;}	
		
	#topmenubox {height: 170px !important;}
	#topmenubox #nav {display:none;}
	
	/*.topmenubar {width: 70%; margin: 0 auto; padding-top: 15px;}*/
	.topmenubar ul#topmenu {float: right; padding-top: 35px;}
		
	.toggleMobileMenu {display:block; float:right; width:15px; height:50px; margin: 60px 8% 0 0; padding-right: 20px; background: url(img/menuswitch1.png) no-repeat top right; }
	.toggleMobileMenu2 {display:block; position: absolute; top: 20px; right: 20px;
	 width:50px; height:50px; margin: 0; padding: 0; background: url(img/button_close_nav.png) no-repeat top right; }
	
	/*.topspacer {padding-top: 60px;}*/
	#XXtopparallax {padding-top: 50%; }
	
	.topmenubar ul.gallery_menu li a {font-size: 18px; line-height: 40px;}
	
	#topspacerbox, 
	.wrapper-content.page-id-1 {margin-top: 170px;}
	.wrapper-content.page-id-1 #topspacerbox,
	.wrapper-content.page-id-1 #topspacerbox.reduced {margin-top: 80px;}
	
	#topmenubox.reduced, 
	#topmenubox .m_inner, 
	#topmenubox.reduced .m_inner, 
	#topmenubox.page-id-1 .m_inner,
	#topmenubox.page-id-1.reduced .m_inner {height: 120px; width: 100%;}

	#topmenubox a.logo.mobile-only img, 
	#topmenubox.reduced a.logo.mobile-only img {
		position: absolute; left: 3%; bottom: 0px;
	  XXmax-height: 100%;
	  max-width: 50%;    
	  padding: 10px 0;
	}
	#topmenubox.page-id-1 a.logo.desktop-only img {display: none;}
	#topmenubox.page-id-1 a.logo.mobile-only img,
	#topmenubox.page-id-1 a.logo.mobile-only {display: block;}

	
	/* Nav */	
	
	#nav2 {width:100%; height: auto; position:absolute; left:-100%; top:100px; z-index:2000; transition: left 1s;}
	#nav2 {background: #fff; /*box-shadow: 0px 10px 10px 0px rgba(0, 0, 0, 0.4);*/}
	
	#nav2 ul {margin-top: 150px; } /* mux */
	
	#nav2 li {width:100%;  padding: 0 0 0 0;  border-bottom: 1px solid #666;}
	#nav2 li.menu-first {border-top: 1px solid #666;}
	#nav2 li.menu-current {background: #d9992f;}
	#nav2 li a {display:block; margin: 0 20px 0 20px; padding: 10px 0 10px 10px; font-size:16px;  color:#666; text-decoration: none; /*border-bottom: 1px solid #fff;*/}
	#nav2 li a:hover {color: #f00;}
	
	#nav2 li li a {padding: 10px 0 10px 30px; font-size:16px;}
	#nav2 li li li a {padding: 8px 0 8px 40px; font-size:14px;}
	#nav2 li li li li a {padding: 6px 0 6px 50px; font-size:13px;}
	
	#nav2 li ul {display:none;}
	#nav2 li.menu-parent > ul, #nav2 li.menu-current > ul {display:block;}
	#nav2 li.is_opened > ul, #nav2 li.is_opened > ul {display:block;}
	
	#nav2 li a.menu-expand {background: transparent url(img/arr-down.png) no-repeat left center ;}
	#nav2 li a.menu-current {color:#fff; /* text-shadow: 1px 2px 4px #000;*/}
	
	#nav2 ul li a.menu-expand.is_opened, #nav2 ul li a.menu-parent {font-weight:bold; background: #ddd url(img/arr-right.png) no-repeat 2px center ; }
	#nav2close {display:none; z-index:1990; position:absolute; top:0; width:100%;  height: 900px; background-image:none;}
	
	/* */
	
	
	.breadcrumbs { height:560px; }
	.breadcrumbs { width: 100%; height: auto; }
	.innerbc { margin: 2px 0 5px 2%; width: 96%; }
	.innerbc span  {display: block; float:left; padding: 2px 2px 2px 12px; margin: 0 0 5px 0;}
	.innerbc b  {display: none;}
	
	.mobilemenuopen #nav2 {left: 0%;}
	.mobilemenuopen #nav2close {display:block;} 
	
	.mini-menu {display:block;} 	
		
	
	.contentbox h1 {font-size: 1.4em; margin: 30px 0; }
	.contentbox h2 {font-size: 1.2em;}
	.contentbox h3 {font-size: 1.0em;}	
	
	/*	
	.contentbox.page-id-1 {width: 88%; padding: 30px 6% 10px 6%;}
	.contentbox.page-id-2,
	.contentbox.page-id-3,
	.contentbox.page-id-4,
	.contentbox.page-id-5 {width: 85%; padding: 30px 5% 20px 10%;}
	*/ 
	
	.container {padding-top: 2px;}		
	.mainbox .contentwide  {width:96%; margin:0 0 0 2%; padding-top: 50px;}
	.content, .top_content {width:100%; margin:0; padding:0; float: none; }
	
	.contentbox.page-id-2 .content {padding-bottom: 0px;}
	.contentbox.slogan {width: 94%; padding: 20px 3% 20px 3%;}
	
	.mainbox, .contentwide, .contentwidenarrow, .main, .content.mobile {float: none; width:100% ! important; border-left:none; display:block;}
	
	.content.contentnarrow {float: none; width: 96%;}
	.content.narrow {float: none; width:100%; margin-top: 0;}
	.content.mobile {text-align: center; margin: 0;}

	.wrapper-content {margin-top: 170px;}	

	
	.leistungsbox {min-height: 50px; width: 100%; margin: 0; padding: 0 0 50px 0; }
	.leistungsbox img {max-width: 15%;}
	
	/*
	.imageWrapper .hoverLink img {display: none;}
	.imageWrapper .hoverLink {
	  opacity: 0;
	  position: absolute;top: 0;left: 0;  
	  -webkit-backface-visibility:hidden;
	  backface-visibility: hidden;
	  
	  background: #000000;
	  text-align: center;
	  -webkit-transition: opacity 500ms;
	  -moz-transition: opacity 500ms;
	  -o-transition: opacity 500ms;
	  transition: opacity 500ms;    
	}
	*/
	
	.teambox-wrapper.page-id-4 {padding-top: 0px;}
	.team-box,
	.team-box.page-id-3, 
	.team-box.page-id-3.last-box,
	.team-box.page-id-4, 
	.team-box.page-id-4.last-box {
		float: none; width: 45%; margin: 0 auto; margin-bottom: 20px; padding: 0px;
	} 
	.XXteam-box {padding: 0 30%;}
	
	.XXteam-box .imageWrapper {text-align: center;}
	.XXteam-box img, .img {margin: 0 auto;}
	
	.leistungsbox-wrapper {padding-top: 20px;}
	
	.kontakt-wrapper .col1, .kontakt-wrapper .col2 {float: none; width: 100%; padding-right: 0%; padding-left: 0%;}
	
	p, li, .box-faq p, .box-faq a, .box-faq h4, .headerbox p, .leistungsbox {font-size: 18px !important; line-height: 150%;}
	.leistungsbox-short p {display: block;}
	
	.box-faq p {margin-bottom: 5px;}
	.prev-more a {font-size: 22px;}	
	.box-faq-top-right {position: absolute; top: 10px; left: 0px; width: 14px; height: 14px; background-size: contain;}
	.box-faq-top-left {width: 92%; padding: 6px 0% 6px 3%;}
	.box-faq-bottom {padding: 0px 0px 15px 3%;}
	
	
	.adress-bottom-box {float: none; width: 100%; padding: 0 0 15px 0; text-align: center;}
	
	/*.footerbox .right {float: none; width: 100%; padding: 0; text-align: center;}*/
	.footerbox p, .footerbox td, .footerbox i.fas, .footerbox i.fab, .bottombox p {font-size: 15px;}
	.footerbox .left, .footerbox .center, .footerbox .right  {float: left; width: 33%; XXmin-width: 280px; padding-left: 0%;}
		
	/* Turn off parallax scrolling for tablets and phones */
  .bgimg {background-attachment: scroll; }
}


/* ======================================================================
Smaller Screens */
@media screen and (max-width: 768px) {
	div {border: 0px solid green;}		
	
	p, li, td, .footerbox i.fas, .footerbox i.fab, .bottombox p input.mpform_submit, input.mpform_email, span.captcha_text, .abrev p {font-size: 14px !important;}
	p, li, .box-faq p, .box-faq a, .box-faq h4, .preview-box-bottom .box-title, .preview-box-bottom p {font-size: 15px !important; line-height: 120%;}
	
	.headerbox {height: 30px;  overflow: hidden;}
	.headerbox p, .headerbox a {margin: 12px 0 0 0; font-size: 16px !important; line-height: 100%;}	
	
	#topmenubox {height: 130px !important;}
	#topmenubox a.logo img {width:35%; position: absolute; left: 5%; bottom:20px;}
	#topmenubox.reduced a.logo img {max-height:100%; max-width:100%; position: absolute; left: 5%; bottom:20px;}
	
	#topmenubox.reduced, 
	#topmenubox .m_inner, 
	#topmenubox.reduced .m_inner, 
	#topmenubox.page-id-1 .m_inner,
	#topmenubox.page-id-1.reduced .m_inner {/*display: inline-block;*/ height: 80px; width: 100%;}
	
	#topmenubox a.logo.mobile-only img, 
	#topmenubox.reduced a.logo.mobile-only img {
		position: absolute; left: 3%; bottom: 0px;
	  max-width: 45%;    
	  padding-bottom: 15px;
	}
	
	#nav2 ul {margin-top: 110px;}
	
	.toggleMobileMenu {width: 10px; height: 30px; margin: 25px 6% 0 0;   }
	
	.XXfrontpage .outer  {background-position: center top;}
	.topheader  {padding-bottom: 30%;  background-size:  100% auto, auto; background-image: url(img/header-mobile.jpg);}
	
	#topspacerbox,  .wrapper-content, .wrapper-content.page-id-1 {margin-top: 130px;}
	
	.contentbox, .contentbox.page-id-3, .contentbox.page-id-6 {padding-top: 10px;}	
		
	h1 {font-size: 1.4em;}
	.contentbox.page-id-1 h1 {font-size: 1.5em;}
	.contentbox.page-id-1 h2 {font-size: 1.2em;}
	.contentbox.page-id-1 h6 {font-size: .9em;}
	h2 {font-size: 1.4em;}
	.contentbox.page-id-8 h2, .contentbox.page-id-9 h2 {font-size: 1.0em; font-weight: 500;}
	h3, .infobox-long h3, div.mpform_missing {font-size: 16px;}
	h4 {font-size: 1.1em; }
	h5 {font-size: .9em;}
	
	.two-column {column-count: 1; column-gap: 0px;}	
	.slogan {padding-top: 0px;}
	
	.team-box,
	.team-box.page-id-3, 
	.team-box.page-id-3.last-box,
	.team-box.page-id-4, 
	.team-box.page-id-4.last-box {
		float: none; width: 45%; margin: 0 auto; margin-bottom: 20px; padding: 0px;
	}
	.desktop-only {display: none;}
	
	table.kontakt {width: 50%; margin: 0 auto;}
	table.kontakt td.col1, table.kontakt td.col2, table.kontakt td.col3 {
		float: none; display: block; width: 100%; text-align: center;
	}
	table.kontakt td.col1 {padding-bottom: 25px;}
	table.kontakt td.col3 img {margin: 0 auto; max-width: 200px;}
	table.sprechzeiten {margin: 0 auto; margin-top: 12px;}
	
	.button-box-outer {padding: 30px 0;}
	.button-box-wrapper {width: 100%;}
	.button-box {width: 23.8%; padding: 0 1.5% 0 0;}
	.button-box.last-box {padding-right: 0;}
	
	.box-faq-top-left {width: 95%; padding: 6px 0% 6px 5%;}
	.box-faq-bottom {padding: 0px 0px 15px 5%;}
	
	.footerbox .left, .footerbox .center, .footerbox .right, .footerbox table  {float: none; width: 100%; text-align: center; margin-bottom: 20px;}
	.footerbox table {margin: 0 auto; width: 200px; margin-bottom: 20px;}

}


/* ======================================================================
Smaller Screens */
@media screen and (max-width: 480px) {
	div {border: 0px dotted blue;}
	
	#topmenubox a.logo.mobile-only img, #topmenubox.page-id-1 a.logo.mobile-only img,
	#topmenubox a.logo.mobile-only.reduced img, #topmenubox.page-id-1.reduced a.logo.mobile-only {display: none;}
	
	#topmenubox a.logo.special, #topmenubox.page-id-1 a.logo.special,
	#topmenubox.page-id-1 a.logo.special img {display: block;}
	
	#topmenubox a.logo img,
	#topmenubox a.logo.special img, 
	#topmenubox.page-id-1 a.logo.special img {
    position: absolute;
    left: 2%;
    bottom: 0px;
    width: 75%;
    padding-bottom: 15px;
  }
	
	#button-kontakt {position: absolute; right: 5.6%; top: -65px;}	
	.contentbox.page-id-1 {width: 88%; padding: 20px 6% 10px 6%;}
	.contentbox.page-id-1.contentbox2 {padding-top: 0;}
	
	#topparallax .ptext {bottom:0; }
	.topheader p { font-size:1.4em; }
	
	h1, .contentbox h1, .contentbox.page-id-1 h1 {font-size: 1.2em; margin: 20px 0;}
	h2, .infobox-long h2, .contentbox.page-id-8 h2, .contentbox.page-id-9 h2 {font-size: .8em; margin-top: 20px;}
	h3, .infobox-long h3, .contentbox.page-id-5 .yellow-box h3 {font-size: 17px; margin-bottom: 0px;}
	h4, .infobox h4 {font-size: 14px;}
	.contentbox.page-id-1 h6 {font-size: .8em;}
	
	p, li, td, title, a.more, .arrow a {font-size: .8em;}
	.bottombox p {font-size: 13px !important;}	
	
	.team-box,
	.team-box.page-id-3, 
	.team-box.page-id-3.last-box,
	.team-box.page-id-4, 
	.team-box.page-id-4.last-box {float: none; width: 90%; margin: 0 auto; margin-bottom: 30px; padding: 0px;}
	.team-box.page-id-4 .mobile-content {display: block; text-align: center;}
	.team-box.page-id-4 .mobile-content p {margin: 5px 0 5px 0;}

	.infobox {width: 100%; padding: 10px 0% 10px 0%;}
	
  .slider-wrapper {display: block;}
  .slider-wrapper.page-id-1 {display: none;}
  
  
}



/* ====================================================================== */
#return-to-top {
	z-index: 9000;
    position: fixed;
    bottom: 120px;
    right: 50px;
		/* background: rgb(0, 0, 0); */
    /* background: rgba(0, 0, 0, 0.7); */
    width: 50px;
    height: 50px;
    display: block;
    text-decoration: none;
    /*
    -webkit-border-radius: 35px;
    -moz-border-radius: 35px;
    border-radius: 35px;
    */
    display: none;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}
#return-to-top:hover {
	opacity:0.6;
    /* background: rgba(0, 0, 0, 0.9);*/
}
#return-to-top:hover i {
    color: #fff;
    top: 5px;
}
@media screen and (max-width: 1024px) {
	#return-to-top {position: fixed; bottom: 100px; right: 30px; }
	#return-to-top img {width: 50px;}
}
	


/* ====================================================================== */
/* Hover Effekt */


/* ---------- Kontakt-Bar ---------- */
.kontakt-bar {
	z-index: 999;
	position: fixed; top: 25%; left: -2px;
	display: block;
	width: 70px; 
	border: 0px solid red;
}
.kontakt-bar a {
	display: block;
	width: 70px; height: 175px;
/*
	-moz-box-shadow: 1px 1px 10px #ddd;
	-webkit-box-shadow: 1px 1px 10px #ddd;
	box-shadow: 1px 1px 10px #ddd;
*/
}
.kontakt-bar a {
	width: 70px;
	background: url(img/kontakt-bar.png) 0 0 no-repeat;	
	background-position: -10px 0px;	
	background-size: contain;	
	transition:0.5s all;
}

.kontakt-bar a:hover {width: 70px; background-position: 0px 0px; transition:0.5s all;	}
/*.markt-mobile {display: none;}*/

@media screen and (max-width: 1200px) {
	/*.kontakt-bar {display:none;}*/	
	.kontakt-bar a {width: 70px; height: 125px;}
}	

@media screen and (max-width: 768px) {
	.kontakt-bar {position: fixed; top: 200px; left: -2px;}
	.kontakt-bar a {width: 70px; height: 100px;}

}	
/* ---------- End Kontakt-Bar ---------- */


/*.mask a.info:before {padding-right: 5px; font-size: 32px; display: inline-block; content: '> ';  }*/
i.fas {font-size: 11px; color: #000;}



/*.spacer {display; block; width: 100%; height: 1px; clear: both;}*/

/*
.flipbox {
  perspective: 2000px; 
}
.flipbox:hover .flipper, 
.flipbox.hover .flipper { 
  transform: rotateY(180deg); 
}

.flipper {	
  position: relative;
  transition: 1s;
  transform-style: preserve-3d;
}
.flipbox .front, 
.flipbox .back {
  position: absolute;top: 0;left: 0;  
  -webkit-backface-visibility:hidden;
  backface-visibility: hidden;
}

.flipbox .back-content {
	position: absolute; top: 50%; left: 0%; 
	transform: translateY(-50%);
	text-align: center; 
  width: 100%; XXheight: 100%;   
}
.flipbox .back-content,
.flipbox .back-content a {font-size: 19px; color: #fff; font-weight: 400;}
.flipbox .back-content h2 {color: #fff;}

.front {transform: rotateY(0deg);}
.back  {transform: rotateY(180deg);}
*/

#button-close, .button-close {
  z-index: 2;
  position: absolute; right: 20px; top: 20px;
}

.cc-window {
    -moz-box-shadow: 0 0 5px 2px #fff;
    -webkit-box-shadow: 0 0 5px 2px #fff;
    box-shadow: 0 0 5px 2px #fff;
}
.cc-btn {
    padding: 0.4em 0.8em;
    font-size: 1.0em !important;
    font-weight: normal !important;
}
.cc-floating.cc-theme-classic {
    border-radius: 0px !important;

}



