* {
    touch-action: none;
}

.disable-select {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.translationText{
  width: 100%;
  height: auto;
  padding: 0px;
  margin: 0px;
  top: 0px;
  left: 0px;
}

.text_DE{
}

.text_EN{
}

.textScrollAreaMask{
  width: var(--introTextWidth);
  height: calc(var(--singleUserWindowHeight) - var(--spacerUnit) * 3.5);
  position: absolute;
  padding: 0px;
  margin: 0px;
  top: var(--spacerUnit);
  left: var(--introTextX);
  -webkit-mask-image: linear-gradient(to bottom, black 90%, transparent 100%);
  mask-image: linear-gradient(to bottom, black 90%, transparent 100%);
  overflow: hidden;
}

.scrollAreaMask {
  overflow-y: scroll;
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
  overflow-x: hidden;
}

.scrollAreaMaskBottomFade {
    -webkit-mask-image: linear-gradient(to bottom, transparent 0%, black var(--scrollMaskBlurSize), black calc(100% - var(--scrollMaskBottomFadeout)), transparent 100%);
    mask-image: linear-gradient(to bottom, transparent 0%, black var(--scrollMaskBlurSize), black calc(100% - var(--scrollMaskBottomFadeout)), transparent 100%);
}

.scrollAreaMaskRightFade {
  -webkit-mask-image: linear-gradient(to right, transparent 0%, black var(--scrollMaskBlurSize), black calc(100% - var(--scrollMaskRightFadeout)), transparent 100%);
  mask-image: linear-gradient(to right, transparent 0%, black var(--scrollMaskBlurSize), black calc(100% - var(--scrollMaskRightFadeout)), transparent 100%);
}

.scrollAreaMaskX::-webkit-scrollbar,
.scrollAreaMask::-webkit-scrollbar{
  display: none;
}

.scrollAreaMaskX{
  overflow-x: scroll;
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}

.fullDivSVG{
  display: block;
  position: absolute;
  top: 0px;
  left: 0px;
  padding: 0px;
  margin: 0px;
}

.fullBox{
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0px;
  left: 0px;
  padding: 0px;
  margin: 0px;
}

.senseField{
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0px;
  left: 0px;
  padding: 0px;
  margin: 0px;
}

.senseField:hover{
  cursor: pointer;
}

.bgGreenPink{
  background-image: linear-gradient(to bottom, green , pink);
}

.bgBlueOrange{
  background-image: linear-gradient(to bottom, skyblue , orange);
}

.bold {
    font-weight: bold;
}

sub, sup {
    font-size: 65%;
    vertical-align: baseline;
    position: relative;
    top: -0.4em;
    line-height: 0;
}

sub {
  top: 0.4em;
}

.invisibleItem{
  visibility: hidden;
}

.scrollDownIcon{
  width: calc(var(--spacerUnit) * 2.75);
  height: calc(var(--spacerUnit) * 1.75);
  position: absolute;
  bottom: calc((var(--spacerUnit) * 0.5) - var(--singleUserWindowBorderSize));
  left: calc(var(--scrollDownIconLeft) - var(--spacerUnit));
  padding-left: var(--spacerUnit);
  padding-right: var(--spacerUnit);
  padding-top: var(--spacerUnit);
  box-sizing: border-box;
  margin: 0px;
  /* z-index: 80; */
  cursor: pointer;
}

p{
  margin: 0;
  padding: 0;
}