@font-face{font-family:ArialRoundedMTPro-Bold;src:url("assets/arial-rounded-bold.woff2") format("woff2")}
@font-face{font-family:Open Sans,sans-serif;font-style:normal;font-weight:400;src:local("Open Sans"),url("assets/open-sans-regular.woff2") format("woff2")}

:root{--color-brand: #1CA693;--color-brand-contrast: #FB406B;--color-brand-bg: #FBF0E4;--color-text-base: #211D1E;--color-white: #FFF;--container-width-lg: 1130px;--gutter-h: 20px}

*,*:before,*:after{box-sizing:border-box}
html{font-size:62.5%;-webkit-text-size-adjust:100%}
body{margin:0;background-color:var(--color-brand-bg);color:var(--color-text-base);font-family:"Open Sans",sans-serif;font-size:1.8rem;line-height:1.6;min-height:100vh;overflow-x:hidden}

.SiteHeader{max-width:var(--container-width-lg);margin:0 auto;padding:40px var(--gutter-h) 0}
.SiteHeader-logo{display:block;width:100%;max-width:252px;height:auto}

.OfflineNotice{max-width:var(--container-width-lg);margin:0 auto;padding:40px var(--gutter-h) 80px;display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:"nl" "rule" "en"}
.OfflineNotice-block:lang(nl){grid-area:nl}
.OfflineNotice-block:lang(en){grid-area:en}
.OfflineNotice-divider{grid-area:rule;border:0;border-top:1px solid rgba(28,166,147,.4);height:0;margin:3.5rem 0}
.OfflineNotice-block > .OfflineNotice-lang{margin:0 0 1em;font-size:1.2rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:color-mix(in srgb,var(--color-brand) 70%,black)}
.OfflineNotice-title{font-family:ArialRoundedMTPro-Bold,sans-serif;font-weight:400;font-size:clamp(2.2rem,1.2rem + 1.1vw,2.8rem);line-height:1.2;margin:.5em 0 .75em}
.OfflineNotice-block > p{margin:0 0 .8em;line-height:1.55}
.OfflineNotice-link{color:var(--color-text-base);text-decoration:underline;text-underline-offset:.2em;text-decoration-thickness:2px}
.OfflineNotice-link:hover{color:var(--color-brand-contrast);text-decoration-color:var(--color-brand-contrast)}
.OfflineNotice-link:focus-visible{outline:3px solid var(--color-brand-contrast);outline-offset:3px;border-radius:2px}

@media screen and (min-width:30em){
  :root{--gutter-h:40px}
}

@media screen and (min-width:60em){
  .OfflineNotice{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-areas:"nl en"}
  .OfflineNotice-divider{display:none}
  .OfflineNotice-block:lang(nl){padding-inline-end:4rem}
  .OfflineNotice-block:lang(en){padding-inline-start:4rem;border-inline-start:1px solid rgba(28,166,147,.4)}
}