body, input, select, textarea {
   font-family: "Rubik","Open Sans", Helvetica, sans-serif;
   font-size: 13pt;
   font-weight: 400;
   line-height: 1.65em;
}

h1 {
	font: 3em 'Rubik',sans-serif;
	font-weight: 900;
	text-transform: uppercase;
   color:#02aeef;
   margin-bottom:1em
}

	.is-mobile h1 { font-size:1.3em}

h2 {
	color:#02aeef;
   font-weight:500;
   font-size:1.5em;
   margin-bottom:1em
   }

	.special h2 {
	   font: 1.9em 'Rubik',sans-serif;
	   font-weight: 900;
	   text-transform: uppercase;
	   margin-bottom:1em;
	   color: white !important
	}

   .is-mobile .special h2 {font-size:1.25em}


h3 {
	color:#02aeef;
   font-weight:bold
   }


.wrapper.style2 h1, .wrapper.style2 h2, .wrapper.style2 h3, .wrapper.style2 h4, .wrapper.style2 h5, .wrapper.style2 h6 {
	color:#02aeef;
}

small {
	color: #bdbdbd;
   font-size:0.75em
	}

body {
	padding:0
   }

#header {
	/* border-bottom: 3px solid rgb(194,35,70); */
	line-height: 4em;
	height: 4em;
   font-family:Rubik,sans-serif
}

	#header .inner,
   #leaderboard .inner {
   	max-width: 1280px;
		margin: auto;
		position: relative;
      height:100%
	}

	#header.alt {
	   background: white;
	   border-bottom:1px solid #E5E5E5;
	   height: 164px;
	   top:0;
	   position:fixed
	}

	   #header.alt a {
	      color: #02aeef;
	   }

	#header + #banner,
	#header + #main {
	   margin-top: 0
	}


	#header h1 {
	   height: 100%;
	   left: 0 !important;
	   /* line-height: inherit; */
	   /* margin: 0; */
	   /* padding-bottom: 0; */
	   /* position: relative; */
	}

   #header + img {
   	 margin:163px 0 0 0
   }

#banner {
   margin-top: 164px;
   overflow: hidden;
}


	#header #logo {
	   height:50px;
	   vertical-align:middle
	   }

	#header.alt #logo {
		height:100%;
	   vertical-align:middle
   }

	#header a {
	   color: #02aeef;
	}

	#header.alt nav {
	   right: 2.5em;
	   line-height: 163px;
	}


.special {
	background:#EA6607;
   color:white;
   padding:40px
}

#main {
	font-size:18px;
   line-height:1.5;
   color:#666
   }

.hervorgehoben {
	color: #02aeef;
}

.button.special {
	background-color:#EA6607 !important;
   color:white !important;
   border:2px solid white;
   text-transform:none;
   font-weight:normal;
   font-family:Rubik,sans-serif;
   border-radius:2px;
   padding:0.3em 1em;
   height:auto;
   line-height:inherit;
   transition:all 0.5s
}

	.is-mobile .special .button {
   	font-size:0.75em
   }

.button.special:hover {
	color:#EA6607 !important;
   background-color:white !important;
   box-shadow:0 0 10px black;
   transform:scale(1.1,1.1)
}
	.button.special:hover:after {
		content: " >"
	}

.is-mobile .button { width:100%; margin:auto; display:block}
#header h1 {
	display:inline-block
}

#header h1 a {
	color: #C22346;
}

.features {
	flex-wrap:wrap
}

.features article {
   width:calc(33% - 1em)
}

.is-mobile .features article {
	width:100%
   }

.features > section::before{
	background-color: transparent
}

.wrapper.style1 input {
	background:white;
   color:#444
   }
.wrapper.style1 textarea {
	background:white;
   color:#444
   }

.wrapper.style2 input[type="checkbox"] + label::before, .wrapper.style2 input[type="radio"] + label::before,
.wrapper.style1 input[type="checkbox"] + label::before, .wrapper.style1 input[type="radio"] + label::before {
	background: white
}

.wrapper.style2 input[type="text"], .wrapper.style2 input[type="password"], .wrapper.style2 input[type="email"], .wrapper.style2 input[type="tel"], .wrapper.style2 input[type="search"], .wrapper.style2 input[type="url"], .wrapper.style2 select, .wrapper.style2 textarea {
	background:white
	}

#googleMap {
	width:100%;
	height:400px
   }

.mapthumbs p {
	margin: 1.5em 0 1em 0;
}

.videocontainer {
  position: relative;
  padding-bottom: 56.25%;
  width: 100%;
  margin-top:164px
}

.videocontainer video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

@media screen and (max-width:980px) {
	.spotlight .content,
	.spotlight .image {
	 width:100%;
	 }

	.spotlight .content p {
	   font-size:1em
	   }
}


#phoneButton, #mailButton {
	display:none
   }

.is-mobile #phoneButton {
	display:block;
	position: absolute;
	top: 0;
	right: 7em;
   padding: 0 1em
}

.is-mobile #mailButton {
	display:block;
	position: absolute;
	top: 0;
	right: 5em;
}

#footer {
	background:#02aeef;
	padding: 1em 0;
}

	#footer .menu {
	   position:static;
	   margin:0
	}

   	#footer .menu a {
      	color:white;
         border:none
      }

.thumbnails {
	 display:flex;
    flex-wrap:wrap;
    font-size:0.9em
}

	.thumbnails a {
	   color: #02aeef;
	   border:none
	   }

	.thumbnails p a{
	   color: inherit;
	   border:none
	   }

	   .thumbnails a:hover {
	      text-decoration:underline;
	      }

	   .thumbnails article {
	      background: linear-gradient(135deg, rgba(0,0,0,0) 0%,rgba(0,0,0,0.07) 100%);
	      padding: 1em;
	      height: calc(100% - 1em);
	      margin-bottom: 1em;
	   }



.posts {
	margin-top:10em
   }

.post .content,
.post .content h3
 {
	background:#02AEEF;
   color:white;
   text-align:center;
   border:none
   }

.post .image {
	margin-bottom:0;
   }

.post .content .button.special {
    background-color: #02AEEF !important;
    color: white !important;
    border: 2px solid white;
}

#leaderboard {
	height:200px;
	background: #02AEEF;
   background-size:cover;
   margin-top:163px
   }

   #leaderboard h1 {
	   line-height:200px;
	   color:white
	   }

      .is-mobile #leaderboard h1 {
      	font-size:1.25em;
         line-height:1.25em;
         margin: auto;
         padding:1em ;
         text-align:center
      }

   .is-mobile #leaderboard {
   	height:auto
   }

#navPanel {
	text-transform: none;
}

.flex {
	display:flex;
   flex-wrap:wrap
   }

#tagline {
	position: absolute;
	color: white;
	top: 20em;
	z-index: 1;
	line-height: 1.25;
	width:100%;
}

	#tagline > .inner {
   	width:1280px;
      margin:auto;
      max-width:90%
      }


	#tagline ul {
   	margin:0;
      padding:0;
		list-style: none;
		font-size: 1.5em;
   }

	#tagline ul li {
	   padding: 0 0.25em;
	   background: #EA6607;
	   width: max-content;
	   margin-bottom: 0.2em;
	   text-transform: uppercase;
	}
      	#tagline ul li:before {
         	content:"\f00c";
            font-family:FontAwesome;
            color: white;
            margin-right:0.25em
         }

   #tagline .button {
	   background-color: transparent;
	   color: white !important;
	   box-shadow: inset 0 0 0 1px white;
      margin-top:1em;
      display:inline-block;
      width:auto
      }
#tagline .button.special:hover {
	color#EA6607: ;
	color: #EA6607 !important;
}	  

      @media screen and (max-width:736px) {
      	#tagline {
         	position:static;
         }
            #tagline ul {
 	          	margin: 1em auto;
	            padding: 0;
	            list-style: none;
	            font-size: 1.5em;
	            display: table;
	         }

            #tagline .inner p {
            	display:none
               }
      }

@media screen and (max-width:1280px) {
	#header .button {
   	display:none
   }
}

#header nav > ul > li a::before {
	margin-right: 0.75em;
	background: #EA6607;
	padding: 0.9em;
	font-size: 1em;
	color: white;
}

#header nav > ul > li .button.icon {
	padding-left: 0;
   font-weight:500
}

#footer .button {
	float:right
   }
   
   dialog {
	width:400px;
	max-width:90%;
	z-index:100;
	position:absolute;
	top:10em;
	margin:auto;
	
}
#angebot-anfragen{
	display:none
}
.is-mobile #angebot-anfragen {
	display: block;
	top: 0em;
	position: absolute;
	left: 5em;
}

	.is-mobile .alt #angebot-anfragen {
		display:block;
		top: 3em;
		right: 1em;
		left:auto;
		position: absolute;
	}

	.alt #angebot-anfragen a {
		border: 1px solid #009cdd;
		padding: 1em;
		background: #eee;
		border-radius: 5px;
		font-size:0.75em
	}