/* General Style */ 
/* Base1*/
/* by Thomas Schmid, below the line, Webmarketing, Friedberg*/
@font-face { font-family: 'Ubuntu-Bold';
             src: url('../fonts/Ubuntu-Bold.ttf') format('truetype'); }
@font-face { font-family: 'Ubuntu';
             src: url('../fonts/Ubuntu-Regular.ttf') format('truetype'); }


body {
	background: #ffffff;
	font-size:100%;
	margin:0em;
	padding:0em;
	font-family: 'arial', sans-serif;
	color:#000000;	
}

h1 {
	font-size:1.7em;
	font-weight:600;
	color:#3c454b;
	margin:1em 0 0.5em;
}
/* Apassung 226 
h2 {
	font-size:1.4em;
	font-weight:400;
	margin:0 0 1em 0;
	padding:0em;
	color:#3c454b;
}
*/
h2 {
	font-size:1.4em;
	font-weight:700;
	margin:0.5em 0;
	padding:0em;
	color:#3c454b;
}

h3 {
	font-size:1.3em;
	margin:0 0 1em 0;
	padding:0;
	font-weight: 500;
}
h4 {
	font-size:1.1em;
	color:#3c454b;
	margin:0em;
	padding:0em;

}
h5 {
	font-size:1.1em;
	color:#3c454b;
	margin:0em;
	padding:0em;

}

p {
	line-height:1.2em;
	margin:0em 0em 1em 0em;
	font-size:1em;
}
p.sperr{margin:-0.5em 0 0;padding:0}
hr{
	border: solid 1px #9a9a9a;
	margin:2em 0;
}
ul {
	margin:0px;
	padding:0px;
}
li {
	list-style:none;
	font-weight:100;
	margin:0em;
	padding:0em;
}
#main img {width:auto; float:left; padding: 0 20px 0 0;max-height: 23em;} 
#main img.zwei-bilder{float:right;}
#main img.diagnose {max-width:33.33%; float:left; padding: 0 20px 0 0; max-height:100%;} 
/* Header */ 
header {
	background:#ffffff url("../images/header-bg.jpg")repeat-x;
	margin:0em auto 0.5em;
	width:100%;
	box-shadow:0 0 5px 5px rgba(100, 100, 100, 0.5);
	height:196px;}
	
header #banner #banner-top img{padding:0;margin:0;width:100%;float:left;}
header #banner #sloagen{font-size: 25px;font-weight: 400;padding: 65px 0 0 34px;float:right;width:800px;color: #f7b200;text-align:right;}
header img{width:auto;}
#banner{
	max-width:1200px;
	margin:auto;
}
#banner-top{
	width:28%;
	display:inline-block;
}
/* Navigation */ 

nav {
	display:inline-block;
	margin:auto;
	padding:0 1em;
}
nav ul {
	display:block;
	padding-top:1.3em;
	margin: 0 1em;
	width:100%;
	text-align:center;
}
nav ul li {
	display:inline-block;
	margin:0 3% 0 0;
	vertical-align:top;
	padding: 0;
	width:15%;
}
nav ul li ul{width:150%;}

nav a,
.separator{
	color: #3c454b;
	font-size:1.1em;
	font-weight:600;
}
nav li.active a{color: #fab400;}
nav li.active .separator {color: #fab400;}
nav li:hover .separator{cursor:pointer;}
nav ul li.parent ul.mod-menu__sub{display:none;position:relative;z-index:999;}
nav ul li.parent ul.nav-child,
nav ul li.deeper ul.nav-child{display:none;}
nav ul li.parent:hover ul.mod-menu__sub{display:block;}
nav ul li.parent:hover ul.nav-child,
nav ul li.deeper:hover ul.nav-child{display:block;} 
nav ul li:hover ul{background:#3c454b;border:1px solid #fab400;}
nav ul li ul li{padding:1em 5%;width:89%;text-align:center;}
nav ul li:hover ul li a{color:#ffffff;}
nav ul li:hover ul li.active a,
nav ul li:hover ul li:hover a,
nav li:hover .separator,
nav ul li:hover a{color:#fab400;}
nav ul li.parent ul.nav-child,
nav ul li.deeper ul.nav-child{list-style: outside none none;text-align:left;margin:0 0 0 -25%;padding:0;position:relative;z-index:1000;}

nav ul li ul li:hover{background: #3c454b;opacity: 1;}
/* Slider*/
.slider{
	max-width:1200px;
	margin:0 auto;
}
#slider p{
	font-size:1.5em;
	color:#efefef;
}
.slider img{
	width:100%;
	height:auto;
}

.klima .slider{margin:-0.5em auto 0;}

/* Hauptseite */
#main{
	max-width:1200px;
	margin:0 auto;
}
#main article {
	margin:0em;
	padding:0;
	text-align:left;
}

#dopple #main article{width:63%; margin:0 4% 0 0;display:inline-block;}

#main aside {
	display:inline-block; 
	text-align: right;
	vertical-align: top;
	width: 32%;
	margin: 2em 0 0 0;
}
#main aside .custom{text-align:left;}
section.block-3{
	display:flex;
	margin:0 auto;
}


ul.top-block li{
	margin:0 1.5%;
	width:30%;
	display:inline-block;
	text-align:center;
	vertical-align:top;
}
ul.leistungen li{list-style-image: url("../images/list.png");list-style-position:outside; margin:0 0 0.5em 26px;}







/*Partner-Logos*/
.bottom{margin:2em 0;max-width:1200px;width:100%;display:flex;}
#main .bottom img{width:auto;float:none;}
.footer-top{background:#3c454b;color:#f7b200;text-align:center;padding:0.5em 0;}
.footer-top p{font-weight:500;margin:0;}
ul.top-block{max-width:1200px;width:100%;margin-top:3em;}
.custom{width:100%;}

/*news-flash*/
ul.unsere-leistungen{width: 100%;}
ul.unsere-leistungen li{width:20.7%;margin:0;padding:0 2%;display:inline-block;vertical-align:top;}
#main ul.unsere-leistungen li img{float:none;width:100%;padding:0;}
ul.unsere-leistungen li p{font-size:0.9em;}







a {
	text-decoration: none;
}

/* On Top Bar */
#menubar {
	display:none;
}
#menubar img{width:90%;height:auto;}
#menubar ul {
	display:block;
	width:2em;
	padding:0.9em;
}
#menubar ul li {
	display:inline;
}
#menubar ul li a.menubutton {
	display:none;
	color: #ffffff;	
}





section.block-2{margin:0;
}
.grid-2{
	margin:2%;
	width:45%;
	display:inline-block;
	text-align:center;
}
.grid-2 img{
	width:100%;
}

section.block-4{
	display:flex;
	margin:5em 0;
	text-align:center;
}
.grid-4{
	margin:1.5%;
	width:22.5%;
}

/* Footer */ 
footer {
	display:block;
	background:#2e2e2e;
	margin:auto;
	text-align:center;
}

footer ul {
	max-width:1200px;
	width:96%;
	margin:auto;
	font-size:0.9em;
	color:#ffffff;
}
footer ul li {
	display:inline-block;
	margin:0;
	vertical-align:top;
	padding: 1em 3em;
}
footer ul li a:hover {
	color:#ffffff;
	padding:0;
}
footer ul li a.active {
	border-bottom:#ffffff;
}


footer ul li a {
	color:#9a9a9a;
	transition: filter 0.9s ease 0s;
}
fieldset{border:none;padding:0;}
.visCSSlabel{width:100%;}

    .grid-2er {
      display: grid;

      margin: 0 auto; 
      gap: 20px;
	  max-width: 1200px;
	  text-align:center;
    }

    .grid-item {
      background-color: #3B454C;
      padding: 20px;
      text-align: center;
      border: 5px solid #f3B021;
	  color: #f3B021;
    }
	.grid-hold{
      background-color: #ffffff;
      padding: 20px;
      text-align: center;
      border: none;
    }
    .grid-item p{margin-top:20px;}    
	#main .grid-item img{
		padding:0;
		float:none;
		max-width:100%;
	}

/* Mobile Style */
@media screen and (max-width:1201px) {
  #main{width:90%;margin:0 auto;}
  header #banner #sloagen{width:68%;}
}
@media screen and (min-width:1011px) {
	.grid-2er {grid-template-columns: 50% 50%;width: 70%;}
}
@media screen and (max-width:1010px) {
  #banner{text-align:center;}
  #sloagen{display:none;}
  #banner-top{width:90%;}
  header #banner #banner-top img{float:none;width:auto;}
  #main img{height:auto;width:auto;}

  .grid-itemp{
		margin-top:20px;
	}

		.grid-2er {grid-template-columns: 100%; width: 90%;}
		.grid-hold{display:none;}
		#main .grid-item img{
		padding:0;
		float:none;
		max-width:100%;
	}
}		

@media screen and (max-width:940px) {
	body {
		font-size:90%;
	}
	.grid-3{width:29%;}
	#banner{
	  text-align:center;
	}
	nav{
	  text-align:center;
	}
	#main{
	  width:90%;
	  text-align:center;
	}
	footer{
	  text-align:center;
	}
	footer ul li{
	  padding: 1em 3em;
	}


ul.unsere-leistungen li{width:45%;}

}
@media screen and (max-width:860px) {
	#main{
	  border:none;
	}
	#blog .span4 {
	    width: 90%;
	}
	#dopple #main article{width:94%;}
	#main aside{width:100%;}
}
@media screen and (max-width:730px) {
  ul.top-block li{width:45%;}
  .footer-top p{width:92%;}
}
  
@media screen and (min-width:900px) {
	.is-active nav.nav {
		display:block !important;
	}
	.hamburger-box{display:none;}
	nav.nav{width:100%;}
	

}
@media screen and (max-width:900px) {
  	#menubar{
	  display:inline-block;
	}
	
#menubar ul li a.menubutton {display:inline-block;}

	#banner{display:inline-block;width:80%;vertical-align:top;}
	nav {
		display:none;
		height:auto;
	}
	.is-active nav{display:block;}
	nav ul li {
		display:block;
		margin:0.3em 0em 0.3em 0em;
	}
	header{
	  height:135px;
	}
  	nav ul {
	  background: #ffffff;
	  position:relative;
	  background:#3c454b;
	  padding:1em 0;
	  margin:0;
	}
	nav ul li ul{width:100%;}
	nav ul li{width:100%;font-size:1.1em; margin:1em 0;}
	nav ul li ul li a,
	nav ul li.active ul li a{
	  font-size:0.9em;
	  color:#ffffff;
	}
	nav a, .separator{
	  color:#9a9a9a;
	}
	nav ul li ul.nav-child,
	nav ul li.parent ul.nav-child,
	nav ul li.deeper ul.nav-child{
	  display:block;
	  position: relative;
	  text-align:center;
	  margin:0;
	  padding:0;
	}

	nav ul li:hover ul.nav-child{
	  display:block;
	}
	nav ul li ul li{
	  display:block;
	  margin:0;
	}
	nav ul li.parent ul.mod-menu__sub{display:inline-block;}
	#dopple #main img{width:90%;padding: 20px 0;} 
	.hamburger-box {width: 5%;height: 2em;display: inline-block;position: relative;margin-top:1em;}
	.hamburger {padding: 15px 15px;display: inline-block;cursor: pointer;transition-property: opacity, filter;transition-duration: 0.15s;transition-timing-function: linear;font: inherit;color: inherit;text-transform: none;background-color: transparent;border: 0;margin: 0;overflow: visible;text-align:right;width:90%;position: absolute;top: 0;right:30px;}

.hamburger #banner-text{text-align:center;display:inline-block;width:78%;vertical-align:top;}
.hamburger #banner-text #logo{float:none;display:inline-block;width:100%;}
.hamburger-inner {display: block;top: 50%;margin-top: -2px; }
.hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {width: 30px;height: 2px;background-color: #fcaf01;border-radius: 4px;position: absolute;transition-property: transform;transition-duration: 0.15s;transition-timing-function: ease;}
.hamburger-inner::before, .hamburger-inner::after {content: "";display: block; }
.hamburger-inner::before {top: -10px; }
.hamburger-inner::after {bottom: -10px; }
.hamburger--collapse .hamburger-inner {top: auto;bottom: 0;transition-duration: 0.13s;transition-delay: 0.13s;transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
.hamburger--collapse .hamburger-inner::after {top: -20px;transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), opacity 0.1s linear; }
.hamburger--collapse .hamburger-inner::before {transition: top 0.12s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19); }
.hamburger--collapse.is-active .hamburger-inner {transform: translate3d(0, -10px, 0) rotate(-45deg);transition-delay: 0.22s;transition-timing-function: cubic-bezier(0.215, 0.61,0.355, 1); }
.hamburger--collapse.is-active .hamburger-inner::after {top: 0;opacity: 0;transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), opacity 0.1s 0.22s linear; }
.hamburger--collapse.is-active .hamburger-inner::before {top: 0;transform: rotate(-90deg);transition: top 0.1s 0.16s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.25s cubic-bezier(0.215, 0.61, 0.355, 1); }
}
  
@media screen and (max-width:600px) {
	body {
		
	}

	#main article{
	padding:1em;
	width:96%;
	}
	#main aside{
	  width:96%;
	}


	#slider p{
	padding: 1em 0 0 0;
	}

}
@media screen and (max-width:420px) {
	header #banner #banner-top img{width:100%;}
	ul.unsere-leistungen li{width:92%;}
	ul.top-block li{width:92%;padding:0;}
	#main article{padding:0;}

}
fieldset{width:100%;}
.visform{clear:both;}

