@charset "UTF-8";
#cookie-box {
  position: fixed;
  display: none;
  justify-content: center;
  bottom: 0px;
  z-index: 1000;
  background: rgba(253, 207, 11, 0.85);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  padding: 0.125em 0;
  width: 100vw;
  -webkit-transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
}
#cookie-box #cookie-box-content {
  display: flex;
  justify-content: space-between;
  gap: 1em;
  align-items: center;
  width: 100%;
  max-width: 80rem;
  margin: 0 2em;
}
#cookie-box p {
  display: flex;
  align-items: center;
  font-family: "Avenir LT W01_65 Medium1475532", "Avenir Medium", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif;
  color: #201B23;
  font-size: 1rem;
  margin: 0.65em 0;
}
#cookie-box p .text {
  margin: 0.25em 0;
}
#cookie-box a {
  color: #201B23;
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
  text-decoration-color: rgba(32, 27, 35, 0.25);
}
#cookie-box a:hover {
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
  text-decoration-color: rgba(32, 27, 35, 0.75);
}
#cookie-box .cookie-notice-accept {
  display: block;
  width: fit-content;
  height: fit-content;
  font-weight: 500;
  cursor: pointer;
  background-color: rgba(253, 207, 11, 0.85);
  color: #201B23;
  border: 1.5px solid rgba(20, 19, 21, 0.5);
  border-radius: 1.5rem;
  padding: 0.4rem 1rem;
  text-decoration: none;
  -webkit-transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
}
#cookie-box .cookie-notice-accept:hover {
  text-decoration: none;
  background-color: white;
  border-color: rgba(20, 19, 21, 0.75);
  -webkit-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
}
#cookie-box .cookie-box-close {
  cursor: pointer;
  display: inline-flex;
  width: 1.5rem;
  height: 1.5rem;
}
#cookie-box .cookie-box-close svg > path {
  fill: #201B23;
  stroke: #201B23;
}
#cookie-box.hidden {
  bottom: -4rem;
  opacity: 0;
  pointer-events: none;
  -webkit-transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
}

#cookie-modal {
  position: fixed;
  pointer-events: none;
  opacity: 0;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: rgba(253, 207, 11, 0.9);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  z-index: 1001;
  -webkit-transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
}
#cookie-modal:target {
  opacity: 1;
  pointer-events: auto;
  -webkit-transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
}
#cookie-modal p {
  font-size: 1rem;
  color: #201B23;
}
#cookie-modal p a {
  color: #201B23;
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
  text-decoration-color: rgba(32, 27, 35, 0.25);
}
#cookie-modal p a:hover {
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
  text-decoration-color: rgba(32, 27, 35, 0.75);
}
#cookie-modal .actions {
  display: flex;
  gap: 0.5em;
  margin-left: -0.25em;
}
#cookie-modal .button {
  display: inline-block;
  width: fit-content;
  height: fit-content;
  font-weight: 500;
  cursor: pointer;
  background-color: rgba(255, 255, 255, 0.85);
  color: #201B23;
  border: 1.5px solid rgba(20, 19, 21, 0.5);
  border-radius: 1.5rem;
  padding: 0.4rem 1rem;
  text-decoration: none;
  -webkit-transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
}
#cookie-modal .button.cookie-box-close {
  font-weight: normal;
  color: rgba(32, 27, 35, 0.8);
  background-color: transparent;
  border: 1.5px solid rgba(20, 19, 21, 0.25);
}
#cookie-modal .button:hover {
  text-decoration: none;
  background-color: white;
  border-color: #141315;
  -webkit-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
}
#cookie-modal .button:hover.cookie-box-close {
  color: #201b23;
  background-color: transparent;
  border-color: rgba(20, 19, 21, 0.5);
}
#cookie-modal .content {
  position: relative;
  padding: 30px;
  max-width: 50em;
  overflow: auto;
  max-height: 100vh;
  margin: 0 auto;
  top: 45%;
  -ms-transform: translate(0, -50%);
  transform: translate(0, -50%);
}
#cookie-modal.hidden {
  display: none;
}

:root {
  --colorpicker: transparent;
}

* {
  box-sizing: border-box;
}

.cursor-none * {
  cursor: none !important;
}

body {
  background: #363B49;
  color: white;
  font-family: "Avenir LT W01_65 Medium1475532", "Avenir Medium", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif;
  font-weight: normal;
  padding: 0;
  margin: 0;
  overflow: hidden;
  -webkit-transition: opacity 0.5s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: opacity 0.5s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: opacity 0.5s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: opacity 0.5s cubic-bezier(0.25, 1, 0.5, 1);
  transition: opacity 0.5s cubic-bezier(0.25, 1, 0.5, 1);
}
body.staticrypt-body {
  color: black;
}
body.staticrypt-body label {
  color: black;
}
body a {
  color: rgba(255, 255, 255, 0.75);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
}
body a:hover {
  color: white;
}
body a:visited {
  color: rgba(255, 255, 255, 0.5);
}

strong {
  font-weight: 600;
}

.ghost {
  visibility: hidden;
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}

.scroll-container {
  position: absolute;
  top: 0;
  right: 0;
  width: 26em;
  height: auto;
  max-height: calc(100% - 0em);
  padding-bottom: 5em;
  margin: 0 0 0 1em;
  overflow: hidden;
}

#scrollbox {
  height: auto;
  max-height: calc(100vh - 7em);
  position: relative;
  padding: 4em 0.5em 0.7em 0;
  overflow-y: scroll;
  scrollbar-width: 1em;
  scrollbar-gutter: stable;
  z-index: 100;
}
#scrollbox::-webkit-scrollbar {
  width: 1em;
  height: 1em;
}
#scrollbox::-webkit-scrollbar-track {
  border-radius: 0.25em;
  background-color: transparent;
}
#scrollbox:hover::-webkit-scrollbar-thumb {
  box-shadow: inset 0 0 0 4em rgba(255, 255, 255, 0.5);
  -webkit-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
#scrollbox::-webkit-scrollbar-thumb {
  border-radius: 25em;
  -webkit-border-radius: 25em;
  border-top: 4em solid transparent;
  border-bottom: 0.7em solid transparent;
  border-left: 0.1em solid transparent;
  border-right: 0.6em solid transparent;
  box-shadow: inset 0 0 0 4em rgba(20, 19, 21, 0.25);
  -webkit-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
#scrollbox::-webkit-scrollbar-thumb:hover {
  box-shadow: inset 0 0 0 4em rgba(255, 255, 255, 0.75);
  border-left: 0em solid transparent;
  border-right: 0.5em solid transparent;
  -webkit-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
#scrollbox::-webkit-scrollbar-thumb:active {
  box-shadow: inset 0 0 0 4em white;
  -webkit-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
#scrollbox.invert:hover::-webkit-scrollbar-thumb {
  box-shadow: inset 0 0 0 4em rgba(20, 19, 21, 0.5);
}
#scrollbox.invert::-webkit-scrollbar-thumb:hover {
  box-shadow: inset 0 0 0 4em rgba(20, 19, 21, 0.75);
}
#scrollbox.invert::-webkit-scrollbar-thumb:active {
  box-shadow: inset 0 0 0 4em #141315;
}
#scrollbox h2 {
  font-size: 1.25em;
  font-family: "Avenir LT W01_85 Heavy1475544", "Avenir Heavy", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif;
  font-weight: 600;
  margin: 0;
  padding: 1em 1.25em 0.75em;
  border-radius: 4px 4px 0 0;
  background: rgba(32, 27, 35, 0.85);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
#scrollbox #ft-toggle {
  display: inline-grid;
  justify-items: center;
  align-items: center;
  position: relative;
  float: right;
  right: -8px;
  font-size: 0.75em;
  font-weight: 500;
  text-decoration: none;
  cursor: pointer;
  color: rgba(255, 255, 255, 0.8);
  background: rgba(20, 19, 21, 0.9);
  width: 2em;
  height: 2em;
  border-radius: 1em;
  user-select: none;
  -webkit-user-select: none; /* Safari fallback only */
  -webkit-user-select: none; /* Chrome/Safari */
  -moz-user-select: none; /* Firefox */
  -ms-user-select: none; /* IE10+ */
  -webkit-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
#scrollbox #ft-toggle.active {
  visibility: hidden;
}
#scrollbox #ft-toggle.active:after {
  display: inline-grid;
  justify-items: center;
  align-items: center;
  content: "in";
  visibility: visible;
  position: absolute;
  background: rgba(20, 19, 21, 0.9);
  width: 2em;
  height: 2em;
  border-radius: 1em;
  user-select: none;
  -webkit-user-select: none; /* Safari fallback only */
  -webkit-user-select: none; /* Chrome/Safari */
  -moz-user-select: none; /* Firefox */
  -ms-user-select: none; /* IE10+ */
  -webkit-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
#scrollbox #ft-toggle.active:hover:after {
  color: black;
  background: rgba(255, 255, 255, 0.8);
  -webkit-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
}
#scrollbox #ft-toggle:hover {
  color: black;
  background: rgba(255, 255, 255, 0.8);
  -webkit-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
}
#scrollbox .accordion {
  cursor: pointer;
  position: relative;
  text-decoration: none;
  color: white;
}
#scrollbox .accordion:after {
  content: "+";
  display: inline-block;
  position: absolute;
  text-align: center;
  vertical-align: middle;
  right: 0.9em;
  top: 0.5em;
  z-index: 1;
  font-size: 1.75em;
  opacity: 0.5;
}
#scrollbox .accordion.active:after {
  content: "–";
}

.uipanel {
  position: relative;
  background: rgba(32, 27, 35, 0.85);
  display: block;
  padding: 0.25em 1em 0.5em 1em;
  margin-bottom: 0.5em;
  border-radius: 0 0 4px 4px;
  overflow: hidden;
  -webkit-transition: all 0.5s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.5s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.5s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.5s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.5s cubic-bezier(0.25, 1, 0.5, 1);
}
.uipanel:before {
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-radius: 0 0 4px 4px;
  content: "";
  display: block;
  height: 100%;
  width: 100%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
}
.uipanel.collapsed {
  max-height: 0;
}
.uipanel.collapsed:not(.active) {
  padding: 0.5em 1em 0em 1em;
}
.uipanel > h1 {
  font-size: 1.2em;
  margin: 0 0 1em;
}
.uipanel > h3 {
  font-weight: 500;
  margin: 2em 0.75em 0.75em;
}
.uipanel .ui-tag {
  background: #141315;
  color: rgba(253, 207, 11, 0.85);
}
.uipanel p {
  font-size: 15px;
  color: rgba(255, 255, 255, 0.75);
  margin: 0;
}
.uipanel p a {
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
}
.uipanel p a:hover {
  color: white;
}
.uipanel .price-info {
  display: inline-block;
  padding: 0.5em 0;
  font-size: 1em;
  font-weight: 500;
  color: white;
}
.uipanel .price-info small {
  color: rgba(255, 255, 255, 0.75);
}
.uipanel.float {
  position: absolute;
  height: 83px;
  display: grid;
  align-content: center;
  grid-template-columns: auto auto;
  background: rgba(32, 27, 35, 0.85);
  bottom: 0;
  z-index: 100;
  width: calc(26em - 1.5em);
  padding: 1em 1.6em;
  margin: 0;
  border-radius: 4px;
}
.uipanel.float:before {
  border-radius: 4px;
}
.uipanel.float p {
  padding-right: 0.5em;
}
.uipanel.float p small {
  font-size: 100%;
}
.uipanel:last-of-type {
  margin-bottom: 0;
}

.inputbox {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  position: relative;
  background: rgba(20, 19, 21, 0.7);
  padding: 0.75em 0.5em 0.75em 1em;
  margin: 0 0 0.75em;
  border-radius: 8px;
}
.inputbox.disabled {
  pointer-events: none;
  user-select: none;
  -webkit-user-select: none; /* Safari fallback only */
  -webkit-user-select: none; /* Chrome/Safari */
  -moz-user-select: none; /* Firefox */
  -ms-user-select: none; /* IE10+ */
}
.inputbox.disabled > * {
  opacity: 0.4;
}
.inputbox.half {
  width: calc(50% - 0em);
}
.inputbox.no-border {
  border-bottom: none;
}
.inputbox.nomargin[style*=hidden] + .inputbox:not([style*=hidden]) {
  margin-bottom: 0.75em;
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
}
.inputbox.nomargin:not([style*=hidden]) {
  margin: 0;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}
.inputbox.nomargin:not([style*=hidden]) + .nomargin:not([style*=hidden]), .inputbox.nomargin:not([style*=hidden]) + .inputbox:not([style*=hidden]) {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
.inputbox.center-align {
  align-items: center;
}
.inputbox sub {
  line-height: 0;
}
.inputbox .break {
  flex-basis: 100%;
  height: 0;
}
.inputbox .right {
  text-align: right;
  margin-left: auto;
}
.inputbox .info {
  color: rgba(255, 255, 255, 0.65);
  font-size: 13px;
}
.inputbox .info strong {
  font-weight: normal;
  color: white;
}
.inputbox .info .name strong {
  font-weight: bold;
  color: black;
}
.inputbox .info.full {
  text-align: right;
  padding-right: 0.5em;
  width: 100%;
}
.inputbox.content {
  justify-content: flex-start;
  padding: 0.75em 1em 1em;
}
.inputbox.content p {
  margin: 0.25em 0 0.75em;
}
.inputbox svg > text {
  font-size: 12px;
  text-align: center;
  fill: white;
}
.inputbox input[type=text] {
  flex: 1;
  text-align: left;
  vertical-align: middle;
  margin: 0 0.5em 0 0;
  -webkit-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
}
.inputbox input[type=text]:focus {
  padding-left: 0.5em;
  -webkit-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
}
.inputbox:not(.content):hover {
  background: #141315;
  -webkit-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
.inputbox:not(.content):hover label h3 {
  color: #fdcf0b;
}
.inputbox:not(.content):hover:not(.disabled) input[type=text]:not(:focus) {
  color: white;
  background-color: rgba(255, 255, 255, 0.125);
  padding-left: 0.5em;
  -webkit-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
}
.inputbox:not(.content):hover:not(.disabled) input[type=text]:not(:focus)::placeholder {
  color: rgba(255, 255, 255, 0.5);
}
.inputbox:not(.content):hover:not(.disabled) input[type=number]:not(:focus), .inputbox:not(.content):hover:not(.disabled) input[inputmode=numeric]:not(:focus), .inputbox:not(.content):hover:not(.disabled) .numberText:not(:focus) {
  color: black;
  background-color: rgba(255, 255, 255, 0.7);
  padding-left: 0.5em;
}
.inputbox:not(.content):hover:not(.disabled) input[type=number]:not(:focus) + .unit, .inputbox:not(.content):hover:not(.disabled) input[inputmode=numeric]:not(:focus) + .unit, .inputbox:not(.content):hover:not(.disabled) .numberText:not(:focus) + .unit {
  color: black;
  mix-blend-mode: multiply;
}
.inputbox:not(.content):hover .stepper input[type=number] {
  color: black;
  background-color: rgba(255, 255, 255, 0.7);
}
.inputbox:not(.content):hover .plus, .inputbox:not(.content):hover .minus {
  background: rgba(0, 0, 0, 0.75);
}

#customShelvesNote {
  margin-top: 1em;
}

input[type=text], input[type=number], input[inputmode=numeric], .numberText {
  -moz-appearance: textfield;
  outline: none;
  display: inline-block;
  position: relative;
  font-family: "Avenir LT W01_65 Medium1475532", "Avenir Medium", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif;
  font-weight: normal;
  font-size: 1em;
  height: 28px;
  text-align: right;
  color: white;
  width: 6em;
  min-width: 3em;
  background: transparent;
  border-radius: 0.15em;
  border: none;
  padding: 0 0.5em 0 0;
  margin: -3px 0;
}
input[type=text] + .unit, input[type=number] + .unit, input[inputmode=numeric] + .unit, .numberText + .unit {
  display: inline-block;
  text-align: left;
  width: 1.25em;
  margin-left: -1.25em;
  pointer-events: none;
}
input[type=text] + input[type=number], input[type=text] + input[inputmode=numeric], input[type=text] + .numberText, input[type=number] + input[type=number], input[type=number] + input[inputmode=numeric], input[type=number] + .numberText, input[inputmode=numeric] + input[type=number], input[inputmode=numeric] + input[inputmode=numeric], input[inputmode=numeric] + .numberText, .numberText + input[type=number], .numberText + input[inputmode=numeric], .numberText + .numberText {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
input[type=text][disabled], input[type=number][disabled], input[inputmode=numeric][disabled], .numberText[disabled] {
  opacity: 0.4;
}
input[type=text][disabled] + .unit, input[type=number][disabled] + .unit, input[inputmode=numeric][disabled] + .unit, .numberText[disabled] + .unit {
  opacity: 0.4;
}
input[type=text]:has(+ .unit), input[type=number]:has(+ .unit), input[inputmode=numeric]:has(+ .unit), .numberText:has(+ .unit) {
  padding-right: 1.5em;
}
input[type=text]:not([disabled]):hover, input[type=number]:not([disabled]):hover, input[inputmode=numeric]:not([disabled]):hover, .numberText:not([disabled]):hover {
  background: rgba(255, 255, 255, 0.75);
}
input[type=text]:focus, input[type=text]:hover:focus, input[type=number]:focus, input[type=number]:hover:focus, input[inputmode=numeric]:focus, input[inputmode=numeric]:hover:focus, .numberText:focus, .numberText:hover:focus {
  color: #201B23;
  background: rgba(255, 255, 255, 0.8);
}
input[type=text]:focus + .unit, input[type=text]:hover:focus + .unit, input[type=number]:focus + .unit, input[type=number]:hover:focus + .unit, input[inputmode=numeric]:focus + .unit, input[inputmode=numeric]:hover:focus + .unit, .numberText:focus + .unit, .numberText:hover:focus + .unit {
  color: black;
  mix-blend-mode: multiply;
  opacity: 1;
}
input[type=text].smaller, input[type=number].smaller, input[inputmode=numeric].smaller, .numberText.smaller {
  width: 4em;
}
input[type=text].sup, input[type=number].sup, input[inputmode=numeric].sup, .numberText.sup {
  vertical-align: 3px;
  padding-right: 0.15em;
  font-size: 0.9em;
}

.numberText.smaller {
  display: inline-grid;
  align-items: center;
  min-width: 4em;
  width: auto;
  padding-left: 0.5em;
}

.stepper {
  position: relative;
  margin-bottom: 0.25em;
}
.stepper input[type=number],
.stepper input[inputmode=numeric] {
  text-align: center;
  padding: 0;
  z-index: 1;
  border-radius: 20px;
  background: rgba(0, 0, 0, 0.1);
  user-select: none;
  -webkit-user-select: none; /* Safari fallback only */
  -webkit-user-select: none; /* Chrome/Safari */
  -moz-user-select: none; /* Firefox */
  -ms-user-select: none; /* IE10+ */
  cursor: default;
  pointer-events: none;
}
.stepper:hover input[type=number],
.stepper:hover input[inputmode=numeric] {
  background: rgba(255, 255, 255, 0.1);
}
.stepper .plus {
  display: inline-block;
  text-decoration: none;
  content: "+";
  color: white;
  z-index: 10;
  cursor: pointer;
  background: rgba(0, 0, 0, 0.2);
  width: 24px;
  height: 24px;
  top: -1px;
  right: 2px;
  border-radius: 12px;
  position: absolute;
  font-size: 1.25em;
  line-height: 24px;
  font-weight: 400;
  text-align: center;
  user-select: none;
  -webkit-user-select: none; /* Safari fallback only */
  -webkit-user-select: none; /* Chrome/Safari */
  -moz-user-select: none; /* Firefox */
  -ms-user-select: none; /* IE10+ */
}
.stepper .plus:hover {
  color: white;
  background: black;
  -webkit-transition: background-color 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: background-color 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: background-color 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: background-color 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  transition: background-color 0.2s cubic-bezier(0.25, 1, 0.5, 1);
}
.stepper .plus:active {
  color: black;
  background: white;
}
.stepper .minus {
  display: inline-block;
  text-decoration: none;
  content: "–";
  color: white;
  z-index: 10;
  cursor: pointer;
  background: rgba(0, 0, 0, 0.2);
  width: 24px;
  height: 24px;
  top: -1px;
  left: 2px;
  border-radius: 12px;
  position: absolute;
  font-size: 1.25em;
  line-height: 22px;
  font-weight: 400;
  text-align: center;
  user-select: none;
  -webkit-user-select: none; /* Safari fallback only */
  -webkit-user-select: none; /* Chrome/Safari */
  -moz-user-select: none; /* Firefox */
  -ms-user-select: none; /* IE10+ */
}
.stepper .minus:hover {
  color: white;
  background: black;
  -webkit-transition: background-color 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: background-color 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: background-color 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: background-color 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  transition: background-color 0.2s cubic-bezier(0.25, 1, 0.5, 1);
}
.stepper .minus:active {
  color: black;
  background: white;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

label {
  font-weight: 500;
  color: rgba(255, 255, 255, 0.75);
  font-weight: 400;
  font-size: 0.9em;
}
label h3 {
  display: inline-block;
  color: white;
  font-size: 1em;
  font-weight: 500;
  margin: 0.1em 0 0 0;
}

.radiocontainer, .checkboxcontainer {
  display: block;
  position: relative;
  cursor: pointer;
  margin-right: 0.5em;
  margin-bottom: 0.4em;
}
.radiocontainer input, .checkboxcontainer input {
  cursor: pointer;
  position: absolute;
  opacity: 0;
}
.radiocontainer input:checked ~ .radio, .radiocontainer input:checked ~ .checkmark, .checkboxcontainer input:checked ~ .radio, .checkboxcontainer input:checked ~ .checkmark {
  background: white;
}
.radiocontainer input:checked ~ .radio:after, .radiocontainer input:checked ~ .checkmark:after, .checkboxcontainer input:checked ~ .radio:after, .checkboxcontainer input:checked ~ .checkmark:after {
  display: block;
}
.radiocontainer input:checked ~ svg, .checkboxcontainer input:checked ~ svg {
  opacity: 0.9;
}
.radiocontainer .checkmark, .checkboxcontainer .checkmark {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  right: -0.1em;
  width: 1.125em;
  height: 1.125em;
  margin-left: 0.7em;
  margin-top: -0.2em;
  border-radius: 0.2em;
  border: 1px solid rgba(255, 255, 255, 0.5);
}
.radiocontainer .checkmark:after, .checkboxcontainer .checkmark:after {
  content: "";
  position: absolute;
  display: none;
  left: 0.225em;
  top: 0.0275em;
  width: 0.3em;
  height: 0.6em;
  border: solid black;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}
.radiocontainer .radio, .checkboxcontainer .radio {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  right: 0;
  width: 1em;
  height: 1em;
  margin-left: 0.75em;
  margin-bottom: 0.1em;
  border-radius: 0.5em;
  border: 1px solid rgba(255, 255, 255, 0.5);
}
.radiocontainer .std, .checkboxcontainer .std {
  display: inline-block;
  vertical-align: middle;
  white-space: nowrap;
  overflow: visible;
}
.radiocontainer .pole, .checkboxcontainer .pole {
  display: inline-block;
  vertical-align: middle;
  white-space: nowrap;
  overflow: visible;
}
.radiocontainer svg, .checkboxcontainer svg {
  vertical-align: middle;
  margin-right: 0.5em;
  margin-left: 0.5em;
  opacity: 0.25;
}
.radiocontainer:hover, .checkboxcontainer:hover {
  color: white;
}
.radiocontainer:hover input ~ .radio, .radiocontainer:hover input ~ .checkmark, .checkboxcontainer:hover input ~ .radio, .checkboxcontainer:hover input ~ .checkmark {
  border: 2px solid rgba(255, 255, 255, 0.75);
}
.radiocontainer:hover input ~ svg, .checkboxcontainer:hover input ~ svg {
  opacity: 0.9;
}
.radiocontainer:hover input:checked ~ .checkmark, .checkboxcontainer:hover input:checked ~ .checkmark {
  border: 1px solid rgba(255, 255, 255, 0.5);
}
.radiocontainer:hover input:checked ~ .checkmark:after, .checkboxcontainer:hover input:checked ~ .checkmark:after {
  opacity: 0.5;
}

.profile-content {
  display: flex;
  background: white;
  border-radius: 0.5em;
  margin-bottom: 0.2em;
  padding: 1em 1em 1em 0;
}
.profile-content .main-image {
  width: 150px;
  height: auto;
  margin: 0 0.5em 0 0;
  align-self: center;
}
.profile-content ul {
  display: block;
  list-style-type: none;
  margin: 0 !important;
  padding: 0 !important;
}
.profile-content ul li {
  display: flex;
  margin: 0 !important;
  padding: 0 !important;
  clear: left;
  font-size: 1em;
  padding-bottom: 1em;
  width: 100%;
}
.profile-content ul li img {
  display: inline;
  float: left;
  margin-right: 1em;
  margin-bottom: 1em;
}
.profile-content ul li .label {
  display: inline-block;
  font-weight: bold;
}
.profile-content ul li .label h4 {
  color: #737373;
  font-weight: normal;
  font-size: 0.8em;
  margin: 0;
}

.icon-info {
  width: 14px;
  height: 14px;
  display: inline-block;
  vertical-align: -2.5px;
  background-image: url("../assets/icon-info-w.svg");
  opacity: 0.66;
}
.icon-info:hover {
  opacity: 1;
}

.radiocontainer .icon-info {
  margin-right: -2px;
}

.scroll-container.light #scrollbox h2 {
  color: #141315;
  background: rgba(255, 255, 255, 0.85);
}
.scroll-container.light #scrollbox #ft-toggle {
  color: rgba(20, 19, 21, 0.8);
  background: rgba(0, 0, 0, 0.075);
}
.scroll-container.light #scrollbox #ft-toggle:hover {
  color: white;
  background: rgba(0, 0, 0, 0.8);
}
.scroll-container.light .uipanel {
  background: rgba(255, 255, 255, 0.85);
}
.scroll-container.light .uipanel p {
  color: rgba(0, 0, 0, 0.75);
}
.scroll-container.light .uipanel p a:hover {
  color: black;
}
.scroll-container.light .uipanel .price-info, .scroll-container.light .uipanel .price-info small {
  color: rgba(0, 0, 0, 0.75);
}
.scroll-container.light .uipanel.float {
  background: rgba(255, 255, 255, 0.85);
}
.scroll-container.light .inputbox {
  background: rgba(0, 0, 0, 0.075);
}
.scroll-container.light .inputbox .info {
  color: rgba(0, 0, 0, 0.65);
}
.scroll-container.light .inputbox:hover {
  background: rgba(0, 0, 0, 0.15);
}
.scroll-container.light .inputbox:hover:not(.disabled) input[type=number]:not(:focus), .scroll-container.light .inputbox:hover:not(.disabled) input[inputmode=numeric]:not(:focus), .scroll-container.light .inputbox:hover:not(.disabled) .numberText:not(:focus) {
  color: white;
  background-color: rgba(0, 0, 0, 0.7);
}
.scroll-container.light .inputbox:hover:not(.disabled) input[type=number]:not(:focus) + .unit, .scroll-container.light .inputbox:hover:not(.disabled) input[inputmode=numeric]:not(:focus) + .unit, .scroll-container.light .inputbox:hover:not(.disabled) .numberText:not(:focus) + .unit {
  color: white;
}
.scroll-container.light .inputbox:hover .stepper input[type=number] {
  color: white;
  background-color: rgba(0, 0, 0, 0.7);
}
.scroll-container.light .inputbox:hover .plus, .scroll-container.light .inputbox:hover .minus {
  background: rgba(255, 255, 255, 0.75);
}
.scroll-container.light input[type=number], .scroll-container.light input[inputmode=numeric], .scroll-container.light .numberText {
  color: black;
}
.scroll-container.light input[type=number]:not([disabled]):hover, .scroll-container.light input[inputmode=numeric]:not([disabled]):hover, .scroll-container.light .numberText:not([disabled]):hover {
  background: rgba(0, 0, 0, 0.75);
}
.scroll-container.light input[type=number]:focus, .scroll-container.light input[type=number]:hover:focus, .scroll-container.light input[inputmode=numeric]:focus, .scroll-container.light input[inputmode=numeric]:hover:focus, .scroll-container.light .numberText:focus, .scroll-container.light .numberText:hover:focus {
  color: white;
  background: rgba(0, 0, 0, 0.8);
}
.scroll-container.light input[type=number]:focus + .unit, .scroll-container.light input[type=number]:hover:focus + .unit, .scroll-container.light input[inputmode=numeric]:focus + .unit, .scroll-container.light input[inputmode=numeric]:hover:focus + .unit, .scroll-container.light .numberText:focus + .unit, .scroll-container.light .numberText:hover:focus + .unit {
  color: white;
}
.scroll-container.light .stepper input[type=number],
.scroll-container.light .stepper input[inputmode=numeric] {
  background: rgba(255, 255, 255, 0.1);
}
.scroll-container.light .stepper:hover input[type=number],
.scroll-container.light .stepper:hover input[inputmode=numeric] {
  background: rgba(0, 0, 0, 0.1);
}
.scroll-container.light .stepper .plus {
  color: black;
  background: rgba(255, 255, 255, 0.2);
}
.scroll-container.light .stepper .plus:hover {
  color: black;
  background: white;
}
.scroll-container.light .stepper .plus:active {
  color: white;
  background: black;
}
.scroll-container.light .stepper .minus {
  color: black;
  background: rgba(255, 255, 255, 0.2);
}
.scroll-container.light .stepper .minus:hover {
  color: black;
  background: white;
}
.scroll-container.light .stepper .minus:active {
  color: white;
  background: black;
}
.scroll-container.light label {
  color: rgba(0, 0, 0, 0.75);
}
.scroll-container.light label h3 {
  color: black;
}
.scroll-container.light .radiocontainer input:checked ~ .radio, .scroll-container.light .radiocontainer input:checked ~ .checkmark, .scroll-container.light .checkboxcontainer input:checked ~ .radio, .scroll-container.light .checkboxcontainer input:checked ~ .checkmark {
  background: black;
}
.scroll-container.light .radiocontainer .checkmark, .scroll-container.light .checkboxcontainer .checkmark {
  border-color: rgba(0, 0, 0, 0.5);
}
.scroll-container.light .radiocontainer .checkmark:after, .scroll-container.light .checkboxcontainer .checkmark:after {
  border-color: white;
}
.scroll-container.light .radiocontainer .radio, .scroll-container.light .checkboxcontainer .radio {
  border-color: rgba(0, 0, 0, 0.5);
}
.scroll-container.light .radiocontainer:hover, .scroll-container.light .checkboxcontainer:hover {
  color: black;
}
.scroll-container.light .radiocontainer:hover input ~ .radio, .scroll-container.light .radiocontainer:hover input ~ .checkmark, .scroll-container.light .checkboxcontainer:hover input ~ .radio, .scroll-container.light .checkboxcontainer:hover input ~ .checkmark {
  border-color: rgba(0, 0, 0, 0.75);
}
.scroll-container.light .radiocontainer:hover input:checked ~ .checkmark, .scroll-container.light .checkboxcontainer:hover input:checked ~ .checkmark {
  border-color: rgba(0, 0, 0, 0.5);
}

.cta, #configurator-inquiry .wFormContainer input[type=submit], #configurator-feedback .gform_wrapper .gform_button, .cta:visited {
  cursor: pointer;
  display: inline-block;
  font-family: "Avenir LT W01_65 Medium1475532", "Avenir Medium", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif;
  font-weight: normal;
  font-weight: 500;
  text-decoration: none;
  background: rgba(253, 207, 11, 0.8);
  border: none;
  font-size: 1.1em;
  color: black;
  padding: 0.35em 1em;
  border-radius: 1.125em;
  margin: 0;
}
.cta:hover, #configurator-inquiry .wFormContainer input[type=submit]:hover, #configurator-feedback .gform_wrapper .gform_button:hover, .cta:visited:hover {
  background: rgba(253, 207, 11, 0.9);
  color: black;
  -webkit-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
}

#final-panel {
  overflow: visible;
}
#final-panel .cta:last-of-type, #final-panel #configurator-inquiry .wFormContainer input[type=submit]:last-of-type, #configurator-inquiry .wFormContainer #final-panel input[type=submit]:last-of-type, #final-panel #configurator-feedback .gform_wrapper .gform_button:last-of-type, #configurator-feedback .gform_wrapper #final-panel .gform_button:last-of-type {
  margin-right: -0.5em;
}
#final-panel ul .cta:last-of-type, #final-panel ul #configurator-inquiry .wFormContainer input[type=submit]:last-of-type, #configurator-inquiry .wFormContainer #final-panel ul input[type=submit]:last-of-type, #final-panel ul #configurator-feedback .gform_wrapper .gform_button:last-of-type, #configurator-feedback .gform_wrapper #final-panel ul .gform_button:last-of-type {
  margin-right: 0em;
}

#logged-out-panel {
  display: block;
  height: auto;
  margin-top: 4em;
  padding: 1em 2em 2em;
  border-radius: 4px;
  visibility: hidden;
}
#logged-out-panel p {
  color: rgba(235, 236, 234, 0.85);
  font-size: 1em;
  line-height: 1.2;
  margin-bottom: 1em;
}
#logged-out-panel p a {
  color: rgba(235, 236, 234, 0.85);
}
#logged-out-panel p a:hover {
  color: white;
}
#logged-out-panel .cta:first-of-type, #logged-out-panel #configurator-inquiry .wFormContainer input[type=submit]:first-of-type, #configurator-inquiry .wFormContainer #logged-out-panel input[type=submit]:first-of-type, #logged-out-panel #configurator-feedback .gform_wrapper .gform_button:first-of-type, #configurator-feedback .gform_wrapper #logged-out-panel .gform_button:first-of-type {
  margin-left: -0.25em;
  margin-right: 0.5em;
}

.ui-segmented {
  font-family: "Avenir LT W01_65 Medium1475532", "Avenir Medium", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif;
  font-weight: normal;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 4px;
  font-size: 15px;
  height: 36px;
  padding: 0 3px;
  margin-right: 3px;
  border-radius: 21px;
  border: none;
  vertical-align: bottom;
  cursor: pointer;
  background: rgba(32, 27, 35, 0.1);
  -webkit-transition: background-color 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: background-color 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: background-color 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: background-color 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: background-color 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
.ui-segmented input[type=number], .ui-segmented input[inputmode=numeric], .ui-segmented .numberText {
  height: 24px;
  color: black;
}
.ui-segmented input[type=number]:hover, .ui-segmented input[type=number]:focus, .ui-segmented input[inputmode=numeric]:hover, .ui-segmented input[inputmode=numeric]:focus, .ui-segmented .numberText:hover, .ui-segmented .numberText:focus {
  background: transparent;
}
.ui-segmented .title {
  margin: 0 4px 0 14px;
  font-weight: 600;
  text-transform: uppercase;
  font-size: 11px;
  letter-spacing: 1px;
  margin-bottom: -3px;
}
.ui-segmented .tab {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  padding: 0 6px;
  margin: 0 4px;
  height: 26px;
  border-radius: 18px;
  -webkit-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
.ui-segmented .tab.active {
  background: white;
  padding: 0 10px;
  margin: 0 0;
  height: 30px;
  -webkit-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
}
.ui-segmented .tab.active input[type=number]:hover, .ui-segmented .tab.active input[inputmode=numeric]:hover, .ui-segmented .tab.active .numberText:hover {
  background: rgba(0, 0, 0, 0.1);
}
.ui-segmented .tab.active input[type=number]:focus, .ui-segmented .tab.active input[inputmode=numeric]:focus, .ui-segmented .tab.active .numberText:focus {
  background: rgba(0, 0, 0, 0.2);
}
.ui-segmented + p {
  margin: 0.5em 0.5em;
}
.ui-segmented:hover {
  background: rgba(32, 27, 35, 0.15);
  -webkit-transition: background-color 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: background-color 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: background-color 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: background-color 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  transition: background-color 0.2s cubic-bezier(0.25, 1, 0.5, 1);
}

.ui-button {
  font-family: "Avenir LT W01_65 Medium1475532", "Avenir Medium", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif;
  font-weight: normal;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  font-size: 15px;
  text-decoration: none;
  height: 42px;
  padding: 0 16px;
  margin-right: 6px;
  border-radius: 21px;
  border: none;
  vertical-align: bottom;
  cursor: pointer;
  background: rgba(235, 236, 234, 0.9);
  -webkit-transition: background-color 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: background-color 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: background-color 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: background-color 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: background-color 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
.ui-button.invert {
  filter: invert(1);
}
.ui-button.small {
  height: 34px;
}
.ui-button.chevron:before {
  border-style: solid;
  border-width: 2px 2px 0 0;
  content: "";
  display: inline-block;
  height: 5px;
  left: 1px;
  position: relative;
  top: 1px;
  margin-left: -2px;
  margin-right: 10px;
  transform: rotate(-45deg);
  vertical-align: top;
  width: 5px;
  -webkit-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
.ui-button.active {
  padding: 0 14px;
  border: 2px solid rgba(0, 0, 0, 0.9);
  /*
  &:before {
    content: '';
    width: 8px;
    height: 8px;
    margin-right: 7px;
    border-radius: 4px;
    background: black;
    margin-left: -6px;
  }*/
}
.ui-button.active:hover {
  background: white;
  color: black;
  padding: 0 15px;
  border: 1px solid #201b23;
}
.ui-button.left {
  border-bottom-right-radius: 0;
  border-top-right-radius: 0;
  margin-right: 0;
  padding-right: 12px;
  margin-right: 1px;
  box-shadow: 1px 0 0 0 rgba(235, 236, 234, 0.7);
}
.ui-button.right {
  border-bottom-left-radius: 0;
  border-top-left-radius: 0;
  margin-left: 0;
  padding-left: 12px;
}
.ui-button:hover:not(:disabled) {
  background: white;
  -webkit-transition: background-color 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: background-color 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: background-color 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: background-color 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  transition: background-color 0.2s cubic-bezier(0.25, 1, 0.5, 1);
}
.ui-button:hover:not(:disabled).chevron:before {
  top: -2px;
  -webkit-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
}
.ui-button:disabled {
  opacity: 0.6;
}
.ui-button:disabled svg {
  opacity: 0.6;
}
.ui-button.alt {
  color: #ebecea;
  background: rgba(20, 19, 21, 0.5);
  border: 1px solid rgba(235, 236, 234, 0.25);
  box-sizing: content-box;
}
.ui-button.alt:hover {
  color: #ebecea;
  background: #141315;
  border: 1px solid rgba(235, 236, 234, 0.5);
}
.ui-button.alt:disabled:hover {
  border: 1px solid rgba(235, 236, 234, 0.25);
}
.ui-button.alt-icon, .ui-button.alt-icon-highlight {
  color: #ebecea;
  background: rgba(235, 236, 234, 0.05);
  border: 1px solid rgba(20, 19, 21, 0.5);
  box-sizing: content-box;
  margin-right: 0;
  padding: 0 0.75em;
}
.ui-button.alt-icon:hover, .ui-button.alt-icon-highlight:hover {
  color: #ebecea;
  background: rgba(235, 236, 234, 0.1);
  border: 1px solid rgba(235, 236, 234, 0.5);
}
.ui-button.alt-icon:disabled:hover, .ui-button.alt-icon-highlight:disabled:hover {
  border: 1px solid rgba(20, 19, 21, 0.5);
}
.ui-button.alt-icon-highlight {
  background: rgba(253, 207, 11, 0.8) !important;
}
.ui-button.alt-icon-highlight:hover {
  background: #fdcf0b !important;
  border: 1px solid rgba(253, 207, 11, 0.5) !important;
}

.inputbox .ui-button:not(.alt) {
  color: #EBECEA;
  background: rgba(235, 236, 234, 0.1);
  border: 1px solid rgba(235, 236, 234, 0);
}
.inputbox .ui-button:not(.alt).cta, .inputbox #configurator-inquiry .wFormContainer input.ui-button[type=submit]:not(.alt), #configurator-inquiry .wFormContainer .inputbox input.ui-button[type=submit]:not(.alt), .inputbox #configurator-feedback .gform_wrapper .ui-button.gform_button:not(.alt), #configurator-feedback .gform_wrapper .inputbox .ui-button.gform_button:not(.alt) {
  color: #141315;
}
.inputbox .ui-button:not(.alt):not(:disabled):hover {
  border: 1px solid rgba(235, 236, 234, 0.5);
}
.inputbox .ui-button:not(.alt) svg {
  margin: 0;
  opacity: 1;
}

#checkbox-shareable {
  margin-left: -0.25em;
  padding: 0 0.625em;
  visibility: hidden;
  position: absolute;
  pointer-events: none;
  /*
  &.show {
    visibility: visible;
    position: relative;
    pointer-events: auto;
  }
  */
}
#checkbox-shareable input[type=checkbox] {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}
#checkbox-shareable input[type=checkbox] ~ #checkmark-shareable {
  display: inline-block;
  width: 18px;
  height: 18px;
}
#checkbox-shareable input[type=checkbox] ~ #checkmark-shareable:before {
  content: url('data:image/svg+xml,<svg width="18" height="13" viewBox="0 0 18 13" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M17 5C17 5 14.6216 9 9.21618 9C2.94596 9 1 5 1 5" stroke="white" stroke-width="1.5" stroke-linejoin="round"/><path d="M3 7.00012L1 9.5" stroke="white" stroke-opacity="0.85" stroke-width="1.25"/><path d="M14.75 6.99998L17 9.5" stroke="white" stroke-opacity="0.85" stroke-width="1.25"/><path d="M6.5929 9.19776L5.74996 12" stroke="white" stroke-opacity="0.85" stroke-width="1.25"/><path d="M11.1571 9.19747L12 12" stroke="white" stroke-opacity="0.85" stroke-width="1.25"/></svg>');
}
#checkbox-shareable input[type=checkbox]:checked ~ #checkmark-shareable:before {
  content: url('data:image/svg+xml,<svg width="18" height="12" viewBox="0 0 18 12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1 6C1 6 3.37838 2 8.78382 2C15.054 2 17 6 17 6" stroke="white" stroke-width="1.5" stroke-linejoin="round"/><path d="M9 10C11.2091 10 13 8.20914 13 6C13 3.79086 11.2091 2 9 2C6.79086 2 5 3.79086 5 6C5 8.20914 6.79086 10 9 10Z" stroke="white" stroke-width="1.25"/></svg>');
}

#tooltip-shareable .hide {
  display: none;
}

#share-project-toggle {
  position: relative;
  display: inline-block;
  width: 50px;
  height: 30px;
}
#share-project-toggle input {
  opacity: 0;
  width: 0;
  height: 0;
}
#share-project-toggle input:checked + .toggle-track {
  background-color: #34c759;
}
#share-project-toggle input:checked + .toggle-track:before {
  transform: translateX(20px);
  content: url('data:image/svg+xml,<svg width="18" height="12" viewBox="0 0 18 12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1 6C1 6 3.37838 2 8.78382 2C15.054 2 17 6 17 6" stroke="white" stroke-width="1.5" stroke-linejoin="round"/><path d="M9 10C11.2091 10 13 8.20914 13 6C13 3.79086 11.2091 2 9 2C6.79086 2 5 3.79086 5 6C5 8.20914 6.79086 10 9 10Z" stroke="white" stroke-width="1.25"/></svg>');
}
#share-project-toggle input:disabled + .toggle-track {
  opacity: 0.5;
  cursor: not-allowed;
}
#share-project-toggle:before {
  content: "OFF";
  position: absolute;
  right: 60px;
  height: 100%;
  display: flex;
  align-items: center;
  font-size: 0.75rem;
}
#share-project-toggle:has(input:checked):before {
  content: "ON";
}
#share-project-toggle .toggle-track {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(235, 236, 234, 0.75);
  border: 2px solid rgba(235, 236, 234, 0);
  border-radius: 34px;
  -webkit-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
#share-project-toggle .toggle-track:before {
  display: flex;
  justify-content: center;
  line-height: 30px;
  position: absolute;
  content: url('data:image/svg+xml,<svg width="18" height="13" viewBox="0 0 18 13" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M17 5C17 5 14.6216 9 9.21618 9C2.94596 9 1 5 1 5" stroke="white" stroke-width="1.5" stroke-linejoin="round"/><path d="M3 7.00012L1 9.5" stroke="white" stroke-opacity="0.85" stroke-width="1.25"/><path d="M14.75 6.99998L17 9.5" stroke="white" stroke-opacity="0.85" stroke-width="1.25"/><path d="M6.5929 9.19776L5.74996 12" stroke="white" stroke-opacity="0.85" stroke-width="1.25"/><path d="M11.1571 9.19747L12 12" stroke="white" stroke-opacity="0.85" stroke-width="1.25"/></svg>');
  height: 26px;
  width: 26px;
  top: 0px;
  left: 0px;
  background-color: #201B23;
  border-radius: 50%;
  -webkit-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}

#customize-btn-container {
  display: grid;
  gap: 0.5em;
  margin: 0 0.25em 1em 0;
  width: 100%;
  align-items: center;
  padding: 0 0.5em;
}

#panelCustomize {
  background-color: rgba(253, 207, 11, 0.9);
  border: 1px solid rgba(253, 207, 11, 0.9);
  font-size: 1em;
  font-weight: 500;
}
#panelCustomize:hover {
  background-color: #fdcf0b;
}
#panelCustomize.active {
  display: none;
  height: 2.4em;
  color: rgba(235, 236, 234, 0.75);
  background-color: transparent;
  border: 1px solid rgba(235, 236, 234, 0.5);
  font-weight: normal;
}
#panelCustomize.active:hover {
  color: #ebecea;
  border: 1px solid rgba(235, 236, 234, 0.75);
}

#save-configuration-message {
  display: block;
  position: absolute;
  background: rgba(255, 255, 255, 0.8);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow: 0px 10px 10px rgba(0, 0, 0, 0.01);
  color: black;
  padding: 0.625em 1em;
  border-radius: 4px;
  margin: 0.1em 0;
  text-align: left;
  z-index: 1;
  opacity: 0;
  user-select: none;
  -webkit-user-select: none; /* Safari fallback only */
  -webkit-user-select: none; /* Chrome/Safari */
  -moz-user-select: none; /* Firefox */
  -ms-user-select: none; /* IE10+ */
  -webkit-transition: opacity 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: opacity 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: opacity 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: opacity 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: opacity 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
#save-configuration-message.show {
  opacity: 1;
  -webkit-transition: opacity 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: opacity 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: opacity 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: opacity 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: opacity 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}

#save-configuration-button {
  margin-right: 0;
}

.ui-tag {
  font-family: "Avenir LT W01_65 Medium1475532", "Avenir Medium", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif;
  font-weight: normal;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  color: rgba(255, 255, 255, 0.9);
  font-size: 12px;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 1px;
  height: 27px;
  padding: 0 10px 0 12px;
  margin-right: 6px;
  margin-bottom: 2px;
  border-radius: 21px;
  border: none;
  background: rgba(32, 27, 35, 0.9);
}
.ui-tag.invert {
  filter: invert(1);
}

#inquirybutton {
  justify-self: end;
  align-self: center;
  display: inline-block;
  /*
  &.hidden {
    visibility: hidden;
    max-width: 0px;
    overflow: hidden;
    margin-left: 0;
    margin-right: 0;
    padding: 0;
  }*/
}
#inquirybutton.hidden {
  padding: 0.35em 0.75em;
  font-size: 1em;
}
#viewport {
  position: absolute;
  width: calc(100vw - 500px);
  height: 100vh;
}

#canvas-container {
  position: absolute;
  display: inline-block;
  width: 100vw;
  height: 100vh;
  z-index: 0;
  user-select: none;
  -webkit-user-select: none; /* Safari fallback only */
  -webkit-user-select: none; /* Chrome/Safari */
  -moz-user-select: none; /* Firefox */
  -ms-user-select: none; /* IE10+ */
}

#canvas0 {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  z-index: 0;
}

#human {
  position: absolute;
  pointer-events: none;
  z-index: 3;
  -webkit-transform: translate3d(0, 0, 0);
  user-select: none;
  -webkit-user-select: none; /* Safari fallback only */
  -webkit-user-select: none; /* Chrome/Safari */
  -moz-user-select: none; /* Firefox */
  -ms-user-select: none; /* IE10+ */
  -webkit-transition: opacity 0.75s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: opacity 0.75s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: opacity 0.75s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: opacity 0.75s cubic-bezier(0.25, 1, 0.5, 1);
  transition: opacity 0.75s cubic-bezier(0.25, 1, 0.5, 1);
}
#human.fade {
  opacity: 0.1;
  filter: blur(5px);
  -webkit-filter: blur(5px);
  -webkit-transition: opacity 0.75s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: opacity 0.75s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: opacity 0.75s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: opacity 0.75s cubic-bezier(0.25, 1, 0.5, 1);
  transition: opacity 0.75s cubic-bezier(0.25, 1, 0.5, 1);
}

#grid-container, #grid-container-ui {
  position: absolute;
  transform-origin: top left;
  pointer-events: none;
  user-select: none;
  -webkit-user-select: none; /* Safari fallback only */
  -webkit-user-select: none; /* Chrome/Safari */
  -moz-user-select: none; /* Firefox */
  -ms-user-select: none; /* IE10+ */
}
#grid-container.invert, #grid-container-ui.invert {
  color: #dfe4dc;
}
#grid-container.invert #rakkslogo svg .st0, #grid-container-ui.invert #rakkslogo svg .st0 {
  fill: #dfe4dc;
}
#grid-container.invert .span, #grid-container-ui.invert .span {
  color: #dfe4dc !important;
  border-color: rgba(255, 255, 255, 0.425) !important;
}
#grid-container.invert td, #grid-container.invert .dim-table-left, #grid-container-ui.invert td, #grid-container-ui.invert .dim-table-left {
  border-color: white !important;
}
#grid-container #grid-scale, #grid-container #grid-scale-ui, #grid-container-ui #grid-scale, #grid-container-ui #grid-scale-ui {
  pointer-events: none;
  transform-origin: top left;
  width: 100%;
  height: 100%;
}
#grid-container #shelving-grid, #grid-container-ui #shelving-grid {
  transform-origin: top left;
  width: 100%;
  height: 100%;
}
#grid-container #shelving-grid .dim-table-top, #grid-container #shelving-grid .dim-table-left, #grid-container-ui #shelving-grid .dim-table-top, #grid-container-ui #shelving-grid .dim-table-left {
  position: absolute;
  border-collapse: collapse;
  opacity: 0.425;
}
#grid-container #shelving-grid .dim-table-top tr, #grid-container #shelving-grid .dim-table-top td, #grid-container #shelving-grid .dim-table-left tr, #grid-container #shelving-grid .dim-table-left td, #grid-container-ui #shelving-grid .dim-table-top tr, #grid-container-ui #shelving-grid .dim-table-top td, #grid-container-ui #shelving-grid .dim-table-left tr, #grid-container-ui #shelving-grid .dim-table-left td {
  min-width: 0;
  min-height: 0;
  padding: 0;
}
#grid-container #shelving-grid .dim-table-top td, #grid-container-ui #shelving-grid .dim-table-top td {
  border-left: 1px solid black;
  border-right: 1px solid black;
}
#grid-container #shelving-grid .dim-table-left tr:not(:last-child) td:not(:first-child), #grid-container-ui #shelving-grid .dim-table-left tr:not(:last-child) td:not(:first-child) {
  border-bottom: 1px solid black;
}
#grid-container #shelving-grid .dim-table-left, #grid-container-ui #shelving-grid .dim-table-left {
  border-top: 1px solid black;
  border-bottom: 1px solid black;
}
#grid-container #shelving-grid .span, #grid-container-ui #shelving-grid .span {
  display: flex;
  position: absolute;
  align-items: flex-end;
  justify-content: center;
  color: black;
  font-size: 14px;
  line-height: 14px;
  text-align: center;
  padding-bottom: 2px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.425);
}

@media screen and (max-width: 1023px), screen and (max-height: 599px) {
  #shelving-grid .span {
    font-size: 11px !important;
    padding-bottom: 0px !important;
  }
}
#customizations {
  margin-bottom: 1em;
}
#customizations .radiocontainer {
  display: flex;
  justify-content: left;
  align-items: center;
  gap: 0.5em;
  margin-bottom: 0.5em;
  /*
      input:checked ~ .radio {
        background: $yellow;
        border-color: $yellow;

        & ~ .ui-button {
          color: $yellow;
          svg > path {
            stroke: $yellow;
          }
        }
      }
  */
}
#customizations .radiocontainer input:checked ~ .radio ~ .ui-button {
  border: 1.5px solid rgba(235, 236, 234, 0.5);
}
#customizations .radiocontainer .ui-button {
  background: rgba(235, 236, 234, 0.1);
  border: 1px solid rgba(235, 236, 234, 0);
}
#customizations .radiocontainer .ui-button:hover {
  border: 1px solid rgba(235, 236, 234, 0.5);
}
#customizations .radiocontainer .ui-button svg {
  margin: 0 0.75em 0 0;
  opacity: 1;
}

#customize-ui {
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 2;
  user-select: none;
  -webkit-user-select: none; /* Safari fallback only */
  -webkit-user-select: none; /* Chrome/Safari */
  -moz-user-select: none; /* Firefox */
  -ms-user-select: none; /* IE10+ */
}
#customize-ui.hide {
  display: none;
}
#customize-ui.invert .addCol:before, #customize-ui.invert .addRow:before {
  color: rgba(235, 236, 234, 0.5);
}
#customize-ui.invert .addCol:hover:before, #customize-ui.invert .addRow:hover:before {
  color: #EBECEA;
}
#customize-ui.invert .toggle:not(.active):before {
  box-shadow: 0 0 0 1px rgba(235, 236, 234, 0.5);
}
#customize-ui.invert .toggle:not(.active):hover:before {
  box-shadow: 0 0 0 2px black;
}
#customize-ui.invert .off-bound {
  background: rgba(255, 255, 255, 0.125);
}

.customize-hide {
  max-height: 500px;
  overflow: hidden;
  -webkit-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
.customize-hide.hide {
  max-height: 0px;
  padding-top: 0;
  padding-bottom: 0;
  margin-top: 0;
  margin-bottom: 0;
  -webkit-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}

.customize-show {
  display: flex;
}

#node-cols {
  position: absolute;
}
#node-cols.hide {
  display: none;
}
#node-cols .colUI {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  position: absolute;
  background: rgba(255, 0, 0, 0);
  transform: translate(-50%, 0%);
  padding: 4px;
  margin-bottom: -4px;
}
#node-cols .colUI .translateCol {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  background: rgba(255, 255, 255, 0.75);
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.8);
  height: 18px;
  width: 4px;
  border-radius: 11px;
  margin: 2px;
  cursor: pointer;
  -webkit-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
#node-cols .colUI .translateCol:before {
  content: "";
  overflow: hidden;
  height: 5px;
  -webkit-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
#node-cols .colUI .translateCol:hover {
  background: white;
  -webkit-transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
}
#node-cols .colUI .deleteCol {
  display: flex;
  justify-content: center;
  position: relative;
  background: rgba(0, 0, 0, 0.75);
  width: 22px;
  height: 22px;
  border-radius: 11px;
  opacity: 0;
  cursor: pointer;
  -webkit-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
#node-cols .colUI .deleteCol:before {
  content: "";
  position: absolute;
  background: white;
  height: 1.5px;
  width: 10px;
  top: 10px;
}
#node-cols .colUI .deleteCol:hover {
  background: white;
  -webkit-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
}
#node-cols .colUI .deleteCol:hover:before {
  background: white;
}
#node-cols .colUI:hover .translateCol {
  width: 22px;
  height: 22px;
  -webkit-transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
}
#node-cols .colUI:hover .translateCol:before {
  content: url("data:image/svg+xml,%3Csvg width='17' height='10' viewBox='0 0 17 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M15.5 5.00001L11.5 0.5M15.5 5.00001L11.5 9.5M15.5 5.00001L1.5 4.99999M1.5 4.99999L5.5 9.5M1.5 4.99999L5.5 0.5' stroke='black' stroke-width='1.25'/%3E%3C/svg%3E%0A");
  height: auto;
  -webkit-transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
}
#node-cols .colUI:hover .deleteCol {
  height: 22px;
  background: rgba(0, 0, 0, 0.75);
  opacity: 1;
}
#node-cols .colUI:hover .deleteCol.before {
  background: black;
}
#node-cols .addCol {
  display: flex;
  justify-content: center;
  position: absolute;
  width: 22px;
  height: 22px;
  border-radius: 11px;
  margin-left: -11px;
  background: rgba(255, 255, 255, 0);
  cursor: pointer;
  -webkit-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
#node-cols .addCol:before {
  content: "+";
  position: absolute;
  color: black;
  top: 11px;
  left: 4px;
  font-size: 20.5px;
  line-height: 0;
}
#node-cols .addCol:hover {
  background: black;
  -webkit-transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
}
#node-cols .addCol:hover:before {
  color: white;
}
#node-cols .off-bound {
  display: flex;
  flex-direction: row;
  justify-content: end;
  position: absolute;
  gap: 1px;
  border-radius: 22px;
  background: rgba(0, 0, 0, 0.1);
}
#node-cols .off-bound .addCol {
  display: flex;
  justify-content: center;
  position: relative;
  width: 22px;
  height: 22px;
  margin: 0;
  background: rgba(255, 255, 255, 0.025);
  border-radius: 11px;
  cursor: pointer;
  -webkit-transition: background 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: background 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: background 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: background 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: background 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
#node-cols .off-bound .addCol:before {
  content: "+";
  position: absolute;
  color: black !important;
  top: 11px;
  left: 4px;
  font-size: 20.5px;
  line-height: 0;
}
#node-cols .off-bound .addCol:hover {
  background: rgba(255, 255, 255, 0.8);
  -webkit-transition: background 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: background 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: background 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: background 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  transition: background 0.2s cubic-bezier(0.25, 1, 0.5, 1);
}
#node-cols .off-bound .addCol:hover:before {
  color: black !important;
}
#node-cols .off-bound .deleteCol {
  display: flex;
  justify-content: center;
  position: relative;
  width: 22px;
  height: 22px;
  background: rgba(255, 255, 255, 0.025);
  border-radius: 11px;
  cursor: pointer;
  -webkit-transition: background 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: background 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: background 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: background 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: background 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
#node-cols .off-bound .deleteCol:before {
  content: "";
  position: absolute;
  background: black;
  height: 1.5px;
  width: 10px;
  top: 10px;
}
#node-cols .off-bound .deleteCol:hover {
  background: rgba(255, 255, 255, 0.8);
  -webkit-transition: background 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: background 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: background 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: background 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  transition: background 0.2s cubic-bezier(0.25, 1, 0.5, 1);
}
#node-cols .off-bound .deleteCol:hover:before {
  background: black;
}

#node-rows {
  position: absolute;
}
#node-rows.hide {
  display: none;
}
#node-rows .rowUI {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  position: absolute;
  background: rgba(255, 0, 0, 0);
  transform: translate(0, 50%);
  padding: 4px;
}
#node-rows .rowUI .translateRow {
  display: flex;
  justify-content: center;
  position: relative;
  background: rgba(255, 255, 255, 0.75);
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.8);
  height: 4px;
  width: 18px;
  border-radius: 11px;
  margin: 2px;
  cursor: pointer;
  -webkit-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
#node-rows .rowUI .translateRow:before {
  content: "";
  overflow: hidden;
  height: 5px;
  margin-top: 3px;
  -webkit-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
#node-rows .rowUI .translateRow:hover {
  background: white;
  -webkit-transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
}
#node-rows .rowUI .translateRow.is-dragging {
  width: 22px;
  height: 22px;
}
#node-rows .rowUI .translateRow.is-dragging:before {
  content: url("data:image/svg+xml,%3Csvg width='11' height='16' viewBox='0 0 11 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.49999 15L10 11M5.49999 15L0.999999 11M5.49999 15L5.5 1M5.5 1L0.999999 5M5.5 1L10 5' stroke='black' stroke-width='1.25'/%3E%3C/svg%3E%0A");
  height: 22px;
}
#node-rows .rowUI .deleteRow {
  display: flex;
  justify-content: center;
  position: relative;
  background: rgba(0, 0, 0, 0.75);
  width: 22px;
  height: 22px;
  border-radius: 11px;
  opacity: 0;
  cursor: pointer;
  -webkit-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
#node-rows .rowUI .deleteRow:before {
  content: "";
  position: absolute;
  background: white;
  height: 1.5px;
  width: 10px;
  top: 10px;
}
#node-rows .rowUI .deleteRow:hover {
  background: white;
  -webkit-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
}
#node-rows .rowUI .deleteRow:hover:before {
  background: white;
}
#node-rows .rowUI:hover .translateRow {
  width: 22px;
  height: 22px;
  -webkit-transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
}
#node-rows .rowUI:hover .translateRow:before {
  content: url("data:image/svg+xml,%3Csvg width='11' height='16' viewBox='0 0 11 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.49999 15L10 11M5.49999 15L0.999999 11M5.49999 15L5.5 1M5.5 1L0.999999 5M5.5 1L10 5' stroke='black' stroke-width='1.25'/%3E%3C/svg%3E%0A");
  height: 22px;
  -webkit-transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
}
#node-rows .rowUI:hover .deleteRow {
  height: 22px;
  background: rgba(0, 0, 0, 0.75);
  opacity: 1;
}
#node-rows .rowUI:hover .deleteRow.before {
  background: black;
}
#node-rows .addRow {
  display: flex;
  justify-content: center;
  position: absolute;
  width: 22px;
  height: 22px;
  border-radius: 11px;
  margin-left: 4px;
  background: rgba(255, 255, 255, 0);
  transform: translate(0, 50%);
  cursor: pointer;
  -webkit-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
#node-rows .addRow:before {
  content: "+";
  position: absolute;
  color: black;
  top: 11px;
  left: 4px;
  font-size: 20.5px;
  line-height: 0;
}
#node-rows .addRow:hover {
  background: black;
  -webkit-transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
}
#node-rows .addRow:hover:before {
  color: white;
}

#shelf-sizes-menu {
  position: absolute;
  display: grid;
  gap: 1em;
  width: 250px;
  line-height: 1.2;
}
#shelf-sizes-menu.hide {
  display: none;
}
#shelf-sizes-menu.invert {
  color: #201B23;
}

#nodes-ui {
  position: absolute;
}
#nodes-ui .addRow, #nodes-ui .deleteRow, #nodes-ui .translateRow {
  display: inline-block;
  position: absolute;
  width: 16px;
  height: 16px;
  border-radius: 8px;
  margin-left: -8px;
  margin-top: -8px;
  background: rgba(255, 255, 255, 0.35);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.5);
  cursor: pointer;
  -webkit-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
#nodes-ui .addRow:before, #nodes-ui .deleteRow:before, #nodes-ui .translateRow:before {
  content: "+";
  position: absolute;
  color: black;
  top: 8px;
  left: 1px;
  font-size: 20.5px;
  line-height: 0;
}
#nodes-ui .addRow:hover, #nodes-ui .deleteRow:hover, #nodes-ui .translateRow:hover {
  background: white;
  box-shadow: 0 0 0 2px white;
}
#nodes-ui .deleteRow {
  background: rgba(255, 255, 255, 0.5);
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.5);
}
#nodes-ui .deleteRow:before {
  content: "";
  background: black;
  height: 1.5px;
  width: 10px;
  left: 3px;
  top: 7.5px;
}
#nodes-ui .translateRow {
  width: 18px;
  height: 18px;
  border-radius: 9px;
  margin-left: -9px;
  margin-top: -9px;
  background: rgba(255, 255, 255, 0.5);
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.5);
}
#nodes-ui .translateRow:before {
  content: url("data:image/svg+xml,%3Csvg width='9' height='13' viewBox='0 0 9 13' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4.49999 12L8 9M4.49999 12L0.999999 9M4.49999 12L4.50001 1M4.50001 1L0.999999 4M4.50001 1L8 4' stroke='black' stroke-width='1.25'/%3E%3C/svg%3E%0A");
  left: 4.5px;
  top: 2.5px;
}
#nodes-ui .toggle {
  display: inline-block;
  position: absolute;
  overflow: hidden;
  width: 24px;
  height: 24px;
  margin-left: -12px;
  margin-top: -12px;
  cursor: pointer;
}
#nodes-ui .toggle:before {
  content: "";
  position: absolute;
  top: 12px;
  left: 12px;
  width: 10px;
  height: 10px;
  border-radius: 5px;
  margin-top: -5px;
  margin-left: -5px;
  background: rgba(255, 255, 255, 0);
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.5);
  -webkit-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
#nodes-ui .toggle:hover:before {
  width: 14px;
  height: 14px;
  border-radius: 7px;
  margin-left: -7px;
  margin-top: -7px;
  background: white;
  box-shadow: 0 0 0 2px black;
  -webkit-transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
}
#nodes-ui .toggle.active:before {
  content: "";
  position: absolute;
  top: 12px;
  left: 12px;
  width: 6px;
  height: 6px;
  border-radius: 3px;
  margin-left: -3px;
  margin-top: -3px;
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.75);
  -webkit-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
#nodes-ui .toggle.active:hover:before {
  width: 12px;
  height: 12px;
  border-radius: 7px;
  margin-left: -7px;
  margin-top: -7px;
  background: rgba(255, 255, 255, 0);
  border: 1px solid rgba(0, 0, 0, 0.5);
  box-shadow: 0 0 0 2px white;
  -webkit-transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
}

#capture-ui {
  position: absolute;
}
#capture-ui .shelf-part {
  position: absolute;
  font-size: 12px;
  text-align: center;
  transform: translate(-50%, -100%);
  pointer-events: none;
  color: rgba(32, 27, 35, 0.9);
  background: rgba(235, 236, 234, 0.75);
  padding: 1px 4px 1px;
  border-radius: 5px;
}
#capture-ui .shelf-part.invert {
  color: rgba(235, 236, 234, 0.9);
  background: rgba(20, 19, 21, 0.75);
}

#shelves-ui {
  position: absolute;
  z-index: 1;
}
#shelves-ui .shelf-part {
  display: inline-block;
  position: absolute;
  background: rgba(255, 255, 255, 0);
  width: 24px;
  height: 24px;
  overflow: visible;
  border-radius: 12px;
  margin-left: -12px;
  margin-top: -12px;
  padding: 10px;
}
#shelves-ui .shelf-part:before {
  position: absolute;
  content: attr(data-depth);
  font-size: 12px;
  text-align: center;
  width: 30px;
  margin-top: -21px;
  margin-left: -12px;
  pointer-events: none;
  color: rgba(32, 27, 35, 0.9);
}
#shelves-ui .shelf-part.invert:before {
  color: rgba(235, 236, 234, 0.9);
}
#shelves-ui .shelf-part .content {
  display: inline-block;
  position: absolute;
  background: white;
  overflow: hidden;
  width: 6px;
  height: 6px;
  margin: 0;
  border-radius: 3px;
  color: white;
  box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.75);
  padding: 0px;
  -webkit-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
}
#shelves-ui .shelf-part.show, #shelves-ui .shelf-part:hover {
  width: auto;
  height: auto;
}
#shelves-ui .shelf-part.show .content, #shelves-ui .shelf-part:hover .content {
  position: relative;
  width: auto;
  height: auto;
  padding: 6px 12px;
  color: black;
  border-radius: 1px 16px 16px 16px;
  box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.1);
  z-index: 10;
  -webkit-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
}

#devpanel {
  font-family: monospace;
  font-size: 0.9em;
  left: 30px;
  bottom: 7.5em;
}
#devpanel #toggles-content {
  max-width: 260px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 12px;
  margin: 2px 0 2px;
}
#devpanel #toggles-content input[type=checkbox] {
  margin: 0 4px 0 0;
  vertical-align: text-top;
}
#devpanel .keyframe {
  display: inline-block;
  text-align: center;
  background: rgba(0, 0, 0, 0.6);
  padding: 0.5em 0.75em;
  margin: 0.5em 0.75em 0 0;
  border-radius: 2px;
  cursor: pointer;
  font-size: 11px;
  color: rgba(255, 255, 255, 0.75);
}
#devpanel .devTextInput {
  display: inline-block;
  position: relative;
  min-width: 1ch;
  width: 6ch;
  height: 24px;
  background: rgba(255, 255, 255, 0.5);
  color: black;
  padding: 0.25em 0.5em 0.25em 0.5em;
  margin: 0px 0 6px;
}
#devpanel #transDuration, #devpanel #transDimDuration {
  display: inline-block;
  position: relative;
  min-width: 1ch;
  width: 6ch;
  height: 24px;
  background: rgba(255, 255, 255, 0.5);
  color: black;
  padding: 0.25em 1em 0.25em 0.5em;
  margin: 6px 0;
}
#devpanel .transSeconds:after {
  content: "s";
  display: inline-block;
  position: absolute;
  width: 10px;
  height: 10px;
  font-size: 1.1em;
  color: black;
  margin-left: -13px;
  margin-top: 10px;
}
#devpanel #transEasing, #devpanel #transDimEasing {
  display: inline-block;
  min-width: 50px;
  width: fit-content;
  height: 24px;
  vertical-align: bottom;
  border-radius: 2px;
  background: rgba(255, 255, 255, 0.6);
  color: black;
  padding: 0.4em 0.5em 0.125em;
  margin: 6px 0;
}

#dev-console {
  display: block;
  padding: 1em 0 0;
  max-height: 100px;
  max-width: 480px;
  overflow: scroll;
  -ms-overflow-style: none; /* IE and Edge */
  scrollbar-width: none; /* Firefox */
}
#dev-console::-webkit-scrollbar {
  display: none;
}

#dev-stats {
  display: block;
  position: absolute;
  max-width: 480px;
  top: 7em;
  left: 4em;
  font-family: monospace;
  font-size: 12px;
  opacity: 0.5;
  z-index: -1;
  pointer-events: none;
  user-select: none;
  -webkit-user-select: none; /* Safari fallback only */
  -webkit-user-select: none; /* Chrome/Safari */
  -moz-user-select: none; /* Firefox */
  -ms-user-select: none; /* IE10+ */
}

#salespanel {
  right: 432px;
  bottom: 7px;
  text-align: right;
  z-index: 4;
}

.draggable-panel {
  font-weight: normal;
  position: absolute;
  border-radius: 16px 16px 2px 2px;
  z-index: 1000;
  -webkit-transition: background 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: background 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: background 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: background 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: background 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
.draggable-panel h1 {
  font-family: monospace;
  font-size: 0.9em;
  font-size: 1em;
  font-weight: normal;
  width: 100%;
  margin: 0;
  padding: 10px 24px 8px 12px;
  border-radius: 16px 16px 2px 2px;
  background: rgba(0, 0, 0, 0);
  pointer-events: none;
  opacity: 0.5;
  -webkit-transition: background 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: background 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: background 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: background 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: background 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
.draggable-panel h1 .version {
  font-weight: normal;
  pointer-events: auto;
}
.draggable-panel h1 .version a {
  text-decoration: none;
}
.draggable-panel .panel-title {
  pointer-events: auto;
  cursor: pointer;
}
.draggable-panel .panel-title:before {
  content: " ";
  display: inline-block;
  width: 12px;
  height: 13px;
  margin-right: 0.5rem;
  background-image: url("data:image/svg+xml,%3Csvg width='12' height='13' viewBox='0 0 12 13' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11 5.33821L6.00002 11L0.999999 5.33821' stroke='white' stroke-width='1.5'/%3E%3Cpath d='M6 0L6 11' stroke='white' stroke-width='1.5'/%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
  vertical-align: bottom;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
}
.draggable-panel .panel-title.collapse:before {
  background-image: url("data:image/svg+xml,%3Csvg width='12' height='13' viewBox='0 0 12 13' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 7.66179L5.99998 2L11 7.66179' stroke='white' stroke-width='1.5'/%3E%3Cpath d='M6 13L6 2' stroke='white' stroke-width='1.5'/%3E%3C/svg%3E%0A");
  vertical-align: 0px;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
}
.draggable-panel .panel-content {
  display: grid;
  grid-auto-flow: column;
  -moz-column-gap: 2em;
  column-gap: 2em;
  -moz-row-gap: 1em;
  row-gap: 1em;
  overflow: scroll;
  max-height: calc(100vh - 32px);
  padding: 15px 25px 25px;
  -webkit-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
.draggable-panel .panel-content.collapse {
  max-height: 0px;
  padding: 0 25px 0;
  -webkit-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
.draggable-panel .panel-content::-webkit-scrollbar {
  display: none;
}
.draggable-panel .col {
  display: block;
  align-self: end;
  pointer-events: none;
}
.draggable-panel .col > * {
  cursor: auto;
  pointer-events: auto;
}
.draggable-panel .col input[type=range], .draggable-panel .col span {
  vertical-align: middle;
}
.draggable-panel #table-container {
  max-height: 0;
  -webkit-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
.draggable-panel .scrollconfigs {
  max-height: 52px;
  -webkit-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
.draggable-panel:hover {
  background: rgba(32, 27, 35, 0.8);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  -webkit-transition: background 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: background 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: background 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: background 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: background 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
.draggable-panel:hover #table-container {
  max-height: 1000px;
  margin-bottom: 1em;
  -webkit-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
.draggable-panel:hover .scrollconfigs {
  max-height: 1000px;
  -webkit-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
.draggable-panel:hover h1 {
  background: black;
  opacity: 1;
  -webkit-transition: background 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: background 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: background 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: background 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: background 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
.draggable-panel.light {
  color: black;
}
.draggable-panel.light .panel-title:before {
  background-image: url("data:image/svg+xml,%3Csvg width='12' height='13' viewBox='0 0 12 13' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11 5.33821L6.00002 11L0.999999 5.33821' stroke='black' stroke-width='1.5'/%3E%3Cpath d='M6 0L6 11' stroke='black' stroke-width='1.5'/%3E%3C/svg%3E%0A");
}
.draggable-panel.light .panel-title.collapse:before {
  background-image: url("data:image/svg+xml,%3Csvg width='12' height='13' viewBox='0 0 12 13' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 7.66179L5.99998 2L11 7.66179' stroke='black' stroke-width='1.5'/%3E%3Cpath d='M6 13L6 2' stroke='black' stroke-width='1.5'/%3E%3C/svg%3E%0A");
}
.draggable-panel.light .version > a {
  color: rgba(32, 27, 35, 0.8);
}
.draggable-panel.light .version > a:hover {
  color: #201b23;
}
.draggable-panel.light:hover {
  background: rgba(255, 255, 255, 0.9);
}
.draggable-panel.light:hover h1 {
  color: black;
  background: white;
}

#tmp-rotate-view {
  position: absolute;
  bottom: 8em;
  left: 3.8em;
  font-size: 0.8em;
  color: #141315;
  text-align: center;
  max-width: 6em;
  line-height: 1.2em;
  pointer-events: none;
}
#tmp-rotate-view svg {
  display: block;
  margin: 0.5em auto;
}
#tmp-rotate-view.hide {
  opacity: 0;
  -webkit-transition: opacity 0.25s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: opacity 0.25s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: opacity 0.25s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: opacity 0.25s cubic-bezier(0.25, 1, 0.5, 1);
  transition: opacity 0.25s cubic-bezier(0.25, 1, 0.5, 1);
}
#tmp-rotate-view.invert {
  filter: invert(1);
}

#homepanel {
  display: grid;
  grid-auto-flow: column;
  -moz-column-gap: 2em;
  column-gap: 2em;
  -moz-row-gap: 1em;
  row-gap: 1em;
  position: absolute !important;
  top: 1em;
  z-index: 5;
  padding: 1em 2em;
}
#homepanel #homebutton {
  overflow: hidden;
  white-space: nowrap;
  justify-content: flex-start;
  padding: 0 16px;
  background: transparent;
  font-size: 1em;
  color: rgba(235, 236, 234, 0.5);
  -webkit-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
#homepanel #homebutton svg {
  min-width: 15px;
}
#homepanel #homebutton svg > path {
  stroke: rgba(235, 236, 234, 0.5);
}
#homepanel #homebutton .text {
  font-size: 0.95rem;
  opacity: 0;
  margin-left: 1em;
  -webkit-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
#homepanel #homebutton.visible .text {
  opacity: 1;
  margin-left: 0.5em;
  -webkit-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
#homepanel #homebutton:hover, #homepanel #homebutton.highlight {
  color: black;
  background: rgba(255, 255, 255, 0.85);
  -webkit-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
}
#homepanel #homebutton:hover svg > path, #homepanel #homebutton.highlight svg > path {
  stroke: black;
}
#homepanel #homebutton:hover .text, #homepanel #homebutton.highlight .text {
  opacity: 1;
  margin-left: 0.5em;
  -webkit-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
}
#homepanel.invert #homebutton {
  color: rgba(0, 0, 0, 0.5);
}
#homepanel.invert #homebutton svg > path {
  stroke: rgba(0, 0, 0, 0.5);
}
#homepanel.invert #homebutton:hover {
  background: rgba(32, 27, 35, 0.95);
  color: white;
}
#homepanel.invert #homebutton:hover svg > path {
  stroke: white;
}

#user-support {
  display: flex;
  align-items: center;
  align-self: end;
  padding: 1.5em 0.5em;
  pointer-events: auto;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 200;
}
#user-support > svg {
  margin: 0.25rem;
}
#user-support > svg > path, #user-support > svg > rect {
  stroke: rgba(235, 236, 234, 0.325);
}
#user-support .ui-tag {
  margin-left: 6px;
  margin-right: 0;
  cursor: pointer;
  -webkit-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
#user-support .ui-tag:hover {
  background: #ebecea;
  color: rgba(0, 0, 0, 0.85);
  -webkit-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
}

.invert #user-support > svg > path, .invert #user-support > svg > rect {
  stroke: rgba(20, 19, 21, 0.325);
}

#toolpanel {
  display: grid;
  grid-auto-flow: column;
  -moz-column-gap: 2em;
  column-gap: 2em;
  -moz-row-gap: 1em;
  row-gap: 1em;
  position: absolute !important;
  bottom: 1em;
  z-index: 5;
  padding: 1em 2em;
  pointer-events: none;
  user-select: none;
  -webkit-user-select: none; /* Safari fallback only */
  -webkit-user-select: none; /* Chrome/Safari */
  -moz-user-select: none; /* Firefox */
  -ms-user-select: none; /* IE10+ */
}
#toolpanel .col {
  display: flex;
  align-items: flex-end;
  align-self: end;
  pointer-events: auto;
}
#toolpanel .col input[type=range], #toolpanel .col span {
  vertical-align: middle;
}

#cursor {
  position: absolute;
  display: none;
  align-items: center;
  justify-content: center;
  width: 25px;
  height: 25px;
  left: 100px;
  top: 100px;
  background: white;
  border: 1px solid #201b23;
  transform: translateX(-50%) translateY(-50%);
  border-radius: 5em;
  z-index: 999;
}
#cursor #spread {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}
#cursor svg:nth-of-type(1) {
  position: absolute;
  left: 17%;
}
#cursor svg:nth-of-type(2) {
  position: absolute;
}
#cursor svg:nth-of-type(3) {
  position: absolute;
  right: 17%;
}
#cursor.show {
  display: flex;
}
#cursor #label {
  display: flex;
  gap: 0.25em;
  align-items: center;
  content: '1"';
  font-size: 0.8em;
  width: fit-content;
  text-align: center;
  color: white;
  position: absolute;
  margin-top: -4em;
}
#cursor #label svg {
  display: inline-block;
  position: relative;
  left: 0;
  right: auto;
}
#cursor.invert #label {
  color: #201B23;
}
#cursor.invert #label svg > path {
  stroke: #201B23;
}
#cursor.rotate #spread {
  transform: rotate(90deg);
}

#rakkscontainer {
  position: absolute;
  top: 3em;
  left: 3em;
  transform-origin: top left;
}

#rakkslogo {
  position: absolute;
  transform-origin: bottom left;
  height: 60px;
  pointer-events: none;
  user-select: none;
  -webkit-user-select: none; /* Safari fallback only */
  -webkit-user-select: none; /* Chrome/Safari */
  -moz-user-select: none; /* Firefox */
  -ms-user-select: none; /* IE10+ */
}

.restricted {
  display: inline-block;
  text-align: center;
  width: 100%;
  box-sizing: border-box;
  padding: 2.5em 3em;
  font-size: 1.2em;
  color: white;
  background: #fe3019;
}
.restricted a {
  color: white;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
}

input[type=color] {
  -webkit-appearance: none;
  position: relative;
  border: 1px solid rgba(32, 27, 35, 0.5);
  outline: none;
  width: 26px;
  height: 15px;
  margin-left: 3px;
  margin-bottom: 9px;
  border-radius: 8px;
  cursor: pointer;
  z-index: 0;
}
input[type=color]:after {
  content: "";
  display: inline-block;
  position: absolute;
  width: 26px;
  height: 15px;
  border-radius: 8px;
  background: var(--colorpicker);
  top: -1px;
  left: -1px;
  border: 1px solid rgba(32, 27, 35, 0.5);
  z-index: 1;
}
input[type=color]:hover:after {
  border: 1px solid white;
}

input[type=color]::-webkit-color-swatch-wrapper {
  padding: 0;
  margin: 0;
}

input[type=color]::-webkit-color-swatch {
  border: 1px solid rgba(32, 27, 35, 0.5);
}

#tmp-colors {
  visibility: hidden;
  position: absolute;
  text-align: right;
  margin-top: 0.5em;
}

.wood-acacia, .wood-oak, .wood-white, .wood-black {
  margin-bottom: 0.5em;
  cursor: pointer;
  color: rgba(235, 236, 234, 0.5);
}
.wood-acacia:after, .wood-oak:after, .wood-white:after, .wood-black:after {
  content: " ";
  position: relative;
  display: inline-block;
  width: 14px;
  height: 14px;
  margin-left: 4px;
  margin-top: 2px;
  margin-bottom: 9px;
  border-radius: 7px;
  border: none;
  background: red;
  vertical-align: -webkit-baseline-middle;
  vertical-align: -moz-middle-with-baseline;
}
.wood-acacia.active, .wood-acacia:hover, .wood-oak.active, .wood-oak:hover, .wood-white.active, .wood-white:hover, .wood-black.active, .wood-black:hover {
  color: white;
}

.wood-acacia:after {
  background: #CFAB7B;
}

.wood-oak:after {
  background: #785B3F;
}

.wood-white:after {
  background: #EBECEA;
}

.wood-black:after {
  background: #201B23;
  width: 13px;
  height: 13px;
  border: 1px solid rgba(235, 236, 234, 0.2);
}

#bubble {
  display: block;
  position: absolute;
  background: rgba(255, 255, 255, 0.9);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-radius: 1.5em;
  border-top-left-radius: 1.5em;
  border-bottom-left-radius: 0;
  padding: 1.125em 1.625em;
  max-width: 250px;
  height: auto;
  box-shadow: 0px 10px 10px rgba(0, 0, 0, 0.01);
  opacity: 1;
  pointer-events: auto;
  z-index: 2;
  -webkit-transition: border-radius 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: border-radius 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: border-radius 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: border-radius 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  transition: border-radius 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -webkit-transition: opacity 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: opacity 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: opacity 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: opacity 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  transition: opacity 0.2s cubic-bezier(0.25, 1, 0.5, 1);
}
#bubble.hide {
  opacity: 0;
  pointer-events: none;
  -webkit-transition: opacity 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: opacity 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: opacity 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: opacity 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  transition: opacity 0.2s cubic-bezier(0.25, 1, 0.5, 1);
}
#bubble.de-anchor {
  border-bottom-left-radius: 1.5em;
  -webkit-transition: border-radius 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: border-radius 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: border-radius 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: border-radius 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  transition: border-radius 0.2s cubic-bezier(0.25, 1, 0.5, 1);
}
#bubble:before {
  position: absolute;
  display: inline-block;
  content: "×";
  font-size: 22px;
  top: -13px;
  right: -8px;
  color: rgba(255, 255, 255, 0.25);
  -webkit-transition: color 0.5s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: color 0.5s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: color 0.5s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: color 0.5s cubic-bezier(0.25, 1, 0.5, 1);
  transition: color 0.5s cubic-bezier(0.25, 1, 0.5, 1);
}
#bubble.invert:before {
  color: rgba(0, 0, 0, 0.25);
}
#bubble:hover:before {
  color: rgba(255, 255, 255, 0.5);
  -webkit-transition: color 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: color 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: color 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: color 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  transition: color 0.2s cubic-bezier(0.25, 1, 0.5, 1);
}
#bubble:hover.invert:before {
  color: rgba(0, 0, 0, 0.5);
  -webkit-transition: color 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: color 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: color 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: color 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  transition: color 0.2s cubic-bezier(0.25, 1, 0.5, 1);
}

#bubble-message {
  margin: 0;
  user-select: none;
  -webkit-user-select: none; /* Safari fallback only */
  -webkit-user-select: none; /* Chrome/Safari */
  -moz-user-select: none; /* Firefox */
  -ms-user-select: none; /* IE10+ */
}
#bubble-message p, #bubble-message label {
  color: black;
  font-weight: 500;
  font-size: 1.05em;
  margin: 0;
}
#bubble-message p:not(:last-child), #bubble-message label:not(:last-child) {
  margin: 0 0 0.5em;
}
#bubble-message a {
  color: black;
}
#bubble-message label {
  display: inline-block;
  margin: 0.5em 0 0 -0.25em;
}
#bubble-message button, #bubble-message a.button {
  display: inline-block;
  cursor: pointer;
  font-family: "Avenir LT W01_65 Medium1475532", "Avenir Medium", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif;
  font-weight: normal;
  text-decoration: none;
  color: black;
  font-weight: 500;
  font-size: 1.1em;
  border: 1px solid rgba(32, 27, 35, 0.5);
  border-radius: 2em;
  padding: 0.35em 1em 0.4em;
  margin-top: 0.25em;
  margin-left: -0.25em;
  background: rgba(255, 255, 255, 0.75);
}
#bubble-message button svg, #bubble-message a.button svg {
  vertical-align: middle;
}
#bubble-message button.small, #bubble-message a.button.small {
  font-size: 1em;
  padding: 0.4em 0.85em;
}
#bubble-message button + button, #bubble-message button + a.button, #bubble-message a.button + button, #bubble-message a.button + a.button {
  margin-top: 0.5em;
}
#bubble-message button:hover, #bubble-message a.button:hover {
  background: white;
}
#bubble-message button.cta, #bubble-message #configurator-feedback .gform_wrapper button.gform_button, #configurator-feedback .gform_wrapper #bubble-message button.gform_button, #bubble-message a.button.cta, #bubble-message #configurator-feedback .gform_wrapper a.button.gform_button, #configurator-feedback .gform_wrapper #bubble-message a.button.gform_button {
  background: rgba(253, 207, 11, 0.8);
}
#bubble-message button.cta:hover, #bubble-message #configurator-feedback .gform_wrapper button.gform_button:hover, #configurator-feedback .gform_wrapper #bubble-message button.gform_button:hover, #bubble-message a.button.cta:hover, #bubble-message #configurator-feedback .gform_wrapper a.button.gform_button:hover, #configurator-feedback .gform_wrapper #bubble-message a.button.gform_button:hover {
  background: #fdcf0b;
}

.tooltip {
  position: relative;
}
.tooltip .tooltipcontent {
  visibility: hidden;
  background: rgba(255, 255, 255, 0.8);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow: 0px 10px 10px rgba(0, 0, 0, 0.01);
  line-height: 1.2;
  text-align: left;
  padding: 1em 1em 0.75em 1em;
  border-radius: 1em;
  border-bottom-left-radius: 0;
  position: absolute;
  z-index: 999;
  -webkit-transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.1s cubic-bezier(0.25, 1, 0.5, 1);
  pointer-events: none;
}
.tooltip .tooltipcontent .info {
  display: inline-block;
  opacity: 0.3;
  margin-top: 0.5em;
}
.tooltip .tooltipcontent ul {
  display: inline-block;
  margin: 0;
  padding: 0 0 0 1em;
}
.tooltip .tooltipcontent ul li {
  margin-bottom: 0.5em;
}
.tooltip .tooltipcontent.topleft {
  margin-bottom: 1em;
  bottom: 150%;
  left: 0;
  opacity: 0;
}
.tooltip .tooltipcontent.topright {
  border-radius: 1em 1em 0 1em;
  margin-bottom: 1em;
  bottom: 150%;
  right: 0;
  opacity: 0;
}

.tooltip:hover .tooltipcontent {
  visibility: visible;
  -webkit-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
.tooltip:hover .tooltipcontent.topleft, .tooltip:hover .tooltipcontent.topright {
  bottom: 100%;
  opacity: 1;
}

.tippy-box {
  background: transparent;
  max-width: none;
}
.tippy-box .tippy-content {
  color: black;
  background: rgba(255, 255, 255, 0.8);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  line-height: 1.2;
  padding: 1em 1em 0.75em 1em;
  border-radius: 1em;
}
.tippy-box .tippy-content .info {
  display: inline-block;
  opacity: 0.3;
  margin-top: 0.5em;
}
.tippy-box .tippy-content h2 {
  font-size: 15px;
  font-family: "Avenir LT W01_85 Heavy1475544", "Avenir Heavy", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif;
  font-weight: 600;
  margin: 0 0 0.125em;
}
.tippy-box .tippy-content h2:has(+ .ui-segmented) {
  margin: 0 5px 4px 12px;
}
.tippy-box .tippy-content ul {
  display: inline-block;
  margin: 0;
  padding: 0 0 0 1em;
}
.tippy-box .tippy-content ul li {
  margin-bottom: 0.5em;
}
.tippy-box .tippy-content label {
  color: black;
  font-size: 15px;
  height: 38px;
  margin-bottom: 0;
}
.tippy-box .tippy-content label:hover {
  color: black;
}
.tippy-box .tippy-content .radiocontainer {
  display: flex;
  align-items: center;
}
.tippy-box .tippy-content .radiocontainer .radio {
  border-color: black;
  margin-left: 2px;
  margin-right: 6px;
}
.tippy-box .tippy-content .radiocontainer svg {
  margin-left: 0em;
  opacity: 1;
}
.tippy-box .tippy-content .radiocontainer :checked ~ .radio {
  background-color: black;
}
.tippy-box .tippy-content .radiocontainer:hover .radio {
  border-color: black;
}
.tippy-box .tippy-content .radiocontainer:hover svg {
  opacity: 1;
}
.tippy-box[data-theme~=transparent] {
  background: transparent;
}
.tippy-box[data-theme~=transparent] .tippy-content {
  background: transparent;
  border: none;
  padding: 0;
  overflow: hidden;
}
.tippy-box[data-theme~=dark] .tippy-content {
  color: white;
  background: rgba(32, 27, 35, 0.925);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.tippy-box[data-placement=top-start] .tippy-content, .tippy-box[data-placement=right-end] .tippy-content {
  border-bottom-left-radius: 0;
}
.tippy-box[data-placement=top-end] .tippy-content, .tippy-box[data-placement=left-end] .tippy-content {
  border-bottom-right-radius: 0;
}
.tippy-box[data-placement=right-start] .tippy-content, .tippy-box[data-placement=bottom-start] .tippy-content {
  border-top-left-radius: 0;
}
.tippy-box[data-placement=bottom-end] .tippy-content, .tippy-box[data-placement=left-start] .tippy-content {
  border-top-right-radius: 0;
}

.tippy-box[data-animation=shift-toward-extreme][data-state=hidden] {
  opacity: 0;
}

.tippy-box[data-animation=shift-toward-extreme][data-state=hidden][data-placement^=top] {
  transform: translateY(-10px);
}

.tippy-box[data-animation=shift-toward-extreme][data-state=hidden][data-placement^=bottom] {
  transform: translateY(10px);
}

.tippy-box[data-animation=shift-toward-extreme][data-state=hidden][data-placement^=left] {
  transform: translateX(-10px);
}

.tippy-box[data-animation=shift-toward-extreme][data-state=hidden][data-placement^=right] {
  transform: translateX(10px);
}

.expand-colorpicker-content .name {
  text-align: left;
}
.expand-colorpicker-content .preview {
  width: 22em;
  height: 4em;
  margin: 0.5em -1em 0em;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  text-align: center;
}
.expand-colorpicker-content .preview:after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.01) 61.33%, rgba(255, 255, 255, 0.01) 61.72%, rgba(0, 0, 0, 0.01) 63.07%, rgba(255, 255, 255, 0) 63.4%, rgba(0, 0, 0, 0.02) 64.86%, rgba(255, 255, 255, 0) 64.9%, rgba(0, 0, 0, 0.04) 66.39%, rgba(255, 255, 255, 0.04) 66.56%, rgba(0, 0, 0, 0.07) 67.83%, rgba(255, 255, 255, 0.1) 67.99%, rgba(0, 0, 0, 0.09) 69.34%, rgba(255, 255, 255, 0.13) 69.51%, rgba(0, 0, 0, 0.1) 70.94%, rgba(255, 255, 255, 0.17) 71.04%, rgba(0, 0, 0, 0.08) 72.44%, rgba(255, 255, 255, 0.18) 72.56%, rgba(0, 0, 0, 0.07) 73.94%, rgba(255, 255, 255, 0.19) 74.17%, rgba(255, 255, 255, 0.07) 76.12%, rgba(0, 0, 0, 0.21) 76.21%, rgba(0, 0, 0, 0.1) 77.16%, rgba(255, 255, 255, 0.04) 79.56%, rgba(255, 255, 255, 0.14) 82.61%, rgba(255, 255, 255, 0.29) 86.09%, rgba(255, 255, 255, 0.35) 88.23%, rgba(255, 255, 255, 0.34) 89.47%, rgba(255, 255, 255, 0.17) 91.72%, rgba(0, 0, 0, 0.03) 93.7%, rgba(0, 0, 0, 0.18) 97.2%, rgba(0, 0, 0, 0.37) 100%);
  mix-blend-mode: hard-light;
}
.expand-colorpicker-content .preview.BR:after {
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.37) 0%, rgba(0, 0, 0, 0.18) 1.02%, rgba(0, 0, 0, 0.14) 3.91%, rgba(0, 0, 0, 0.09) 8.93%, rgba(0, 0, 0, 0.02) 11.7%, rgba(255, 255, 255, 0.29) 12.6%, rgba(255, 255, 255, 0.17) 14.65%, rgba(255, 255, 255, 0.08) 14.95%, rgba(255, 255, 255, 0.05) 95.46%, rgba(0, 0, 0, 0.16) 100%);
}
.expand-colorpicker-content .preview.L:after {
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.37) 0%, rgba(0, 0, 0, 0.12) 1.02%, rgba(0, 0, 0, 0.04) 11.96%, rgba(255, 255, 255, 0.08) 14.87%, rgba(255, 255, 255, 0.22) 18.23%, rgba(0, 0, 0, 0.19) 23.43%, rgba(255, 255, 255, 0.08) 23.63%, rgba(255, 255, 255, 0.06) 75.56%, rgba(255, 255, 255, 0.2) 80.52%, rgba(0, 0, 0, 0.06) 84.72%, rgba(0, 0, 0, 0.06) 88%, rgba(255, 255, 255, 0.05) 89.63%, rgba(255, 255, 255, 0.2) 91.9%, rgba(0, 0, 0, 0.26) 100%);
}
.expand-colorpicker-content .preview.C:after {
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.11) 0%, rgba(255, 255, 255, 0.69) 0.43%, rgba(255, 255, 255, 0.3) 1.35%, rgba(220, 220, 220, 0.15) 2.67%, rgba(255, 255, 255, 0.11) 27.97%, rgba(69, 69, 69, 0.35) 33.13%, rgba(0, 0, 0, 0.44) 33.63%, rgba(0, 0, 0, 0.41) 51.17%, rgba(0, 0, 0, 0.48) 51.52%, rgba(0, 0, 0, 0.43) 53.03%, rgba(0, 0, 0, 0.37) 53.72%, rgba(0, 0, 0, 0.32) 69.78%, rgba(0, 0, 0, 0.07) 69.86%, rgba(255, 255, 255, 0.35) 71.89%, rgba(255, 255, 255, 0) 76.67%, rgba(255, 255, 255, 0) 95.46%, rgba(0, 0, 0, 0.16) 100%);
}
.expand-colorpicker-content .preview.E:after {
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.11) 0%, rgba(255, 255, 255, 0.35) 0.82%, rgba(156, 156, 156, 0.38) 2.43%, rgba(255, 255, 255, 0.18) 17.95%, rgba(255, 255, 255, 0.25) 29.26%, rgba(68, 68, 68, 0.39) 35.39%, rgba(0, 0, 0, 0.44) 36%, rgba(0, 0, 0, 0.41) 49.34%, rgba(0, 0, 0, 0.48) 49.79%, rgba(0, 0, 0, 0.43) 50.98%, rgba(0, 0, 0, 0.38) 51.79%, rgba(0, 0, 0, 0.37) 57.31%, rgba(0, 0, 0, 0.32) 64.44%, rgba(0, 0, 0, 0.07) 64.82%, rgba(255, 255, 255, 0.35) 66.6%, rgba(255, 255, 255, 0) 74.06%, rgba(255, 255, 255, 0) 98.27%, rgba(0, 0, 0, 0.16) 100%);
}
.expand-colorpicker-content .preview.M:after {
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.11) 0%, rgba(255, 255, 255, 0.35) 0.38%, rgba(191, 191, 191, 0.53) 1.09%, rgba(232, 232, 232, 0.53) 27.78%, rgba(255, 255, 255, 0.18) 29.92%, rgba(255, 255, 255, 0.25) 40.23%, rgba(0, 0, 0, 0.44) 42.14%, rgba(0, 0, 0, 0.41) 49.51%, rgba(0, 0, 0, 0.48) 49.77%, rgba(0, 0, 0, 0.43) 50.55%, rgba(0, 0, 0, 0.38) 50.94%, rgba(0, 0, 0, 0.37) 57.31%, rgba(0, 0, 0, 0.32) 58.11%, rgba(0, 0, 0, 0.07) 58.32%, rgba(255, 255, 255, 0.21) 59.12%, rgba(255, 255, 255, 0.05) 61.89%, rgba(255, 255, 255, 0.07) 70.73%, rgba(0, 0, 0, 0.09) 71.44%, rgba(0, 0, 0, 0.12) 98.27%, rgba(0, 0, 0, 0.16) 100%);
}
.expand-colorpicker-content .preview.Q2:after {
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.11) 0%, rgba(255, 255, 255, 0.18) 0.07%, rgba(255, 255, 255, 0.43) 17.06%, rgba(255, 255, 255, 0.5) 26.47%, rgba(255, 255, 255, 0.51) 31.29%, rgba(255, 255, 255, 0.42) 35.68%, rgba(255, 255, 255, 0.25) 37.94%, rgba(0, 0, 0, 0.44) 40.06%, rgba(0, 0, 0, 0.41) 49.57%, rgba(0, 0, 0, 0.48) 50.09%, rgba(0, 0, 0, 0.43) 51.09%, rgba(0, 0, 0, 0.38) 51.74%, rgba(0, 0, 0, 0.37) 57.31%, rgba(0, 0, 0, 0.32) 59.87%, rgba(0, 0, 0, 0.07) 60.43%, rgba(255, 255, 255, 0.35) 61.48%, rgba(255, 255, 255, 0.08) 73.56%, rgba(0, 0, 0, 0.12) 87.76%, rgba(0, 0, 0, 0.31) 100%);
}
.expand-colorpicker-content .preview.D:after {
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.11) 0%, rgba(255, 255, 255, 0.58) 0.29%, rgba(255, 255, 255, 0.3) 0.98%, rgba(255, 255, 255, 0.1) 1.31%, rgba(255, 255, 255, 0.11) 10.48%, rgba(0, 0, 0, 0.4) 12.8%, rgba(0, 0, 0, 0.35) 16.12%, rgba(0, 0, 0, 0.3) 19.41%, rgba(0, 0, 0, 0.42) 19.8%, rgba(0, 0, 0, 0.36) 20.64%, rgba(0, 0, 0, 0.3) 21.05%, rgba(0, 0, 0, 0.3) 27.56%, rgba(132, 132, 132, 0.34) 27.7%, rgba(255, 255, 255, 0.35) 28.48%, rgba(255, 255, 255, 0.1) 31.19%, rgba(255, 255, 255, 0.11) 42.86%, rgba(0, 0, 0, 0.38) 43.3%, rgba(0, 0, 0, 0.33) 48.6%, rgba(0, 0, 0, 0.3) 51.94%, rgba(0, 0, 0, 0.3) 58.41%, rgba(255, 255, 255, 0.35) 58.62%, rgba(255, 255, 255, 0.26) 59.51%, rgba(255, 255, 255, 0.1) 59.79%, rgba(255, 255, 255, 0.11) 71.51%, rgba(0, 0, 0, 0.4) 74.06%, rgba(0, 0, 0, 0.4) 76.54%, rgba(0, 0, 0, 0.3) 80.64%, rgba(0, 0, 0, 0.4) 80.96%, rgba(0, 0, 0, 0.36) 81.88%, rgba(0, 0, 0, 0.3) 82.36%, rgba(0, 0, 0, 0.3) 88.28%, rgba(255, 255, 255, 0) 88.36%, rgba(255, 255, 255, 0.35) 89.19%, rgba(255, 255, 255, 0.05) 91.16%, rgba(255, 255, 255, 0.05) 98.35%, rgba(0, 0, 0, 0.31) 100%);
}
.expand-colorpicker-content .preview.PC2:after, .expand-colorpicker-content .preview.PC4:after, .expand-colorpicker-content .preview.PL:after {
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.11) 0%, rgba(255, 255, 255, 0.57) 0.23%, rgba(255, 255, 255, 0.25) 2.27%, rgba(173, 173, 173, 0.34) 2.74%, rgba(255, 255, 255, 0.12) 31.86%, rgba(255, 255, 255, 0.19) 37.15%, rgba(0, 0, 0, 0.44) 40.09%, rgba(0, 0, 0, 0.41) 46.43%, rgba(0, 0, 0, 0.38) 52.47%, rgba(0, 0, 0, 0.37) 57.31%, rgba(0, 0, 0, 0.32) 63.16%, rgba(0, 0, 0, 0.07) 63.34%, rgba(255, 255, 255, 0.35) 64.24%, rgba(255, 255, 255, 0.12) 69.47%, rgba(255, 255, 255, 0.07) 95.46%, rgba(104, 104, 104, 0.26) 96.19%, rgba(0, 0, 0, 0.16) 100%);
}
.expand-colorpicker-content .preview.PD6:after {
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(255, 255, 255, 0.69) 0.68%, rgba(255, 255, 255, 0.16) 2.01%, rgba(255, 255, 255, 0.15) 11.95%, rgba(255, 255, 255, 0.11) 17.08%, rgba(0, 0, 0, 0.4) 18.94%, rgba(0, 0, 0, 0.4) 20.62%, rgba(0, 0, 0, 0.35) 22.45%, rgba(0, 0, 0, 0.3) 25.92%, rgba(0, 0, 0, 0.3) 32.01%, rgba(255, 255, 255, 0.35) 32.39%, rgba(255, 255, 255, 0.03) 34.7%, rgba(255, 255, 255, 0.09) 66.99%, rgba(0, 0, 0, 0.4) 69.24%, rgba(0, 0, 0, 0.4) 71.02%, rgba(0, 0, 0, 0.35) 73.71%, rgba(0, 0, 0, 0.3) 76.2%, rgba(0, 0, 0, 0.3) 82.31%, rgba(0, 0, 0, 0.07) 82.39%, rgba(255, 255, 255, 0.35) 83.01%, rgba(255, 255, 255, 0.1) 84.64%, rgba(255, 255, 255, 0.09) 95.46%, rgba(0, 0, 0, 0.28) 100%);
}
.expand-colorpicker-content .palette {
  width: 22em;
  overflow-x: scroll;
  margin-right: -1em;
  margin-left: -1em;
  margin-bottom: 1em;
  text-align: left;
  z-index: 3;
}
.expand-colorpicker-content .palette::-webkit-scrollbar {
  width: 0.5em;
  height: 0.5em;
}
.expand-colorpicker-content .palette::-webkit-scrollbar-track {
  border-radius: 0.25em;
  box-shadow: inset 0 0 4em 4em rgba(32, 27, 35, 0.2);
  border-top: 0.225em solid transparent;
  border-bottom: 0.225em solid transparent;
}
.expand-colorpicker-content .palette::-webkit-scrollbar-thumb {
  border-radius: 25em;
  -webkit-border-radius: 25em;
  border-left: 1em solid transparent;
  border-right: 1em solid transparent;
  box-shadow: inset 0 0 4em 4em rgba(32, 27, 35, 0.25);
  -webkit-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
.expand-colorpicker-content .palette::-webkit-scrollbar-thumb:hover {
  border-top: 0em solid transparent;
  border-bottom: 0em solid transparent;
  box-shadow: inset 0 0 4em 4em rgba(32, 27, 35, 0.75);
  -webkit-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
.expand-colorpicker-content .palette::-webkit-scrollbar-thumb:active {
  box-shadow: inset 0 0 4em 4em white;
  -webkit-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
.expand-colorpicker-content .palette .palette-content {
  padding: 1em 1em 1em;
  display: grid;
  width: fit-content;
  grid-auto-flow: column dense;
  grid-template-rows: 1fr 1fr;
  grid-auto-columns: 1fr;
  grid-gap: 6px 5px;
}
.expand-colorpicker-content .palette .palette-content .swatch {
  position: relative;
  width: 28px;
  height: 20px;
  border-radius: 12px;
  border: 1px solid rgba(0, 0, 0, 0.2);
  cursor: pointer;
  box-sizing: content-box;
}
.expand-colorpicker-content .palette .palette-content .swatch.sep {
  background-color: transparent;
  pointer-events: none;
  border: none;
  margin-right: 24px;
}
.expand-colorpicker-content .palette .palette-content .swatch.sep:after {
  content: "";
  position: absolute;
  right: -15px;
  height: 230%;
  bottom: 0;
  border-right: 1px solid rgba(32, 27, 35, 0.2);
}
.expand-colorpicker-content .palette .palette-content .swatch.active:before {
  content: "";
  display: inline-block;
  position: absolute;
  width: 28px;
  height: 20px;
  top: -2px;
  left: -2px;
  border: 2px solid rgb(0, 0, 0);
  border-radius: 12px;
}
.expand-colorpicker-content .inputs {
  width: 20em;
  margin-bottom: 0.25em;
  display: grid;
  grid-template-columns: 1fr;
  grid-gap: 1px;
}
.expand-colorpicker-content .inputs input[type=text] {
  font-family: monospace;
  font-size: 13px;
  color: #201B23 !important;
  width: 100%;
  height: 30px;
  background: rgba(0, 0, 0, 0.075) !important;
  outline: none;
  border: none;
  border-radius: 15px;
  padding: 0 15px !important;
}
.expand-colorpicker-content .inputs input[type=text][name=hex] {
  position: absolute;
  width: 31%;
  right: 14px;
  margin: 3px;
  height: 24px;
  background: rgba(255, 255, 255, 0.5);
  padding: 0 0 0 2.2em !important;
  cursor: pointer;
}
.expand-colorpicker-content .inputs input[type=text][name=hex]:disabled {
  color: rgba(32, 27, 35, 0.5);
}
.expand-colorpicker-content .inputs input[type=text][name=hex]:disabled + .unit {
  color: rgba(32, 27, 35, 0.5);
}
.expand-colorpicker-content .inputs input[type=text]:hover {
  background: rgba(255, 255, 255, 0.6) !important;
}
.expand-colorpicker-content .inputs input[type=text]:focus {
  background: rgba(255, 255, 255, 0.75);
}
.expand-colorpicker-content .inputs [name=customColor] {
  position: absolute;
  width: 31%;
  right: 14px;
  margin: 3px;
  height: 24px;
  background: rgba(255, 255, 255, 0);
  padding: 0 0.75em;
  cursor: pointer;
  opacity: 0;
}
.expand-colorpicker-content .inputs:after {
  content: "";
  position: absolute;
  right: 84px;
  margin-top: 4px;
  width: 21px;
  height: 21px;
  border: none;
  background: transparent;
  pointer-events: none;
}

#snapViews {
  position: absolute;
  z-index: 3;
  bottom: 20%;
  left: 3em;
}

.snap-view {
  display: inline-block;
  text-align: center;
  background: rgba(0, 0, 0, 0.6);
  padding: 0.5em 0.75em;
  margin: 0.5em 0.75em 0 0;
  border-radius: 2px;
  cursor: pointer;
  font-size: 11px;
  color: rgba(255, 255, 255, 0.75);
}
.snap-view:hover {
  color: rgb(255, 255, 255);
}

.saveConfigurations .scrollconfigs {
  display: block;
  position: relative;
  max-width: 420px;
  margin-left: auto;
  margin-right: 0;
  overflow: visible;
  -ms-overflow-style: none; /* IE and Edge */
  scrollbar-width: none; /* Firefox */
}
.saveConfigurations .scrollconfigs::-webkit-scrollbar {
  display: none;
}
.saveConfigurations .config {
  display: inline-block;
  position: relative;
  text-align: right;
  font-size: 0.75em;
  padding: 0.5em 0.75em;
  border-radius: 4px;
  margin: 1em 0 0 1em;
  border: 1px solid rgba(32, 27, 35, 0.3);
  cursor: pointer;
  -webkit-transition: all 0.5s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.5s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.5s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.5s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.5s cubic-bezier(0.25, 1, 0.5, 1);
}
.saveConfigurations .config p {
  margin: 0;
  font-size: 1.25em;
  font-weight: 500;
  color: black;
}
.saveConfigurations .config .delete {
  opacity: 0;
  position: absolute;
  display: grid;
  justify-items: center;
  align-items: center;
  top: -0.6em;
  right: -0.6em;
  width: 1.5em;
  height: 1.5em;
  border-radius: 0.75em;
  color: rgba(255, 255, 255, 0.9);
  background: rgba(32, 27, 35, 0.8);
  text-decoration: none;
  font-size: 1.25em;
  font-weight: 500;
  cursor: pointer;
  -webkit-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
}
.saveConfigurations .config .delete:hover {
  color: white;
  background: #201b23;
  -webkit-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
}
.saveConfigurations .config:hover {
  background: rgba(255, 255, 255, 0.75);
  -webkit-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
}
.saveConfigurations .config:hover .delete {
  opacity: 1;
  -webkit-transition: opacity 0.5s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: opacity 0.5s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: opacity 0.5s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: opacity 0.5s cubic-bezier(0.25, 1, 0.5, 1);
  transition: opacity 0.5s cubic-bezier(0.25, 1, 0.5, 1);
}
.saveConfigurations .saveThis {
  display: inline-grid;
  position: relative;
  grid-template-columns: auto 1fr;
  justify-items: stretch;
  align-items: center;
  vertical-align: middle;
  cursor: pointer;
  background: rgba(32, 27, 35, 0.9);
  color: rgba(255, 255, 255, 0.85);
  padding: 0.25em 0.8em 0.25em 0.25em;
  border-radius: 1em;
  font-size: 0.9em;
  font-weight: 400;
  line-height: 1em;
  min-height: 30px;
  text-decoration: none;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  user-select: none;
  -webkit-user-select: none; /* Safari fallback only */
  -webkit-user-select: none; /* Chrome/Safari */
  -moz-user-select: none; /* Firefox */
  -ms-user-select: none; /* IE10+ */
}
.saveConfigurations .saveThis .btn {
  display: inline-grid;
  position: relative;
  font-size: 1.5em;
  width: 1em;
  height: 1em;
  justify-items: center;
  align-items: center;
  font-size: 1.5em;
  background: rgba(253, 207, 11, 0.8);
  color: #201B23;
  border-radius: 1em;
  padding: 0.15em 0.15em;
  margin-right: 0.25em;
  vertical-align: top;
}
.saveConfigurations .saveThis:hover {
  color: rgba(255, 255, 255, 0.9);
}
.saveConfigurations .saveThis.nobg {
  padding-right: 0.5em;
  background: transparent;
  color: rgba(32, 27, 35, 0.6);
  font-weight: 500;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.saveConfigurations .saveThis.nobg:hover {
  color: #201b23;
}

table {
  text-align: left;
}
table th {
  text-align: right;
  font-size: 70%;
  padding: 0.5em 0.5em 0.5em 1em;
  border: 1px solid rgba(0, 0, 0, 0.5);
  background: rgba(0, 0, 0, 0.1);
}
table td {
  vertical-align: top;
  padding-right: 2em;
  padding-bottom: 1em;
}
table ul {
  padding: 0 0 0 1em;
  margin: 0;
}

table#results, table#stats {
  font-family: monospace;
  display: block;
  font-size: 1.1em;
  text-align: right;
  color: #201B23;
  font-weight: 500;
  margin: 0;
  border-collapse: collapse;
  pointer-events: auto;
  user-select: auto;
  -webkit-user-select: auto; /* Safari fallback only */
  -webkit-user-select: auto; /* Chrome/Safari */
  -moz-user-select: auto; /* Firefox */
  -ms-user-select: auto; /* IE10+ */
}
table#results td, table#stats td {
  padding: 0.2em 0.5em 0.2em 0.75em;
  border: 1px solid rgba(32, 27, 35, 0.3);
  -webkit-transition: all 0.5s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.5s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.5s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.5s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.5s cubic-bezier(0.25, 1, 0.5, 1);
  -webkit-user-select: text;
  -khtml-user-select: text;
  -moz-user-select: text;
  -o-user-select: text;
  user-select: text;
}
table#results td:nth-child(4), table#stats td:nth-child(4) {
  text-align: left;
}

table#stats td {
  font-size: 90%;
}

#table-container {
  display: grid;
  justify-items: end;
  gap: 1em;
  position: relative;
  padding: 0;
  overflow: hidden;
}
#table-container.minimize {
  max-height: 24px;
  -webkit-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
}
#table-container.hidden {
  opacity: 0;
  max-height: 0px;
  pointer-events: none;
  position: absolute;
  margin: 0;
}

#toggleBOM {
  display: flex;
  justify-content: right;
  align-items: center;
  margin-right: 0.5em;
  margin-bottom: 0.25em;
  color: #201B23;
  font-size: 0.9em;
  vertical-align: middle;
  cursor: pointer;
}
#toggleBOM.hidden {
  opacity: 0;
  pointer-events: none;
}

#privateMode {
  display: inline-block;
  position: relative;
  cursor: pointer;
  margin: 0.3em 0 0 0.5em;
  opacity: 0.25;
  visibility: hidden;
  -webkit-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
#privateMode:hover {
  opacity: 0.5;
  -webkit-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
}

#togglePrice {
  display: inline-block;
}
#togglePrice:hover #privateMode {
  opacity: 0.5;
  -webkit-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
}

#loadConfigs {
  position: absolute;
  left: 0;
  bottom: 0;
  opacity: 0;
  cursor: pointer;
  width: 100%;
  height: 100%;
  z-index: 1;
}

#togglePrice {
  cursor: pointer;
  display: flex;
  position: relative;
  width: fit-content;
  align-items: center;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  background: rgba(0, 0, 0, 0.25);
  color: rgba(255, 255, 255, 0.75);
  padding: 0 1em 0 1em;
  margin-left: -0.5em;
  border: 1px solid transparent;
  border-radius: 2em;
  font-size: 0.9em;
  font-weight: 400;
  min-height: 30px;
  text-decoration: none;
  user-select: none;
  -webkit-user-select: none; /* Safari fallback only */
  -webkit-user-select: none; /* Chrome/Safari */
  -moz-user-select: none; /* Firefox */
  -ms-user-select: none; /* IE10+ */
  -webkit-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
}
#togglePrice:hover {
  background: black;
  color: rgba(255, 255, 255, 0.85);
  border-color: rgba(235, 236, 234, 0.5);
  -webkit-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
}
#togglePrice.active {
  margin-left: -1em;
  background: transparent;
  font-size: 1em;
  -webkit-transition: all 0s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0s cubic-bezier(0.25, 1, 0.5, 1);
}
#togglePrice.active #privateMode {
  margin-top: 1.7em;
}
#togglePrice.active:hover {
  border-color: rgba(235, 236, 234, 0);
  -webkit-transition: all 0s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0s cubic-bezier(0.25, 1, 0.5, 1);
}

#export-btn {
  border: 2px solid rgba(253, 207, 11, 0.125);
  background: transparent;
  padding: 0.25em 0.625em;
  color: #FDCF0B;
  cursor: default;
}
#export-btn svg > path {
  stroke: #EBECEA;
}
#export-btn:hover {
  border: 2px solid rgba(253, 207, 11, 0.5);
}
#export-btn:hover svg > path {
  stroke: white;
}

#export-content {
  list-style-type: none;
  margin: 0;
  padding: 0;
}
#export-content .ui-button {
  color: #201B23;
}
#export-content .ui-button:hover {
  color: black;
}

#price {
  display: inline-block;
  text-align: left;
  opacity: 1;
  -webkit-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
}
#price.hidden {
  opacity: 0;
  -webkit-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
}

.radio-ctrl {
  cursor: pointer;
  user-select: none;
  -webkit-user-select: none; /* Safari fallback only */
  -webkit-user-select: none; /* Chrome/Safari */
  -moz-user-select: none; /* Firefox */
  -ms-user-select: none; /* IE10+ */
}

#ft-toggle-fr-width, #ft-toggle-fr-height, #table-container, #toolpanel, #loadCSV, #addConfig, #configs {
  position: absolute;
  visibility: hidden;
}

dialog {
  background: rgba(32, 27, 35, 0.85);
  backdrop-filter: blur(10px);
  border: none;
  border-radius: 1em;
  color: #EBECEA;
  padding: 1.5em 2em 2em;
  width: 100%;
  max-width: 32em;
  z-index: 101;
}
dialog h2 {
  font-size: 1.325em;
  margin: 0 0 0.25em;
}
dialog p {
  font-size: 0.95em;
  color: rgba(235, 236, 234, 0.75);
}
dialog p strong {
  color: #ebecea;
}
dialog::backdrop {
  background: rgba(235, 236, 234, 0.75);
  backdrop-filter: blur(10px);
}
dialog .ui-button {
  vertical-align: baseline;
}
dialog .ui-button:last-of-type {
  float: right;
  margin: 0;
}
dialog .ui-button.alt svg {
  margin: 0 0.5em 0 -0.125em;
}
dialog .ui-button.alt svg > path {
  stroke: #EBECEA;
}
dialog .ui-button:not(.alt):hover {
  background: rgba(253, 207, 11, 0.95) !important;
}
dialog .ui-button.cta, dialog #configurator-inquiry .wFormContainer input.ui-button[type=submit], #configurator-inquiry .wFormContainer dialog input.ui-button[type=submit], dialog #configurator-feedback .gform_wrapper .ui-button.gform_button, #configurator-feedback .gform_wrapper dialog .ui-button.gform_button {
  background: rgba(253, 207, 11, 0.9);
}
dialog .ui-button.cta:hover, dialog #configurator-inquiry .wFormContainer input.ui-button[type=submit]:hover, #configurator-inquiry .wFormContainer dialog input.ui-button[type=submit]:hover, dialog #configurator-feedback .gform_wrapper .ui-button.gform_button:hover, #configurator-feedback .gform_wrapper dialog .ui-button.gform_button:hover {
  background: #fdcf0b;
}
dialog .inputbox {
  padding: 0.5em;
  border: 1px solid rgba(235, 236, 234, 0.25);
}
dialog .inputbox .ui-button.small {
  color: #141315;
  height: 30px;
  padding: 0 12px 1px;
  background: rgba(235, 236, 234, 0.75);
  position: relative;
}
dialog .inputbox .ui-button.small:hover {
  border-color: transparent !important;
}
dialog .inputbox:hover input:read-only {
  color: white;
  background: transparent !important;
}
dialog input[type=text]:read-only {
  width: 100%;
  margin-right: 0 !important;
  color: rgba(255, 255, 255, 0.75);
  padding: 0 0.5em 0 0.5em;
  mask-image: linear-gradient(90deg, #000, #000 85%, transparent 100%);
}
dialog input[type=text]:read-only:focus, dialog input[type=text]:read-only:hover {
  color: white;
  background: transparent !important;
}
dialog .dialog-section {
  display: block;
  position: relative;
  border-bottom: 1px solid rgba(235, 236, 234, 0.1);
  padding-bottom: 1em;
  margin-bottom: 2em;
}
dialog .dialog-section:last-of-type {
  margin-bottom: 1.5em;
}

#configurator-feedback {
  justify-items: end;
  gap: 1em;
  max-width: 50em;
  padding: 1em;
}
#configurator-feedback:modal {
  display: grid;
}
#configurator-feedback .gForm-container {
  background: white;
  overflow: scroll;
  max-height: calc(100vh - 10em);
  width: 100%;
  color: #201b23;
  padding: 1.5rem 5rem 4rem;
  border-radius: 0.2rem;
  line-height: 1.35;
}
#configurator-feedback .gForm-container h1 {
  font-family: "Avenir LT W01_95 Black1475556", "Avenir Black", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif !important;
}
#configurator-feedback .gForm-container h1:first-child {
  margin-bottom: 0;
}
#configurator-feedback .gForm-container h2 {
  margin-bottom: 1.5em;
  font-family: "Avenir LT W01_65 Medium1475532", "Avenir Medium", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif !important;
  font-weight: normal;
}
#configurator-feedback .gform_wrapper {
  background: white;
  border-radius: 4px;
  margin-top: 0;
}
#configurator-feedback .gform_wrapper .gform_fields {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  column-gap: 1.5em;
}
#configurator-feedback .gform_wrapper .gform-grid-row {
  display: flex;
  flex-flow: row wrap;
  gap: 1.5em;
}
#configurator-feedback .gform_wrapper .gform-grid-col.gform-grid-col--size-auto {
  flex: 1;
  inline-size: auto;
}
#configurator-feedback .gform_wrapper .ginput_complex legend {
  display: block;
}
#configurator-feedback .gform_wrapper .gform_required_legend {
  display: none;
}
#configurator-feedback .gform_wrapper fieldset {
  padding: 0;
  border: none;
}
#configurator-feedback .gform_wrapper fieldset legend {
  padding-inline: 0;
}
#configurator-feedback .gform_wrapper .gfield {
  margin: 0 0 2em;
  grid-column: span 12;
}
#configurator-feedback .gform_wrapper .gfield label {
  display: inline-block;
  color: #201b23;
  margin-bottom: 0.5rem;
  font-size: 1em;
  max-width: 34em;
}
#configurator-feedback .gform_wrapper .gfield--width-half {
  grid-column: span 6;
}
#configurator-feedback .gform_wrapper .gform-field-label--type-sub {
  opacity: 0.25;
  margin-bottom: 0 !important;
}
#configurator-feedback .gform_wrapper .gform_button {
  width: auto;
  background: rgba(253, 207, 11, 0.9);
}
#configurator-feedback .gform_wrapper .gform_button:hover {
  background: #fdcf0b !important;
  color: black;
  -webkit-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
}
#configurator-feedback .gform_wrapper input[type=checkbox] {
  min-width: 18px;
  min-height: 18px;
  width: 18px;
  height: 18px;
  margin: 0;
}
#configurator-feedback .gform_wrapper input[type=text], #configurator-feedback .gform_wrapper input[type=email], #configurator-feedback .gform_wrapper select, #configurator-feedback .gform_wrapper textarea, #configurator-feedback .gform_wrapper input[type=text].validate-email {
  width: 100%;
  color: #201b23;
  font-family: "Avenir LT W01_65 Medium1475532", "Avenir Medium", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif !important;
  font-size: 1.2rem !important;
  text-align: left;
  padding: 0rem 0.75rem !important;
  margin: 0;
  height: 2.25em !important;
  background-color: #F6F6F6;
  border: none;
  border-bottom: 1px solid #201b23;
  border-radius: 0;
  vertical-align: sub;
  outline: none;
}
#configurator-feedback .gform_wrapper input[type=text]:hover, #configurator-feedback .gform_wrapper input[type=text]:focus, #configurator-feedback .gform_wrapper input[type=email]:hover, #configurator-feedback .gform_wrapper input[type=email]:focus, #configurator-feedback .gform_wrapper select:hover, #configurator-feedback .gform_wrapper select:focus, #configurator-feedback .gform_wrapper textarea:hover, #configurator-feedback .gform_wrapper textarea:focus, #configurator-feedback .gform_wrapper input[type=text].validate-email:hover, #configurator-feedback .gform_wrapper input[type=text].validate-email:focus {
  font-size: 1.2rem !important;
  padding: 0rem 0.75rem !important;
  height: 2.25em !important;
  background-color: #F6F6F6 !important;
  border: none !important;
  border-bottom: 1px solid #201b23 !important;
}
#configurator-feedback .gform_wrapper .gform_button {
  font-size: 1.4em;
}
#configurator-feedback .gform_wrapper textarea {
  max-height: none;
  width: 100%;
  min-height: 6em;
  outline: none;
  padding-top: 0.25em !important;
}
#configurator-feedback .gform_wrapper textarea:hover, #configurator-feedback .gform_wrapper textarea:focus {
  padding-top: 0.25em !important;
}
#configurator-feedback .gform_wrapper .gform_required_legend {
  color: #201b23;
}
#configurator-feedback .gform_wrapper .gfield_required,
#configurator-feedback .gform_wrapper .gfield_required_asterisk {
  color: red;
}
#configurator-feedback .gform_wrapper .gform_validation_container {
  display: none !important;
  left: -9000px;
  position: absolute !important;
}
#configurator-feedback .error {
  color: red;
}

#configurator-inquiry {
  justify-items: end;
  gap: 1em;
  max-width: 50em;
  padding: 1em;
}
#configurator-inquiry:modal {
  display: grid;
}
#configurator-inquiry .wFormContainer {
  border-radius: 4px;
}
#configurator-inquiry .wFormContainer .htmlSection, #configurator-inquiry .wFormContainer .htmlContent, #configurator-inquiry .wFormContainer .section, #configurator-inquiry .wFormContainer .section + .section, #configurator-inquiry .wFormContainer .oneField {
  font-family: "Avenir LT W01_65 Medium1475532", "Avenir Medium", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif !important;
  padding: 0;
  margin: 0;
  border: none;
  overflow: visible;
}
#configurator-inquiry .wFormContainer .wFormHeader {
  height: auto;
  margin: 0;
}
#configurator-inquiry .wFormContainer .wForm {
  margin-top: 0;
}
#configurator-inquiry .wFormContainer .wForm form {
  padding: 1rem 5rem 2rem;
}
#configurator-inquiry .wFormContainer .wForm form .oneChoice {
  display: flex;
  align-items: self-start;
  gap: 0.5em;
  margin: 0;
}
#configurator-inquiry .wFormContainer .wForm input[type=checkbox] {
  min-width: 18px;
  min-height: 18px;
  width: 18px;
  height: 18px;
  margin: 0;
}
#configurator-inquiry .wFormContainer .wForm h2, #configurator-inquiry .wFormContainer .wForm h4:not(.wFormTitle) {
  font-family: "Avenir LT W01_95 Black1475556", "Avenir Black", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif !important;
  margin: 1em 0 0;
  font-size: 2rem;
  font-weight: normal;
  max-width: 25rem;
  line-height: 1.2;
}
#configurator-inquiry .wFormContainer .wForm .inputWrapper {
  width: 100%;
}
#configurator-inquiry .wFormContainer .wForm .actions {
  border: none;
  margin: 1em 0;
}
#configurator-inquiry .wFormContainer .wForm .duplicateLink {
  color: #3382de;
  font-size: 1rem;
}
#configurator-inquiry .wFormContainer .wForm .duplicateLink:before {
  content: "+ ";
}
#configurator-inquiry .wFormContainer .wForm .removeSpan {
  float: right;
  width: fit-content;
}
#configurator-inquiry .wFormContainer .wForm .removeSpan .removeLink {
  font-size: 1rem;
  vertical-align: top;
}
#configurator-inquiry .wFormContainer .wFormFooter, #configurator-inquiry .wFormContainer .supportInfo, #configurator-inquiry .wFormContainer #tfa_2204-L {
  display: none;
}
#configurator-inquiry .wFormContainer .section.inline {
  margin: 1.25em 0;
}
#configurator-inquiry .wFormContainer .section.inline .oneField {
  width: calc(33.33% - 0.75rem);
}
#configurator-inquiry .wFormContainer .section.inline #tfa_3118-D, #configurator-inquiry .wFormContainer .section.inline #tfa_3132-D, #configurator-inquiry .wFormContainer .section.inline #tfa_1872-D, #configurator-inquiry .wFormContainer .section.inline #tfa_1874-D {
  width: calc(50% - 0.75rem);
}
#configurator-inquiry .wFormContainer #tfa_2190 {
  width: 100% !important;
  min-height: 15rem;
}
#configurator-inquiry .wFormContainer .field-container-D.repeat, #configurator-inquiry .wFormContainer .field-container-D.removeable {
  margin: 1em 0 0.5em;
  background: #F6F6F6;
  padding: 0.5em 0.75em;
  border: 1px solid #F0F0F0;
  border-radius: 4px;
}
#configurator-inquiry .wFormContainer #tfa_2188-HTML h4:after {
  content: "Note: Your Rakks configuration will be attached to the inquiry.";
  display: block;
  font-family: "Avenir LT W01_65 Medium1475532", "Avenir Medium", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif !important;
  font-size: 21px;
  line-height: 1.5;
  margin: 0.5em 0;
  width: 600px;
}
#configurator-inquiry .wFormContainer .labelsHidden .preField {
  visibility: hidden;
  position: absolute;
  pointer-events: none;
  top: 0;
}
#configurator-inquiry .wFormContainer .label {
  font-size: 1rem;
}
#configurator-inquiry .wFormContainer input[type=submit] {
  width: auto;
  background: rgba(253, 207, 11, 0.9);
}
#configurator-inquiry .wFormContainer input[type=submit]:hover {
  background: #fdcf0b !important;
  color: black;
  -webkit-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
}
#configurator-inquiry .wFormContainer input[type=text], #configurator-inquiry .wFormContainer select, #configurator-inquiry .wFormContainer textarea, #configurator-inquiry .wFormContainer input[type=text].validate-email {
  font-family: "Avenir LT W01_65 Medium1475532", "Avenir Medium", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif !important;
  font-size: 1.2rem !important;
  padding: 0rem 0.75rem !important;
  height: 2.25em !important;
  background-color: #F6F6F6;
  border: none;
  border-bottom: 1px solid #201b23;
  vertical-align: sub;
}
#configurator-inquiry .wFormContainer input[type=text]:hover, #configurator-inquiry .wFormContainer input[type=text]:focus, #configurator-inquiry .wFormContainer select:hover, #configurator-inquiry .wFormContainer select:focus, #configurator-inquiry .wFormContainer textarea:hover, #configurator-inquiry .wFormContainer textarea:focus, #configurator-inquiry .wFormContainer input[type=text].validate-email:hover, #configurator-inquiry .wFormContainer input[type=text].validate-email:focus {
  font-size: 1.2rem !important;
  padding: 0rem 0.75rem !important;
  height: 2.25em !important;
  background-color: #F6F6F6 !important;
  border: none !important;
  border-bottom: 1px solid #201b23 !important;
}
#configurator-inquiry fieldset {
  border: none;
}
#configurator-inquiry .section + .section {
  margin-top: 1em;
}
#configurator-inquiry .section input {
  text-align: left;
}
#configurator-inquiry .section.inline {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
#configurator-inquiry .section.inline .oneField {
  width: 33.33%;
}

.dialog-message {
  display: block;
  text-align: right;
  font-size: 0.95em;
  color: rgba(235, 236, 234, 0.75);
  vertical-align: baseline;
  margin: 0em 0.25em 0.75em;
}

#private-project {
  padding: 2rem 2.5rem;
  margin: 0;
  color: white;
  font-size: 1.2em;
}
#private-project h2 {
  display: block;
}

@media screen and (max-width: 1023px) {
  #private-project h2 {
    display: none;
  }
}
#mobile-warning {
  display: none;
  visibility: hidden;
  padding: 2rem 2rem;
  margin: 0;
  background: white;
  font-size: 1em;
  width: 100%;
  z-index: 100;
}
#mobile-warning p {
  margin: 0 0 0.75em;
  color: #363B49;
}
#mobile-warning p sup {
  font-size: 7px;
}
#mobile-warning p:last-of-type {
  margin-bottom: 0;
}
#mobile-warning svg > path, #mobile-warning svg > rect {
  stroke: #363B49;
}

#dimensions-toggle {
  display: none;
  visibility: hidden;
  position: absolute;
}
#dimensions-toggle .ui-button.active {
  border: 2px solid rgba(0, 0, 0, 0.9);
}

@media screen and (max-width: 1023px), screen and (max-height: 599px) {
  #customize-ui, #bubble, #toolpanel, #helpers-content, #views-content, #salespanel, #devpanel, .scroll-container, #cookie-box {
    opacity: 0;
    visibility: hidden;
    width: 0;
    left: 0;
    overflow: hidden;
    pointer-events: none !important;
    user-select: none;
    -webkit-user-select: none; /* Safari fallback only */
    -webkit-user-select: none; /* Chrome/Safari */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* IE10+ */
  }
  html, body {
    overflow-y: scroll;
  }
  #mobile-warning {
    display: flex;
    visibility: visible;
    position: relative;
    padding: 1.25rem 2rem 1rem;
    min-height: 180px;
    gap: 15px;
    z-index: 100;
  }
  #mobile-warning .screen-icon {
    display: inline-block;
    border-radius: 2px;
    padding: 0;
    margin: 0 0 0.5em 2px;
    color: white;
    vertical-align: top;
    width: 32px;
    height: fit-content;
    text-align: center;
  }
  #mobile-warning .screen-icon .resize {
    display: block;
  }
  #mobile-warning .screen-icon .rotate {
    display: none;
  }
  #dimensions-toggle {
    display: block;
    visibility: visible;
    right: 10px;
    bottom: 15px;
    z-index: 100;
  }
  #homepanel {
    padding: 0;
    top: 10px;
    left: 5px;
  }
  #viewport, #canvas-container {
    width: 100%;
    height: 100%;
  }
  #tmp-rotate-view {
    bottom: 15px;
    left: 13px;
    right: auto;
  }
  #configurator {
    width: 100vw;
    height: calc(100vh - 180px);
    height: calc(100dvh - 180px);
    min-height: 50vh;
    min-height: 50dvh;
    overflow-x: hidden;
    overflow-y: scroll;
    position: relative;
  }
}
@media screen and (max-width: 1023px) and (orientation: landscape), screen and (max-height: 599px) and (orientation: landscape) {
  #configurator {
    display: inline-block;
    width: calc(100vw - 250px);
    height: 100vh;
    height: 100dvh;
  }
  #mobile-warning {
    display: inline-block;
    position: absolute;
    width: 250px;
    height: 100%;
    left: calc(100vw - 250px);
  }
}
@media screen and (min-height: 1024px) and (orientation: portrait) {
  #mobile-warning .screen-icon .resize {
    display: none;
  }
  #mobile-warning .screen-icon .rotate {
    display: block;
  }
}
/* Text meant only for screen readers. */
.screen-reader-text {
  border: 0;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
  word-wrap: normal !important;
}