*,
*:after,
*:before {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font-family: dinosaur, helvetica, arial, sans-serif;
  background-color: white;
  color: #111;
}

.main {
  display: block;
  background-color: white;
}

.wrapper {
  width: 100%;
  max-width: 75rem;
  margin: 0 auto;
  padding-left: 3.5vw;
  padding-right: 3.5vw;
}

a {
  color: black;
  text-decoration: underline;
}
a:hover {
  color: #ff2c00;
}

.main-header a {
  text-decoration: none;
}
.main-header a:hover {
  border-bottom: 2px solid #ff2c00;
}

.main-header li.lieve-elvis a {
  color: #ff2c00;
}

a.opdracht-link {
  color: black;
  text-decoration: none;
}

a.opdracht-link:hover h2 {
  color: black;
  text-decoration: underline;
}

a.artikel-link {
  color: black;
  text-decoration: none;
}

a.artikel-link:hover {
  color: #ff2c00;
  text-decoration: underline;
}

a.btn {
  display: inline-block;
  padding: 0.75rem;
  cursor: pointer;
  font-size: inherit;
  font-weight: 500;
  text-decoration: none;
  color: #111;
  background-color: #d1f7a9;
  transition: all 0.25s;
}

a.btn:hover {
  color: white;
  background-color: #111;
  text-decoration: none;
}

a.btn.highlight {
  background-color: #111;
  color: white;
}

.highlight {
  color: #ff2c00;
}

.measure {
  max-width: 73ch;
}

.measure-m {
  max-width: 78ch;
}

.measure-l {
  max-width: 85ch;
}

.f5 {
  font-size: 1.0625rem !important;
}

strong,
b {
  font-weight: 500;
}

.stack > * {
  margin-top: 0;
  margin-bottom: 0;
}

.stack > * + * {
  margin-top: 1rem;
}

.stack > h2 + p,
.stack > h2 + ul,
.stack > h3 + p,
.stack > h3 + ul {
  margin-top: 0;
}

h2 {
  font-weight: 500;
  font-size: 1.5rem;
}

h3 {
  font-weight: 500;
  font-size: 1.25rem;
}

.grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.grid > article,
.grid > figure {
  flex-basis: calc((100% / 3) - 16px);
}

@supports (display: grid) {
  .grid {
    display: grid;
    grid-gap: 1rem;
    grid-template-columns: repeat(auto-fill, minmax(20rem, 1fr));
  }
}

.frame,
.embed-container {
  padding-bottom: calc(3 / 4 * 100%);
  position: relative;
}

.frame > * {
  overflow: hidden;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
}

.frame > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.cluster {
  overflow: hidden;
}

.cluster > * {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  margin: calc(0.5rem / 2 * -1);
}

.cluster > * > * {
  margin: calc(0.5rem / 2);
}

.print-only,
.print-only-inline {
  display: none;
}

@media print {
  .print-only {
    display: block;
  }

  .print-only-inline {
    display: inline;
  }

  *,
  *:before,
  *:after {
    background: transparent !important;
    color: #000 !important;
    box-shadow: none !important;
    text-shadow: none !important;
  }

  :root {
    font-size: 10pt;
  }

  h1 {
    font-size: 2rem;
  }

  a,
  a:visited {
    text-decoration: none;
  }

  img {
    page-break-inside: avoid;
  }

  p,
  h2,
  h3 {
    orphans: 3;
    widows: 3;
  }

  h2,
  h3 {
    page-break-after: avoid;
  }

  .grid {
    margin-top: 2rem;
    display: grid;
    grid-gap: 1rem;
    grid-template-columns: 1fr 1fr 1fr;
  }

  .center {
    margin: 0;
  }

  .measure,
  .measure-m,
  .wrapper {
    width: 100%;
    max-width: 100%;
  }

  .main-header,
  a.btn,
  footer {
    display: none !important;
  }

  section.main::after {
    content: "Wil je meer creatieve opdrachten die je thuis met eenvoudige middelen kan doen? Ga naar binnenrijm.nl – voor iedereen die nu binnen zit";
    display: block;
    font-size: 13pt;
    margin: 0 3.5vw;
    line-height: 1.2;
  }
}