/*
@mixin r1 {
    grid-row-start: 1;
    grid-row-end: 1;
}

@mixin r2 {
    grid-row-start: 2;
    grid-row-end: 2;
}

@mixin r3 {
    grid-row-start: 3;
    grid-row-end: 3;
}

@mixin c1 {
    grid-column-start: 1;
    grid-column-end: 1;
}

@mixin c2 {
    grid-column-start: 2;
    grid-column-end: 2;
}

@mixin c3 {
    grid-column-start: 3;
    grid-column-end: 3;
}

@mixin c-span3 {
    grid-column-end: span 3;
}
*/
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

img {
  display: block;
}

/* override browser default */
html {
  /* scroll-behavior: smooth; */
  color: #FFFF;
  border-width: 0px;
  --scrollbar-width: 20px;
}

#full-content {
  margin: auto;
  min-width: 540px;
  max-width: calc(100vw - var(--scrollbar-width));
}

#bg-canvas {
  position: fixed;
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
  height: 100%;
  width: 100%;
  z-index: -1;
}

#side-index {
  position: absolute;
  margin: 10% auto auto 10%;
  border: 1px solid #FFF;
  list-style: decimal inside;
}

#side-index > ol {
  margin: 5%;
  white-space: nowrap;
}

[data-link] {
  cursor: pointer;
}

.screen-section {
  position: relative;
  z-index: 100;
}

.banner-style {
  width: 100%;
}