@font-face{font-display:swap;font-family:"Jumbo Mindset";font-weight:600;src:url("assets/fonts/font-5KU25PO6.woff2") format("woff2")}
@font-face{font-display:swap;font-family:"Jumbo TheSans";font-weight:400;font-style:normal;src:url("assets/fonts/JumboTheSans-VRMQ556S.woff2") format("woff2")}

:root{--color-black:#000;--color-white:#fff;--color-yellow-100:#fcf1d1}

*,
*::before,
*::after{box-sizing:border-box}

body{
  display:grid;
  grid-template-areas:"header" "notice";
  grid-template-columns:minmax(0,1fr);
  grid-template-rows:auto 1fr;
  min-height:100vh;
  margin:0;
  background-color:var(--color-yellow-100);
  color:var(--color-black);
  font-family:"Jumbo TheSans",Arial,Helvetica,sans-serif;
  font-size:1.125rem;
  line-height:1.45;
  -webkit-font-smoothing:antialiased;
}

.SiteHeader{
  grid-area:header;
  padding:2rem 1.25rem;
  background-color:var(--color-white);
  text-align:center;
}

.SiteHeader-logo{
  display:inline-block;
  width:min(16rem,100%);
  height:auto;
}

.OfflineNotice{
  grid-area:notice;
  justify-self:center;
  width:100%;
  max-width:65rem;
  padding:3rem min(5vw,1.75rem) 4rem;
}

.OfflineNotice-lang{
  margin:0 0 1rem;
  font-size:.75rem;
  font-weight:600;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:rgb(0 0 0 / .65);
}

.OfflineNotice-title{
  margin:0 0 1.5rem;
  font-family:"Jumbo Mindset",Arial,Helvetica,sans-serif;
  font-weight:600;
  font-size:clamp(1.5rem,1.2rem + .4vw,1.625rem);
  line-height:1.1;
}

.OfflineNotice-block > p{
  margin:0 0 .8em;
  line-height:1.55;
}

.OfflineNotice-divider{
  border:0;
  border-top:1px solid rgb(0 0 0 / .15);
  height:0;
  margin:3rem 0;
}

@media (min-width:60em){
  .OfflineNotice{
    display:grid;
    grid-template-areas:"nl en";
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    column-gap:0;
    align-items:start;
  }

  .OfflineNotice-block[lang="nl"]{
    grid-area:nl;
    padding-inline-end:2rem;
  }

  .OfflineNotice-block[lang="en"]{
    grid-area:en;
    padding-inline-start:2rem;
    border-inline-start:1px solid rgb(0 0 0 / .15);
  }

  .OfflineNotice-title{font-size:clamp(1.5rem,1rem + 1.6vw,2.25rem)}

  .OfflineNotice-divider{display:none}
}

.OfflineNotice-link{
  color:var(--color-black);
  text-decoration:underline;
  text-decoration-thickness:2px;
  text-underline-offset:.2em;
}

.OfflineNotice-link:focus-visible{
  outline:3px solid var(--color-black);
  outline-offset:3px;
}