@charset "UTF-8";
body,
html {
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-overflow-scrolling: touch;
  background: #fff;
  z-index: 1;
  font-size: 16px;
  padding: 0;
  margin: 0;
}

* {
  padding: 0;
  margin: 0;
}

a,
button,
input,
label {
  cursor: pointer;
}

*,
*:after,
*:before {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

li,
ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

@font-face {
  font-family: 'Union Regular';
  src: url("../fonts/union_regular.eot");
  src: local("☺"), url("../fonts/union_regular.woff") format("woff"), url("../fonts/union_regular.ttf") format("truetype"), url("../fonts/union_regular.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

body {
  font-family: 'Union Regular', sans-serif;
  margin: 0.3125rem;
}

body.noscroll {
  overflow: hidden;
}

a,
a:hover,
a:visited,
h1,
h2,
h3,
p,
strong {
  font-weight: normal;
  color: #000000;
  text-decoration: none;
}

p {
  margin-bottom: 0.75rem;
  line-height: 1.35;
}

.header {
  width: calc(100vw - 1.25rem);
  height: auto;
  font-size: calc(2.125rem + 1vw);
  color: #ffffff;
  margin: 0.3125rem;
  position: fixed;
  top: 0.3125rem;
  z-index: 50;
}

.header > div {
  height: 100%;
  width: calc(100% - 7.95rem - 2vw - 0.625rem);
  width: calc(100% - ((3.787rem + 1vw) * 3) - 0.625rem - 0.625rem - 0.625rem);
  background: #2d2d27;
  display: inline-block;
  overflow: hidden;
  display: inherit;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding: 0.5rem;
}

.header .close,
.header .menu {
  position: absolute;
  right: 0;
  top: 0;
  height: 100%;
  width: calc(3.787rem + 1vw);
  background: #2d2d27;
  color: #ffffff;
  cursor: pointer;
  text-align: center;
}

.header .shuffle {
  position: absolute;
  right: calc(8.82rem + 2vw);
  top: 0;
  height: 100%;
  width: calc(3.787rem + 1vw);
  background: #2d2d27;
  color: #ffffff;
  cursor: pointer;
  text-align: center;
}

.header .shuffle span {
  border: 0.275rem solid white;
  background-color: #2d2d27;
  display: block;
  display: block;
  position: absolute;
  -webkit-transition: all 0.25s;
  -moz-transition: all 0.25s;
  -o-transition: all 0.25s;
  transition: all 0.25s;
}

.header .shuffle span.card1 {
  top: 0.725rem;
  bottom: 2.5rem;
  left: 0.725rem;
  right: 2.5rem;
}

.header .shuffle span.card2 {
  top: 0.725rem;
  bottom: 2.5rem;
  left: 2.5rem;
  right: 0.725rem;
}

.header .shuffle span.card3 {
  top: 2.5rem;
  bottom: 0.725rem;
  left: 0.725rem;
  right: 2.5rem;
}

.header .shuffle span.card4 {
  top: 2.5rem;
  bottom: 0.725rem;
  left: 2.5rem;
  right: 0.725rem;
}

.header .shuffle.closed .card1 {
  top: 0.225rem;
  bottom: 3rem;
  left: 0.725rem;
  right: 2.5rem;
}

.header .shuffle.closed .card2 {
  top: 0.725rem;
  bottom: 2.5rem;
  left: 2.7rem;
  right: 0.525rem;
}

.header .shuffle.closed .card3 {
  top: 2.8rem;
  bottom: 0.425rem;
  left: 0.925rem;
  right: 2.3rem;
}

.header .shuffle.closed .card4 {
  top: 2.4rem;
  bottom: 0.825rem;
  left: 2.9rem;
  right: 0.3725rem;
}

.header .tabs {
  position: absolute;
  right: calc(4.41rem + 1vw);
  top: 0;
  height: 100%;
  width: calc(3.787rem + 1vw);
  background: #2d2d27;
  color: #ffffff;
  cursor: pointer;
  text-align: center;
}

.header .tabs span {
  border: 0.275rem solid white;
  background-color: #2d2d27;
  display: block;
  display: block;
  position: absolute;
  top: 0.725rem;
  bottom: 0.725rem;
  left: 0.725rem;
  right: 0.725rem;
  -webkit-transition: all 0.25s;
  -moz-transition: all 0.25s;
  -o-transition: all 0.25s;
  transition: all 0.25s;
}

.header .tabs.closed .card1 {
  bottom: 1.45rem;
  right: 1.45rem;
}

.header .tabs.closed .card2 {
  top: 1.45rem;
  left: 1.45rem;
}

.subfooter {
  width: calc(100vw - 1.25rem);
  height: calc(3.787rem + 1vw);
  font-size: calc(2.125rem + 1vw);
  color: #ffffff;
  margin: 0 0.3125rem;
  background: #c8aeda;
  display: inline-block;
  position: absolute;
  display: none;
}

.subfooter a {
  color: #ffffff;
}

.subfooter div {
  height: calc(3.787rem + 1vw);
  float: left;
  padding: 0.5rem;
  background-color: #2d2d27;
  display: inline;
  width: 100%;
}

.footer {
  width: calc(100vw - 1.25rem);
  height: calc(3.787rem + 1vw);
  font-size: calc(2.125rem + 1vw);
  color: #ffffff;
  margin: 0  .3125rem .625rem 0.3125rem;
  display: inline-block;
  top: 100vh;
  z-index: 900;
  position: absolute;
}

.footer a {
  color: #ffffff;
}

.footer div {
  height: calc(3.787rem + 1vw);
  float: left;
  padding: 0.5rem;
  background-color: #2d2d27;
  display: inline;
}

.footer > div {
  margin-right: 0.625rem;
}

.footer .imprint {
  border-right: 0;
}

.footer .top {
  float: right;
  width: calc(3.162rem + 1vw + 0.625rem);
  height: calc(3.787rem + 1vw);
  border-right: 0;
  margin-right: 0;
  text-align: center;
  cursor: pointer;
}

.footer .top img {
  width: 55%;
  text-align: center;
  margin: 0 auto;
  padding: 0;
  margin-top: calc(.02rem + 1vw / 3);
  margin-top: 22.5%;
}

body[ndx--tabs="open"] .submenu {
  display: none;
}

.nav {
  display: inline-block;
}

.nav.depth-00 {
  position: absolute;
  width: 100%;
  height: 100vh;
  cursor: pointer;
  transform: rotateX(-6deg) scale(0.99999);
  transform-origin: top left;
  -webkit-transition: all 0.25s;
  -moz-transition: all 0.25s;
  -o-transition: all 0.25s;
  transition: all 0.25s;
  z-index: 1;
  background-color: #ffffff;
  top: 0;
  z-index: 0;
  display: inline;
}

.nav.depth-00 h1 {
  width: calc(100vw - 1.25rem);
  background: #505046;
  font-size: calc(2.125rem + 1vw);
  padding: 0.5rem;
  margin: 0.3125rem;
  color: #ffffff;
}

.nav.depth-00.basics > h1 {
  margin-top: 0;
}

.nav.depth-00:nth-of-type(2) {
  z-index: 2;
  top: 30vh;
}

.nav.depth-00:nth-of-type(2).depth-00top {
  -webkit-transition: top 0.25s;
  -moz-transition: top 0.25s;
  -o-transition: top 0.25s;
  transition: top 0.25s;
  top: 100vh;
}

.nav.depth-00:nth-of-type(3) {
  z-index: 3;
  top: 60vh;
}

.nav.depth-00:nth-of-type(3).depth-00top {
  -webkit-transition: top 0.25s;
  -moz-transition: top 0.25s;
  -o-transition: top 0.25s;
  transition: top 0.25s;
  top: 200vh;
}

.nav.depth-00.depth-00open {
  transform: rotateX(0deg) scale(0.99999) !important;
  transform-origin: top left !important;
  -webkit-transition: transform 0.5s;
  -moz-transition: transform 0.5s;
  -o-transition: transform 0.5s;
  transition: transform 0.5s;
}

.nav.depth-00 .submenu .submenu-item {
  width: calc(100vw - 1.25rem);
  background: #505046;
  font-size: calc(1rem + 1.15vw);
  margin: 0.625rem 0.3125rem 0.3125rem;
}

.nav.depth-00 .submenu .submenu-item h2 {
  font-size: calc(1rem + 1.15vw);
  display: block;
  padding: 0.5rem 0.5rem 0.25rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  border: 0;
  color: #ffffff;
  display: inline-block;
}

.nav.depth-00 .submenu .submenu-item .sort {
  font-size: calc(1rem + 1.15vw);
  display: block;
  padding: 0.5rem 0.5rem 0.25rem 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  border: 0;
  color: #ffffff;
  display: inline-block;
}

.nav.depth-00 .submenu .submenu-item .sort span {
  cursor: pointer;
}

.nav.depth-00 .submenu .submenu-item .sort span:not(:last-child)::after {
  content: ",";
}

.nav.depth-00 .submenu .submenu-item .sort span:last-child {
  background: #d6b5b5;
  background: -webkit-linear-gradient(left, #c8aeda 0%, #d7d5b0 25%, #b8d6b6 50%, #b4bcd6 75%, #d6b5b5 100%);
  background: -o-linear-gradient(left, #c8aeda 0%, #d7d5b0 25%, #b8d6b6 50%, #b4bcd6 75%, #d6b5b5 100%);
  background: linear-gradient(to right, #c8aeda 0%, #d7d5b0 25%, #b8d6b6 50%, #b4bcd6 75%, #d6b5b5 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.nav.depth-00 .submenu .filter h2 {
  width: 96%;
}

.nav.depth-00 .submenu .filter .filtered .reference {
  color: #c2c7d7;
}

.nav.depth-00 .submenu .filter .filtered .manual {
  color: #c9d7c8;
}

.nav.depth-00 .submenu .filter .filtered .description {
  color: #d7d6c2;
}

.nav.depth-00 .submenu .filter .filtered .synthesis {
  color: #d8cbcb;
}

.nav.depth-00 .submenu .filter .filtered .conception {
  color: #d4c7dd;
}

.nav.depth-00 .submenu .submenu-item {
  max-height: calc(2.25rem + 1.25vw);
  overflow: hidden;
  position: relative;
  -webkit-transition: all 0.25s ease-out;
  -moz-transition: all 0.25s ease-out;
  -o-transition: all 0.25s ease-out;
  transition: all 0.25s ease-out;
}

.nav.depth-00 .submenu .submenu-item.show {
  max-height: 200vh;
}

.nav.depth-00 .submenu .submenu-item h2 {
  cursor: pointer;
}

.nav.depth-00 .submenu .submenu-item .dropbtn2 {
  transition: transform 0.25s ease-out;
  line-height: 2.81rem;
  -moz-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  -webkit-transform: rotate(0deg);
}

.nav.depth-00 .submenu .submenu-item .dropbtn,
.nav.depth-00 .submenu .submenu-item .dropbtn2 {
  color: #ffffff;
  font-size: 2rem;
  border: none;
  cursor: pointer;
  float: right;
  position: absolute;
  right: 0;
  top: 0;
  width: 3.13rem;
  text-align: center;
  height: 3.13rem;
  line-height: 2.81rem;
}

.nav.depth-00 .submenu .submenu-item .dropbtn.rotate,
.nav.depth-00 .submenu .submenu-item .dropbtn2.rotate {
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  -webkit-transform: rotate(90deg);
}

.nav.depth-00 .submenu .submenu-items.filters {
  display: inline-block;
  font-size: calc(1rem + 1.15vw);
  margin: 0;
  padding: 0.5rem;
  color: #ffffff;
}

.nav.depth-00 .submenu .submenu-items.filters .reference {
  background: #c2c7d7;
}

.nav.depth-00 .submenu .submenu-items.filters .description {
  background: #d7d6c2;
}

.nav.depth-00 .submenu .submenu-items.filters .manual {
  background: #c9d7c8;
}

.nav.depth-00 .submenu .submenu-items.filters .synthesis {
  background: #d8cbcb;
}

.nav.depth-00 .submenu .submenu-items.filters .conception {
  background: #d4c7dd;
}

.nav.depth-00 .submenu .submenu-items.filters .submenu-items-group {
  margin-bottom: 1.25rem;
}

.nav.depth-00 .submenu .submenu-items.filters .submenu-items-group:last-of-type {
  margin-bottom: 0;
}

.nav.depth-00 .submenu .submenu-items.filters .submenu-items-group:first-of-type span[ndx--tag--source="reference"] {
  color: #c2c7d7;
}

.nav.depth-00 .submenu .submenu-items.filters .submenu-items-group:first-of-type span[ndx--tag--source="manual"] {
  color: #c9d7c8;
}

.nav.depth-00 .submenu .submenu-items.filters .submenu-items-group:first-of-type span[ndx--tag--source="description"] {
  color: #d7d6c2;
}

.nav.depth-00 .submenu .submenu-items.filters .submenu-items-group:first-of-type span[ndx--tag--source="synthesis"] {
  color: #d8cbcb;
}

.nav.depth-00 .submenu .submenu-items.filters .submenu-items-group:first-of-type span[ndx--tag--source="conception"] {
  color: #d4c7dd;
}

.nav.depth-00 .submenu .submenu-items.filters .submenu-items-group .showall {
  cursor: pointer;
}

.nav.depth-00 .submenu .submenu-items.filters span {
  margin-right: 0.5rem;
  white-space: nowrap;
}

.nav.depth-00 .submenu .submenu-items.filters span.tag {
  cursor: pointer;
}

.nav.depth-00 .submenu .submenu-items.filters span.tag.selected .closef {
  display: inline-block;
}

.nav.depth-00 .submenu .submenu-items.filters span.tag.selected .count {
  display: none;
}

.nav.depth-00 .submenu .submenu-items.filters span .closef,
.nav.depth-00 .submenu .submenu-items.filters span .count {
  pointer-events: none;
  margin: 0;
}

.nav.depth-00 .submenu .submenu-items.filters span .closef {
  display: none;
}

.nav.depth-00 .person_info {
  display: none;
  font-size: calc(1rem + .5vw);
  width: calc(100vw - 1.25rem);
  background: #505046;
  font-size: calc(1rem + .5vw);
  margin: 0.625rem 0.3125rem -.3125rem;
}

.nav.depth-00 .person_info p {
  padding: 0.25rem 0.5rem 0.5rem;
  color: #ffffff;
}

.nav.depth-00 .person_info.show {
  display: block;
}

.nav.depth-0 h1 {
  width: calc(100vw - 1.25rem);
  background: #736464;
  font-size: calc(2.125rem + 1vw);
  padding: 0.5rem;
  margin: 0.3125rem;
}

.nav.depth-1 .wrap {
  width: calc(25vw - 0.785rem);
  background: #bebecb;
  font-size: calc(1rem + 1.15vw);
  float: left;
  margin: 0.3125rem;
  display: block;
}

.nav.depth-1 .wrap:nth-child(4n+5) {
  clear: both;
}

.nav.depth-1 .wrap a {
  padding: 0.5rem;
  display: inline-block;
  width: 100%;
}

.nav.depth-1 .wrap.bigpost {
  width: calc(100vw - 1.25rem);
}

.nav.depth-2 {
  width: calc(25vw - .785rem);
  float: left;
  margin: 0.3125rem;
}

.nav.depth-2 h1 {
  width: calc(25vw - 0.785rem);
  background: #828782;
  font-size: calc(1rem + 1.15vw);
  float: none;
  margin: 0;
}

.nav.depth-2 .wrap {
  background: #bebecb;
  font-size: calc(1rem + 1.15vw);
  float: none;
  margin: 0;
}

.nav.depth-3 h1 {
  background: #a0a5a0;
  margin-top: 0.625rem !important;
}

.nav a.visited span {
  position: relative;
  padding-left: 1.75rem;
  width: 100%;
  display: inline-block;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-bottom: -0.45rem;
}

.nav a.visited span:before {
  content: '';
  -moz-transform: scaleX(-1) rotate(135deg);
  -ms-transform: scaleX(-1) rotate(135deg);
  -webkit-transform: scaleX(-1) rotate(135deg);
  transform: scaleX(-1) rotate(135deg);
  -moz-transform-origin: left top;
  -ms-transform-origin: left top;
  -webkit-transform-origin: left top;
  transform-origin: left top;
  border-right: 0.2rem solid black;
  border-top: 0.2rem solid black;
  display: block;
  height: 1.25rem;
  left: 0;
  position: absolute;
  top: 1.05rem;
  top: calc(1rem + 0.35vw);
  width: 0.625rem;
}

.nav .nav h1 + .wrap {
  margin-top: 0.625rem;
}

.nav .depth-2 .wrap + .wrap {
  margin-top: 0.625rem;
}

body[ndx--tabs='open'] .nav.depth-00 * {
  pointer-events: none;
}

.main {
  margin-top: calc(4.2rem + 1vw);
  width: calc(100vw - 0.5rem);
  position: absolute;
  perspective: 50vh;
  perspective-origin: bottom;
  height: 100vh;
  overflow: hidden;
}

.main.mainopen {
  height: auto;
  display: inline-block;
  position: initial;
  perspective: initial;
}

.main.mainopen + .subfooter {
  display: inline-block;
  position: initial;
  margin: -.3125rem .3125rem .3125rem;
}

.main.mainopen + .subfooter + footer {
  bottom: initial !important;
  display: inline-block;
  position: initial;
  margin-bottom: 0;
}

.main .nav.depth-0 > .nav.depth-1:first-child > h1 {
  opacity: 0;
}

.main .nav.depth-1:first-child > h1 {
  display: none;
}

.main .nav.depth-1:nth-of-type(2n) .wrap + .wrap {
  margin-top: 0.3125rem;
}

.main .nav.depth-1 h1:hover {
  cursor: no-drop;
}

img {
  width: calc(100% + 1rem);
  height: auto;
  margin: -.5rem 0 0.25rem -.5rem;
}

#overlay {
  width: 100vw;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1000;
  background: #ffffff;
  padding: 0.3125rem;
  overflow-y: scroll;
  display: none;
}

#overlay .header {
  top: initial;
}

#overlay .header > div {
  width: calc(100% - 3.787rem - 1vw - .625rem);
}

#overlay.show {
  display: block;
}

#overlay main {
  display: inline-block;
  width: 100%;
  margin-top: calc(4.25rem + 1vw);
  min-height: calc(100% - calc(8.5rem + 1vw + .9375rem));
}

#overlay main.sitereferences {
  padding: 0 0.3125rem;
}

#overlay main.sitereferences .wrap.references:first-of-type {
  margin-top: 0.3125rem;
}

#overlay .wrap {
  width: 100%;
  background: #bebecb;
  font-size: calc(1rem + 1.15vw);
  float: none;
  display: block;
  padding: 0.5rem;
}

#overlay .wrap.references {
  margin: 0.625rem 0;
}

#overlay .videowrap {
  margin-top: 0.625rem;
  background: #a0a5a0;
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
  height: auto;
  margin-top: 0.625rem;
  background: #a0a5a0;
}

#overlay .videowrap video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

#overlay .videowrap.active {
  position: -webkit-sticky;
  position: sticky;
  top: calc(2.25rem + 1vw + 2.4625rem);
  z-index: 800;
}

#overlay .videowrap iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

#overlay .videocaption figcaption {
  margin: 0.25rem 0 1rem;
  font-size: 0.9rem;
}

#overlay .caption {
  margin: 0.25rem 0 1rem;
  font-size: 0.9rem;
}

#overlay .caption a {
  color: #968296;
}

#overlay .column {
  width: calc(33.333% - 0.625rem);
  float: left;
  margin: 0.3125rem;
  font-size: calc(1rem + .25vw);
}

#overlay abbr {
  color: #968296;
  text-decoration: none;
  padding: 1rem 0;
  cursor: pointer;
}

#overlay .desc {
  position: absolute;
  background: #968296;
  color: #000000;
  z-index: 2000;
  width: calc(33.333% - .625rem);
  padding: 0.5rem;
  margin-left: 0.625rem;
  display: none;
}

#overlay .desc.show {
  display: block;
}

#overlay .text figure img {
  width: 100%;
  margin: 0.5rem 0;
  height: auto;
}

#overlay .text figure figcaption {
  margin-top: -0.25rem;
  font-size: 0.9rem;
}

#overlay .text figure figcaption a {
  color: #968296;
}

#overlay .text figure + p {
  margin-top: 1rem;
}

#overlay .text h1 {
  width: 100%;
  background: #bebecb;
  font-size: calc(1rem + 1.15vw);
  float: none;
  display: block;
  padding: 0.5rem;
  margin-bottom: 0.5rem;
}

#overlay .text p a {
  color: #968296;
}

#overlay .text .footnotes .wrap {
  margin: 0.625rem 0;
}

#overlay .text .footnote-ref {
  color: #968296;
  padding: 0.5rem;
  margin: 0 -0.5rem;
}

#overlay .text .footnotes .footnote-backref {
  color: #968296;
  padding: 0.5rem;
  margin: 0 -0.5rem;
  vertical-align: top;
  line-height: 1;
}

#overlay .text .footnotes p a {
  color: #968296;
}

#overlay .exam .answers,
#overlay .exam .question {
  font-size: 1.25rem;
  line-height: 1.35;
  margin-top: 0.3125rem;
}

#overlay .exam .answers li,
#overlay .exam .question li {
  list-style: disc;
  margin-left: 1rem;
}

#overlay .exam .answers {
  margin-top: 0.625rem;
  padding: 0.5rem;
  background: #968296;
  display: none;
}

#overlay .exam.active .answers {
  display: block;
}

#overlay .exam .input {
  width: 100%;
  font-family: 'Union Regular', sans-serif;
  font-size: 1.25rem;
  line-height: 1.35;
  border: 0;
  padding: 0.5rem 0.5rem 1.85rem;
  background: #968296;
}

#overlay .exam .input:focus {
  border: 0;
  outline: 0;
}

#overlay .exam .reveal {
  margin: 0.625rem 0;
  color: #968296;
  cursor: pointer;
}

#overlay .meta {
  background: #bebecb;
  padding: 0.5rem;
  margin: 0.5rem 0;
}

#overlay .meta.pdf a {
  display: inline-block;
  width: 100%;
}

#overlay .meta .tag:after {
  content: ',';
}

#overlay .meta .tag:last-of-type:after {
  content: ' ';
}

#overlay .relatedpages .wrap {
  width: 100%;
  background: #bebecb;
  font-size: calc(1rem + 1.15vw);
  float: none;
  display: block;
  padding: 0.5rem;
  margin: 0.5rem 0;
}

#overlay .column.play .text {
  display: none;
}

#overlay .column.play .text.show, #overlay .column.play .text.temp_show {
  display: block;
}

#overlay .column.play .text.temp_show {
  opacity: 0.4;
}

#overlay .column.play .text.temp_hide {
  display: none;
}

#overlay .imprint .wrap {
  margin-bottom: 0.3125rem;
}

#overlay .imprint .progress {
  color: #968296;
}

#overlay .footer {
  margin-bottom: 0.625rem;
  top: initial;
  z-index: initial;
  position: initial;
}

#overlay .footer .next,
#overlay .footer .prev {
  border-right: 0;
  width: 50%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 0;
  margin-right: initial;
  display: initial;
}

#overlay .footer .next .title,
#overlay .footer .prev .title {
  padding: 0.5rem;
  width: calc(100% - calc(3.787rem + 1vw));
  overflow: hidden;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  border: 0;
}

#overlay .footer .next .arrow,
#overlay .footer .prev .arrow {
  height: calc(3.787rem + 1vw);
  width: calc(3.787rem + 1vw);
  padding: 0;
  margin: 0;
  border: 0;
  text-align: center;
}

#overlay .footer .next .arrow img,
#overlay .footer .prev .arrow img {
  width: 55%;
  text-align: center;
  margin: 0 auto;
  padding: 0;
  margin-top: calc(.02rem + 1vw / 3);
  margin-top: 22.5%;
}

#overlay .footer .next .arrow.hide,
#overlay .footer .prev .arrow.hide {
  display: none;
}

#overlay .footer .prev {
  border-right: 0.3125rem solid white;
}

#overlay .footer .prev .arrow {
  float: left;
}

#overlay .footer .prev .arrow img {
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg);
}

#overlay .footer .next {
  border-right: 0;
  border-left: 0.3125rem solid white;
  text-align: right;
}

#overlay .footer .next .arrow {
  float: right;
}

#overlay .footer .next .arrow img {
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
}

.repository .nav .wrap.hide {
  display: none;
}

.repository .wrap[ndx--tag--category="reference"] {
  background: #c2c7d7 !important;
}

.repository .wrap[ndx--tag--category="manual"] {
  background: #c9d7c8 !important;
}

.repository .wrap[ndx--tag--category="description"] {
  background: #d7d6c2 !important;
}

.repository .wrap[ndx--tag--category="synthesis"] {
  background: #d8cbcb !important;
}

.repository .wrap[ndx--tag--category="conception"] {
  background: #d4c7dd !important;
}

.play .nav h1 + .wrap,
.play .wrap + .wrap {
  margin-top: 0.625rem;
}

.play .nav.depth-1 {
  width: calc(100vw - 1.25rem);
}

.play .nav.depth-2 {
  width: calc(100vw - 1.25rem);
}

.play .nav.depth-2 > h1 {
  width: calc(100vw - 1.25rem);
}

.hide {
  display: none;
}

.gecko .nav.depth-00 .submenu .submenu-item .dropbtn,
.gecko .nav.depth-00 .submenu .submenu-item .dropbtn2 {
  line-height: 43px;
}

#overlay .column .wrap[ndx--tag--category="reference"] {
  background: #c2c7d7 !important;
}

#overlay .column .wrap[ndx--tag--category="manual"] {
  background: #c9d7c8 !important;
}

#overlay .column .wrap[ndx--tag--category="description"] {
  background: #d7d6c2 !important;
}

#overlay .column .wrap[ndx--tag--category="synthesis"] {
  background: #d8cbcb !important;
}

#overlay .column .wrap[ndx--tag--category="conception"] {
  background: #d4c7dd !important;
}

/* Hamburger
-------------------------------------------------- */
.close,
.menu {
  background-color: #ffffff;
  color: transparent;
  text-indent: -624.94rem;
  border: none;
  /* Active */
  /* Passive */
}

.close:focus,
.menu:focus {
  outline: none;
}

.close span,
.menu span {
  display: block;
  position: absolute;
  top: 47%;
  left: 1rem;
  right: 1rem;
  height: 0.275rem;
  background: none;
}

.close span:after, .close span:before,
.menu span:after,
.menu span:before {
  position: absolute;
  display: block;
  left: 0;
  width: 100%;
  height: 0.275rem;
  background-color: #ffffff;
  content: "";
  -moz-transition-duration: 0.3s, 0.3s;
  -o-transition-duration: 0.3s, 0.3s;
  -webkit-transition-duration: 0.3s, 0.3s;
  transition-duration: 0.3s, 0.3s;
  -moz-transition-delay: 0, 0.3s;
  -o-transition-delay: 0, 0.3s;
  -webkit-transition-delay: 0, 0.3s;
  transition-delay: 0, 0.3s;
}

.close span:before,
.menu span:before {
  top: 0;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  -webkit-transition-property: top, transform;
  transition-property: top, transform;
}

.close span:after,
.menu span:after {
  bottom: 0;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  -webkit-transition-property: bottom, transform;
  transition-property: bottom, transform;
}

.close.closed span,
.menu.closed span {
  background-color: #ffffff;
  color: transparent;
  text-indent: -624.94rem;
  border: none;
}

.close.closed span,
.menu.closed span {
  background-color: #ffffff;
  -moz-transition: background 0s, 0.3s;
  -o-transition: background 0s, 0.3s;
  -webkit-transition: background 0s, 0.3s;
  transition: background 0s, 0.3s;
  -moz-transition-delay: 0, 0.3s;
  -o-transition-delay: 0, 0.3s;
  -webkit-transition-delay: 0, 0.3s;
  transition-delay: 0, 0.3s;
}

.close.closed span:before,
.menu.closed span:before {
  top: -1rem;
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
  background-color: #ffffff;
}

.close.closed span:after,
.menu.closed span:after {
  bottom: -1rem;
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
}

.close.closed span:after, .close.closed span:before,
.menu.closed span:after,
.menu.closed span:before {
  -moz-transition-delay: 0.3s, 0s;
  -o-transition-delay: 0.3s, 0s;
  -webkit-transition-delay: 0.3s, 0s;
  transition-delay: 0.3s, 0s;
}

@media screen and (max-width: 800px) {
  .nav a.visited span:before {
    display: initial;
    top: 0.9rem;
  }
  .footer,
  .header,
  .nav.depth-0 h1 {
    font-size: calc(1.6rem + 1vw);
  }
  .header > div {
    width: calc(100% - 9rem - 2vw - 2.38rem);
  }
  .header .shuffle {
    width: calc(3rem + 1vw);
    right: calc(7.25rem + 2vw);
  }
  .header .shuffle span {
    border: 0.19rem solid #ffffff;
  }
  .header .shuffle span.card1 {
    top: 0.225rem;
    bottom: 2rem;
    left: 0.225rem;
    right: 2rem;
  }
  .header .shuffle span.card2 {
    top: 0.225rem;
    bottom: 2rem;
    left: 2rem;
    right: 0.225rem;
  }
  .header .shuffle span.card3 {
    top: 2rem;
    bottom: 0.225rem;
    left: 0.225rem;
    right: 2rem;
  }
  .header .shuffle span.card4 {
    top: 2rem;
    bottom: 0.225rem;
    left: 2rem;
    right: 0.225rem;
  }
  .header .shuffle.closed span {
    border: 0.19rem solid #ffffff;
  }
  .header .shuffle.closed span.card1 {
    top: 0.225rem;
    bottom: 2.5rem;
    left: 0.725rem;
    right: 2rem;
  }
  .header .shuffle.closed span.card2 {
    top: 0.725rem;
    bottom: 2rem;
    left: 2.2rem;
    right: 0.525rem;
  }
  .header .shuffle.closed span.card3 {
    top: 2.3rem;
    bottom: 0.425rem;
    left: 0.925rem;
    right: 1.8rem;
  }
  .header .shuffle.closed span.card4 {
    top: 2rem;
    bottom: 0.825rem;
    left: 2.4rem;
    right: 0.3725rem;
  }
  .header .tabs {
    width: calc(3rem + 1vw);
    right: calc(3.625rem + 1vw);
  }
  .header .tabs span {
    border: 0.19rem solid white;
  }
  .header .close,
  .header .menu {
    width: calc(3rem + 1vw);
  }
  .footer {
    height: initial;
  }
  .footer div {
    height: initial;
  }
  .footer .top {
    height: initial;
    width: calc(2.5rem + 1vw + 0.625rem);
  }
  .main {
    margin-top: calc(3.8625rem + 1vw);
  }
  .close span,
  .close span::after,
  .close span::before,
  .menu span,
  .menu span::after,
  .menu span::before {
    height: 0.175rem;
  }
  .close.closed span::before,
  .menu.closed span::before {
    top: -.65rem;
  }
  .close.closed span::after,
  .menu.closed span::after {
    bottom: -.65rem;
  }
  #overlay .footer .next .arrow,
  #overlay .footer .prev .arrow {
    height: calc(3rem + 1vw);
    width: calc(3rem + 1vw);
  }
  #overlay .header > div {
    width: calc(100% - 3rem - 1vw - .625rem);
  }
  #overlay main {
    margin-top: calc(3.55rem + 1vw);
    min-height: calc(100% - calc(7.1rem + 1vw + .9375rem));
  }
  #overlay .footer .next .title,
  #overlay .footer .prev .title {
    width: calc(100% - calc(4.787rem + 1vw));
  }
  .nav.depth-00 > h1 {
    font-size: calc(1.6rem + 1vw);
    margin-top: 0;
  }
  .nav.depth-1 .wrap,
  .nav.depth-2,
  .nav.depth-2 .wrap,
  .nav.depth-2 h1,
  .nav.depth-3 .wrap {
    width: calc(100vw - 1.25rem);
  }
  #overlay .column {
    width: calc(100% - .625rem);
  }
  img {
    width: calc(100% + 1rem);
  }
  #overlay .videowrap.videowrap.active {
    top: initial;
    z-index: initial;
  }
}

ul.relatedsites li {
  list-style: disc;
  padding-left: 0;
  margin-left: 1rem;
  line-height: 1.35;
}

.text > iframe {
  width: 100% !important;
  margin-top: .625rem;
}

@media screen and (max-width: 600px), only screen and (min-device-width: 320px) and (max-device-width: 480px) {
  .nav.depth-00 > h1 {
    font-size: calc(1.025rem + 1vw);
    margin-top: 0;
  }
  .footer,
  .header,
  .nav.depth-0 h1 {
    font-size: calc(1.025rem + 1vw);
  }
  .footer {
    overflow: hidden;
    margin-bottom: 0.3125rem;
    height: initial;
  }
  .footer div {
    height: initial;
  }
  .footer .top {
    height: initial;
    width: calc(2.225rem + 1vw);
  }
  .header > div {
    width: calc(100% - 4.45rem - 1vw - 1.625rem);
    width: calc(100% - 6.675rem - 2vw - 2.25rem);
  }
  .header .shuffle {
    width: calc(2.225rem + 1vw);
    right: calc(4.45rem + 2vw + 1.25rem);
  }
  .header .shuffle span {
    border: 0.15rem solid white;
  }
  .header .shuffle span.card1 {
    top: 0.225rem;
    bottom: 1.5rem;
    left: 0.225rem;
    right: 1.5rem;
  }
  .header .shuffle span.card2 {
    top: 0.225rem;
    bottom: 1.5rem;
    left: 1.5rem;
    right: 0.225rem;
  }
  .header .shuffle span.card3 {
    top: 1.5rem;
    bottom: 0.225rem;
    left: 0.225rem;
    right: 1.5rem;
  }
  .header .shuffle span.card4 {
    top: 1.5rem;
    bottom: 0.225rem;
    left: 1.5rem;
    right: 0.225rem;
  }
  .header .shuffle.closed span {
    border: 0.15rem solid white;
  }
  .header .shuffle.closed span.card1 {
    top: 0.225rem;
    bottom: 3rem;
    left: 0.725rem;
    right: 2.5rem;
    top: 0.225rem;
    bottom: 1.5rem;
    left: 0.225rem;
    right: 1.5rem;
  }
  .header .shuffle.closed span.card2 {
    top: 0.525rem;
    bottom: 1.3rem;
    left: 1.2rem;
    right: 0.525rem;
  }
  .header .shuffle.closed span.card3 {
    top: 1.3rem;
    bottom: 0.525rem;
    left: 0.425rem;
    right: 1.3rem;
  }
  .header .shuffle.closed span.card4 {
    top: 1.4rem;
    bottom: 0.425rem;
    left: 1.4rem;
    right: 0.325rem;
  }
  .header .tabs {
    width: calc(2.225rem + 1vw);
    right: calc(2.225rem + 1vw + 0.625rem);
  }
  .header .tabs span {
    border: 0.15rem solid white;
  }
  .header .tabs.closed .card1 {
    bottom: 0.5rem;
    right: 0.5rem;
  }
  .header .tabs.closed .card2 {
    top: 0.5rem;
    left: 0.5rem;
  }
  .header .close,
  .header .menu {
    width: calc(2.225rem + 1vw);
  }
  .header .close span,
  .header .menu span {
    top: 47%;
  }
  .main {
    margin-top: calc(3.1125rem + 1vw);
  }
  #overlay .header > div {
    width: calc(100% - 2.225rem - 1vw - .625rem);
  }
  #overlay main {
    margin-top: calc(2.225rem + 1vw + 0.625rem);
    min-height: calc(100% - calc(4.45rem + 2vw + 1.25rem));
  }
  #overlay .footer .next .title,
  #overlay .footer .prev .title {
    width: calc(100% - calc(3.5rem + 1vw));
  }
  #overlay .footer .next .arrow,
  #overlay .footer .prev .arrow {
    height: calc(2.225rem + 1vw);
    width: calc(2.225rem + 1vw);
  }
  #overlay .desc {
    width: calc(75% - 1.225rem);
  }
  .exam .answers,
  .exam .question {
    font-size: calc(1.025rem + 1vw);
  }
  .close span,
  .menu span {
    top: 47%;
    left: 0.5rem;
    right: 0.5rem;
    height: 0.1rem;
  }
  .close span:after, .close span:before,
  .menu span:after,
  .menu span:before {
    height: 0.1rem;
  }
  .close.closed span:before,
  .menu.closed span:before {
    top: -0.5rem;
  }
  .close.closed span:after,
  .menu.closed span:after {
    bottom: -0.5rem;
  }
}

@media screen and (max-width: 440px) {
  .nav.depth-00 .submenu .submenu-item {
    height: initial;
    max-height: initial;
  }
  .nav.depth-00 .submenu .submenu-item .sort {
    padding-left: 0.5rem;
    padding-top: 0;
  }
  .nav.depth-00 .submenu .submenu-items.filters .submenu-items-group {
    margin-bottom: 0.75rem;
  }
}

@keyframes shake-little {
  2% {
    transform: translate(-0.25px, -0.25px) rotate(0.125deg);
  }
  4% {
    transform: translate(1.125px, -0.75px) rotate(-0.125deg);
  }
  6% {
    transform: translate(1.125px, 0.25px) rotate(0.375deg);
  }
  8% {
    transform: translate(-0.25px, 1.125px) rotate(-0.125deg);
  }
  10% {
    transform: translate(0.75px, -0.25px) rotate(0.375deg);
  }
  12% {
    transform: translate(0.25px, -0.75px) rotate(-0.125deg);
  }
  14% {
    transform: translate(0.25px, -0.75px) rotate(0.125deg);
  }
  16% {
    transform: translate(-0.25px, 0.25px) rotate(0.125deg);
  }
  18% {
    transform: translate(-0.75px, 0.75px) rotate(0.125deg);
  }
  20% {
    transform: translate(-0.25px, -0.75px) rotate(-0.125deg);
  }
  22% {
    transform: translate(0.75px, 0.75px) rotate(0.125deg);
  }
  24% {
    transform: translate(-0.75px, 1.125px) rotate(0.375deg);
  }
  26% {
    transform: translate(-0.25px, 0.25px) rotate(0.125deg);
  }
  28% {
    transform: translate(-0.75px, 0.75px) rotate(-0.125deg);
  }
  30% {
    transform: translate(0.75px, 0.25px) rotate(0.125deg);
  }
  32% {
    transform: translate(0.75px, -0.25px) rotate(0.125deg);
  }
  34% {
    transform: translate(1.125px, 0.75px) rotate(-0.125deg);
  }
  36% {
    transform: translate(-0.75px, -0.25px) rotate(-0.125deg);
  }
  38% {
    transform: translate(0.75px, 1.125px) rotate(-0.125deg);
  }
  40% {
    transform: translate(-0.25px, -0.75px) rotate(0.125deg);
  }
  42% {
    transform: translate(0.25px, 0.25px) rotate(0.125deg);
  }
  44% {
    transform: translate(0.75px, 0.75px) rotate(-0.125deg);
  }
  46% {
    transform: translate(-0.75px, 0.25px) rotate(-0.125deg);
  }
  48% {
    transform: translate(0.75px, 0.75px) rotate(0.375deg);
  }
  50% {
    transform: translate(0.25px, -0.25px) rotate(0.125deg);
  }
  52% {
    transform: translate(-0.25px, 0.25px) rotate(0.375deg);
  }
  54% {
    transform: translate(0.75px, -0.75px) rotate(0.125deg);
  }
  56% {
    transform: translate(-0.25px, -0.75px) rotate(0.375deg);
  }
  58% {
    transform: translate(1.125px, 0.75px) rotate(0.125deg);
  }
  60% {
    transform: translate(-0.25px, -0.25px) rotate(0.375deg);
  }
  62% {
    transform: translate(0.75px, 1.125px) rotate(-0.125deg);
  }
  64% {
    transform: translate(-0.75px, 0.25px) rotate(-0.125deg);
  }
  66% {
    transform: translate(1.125px, 0.75px) rotate(-0.125deg);
  }
  68% {
    transform: translate(1.125px, 0.25px) rotate(0.375deg);
  }
  70% {
    transform: translate(-0.75px, -0.75px) rotate(0.125deg);
  }
  72% {
    transform: translate(-0.75px, -0.25px) rotate(-0.125deg);
  }
  74% {
    transform: translate(-0.25px, -0.75px) rotate(0.375deg);
  }
  76% {
    transform: translate(0.75px, 0.75px) rotate(0.125deg);
  }
  78% {
    transform: translate(0.75px, -0.25px) rotate(0.375deg);
  }
  80% {
    transform: translate(-0.25px, 0.75px) rotate(0.375deg);
  }
  82% {
    transform: translate(1.125px, 1.125px) rotate(0.125deg);
  }
  84% {
    transform: translate(-0.25px, 0.25px) rotate(0.375deg);
  }
  86% {
    transform: translate(0.75px, -0.25px) rotate(0.375deg);
  }
  88% {
    transform: translate(1.125px, -0.75px) rotate(0.125deg);
  }
  90% {
    transform: translate(0.25px, -0.75px) rotate(-0.125deg);
  }
  92% {
    transform: translate(-0.25px, -0.75px) rotate(0.375deg);
  }
  94% {
    transform: translate(1.125px, 0.25px) rotate(0.375deg);
  }
  96% {
    transform: translate(-0.25px, -0.75px) rotate(-0.125deg);
  }
  98% {
    transform: translate(-0.25px, -0.75px) rotate(0.125deg);
  }
  0%,
  100% {
    transform: translate(0, 0) rotate(0);
  }
}

@keyframes shake {
  2% {
    transform: translate(-0.5px, -0.5px) rotate(0.5deg);
  }
  4% {
    transform: translate(2.5px, -1.5px) rotate(-0.5deg);
  }
  6% {
    transform: translate(2.5px, 0.5px) rotate(1.5deg);
  }
  8% {
    transform: translate(-0.5px, 2.5px) rotate(-0.5deg);
  }
  10% {
    transform: translate(1.5px, -0.5px) rotate(1.5deg);
  }
  12% {
    transform: translate(0.5px, -1.5px) rotate(-0.5deg);
  }
  14% {
    transform: translate(0.5px, -1.5px) rotate(0.5deg);
  }
  16% {
    transform: translate(-0.5px, 0.5px) rotate(0.5deg);
  }
  18% {
    transform: translate(-1.5px, 1.5px) rotate(0.5deg);
  }
  20% {
    transform: translate(-0.5px, -1.5px) rotate(-0.5deg);
  }
  22% {
    transform: translate(1.5px, 1.5px) rotate(0.5deg);
  }
  24% {
    transform: translate(-1.5px, 2.5px) rotate(1.5deg);
  }
  26% {
    transform: translate(-0.5px, 0.5px) rotate(0.5deg);
  }
  28% {
    transform: translate(-1.5px, 1.5px) rotate(-0.5deg);
  }
  30% {
    transform: translate(1.5px, 0.5px) rotate(0.5deg);
  }
  32% {
    transform: translate(1.5px, -0.5px) rotate(0.5deg);
  }
  34% {
    transform: translate(2.5px, 1.5px) rotate(-0.5deg);
  }
  36% {
    transform: translate(-1.5px, -0.5px) rotate(-0.5deg);
  }
  38% {
    transform: translate(1.5px, 2.5px) rotate(-0.5deg);
  }
  40% {
    transform: translate(-0.5px, -1.5px) rotate(0.5deg);
  }
  42% {
    transform: translate(0.5px, 0.5px) rotate(0.5deg);
  }
  44% {
    transform: translate(1.5px, 1.5px) rotate(-0.5deg);
  }
  46% {
    transform: translate(-1.5px, 0.5px) rotate(-0.5deg);
  }
  48% {
    transform: translate(1.5px, 1.5px) rotate(1.5deg);
  }
  50% {
    transform: translate(0.5px, -0.5px) rotate(0.5deg);
  }
  52% {
    transform: translate(-0.5px, 0.5px) rotate(1.5deg);
  }
  54% {
    transform: translate(1.5px, -1.5px) rotate(0.5deg);
  }
  56% {
    transform: translate(-0.5px, -1.5px) rotate(1.5deg);
  }
  58% {
    transform: translate(2.5px, 1.5px) rotate(0.5deg);
  }
  60% {
    transform: translate(-0.5px, -0.5px) rotate(1.5deg);
  }
  62% {
    transform: translate(1.5px, 2.5px) rotate(-0.5deg);
  }
  64% {
    transform: translate(-1.5px, 0.5px) rotate(-0.5deg);
  }
  66% {
    transform: translate(2.5px, 1.5px) rotate(-0.5deg);
  }
  68% {
    transform: translate(2.5px, 0.5px) rotate(1.5deg);
  }
  70% {
    transform: translate(-1.5px, -1.5px) rotate(0.5deg);
  }
  72% {
    transform: translate(-1.5px, -0.5px) rotate(-0.5deg);
  }
  74% {
    transform: translate(-0.5px, -1.5px) rotate(1.5deg);
  }
  76% {
    transform: translate(1.5px, 1.5px) rotate(0.5deg);
  }
  78% {
    transform: translate(1.5px, -0.5px) rotate(1.5deg);
  }
  80% {
    transform: translate(-0.5px, 1.5px) rotate(1.5deg);
  }
  82% {
    transform: translate(2.5px, 2.5px) rotate(0.5deg);
  }
  84% {
    transform: translate(-0.5px, 0.5px) rotate(1.5deg);
  }
  86% {
    transform: translate(1.5px, -0.5px) rotate(1.5deg);
  }
  88% {
    transform: translate(2.5px, -1.5px) rotate(0.5deg);
  }
  90% {
    transform: translate(0.5px, -1.5px) rotate(-0.5deg);
  }
  92% {
    transform: translate(-0.5px, -1.5px) rotate(1.5deg);
  }
  94% {
    transform: translate(2.5px, 0.5px) rotate(1.5deg);
  }
  96% {
    transform: translate(-0.5px, -1.5px) rotate(-0.5deg);
  }
  98% {
    transform: translate(-0.5px, -1.5px) rotate(0.5deg);
  }
  0%,
  100% {
    transform: translate(0, 0) rotate(0);
  }
}

.shake,
.shake-little {
  display: inline-block;
  animation-name: shake;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
}

.shake {
  transform-origin: center center;
  animation-duration: 100ms;
}

.shake-little {
  animation-name: shake-little;
  animation-duration: 200ms;
}

.inactive {
  pointer-events: none;
}

.hupsy {
  display: none;
}

.nav.depth-1.isfiltered .wrap:nth-of-type(4n+5) {
  clear: initial;
}

.repository .wrap.fourth {
  clear: both;
}

.hidden {
  opacity: 0;
}

.nav.depth-1[ndx--target="modes-of-play"] .wrap {
  width: calc(16.666vw - .725rem);
}

.nav.depth-1[ndx--target="modes-of-play"] .wrap a span {
  overflow: hidden;
  width: 100%;
  float: left;
  text-overflow: ellipsis;
}

.nav.depth-1[ndx--target="modes-of-play"] .nav.depth-2 {
  width: calc(16.666vw - .725rem);
}

.nav.depth-1[ndx--target="modes-of-play"] .nav.depth-2 h1 {
  width: calc(16.666vw - .725rem);
  overflow: hidden;
  width: 100%;
  float: none;
  text-overflow: ellipsis;
}