Retrospring/app/javascript/styles/components/_jumbotron.scss

.jumbotron {
  $this: &;
  display: flex;
  background-color: var(--primary);
  color: RGB(var(--primary-text));
  text-align: center;
  border-radius: 0;

  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    color: RGB(var(--primary-text));
  }

  a:not(.btn) {
    color: RGB(var(--primary-text));
    opacity: 0.6;

    &:hover {
      opacity: 1;
    }

    .btn {
      opacity: 1;
    }
  }

  &__scroller {
    display: block;
    position: absolute;
    bottom: 0;
    margin: 0 auto;
    padding: 20px;
    text-align: center;
    z-index: 1000;
    font-size: 32px;
    width: 100%;
  }

  &__content {
    width: 100%;
    align-self: center;
  }

  &--frontpage {
    margin-top: -50px;
    height: 100vh;
  }

  &--particles {
    padding: 0px;
    overflow: hidden;
    position: relative;
    width: 100%;

    #{$this}__particles {
      position: absolute;
      width: 100%;
      height: 100%;
    }

    #{$this}__content {
      position: relative;
      top: 0;
      padding-top: 48px;
      padding-bottom: 48px;
      padding-left: 30px;
      padding-right: 30px;
    }
  }
}