/* http://meyerweb.com/eric/tools/css/reset/
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1.2em;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

@font-face {
  font-family: 'AauxNextMedium';
  src:  url('/assets/fonts/AauxNextMedium-Regular.woff2') format('woff2'),
        url('/assets/fonts/AauxNextMedium-Regular.woff') format('woff');
}

@font-face {
  font-family: 'AauxNextSemibold';
  src:  url('/assets/fonts/AauxNextSemibold-Regular.woff2') format('woff2'),
        url('/assets/fonts/AauxNextSemibold-Regular.woff') format('woff');
}

@font-face {
  font-family: 'AauxNextBold';
  src:  url('/assets/fonts/AauxNextBold-Regular.woff2') format('woff2'),
        url('/assets/fonts/AauxNextBold-Regular.woff') format('woff');
}

:root {
	--green-dark: #4e5535;
	--green-light: #e4e3de;
	--red: #de3414;
	--headline1-size: calc(1rem + 2.5vw);
	--headline2-size: calc(1rem + 1.0vw);
	--headline3-size: calc(1rem + 0.3vw);
	--headline4-size: calc(1rem + 0.2vw);
	--headline5-size: calc(1rem + 0.2vw);
	--headline6-size: calc(1rem + 0.2vw);
	--paragraph-size: calc(1rem + 0.15vw);
	--small-paragraph-size: calc(0.8rem + 0.2vw);
  --header-height: 100px;
}

@media screen and (min-width: 768px) {
  :root {
    --header-height: 100px;
  }
}

body, nav, ul, li, a  {margin: 0; padding: 0;}

* { box-sizing: border-box; }

html {
  min-height:100%;
  scroll-behavior: smooth;
}

body {
/*  min-height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  min-height: 100vh;*/
  display: grid;
  grid-template-columns: auto 0px;
}

main {
    flex-grow: 1;
}

header, footer {
    flex-shrink: 0;
}

body {
	font-family: AauxNextMedium;
	color: var(--green-dark);
	-webkit-font-smoothing: antialiased;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.004);
  	-moz-osx-font-smoothing: grayscale;
	-webkit-text-stroke: 0.45px rgba(0, 0, 0, 0.1);
}

h1, .h1 { font-size: var(--headline1-size); font-family: AauxNextBold; line-height: 1.1; font-weight:normal;   }
h2, .h2 { font-size: var(--headline2-size); font-family: AauxNextBold; line-height: 1.1; font-weight:normal;    }
h3, .h3 { font-size: var(--headline3-size); font-family: AauxNextBold; line-height: 1.3; font-weight:normal;    }
h4, .h4 { font-size: var(--headline4-size); font-family: AauxNextBold; line-height: 1; font-weight:normal;   }
h5, .h5 { font-size: var(--headline5-size); font-family: AauxNextBold; line-height: 1; font-weight:normal;   }
h6, .h6 { font-size: var(--headline6-size); font-family: AauxNextBold; line-height: 1; font-weight:normal;   }


header {
  margin: 20px 0;
  position: absolute;
  z-index:999;
  width:100%;
}


a.logo {
  max-width:270px;
  display:block;
  position: relative;
}

@media screen and (min-width: 1320px) {
  a.logo { margin-left:-24px; }
}

a.logo svg {
	position: absolute;
	margin-top: 0px;
}

.header-on-white-background .logo-path { fill: var(--green-dark); }
.header-on-dark-green-background .logo-path { fill: #FFF; }
.header-on-light-green-background .logo-path { fill: var(--green-dark); }
.header-on-red-background .logo-path { fill: #FFF; }


.header-nav {
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
}

p {
	padding-top: 0px;
	margin-top: 0px;
  margin-bottom: 1vw;
	font-size: var(--paragraph-size);
	line-height: 1.3;
}

main ul {
	font-size: var(--paragraph-size);
	line-height: 1.2;
}

main ul li {
	padding:14px 0;
}

main ul li p {
	margin-bottom: 0px;
}

main .white-background ul li { border-top: 1px solid var(--green-dark); }
main .red-background ul li { border-top: 1px solid #FFFFFF; }
main .light-green-background ul li { border-top: 1px solid var(--green-dark); }
main .dark-green-background ul li { border-top: 1px solid #FFFFFF; }

main .white-background ul { border-bottom: 1px solid var(--green-dark); }
main .red-background ul { border-bottom: 1px solid #FFFFFF; }
main .light-green-background ul { border-bottom: 1px solid var(--green-dark); }
main .dark-green-background ul { border-bottom: 1px solid #FFFFFF; }


main ul li strong {
	display:block;
	font-family: AauxNextBold;
}

section {
	/* width: 100%; */
	padding: 10vmin 2vmin;
	overflow:hidden;
  position: relative;
}

.row + .row{ padding-top: 3vmax; }

/*.row > * {
  margin-top:4vmax;
}*/

.row > .col-cta {
	margin-top: 1vmax;
}

section.light-green-background + section.light-green-background { padding-top: 0; }
section.dark-green-background + section.dark-green-background { padding-top: 0; }
section.white-background + section.white-background { padding-top: 0; }
section.red-background + section.red-background { padding-top: 0; }

main section:first-child{
  padding-top:calc(var(--header-height) + 9vmax);
}
main section:first-child > div{
  padding-top:0px;
}


section.white-background {background-color:#FFF; color: var(--green-dark); }
section.white-background .button{background-color:var(--green-dark);color: #FFF}


section.light-green-background {background-color:var(--green-light);}

section.red-background {background-color:var(--red); color: white;}
section.red-background .button{color:var(--red);}

section.dark-green-background {background-color:var(--green-dark);}
section.dark-green-background * {color:white;}
section.dark-green-background .button{background-color:#FFF;color: var(--green-dark)}

section.with-background {
  background-color:transparent;
}

section.fullscreen {
  overflow: hidden;
  position: relative;
  display:flex;
  justify-content: center;
  align-items: center;
  min-height: 70vmin;
}

@media screen and (min-width: 1025px) {
  section.fullscreen {
	  height: 80vmin;
  }
}

section.with-green-overlay {
  overflow:hidden;
}

section  > .fullscreen-background {
	background: no-repeat center center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
		background-color:var(--green-dark);

	height: 100%;
	width: 100%;
	position: absolute;
	top: 0px;
	right: 0px;
	bottom: 0px;
	left: 0px;
	z-index: -1;
}

section.with-green-overlay > .fullscreen-background {
	filter: brightness(45%) sepia(70%) hue-rotate(28deg) saturate(200%) contrast(0.6);
		background-color:var(--green-dark);

}

section.with-green-overlay {
	color: white;
}





section.white-background a { color: var(--green-dark); text-decoration-color:var(--green-dark) ;   }
section.light-green-background a { color: var(--green-dark); text-decoration-color: var(--green-dark); }
section.dark-green-background a { color: var(--green-light); text-decoration-color: var(--green-light); }
section.red-background a { color: #FFF; text-decoration-color: #FFF;}


.container-xl {
/* padding-left: 2vmin;
padding-right: 2vmin; */
}

.container-xl.pulled-right .blogposts_grid  {
	margin-right: -7vw;
	max-width: 110vw;
	mask-image: -webkit-gradient(linear, left 100%, right 100%, from(rgba(0,0,0,1)), to(rgba(0,0,0,0)));
	-webkit-mask-image: -webkit-gradient(linear, left 100%, right 100%, from(rgba(0,0,0,1)), to(rgba(0,0,0,0)));
}

a.article {
	color:inherit;
	text-decoration:none;
}
.article_grid {
  margin-top: 3vw;
}

.article_grid article {
    margin-bottom:20px;
}


.article_grid article img{
    margin-bottom:10px;
}


@media screen and (min-width: 768px) {
	.article_grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 20px;
  }
}

.article_grid .button {
	margin-top: 10px;
}

.article_grid article > a { text-decoration: none; }

.article-head {
	margin: 20px 0;
}
article * + * {
	padding-top: 10px;
}

article figure {
	 margin-bottom: 20px;
}

.blogposts_grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-gap: 20px;
}
@media screen and (max-width: 768px) {
.blogposts_grid {
  grid-template-columns: repeat(2, 1fr);
}}

/* .blogposts_grid .article:nth-child(1),
.blogposts_grid .article:nth-child(4)  {
  grid-column: span 2;
  grid-row: span 2;
} */

@media screen and (max-width: 768px) {
	  .blogposts_grid p {
      display:none;
    }

}

.blogposts_grid .article img {
  margin-bottom: 1.2vw;
}

article p.intro_text {
  display:none;
}

.article_grid article:nth-child(1),
.article_grid article:nth-child(5),
.article_grid article:nth-child(7)  {
  grid-column: span 2;
  grid-row: span 2;
}

.article_grid article:nth-child(1) p.intro_text,
.article_grid article:nth-child(5) p.intro_text,
.article_grid article:nth-child(7) p.intro_text  {
  display:block;
}


@media screen and (min-width: 1040px) {
	.container-xl.container-indent {
		padding-left: 13vmin;
		padding-right: 13vmin;
		max-width: auto;
	}
}

/* .col > * + * {
	margin-bottom:2vmin;
} */

.col-xs-12 {
  /* margin-bottom: 3vw; */
}

/*@media screen and (max-width: 768px) {
  .col-is-empty {
    display:none;
  }
}*/

section.fullscreen .row:first-child() {
		height: 100%;
    justify-content: center;
    align-items: center;
    display: flex;
}
section.header > div {
	height: 100%;
    justify-content:flex-end;
	flex-direction:column;
    align-items: left;
    display: flex;
}

section h1 strong {
	font-size:var(--paragraph-size);
	text-transform:uppercase;
}

section.fullscreen {
  display: flex;
  align-items: flex-end;
}

.fullscreen .col-lg-12 h1 strong{ font-size:inherit; text-transform:none; font-family: AauxNextMedium; font-weight: normal; display: block; }
h2 strong{ text-transform:uppercase; font-family: AauxNextMedium; font-weight: normal; font-size: max(0.8rem, 45%); display:block;width: 100%;margin-bottom: 10px}
h3 strong{ text-transform:uppercase; font-family: AauxNextMedium; font-weight: normal; font-size: 50%; display:block;width: 100%;margin-bottom: 10px}


.fullscreen .col-lg-12 h1 { text-align:center; }

section h1:after {
	content:"";
	width:30%;
	height:1px;
	display:block;
	margin-top:4vmin;
}

section.white-background h1:after { background-color:var(--green-dark) }
section.dark-green-background h1:after { background-color:#FFF; }
section.light-green-background h1:after { background-color:var(--green-dark) }
section.red-background h1:after { background-color:#FFF; }
section.fullscreen .col-lg-12 h1:after { display:none; }


p.large-text {
  font-size: var(--large-paragraph-size);
}

p.small-text {
	font-size: var(--small-paragraph-size);
  }

.img-responsive {
	width: 100%;
	height: auto;
}

/* @media screen and (max-width: 468px) {
	.block-type-image {
    max-width: 30%;
    float: right;
    margin-left: 4vmin;
  }
} */

.block-type-image figure {
  line-height:0;
}


.blocks .block + .block { margin-top:20px; }

/* .blocks .block-type-heading + .block-type-text { margin-top:1vmax; } */

header .call2action {
	background: var(--green-light);
	color: var(--green-dark);
	padding: 4px 15px 4px 15px;
	border-radius: 400px;
	display: inline-block;
	text-decoration: none;
}

header.header-on-light-green-background .call2action{
	background: #FFFFFF;
	color: var(--green-dark);
}

header .row > * {
    margin-top: 1vmax;
}

/* cards */

.card {
	padding-bottom: 0vmin;
	margin-bottom:2vmin;
	height:100%;
	display:block;
	transition: all .2s ease-in-out;
	text-decoration: none;
	color:inherit;
}

.card:hover {
	transform: scale(1.05);
}


.card *:not(img) {
	padding: 2vmin 3vmin 0 3vmin;
}

.white-background .card {
	background-color:var(--green-light);
}

.light-green-background .card {
	background-color:#FFF;
}

@media (max-width: 1200px) {
	.col-lg-12 .card img {
		max-width: 50%;
		float:left;
		margin-right:2%
	}
}

.button {
}

a.button {
	transition: all .3s ease-in-out;
	width: auto;
	background: white;
	border-radius: 100vh;
  padding: 18px 32px;
	text-decoration: none;
	color: inherit;
	display: inline-block;
}

@media screen and (min-width: 768px) {
	a.button {
	  padding: 12px 60px;
  }
}

a.button:after {
	content:'→';
	padding-left: 10px;
}

a.button:hover {
	transform: scale(1.1);
}


.content-icon-wrapper {
	display:flex;
	justify-content: center;
  height:100px;
}
@media screen and (max-width: 991px) {
	  .content-icon-wrapper {

    float: right;

    width: 100px;
    height: 100%;
    }

}

.content-icon-wrapper svg {
    position: relative;
    /* height:100px; */
    height:100px;
}

@media screen and (max-width: 768px) {
  .content-icon-wrapper {
    width:80px;
  }
	.content-icon-wrapper svg {
    height:80px;
  }

}

.light-green-background .content-icon-wrapper svg .cls-1,
.light-green-background .content-icon-wrapper svg path {
  fill: var(--green-dark);
}
.dark-green-background .content-icon-wrapper svg .cls-1,
.dark-green-background .content-icon-wrapper svg path {
  fill: #FFF;
}
.red-background .content-icon-wrapper svg .cls-1,
.red-background .content-icon-wrapper svg path {
  fill: #FFF;
}
.white-background .content-icon-wrapper svg .cls-1,
.white-background .content-icon-wrapper svg path {
  fill: var(--green-dark);
}

h2.with-icon { position: relative;}
h2.with-horizontal-line {border-bottom:1px solid var(--green-dark); padding-bottom:5vmin;}

h2 .content-icon {
	top:0px;
	right:0px;
	position: absolute;
}

.light-green-background .content-icon-wrapper .cls-1{ fill: #FFF }
.white-background .content-icon-wrapper .cls-1{ fill: var(--green-dark) }

.gotop {
	position: sticky;
	right: 20px;
	bottom: 0px;
	padding-bottom: 20px;
	margin-top: calc(100vh + 50px);
	place-self: end
}

.gotop a {
	/* visual styling */
  text-decoration: none;
  padding: 10px 20px;
  font-family: sans-serif;
  color: #fff;
  background: var(--green-dark);
  border-radius: 100px;
  white-space: nowrap;
  z-index: 999999;
  float: right;
  margin-top: 50px;
  border: 1px solid white;
}

.gotop a:hover {
	cursor: pointer;
}

footer {
	background: var(--green-dark);
	color: white;
}

footer a {
  color: #FFFFFF;
  text-decoration: underline;
  line-height:1.3
}

footer a.social-icon-link {
  text-decoration: none;
  margin-right:10px;
}

footer .social-links a { text-decoration: none; margin-right: 15px;}

footer .social-links a svg path { fill: #FFFFFF; }
footer .social-links a svg { transition: all .3s ease-in-out;  }
footer .social-links a:hover svg  { scale: 1.3;  }
footer .social-links a:hover svg path { fill: var(--green-light); }

@media screen and (max-width: 768px) {
	footer .row > div {
    margin-bottom:20px;
    margin-top: 0px;
  }
}

footer .row > * {
  margin-top: 0px;
}

address {
	font-size: var(--small-paragraph-size);
	line-height: 1.3;
}

.social-icon {
	transition: all .2s ease-in-out;
	width: 40px;
	height: 40px;
}

@media screen and (min-width: 768px) {
	.social-icon {
		width: 25px;
		height: 25px;
	}
}

.icon-background {
	fill: white;
}

.linkedin {
  fill: var(--green-dark);
}

a:hover .social-icon {
	transform: scale(1.1);
}

a:hover .icon-background {
	fill: var(--green-light);
}

/* Helper Classes */
.align-right {
  display: flex;
  justify-content: flex-end;
}

.align-center {
  display: flex;
  justify-content: center;
}

@media screen and (max-width: 768px) {
  .hide-on-mobile {
    display: none;
  }
}



@media screen and (min-width: 768px) {

  .grid-layout-one {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
    grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
    gap: 0px 35px;
    grid-auto-flow: row;
  }
  .grid-block-1 { grid-area: 1 / 1 / 5 / 7; }
  .grid-block-2 { grid-area: 6 / 2 / 12 / 6; }
  .grid-block-3 { grid-area: 1 / 7 / 7 / 11; }
  .grid-block-4 {
	  grid-area: 8 / 5 / 11 / 10;
	  background: var(--green-dark);
	  color: #FFF;
	  padding:2em;
  }
}

@media screen and (max-width: 767px) {
  .grid-layout-one > div {
    margin-bottom:20px;
  }
  .grid-block-2,
  .grid-block-3 {
    width: 48%;
    float:left;
  }

  .grid-block-2 {
    margin-right:4%;
  }
  .grid-block-2 img,
  .grid-block-3 img {
    object-fit: cover;
    height: 250px;
  }
}

.joboffer {
  border-top:1px solid;
  padding:20px 0px;
}

.block-type-video iframe {
  aspect-ratio: 16 / 9;
  width: 100%;
}
