body {
  --aside-width: calc((100vw - var(--main-width) - var(--page-layout-gap)) / 2);
}

main {
  padding-top: calc(var(--header-height) + var(--page-layout-padding-top) - var(--site-padding-top));
  padding-bottom: var(--page-layout-padding-bottom);
  padding-right: var(--page-layout-gap);
  padding-left: var(--page-layout-gap);
  position: relative;
  box-sizing: border-box;
  width: calc(var(--main-width) + var(--page-layout-gap));
  max-width: var(--main-max-width);
  margin: 0 auto;
  box-sizing: border-box;
}
aside {
  position: fixed;
  top: 0;
  bottom: 0;
  width: var(--aside-width);
  padding-top: calc(var(--header-height) + var(--page-layout-padding-top));
  padding-bottom: var(--page-layout-padding-bottom);
  -ms-overflow-style: none;
  scrollbar-width: none;
  overflow-y: auto;
  overflow-x: hidden;
  box-sizing: border-box;
  z-index: 10;
}
aside::-webkit-scrollbar {
  display: none;
}
aside:after, main:after {
  content: '';
  position: fixed;
  top: calc(var(--site-padding-top) * -1);
  left: 0;
  width: 100%;
  height: calc(var(--site-padding-top) + var(--header-height) + var(--page-layout-padding-top) + var(--page-title-margin-bottom) + var(--font-size-big) + var(--header-gradient-height-extra));
  background: linear-gradient(var(--color-background), transparent);
  z-index: 1;
  pointer-events: none;
}
body.full_width aside:after {
  display: none;
}
aside:after {
  width: var(--aside-width);
}
#page_layout_right_side:after {
  right: 0;
  left: unset;
}
#page_layout_left_side {
  left: 0;
}
#page_layout_right_side {
  right: 0;
}
body:not(.minimize_left_sidebar):not(.full_width):not(.expanded_right_sidebar) #page_layout_left_side {
  padding-left: var(--site-padding-sides);
  padding-right: var(--page-layout-gap);
}
body:not(.minimize_right_sidebar):not(.full_width):not(.expanded_left_sidebar) #page_layout_right_side {
  padding-left: var(--page-layout-gap);
  padding-right: var(--site-padding-sides);
}


#page_inner {
  min-height: calc(100dvh - var(--header-height) - var(--page-title-margin-bottom) - var(--page-layout-padding-top) - var(--page-layout-padding-bottom));
}
#page_title {
  top: calc(var(--header-height) + var(--page-layout-padding-top));
  cursor: auto;
  font-weight: bold;
  text-align: left;
  /* color: var(--page-color); */
  margin-bottom: 0;
  overflow-x: hidden;
  overflow-y: visible;
}
#page_title_marquee {
  display: block;
  margin-right: 3rem;
  overflow-x: hidden;
  overflow-y: visible;
  padding-bottom: var(--page-title-margin-bottom);
}
#page_title_text {
  cursor: pointer;
  position: relative;
  display: inline-block;
  transition: margin-left linear;
  text-decoration: underline;
  text-underline-offset: .25em;
  text-decoration-thickness: 2px;
}
.expanded_right_sidebar #page_title_text,
.expanded_left_sidebar #page_title_text {
  margin-left: 0 !important;
  transition-duration: 0ms !important;
}
.page_layout_headline {
  z-index: 20;
  font-size: var(--font-size-big);
  font-weight: 300;
  text-transform: uppercase;
  line-height: 100%;
  white-space: nowrap;
  position: sticky;
  top: 0;
  margin-bottom: var(--page-title-margin-bottom);
  cursor: pointer;
}
.page_layout_headline:before, .page_layout_headline:after {
  content: '';
  display: inline-block;
  height: var(--icon-stroke-width-thin);
  width: calc(1em * var(--x-height-factor));
  margin-bottom: calc(.4em * var(--x-height-factor));
  background-color: var(--color);
  transform-origin: center;
}
.page_layout_headline:after {
  position: absolute;
  left: 0;
  top: 50%;
  transform: rotate(90deg);
}
@media (min-width: 1281px) {
  #page_title:before {
    content: '/ ';
    display: inline;
    display: none;
    background-color: transparent;
  }
  #page_title:after {
    display: none;
  }
}



.sidebar_search {
  margin-bottom: 3rem;
  display: none;
}
@media (min-width: 801px) {
  .expanded_left_sidebar #page_layout_left_side .sidebar_search,
  .expanded_right_sidebar #page_layout_right_side .sidebar_search {
    display: block;
  }
}


.sidebar_more_link {
  font-weight: bold;
  margin-top: 2rem;
  display: inline-block;
}



/* LAYOUT FUNCTION */

.expanded_left_sidebar,
.expanded_right_sidebar {
  --aside-width: calc((100vw - var(--font-size-big) - var(--page-layout-gap)) / 2);
}
.expanded_left_sidebar main,
.expanded_right_sidebar main {
  width: var(--aside-width);
}
.expanded_left_sidebar main {
  margin-left: var(--aside-width);
}
.expanded_right_sidebar main {
  margin-left: calc(var(--font-size-big) + var(--page-layout-gap));
}
.expanded_left_sidebar #page_layout_right_side,
.expanded_right_sidebar #page_layout_left_side,
.minimize_right_sidebar #page_layout_right_side,
.minimize_left_sidebar #page_layout_left_side {
  width: var(--font-size-big);
  padding-left: 0;
  padding-right: 0;
}
.expanded_left_sidebar #page_layout_right_side .sidebar_inner,
.expanded_right_sidebar #page_layout_left_side .sidebar_inner,
.minimize_right_sidebar #page_layout_right_side .sidebar_inner,
.minimize_left_sidebar #page_layout_left_side .sidebar_inner,
.expanded_left_sidebar #page_layout_left_side  .page_layout_headline:after,
.expanded_right_sidebar #page_layout_right_side  .page_layout_headline:after,
.minimize_left_sidebar #page_layout_left_side  .page_layout_headline:after,
.minimize_right_sidebar #page_layout_right_side  .page_layout_headline:after {
  display: none;
}
.expanded_right_sidebar #page_layout_left_side .page_layout_headline,
.expanded_left_sidebar #page_layout_right_side .page_layout_headline,
.minimize_left_sidebar #page_layout_left_side .page_layout_headline,
.minimize_right_sidebar #page_layout_right_side .page_layout_headline,
.full_width aside .page_layout_headline {
  transform: rotate(90deg) translateX(.2em);
}
.minimize_left_sidebar main,
.minimize_right_sidebar main {
  width: calc(100vw - var(--aside-width) - var(--page-layout-gap) - var(--font-size-big));
}
.minimize_right_sidebar:not(.full_width) main {
  margin-left: var(--aside-width);
}
.minimize_left_sidebar:not(.full_width):not(.expanded_right_sidebar) main {
  margin-left: calc(var(--page-layout-gap) + var(--font-size-big));
}
.expanded_left_sidebar #page_title,
.expanded_right_sidebar #page_title {
  margin-bottom: var(--page-title-margin-bottom);
  overflow-x: visible;
}
.expanded_left_sidebar #page_title_marquee,
.expanded_right_sidebar #page_title_marquee {
  display: inline;
  margin-right: 0;
  overflow-x: visible;
  padding-bottom: 0;
}

/* FULL WIDTH */

.full_width aside  {
  width: var(--font-size-big);
}
.full_width .sidebar_inner,
.full_width .page_layout_headline:after {
  display: none;
}
.full_width main {
  width: auto;
  padding-right: calc(var(--page-layout-gap) * 2 + var(--font-size-big));
  padding-left: calc(var(--page-layout-gap) * 2 + var(--font-size-big));
}
#full_width_btn {
  position: absolute;
  width: 1.2em;
  height: 1em;
  top: 0;
  right: 0;
  z-index: 1;
  cursor: pointer;
}
#full_width_btn:after, #full_width_btn:before {
  content: '';
  position: absolute;
  width: .35em;
  height: .35em;
  top: 50%;
  right: 12%;
  border-top: var(--icon-stroke-width-thin) solid var(--color);
  border-right: var(--icon-stroke-width-thin) solid var(--color);
  transform: translateY(-50%) rotate(45deg);
}
#full_width_btn:before {
  right: unset;
  left: 0%;
  border: none;
  border-bottom: var(--icon-stroke-width-thin) solid var(--color);
  border-left: var(--icon-stroke-width-thin) solid var(--color);
}
.full_width #full_width_btn {
  width: 1.5em;
}
.full_width #full_width_btn:after {
  border: none;
  border-bottom: var(--icon-stroke-width-thin) solid var(--color);
  border-left: var(--icon-stroke-width-thin) solid var(--color);
}
.full_width #full_width_btn:before {
  border: none;
  border-top: var(--icon-stroke-width-thin) solid var(--color);
  border-right: var(--icon-stroke-width-thin) solid var(--color);
}
@media (hover: hover) {
  #full_width_btn:hover {
    width: 1.4em;
    margin-right: -.1em;
  }
  .full_width #full_width_btn:hover {
    width: 1.3em;
    margin-right: .1em;
  }
}

@media (max-width: 1280px) {

  /* only two columns */
  /* default left sidebar is open */

  body:not(.expanded_left_sidebar):not(.expanded_right_sidebar) #page_title:before {
    content: '/ ';
    display: inline;
    display: none;
    background-color: transparent;
  }
  body:not(.expanded_left_sidebar):not(.expanded_right_sidebar) #page_title:after {
    display: none;
  }

  .expanded_right_sidebar #page_title_text,
  .expanded_left_sidebar #page_title_text {
    text-decoration: none;
  }

  .expanded_right_sidebar #page_layout_right_side,
  .expanded_left_sidebar #page_layout_left_side {
    width: calc(100vw - (var(--font-size-big) * 2) - (var(--page-layout-gap) * 3));
  }

  .expanded_right_sidebar #page_layout_right_side .page_layout_headline:after,
  .expanded_left_sidebar #page_layout_left_side .page_layout_headline:after,
  .expanded_left_sidebar #full_width_btn,
  .expanded_right_sidebar #full_width_btn {
    display: none;
  }

  body:not(.expanded_left_sidebar):not(.expanded_right_sidebar) #full_width_btn {
    display: block;
  }
  .expanded_left_sidebar main,
  .expanded_right_sidebar main {
    top: 0;
    position: fixed;
    width: var(--font-size-big);
    margin-left: 0;
    margin-right: 0;
    --margin-sides: calc(var(--font-size-big) + (var(--page-layout-gap) * 2));
  }
  .expanded_left_sidebar main {
    right: var(--margin-sides);
  }
  .expanded_right_sidebar main {
    left: var(--margin-sides);
  }
  .expanded_left_sidebar main .page_layout_headline,
  .expanded_right_sidebar main .page_layout_headline {
    transform: rotate(90deg) translateX(.2em);
  }
  .expanded_left_sidebar #page_inner,
  .expanded_left_sidebar #page_title_text:after,
  .expanded_left_sidebar footer,
  .expanded_right_sidebar #page_inner,
  .expanded_right_sidebar #page_title_text:after,
  .expanded_right_sidebar footer {
    display: none;
  }


}

@media (max-width: 950px) {

  aside .page_layout_headline {
    font-stretch: 80%;
  }
}
@media (max-width: 850px) {

  aside .page_layout_headline {
    font-stretch: 75%;
  }
}



@media (max-width: 800px) {

  /* only one column at a time */

  main {
    padding-bottom: var(--site-padding-bottom);
    width: calc(100vw - (var(--font-size-big) * 2) - (var(--page-layout-gap) * 2));
  }
  aside {
    overflow-x: hidden;
  }
  body:not(.expanded_left_sidebar) #page_layout_left_side#page_layout_left_side,
  body:not(.expanded_right_sidebar) #page_layout_right_side#page_layout_right_side {
    padding-left: 0;
    padding-right: 0;
  }
  .expanded_left_sidebar main,
  .expanded_right_sidebar main {
    --margin-sides: calc(var(--font-size-big) + var(--page-layout-gap));
  }
  aside .page_layout_headline,
  .page_layout_headline {
    font-stretch: 90%;
  }
  #page #full_width_btn {
    display: none;
  }
  #page_title_marquee {
    margin-right: 0;
  }
  aside,
  aside:after {
    width: var(--font-size-big);
    padding-left: 0;
    padding-right: 0;
  }
  aside .sidebar_inner {
    display: none;
  }
  body:not(.expanded_left_sidebar):not(.expanded_right_sidebar) aside .page_layout_headline {
    transform: rotate(90deg) translateX(.2em);
  }
  .expanded_left_sidebar, .expanded_right_sidebar {
    --page-layout-gap: 1rem;
  }
  .expanded_left_sidebar #page_layout_left_side {
    padding-left: var(--site-padding-sides);
  }
  .expanded_right_sidebar #page_layout_right_side {
    padding-right: var(--site-padding-sides);
  }
  .expanded_left_sidebar #page_layout_left_side,
  .expanded_right_sidebar #page_layout_right_side {
    width: calc(100vw - (var(--font-size-big) * 2) - (var(--page-layout-gap) * 2));
  }
  .expanded_left_sidebar #page_layout_left_side:after,
  .expanded_right_sidebar #page_layout_right_side:after {
    width: calc(100vw - (var(--font-size-big) * 2) - (var(--page-layout-gap) * 2));
  }
  .expanded_left_sidebar #page_layout_left_side .page_layout_headline,
  .expanded_right_sidebar #page_layout_right_side .page_layout_headline, {
    transform: unset;
  }
  .expanded_left_sidebar #page_layout_left_side .sidebar_inner,
  .expanded_right_sidebar #page_layout_right_side .sidebar_inner {
    display: unset;
  }
  .expanded_left_sidebar #page_layout_left_side .page_layout_headline,
  .expanded_right_sidebar #page_layout_right_side .page_layout_headline, {
    word-break: break-all;
    white-space: normal;
  }
  .expanded_left_sidebar #page_layout_left_side .page_layout_headline {
    margin-left: calc(var(--site-padding-sides) * -1);
  }
  .expanded_right_sidebar #page_layout_right_side .page_layout_headline {
    margin-right: calc(var(--site-padding-sides) * -1);
  }

}