@charset "UTF-8";
html {
  line-height: 1.15;
  -webkit-text-size-adjust: 100%; }

body {
  margin: 0; }

main {
  display: block; }

h1 {
  font-size: 2em;
  margin: 0.67em 0; }

hr {
  box-sizing: content-box;
  height: 0;
  overflow: visible; }

pre {
  font-family: monospace, monospace;
  font-size: 1em; }

a {
  background-color: transparent; }

abbr[title] {
  border-bottom: none;
  text-decoration: underline;
  text-decoration: underline dotted; }

b,
strong {
  font-weight: bolder; }

code,
kbd,
samp {
  font-family: monospace, monospace;
  font-size: 1em; }

small {
  font-size: 80%; }

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline; }

sub {
  bottom: -0.25em; }

sup {
  top: -0.5em; }

img {
  border-style: none; }

button,
input,
optgroup,
select,
textarea {
  font-family: inherit;
  font-size: 100%;
  line-height: 1.15;
  margin: 0; }

button,
input {
  overflow: visible; }

button,
select {
  text-transform: none; }

button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button; }

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0; }

button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText; }

fieldset {
  padding: 0.35em 0.75em 0.625em; }

legend {
  box-sizing: border-box;
  color: inherit;
  display: table;
  max-width: 100%;
  padding: 0;
  white-space: normal; }

progress {
  vertical-align: baseline; }

textarea {
  overflow: auto; }

[type="checkbox"],
[type="radio"] {
  box-sizing: border-box;
  padding: 0; }

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto; }

[type="search"] {
  -webkit-appearance: textfield;
  outline-offset: -2px; }

[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none; }

::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit; }

details {
  display: block; }

summary {
  display: list-item; }

template {
  display: none; }

[hidden] {
  display: none; }

:root {
  --content-width: 1200px;
  --time-base: 250ms;
  --gap-base: 2rem;
  --gap-lg: 50px;
  --gap-base-h-dynamic: clamp(10px, 5vw, var(--gap-base));
  --color-text: #242424;
  --color-text-lighter: rgba(36, 36, 36,.85);
  --color-background: #f5ebe0;
  --color-background-lighter: rgba(255,255,255,0.4);
  --color-text-dark: #efefef;
  --color-background-dark: #373636;
  --color-1: #b46d2e;
  --radius-base: 1rem;
  --layout-header-height: 100px;
  --border-color: #000; }

html {
  scroll-behavior: smooth; }

body {
  min-width: 320px;
  background-color: var(--color-background);
  color: var(--color-text);
  font-family: "Schibsted Grotesk", serif;
  line-height: 1.5; }

* > *:first-child {
  margin-top: 0; }

a {
  color: var(--color-1);
  transition: color var(--time-base);
  text-decoration: none; }
  a:hover, a:focus {
    text-decoration: underline; }

img {
  max-width: 100%;
  box-sizing: border-box; }
  img.main {
    border-radius: var(--radius-base);
    border: 3px solid var(--color-1); }
  img.img-rounded {
    border-radius: var(--radius-base); }

.text-lighter {
  color: var(--color-text-lighter);
  transition: color var(--time-base); }
  .text-lighter:hover {
    color: var(--color-text); }

.text-big {
  font-size: 1.15rem;
  line-height: 1.4;
  transition: all var(--time-base); }
  @media (min-width: 800px) {
    .text-big {
      font-size: 1.3rem; } }
blockquote {
  font-style: italic;
  margin-left: var(--gap-base);
  position: relative; }
  blockquote:not(.no-quote)::before {
    content: "“";
    font-size: 2.5rem;
    line-height: 0;
    position: absolute;
    top: 1rem;
    left: -1.5rem;
    opacity: .5; }

h1 {
  color: var(--color-1);
  line-height: 1.2; }

.grid {
  display: grid;
  gap: var(--gap-base); }
  .grid.grid-main {
    gap: var(--gap-base); }
    @media (min-width: 800px) {
      .grid.grid-main {
        gap: var(--gap-lg); } }
  .grid.grid-col-lg {
    column-gap: 100px; }

.not-a-list {
  list-style-type: none;
  padding: 0;
  margin: 0; }

nav ul {
  list-style-type: none;
  padding: 0;
  margin: 0;
  display: flex;
  gap: 1em; }

.content {
  max-width: var(--content-width);
  margin: auto;
  padding: var(--gap-base) var(--gap-base-h-dynamic); }

section {
  display: flex;
  position: relative;
  justify-content: center;
  align-items: center;
  min-height: 100vh;
  padding: 5vh 0;
  box-sizing: border-box; }
  section > * {
    flex-grow: 1; }
  section.not-full-height {
    min-height: auto; }

.scroll-down {
  position: relative; }

@keyframes bounce {
  0%, 100% {
    transform: translateY(0); }
  50% {
    transform: translateY(-5px); } }
  .scroll-down svg {
    position: absolute;
    animation: bounce 2s infinite;
    opacity: .4; }

.title-subtitle {
  display: flex;
  flex-direction: column; }
  .title-subtitle h1 {
    margin: 0;
    padding-top: .25rem; }
  .title-subtitle span {
    order: -1;
    font-weight: 600; }
  .title-subtitle.title-big h1 {
    font-size: 2.7rem; }

.tile {
  background-color: var(--color-background-lighter);
  border-radius: var(--radius-base);
  transition: all var(--time-base); }
  .tile.tile-main {
    padding: var(--gap-base-h-dynamic); }
    @media (min-width: 800px) {
      .tile.tile-main {
        padding: var(--gap-lg); } }
  .tile.tile-sm {
    padding: var(--gap-base); }

body > header a {
  color: inherit; }
  body > header a:hover, body > header a:focus {
    color: var(--color-1);
    text-decoration: none; }

body > header h1 {
  color: inherit;
  margin: 0;
  font-size: 2.5rem;
  font-weight: 750;
  letter-spacing: -0.133rem; }

body > header div.content {
  padding-top: 0;
  padding-bottom: 0;
  height: var(--layout-header-height);
  display: flex;
  flex-direction: row;
  gap: 2em; }
  body > header div.content > * {
    display: flex;
    align-items: center;
    justify-content: center; }
  body > header div.content .menu-toggle {
    display: none;
    height: 1em;
    width: 1em;
    cursor: pointer; }
    @media (max-width: 900px) {
      body > header div.content .menu-toggle {
        display: block; } }
  body > header div.content #nav-main {
    margin-left: auto; }
    @media (max-width: 900px) {
      body > header div.content #nav-main > div:not(.open) {
        display: none; }
      body > header div.content #nav-main > div.open {
        display: block;
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 100;
        background-color: rgba(0, 0, 0, 0.25); }
      body > header div.content #nav-main > div div {
        max-width: calc(100vw - 2 * var(--gap-base));
        width: 300px;
        background: white;
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        padding: var(--gap-base); }
      body > header div.content #nav-main > div ul {
        display: flex;
        flex-direction: column; } }
body > footer {
  background-color: #283618;
  color: #c6c6c6;
  font-size: .9rem;
  text-align: center; }
  body > footer .content {
    padding-top: 1em;
    padding-bottom: 1em; }

#introduction {
  min-height: calc(100vh - var(--layout-header-height));
  background-color: #f5ebe0;
  padding: 0; }
  #introduction .content {
    grid-template-areas: "image" "title" "text"; }
    #introduction .content div:first-child {
      grid-area: image; }
    #introduction .content header {
      grid-area: title; }
    #introduction .content .text {
      grid-area: text; }
    #introduction .content .scroll-down {
      grid-area: scroll-down;
      display: none; }
    @media (min-width: 800px) {
      #introduction .content {
        gap: 50px;
        grid-template-columns: 1fr 1fr;
        grid-template-areas: "image image" "title text" "scroll-down ."; }
        #introduction .content .scroll-down {
          display: block; } }
@media (min-width: 800px) {
  #mbsr .content > div {
    grid-template-columns: 2fr 1fr;
    grid-template-areas: "title image" "text image"; }
    #mbsr .content > div header {
      grid-area: title; }
    #mbsr .content > div .text {
      grid-area: text; }
    #mbsr .content > div .image {
      grid-area: image; }
    #mbsr .content > div .image img {
      width: 100%;
      height: 100%;
      object-fit: cover; } }

@media (min-width: 800px) {
  #courses {
    grid-template-columns: repeat(3, 1fr); }
    #courses .text-big {
      grid-column: 2 / -1; }
    #courses div:nth-child(6n + 6) {
      grid-column: 2 / 3; } }

#calendar h2 {
  font-weight: 600;
  font-size: 1.2rem;
  line-height: 1.15; }

@media (min-width: 800px) {
  #calendar.grid {
    gap-row: var(--gap-lg);
    grid-template-columns: repeat(2, 1fr); }
    #calendar.grid header {
      grid-column: 1 / -1; } }

@media (min-width: 1000px) {
  #calendar.grid {
    grid-template-columns: repeat(3, 1fr); } }

@media (min-width: 1180px) {
  #calendar.grid {
    grid-template-columns: repeat(4, 1fr); } }

@media (min-width: 800px) {
  #custom.grid {
    grid-template-columns: 1fr 2fr; } }

#about > .grid > blockquote {
  margin: 0; }

@media (min-width: 600px) {
  #about > .grid > ul {
    grid-template-columns: repeat(2, 1fr); } }

@media (min-width: 1180px) {
  #about > .grid > ul {
    grid-template-columns: repeat(3, 1fr); } }

#about > .grid > ul li {
  display: flex;
  flex-direction: column; }
  #about > .grid > ul li img {
    max-height: 50px;
    max-width: 100%;
    margin-right: var(--gap-sm);
    filter: grayscale(100%) sepia(100%);
    transition: filter var(--time-base); }
  #about > .grid > ul li a {
    background-color: var(--color-background);
    border-radius: var(--radius-base);
    padding: var(--gap-base);
    transition: background-color var(--time-base);
    display: flex;
    flex-direction: column;
    gap: .5rem;
    color: var(--color-text-lighter);
    text-decoration: none; }
    #about > .grid > ul li a:hover, #about > .grid > ul li a:focus {
      color: var(--color-text-lighter);
      background-color: rgba(180, 109, 46, 0.1); }
      #about > .grid > ul li a:hover img, #about > .grid > ul li a:focus img {
        filter: grayscale(0); }

@media (min-width: 800px) {
  #about > .grid {
    grid-template-columns: 1fr 2fr;
    grid-template-areas: "header quote" "img text" ". links"; }
    #about > .grid header {
      grid-area: header; }
    #about > .grid > blockquote {
      grid-area: quote; }
    #about > .grid .image {
      grid-area: img; }
    #about > .grid .description {
      grid-area: text; }
    #about > .grid > ul {
      grid-area: links; } }

#str-contact .content {
  gap: var(--gap-lg); }

#str-contact a[href^="mailto:"] {
  font-size: 1.2rem; }
  @media (min-width: 800px) {
    #str-contact a[href^="mailto:"] {
      font-size: 1.8rem; } }
  #str-contact a[href^="mailto:"]::before {
    content: "→ ";
    margin-right: var(--gap-sm);
    opacity: .5; }