body,form,figure{margin:0;padding:0}img{border:0}header,footer,nav,section,aside,article,figure,figcaption{display:block}body{font-size:100.01%}select,input,textarea{font-size:99%}#container,.inside{position:relative}#main,#left,#right{float:left;position:relative}#main{width:100%}#left{margin-left:-100%}#right{margin-right:-100%}#footer{clear:both}#main .inside{min-height:1px}.ce_gallery>ul,.content-gallery>ul{margin:0;padding:0;overflow:hidden;list-style:none}.ce_gallery>ul li,.content-gallery>ul li{float:left}.ce_gallery>ul li.col_first,.content-gallery>ul li.col_first{clear:left}.float_left,.media--left>figure{float:left}.float_right,.media--right>figure{float:right}.block{overflow:hidden}.media{display:flow-root}.clear,#clear{height:.1px;font-size:.1px;line-height:.1px;clear:both}.invisible{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.custom{display:block}#container:after,.custom:after{content:"";display:table;clear:both}
@media (max-width:767px){#wrapper{margin:0;width:auto}#container{padding-left:0;padding-right:0}#main,#left,#right{float:none;width:auto}#left{right:0;margin-left:0}#right{margin-right:0}}img{max-width:100%;height:auto}.audio_container audio{max-width:100%}.video_container video{max-width:100%;height:auto}.aspect,.responsive{position:relative;height:0}.aspect iframe,.responsive iframe{position:absolute;top:0;left:0;width:100%;height:100%}.aspect--16\:9,.responsive.ratio-169{padding-bottom:56.25%}.aspect--16\:10,.responsive.ratio-1610{padding-bottom:62.5%}.aspect--21\:9,.responsive.ratio-219{padding-bottom:42.8571%}.aspect--4\:3,.responsive.ratio-43{padding-bottom:75%}.aspect--3\:2,.responsive.ratio-32{padding-bottom:66.6666%}
/* pt-sans-narrow-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'PT Sans Narrow';
  font-style: normal;
  font-weight: 400;
  src: url('../../files/fonts/pt-sans-narrow-v18-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* pt-sans-narrow-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'PT Sans Narrow';
  font-style: normal;
  font-weight: 700;
  src: url('../../files/fonts/pt-sans-narrow-v18-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

* {
    padding:0;
    margin:0;
    text-size-adjust: none;
        -webkit-text-size-adjust: none;
        -moz-text-size-adjust: none;
        -ms-text-size-adjust: none;
}
html,
body {
    margin:0;
    padding:0;
}
img {
	max-width:unset;
}
body {
  font-family: 'Rubik';
  font-style: normal;
  font-weight: 400;
  color:#000000;
    font-family: 'PT Sans Narrow';
}
.max-width {
	max-width:1400px;
	padding-left:20px;
	padding-right:20px;
	box-sizing:border-box;
	margin-left:auto;
	margin-right:auto;
}
.max-width-small {
	max-width:740px;
	padding-left:20px;
	padding-right:20px;
	box-sizing:border-box;
	margin-left:auto;
	margin-right:auto;
}
.social-wall {
	max-width:900px;
	padding-left:20px;
	padding-right:20px;
	box-sizing:border-box;
	margin-left:auto;
	margin-right:auto;
	margin-top:100px;
}
.blau {
	color:#009fe3;
}
h2 {
	text-transform:uppercase;
}
header {
	z-index:50;
	width:100%;
	top:0;
	position:fixed;
	display:inline-block;
	text-transform:uppercase;
	padding-top:20px;
}
.smaller header {
	background-color: rgba(255,255,255,0.8);
}
header a,
header strong{
	color:#ffffff;
	text-decoration:none;
	padding:2px 4px;
	font-size:18px;
	font-weight:400;
}
header nav a,
header nav strong,
header .menu-onepage a,
header .menu-onepage strong,
header a.social{
	background-color:#009fe3;
}
.logo {
	max-width: 200px;
	position: relative;
	margin-left: auto;
	margin-right: auto;
	width: 100%;
	display: block;
	background-color: transparent;
}
.logo img {
	width:100%;
}
.header-left {
	float:left;
}
.header-right {
	float:right;
}
header nav li,
header .menu-onepage li{
	display:inline-block;
}
.header-right a.social {
	width: 100%;
	display: inline-block;
	padding-right: 30px;
	height: 40px;
	margin-bottom:10px;
}
.header-right a.social img{
	width: 30px;
	height: 30px;
	margin-top: 5px;
	box-sizing: border-box;
	float: left;
}
.header-right a.social span {
line-height: 40px;
font-size: 25px;
padding-left: 7px;
}
.header-right a.social img {
	width:30px;
	height:30px;
}
.header-right .menu-kontakt {
	float:left;
}
.header-right-right {
	float:right;
	margin-left:20px;
	margin-top:-10px;
}
.header-right-right a {
	width: 100%;
	display: inline-block;
	padding-right: 30px;
}
header nav a,
header nav strong,
header .menu-onepage a,
header .menu-onepage strong{
display:inline-block;
}
.menu ul li {
	float:left;
	margin-right:10px;
}
header .menu-jobs li {
	width:100%;
}
header .menu {
	margin-left:50px;
}
header .menu li,
header .menu-kontakt li{
	border: 1px solid #ffffff;
}
/*
body.smaller .logo a{
	  overflow: hidden;
  position: relative;
  display: inline-block;
}
body.smaller .logo img {
	margin-top: -104px;
  transition:all ease 1s;
}
*/
body.nav-open .logo img,
body.smaller .logo img {
  width: 200px;
  height: 35px;
  object-fit: cover;
  object-position: bottom;
  padding-top: 120px;
margin-top: -120px;
  transition:margin ease 0.75s;
}
/*body.smaller .social span,*/
body.smaller header .menu-jobs {
	display:none;
}
/* footer */
footer {
	background-color:#009fe3;
	color:#ffffff;
	text-align:center;
	padding-top:1em;
	padding-bottom:1em;
	font-size:16px;
}
footer a{
	color:#ffffff;
	text-decoration:none;
}
footer nav {
	margin-top:1em;
}
footer nav li {
	display:inline-block;
}
footer nav li:not(:last-child)::after {
    content: ' • ';
    font-size:16px;
}
footer nav a,
footer nav strong {
	font-weight:400;
}
/* content */
.bg-1:after {
background: url("/files/img/filip-zrnzevic-349221-unsplash.jpg") top center;
  background-color: rgba(0, 0, 0, 0);
  background-size: auto;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
content: "";
position: fixed;
min-height: 100vh;
width: 100%;
top: 0;
right: 0;
left: 0;
z-index: -1;
background-color: white;
}
.bg-1.opacity:after {
	opacity:0.4;
}
.bg-2:after {
background: url("/files/img/kalen-emsley-Bkci_8qcdvQ-unsplash.jpg") top center;
  background-color: rgba(0, 0, 0, 0);
  background-size: auto;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
content: "";
position: fixed;
min-height: 100vh;
width: 100%;
top: 0;
right: 0;
left: 0;
z-index: -1;
background-color: white;
}
.bg-2.opacity:after {
	opacity:0.4;
}
.bg-3:after {
background: url("/files/img/ales-krivec-N-aTikX-b00-unsplash.jpg") top center;
  background-color: rgba(0, 0, 0, 0);
  background-size: auto;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
content: "";
position: fixed;
min-height: 100vh;
width: 100%;
top: 0;
right: 0;
left: 0;
z-index: -1;
background-color: white;
}
.bg-3.opacity:after {
	opacity:0.4;
}
.bg-1,
.bg-2,
.bg-3,
.aufgabengebiete {
	min-height:100vh;
}
.spruch {
color: #ffffff;
font-size: 45px;
/*margin-top: 400px;*/
margin-top:45vh;
line-height: 48px;
text-align: center;
max-width: 266px;
}
.spruch .small {
  font-size: 14px;
  line-height: initial;
  margin-top: 1em;
}
.aufgabengebiete {
background: url("/files/img/bg-berg.png") top center;
  background-color: rgba(0, 0, 0, 0);
  background-size: auto;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
content: "";
/*position: fixed;*/
/*min-height: calc(100vh + 250px);*/
min-height: calc(100vh + 38vh);
width: 100%;
/*top: 0;
right: 0;
left: 0;
z-index: -1;
background-color: white;*/
margin-top:-38vh;
}
.bg-berg-2 {
background: url("/files/img/bg-berg-2.png") top center;
  background-color: rgba(0, 0, 0, 0);
  background-size: auto;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
content: "";
min-height: calc(100vh + 38vh);
width: 100%;
margin-top:-38vh;
position:relative;
}
h2 {
	font-size:35px;
	color:#009fe3;
}
h3 {
	font-size:16px;
	color:#009fe3;
}
h2, h3, h4 {
	font-weight:400;
}
.headline-berg {
	float:right;
	/*margin-top:170px;*/
	margin-top:23vh;
	margin-right:300px;
}
.headline-berg-2 {
	margin-top: 23vh;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	max-width: calc(100% - 500px);
	width: 100%;
}
.abschnitt {
	padding-bottom:100px;
	box-sizing:border-box;
}
.content-leistungen {
	padding-top:100px;
	padding-bottom:100px;
}
.bg-3.abschnitt,
.leistungen.bg-white:first-of-type .content-leistungen,
.content-text{
	padding-top:250px;	
}
.content-basic {
	padding-top:120px;
}
.content-leistungen h2,
.content-basic h2,
.content-text h2 {
border: 2px solid #009fe3;
color: #000000;
display: inline-block;
padding: 0 2px;
line-height: 1em;
font-weight: 400;
margin-bottom: 16px;
}
.col-3 {
	
}
.bg-white {
	background-color:rgba(255,255,255,0.5) !important;
}
.leistungen.bg-white:nth-child(even) {
	background-color:rgba(255,255,255,0.7);
}
.leistungen.bg-white:nth-child(odd) {
	background-color:transparent;
}

.headline-main {
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	max-width: calc(100% - 40px);
	width: 100%;
}
.headline-main a {
	text-decoration:none;
}
.content-kontakt .headline-main h3 {
	margin-bottom:20px;
}
.content-kontakt .headline-main h4 {
	color: #009fe3;
	background-color:transparent;
	border:1px solid #009fe3;
	margin-bottom:10px;
	display:inline-block;
}
.content-kontakt .headline-main h4 a {
	color: #009fe3;
	min-width:174px;
	display:inline-block;
}
.content-text a{
	text-decoration:none;
	color:#009fe3;
}
.content-text {
	padding-bottom:100px;
}
.content-text p{
	padding-bottom:1em;
}
.hexGrid-wrapper {
width: 100%;
position: relative;
margin-top: 100px;
display: inline-block;
}
.hexGrid-wrapper-left {
  width: 250px;
	position: absolute;
  margin-top: -120px;
  display: inline-block;
  overflow: hidden;
}
.content.hexGrid-wrapper {
margin-top: 50px;
margin-bottom:350px;
}
.content-leistungen .hexGrid-wrapper,
.content-kontakt .hexGrid-wrapper {
margin-top: 50px;
margin-bottom:0;
}
.hexGrid-wrapper.hexGrid-einzeilig {
	margin-top: 50px;
	margin-bottom:50px;
}
#hexGrid {
	max-width:700px;
	margin-left:auto;
	margin-right:auto;
	width:100%;
}
.content-kontakt #hexGrid {
	overflow:visible;
}
.hexGrid-wrapper-left #hexGrid {
	width:700px;
}
/* Hexagons */
#hexGrid {
  overflow: hidden;
  width: 100%;
  margin: 0 auto;
  padding: 0.866% 0;
  font-size: 15px;
}

#hexGrid:after {
  content: "";
  display: block;
  clear: both;
}

.hex {
  position: relative;
  list-style-type: none;
  float: left;
  overflow: hidden;
  visibility: hidden;
  outline: 1px solid transparent;  /* fix for jagged edges in FF on hover transition */
  transform: rotate(-60deg) skewY(30deg) translatez(-1px);
}

.hex * {
  position: absolute;
  visibility: visible;
  outline: 1px solid transparent;  /* fix for jagged edges in FF on hover transition */
}

.hexIn {
  display: block;
  width: 100%;
  height: 100%;
  text-align: center;
  color: #fff;
  overflow: hidden;
  transform: skewY(-30deg) rotate(60deg);
}


/*** HEX CONTENT **********************************************************************/

.hex img {
  left: -100%;
  right: -100%;
  width: auto;
  height: 100%;
  margin: 0 auto;
}
/*
.hex h1,
.hex p {
  margin: 0;
  width: 102%;
  left: -1%; */ /* prevent line on the right where background doesn't cover image */
  /*
  padding: 5%;
  box-sizing: border-box;
  background-color: rgba(0, 128, 128, 0.8);
  font-weight: 300;
  transition: transform .2s ease-out, opacity .3s ease-out;
}
*/
.hex p {
	font-size:22px;
	font-weight:bold;
	position:relative;
	margin-bottom:10px;
}
.hex br {
	position:relative;
}
h4 {
background-color: #009fe3;
border: 1px solid #ffffff;
color: #ffffff;
text-decoration: none;
padding: 2px 4px;
font-size: 18px;
position: relative !important;
display: inline-block;
}
.headline-wrapper.content h4 {
	border: 1px solid #009fe3;
	background-color:transparent;
}
.headline-wrapper {
  /*bottom: calc(50% - 10px);
  padding-top: calc(50% - 10px);*/
  /*
  bottom: calc(50% - 18px);
  z-index: 1;
  width:100%;
  padding-left:10px;
  padding-right:10px;
  box-sizing:border-box;*/
}
.headline-wrapper {
	  z-index: 1;
  width:100%;
  padding-left:10px;
  padding-right:10px;
  box-sizing:border-box;
position: absolute;
top: 50%;
transform: translateY(-50%);
}
.headline-wrapper img {
	left: initial;
right: initial;
position: relative;
width: 30px;
height: 30px;
margin-bottom: 10px;
}
.content-kontakt .headline-wrapper img {
width: auto;
height: 70px;
margin-bottom: 10px;
}
/*
.hex h1 {
  bottom: 50%;
  padding-top: 50%;
  font-size: 1.5em;
  z-index: 1;
  transform: translateY(-100%) translatez(-1px);
}

.hex h1:after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 45%;
  width: 10%;
  text-align: center;
  border-bottom: 1px solid #fff;
}

.hex p {
  top: 50%;
  padding-bottom: 50%;
  transform: translateY(100%) translatez(-1px);
}
*/


/*** HOVER EFFECT  **********************************************************************/

/*
.hexIn:hover h1, .hexIn:focus h1, .hexIn:hover p, .hexIn:focus p {
  transform: translateY(0%) translatez(-1px);
}
*/


/*** SPACING AND SIZING *****************************************************************/

@media (min-width:601px) {  /* <- 2-3  hexagons per row */
  .hex {
    width: 32.666%;    /* = (100-2) / 3 */
    padding-bottom: 37.720%;    /* =  width / sin(60) */
  }
  .hex:nth-child(6n+4),
  .hex:nth-child(6n+5){
    transform: translateX(50%) rotate(-60deg) skewY(30deg);
  }
   .hex:nth-child(6n+6){
    transform: translateX(100%) rotate(-60deg) skewY(30deg);
  }
  .hex:nth-child(6n+4),
  .hex:nth-child(6n+5) {
    margin-top: -8.564%;
    margin-bottom: -8.564%;
  }
  .hex:nth-child(6n+4) {
    margin-left: 0.5%;
  }
  .hex:nth-child(6n+4),
  .hex:nth-child(6n+6) {
    clear: left;
  }
  .hex:nth-child(5n+2),
  .hex:nth-child(5n+5),
  .hex:nth-child(5n+6){
    margin-right: 1%;
    margin-left: 1%;
  }
  .hex:nth-child(5n+4){
    margin-left: 0.5%;
  }
}


@media (max-width: 600px) {  /* <- 1-2  hexagons per row */
  .hex {
    width: 49.5%;    /* = (100-1) / 2 */
    padding-bottom: 57.158%;    /* =  width / sin(60) */
  }
  .hex:nth-child(3n+1) {
    transform: translateX(50%) rotate(-60deg) skewY(30deg);
  }
  .hex:nth-child(3n+2),
  .hex:nth-child(3n+3) {
    margin-top: -13.423%;
    margin-bottom: -13.423%;
  }
  .hex:nth-child(3n+1) {
    margin-left: 0.5%
  }
  .hex:nth-child(3n+3) {
    margin-left: 1%;
  }
  .hex:nth-child(3n+2),
  .hex:nth-child(3n+4) {
    clear: left;
  }
}

@media (max-width: 400px) {
  #hexGrid {
    font-size: 13px;
  }
}

/* End Hexagons */
.header.mobile {
	display:none;
}
a.social,
.menu-jobs a {
	padding:2px 8px;
}
.header-right a.social span {
	padding-right:8px;
}
.hexGrid-wrapper-left.mobile {
	display:none;
}
@media only screen and (max-width: 1440px) {
}

@media only screen and (max-width: 1024px) {
.hexGrid-wrapper-left {
  margin-top: 0px;
}
.headline-berg-2 {
  margin-top: 23vh;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  max-width: 100%;
  width: auto;
  float: right;
}
}

@media only screen and (max-width: 850px) {
	.header.desktop {
		display:none;
	}
	.header.mobile {
		display:block;
	}
	.sidebar {
  width: 202px;
  float: right;
  background-color: rgba(255,255,255,0.5);
  position: absolute;
  top: 0;
  bottom: 0;
	right: -202px;
  z-index: 10;
  min-height: 100vh;
  margin-top: -20px;
	transition:all ease 1s;
	}
	.logo {
		float: left;
		padding-left: 20px;
		/*max-width:175px;*/
	}
	.header-right {
		z-index: 20;
		position: relative;
	}
	.header-left {
  float: left;
  margin-top: -29px;
}
.menu-btn {
	writing-mode: vertical-lr;
margin-left: -27px;
margin-top: 24px;
background-color: #009fe3;
color: #ffffff;
text-decoration: none;
padding: 4px 2px;
font-size: 18px;
font-weight: 400;
cursor: pointer;
}
.menu-kontakt {
	padding-left: 10px;
}
.menu-jobs {
	  margin-top: 63px;
  width: 100%;
}
.menu-jobs a {
	width:100%;
}
header .menu{
  margin-left: 10px;
}
header .menu li, header .menu-kontakt li {
	float:left;
	clear:both;
	margin-bottom:7px;
}
body.nav-open .sidebar {
	right: 0;
	transition:all ease 1s;
}
body.nav-open .header-right-right {
margin-right: 0;
	transition:all ease 1s;
}
.header-right-right {
margin-right: -157px;
	transition:all ease 1s;
}
body.smaller header {
	background-color:transparent;
}
.header-right a.social {
	padding-right: 18px;
}
body.smaller header .menu-jobs {
	display:block;
}
.aufgabengebiete {
  min-height: calc(100vh + 100px);
  margin-top: -100px;
}
.spruch {
  font-size: 35px;
  margin-top: 230px;
  line-height: 38px;
  max-width: 266px;
  padding-bottom: 160px;
}
.bg-1 {
	min-height:auto;
}
#hexGrid {
	overflow: visible;
	padding-bottom:60px;
}
.headline-berg {
margin-top: 152px;
margin-right: 50px;
}
.bg-berg-2 {
  background: url("/files/img/bg-berg-2.png") top center;
    background-color: rgba(0, 0, 0, 0);
    background-size: auto;
  background-color: rgba(0, 0, 0, 0);
  background-size: auto;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  content: "";
  min-height: calc(100vh + 38vh);
  width: 100%;
  margin-top: -38vh;
  position: relative;
}
.bg-berg-2 .social-wall {
overflow-x: scroll;
height: calc(100vh);
margin-top: 50px;
}
.bg-berg-2.abschnitt {
	padding-bottom:0;
}
.headline-berg-2 {
  margin-top: 30vh;
}
}
@media only screen and (max-width: 740px) {
.hexGrid-wrapper-left #hexGrid {
  width: calc(100vw - 40px);
}
}
@media only screen and (min-width: 600px) and (max-width: 1024px){
.headline-main.kontakt {
float: right;
width: auto;
}
.hexGrid-wrapper-left.kontakt {
  margin-top: -30px;
  margin-bottom: -80px;
  position: relative;
}
}
@media only screen and (max-width: 680px) {
.headline-berg {
  margin-top: 125px;
}
}
@media only screen and (max-width: 600px) {
.headline-berg {
  margin-top: 185px;
}
.hexGrid-wrapper-left.desktop {
	display:none;
}
.hexGrid-wrapper-left.mobile {
  display: inline-block;
  width: 100%;
  position: relative;
  margin-top: 50px;
}
.hexGrid-wrapper-left.mobile #hexGrid {
  width: 100%;
}
.headline-berg-2 {
	float:none;
}
.hexGrid-wrapper-left.kontakt {
  width: 100%;
  position: relative;
  margin-top: 0;
  display: inline-block;
  overflow: hidden;
}
.hexGrid-wrapper-left.kontakt #hexGrid {
	padding-bottom:40px;
}
}
@media only screen and (max-width: 500px) {
	.headline-berg {
  margin-top: 145px;
  margin-right: 0;
  width: 100%;
}
}
@media only screen and (max-width: 450px) {
	.logo {
		position:absolute;
		width:100%;
		max-width:200px;
	}
	.headline-berg {
	  margin-top: 135px;
	  margin-right: 0;
	  width: 100%;
	  text-align:center;
	}
}
@media only screen and (maxheight: 400px) {
.aufgabengebiete {
  min-height: calc(100vh + 100px);
  margin-top: -100px;
}
.spruch {
  font-size: 35px;
  margin-top: 230px;
  line-height: 38px;
  max-width: 266px;
  padding-bottom: 160px;
}
.bg-1 {
	min-height:auto;
}
}
