html, body {
    background-color:var(--current-canvas-background);
    background-image: var(--current-background-image);
    color: var(--current-text);
    margin: 0px;
    min-height: 100%;
    width:100%;
    background-image: radial-gradient(at 35% 56%, hsla(178,0%,100%,0.6) 0px, transparent 60%),
                            radial-gradient(at 74% 38%, hsla(73,0%,100%,0.6) 0px, transparent 60%),
                            
                            radial-gradient(at 1% 0%, #FFCC4D 0px, transparent 70%),
                            radial-gradient(at 100% 0%, #AA8DD8 0px, transparent 80%),
                            radial-gradient(at 50% 0%, #ff91a6 0px, transparent 80%);
  }

  div.help-panel-container{
    display:flex;
    flex-direction: column;
    width:100%;
    height:100%;
    justify-content: center;
    align-items: center;
    padding-top:50px;
  }

  div.help-panel{
    background-color: hsl(180, 3%, 99%);
    width: 50%;
    height:auto;
    padding:30px;
    border: var(--current-panel-border) solid 1px;
    border-radius: 5px;
    box-shadow: 0 3px 7px 0 rgba(0, 0, 0, .13), 0 1px 2px 0 rgba(0, 0, 0, .11);
    margin-bottom:50px;
}

  h1,h2,p,ul,li{
    font-family: 'verdana';
  }

  ul.carousel {
    width: calc(100% - 40px);
    padding: 20px;
    display: flex;
    gap: 4vw;
  }
  li.carousel-page {
    list-style-type: none;
    padding: 10px;

    flex: 0 0 100%;
  }

  ul.carousel {
    overflow-x: scroll;
    scroll-snap-type: x mandatory;
  }
  li.carousel-page {
    scroll-snap-align: center;
  }