@charset "UTF-8";
/* CSS Document */
@import 'fonts.css';

/* reset */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,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 { border:0; font-size:100%; margin:0; padding:0; }
a { outline:none; }
table { border-collapse:collapse; border-spacing:0; }
fieldset,img { border:0; }
del,ins { text-decoration:none; }
caption,th { text-align:left; }
h1,h2,h3,h4,h5,h6 { font-size:100%; font-weight:normal; }
q:before,q:after { content:''; }
abbr,acronym { border:0; font-variant:normal; }
sup,sub { vertical-align:baseline; }
legend { color:#000; }
input,button,textarea,select,optgroup,option { font-family:inherit; font-size:inherit; font-style:inherit; font-weight:inherit; }
input,button,textarea,select { font-size:100%; }

/* Clearfix */
.clearfix:before, .clearfix:after {content: " "; display: table;}
.clearfix:after {clear: both;}
/*.clearfix {*zoom: 1;} removed, is depricated and not longer neccessary*/

*, *:before, *:after {padding: 0; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -o-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box;}
figure, figure:before, figure:after {padding: 0; margin: 0; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -o-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box;}

html {-webkit-text-size-adjust: 100%;
--black: rgba(0,0,0,1);
--white: rgba(255,255,255,1);
--oliv: rgba(101,134,19,1);
--green: rgba(153,163,0,1);
--blue: rgba(0,157,226,1);
--rasp: rgba(184,0,84,1);
--orange: rgba(238,124,0,1);

--test: linear-gradient(to right, var(--green), var(--rasp));
}

body {margin:0; color: rgba(0,0,0,1); font-family: 'Inter', sans-serif; font-size: 1em; line-height: 1.5; color: var(--black); font-weight: 300;}
body.fixed {height: 100%; overflow: hidden;}

/***************************** FORMAT *****************************/
h1, h2, .extra {font-size: 2em;}
h3, h4 {font-size: 1.5em;}
h5, h6, h3.small {font-size: 1.375em;}
h1, h2, h3, h4, h5, h6, .extra {text-wrap: balance; line-height: 1.25;}
h1, h2, h3, h4, .jos {font-family: 'Josefin Sans', sans-serif;}
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {color: inherit; border: 0 !important; text-decoration: none;}

.inter, .byline {font-family: 'Inter', sans-serif;}
.byline {font-size: 1.25em;}

p + h1, p + h2, p + h3, p + h4, p + h5, p + h6,
ul + h1, ul + h2, ul + h3, ul + h4, ul + h5, ul + h6,
ol + h1, ol + h2, ol + h3, ol + h4, ol + h5, ol + h6 {margin-top: 1em;}

h1 + p, h2 + p, h3 + p, h4 + p, h5 + p, h6 + p,
h1 + ul, h2 + ul, h3 + ul, h4 + ul, h5 + ul, h6 + ul,
h1 + ol, h2 + ol, h3 + ol, h4 + ol, h5 + ol, h6 + ol {margin-top: 0.25em;}

hr + p, hr + ul, hr + ol, hr + h1, hr + h2, hr+ h3, hr + h4, hr + h5, hr + h6,
p + hr, ul + hr, ol + hr, h1 + hr, h2 + hr, h3 + hr, h4 + hr, h5 + hr, h6 + hr {margin-top: 1em;}

p + .byline, ul + .byline, ol + .byline {margin-top: 1.5em;}
.byline + p, .byline + ul, .byline + ol {margin-top: 0.375em;}

p + p, ul + p, ol + p {margin-top: 0.75em;}
p + ul, p + ol {margin-top: 0.25em;}
blockquote > *, .big {font-size: 1.25em;}
.small {font-size: 0.875em;}

b, strong, .bold, .byline, h5, h6 {font-variant: normal; font-weight: 600;}
.white, .white *, .white a.phone, .white a.phone:hover {color: var(--white);}

sub, sup, .sub, .sup {font-size: 0.75em;}
sub, .sub {vertical-align: sub;}
sup, .sup {vertical-align: top;}

.uc {text-transform: uppercase;}

ul {list-style-type: none;}
ul li {padding: 0 0 0.25rem 0.5rem; position: relative;}
ul li:before {content: '\00b7'; position: absolute; left: 0;}
ul li:last-of-type, ol li:last-of-type {padding-bottom: 0;}

ol {list-style: none; counter-reset: list-count;}
ol li {padding: 0 0 0.25rem 1.375rem; position: relative; counter-increment: list-count;}
ol li:before {content: counter(list-count) '.'; position: absolute; left: 0; vertical-align: bottom;}

footer {font-style: inherit;}
footer li, .no-bull li {padding: 0;}
footer li:before, .no-bull li:before {content: '';}

.headimg p + p, .slider p + p {margin-top: 0.25em;}

/***************************** LINKS/SPANS *****************************/
a, button {text-decoration: none; color: inherit;
-webkit-transition: color .3s, background-color .3s, background-size .3s, border .3s; transition: color .3s, background-color .3s, background-size .3s, border .3s, opacity .3s;}
a:hover {color: var(--rasp);}

a.phone, a.phone:hover {color: rgba(0,0,0,1); cursor: text;}

button {-webkit-appearance: none; -moz-appearance: none; appearance: none; background: none; border: none; border-radius: none;}
button:hover {cursor: pointer;}

.white .ul, .white .ul-rev {background-image: linear-gradient(0deg, var(--white), var(--white));}
.ul {background: linear-gradient(0deg, var(--black), var(--black)) no-repeat left bottom / 100% 0.1rem;}
.ul-rev {background: linear-gradient(0deg, var(--rasp), var(--rasp)) no-repeat right bottom / 0 0.1rem;}

.ul:hover, .ul:focus-visible, a:hover .ul {background-size: 0 0.1rem; background-position-x: right;}
.ul-rev:hover, .ul-rev:focus-visible {background-size: 100% 0.1rem; background-position-x: left;}

a svg, button svg {transition: fill .3s;}
.icon:hover svg {fill: var(--green);}

/***************************** LAYOUT *****************************/
/* BASIC */
.wrapper {height: auto; margin: 0 auto; max-width: 32rem; position: relative;}
main {display: block;}

.bb {border-bottom: 0.25rem solid;}
.b-color-oliv {border-color: var(--oliv);}
.b-color-green {border-color: var(--green);}
.b-color-blue {border-color: var(--blue);}
.b-color-rasp {border-color: var(--rasp);}
.b-color-orange {border-color: var(--orange);}


/* HEADER */
#mh {position: absolute; width: 100%; z-index: 2; padding: 4.5rem 0 0 0; top: -4.5rem; transition: top .3s -1s;}
.mh-inner {padding: 0 0.5rem;}

.logo {width: 6rem; max-height: 8rem; background: var(--white);}
.logo a {display: block; padding: 0.5rem;}

.scroll-hidden {transition: opacity .3s;}

#mh.scroll {position: fixed; top: 0; padding-top: 0; transition: top .3s .2s; background: var(--white); border-bottom: 0.125rem solid var(--green);}
#mh.scroll .logo {width: 3rem; max-height: 3rem; overflow: hidden;}
#mh.scroll .scroll-hidden {opacity: 0;}

.no-hero .logo {width: 4rem; max-height: 5rem;}

/* NAVI */
nav ul {list-style-type: none;}
nav ul li {line-height: 1em;}
nav ul li:before {content: '';}

#mn, #mn ul {width: 100%; height: 100%; -ms-transform: translateX(100%); -webkit-transform: translateX(100%); transform: translateX(100%);}
#mn {position: fixed; right: 0; top: 0; z-index: 3; -webkit-overflow-scrolling: touch; transition: transform .3s .3s;}
#mn.open, #mn.open ul {-ms-transform: translateX(0); -webkit-transform: translateX(0); transform: translateX(0);}
#mn ul {position: absolute; right: 0; z-index: 3; padding: 4.5rem 2rem; background: rgba(255,255,255,1); transition: transform .3s;}
#mn.open {transition: none;}

#mn.open ul {box-shadow: 0 0 2rem rgba(0,0,0,0.5);}
#mn li {padding: 0; max-width: 32rem; margin: 0 auto; border-top: 0.25rem solid var(--oliv);}
#mn li:first-of-type {border-top: none;}
#mn a {display: block; padding: 1rem 0;}
#mn .active a {color: var(--green);}

/* nav pull */
#pull, .burger:before {top: 50%; -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%);}
#pull {width: 2.5rem; height: 2.5rem; padding: 0.625rem 0 0.625rem 0.75rem; position: absolute; top: 50%; right: 1rem; z-index: 12;}

.burger-wrap {position: relative; width: 100%; height: 100%;}

.burger, .burger:before, .burger:after {width: 100%; height: 0.25rem; display: block; background: var(--white);
-webkit-transition: all 0.3s; -ms-transition: all 0.3s; transition: all 0.3s;}
.burger:before, .burger:after {position: absolute; content: '';}
.burger:after {bottom: 0; top: auto;}

button:hover .burger, button:hover .burger:before, button:hover .burger:after,
#mh.scroll button:hover .burger, #mh.scroll button:hover .burger:before, #mh.scroll button:hover .burger:after {background: var(--rasp);}

.open .burger:before, .open .burger:after,
#mh.scroll .burger, #mh.scroll .burger:before, #mh.scroll .burger:after,
.no-hero .burger, .no-hero .burger:before, .no-hero .burger:after {background: var(--black);}

.open .burger, .no-hero .open .burger, #mh.scroll .open .burger, button.open:hover .burger, #mh.scroll button.open:hover .burger {background: none;}
.open .burger:before {top: 50%;
-webkit-transform: translateY(-50%) rotate(45deg); -ms-transform: translateY(-50%) rotate(45deg); transform: translateY(-50%) rotate(45deg);}
.open .burger:after {top: 50%; bottom: auto;
-webkit-transform: translateY(-50%) rotate(-45deg); -ms-transform: translateY(-50%) rotate(-45deg); transform: translateY(-50%) rotate(-45deg);}

/* IMAGES / SLIDER / MEDIA */
figure img, svg {width: 100%; display: block;}
.stretch-w img {width: 100%; height: auto;}
.stretch-h img {width: auto; height: 100%;}

.video + *, * + .video, .text-img + *, * + .text-img, .map-wrap + *, * + .map-wrap {margin-top: 1em;}

.img-wrap {position: relative; width: 100%;}
.img-wrap img {position: absolute; top: 50%; left: 50%; -ms-transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%);}
.img-low .img-wrap {padding-bottom: 56.25%;}
.img-mid .img-wrap {padding-bottom: 75%;}
.img-high .img-wrap {padding-bottom: 110%;}

.headimg {position: relative;}
.headimg .slide {position: relative; max-height: 80vh;}
.headimg .img-wrap {padding-bottom: 75%; max-height: 80vh;}
.headimg:after {display: block; position: absolute; bottom: 0; right: 0; content: url('../images/layout/overlay.svg'); opacity: 0.25; height: 75%; aspect-ratio: 4 / 3; pointer-events: none;}

@supports (object-fit: cover){
.stretch-w img, .stretch-h img {width: 100%; height: 100%; object-fit: cover;}
}
@supports (aspect-ratio: 1/ 1) {
.img-wrap {padding-bottom: 0 !important;}
.img-wrap img {position: relative; top: auto; left: auto; -ms-transform: translate(0,0); -webkit-transform: translate(0,0); transform: translate(0,0);}
.img-low .img-wrap {aspect-ratio: 16 / 9;}
.img-mid .img-wrap, .headimg .img-wrap, .slider .img-wrap {aspect-ratio: 4 / 3;}
.img-high .img-wrap {aspect-ratio: 10 / 11;}
}
.video {padding-bottom: 56.25%; position: relative;}
.video iframe, .video video {width: 100%; height: 100%; position: absolute; top: 0; left: 0;}

.headimg figcaption, .slider figcaption {position: absolute; bottom: 2rem; left: 0; width: 100%;}
.slider figcaption {padding: 0 1rem;}
.headimg .white, .slider .white {text-shadow: 0 0 0.5em rgba(0,0,0,0.5);}

.darkend {background: var(--black);}
.darkend img {opacity: 0.8;}

/* CLS Fix */
.headslider, .slider {display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; flex-flow: row nowrap; -ms-flex-wrap: nowrap; overflow: auto; width: 100%;}
.slide {-webkit-box-flex: initial; -webkit-flex: 1 0 auto; -ms-flex: 1 0 auto; flex: initial; position: relative; float: left; padding: 0; width: 100%; min-width: 100%;}
.slick-initialized .slide {min-width: initial;}

/* CONTENT */
.content {padding: 1rem 0;}
.no-hero .content {padding-top: 6rem;}

.block, .col, .single-head {width: 100%; position: relative;}
.pad {padding: 0.5rem 1rem;}

.block-media + .block-text, .block-text + .block-text, .block-spacer + .block-media {padding-top: 1rem;}
.block-spacer {padding-bottom: 1rem;}

.col + .col {margin-top: 1rem;}
.col-img + .col-text {padding-top: 0.75rem;}

.cols {display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; flex-flow: row wrap; -ms-flex-wrap: wrap;}
.col {-webkit-box-flex: initial; -webkit-flex: 1 0 auto; -ms-flex: 1 0 auto; flex: initial; position: relative; float: left;}

.mob-cols .col {width: auto;}
.mob-cols .col + .col {margin-top: 0;}

/* single page */
.single-page {}
.text-s + .text-l, .text-l + .text-s {margin-top: 1.25rem;}

/* map */
.map-wrap {width: 100%; height: 0; padding-bottom: 90%; position: relative; overflow: hidden;}
.map {width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 0;}
.popup-cont {display: none;}

/* FOOTER */
#mf {padding: 1rem 0 2rem 0;}
#mf .icon {display: block; width: 2rem; height: auto;}
#mf .icon svg {width: 100%; height: auto;}

.foot-col + .foot-col {margin-top: 1rem;}
.social li + li {padding-left: 0.75rem;}
.social .col {width: auto;}

.mf-inner {border-top: 0.25rem solid var(--blue); padding-top: 0.5rem;}

/* back top*/
.arrow:before, .arrow:after {width: 0.125rem; height: 1rem; content: ''; position: absolute; display: block; background: rgba(255,255,255,1); top: 0;}

.arrow:before {transform: rotate(45deg); -webkit-transform: rotate(45deg); left: 0.625rem;}
.arrow:after {transform: rotate(-45deg); -webkit-transform: rotate(-45deg); right: 0.625rem;}

#back-top {width: 2.5rem; height: 2.5rem; position: fixed; right: 1rem; bottom: 1rem; display: none; z-index: 100;}
#back-top a, #back-top a:active {width: 2.5rem; height: 2.5rem; display: block; padding: 0.625rem 0.25rem; background: rgba(0,0,0,0.3); border-radius: 50%; -webkit-border-radius: 50%; transition: background 0.3s; -webkit-transition: background 0.3s;}
#back-top a:hover {background: rgba(0,0,0,1);}
#back-top .arrow {width: 2rem; height: 1.25rem; position: relative;}

#back-top a:hover .arrow {animation: pulse 0.5s 1;}


/* responsiveness
--------------------------------------------- */

/* medium */
@media screen and (min-width:48em) {
/***************************** FORMAT *****************************/
.list-h ul, ul.list-h {display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; flex-flow: row wrap; -ms-flex-wrap: wrap;}
.list-h li {-webkit-box-flex: initial; -webkit-flex: 1 0 auto; -ms-flex: 1 0 auto; flex: initial; position: relative; float: left; padding: 0;}
.list-h li:before {content: ''; position: relative;}
.list-h li + li:before {content: '\00b7'; margin: 0 0.25em;}

/***************************** LAYOUT *****************************/
/* BASIC */
.wrapper {max-width: 46rem;}

/* HEADER */
#mh.scroll {background: none; border-bottom: none;}
#mh.scroll .logo {width: 4rem; max-height: 4rem;}

.logo {width: 10rem; max-height: 12rem;}
.no-hero .logo {width: 6rem; max-height: 8rem;}

/* NAVI */
#mn {}
#mn ul {width: 50%; padding-top: 8rem;}
#mh.scroll #mn ul {padding-top: 5rem;}

/* nav pull */
#pull {width: 3.5rem; height: 3.5rem; padding: 1.125rem 0.875rem 1.125rem 0.875rem; border-radius: 50%; right: 0; background: var(--green);}

.open .burger:before, .open .burger:after,
#mh.scroll .burger, #mh.scroll .burger:before, #mh.scroll .burger:after,
.no-hero .burger, .no-hero .burger:before, .no-hero .burger:after {background: var(--white);}

/* IMAGES / SLIDER / MEDIA */
.headimg figcaption {bottom: 3rem; font-size: 1.125em;}
.headimg p + p {margin-top: 0.125em;}
.headimg p {max-width: 50%;}

.slider figcaption {padding: 0 1.5rem; bottom: 3rem; max-width: 75%;}

@supports (aspect-ratio: 1/ 1) {
.slider .img-wrap {aspect-ratio: 3 / 2;}
}

/* CONTENT */
.content {padding-left: 4.5rem;}
.no-hero .content {padding-top: 9rem;}
.pad {padding: 0.75rem;}

.block-media + .block-text, .block-text + .block-text, .block-spacer + .block-media {padding-top: 1.5rem;}
.block-spacer {padding-bottom: 1.5rem;}

.col-s {width: 33.33%; max-width: 33.33%;}
.col-m, .col-m-s {width: 50%; max-width: 50%;}

.col + .col {margin-top: 0;}

/* map */
.map-wrap {padding-bottom: 75%;}

/* FOOTER */
#mf {padding-top: 2rem;}
#mf ul {display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; flex-flow: row wrap; -ms-flex-wrap: wrap;}
#mf li {-webkit-box-flex: initial; -webkit-flex: 1 0 auto; -ms-flex: 1 0 auto; flex: initial; position: relative; float: left;}

.mf-inner {justify-content: space-between; align-items: center;}
.legal, .social {width: auto;}
.address {padding-top: 0;}
}

/* large */
@media screen and (min-width:64em) {
/***************************** FORMAT *****************************/
h1, h2 {font-size: 2.25em;}
h3, h4 {font-size: 1.75em;}
h5, h6, h3.small {font-size: 1.5em;}

/***************************** LAYOUT *****************************/
/* BASIC */
.wrapper {max-width: 60rem;}

/* HEADER */

/*
.logo, #mn li {-webkit-box-flex: initial; -webkit-flex: 1 0 auto; -ms-flex: 1 0 auto; flex: initial; position: relative; float: left;}
#mh .cols, #mn ul {display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; flex-flow: row nowrap; -ms-flex-wrap: nowrap;}
#mh .cols {justify-content: space-between; align-items: center;}
*/
/* NAVI */
#mn ul {width: 33.33%;}
#mn li {padding: 1rem 0;}

/*
#mn {width: auto; right: auto; top: auto; z-index: 0; height: auto; padding: 0.5rem 0 0 3rem; -ms-transform: translateX(0); -webkit-transform: translateX(0); transform: translateX(0); -webkit-box-flex: initial; -webkit-flex: 1 0 auto; -ms-flex: 1 0 auto; flex: initial; position: relative; float: left;}
#mn ul {width: auto; max-width: 100%; position: relative; background: none; padding: 0 2rem 0 0; justify-content: flex-end; align-items: center;}
#mh.scroll #mn ul {border-bottom: none;}
#mn ul li {border-top: none; padding: 0; margin: initial;}
#mn ul li a {padding: 0.75rem 0.5rem;}
#mn ul li:first-of-type a {padding-left: 0;}
#mn ul li:last-of-type a {padding-right: 0;}

#mn.open ul {box-shadow: none;}
*/

/* nav pull */
/*#pull {display: none;}*/

/* IMAGES / SLIDER / MEDIA */
.headimg figcaption {bottom: 4rem; font-size: 1.25em;}
.slider figcaption {padding: 0 2rem; max-width: 66.66%;}

/* CONTENT */
.col-m-s {width: 33.33%; max-width: 33.33%;}
.col-xl-l {width: 80%; max-width: 80%;}

/* single page */
.single-page {}

.text-s + .text-l, .text-l + .text-s {margin-top: 0;}
.text-s {width: 30%; max-width: 30%;}
.text-l {width: 70%; max-width: 70%;}

.mc-right .text-s {padding-right: 0.75rem;}
.mc-right .text-l {padding-left: 1.5rem;}
.mc-left .text-s {padding-left: 0.75rem;}
.mc-left .text-l {padding-right: 1.5rem;}

.text-xl {width: 80%;}

/* map */
.map-wrap {padding-bottom: 56.25%;}

}

@media screen and (min-width:74em) {

/***************************** LAYOUT *****************************/
/* BASIC */
.wrapper {max-width: 72rem;}

/* HEADER */
.logo {width: 12rem; max-height: 15rem;}

/* NAVI */
#mn ul {padding-top: 10rem;}

/* IMAGES / SLIDER / MEDIA */
/*.headimg figcaption {bottom: 5rem;}*/
.headimg p {max-width: 40%;}
.slider figcaption {max-width: 50%;}

/* CONTENT */
.content {padding: 2rem 4rem 2rem 4.5rem;}

.block-media + .block-text, .block-text + .block-text, .block-spacer + .block-media {padding-top: 2rem;}
.block-spacer {padding-bottom: 2rem;}

.pad {padding: 1rem;}
.col-xl-l {width: 70%; max-width: 70%;}
}

@media screen and (min-width:100em) {
body {font-size: 1.1em;}

/***************************** LAYOUT *****************************/
/* BASIC */
.wrapper {max-width: 90rem;}

/* HEADER */
.logo {width: 14rem; max-height: 17rem;}

/* NAVI */
#mn ul {padding-top: 10rem;}

/* IMAGES / SLIDER / MEDIA */
.headimg figcaption {bottom: 5rem; font-size: 1.25em;}

/* CONTENT */
.block-media + .block-text, .block-text + .block-text, .block-spacer + .block-media {padding-top: 2.5rem;}
.block-spacer {padding-bottom: 2.5rem;}
}

@media screen and (min-width:120em) {
body {font-size: 1.2em;}

.wrapper {max-width: 100rem;}
}
/* end responsiveness
--------------------------------------------- */

* + .no-marg {margin-top: 0;}



/***************************** Animations *****************************/
@-webkit-keyframes pulse {
0%, 100% {transform: scale(1);}
50% {transform: scale(1.1);}
}
@-moz-keyframes pulse {
0%, 100% {transform: scale(1);}
50% {transform: scale(1.1);}
}
@keyframes pulse {
0%, 100% {transform: scale(1);}
50% {transform: scale(1.1);}
}
