h1,h2,h3,h4,h5,h6,a {
  color: #900000;
}
h1,p,ul {
  margin-top: 8px;
  margin-bottom: 8px;
}
body {
  font-family: Arial,Helvetica,sans-serif;
}
.renderer-switcher-wrapper {
  display: flex;
}
#renderer-switcher ul {
  display: flex;
  padding-left: 0;
}
#renderer-switcher li {
  list-style: none;
}
#basic pre {
  border: 1px solid #900000;
  font-family: 'Courier New', Courier, monospace;
  line-height: 16px;
}
#basic-infos {
  list-style: none;
  padding-left: 0;
}
#inspect-infos {
  list-style: none;
  padding-left: 0;
}
.layout-qrcode {
  max-width: 160px;
  font-size: 14px;
}
@media (min-width: 1025px) {
  .layout-qrcode {
    position: absolute;
    top: 0;
    right: 0;
    margin: 8px;
  }
  .layout-top {
    margin-right: 180px;
  }
}
@media (max-width: 1024px) {
  .layout-qrcode {
    display: block;
    margin: 20px auto;
  }
}
/** style for basic renderer */
#basic {
  display: flex;
  flex-direction: column;
  align-items: center;
}
#basic #basic-infos {
  text-align: center;
}
#basic #basic-game {
  font-size: var(--basic-zoom-font-size);
  line-height: var(--basic-zoom-font-size);
}
#basic #zoom-slider-wrapper {
  -webkit-user-select: none; /* Safari */
  user-select: none; /* Standard syntax */
}
#basic #zoom-slider {
  margin-top: 20px;
  margin-bottom: 20px;
  touch-action: manipulation;
  user-select: none;
}
#basic [name=increment], #basic [name=decrement] {
  width: 48px;
  height: 48px;
  touch-action: manipulation; /** prevent double-tap from zooming on mobiles */
}
@media (min-width: 1024px) {
  #basic [name=increment], #basic [name=decrement] {
    width: 32px;
    height: 32px;
  }
}