@import url('https://fonts.googleapis.com/css?family=Roboto:100,300,400,700');

@font-face {
  font-family: 'firstFont';
  src: url('1.woff');
}

body,
html {
  padding: 0vw;
  margin: 0vw;
  font-family: 'firstFont', sans-serif;
  text-rendering: geometricPrecision;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  width: 100%;
  height: 100%;
  line-height: 1.85vw;
}
img {
  border: 0;
}
body {
  font-size: 1.35vw;
  color: #1e1e1e;
  font-weight: 300;
}
button,
input {
  font-family: 'firstFont', sans-serif;
}
#myCanvas {
  position: absolute;
  top: 0vw;
  left: 0vw;
  pointer-events: none;
  image-rendering: -moz-crisp-edges;
  image-rendering: -webkit-crisp-edges;
  image-rendering: pixelated;
  image-rendering: crisp-edges;
}

#intro,
#page {
  position: absolute;
  top: 0vw;
  left: 0vw;
  width: 100%;
  height: 100%;
}
button {
  padding: 0.1vw 0.8vw;
  font-size: inherit;
  background-color: transparent;
  cursor: pointer;
  white-space: nowrap;
  box-sizing: border-box !important;
  font-weight: 300;
}
button:focus {
  outline: 0;
}
input:focus {
  outline: 0;
}
#intro {
  box-sizing: border-box;
  cursor: pointer;
}
#intro button {
  color: #fff;
  border: 1px #fff solid;
  margin: 1.5vw;
  z-index: 1000;
}
.startdiv {
  position: absolute;
  width: 100%;
  height: 100%;
  background-position: center center;
  background-size: auto 100%;
  z-index: -1;
  overflow: hidden;
}
#page {
  background-color: #fff;
  min-height: 38vw;
}
#page button {
  color: #1e1e1e;
  border: 1px #1e1e1e solid;
}
#c1bsd {
  position: relative;
  margin-bottom: 0.3vw;
}
#c1bs {
  color: #1e1e1e;
  border: 1px #1e1e1e solid;
  width: 2.8vw;
  padding: 0.1vw 0vw 0.1vw 2.6vw;
  font-size: inherit;
  background-color: transparent;
  cursor: pointer;
  white-space: nowrap;
  box-sizing: border-box !important;
  font-weight: 300;
  line-height: 2.3vw;
}
#c1bsd input:hover,
#c1bsd input:focus {
  width: 21.5vw;
  padding: 0.1vw 1vw 0.1vw 2.6vw;
}

#page button:hover {
  background-color: #c7c1b9;
}
#page button.start:hover {
  border: 1px #1e1e1e solid;
  background-color: #1e1e1e;
  color: #fff;
}
.footer button {
  display: block;
  margin-top: -1px;
  margin-bottom: 0vw;
  width: 14vw;
  text-align: left;
}
#page .footer button:hover {
  background-color: #0091ff;
}
.round {
  background-color: #1e1e1e;
  width: 2.8vw;
  height: 1.4vw;
  border-radius: 1.5vw;
  color: #fff;
  margin: 0.1vw 0vw;
  padding: 0.7vw 0vw;
  text-align: center;
  font-size: 1.2vw;
  line-height: 1.4vw !important;
  text-shadow: none;
  text-decoration: none !important;
  border-bottom: none;
}
.round:hover {
  background-color: #0091ff;
}
.round svg {
  color: #fff !important;
  fill: #fff !important;
  width: 100%;
  height: 100%;
}
#nav a {
  line-height: 1.4vw !important;
  text-shadow: none;
  text-decoration: none !important;
  border-bottom: none;
}
#nav a .round {
  line-height: 1.2vw !important;
  padding-top: 0.8vw;
}
#column1 {
  width: 17vw;
  padding: 1.5vw;
}

#column2 {
  width: 19.5vw;
  padding-top: 1.6vw;
}

#column2 button {
  display: block;
  margin: -1px 0 0 0;
  width: 13vw;
  text-align: left;
}

.column {
  height: 100%;
  float: left;
  position: relative;
  box-sizing: border-box;
}
#rightColumn {
  overflow-y: scroll;
  float: right;
}
#contentRight {
  box-sizing: border-box;
  float: right;
  overflow-y: auto;
  height: 100vh;
}
#columnr {
  width: 19.4vw;
}
#columnr button {
  display: block;
  margin: -1px 0 0 0;
  width: 19.4vw;
  text-align: left;
  white-space: normal;
}
.siatka {
  position: absolute;
  border: 1px dashed #1e1e1e;
  border-left-style: solid;
  border-right-width: 0px;
  border-bottom-width: 0px;
  box-sizing: border-box;
  width: 100px;
  pointer-events: none;
}

.footer {
  position: absolute;
  bottom: 2vw;
}

.content {
  padding: 0;
  padding-left: 1.5vw;
  box-sizing: border-box;
}

.contentInner {
  padding: 1.5vw;
  padding-left: 0px;
  box-sizing: border-box;
}

.bold,
b,
strong {
  font-weight: 400;
  border-bottom: 0.5px solid currentColor;
  display: inline-block;
  line-height: 1.2;
}
.clear {
  clear: both;
}
a {
  color: #1e1e1e;
  text-decoration: none;
}

.actuell {
  box-sizing: border-box;
  border: 1px solid #1e1e1e;
  border-bottom: 0px;
  padding: 0.4vw 0.8vw;
}
.actuell a,
.infobox a,
.contentInner a,
.contdiv a {
  border-bottom: 0.5px solid currentColor;
  display: inline-block;
  line-height: 1.2;
}
.komol a,
.komold a {
  text-decoration: none;
  border-bottom: none;
  text-shadow: none;
}
.actuell a:hover,
.infobox a:hover,
.contentInner a:hover {
  color: #c7c1b9;
}
.innerkomol a {
  border-bottom: 0.5px solid currentColor;
}
.innerkomol a:hover {
  color: #fff !important;
}
.gopis a:hover {
  color: #fff;
}
.release {
  padding: 0px;
  margin: 0px;
  float: left;
  width: 33%;
  border-left: 1px solid #1e1e1e;
  border-bottom: 1px solid #1e1e1e;
  border-right: 1px solid #fff;
  box-sizing: border-box;
}
#relost {
  border-right: 1px solid #1e1e1e;
  padding: 0px;
  margin: 0px;
  float: left;
  box-sizing: border-box;
}
.release div {
  padding: 0.4vw 0.8vw;
  padding-top: 0.1vw;
  border-top: 1px dashed #1e1e1e;
  height: 5.2vw;
  overflow: hidden;
}
.release img {
  padding: 0.9vw 0.9vw;
  object-fit: cover;
  box-sizing: border-box;
}

#columnr,
#innerContentRight {
  -ms-overflow-style: none; /* Internet Explorer 10+ */
  scrollbar-width: none; /* Firefox */
}
#columnr::-webkit-scrollbar,
#innerContentRight::-webkit-scrollbar {
  display: none; /* Safari and Chrome */
}

.column {
  position: absolute;
}
#column2 {
  left: 14.4vw;
  z-index: 5;
  pointer-events: none;
}
#column2 button,
#column1 button,
#c1bsd,
#column1 a {
  pointer-events: visibleStroke;
}
#column1 {
  z-index: 5;
  pointer-events: none;
}
#rightColumn {
  width: 100%;
}
#rightColumn .content {
  float: right;
}

.sl-wrapper {
  position: absolute;
  top: 50%;
  width: 100%;
}
.sl-navigation button,
.sl-close {
  background-color: #1e1e1e !important;
  width: 2.8vw !important;
  height: 2.8vw !important;
  border-radius: 1.5vw !important;
  color: #fff !important;
  text-align: center !important;
  font-size: 0.9vw !important;
  line-height: 1.4vw !important;
  font-family: 'firstFont', sans-serif !important;
  right: 10px !important;
  position: absolute !important;
  margin: 0 !important;
}
.sl-navigation button:hover,
.sl-close:hover {
  opacity: 1 !important;
}
.sl-prev {
  left: auto !important;
  top: -1.9vw !important;
}
.sl-next {
  left: auto !important;
  top: -4.8vw !important;
}
.sl-close {
  left: auto !important;
  top: 1vw !important;
  right: 31px !important;
}
.sl-overlay {
  opacity: 0.9 !important;
}

@media (max-width: 600px) {
}

.mobile-intro {
  cursor: default !important;
  font-size: 5vw;
}
.mobile-intro > button {
  cursor: default;
}

.mobile-subtitle {
  width: 97vw;
}