onfigr {
  display: block;
  height: 100%;
  width: 100%;
  position: relative;
  padding: 0;
  margin: 0;
  /* width */
  /* Track */
  /* Handle */
  /* Handle on hover */
  /* BA specific */
  /* stylelint-disable no-invalid-position-at-import-rule */
  /* stylelint-disable function-no-unknown */
  /* stylelint-disable scss/no-global-function-names */
  overflow: hidden;
  box-sizing: border-box;
  font-size: 16px;
  font-family: 'Poppins', sans-serif;
}
onfigr ::-webkit-scrollbar {
  width: 5px;
  height: 10px;
}
@media only screen and (max-width: 800px) {
  onfigr ::-webkit-scrollbar {
    width: 2px;
    height: 5px;
  }
}
onfigr ::-webkit-scrollbar-track {
  background: #ffffff;
  display: none;
  width: 5px;
}
@media only screen and (max-width: 800px) {
  onfigr ::-webkit-scrollbar-track {
    display: block;
  }
}
onfigr ::-webkit-scrollbar-thumb {
  background: #e4e4e4;
  border-radius: 5px;
}
onfigr ::-webkit-scrollbar-thumb:hover {
  background: #434343;
}
@supports not selector(::-webkit-scrollbar) {
  onfigr {
    scrollbar-width: thin;
    scrollbar-color: #e4e4e4 #ffffff;
  }
}
onfigr *,
onfigr *:before,
onfigr *:after {
  box-sizing: inherit;
}
onfigr body,
onfigr h1,
onfigr h2,
onfigr h3,
onfigr h4,
onfigr h5,
onfigr h6,
onfigr p,
onfigr span,
onfigr ol,
onfigr ul {
  -webkit-user-select: none;
  /* Safari */
  -moz-user-select: none;
  /* Firefox */
  -ms-user-select: none;
  /* IE10+/Edge */
  user-select: none;
  /* Standard */
  margin: 0;
  padding: 0;
  font-weight: normal;
}
onfigr ol,
onfigr ul {
  list-style: none;
}
onfigr img {
  max-width: 100%;
  height: auto;
}
onfigr svg {
  width: auto;
}
onfigr section {
  padding: 0;
}
onfigr .configuration__elements__components__filters {
  display: none;
  width: 100%;
  left: 0;
  margin: 0;
  padding: 0;
  background-color: #2dcc70;
  cursor: initial;
}
.vertical onfigr .configuration__elements__components__filters {
  display: none;
}
onfigr .fullscreen-button-holder {
  position: absolute;
  top: 35px;
  left: 35px;
  z-index: 3;
  -webkit-tap-highlight-color: transparent;
  cursor: pointer;
  display: block;
}
@media only screen and (max-width: 800px) {
  onfigr .fullscreen-button-holder {
    display: none;
  }
}
onfigr .fullscreen-button-open {
  position: relative;
  width: 30px;
  height: 30px;
  left: -15px;
  top: -15px;
  background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMy41NCIgaGVpZ2h0PSIzNC4yOSIgdmlld0JveD0iMCAwIDMzLjU0IDM0LjI5Ij4KICA8ZyBpZD0iR3JvdXBfMTEwOCIgZGF0YS1uYW1lPSJHcm91cCAxMTA4IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMTA1LjI1IC0zOC43NjQpIj4KICAgIDxnIGlkPSJHcm91cF85NDgiIGRhdGEtbmFtZT0iR3JvdXAgOTQ4IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxMjcuMzU1IDQwLjAxNCkiPgogICAgICA8bGluZSBpZD0iTGluZV8yMDkiIGRhdGEtbmFtZT0iTGluZSAyMDkiIHkxPSI5LjM4NSIgeDI9IjguMzQyIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwIDEuNTUpIiBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyLjUiLz4KICAgICAgPGxpbmUgaWQ9IkxpbmVfMjEwIiBkYXRhLW5hbWU9IkxpbmUgMjEwIiB4Mj0iNi40NDUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDMuNDQ2KSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZmZmIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS13aWR0aD0iMi41Ii8+CiAgICAgIDxsaW5lIGlkPSJMaW5lXzIxMSIgZGF0YS1uYW1lPSJMaW5lIDIxMSIgeDI9IjYuNDQ1IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxMC4xODUgMC4yOTMpIHJvdGF0ZSg5MCkiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2ZmZiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2Utd2lkdGg9IjIuNSIvPgogICAgPC9nPgogICAgPGcgaWQ9Ikdyb3VwXzk0OSIgZGF0YS1uYW1lPSJHcm91cCA5NDkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDExNi45MjggNzEuODAzKSByb3RhdGUoMTgwKSI+CiAgICAgIDxsaW5lIGlkPSJMaW5lXzIwOS0yIiBkYXRhLW5hbWU9IkxpbmUgMjA5IiB5MT0iOC44NzgiIHgyPSI4LjU4NSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMCAxLjU1KSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZmZmIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS13aWR0aD0iMi41Ii8+CiAgICAgIDxsaW5lIGlkPSJMaW5lXzIxMC0yIiBkYXRhLW5hbWU9IkxpbmUgMjEwIiB4Mj0iNi40NDUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDMuNjg5IDApIiBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyLjUiLz4KICAgICAgPGxpbmUgaWQ9IkxpbmVfMjExLTIiIGRhdGEtbmFtZT0iTGluZSAyMTEiIHgyPSI2LjQ0NSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTAuNDI4IDAuMjkzKSByb3RhdGUoOTApIiBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyLjUiLz4KICAgIDwvZz4KICAgIDxnIGlkPSJHcm91cF85NTAiIGRhdGEtbmFtZT0iR3JvdXAgOTUwIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxMjcuMzU1IDYxLjM3NikiPgogICAgICA8bGluZSBpZD0iTGluZV8yMDktMyIgZGF0YS1uYW1lPSJMaW5lIDIwOSIgeDI9IjguMzQyIiB5Mj0iOC44NzgiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAgMCkiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2ZmZiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2Utd2lkdGg9IjIuNSIvPgogICAgICA8bGluZSBpZD0iTGluZV8yMTAtMyIgZGF0YS1uYW1lPSJMaW5lIDIxMCIgeDI9IjYuNDQ1IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgzLjQ0NiAxMC40MjgpIiBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyLjUiLz4KICAgICAgPGxpbmUgaWQ9IkxpbmVfMjExLTMiIGRhdGEtbmFtZT0iTGluZSAyMTEiIHgyPSI2LjQ0NSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTAuMTg1IDEwLjEzNSkgcm90YXRlKC05MCkiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2ZmZiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2Utd2lkdGg9IjIuNSIvPgogICAgPC9nPgogICAgPGcgaWQ9Ikdyb3VwXzk1MSIgZGF0YS1uYW1lPSJHcm91cCA5NTEiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDExNi45MjggNTAuOTQ4KSByb3RhdGUoMTgwKSI+CiAgICAgIDxsaW5lIGlkPSJMaW5lXzIwOS00IiBkYXRhLW5hbWU9IkxpbmUgMjA5IiB4Mj0iOC41ODUiIHkyPSI5LjM4NSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMCAwKSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZmZmIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS13aWR0aD0iMi41Ii8+CiAgICAgIDxsaW5lIGlkPSJMaW5lXzIxMC00IiBkYXRhLW5hbWU9IkxpbmUgMjEwIiB4Mj0iNi40NDUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDMuNjg5IDEwLjkzNCkiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2ZmZiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2Utd2lkdGg9IjIuNSIvPgogICAgICA8bGluZSBpZD0iTGluZV8yMTEtNCIgZGF0YS1uYW1lPSJMaW5lIDIxMSIgeDI9IjYuNDQ1IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxMC40MjggMTAuNjQxKSByb3RhdGUoLTkwKSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZmZmIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS13aWR0aD0iMi41Ii8+CiAgICA8L2c+CiAgPC9nPgo8L3N2Zz4K');
  background-size: 30px 30px;
  display: none;
  transition: 10ms ease-in;
  -webkit-tap-highlight-color: transparent;
}
onfigr .fullscreen-button-open:hover {
  width: 34px;
  height: 34px;
  background-size: 34px 34px;
  left: -17px;
  top: -17px;
}
onfigr .fullscreen-button-open.active {
  display: block;
}
onfigr .fullscreen-button-close {
  position: relative;
  -webkit-tap-highlight-color: transparent;
  width: 30px;
  height: 30px;
  left: -15px;
  top: -15px;
  background-image: url('data:image/svg+xml;base64, PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMi4yMTEiIGhlaWdodD0iMzIuOTAzIiB2aWV3Qm94PSIwIDAgMzIuMjExIDMyLjkwMyI+CiAgPGcgaWQ9Ikdyb3VwXzExMDkiIGRhdGEtbmFtZT0iR3JvdXAgMTEwOSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTEwNC43MzMgLTM4LjI0OCkiPgogICAgPGcgaWQ9Ikdyb3VwXzk0OCIgZGF0YS1uYW1lPSJHcm91cCA5NDgiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEzNS4xNzcgNTAuMTE3KSByb3RhdGUoMTgwKSI+CiAgICAgIDxsaW5lIGlkPSJMaW5lXzIwOSIgZGF0YS1uYW1lPSJMaW5lIDIwOSIgeTE9IjguNjcxIiB4Mj0iNy43MDciIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAgMS40MzIpIiBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyLjUiLz4KICAgICAgPGxpbmUgaWQ9IkxpbmVfMjEwIiBkYXRhLW5hbWU9IkxpbmUgMjEwIiB4Mj0iNS45NTUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDMuMTg0KSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZmZmIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS13aWR0aD0iMi41Ii8+CiAgICAgIDxsaW5lIGlkPSJMaW5lXzIxMSIgZGF0YS1uYW1lPSJMaW5lIDIxMSIgeDI9IjUuOTU1IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg5LjQxIDAuMjcxKSByb3RhdGUoOTApIiBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyLjUiLz4KICAgIDwvZz4KICAgIDxnIGlkPSJHcm91cF85NDkiIGRhdGEtbmFtZT0iR3JvdXAgOTQ5IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxMDYuNSA1OS43NSkiPgogICAgICA8bGluZSBpZD0iTGluZV8yMDktMiIgZGF0YS1uYW1lPSJMaW5lIDIwOSIgeTE9IjguMjAyIiB4Mj0iNy45MzIiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAgMS40MzIpIiBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyLjUiLz4KICAgICAgPGxpbmUgaWQ9IkxpbmVfMjEwLTIiIGRhdGEtbmFtZT0iTGluZSAyMTAiIHgyPSI1Ljk1NSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMy40MDggMCkiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2ZmZiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2Utd2lkdGg9IjIuNSIvPgogICAgICA8bGluZSBpZD0iTGluZV8yMTEtMiIgZGF0YS1uYW1lPSJMaW5lIDIxMSIgeDI9IjUuOTU1IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg5LjYzNCAwLjI3MSkgcm90YXRlKDkwKSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZmZmIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS13aWR0aD0iMi41Ii8+CiAgICA8L2c+CiAgICA8ZyBpZD0iR3JvdXBfOTUwIiBkYXRhLW5hbWU9Ikdyb3VwIDk1MCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTM1LjE3NyA2OS4zODQpIHJvdGF0ZSgxODApIj4KICAgICAgPGxpbmUgaWQ9IkxpbmVfMjA5LTMiIGRhdGEtbmFtZT0iTGluZSAyMDkiIHgyPSI3LjcwNyIgeTI9IjguMjAzIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwIDApIiBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyLjUiLz4KICAgICAgPGxpbmUgaWQ9IkxpbmVfMjEwLTMiIGRhdGEtbmFtZT0iTGluZSAyMTAiIHgyPSI1Ljk1NSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMy4xODQgOS42MzQpIiBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyLjUiLz4KICAgICAgPGxpbmUgaWQ9IkxpbmVfMjExLTMiIGRhdGEtbmFtZT0iTGluZSAyMTEiIHgyPSI1Ljk1NSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoOS40MSA5LjM2NCkgcm90YXRlKC05MCkiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2ZmZiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2Utd2lkdGg9IjIuNSIvPgogICAgPC9nPgogICAgPGcgaWQ9Ikdyb3VwXzk1MSIgZGF0YS1uYW1lPSJHcm91cCA5NTEiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEwNi41IDQwLjAxNCkiPgogICAgICA8bGluZSBpZD0iTGluZV8yMDktNCIgZGF0YS1uYW1lPSJMaW5lIDIwOSIgeDI9IjcuOTMyIiB5Mj0iOC42NzEiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAgMCkiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2ZmZiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2Utd2lkdGg9IjIuNSIvPgogICAgICA8bGluZSBpZD0iTGluZV8yMTAtNCIgZGF0YS1uYW1lPSJMaW5lIDIxMCIgeDI9IjUuOTU1IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgzLjQwOCAxMC4xMDMpIiBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyLjUiLz4KICAgICAgPGxpbmUgaWQ9IkxpbmVfMjExLTQiIGRhdGEtbmFtZT0iTGluZSAyMTEiIHgyPSI1Ljk1NSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoOS42MzQgOS44MzIpIHJvdGF0ZSgtOTApIiBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyLjUiLz4KICAgIDwvZz4KICA8L2c+Cjwvc3ZnPgo=');
  background-size: 30px 30px;
  display: none;
  transition: 10ms ease-in;
}
onfigr .fullscreen-button-close:hover {
  width: 34px;
  height: 34px;
  background-size: 34px 34px;
  left: -17px;
  top: -17px;
}
onfigr .fullscreen-button-close.active {
  display: block;
}
onfigr .zoom-controller-holder {
  position: absolute;
  left: 20px;
  z-index: 3;
  display: initial;
}
@media only screen and (max-width: 800px), screen and (max-height: 550px) and (max-width: 1000px) and (orientation: landscape) {
  onfigr .zoom-controller-holder {
    display: none;
  }
}
onfigr .zoom-controller-out {
  position: absolute;
  top: 110px;
  width: 30px;
  height: 30px;
  cursor: pointer;
  background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyOC44MzgiIGhlaWdodD0iMjguODQiIHZpZXdCb3g9IjAgMCAyOC44MzggMjguODQiPgogIDxnIGlkPSJHcm91cF8xMTY5IiBkYXRhLW5hbWU9Ikdyb3VwIDExNjkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0xLjAwMiAtMS4wMDEpIj4KICAgIDxnIGlkPSJFbGxpcHNlXzMwIiBkYXRhLW5hbWU9IkVsbGlwc2UgMzAiPgogICAgICA8Y2lyY2xlIGlkPSJFbGxpcHNlXzMiIGRhdGEtbmFtZT0iRWxsaXBzZSAzIiBjeD0iOC41IiBjeT0iOC41IiByPSI4LjUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDYuMDA2IDUuODM1KSIgZmlsbD0ibm9uZSIvPgogICAgICA8Y2lyY2xlIGlkPSJFbGxpcHNlXzQiIGRhdGEtbmFtZT0iRWxsaXBzZSA0IiBjeD0iNy41IiBjeT0iNy41IiByPSI3LjUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDcuMDA2IDYuODM1KSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZmZmIiBzdHJva2Utd2lkdGg9IjIiLz4KICAgIDwvZz4KICAgIDxsaW5lIGlkPSJMaW5lXzMyMCIgZGF0YS1uYW1lPSJMaW5lIDMyMCIgeDI9IjYiIHkyPSI1IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxOS41MDYgMTkuMzM1KSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZmZmIiBzdHJva2Utd2lkdGg9IjIiLz4KICAgIDxnIGlkPSJHcm91cF8xMTYxIiBkYXRhLW5hbWU9Ikdyb3VwIDExNjEiPgogICAgICA8bGluZSBpZD0iTGluZV8zMDUiIGRhdGEtbmFtZT0iTGluZSAzMDUiIHgxPSI2IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxMS41MDcgMTQuMzM1KSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZmZmIiBzdHJva2Utd2lkdGg9IjIiLz4KICAgIDwvZz4KICAgIDxnIGlkPSJHcm91cF8xMTYyIiBkYXRhLW5hbWU9Ikdyb3VwIDExNjIiPgogICAgICA8cGF0aCBpZD0iVW5pb25fMTEiIGRhdGEtbmFtZT0iVW5pb24gMTEiIGQ9Ik0xLDFaIiBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS13aWR0aD0iMiIvPgogICAgICA8cGF0aCBpZD0iVW5pb25fMTQiIGRhdGEtbmFtZT0iVW5pb24gMTQiIGQ9Ik0xLDI5Ljg0WiIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZmZmIiBzdHJva2Utd2lkdGg9IjIiLz4KICAgICAgPHBhdGggaWQ9IlVuaW9uXzEyIiBkYXRhLW5hbWU9IlVuaW9uIDEyIiBkPSJNMjkuODQsMVoiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2ZmZiIgc3Ryb2tlLXdpZHRoPSIyIi8+CiAgICAgIDxwYXRoIGlkPSJVbmlvbl8xMyIgZGF0YS1uYW1lPSJVbmlvbiAxMyIgZD0iTTI5Ljg0LDI5Ljg0MVoiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2ZmZiIgc3Ryb2tlLXdpZHRoPSIyIi8+CiAgICA8L2c+CiAgPC9nPgo8L3N2Zz4K');
  background-size: 30px 30px;
}
onfigr .zoom-controller-in {
  position: absolute;
  top: 70px;
  width: 30px;
  height: 30px;
  cursor: pointer;
  background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyOC44MzgiIGhlaWdodD0iMjguODQiIHZpZXdCb3g9IjAgMCAyOC44MzggMjguODQiPgogIDxnIGlkPSJHcm91cF8xMTY4IiBkYXRhLW5hbWU9Ikdyb3VwIDExNjgiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0zNC4zMjQgLTAuODgxKSI+CiAgICA8ZyBpZD0iR3JvdXBfMTE1OCIgZGF0YS1uYW1lPSJHcm91cCAxMTU4Ij4KICAgICAgPGcgaWQ9IkVsbGlwc2VfMjQiIGRhdGEtbmFtZT0iRWxsaXBzZSAyNCI+CiAgICAgICAgPGNpcmNsZSBpZD0iRWxsaXBzZV8xIiBkYXRhLW5hbWU9IkVsbGlwc2UgMSIgY3g9IjguNSIgY3k9IjguNSIgcj0iOC41IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgzOS4zMjggNS43MTUpIiBmaWxsPSJub25lIi8+CiAgICAgICAgPGNpcmNsZSBpZD0iRWxsaXBzZV8yIiBkYXRhLW5hbWU9IkVsbGlwc2UgMiIgY3g9IjcuNSIgY3k9IjcuNSIgcj0iNy41IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg0MC4zMjggNi43MTUpIiBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS13aWR0aD0iMiIvPgogICAgICA8L2c+CiAgICAgIDxsaW5lIGlkPSJMaW5lXzMwNiIgZGF0YS1uYW1lPSJMaW5lIDMwNiIgeDI9IjYiIHkyPSI1IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg1Mi44MjggMTkuMjE1KSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZmZmIiBzdHJva2Utd2lkdGg9IjIiLz4KICAgIDwvZz4KICAgIDxnIGlkPSJHcm91cF8xMTU5IiBkYXRhLW5hbWU9Ikdyb3VwIDExNTkiPgogICAgICA8bGluZSBpZD0iTGluZV8zMDQiIGRhdGEtbmFtZT0iTGluZSAzMDQiIHkyPSI2LjkwNiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNDcuODggMTAuNzQzKSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZmZmIiBzdHJva2Utd2lkdGg9IjIiLz4KICAgICAgPGxpbmUgaWQ9IkxpbmVfMzA1IiBkYXRhLW5hbWU9IkxpbmUgMzA1IiB4MT0iNi45NzkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDQ0LjM5IDE0LjE5NikiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2ZmZiIgc3Ryb2tlLXdpZHRoPSIyIi8+CiAgICA8L2c+CiAgICA8ZyBpZD0iR3JvdXBfMTE2MCIgZGF0YS1uYW1lPSJHcm91cCAxMTYwIj4KICAgICAgPHBhdGggaWQ9IlVuaW9uXzExIiBkYXRhLW5hbWU9IlVuaW9uIDExIiBkPSJNMzQuMzI0Ljg4MVoiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2ZmZiIgc3Ryb2tlLXdpZHRoPSIyIi8+CiAgICAgIDxwYXRoIGlkPSJVbmlvbl8xNCIgZGF0YS1uYW1lPSJVbmlvbiAxNCIgZD0iTTM0LjMyNCwyOS43MloiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2ZmZiIgc3Ryb2tlLXdpZHRoPSIyIi8+CiAgICAgIDxwYXRoIGlkPSJVbmlvbl8xMiIgZGF0YS1uYW1lPSJVbmlvbiAxMiIgZD0iTTYzLjE2Mi44ODJaIiBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS13aWR0aD0iMiIvPgogICAgICA8cGF0aCBpZD0iVW5pb25fMTMiIGRhdGEtbmFtZT0iVW5pb24gMTMiIGQ9Ik02My4xNjIsMjkuNzIxWiIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZmZmIiBzdHJva2Utd2lkdGg9IjIiLz4KICAgIDwvZz4KICA8L2c+Cjwvc3ZnPgo=');
  background-size: 30px 30px;
}
onfigr .configurator__gesture-hinter {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background-color: rgba(0, 0, 0, 0.4);
  z-index: 3;
  -webkit-transition: opacity 0.3s ease-out;
  transition: opacity 0.3s ease-out;
  opacity: 1;
  pointer-events: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
@media only screen and (max-width: 800px) {
  onfigr .configurator__gesture-hinter {
    height: 400px;
  }
}
@media only screen and (max-width: 1180px), only screen and ( min-width: 768px ) and (max-width : 1024px) and ( orientation: portrait) {
  onfigr .configurator__gesture-hinter {
    padding-right: 190px;
  }
}
onfigr .configurator__gesture-hinter.configurator__gesture-hinter--hidden {
  opacity: 0;
}
onfigr .configurator__gesture-hinter p {
  vertical-align: middle;
  color: #fff;
  font-size: 4em;
  text-shadow: #000 2px 2px 1px;
  text-align: center;
  pointer-events: none;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
@media only screen and (max-width: 800px) {
  onfigr .configurator__gesture-hinter p {
    font-size: 2.2em;
  }
}
@media only screen and (max-width: 1180px), only screen and ( min-width: 768px ) and (max-width : 1024px) and ( orientation: portrait) {
  onfigr .configurator__gesture-hinter p {
    font-size: 3em;
  }
}
onfigr .configurator__hotspot-holder {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 3;
  pointer-events: none !important;
}
onfigr .configurator__hotspot-holder img {
  -webkit-tap-highlight-color: transparent;
  cursor: pointer;
}
onfigr .configurator__hotspot-holder img:hover {
  background-color: #00000045;
  border-radius: 50px;
}
onfigr .configurator__hotspot-holder .pano-hotspot {
  width: 35px !important;
  pointer-events: auto;
  cursor: pointer;
}
@media only screen and (max-width: 800px) {
  onfigr .configurator__hotspot-holder .pano-hotspot {
    display: none !important;
  }
}
onfigr .configurator__hotspot-holder .pano-hotspot.hidden {
  display: none !important;
}
onfigr .configurator__interaction-surface {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: auto;
}
@media only screen and (max-width: 800px) {
  onfigr .configurator__interaction-surface {
    height: 400px;
  }
}
onfigr .form-btn {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0.6rem 1rem;
  color: #ffffff;
  font-size: 1rem;
  font-weight: 500;
  border-radius: 5px;
  background-color: #434343;
  transition: background-color 150ms ease-in-out;
  cursor: pointer;
  -webkit-user-select: none;
  /* Safari */
  -moz-user-select: none;
  /* Firefox */
  -ms-user-select: none;
  /* IE10+/Edge */
  user-select: none;
  /* Standard */
}
onfigr .form-btn:hover {
  background-color: #000000;
}
onfigr .form-btn.cancel {
  color: #434343;
  background-color: #ffffff;
  border: 1px solid #e4e4e4;
}
onfigr .form-btn.cancel:hover {
  background-color: #f2f2f2;
}
onfigr .form-overlay {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0);
  transition: background-color 150ms ease-out;
}
onfigr .form-overlay.active {
  background-color: rgba(0, 0, 0, 0.7);
  transition: background-color 150ms ease-out;
}
onfigr .button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  background-color: #f1f1f1;
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-style: normal;
  padding: 10px 40px;
  border-radius: 5px;
  border: none;
  color: #151515;
  cursor: pointer;
}
onfigr .tab {
  width: 100%;
  padding: 5px;
  box-sizing: border-box;
  background-color: #f1f1f1;
  border-radius: 8px;
}
onfigr .tab.hidden {
  display: none;
}
onfigr .tab .tab-container {
  height: 30px;
  display: flex;
  width: 100%;
  position: relative;
}
onfigr .tab .tab-container .active-indicator {
  position: absolute;
  height: 100%;
  top: 0;
  z-index: 0;
  border-radius: 8px;
  box-shadow: 2px 1px 3px rgba(47, 47, 47, 0.3);
  background-color: #ffffff;
  will-change: left;
  transition: left 0.15s ease-in-out;
}
onfigr .tab .tab-container .tab-item {
  flex: 1;
  text-align: center;
  background-color: transparent;
  cursor: pointer;
  border-radius: 8px;
  padding: 8px;
  font-size: 12px;
  color: #151515;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
  z-index: 1;
  transition: all 0.3s ease-in-out;
}
onfigr .tab .tab-container .tab-item.hidden {
  display: none;
}
onfigr .tab .tab-container .tab-item.hidden {
  display: none;
}
onfigr .variants-tab {
  width: 100%;
  display: flex;
  align-items: center;
  flex-direction: column;
  padding: 5px 0px;
  border-radius: 10px;
  font-size: 12px;
}
onfigr .variants-tab .switch-container {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.8rem;
}
onfigr .variants-tab .switch-container .toggle-wrapper {
  display: flex;
  gap: 0.5rem;
  cursor: pointer;
}
onfigr .variants-tab .switch-container .switch-text {
  font-weight: bold;
}
onfigr .variants-tab .switch-container .switch-toggle {
  width: 35px;
  height: 20px;
  cursor: pointer;
  background-color: #585858;
  position: relative;
  border-radius: 9999px;
  will-change: background-color;
  transition: background-color 150ms ease-in-out;
}
onfigr .variants-tab .switch-container .switch-toggle::after {
  content: '';
  width: calc(20px - 3px);
  height: calc(20px - 3px);
  border-radius: 9999px;
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto 0;
  left: 1.5px;
  background-color: #ffffff;
  will-change: left, right;
  transition: left 0.15s ease-in-out;
}
onfigr .variants-tab .switch-container .switch-toggle.active {
  background-color: #45b83f;
}
onfigr .variants-tab .switch-container .switch-toggle.active::after {
  left: calc(100% - calc(20px - 3px) - 1.5px);
}
onfigr .variants-tab .tabs {
  display: flex;
  border: 1px solid #e1e2e9;
  border-radius: 8px;
  width: 100%;
  padding: 3px;
  box-sizing: border-box;
  background-color: #f1f1f1;
}
onfigr .variants-tab .tabs .tab-item.button {
  padding: 8px 15px;
  background-color: transparent;
  font-size: 12px;
  flex: 1;
  color: #151515;
  will-change: transparent;
  transition: background-color 150ms ease-in-out;
}
onfigr .variants-tab .tabs .tab-item.button:disabled {
  color: rgba(21, 21, 21, 0.5);
}
onfigr .variants-tab .tabs .tab-item.button.active {
  background-color: #ffffff;
  box-shadow: 1px 1px 3px rgba(47, 47, 47, 0.3);
}
onfigr .variants-tab .tabs .tab-item.button.active:disabled {
  background-color: rgba(255, 255, 255, 0.5);
  color: rgba(21, 21, 21, 0.5);
}
onfigr .drop-down {
  padding: 5px 10px;
  border: 1px solid #f1f1f1;
  border-radius: 10px;
  cursor: pointer;
  min-width: 150px;
  max-width: 150px;
}
onfigr .drop-down > select:focus {
  outline: #434343;
}
onfigr .drop-down.long {
  margin-top: 2rem;
  max-width: 100%;
}
onfigr .drop-down select {
  width: 100%;
  border: none;
  cursor: pointer;
  background-color: #ffffff;
  color: #151515;
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-style: normal;
}
onfigr .drop-down select:focus {
  outline: none;
}
onfigr .drop-down select [aria-hidden='true'] {
  margin-right: 1.5rem;
}
onfigr .option-switch {
  margin-top: 1rem;
  height: 60px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  background-color: #f1f1f1;
  border-radius: 5px;
}
@media only screen and (max-width: 800px) {
  onfigr .option-switch {
    display: none;
  }
}
onfigr .option-switch .option-switch-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
onfigr .option-switch .switch {
  display: flex;
  align-items: center;
  gap: 5px;
}
onfigr .option-switch .switch .switch-toggle {
  width: 35px;
  height: 20px;
  cursor: pointer;
  background-color: #585858;
  position: relative;
  border-radius: 9999px;
  will-change: background-color;
  transition: background-color 150ms ease-in-out;
}
onfigr .option-switch .switch .switch-toggle::after {
  content: '';
  width: calc(20px - 3px);
  height: calc(20px - 3px);
  border-radius: 9999px;
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto 0;
  left: 1.5px;
  background-color: #ffffff;
  will-change: left, right;
  transition: left 0.15s ease-in-out;
}
onfigr .option-switch .switch .switch-toggle.active {
  background-color: #45b83f;
}
onfigr .option-switch .switch .switch-toggle.active::after {
  left: calc(100% - calc(20px - 3px) - 1.5px);
}
onfigr .switch-container {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.8rem;
  padding: 0 0.5rem;
}
onfigr .switch-container .toggle-wrapper {
  display: flex;
  gap: 0.5rem;
  cursor: pointer;
}
onfigr .switch-container .toggle-text {
  font-size: 12px;
  font-weight: 600;
}
onfigr .switch-container.disabled {
  cursor: not-allowed;
}
onfigr .switch-container .switch-toggle {
  width: 35px;
  height: 20px;
  cursor: pointer;
  background-color: #585858;
  position: relative;
  border-radius: 9999px;
  will-change: background-color;
  transition: background-color 150ms ease-in-out;
}
onfigr .switch-container .switch-toggle::after {
  content: '';
  width: calc(20px - 3px);
  height: calc(20px - 3px);
  border-radius: 9999px;
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto 0;
  left: 1.5px;
  background-color: #ffffff;
  will-change: left, right;
  transition: left 0.15s ease-in-out;
}
onfigr .switch-container .switch-toggle.active {
  background-color: #45b83f;
}
onfigr .switch-container .switch-toggle.active::after {
  left: calc(100% - calc(20px - 3px) - 1.5px);
}
onfigr .switch-container .switch-toggle.disabled {
  pointer-events: none;
}
onfigr .modal {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  pointer-events: none;
}
onfigr .modal .modal-overlay {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 10;
  opacity: 0;
  transition: opacity 0.15s;
}
onfigr .modal .modal-container {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  overflow-y: scroll;
  z-index: 20;
  padding: 4rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media only screen and (max-width: 800px) {
  onfigr .modal .modal-container {
    padding: 0;
    overflow: hidden;
  }
}
onfigr .modal .modal-content {
  background-color: #fff;
  border-radius: 10px;
  padding: 20px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
  max-width: 800px;
  width: 100%;
  margin: auto;
  transform: translateY(50px);
  opacity: 0;
  transition: transform 0.2s ease-in, opacity 0.2s ease-in;
}
@media only screen and (max-width: 800px) {
  onfigr .modal .modal-content {
    height: 100%;
    max-width: 100%;
    padding: 1rem;
    border-radius: 0;
  }
}
onfigr .modal.active {
  pointer-events: auto;
}
onfigr .modal.active .modal-overlay {
  opacity: 1;
}
onfigr .modal.active .modal-content {
  transform: translateY(0);
  opacity: 1;
}
onfigr .main-container {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background-color: rgba(21, 21, 21, 0.8);
  z-index: 5;
  pointer-events: auto;
  box-sizing: border-box;
  opacity: 1;
  will-change: opacity;
  transition: opacity 0.15s ease-in-out, z-index 0.15s ease-in-out;
}
onfigr .main-container.hide {
  opacity: 0;
  pointer-events: none;
  z-index: 0;
}
onfigr .main-container .welcome {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  width: 80%;
  max-width: 1200px;
  height: 80%;
  max-height: 700px;
  background-color: #fff;
  overflow: hidden;
  display: flex;
}
@media only screen and (max-width: 800px) {
  onfigr .main-container .welcome {
    flex-direction: column;
    max-width: 100%;
    max-height: auto;
    width: 100%;
    height: auto;
    top: unset;
    bottom: 0;
    border-radius: 10px 10px 0 0;
  }
}
onfigr .main-container .welcome .left-image-container {
  width: 100%;
  max-width: clamp(250px, 20vw, 350px);
  flex: clamp(250px, 200vw, 350px);
  height: 100%;
  position: relative;
}
onfigr .main-container .welcome .left-image-container::after {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  content: '';
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0.5) 10%, transparent, rgba(0, 0, 0, 0.5) 90%);
}
@media only screen and (max-width: 800px) {
  onfigr .main-container .welcome .left-image-container {
    display: none;
  }
}
onfigr .main-container .welcome .left-image-container .pano-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
onfigr .main-container .welcome .left-image-container .pano-image video {
  width: 100%;
  height: 100%;
}
onfigr .main-container .welcome .left-image-container .logo-text {
  display: flex;
  align-items: center;
  gap: 0.3rem;
  margin-top: auto;
  position: absolute;
  bottom: 1rem;
  left: 10%;
  z-index: 1;
}
@media only screen and (max-width: 800px) {
  onfigr .main-container .welcome .left-image-container .logo-text {
    display: none;
  }
}
onfigr .main-container .welcome .left-image-container .logo-text p {
  font-size: 0.75rem;
  color: #ffffff;
}
onfigr .main-container .welcome .left-image-container .logo-text .icon {
  height: 25px;
  color: #ffffff;
}
onfigr .main-container .welcome .left-image-container .logo-text .icon svg {
  width: 100%;
  height: 100%;
}
onfigr .main-container .welcome .left-image-container .text-container {
  position: absolute;
  width: 80%;
  left: 0;
  right: 0;
  margin: 0 auto;
  top: 10%;
  color: #ffffff;
  font-weight: 600;
  z-index: 1;
}
@media only screen and (max-width: 800px) {
  onfigr .main-container .welcome .left-image-container .text-container {
    bottom: 1rem;
    width: calc(100% - 1.5rem);
  }
}
onfigr .main-container .welcome .left-image-container .text-container p {
  font-size: clamp(20px, 5vw, 28px);
}
onfigr .main-container .welcome .left-image-container .text-container .tips {
  font-size: 14px;
  font-weight: 300;
}
onfigr .main-container .welcome .left-image-container .text-container .pano-welcome-text {
  color: #ffffff;
  text-shadow: 0 0 5px #f2f2f2;
}
onfigr .main-container .welcome .main {
  flex: 1;
  width: 100%;
  position: relative;
  margin: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 100%;
}
@media only screen and (max-width: 800px) {
  onfigr .main-container .welcome .main {
    margin: 0;
    height: 65%;
  }
}
onfigr .main-container .welcome .main .body {
  width: 100%;
  max-width: 800px;
  margin: 1rem auto;
  padding: 0 1rem;
  overflow-y: auto;
}
@media only screen and (max-width: 800px) {
  onfigr .main-container .welcome .main .body {
    padding-top: 1rem;
    padding-bottom: 3rem;
    margin: 0;
    height: calc(100% - 80px);
  }
}
onfigr .main-container .welcome .main .body .company-img-container {
  height: auto;
  max-width: fit-content;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 0.8rem;
  border: 1px solid #151515;
  border-radius: 5px;
}
onfigr .main-container .welcome .main .body .company-img-container.active {
  display: flex;
  border: none;
  max-width: 140px;
  padding: 0;
}
@media only screen and (max-width: 800px) {
  onfigr .main-container .welcome .main .body .company-img-container {
    display: none;
  }
}
onfigr .main-container .welcome .main .body .title {
  font-size: clamp(24px, 2.5vw, 30px);
  margin: 2rem 0;
}
@media only screen and (max-width: 800px) {
  onfigr .main-container .welcome .main .body .title {
    text-align: center;
    text-wrap: balance;
    margin: 0;
    padding: 1rem 0;
    border-bottom: 1px solid #2f2f2f;
    font-size: 20px;
    font-weight: 600;
  }
}
onfigr .main-container .welcome .main .body .step {
  display: flex;
  gap: 1rem;
  align-items: flex-start;
  margin-top: 2.5rem;
}
onfigr .main-container .welcome .main .body .step .step-icon {
  width: 40px;
  height: 40px;
  border: 1px solid #151515;
  font-size: 14px;
  font-weight: 600;
  border-radius: 5px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
}
@media only screen and (max-width: 800px) {
  onfigr .main-container .welcome .main .body .step .step-icon {
    width: 30px;
    height: 30px;
  }
}
onfigr .main-container .welcome .main .body .step .text-content .title-text {
  font-weight: 600;
}
onfigr .main-container .welcome .main .body .step .text-content .subtext {
  font-size: 12px;
  color: #676767;
  margin-top: 5px;
}
onfigr .main-container .welcome .main .footer-container {
  width: 100%;
  max-width: 800px;
  margin: 0 auto;
  padding: 1rem;
  display: flex;
  align-items: center;
  gap: 1rem;
}
@media only screen and (max-width: 800px) {
  onfigr .main-container .welcome .main .footer-container {
    margin-top: 0;
    padding: 0;
  }
}
onfigr .main-container .welcome .main .footer-container .button {
  background-color: #292929;
  color: #ffffff;
  font-weight: 600;
  transition: background-color 150ms ease-in-out;
}
@media only screen and (max-width: 800px) {
  onfigr .main-container .welcome .main .footer-container .button {
    width: 100%;
    height: 70px;
    border-radius: 0;
    font-size: 16px;
  }
}
onfigr .main-container .welcome .main .footer-container .button:hover {
  background-color: #434343;
}
onfigr .main-container .welcome .main .footer-container .style-finder-button {
  background-image: linear-gradient(to right, #c026d3, #f43f5e);
}
@media only screen and (max-width: 800px) {
  onfigr .main-container .welcome .main .footer-container .style-finder-button {
    display: none;
  }
}
onfigr .presets-menu-panel {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  padding: 0.5rem 0.5rem;
  overflow-y: auto;
  background-color: #ffffff;
  transform: translateX(150%);
  will-change: transform;
  transition: transform 0.25s ease-in-out;
}
onfigr .presets-menu-panel.active {
  transform: translateX(0);
}
@media only screen and (max-width: 800px) {
  onfigr .presets-menu-panel.active {
    transform: translateY(0);
  }
}
@media only screen and (max-width: 800px) {
  onfigr .presets-menu-panel {
    overflow-y: hidden;
    padding: 0 1rem;
    border-radius: 10px 10px 0 0;
    pointer-events: auto;
    top: unset;
    bottom: 0;
    overflow: unset;
    transform: translateY(150%);
    height: auto;
  }
}
onfigr .presets-menu-panel .mobile-title {
  display: none;
}
@media only screen and (max-width: 800px) {
  onfigr .presets-menu-panel .mobile-title {
    display: block;
    font-size: 20px;
    font-weight: 600;
    padding: 0.8rem 0;
    border-bottom: 1px solid #2f2f2f;
    text-align: center;
    text-transform: capitalize;
  }
}
onfigr .presets-menu-panel .mobile-header {
  width: 100%;
  align-items: center;
  justify-content: space-between;
  display: none;
  padding: 1rem;
  border-bottom: 1px solid #2f2f2f;
}
@media only screen and (max-width: 800px) {
  onfigr .presets-menu-panel .mobile-header {
    display: flex;
  }
}
onfigr .presets-menu-panel .mobile-header .title {
  font-size: clamp(20px, 5vw, 28px);
  font-weight: 600;
}
onfigr .presets-menu-panel .mobile-header .close-button {
  display: flex;
  align-items: center;
  padding: 0.25rem;
  background-color: #ffffff;
  border: none;
  border-radius: 5px;
  color: #151515;
}
onfigr .presets-menu-panel .mobile-header .close-button:active {
  background-color: #e4e4e4;
}
onfigr .presets-menu-panel .mobile-header .close-button .icon {
  margin: auto 0;
  width: 20px;
  height: 20px;
}
onfigr .presets-menu-panel .presets-menu-container {
  height: 100%;
  padding: 0.5rem 0.5rem;
}
@media only screen and (max-width: 800px) {
  onfigr .presets-menu-panel .presets-menu-container {
    height: auto;
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem 0;
    width: 100%;
    overflow-x: auto;
  }
}
onfigr .presets-menu-panel .presets-menu-container .style-finder-button {
  background: linear-gradient(to right, #c026d3, #f43f5e);
  color: #ffffff;
  min-width: 200px;
  align-self: stretch;
  flex-shrink: 0;
  max-height: 125px;
  display: none;
}
onfigr .presets-menu-panel .presets-menu-container .style-finder-button .icon {
  width: 24px;
  height: 24px;
}
onfigr .presets-menu-panel .presets-menu-container .style-finder-button .text {
  font-weight: 700;
}
@media only screen and (max-width: 800px) {
  onfigr .presets-menu-panel .presets-menu-container .style-finder-button {
    display: inline-flex;
  }
}
onfigr .presets-menu-panel .presets-menu-container .preset-item {
  cursor: pointer;
  margin-bottom: 1rem;
}
@media only screen and (max-width: 800px) {
  onfigr .presets-menu-panel .presets-menu-container .preset-item {
    width: 200px;
    height: auto;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    margin: 0 0;
    position: relative;
  }
}
onfigr .presets-menu-panel .presets-menu-container .preset-item .preset-image-container {
  position: relative;
  border-radius: 8px;
  width: 100%;
  height: auto;
}
onfigr .presets-menu-panel .presets-menu-container .preset-item .preset-image-container img {
  width: 100%;
  height: auto;
  aspect-ratio: 16/9;
  border-radius: 6px;
  object-fit: cover;
  display: block;
}
@media only screen and (max-width: 800px) {
  onfigr .presets-menu-panel .presets-menu-container .preset-item .preset-image-container img {
    width: 200px;
    height: auto;
    aspect-ratio: 16/9;
  }
}
onfigr .presets-menu-panel .presets-menu-container .preset-item .preset-image-container:hover::before,
onfigr .presets-menu-panel .presets-menu-container .preset-item .preset-image-container:hover::after {
  opacity: 1;
}
@media only screen and (max-width: 800px) {
  onfigr .presets-menu-panel .presets-menu-container .preset-item .preset-image-container:hover::before,
  onfigr .presets-menu-panel .presets-menu-container .preset-item .preset-image-container:hover::after {
    opacity: 0;
  }
}
onfigr .presets-menu-panel .presets-menu-container .preset-item .preset-image-container::before {
  border-radius: 8px;
  content: '';
  clear: both;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
  background-color: rgba(21, 21, 21, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #f2f2f2;
  opacity: 0;
  transition: opacity 0.15s ease-in-out;
}
onfigr .presets-menu-panel .presets-menu-container .preset-item .preset-image-container::after {
  content: 'Select';
  position: absolute;
  padding: 0.5rem 2rem;
  border: 1px solid #e4e4e4;
  border-radius: 9999px;
  z-index: 2;
  color: #fff;
  font-size: 14px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  opacity: 0;
  transition: opacity 0.15s ease-in-out;
}
onfigr .presets-menu-panel .presets-menu-container .preset-item .preset-name {
  color: #000000;
  border-bottom: 1px solid #000000;
  padding-bottom: 0.5rem;
  margin-bottom: 0.5rem;
}
@media only screen and (max-width: 800px) {
  onfigr .presets-menu-panel .presets-menu-container .preset-item .preset-name {
    margin: 0;
    padding: 0;
    order: 1;
    border: none;
  }
}
onfigr .layers-menu-panel {
  position: absolute;
  top: 0;
  right: -100%;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  padding: 0.5rem 1rem;
  overflow-y: scroll;
  z-index: 20;
  transition: all 0.25s ease-in-out;
}
onfigr .layers-menu-panel.active {
  right: 0;
}
onfigr .layers-menu-panel.expanded .menu-container {
  display: none;
}
onfigr .layers-menu-panel.expanded .menu-container.active {
  display: block;
  margin-top: 1rem;
  transition: transform 0.25s 0.15s ease-in-out, opacity 0.35s ease-in-out;
}
@media only screen and (max-width: 800px) {
  onfigr .layers-menu-panel {
    overflow-y: scroll;
  }
  onfigr .layers-menu-panel.expanded .menu-container {
    display: none;
  }
  onfigr .layers-menu-panel.expanded .menu-container.active {
    display: block;
    transition: transform 0.25s 0.15s ease-in-out, opacity 0.35s ease-in-out;
  }
}
@media screen and (max-height: 550px) and (max-width: 1000px) and (orientation: landscape) {
  onfigr .layers-menu-panel {
    left: unset;
    bottom: unset;
    height: 80%;
    max-width: 220px;
    right: 0.25rem;
    top: 0.25rem;
  }
  onfigr .layers-menu-panel.expanded {
    overflow: hidden;
  }
  onfigr .layers-menu-panel.expanded .menu-container {
    display: none;
  }
  onfigr .layers-menu-panel.expanded .menu-container.active {
    overflow-y: hidden;
    display: block;
  }
}
onfigr .layers-menu-panel .menu-container {
  width: 100%;
  position: relative;
  overflow: hidden;
  background-color: #fff;
  margin: 1px 0;
  pointer-events: auto;
  transition: transform 0.25s 0.15s ease-in-out, max-height 0.25s ease-in-out, opacity 0.35s ease-in-out;
}
onfigr .layers-menu-panel .menu-container::-webkit-scrollbar {
  width: 0;
}
onfigr .layers-menu-panel .menu-container.active .menu-heading {
  border-bottom: 2px solid black;
}
onfigr .layers-menu-panel .menu-container.active .menu-heading .icon {
  transform: rotate(180deg);
}
onfigr .layers-menu-panel .menu-container.active .menu-content {
  max-height: calc(100% - 100px);
  opacity: 1;
  pointer-events: auto;
}
onfigr .layers-menu-panel .menu-container.hidden {
  display: none;
}
onfigr .layers-menu-panel .menu-container.transparent {
  opacity: 0;
  pointer-events: none;
}
@media only screen and (max-width: 800px) {
  onfigr .layers-menu-panel .menu-container {
    transition: transform 0.25s 0.15s ease-in-out, pacity 0.35s ease-in-out;
  }
}
onfigr .layers-menu-panel .menu-container .menu-heading {
  width: 100%;
  padding: 0.5rem 3rem 0.5rem 0.5rem;
  box-sizing: border-box;
  text-align: center;
  display: flex;
  gap: 1.5rem;
  align-items: center;
  border: 2px solid #2f2f2f;
  border-radius: 5px;
  position: relative;
  text-transform: capitalize;
  background-color: #ffffff;
  cursor: pointer;
}
onfigr .layers-menu-panel .menu-container .menu-heading .thumbnail {
  width: 60px;
  height: 60px;
  border-radius: 5px;
  background-color: #333;
}
onfigr .layers-menu-panel .menu-container .menu-heading .thumbnail img {
  width: 100%;
  height: 100%;
  border-radius: 5px;
  object-fit: cover;
}
onfigr .layers-menu-panel .menu-container .menu-heading .title {
  font-size: clamp(14px, 1.5vw, 16px);
  font-weight: 500;
  color: #151515;
}
onfigr .layers-menu-panel .menu-container .menu-heading .icon {
  position: absolute;
  right: 1rem;
  top: 0;
  bottom: 0;
  margin: auto 0;
  width: 24px;
  height: 24px;
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iNDgiIHdpZHRoPSI0OCI+PHBhdGggZD0ibTI0IDMwLjc1LTEyLTEyIDIuMTUtMi4xNUwyNCAyNi41bDkuODUtOS44NUwzNiAxOC44WiIvPjwvc3ZnPg==);
  background-size: 24px;
  transition: transform 0.3s ease-in-out;
}
@media (hover: hover) and (pointer: fine) {
  onfigr .layers-menu-panel .menu-container .menu-heading:hover {
    background-color: #e5e5e5;
  }
}
onfigr .layers-menu-panel .menu-container .menu-heading.scenes {
  background-color: #000000;
  color: #fff;
}
onfigr .layers-menu-panel .menu-container .menu-heading.scenes .icon {
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iNDgiIHdpZHRoPSI0OCI+PHBhdGggZD0ibTI0IDMwLjc1LTEyLTEyIDIuMTUtMi4xNUwyNCAyNi41bDkuODUtOS44NUwzNiAxOC44WiIgc3Ryb2tlPSJ3aGl0ZSIgZmlsbD0id2hpdGUiICAvPjwvc3ZnPg==);
}
onfigr .layers-menu-panel .menu-container .menu-content {
  opacity: 0;
  max-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  position: relative;
  transition: max-height 0.15s ease-in-out, opacity 0.15s ease-in-out;
}
onfigr .layers-menu-panel .menu-container .filters {
  width: 100%;
  display: flex;
  flex-direction: column;
}
onfigr .layers-menu-panel .menu-container .filters .filters-group {
  display: flex;
  flex-wrap: wrap;
  box-sizing: border-box;
  padding: 0.75rem 1rem 0;
  width: 100%;
}
onfigr .layers-menu-panel .menu-container .filters .filters-group.hidden {
  display: none;
}
onfigr .layers-menu-panel .menu-container .filters .filters-group .filter-item {
  margin-right: 0.15rem;
  padding: 0.25rem 0.25rem;
  accent-color: black;
  display: flex;
  justify-content: center;
  align-items: center;
}
onfigr .layers-menu-panel .menu-container .filters .filters-group .filter-item label {
  cursor: pointer;
  font-size: 0.9rem;
}
onfigr .layers-menu-panel .menu-container .filters .filters-group .filter-item input {
  display: none;
}
onfigr .layers-menu-panel .menu-container .filters .filters-group .filter-item.active label {
  font-size: 0.95rem;
  font-weight: 600;
}
onfigr .layers-menu-panel .menu-container .filters .filters-group .filter-item.hidden {
  display: none;
}
onfigr .layers-menu-panel .menu-container .filters .filters-group .filter-item:last-child {
  margin-right: 0;
}
onfigr .layers-menu-panel .menu-container .menu-items {
  width: 100%;
  padding: 1.5rem 1rem;
  box-sizing: border-box;
  overflow: hidden;
  position: relative;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(80px, 1fr));
  gap: 1rem;
}
@media only screen and (max-width: 800px) {
  onfigr .layers-menu-panel .menu-container .menu-items {
    grid-template-columns: repeat(auto-fill, minmax(50px, 1fr));
  }
}
onfigr .layers-menu-panel .menu-container .menu-items.scenes {
  display: block;
}
onfigr .layers-menu-panel .menu-container .menu-items.groups {
  width: 100%;
  display: flex !important;
  flex-direction: column;
  overflow-y: scroll;
  gap: 1rem;
}
onfigr .layers-menu-panel .menu-container .menu-items .menu-item.layer {
  width: 100%;
  position: relative;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}
onfigr .layers-menu-panel .menu-container .menu-items .menu-item.layer.hidden {
  display: none;
}
onfigr .layers-menu-panel .menu-container .menu-items .menu-item.layer .thumbnail {
  width: 100%;
  aspect-ratio: 1/1;
  border-radius: 5px;
  border: 1px solid #ececec;
  max-height: 75px;
}
onfigr .layers-menu-panel .menu-container .menu-items .menu-item.layer.active::after {
  content: '';
  position: absolute;
  right: -6px;
  top: -6px;
  width: 18px;
  height: 18px;
  background-size: 18px;
  background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACYAAAAmCAYAAACoPemuAAAABHNCSVQICAgIfAhkiAAAAvpJREFUWIXF2EFIk2Ecx/HvZq2xoC2sQ6MWSgyaoAUtZJcUyYhW3QoLUgihm9AlhCCPdoh1SuiQh2CHTpkoRJB1lQShgmaRJK4QxMUk19bmv8PrO7a5ufd992z+4A/j5Xme97Pn3bvn4bFhPgeA88Bl4CRwcKs8QApYAxJAHHgDvAIWLdzHcE4B08A/QEzWF2AQsKsE+YDnwKYFUGl9Ai6qQHUD6wpApfWEGmbvFpCtA0qvacBlFnW/jqDCmkN7mQzlRoNQer3FwGM9A2QaDBPg8U6ovcCPXUDpda4S7N4uogT4DNhKUYeBP/W6qcfjMdr2TinsWT1RsVhMIpGIkfZrFLyl+7C2zFQtp9Mps7OzomdkZMRIv0HQXtMuYE/pFNaapqYmJiYmCAaD+WtOp9NI1y79w0MUz5TNZpNoNCqFGR8fN9r/lw6bUg0bGxsrQk1OTordbjczxiGADypRw8PDRaiZmRlxOBxmxwkALKtCDQwMFKHm5+fF5XJZGasbIK0CFQ6HJZfL5VGxWEyam5utjncdtG2woQ5ut7vs9VAoJOl0Oo+Kx+Pi9Xpr+aJXQNv2Vm3c29sriURCOjs7i663tbVJMpnMo1ZXV8Xv99f6BM4CvK/WMBgMSiqVEhGRjY0N6enpEUBaW1tlZWUlj0omk9LR0aHi9+oDbcuxY8P29nZJJBJ5QCaTkf7+fllaWspfS6fTEgqFVKB+s7WYXzLSIRAIFM1OYbLZrITDYRUoAV6wlf0YXCtbWlokHo9vg/X19alCCXCbgrwz2tHn8xU9wqGhIZUoAY4Wwq6Z6ez1emVhYUFGR0dVo6Yokzkzg1T6T6uhNoET5WAhxTcyW0/LofREdgn1He1gpmLsaCc0jUStA/6dUHrcwLcGoTaBC0ZQerzAxzqjUsBVMyg9LuClYox+lPUTOG0FpceGtjdaVAT6CzzCxEFKtTiAu5jYu5WBRYFjqkClcQE3gddAzgDoK/AAOG72RtvOCkzkCNq5bKXD4WW01cRS/gOKy/bwRxUPygAAAABJRU5ErkJggg==');
}
onfigr .layers-menu-panel .menu-container .menu-items .group-container.hidden {
  display: none;
}
onfigr .layers-menu-panel .menu-container .menu-items .group-container .group-heading {
  margin: 10px 0;
  font-size: 14px;
  text-transform: capitalize;
}
onfigr .layers-menu-panel .menu-container .menu-items .group-container .grouped-item-container {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(80px, 1fr));
  gap: 1rem;
}
@media only screen and (max-width: 800px) {
  onfigr .layers-menu-panel .menu-container .menu-items .group-container .grouped-item-container {
    grid-template-columns: repeat(auto-fill, minmax(50px, 1fr));
  }
}
onfigr .layers-menu-panel .menu-container .menu-items .group-container .grouped-item-container .menu-item.group img {
  border-radius: 0;
}
onfigr .layers-menu-panel .menu-container .menu-items .menu-item.scene {
  width: 100%;
  padding: 0.5rem 0;
  cursor: pointer;
  font-size: 14px;
}
onfigr .layers-menu-panel .menu-container .menu-items .menu-item.scene.active {
  text-decoration: underline;
}
@media only screen and (max-width: 800px) {
  onfigr .layers-menu-panel .menu-container .menu-items .menu-item.scene {
    text-align: center;
    font-size: 1rem;
    text-decoration: none;
  }
  onfigr .layers-menu-panel .menu-container .menu-items .menu-item.scene.active {
    text-decoration: none;
    font-weight: 700;
  }
}
onfigr .item__container {
  width: 100%;
  max-height: 100%;
  opacity: 1;
  padding: 0 1rem;
  box-sizing: border-box;
  transition: max-height 300ms ease-in-out, opacity 250ms ease-in-out;
  display: grid;
  grid-template-columns: repeat(3, 100px);
  justify-content: space-around;
  align-items: start;
}
onfigr .item__container.collapse {
  overflow: hidden;
  max-height: 0;
  opacity: 0;
}
onfigr .item__container .menu-item {
  width: 100%;
  margin-bottom: 1rem;
  box-sizing: border-box;
  margin: 15px 0;
  cursor: pointer;
  font-family: 'Poppins', sans-serif;
  font-weight: 300;
  font-style: normal;
  font-size: 12px;
  text-align: left;
  position: relative;
}
onfigr .item__container .menu-item.included::before {
  content: 'INCLUDED';
  text-align: center;
  color: white;
  font-size: 8px;
  font-weight: 600;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 80px;
  left: 5px;
  width: calc(100% - 10px);
  margin: 0 auto;
  height: 15px;
  z-index: 2;
}
onfigr .item__container .menu-item .item-header__container {
  width: 100%;
  height: 65px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.5rem 0;
  box-sizing: border-box;
}
onfigr .item__container .menu-item .item-header__container .selected_indicator {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  display: none;
}
onfigr .item__container .menu-item .item-header__container .selected_indicator .tick {
  width: 20px;
  height: 20px;
  background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iMTIiIHZpZXdCb3g9IjAgMCAxMiAxMiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEgNkw0Ljc0OTg5IDEwLjcyTDExLjI1IDEuNSIgc3Ryb2tlPSIjNzc3ODc3IiBzdHJva2Utd2lkdGg9IjEuNSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+Cjwvc3ZnPgo=');
  background-size: 12px;
  background-position: center;
  background-repeat: no-repeat;
}
onfigr .item__container .menu-item .item-header__container .selected_indicator p {
  font-size: 14px;
  font-weight: 400;
  line-height: 21px;
  letter-spacing: 0.02em;
  text-align: center;
  color: #777877;
}
onfigr .item__container .menu-item .item-header__container .product-info__btn {
  display: none;
  width: 24px;
  height: 24px;
  background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGNpcmNsZSBjeD0iMTIiIGN5PSIxMiIgcj0iMTAiIGZpbGw9ImJsYWNrIiBmaWxsLW9wYWNpdHk9IjAuMDYiLz4KPHBhdGggZD0iTTExLjQxMjggMTAuMDU1NEMxMS41NjM5IDkuODk5NzggMTEuNzcwNCA5LjgxMDYxIDExLjk4NzEgOS44MDcxOEMxMi4yMDgyIDkuODAzNzYgMTIuNDIxMyA5Ljg5MDA0IDEyLjU3NzggMTAuMDQ2MkMxMi43MzQ0IDEwLjIwMjUgMTIuODIxIDEwLjQxNTUgMTIuODE4IDEwLjYzNjVWMTYuMDM2MUMxMi44MjExIDE2LjI1NTEgMTIuNzM2MyAxNi40NjYyIDEyLjU4MjUgMTYuNjIyMkMxMi40Mjg3IDE2Ljc3ODEgMTIuMjE4OSAxNi44NjU5IDExLjk5OTggMTYuODY1OUMxMS43ODA4IDE2Ljg2NTkgMTEuNTcxIDE2Ljc3ODEgMTEuNDE3MiAxNi42MjIyQzExLjI2MzQgMTYuNDY2MiAxMS4xNzg2IDE2LjI1NTEgMTEuMTgxNyAxNi4wMzYxVjEwLjYzNjVDMTEuMTc4NyAxMC40MTk5IDExLjI2MTkgMTAuMjEwOCAxMS40MTI4IDEwLjA1NTRaIiBmaWxsPSIjMzUzOTM1Ii8+CjxwYXRoIGQ9Ik0xMS40MjEzIDcuMjM5N0MxMS41NzQ3IDcuMDg2MjkgMTEuNzgyOSA3IDExLjk5OTkgN0MxMi4yMTY4IDcgMTIuNDI1IDcuMDg2MjkgMTIuNTc4NCA3LjIzOTdDMTIuNzMxOCA3LjM5MzEgMTIuODE4IDcuNjAxMTYgMTIuODE4IDcuODE4MjZDMTIuODE4IDguMDM1MjEgMTIuNzMxOCA4LjI0MzI4IDEyLjU3ODQgOC4zOTY2OEMxMi40MjUgOC41NTAyMyAxMi4yMTY4IDguNjM2MzggMTEuOTk5OSA4LjYzNjM4QzExLjc4MjkgOC42MzYzOCAxMS41NzQ3IDguNTUwMjMgMTEuNDIxMyA4LjM5NjY4QzExLjI2NzkgOC4yNDMyOCAxMS4xODE3IDguMDM1MjIgMTEuMTgxNyA3LjgxODI2QzExLjE4MTcgNy42MDExOCAxMS4yNjc5IDcuMzkzMSAxMS40MjEzIDcuMjM5N1oiIGZpbGw9IiMzNTM5MzUiLz4KPC9zdmc+Cg==');
  background-size: 24px;
  background-position: center;
  background-repeat: no-repeat;
}
onfigr .item__container .menu-item.popular::after {
  position: absolute;
  top: -10px;
  right: -8px;
  z-index: 2;
  content: '';
  width: 24px;
  height: 24px;
  background-image: url('./ui/MenuPanel/image/star.svg');
  background-size: 18px;
  background-repeat: no-repeat;
  background-position: center;
}
onfigr .item__container img {
  -webkit-user-drag: none;
  -khtml-user-drag: none;
  -moz-user-drag: none;
  -o-user-drag: none;
}
onfigr .item__container p {
  margin: 0 5px;
}
onfigr .item__container .menu-item__filter {
  margin-top: 10px;
}
onfigr .item__container .menu-item__name {
  margin: 5px;
}
onfigr .item__container .menu-item__price {
  font-weight: 400;
  font-size: 14px;
  line-height: 150%;
  text-align: center;
  letter-spacing: 0.02em;
  margin-top: 2px;
  margin-bottom: 1rem;
  /* Grey */
  color: #777877;
}
onfigr .item__container .menu-item__thumb {
  width: 90px;
  height: 90px;
  display: block;
  margin: 0 auto;
  border: 4px solid white;
  position: relative;
  transition: border 150ms ease;
}
onfigr .item__container .colour-selector__container {
  width: 100%;
  display: none;
}
onfigr .item__container .colour-selector__container .colour-thumb__container .colour__thumb {
  width: 28px;
  height: 28px;
  padding: 4px;
  display: flex;
  justify-content: center;
  align-self: center;
  box-sizing: border-box;
  border-radius: 99999px;
  margin: 0 auto;
}
onfigr .item__container .colour-selector__container .colour-thumb__container .colour__thumb img {
  width: 100%;
  height: 100%;
  border-radius: 99999px;
}
onfigr .item__container .colour-selector__container .colour-thumb__container .colour__thumb.active {
  border: 1px solid black;
}
onfigr .item__container .colour-selector__container .colour__selected {
  font-weight: 400;
  font-size: 14px;
  line-height: 150%;
  text-align: center;
  letter-spacing: 0.02em;
  color: #777877;
  margin-top: 2px;
}
onfigr .item__container .drop-down {
  display: none;
}
onfigr .item__container .decision_panel__container {
  border-top: 1px solid rgba(0, 0, 0, 0.1);
  padding: 3rem 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
}
onfigr .item__container .decision_panel__container .decision__heaading {
  color: #383832;
  font-size: 32px;
  line-height: 38px;
  letter-spacing: -0.01em;
  text-align: center;
}
onfigr .item__container .decision_panel__container .decision__text {
  color: #9e9c96;
  font-size: 16px;
  line-height: 22px;
  letter-spacing: 0.01em;
  text-align: center;
}
onfigr .item__container .decision_panel__container button {
  width: 270px;
  margin: 0 auto;
  background: none;
  padding: 0.8rem 2rem;
  box-sizing: border-box;
  border: 1px solid rgba(0, 0, 0, 0.1);
  font-size: 14px;
  line-height: 21px;
  letter-spacing: 0.02em;
  text-align: center;
  cursor: pointer;
}
onfigr #onfigr_tooltip {
  position: absolute;
  left: 0;
  top: 0;
  height: 26px;
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 0.75rem;
  text-align: center;
  line-height: 26px;
  color: black;
  background-color: white;
  padding-left: 15px;
  padding-right: 15px;
  border-bottom: 1px solid #f4f4f4;
  -webkit-box-shadow: 2px 2px 3px 0px rgba(0, 0, 0, 0.25);
  -moz-box-shadow: 2px 2px 3px 0px rgba(0, 0, 0, 0.25);
  box-shadow: 2px 2px 3px 0px rgba(0, 0, 0, 0.25);
  transition: opacity 150ms ease-out 50ms, box-shadow 150ms ease-out;
  opacity: 0;
  pointer-events: none;
  z-index: 4;
}
onfigr #onfigr_tooltip::after {
  content: '';
  position: absolute;
  margin-left: inherit;
  right: 30px;
  top: -5px;
  z-index: 5;
  width: 10px;
  height: 10px;
  background-color: white;
  transform: rotate(45deg);
}
@media only screen and (max-width: 800px) {
  onfigr #onfigr_tooltip {
    display: none;
  }
}
onfigr .modal-items-container {
  width: 60%;
  max-width: 700px;
  max-height: 400px;
  height: max-content;
  z-index: 3;
  position: absolute;
  top: 45%;
  left: 45%;
  transform: translate(-50%, -50%);
  background-color: #fff;
  border-radius: 5px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
  box-sizing: border-box;
  display: none;
  flex-direction: column;
}
@media only screen and (max-width: 800px) {
  onfigr .modal-items-container {
    width: 100%;
    max-width: 450px;
    left: 50%;
  }
}
onfigr .modal-items-container .modal-items {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(60px, 1fr));
  gap: 0.8rem;
  padding: 2rem;
  overflow-y: auto;
}
onfigr .modal-items-container .modal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 1rem 2rem 0 2rem;
  font-size: 1rem;
  font-weight: 600;
  border-bottom: 1px solid #2f2f2f;
}
onfigr .modal-items-container .modal-close-button {
  padding: 0.25rem 0.5rem;
  cursor: pointer;
}
onfigr .modal-items-container .modal-close-button:hover {
  background-color: rgba(0, 0, 0, 0.1);
}
onfigr .modal-items-container.groups {
  display: flex;
  flex-direction: column;
}
onfigr .modal-items-container.groups .group-container {
  display: flex;
  flex-direction: column;
}
onfigr .modal-items-container.groups .group-container.hidden {
  display: none;
}
onfigr .modal-items-container.groups .group-container .group-heading {
  margin-bottom: 5px;
}
onfigr .modal-items-container.groups .group-container .grouped-item-container {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(60px, 1fr));
  gap: 1rem;
}
@media only screen and (max-width: 800px) {
  onfigr .modal-items-container.groups .group-container .grouped-item-container {
    grid-template-columns: repeat(auto-fill, minmax(65px, 1fr));
  }
}
onfigr .modal-items-container .menu-item {
  padding-top: 100%;
  position: relative;
  cursor: pointer;
}
@media only screen and (max-width: 800px) {
  onfigr .modal-items-container .menu-item {
    flex-shrink: 0;
    aspect-ratio: 1 / 1;
  }
}
onfigr .modal-items-container .menu-item.hidden {
  display: none;
}
onfigr .modal-items-container .menu-item .thumbnail {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  object-fit: cover;
  border-radius: 5px;
  border: 1px solid #ececec;
}
onfigr .modal-items-container .menu-item.active::after {
  content: '';
  position: absolute;
  right: -6px;
  top: -6px;
  width: 18px;
  height: 18px;
  background-size: 18px;
  background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACYAAAAmCAYAAACoPemuAAAABHNCSVQICAgIfAhkiAAAAvpJREFUWIXF2EFIk2Ecx/HvZq2xoC2sQ6MWSgyaoAUtZJcUyYhW3QoLUgihm9AlhCCPdoh1SuiQh2CHTpkoRJB1lQShgmaRJK4QxMUk19bmv8PrO7a5ufd992z+4A/j5Xme97Pn3bvn4bFhPgeA88Bl4CRwcKs8QApYAxJAHHgDvAIWLdzHcE4B08A/QEzWF2AQsKsE+YDnwKYFUGl9Ai6qQHUD6wpApfWEGmbvFpCtA0qvacBlFnW/jqDCmkN7mQzlRoNQer3FwGM9A2QaDBPg8U6ovcCPXUDpda4S7N4uogT4DNhKUYeBP/W6qcfjMdr2TinsWT1RsVhMIpGIkfZrFLyl+7C2zFQtp9Mps7OzomdkZMRIv0HQXtMuYE/pFNaapqYmJiYmCAaD+WtOp9NI1y79w0MUz5TNZpNoNCqFGR8fN9r/lw6bUg0bGxsrQk1OTordbjczxiGADypRw8PDRaiZmRlxOBxmxwkALKtCDQwMFKHm5+fF5XJZGasbIK0CFQ6HJZfL5VGxWEyam5utjncdtG2woQ5ut7vs9VAoJOl0Oo+Kx+Pi9Xpr+aJXQNv2Vm3c29sriURCOjs7i663tbVJMpnMo1ZXV8Xv99f6BM4CvK/WMBgMSiqVEhGRjY0N6enpEUBaW1tlZWUlj0omk9LR0aHi9+oDbcuxY8P29nZJJBJ5QCaTkf7+fllaWspfS6fTEgqFVKB+s7WYXzLSIRAIFM1OYbLZrITDYRUoAV6wlf0YXCtbWlokHo9vg/X19alCCXCbgrwz2tHn8xU9wqGhIZUoAY4Wwq6Z6ez1emVhYUFGR0dVo6Yokzkzg1T6T6uhNoET5WAhxTcyW0/LofREdgn1He1gpmLsaCc0jUStA/6dUHrcwLcGoTaBC0ZQerzAxzqjUsBVMyg9LuClYox+lPUTOG0FpceGtjdaVAT6CzzCxEFKtTiAu5jYu5WBRYFjqkClcQE3gddAzgDoK/AAOG72RtvOCkzkCNq5bKXD4WW01cRS/gOKy/bwRxUPygAAAABJRU5ErkJggg==');
}
onfigr .menu-panel {
  position: absolute;
  bottom: 0;
  right: 0;
  box-sizing: border-box;
  width: 100%;
  height: calc(100% - (45px + 1rem));
  padding: 0.5rem 1rem;
  z-index: 3;
  transform: translateX(100%);
  background-color: #fff;
  will-change: transform;
  transition: transform 0.3s ease-in-out;
  overflow: hidden;
}
@media only screen and (max-width: 800px) {
  onfigr .menu-panel {
    opacity: 0;
  }
}
onfigr .menu-panel.active {
  transform: translateX(0);
}
@media only screen and (max-width: 800px) {
  onfigr .menu-panel.active {
    transform: translateY(0);
    opacity: 1;
  }
}
onfigr .menu-panel.has-option-switch {
  height: calc(100% - 130px - 1rem);
}
@media only screen and (max-width: 800px) {
  onfigr .menu-panel.has-option-switch {
    height: auto;
  }
}
@media only screen and (max-width: 800px) {
  onfigr .menu-panel {
    min-height: 0px;
    max-height: 90%;
    padding: 0;
    height: auto;
    border-radius: 10px 10px 0 0;
    pointer-events: auto;
    transform: translateY(100%);
    bottom: 0;
    overflow: unset;
    transition: transform 0.3s ease-in-out, height 0.3s ease-in-out, max-height 0.3s ease-in-out, min-height 0.3s ease-in-out;
  }
  onfigr .menu-panel .body-container {
    display: flex;
    flex-direction: column;
    height: auto;
    max-height: 500px;
    padding: 1rem 0.8rem;
    margin-top: 0;
    transition: max-height 0.3s ease-in-out;
    gap: 1rem;
  }
  onfigr .menu-panel .footer-container {
    width: 100%;
    padding: 1rem;
    display: flex;
    align-items: center;
    gap: 1rem;
    display: none;
  }
  onfigr .menu-panel .footer-container .button {
    width: 100%;
  }
  onfigr .menu-panel .footer-container .back {
    box-shadow: 0 0 0 1px #151515;
    background-color: transparent;
  }
  onfigr .menu-panel .footer-container .next {
    background-color: #151515;
    color: #ffffff;
  }
}
onfigr .menu-panel .panel-container {
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  padding: 0.5rem 0;
}
@media only screen and (max-width: 800px) {
  onfigr .menu-panel .panel-container {
    padding: 0;
  }
}
onfigr .menu-panel .panel-container .layer-menu {
  position: relative;
  width: 100%;
  height: 100%;
}
@media only screen and (max-width: 800px) {
  onfigr .menu-panel .panel-container .layer-menu {
    transform-style: preserve-3d;
    border-radius: 6px 6px 0 0;
    background-color: #ffffff;
    -webkit-box-shadow: 0px -1px 12px 0px rgba(0, 0, 0, 0.3);
    box-shadow: 0px -1px 12px 0px rgba(0, 0, 0, 0.3);
  }
}
onfigr .menu-panel .panel-container .layer-menu .header {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
@media only screen and (max-width: 800px) {
  onfigr .menu-panel .panel-container .layer-menu .header {
    border-bottom: 1px solid #2f2f2f;
    padding: 0.8rem 0;
    margin: 0 1rem;
    width: unset;
  }
}
onfigr .menu-panel .panel-container .layer-menu .header .back-and-title {
  display: flex;
  align-items: center;
  position: relative;
  cursor: pointer;
}
@media only screen and (max-width: 800px) {
  onfigr .menu-panel .panel-container .layer-menu .header .back-and-title {
    width: 100%;
  }
}
onfigr .menu-panel .panel-container .layer-menu .header .back-and-title .back {
  position: absolute;
  left: -10px;
  top: 0;
  bottom: 0;
  margin: auto 0;
  width: 35px;
  height: 35px;
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iNDgiIHdpZHRoPSI0OCI+PHBhdGggZD0ibTI0IDMwLjc1LTEyLTEyIDIuMTUtMi4xNUwyNCAyNi41bDkuODUtOS44NUwzNiAxOC44WiIvPjwvc3ZnPg==);
  background-size: 35px;
  transition: transform 0.3s ease-in-out;
  rotate: 90deg;
}
@media only screen and (max-width: 800px) {
  onfigr .menu-panel .panel-container .layer-menu .header .back-and-title .back {
    display: none;
  }
}
onfigr .menu-panel .panel-container .layer-menu .header .back-and-title .title {
  font-size: clamp(20px, 5vw, 28px);
  font-weight: 600;
  margin-left: 40px;
  width: 300px;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
@media only screen and (max-width: 800px) {
  onfigr .menu-panel .panel-container .layer-menu .header .back-and-title .title {
    font-size: 20px;
    margin-left: 0;
    text-align: left;
    width: 100%;
  }
}
onfigr .menu-panel .panel-container .layer-menu .header .back-and-title .close-icon {
  display: none;
  position: absolute;
  right: 10px;
  top: 0;
  bottom: 0;
  margin: auto 0;
  width: 24px;
  height: 24px;
}
@media only screen and (max-width: 800px) {
  onfigr .menu-panel .panel-container .layer-menu .header .back-and-title .close-icon {
    display: block;
  }
}
onfigr .menu-panel .panel-container .layer-menu .body-container {
  display: flex;
  flex-direction: column;
  margin-top: 1rem;
  height: calc(100% - 50px);
  width: 100%;
  padding: 0 1.5rem;
  overflow-y: auto;
  gap: 1.5rem;
}
@media only screen and (max-width: 800px) {
  onfigr .menu-panel .panel-container .layer-menu .body-container {
    padding: 1rem;
    margin-top: 0;
  }
}
onfigr .menu-panel .panel-container .layer-menu .body-container .menu-container {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}
onfigr .menu-panel .panel-container .layer-menu .body-container .menu-container .drop-down-container {
  display: flex;
  height: auto;
  align-items: center;
  justify-content: space-between;
}
onfigr .menu-panel .panel-container .layer-menu .body-container .menu-container .drop-down-container .nested-name {
  font-size: 12px;
  font-weight: 600;
}
onfigr .menu-panel .panel-container .layer-menu .body-container .menu-container .drop-down-container:not(.sub-header-container > .drop-down-container) {
  padding: 0;
}
@media only screen and (max-width: 800px) {
  onfigr .menu-panel .panel-container .layer-menu .body-container .menu-container .drop-down-container:not(.sub-header-container > .drop-down-container) {
    padding-bottom: 1rem;
  }
}
onfigr .menu-panel .panel-container .layer-menu .body-container .menu-container .drop-down {
  margin-left: auto;
}
@media only screen and (max-width: 800px) {
  onfigr .menu-panel .panel-container .layer-menu .body-container .menu-container {
    display: none;
  }
  onfigr .menu-panel .panel-container .layer-menu .body-container .menu-container.mobile-active {
    display: block;
  }
}
onfigr .menu-panel .panel-container .layer-menu .body-container .menu-container .item-modal-controls {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 0.5rem;
  margin-top: 1rem;
  gap: 1rem;
}
onfigr .menu-panel .panel-container .layer-menu .body-container .menu-container .item-modal-controls .item-modal-label {
  white-space: nowrap;
  width: max-content;
  font-size: 12px;
  font-weight: 600;
}
onfigr .menu-panel .panel-container .layer-menu .body-container .menu-container .item-modal-controls .button-container {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  min-width: 150px;
  width: 100%;
  font-size: 0.85rem;
  font-family: 'Poppins', sans-serif;
  border: 1px solid #f1f1f1;
  border-radius: 10px;
  padding: 0.5rem;
  margin: 0.5rem 0;
  cursor: pointer;
  transition: border-color 0.3s;
}
onfigr .menu-panel .panel-container .layer-menu .body-container .menu-container .item-modal-controls .button-container:hover {
  border-color: #2f2f2f;
}
onfigr .menu-panel .panel-container .layer-menu .body-container .menu-container .item-modal-controls .button-container .button-thumbnail {
  position: absolute;
  top: 50%;
  left: 5%;
  transform: translateY(-50%);
  width: 25px;
  height: 25px;
  border-radius: 5px;
}
onfigr .menu-panel .panel-container .layer-menu .body-container .menu-container .item-modal-controls .button-container .button-label {
  max-width: 80%;
  font-size: 0.8rem;
  margin-left: 2rem;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
onfigr .menu-panel .panel-container .layer-menu .body-container .sub-header-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
@media only screen and (max-width: 800px) {
  onfigr .menu-panel .panel-container .layer-menu .body-container .sub-header-container {
    padding-bottom: 1rem;
  }
}
onfigr .menu-panel .panel-container .layer-menu .body-container .sub-header-container.hidden {
  display: none;
}
onfigr .menu-panel .panel-container .layer-menu .body-container .sub-header-container .nested-name {
  font-size: 12px;
  font-weight: 600;
}
onfigr .menu-panel .panel-container .layer-menu .body-container .sub-header-container + .variants-tab {
  margin-top: 1rem;
}
@media only screen and (max-width: 800px) {
  onfigr .menu-panel .panel-container .layer-menu .body-container .sub-header-container + .variants-tab {
    margin-top: 0;
  }
}
@media only screen and (max-width: 800px) {
  onfigr .menu-panel .panel-container .layer-menu .body-container .sub-header-container + .tab {
    margin-bottom: 1rem;
  }
}
onfigr .menu-panel .panel-container .layer-menu .body-container .sub-header-container .menu-wrapper {
  display: flex;
  flex-direction: column;
  width: 100%;
  padding-top: 1rem;
}
onfigr .menu-panel .panel-container .layer-menu .body-container .sub-header-container .menu-wrapper .category-container {
  display: flex;
  position: relative;
  align-items: center;
  justify-content: space-around;
}
onfigr .menu-panel .panel-container .layer-menu .body-container .sub-header-container .menu-wrapper .category-container .category-label {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 90px;
  aspect-ratio: 1/1;
  border-radius: 0.5rem;
  border: 1px solid #f1f1f1;
  text-transform: capitalize;
  gap: 0.5rem;
  font-size: 0.8rem;
  cursor: pointer;
}
onfigr .menu-panel .panel-container .layer-menu .body-container .sub-header-container .menu-wrapper .category-container .category-label.active {
  border: 1px solid #2f2f2f;
}
onfigr .menu-panel .panel-container .layer-menu .body-container .sub-header-container .menu-wrapper .category-container .category-label input {
  position: absolute;
  display: none;
}
onfigr .menu-panel .panel-container .layer-menu .body-container .sub-filter-container {
  width: 100%;
  display: flex;
  flex-direction: column;
}
@media only screen and (max-width: 800px) {
  onfigr .menu-panel .panel-container .layer-menu .body-container .sub-filter-container {
    padding-bottom: 1rem;
  }
}
onfigr .menu-panel .panel-container .layer-menu .body-container .sub-filter-container.hidden {
  display: none;
}
onfigr .menu-panel .panel-container .layer-menu .body-container .sub-filter-container .filters-group {
  display: flex;
  flex-wrap: wrap;
  box-sizing: border-box;
  width: 100%;
}
onfigr .menu-panel .panel-container .layer-menu .body-container .sub-filter-container .filters-group.hidden {
  display: none;
}
onfigr .menu-panel .panel-container .layer-menu .body-container .sub-filter-container .filters-group .filter-item {
  margin-right: 0.15rem;
  padding: 0.25rem 0.25rem;
  accent-color: black;
  display: flex;
  justify-content: center;
  align-items: center;
}
onfigr .menu-panel .panel-container .layer-menu .body-container .sub-filter-container .filters-group .filter-item label {
  cursor: pointer;
  font-size: 0.9rem;
}
onfigr .menu-panel .panel-container .layer-menu .body-container .sub-filter-container .filters-group .filter-item input {
  display: none;
}
onfigr .menu-panel .panel-container .layer-menu .body-container .sub-filter-container .filters-group .filter-item.active label {
  font-size: 0.95rem;
  font-weight: 600;
}
onfigr .menu-panel .panel-container .layer-menu .body-container .sub-filter-container .filters-group .filter-item.hidden {
  display: none;
}
onfigr .menu-panel .panel-container .layer-menu .body-container .sub-filter-container .filters-group .filter-item:last-child {
  margin-right: 0;
}
onfigr .menu-panel .panel-container .layer-menu .body-container .items-container {
  width: 100%;
  box-sizing: border-box;
  overflow: hidden;
  position: relative;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(60px, 1fr));
  grid-auto-flow: row;
  gap: 0.25rem;
}
@media only screen and (max-width: 800px) {
  onfigr .menu-panel .panel-container .layer-menu .body-container .items-container {
    grid-auto-flow: column;
    overflow-x: scroll;
    grid-auto-columns: minmax(60px, 1fr);
    padding-bottom: 0.5rem;
  }
}
onfigr .menu-panel .panel-container .layer-menu .body-container .items-container.door_range {
  gap: 0.5rem;
}
onfigr .menu-panel .panel-container .layer-menu .body-container .items-container.groups {
  display: flex;
  flex-direction: column;
}
onfigr .menu-panel .panel-container .layer-menu .body-container .items-container.groups .group-container {
  display: flex;
  flex-direction: column;
}
onfigr .menu-panel .panel-container .layer-menu .body-container .items-container.groups .group-container.hidden {
  display: none;
}
onfigr .menu-panel .panel-container .layer-menu .body-container .items-container.groups .group-container .group-heading {
  margin-bottom: 5px;
}
onfigr .menu-panel .panel-container .layer-menu .body-container .items-container.groups .group-container .grouped-item-container {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(60px, 1fr));
  gap: 1rem;
}
@media only screen and (max-width: 800px) {
  onfigr .menu-panel .panel-container .layer-menu .body-container .items-container.groups .group-container .grouped-item-container {
    grid-template-columns: repeat(auto-fill, minmax(65px, 1fr));
  }
}
onfigr .menu-panel .panel-container .layer-menu .body-container .items-container .menu-item {
  position: relative;
  display: flex;
  cursor: pointer;
  border-radius: 5px;
  border: 2px solid transparent;
}
@media only screen and (max-width: 800px) {
  onfigr .menu-panel .panel-container .layer-menu .body-container .items-container .menu-item {
    flex-shrink: 0;
    aspect-ratio: 1 / 1;
  }
}
onfigr .menu-panel .panel-container .layer-menu .body-container .items-container .menu-item.hidden {
  display: none;
}
onfigr .menu-panel .panel-container .layer-menu .body-container .items-container .menu-item .thumbnail {
  height: 100%;
  width: 100%;
  object-fit: cover;
  border-radius: 4px;
}
onfigr .menu-panel .panel-container .layer-menu .body-container .items-container .menu-item.active {
  border-radius: 6px;
  border: 2px solid #2f2f2f;
}
onfigr .menu-panel .panel-container .layer-menu .thumbnail-container {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1.5rem;
}
onfigr .menu-panel .panel-container .layer-menu .thumbnail-container.hidden {
  display: none;
}
@media only screen and (max-width: 800px) {
  onfigr .menu-panel .panel-container .layer-menu .thumbnail-container {
    position: absolute;
    top: -3.25rem;
    left: 0;
    transform: translateZ(-5px);
  }
}
onfigr .menu-panel .panel-container .layer-menu .thumbnail-container img {
  width: 100%;
  height: 100%;
  max-width: 200px;
  max-height: 200px;
  margin: 0 auto;
  object-fit: cover;
  border-radius: 4px;
  border: 1px solid #ececec;
}
@media only screen and (max-width: 800px) {
  onfigr .menu-panel .panel-container .layer-menu .thumbnail-container img {
    display: none;
  }
}
onfigr .menu-panel .panel-container .layer-menu .thumbnail-container .thumbnail-label {
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  width: 100%;
  min-height: 40px;
  font-size: 0.8rem;
  font-weight: 600;
  background-color: #f1f1f1;
  padding: 0.5rem;
  border-radius: 6px;
}
@media only screen and (max-width: 800px) {
  onfigr .menu-panel .panel-container .layer-menu .thumbnail-container .thumbnail-label {
    padding: 1rem;
    min-height: 100px;
    background-color: #f1f1f1;
    justify-content: flex-start;
  }
}
onfigr .menu-panel .panel-container .layer-menu .thumbnail-container .thumbnail-label .label-product {
  max-width: 80%;
}
onfigr .menu-panel .panel-container .layer-menu .thumbnail-container .thumbnail-label .label-category {
  font-size: 0.8rem;
  font-weight: 400;
}
onfigr .menu-panel .panel-container .layer-menu .thumbnail-container .thumbnail-label .label-price {
  position: absolute;
  right: 0.5rem;
  top: 50%;
  transform: translateY(-50%);
  font-size: 0.75rem;
  font-weight: 400;
  color: #fff;
  background-color: #292929;
  padding: 0.2rem 0.5rem;
  clip-path: polygon(15% 0%, 100% 0, 100% 100%, 15% 100%, 0% 50%);
}
onfigr .menu-panel .panel-container .layer-menu .thumbnail-container .thumbnail-label .label-price.hidden {
  display: none;
}
@media only screen and (max-width: 800px) {
  onfigr .menu-panel .panel-container .layer-menu .thumbnail-container .thumbnail-label .label-price {
    top: 0.75rem;
    right: 1rem;
    transform: unset;
  }
}
onfigr .menu-list {
  position: absolute;
  top: 0;
  right: 0;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  padding: 0.5rem 1rem;
  overflow-y: scroll;
  transform: translateX(150%);
  background-color: #fff;
  will-change: transform;
  transition: transform 0.25s ease-in-out;
}
onfigr .menu-list.active {
  transform: translateX(0);
}
@media only screen and (max-width: 800px) {
  onfigr .menu-list.active {
    transform: translateY(0);
  }
}
@media only screen and (max-width: 800px) {
  onfigr .menu-list {
    overflow: hidden;
    padding: 0;
    padding: 0 1rem;
    border-radius: 6px 6px 0 0;
    pointer-events: auto;
    top: unset;
    bottom: 0;
    overflow: unset;
    transform: translateY(150%);
    height: auto;
  }
}
onfigr .menu-list .mobile-header {
  width: 100%;
  align-items: center;
  justify-content: space-between;
  display: none;
  padding: 1rem 0;
  border-bottom: 1px solid #2f2f2f;
}
@media only screen and (max-width: 800px) {
  onfigr .menu-list .mobile-header {
    display: flex;
  }
}
onfigr .menu-list .mobile-header .title {
  font-size: clamp(20px, 5vw, 28px);
  font-weight: 600;
}
onfigr .menu-list .mobile-header .close-button {
  display: flex;
  align-items: center;
  padding: 0.25rem;
  background-color: #ffffff;
  border: none;
  border-radius: 5px;
  color: #151515;
}
onfigr .menu-list .mobile-header .close-button:active {
  background-color: #e4e4e4;
}
onfigr .menu-list .mobile-header .close-button .icon {
  margin: auto 0;
  width: 20px;
  height: 20px;
}
onfigr .menu-list .list-container {
  width: 100%;
  position: relative;
  overflow: hidden;
  display: flex;
  gap: 10px;
  flex-direction: column;
}
@media only screen and (max-width: 800px) {
  onfigr .menu-list .list-container {
    flex-direction: row;
    overflow-x: auto;
  }
}
onfigr .menu-list .list-container .list-item {
  width: 100%;
  padding: 0.5rem 3rem 0.5rem 0.5rem;
  box-sizing: border-box;
  text-align: center;
  display: flex;
  gap: 1.5rem;
  align-items: center;
  border: 2px solid #e4e4e4;
  border-radius: 5px;
  position: relative;
  background-color: #ffffff;
  cursor: pointer;
  will-change: border-color;
  transition: border-color 0.25s ease-in-out;
}
@media only screen and (max-width: 800px) {
  onfigr .menu-list .list-container .list-item {
    flex-direction: column;
    padding: 0;
    border: none;
    gap: 10px;
    margin: 1rem 0;
  }
}
onfigr .menu-list .list-container .list-item.mobile-only {
  display: none;
}
@media only screen and (max-width: 800px) {
  onfigr .menu-list .list-container .list-item.mobile-only {
    display: flex;
  }
}
onfigr .menu-list .list-container .list-item.hidden {
  display: none;
}
onfigr .menu-list .list-container .list-item .thumbnail-container {
  width: 60px;
  height: 60px;
  border-radius: 5px;
  flex-shrink: 0;
}
@media only screen and (max-width: 800px) {
  onfigr .menu-list .list-container .list-item .thumbnail-container {
    width: 80px;
    height: 80px;
  }
}
onfigr .menu-list .list-container .list-item .thumbnail-container img {
  width: 100%;
  height: 100%;
  border-radius: 5px;
  object-fit: cover;
}
onfigr .menu-list .list-container .list-item .text-container {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
onfigr .menu-list .list-container .list-item .text-container .display-name {
  font-size: clamp(14px, 1.5vw, 16px);
  font-weight: 500;
  color: #151515;
  text-align: left;
}
onfigr .menu-list .list-container .list-item .text-container .selected-items-container {
  display: flex;
}
@media only screen and (max-width: 800px) {
  onfigr .menu-list .list-container .list-item .text-container .selected-items-container {
    display: none;
  }
}
onfigr .menu-list .list-container .list-item .text-container .selected-items-container .selection {
  text-align: left;
  font-size: clamp(10px, 5vw, 12px);
  color: #666e85;
}
onfigr .menu-list .list-container .list-item .chevron-icon {
  position: absolute;
  right: 1rem;
  top: 0;
  bottom: 0;
  margin: auto 0;
  width: 24px;
  height: 24px;
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iNDgiIHdpZHRoPSI0OCI+PHBhdGggZD0ibTI0IDMwLjc1LTEyLTEyIDIuMTUtMi4xNUwyNCAyNi41bDkuODUtOS44NUwzNiAxOC44WiIvPjwvc3ZnPg==);
  background-size: 24px;
  transition: transform 0.3s ease-in-out;
  rotate: -90deg;
}
@media only screen and (max-width: 800px) {
  onfigr .menu-list .list-container .list-item .chevron-icon {
    display: none;
  }
}
onfigr .menu-list .list-container .list-item:hover {
  border-color: #2f2f2f;
}
onfigr .save-design {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  z-index: -4;
  pointer-events: none;
  opacity: 0;
  display: none;
  /* stylelint-disable scss/no-global-function-names */
}
onfigr .save-design.active {
  display: block;
  pointer-events: auto;
  z-index: 4;
  opacity: 1;
}
@media only screen and (max-width: 800px) {
  onfigr .save-design.active {
    width: 100%;
    height: 100%;
    top: unset;
    left: 0;
    bottom: 0;
    transform: unset;
  }
}
onfigr .save-design .save-and-design {
  width: 100%;
  height: fit-content;
  max-width: 500px;
  max-height: 50%;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  background-color: #ffffff;
  border: 1px solid #e4e4e4;
  border-radius: 10px;
  padding: 2rem;
  opacity: 0;
  pointer-events: auto;
  box-sizing: border-box;
  will-change: transform;
  transition: transform 0.2s ease-in-out;
  box-shadow: 6px 6px 25px 0px rgba(0, 0, 0, 0.75);
}
@media only screen and (max-width: 1180px) {
  onfigr .save-design .save-and-design {
    padding: 0 2rem;
  }
}
@media only screen and (max-width: 800px) {
  onfigr .save-design .save-and-design {
    top: unset;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    max-height: 100%;
    padding: 2rem;
    transform: translateY(100%);
  }
}
onfigr .save-design .save-and-design.active {
  pointer-events: auto;
  opacity: 1;
}
@media only screen and (max-width: 800px) {
  onfigr .save-design .save-and-design.active {
    transform: translateY(0);
  }
}
onfigr .save-design .save-and-design .save-and-design-container {
  width: 100%;
  margin: 0 auto;
  height: 100%;
  gap: 2rem;
  display: flex;
  flex-direction: column;
}
@media only screen and (max-width: 800px) {
  onfigr .save-design .save-and-design .save-and-design-container {
    padding: 0;
  }
}
onfigr .save-design .save-and-design .save-and-design-container .desktop-header {
  width: 100%;
  display: flex;
  flex-direction: column;
}
onfigr .save-design .save-and-design .save-and-design-container .desktop-header .title-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid #202020;
}
onfigr .save-design .save-and-design .save-and-design-container .desktop-header .title-container .title {
  font-weight: 600;
  font-size: clamp(1.2rem, 1vw, 1.5rem);
}
onfigr .save-design .save-and-design .save-and-design-container .body {
  display: flex;
  position: relative;
  max-height: 100%;
  overflow: hidden;
}
@media only screen and (max-width: 800px) {
  onfigr .save-design .save-and-design .save-and-design-container .body {
    height: 100%;
    max-height: calc(100% - 200px - 1rem);
    overflow: hidden;
    margin: 10px 0;
  }
}
onfigr .save-design .save-and-design .save-and-design-container .body .subtitle {
  display: none;
  margin-bottom: 1rem;
  color: #676767;
  font-weight: 500;
}
onfigr .save-design .save-and-design .save-and-design-container .footer {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
onfigr .save-design .save-and-design .save-and-design-container .footer .powered-by {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
@media only screen and (max-width: 800px) {
  onfigr .save-design .save-and-design .save-and-design-container .footer .powered-by {
    display: none;
  }
}
onfigr .save-design .save-and-design .save-and-design-container .footer .powered-by .text {
  font-size: 0.6rem;
  color: #676767;
}
onfigr .save-design .save-and-design .save-and-design-container .footer .powered-by .onfigr-icon {
  display: flex;
  justify-content: center;
  height: 18px;
  color: #000;
}
onfigr .save-design .save-and-design .save-and-design-container .footer .powered-by .onfigr-icon svg {
  width: 100%;
  height: 100%;
}
onfigr .save-design .save-and-design .save-and-design-container .footer .button-container {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 2rem 0 0.25rem 0;
}
@media only screen and (max-width: 800px) {
  onfigr .save-design .save-and-design .save-and-design-container .footer .button-container {
    width: 100%;
    flex-direction: column;
    padding: 0;
  }
}
onfigr .save-design .save-and-design .save-and-design-container .footer .button-container .save-btn,
onfigr .save-design .save-and-design .save-and-design-container .footer .button-container .cancel-btn {
  @include button();
  will-change: background-color;
  transition: background-color 150ms ease-in-out;
}
@media only screen and (max-width: 800px) {
  onfigr .save-design .save-and-design .save-and-design-container .footer .button-container .save-btn,
  onfigr .save-design .save-and-design .save-and-design-container .footer .button-container .cancel-btn {
    width: 100%;
  }
}
onfigr .save-design .save-and-design .save-and-design-container .footer .button-container .cancel-btn {
  outline: 1px solid #e4e4e4;
  background-color: #ffffff;
}
onfigr .save-design .save-and-design .save-and-design-container .footer .button-container .cancel-btn:hover {
  background-color: #d9d9d9;
}
onfigr .save-design .save-and-design .save-and-design-container .footer .button-container .save-btn {
  background-color: #292929;
  color: #ffffff;
  font-weight: 600;
}
onfigr .save-design .save-and-design .save-and-design-container .footer .button-container .save-btn:hover {
  background-color: #434343;
}
onfigr .save-design .save-and-design .save-and-design-container .contact {
  padding: 0 1rem;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  justify-content: center;
  overflow-y: auto;
}
@media only screen and (max-width: 800px) {
  onfigr .save-design .save-and-design .save-and-design-container .contact {
    width: 100%;
    height: 100%;
    padding: 0 5px 1rem 5px;
  }
}
onfigr .save-design .save-and-design .save-and-design-container .contact .contact-container {
  width: 100%;
  height: 100%;
}
onfigr .save-design .save-and-design .save-and-design-container .contact .contact-container input {
  accent-color: #434343;
}
onfigr .save-design .save-and-design .save-and-design-container .contact .contact-container .form-description {
  font-size: 0.9rem;
  margin: 0 0 1rem 0;
}
onfigr .save-design .save-and-design .save-and-design-container .contact .contact-container .required {
  font-size: 12px;
  color: red;
}
onfigr .save-design .save-and-design .save-and-design-container .contact .contact-container .form-container {
  margin: 1rem 0;
}
onfigr .save-design .save-and-design .save-and-design-container .contact .contact-container .form-container .input {
  width: 100%;
  appearance: none;
  /* Firefox */
  font-size: 12px;
  padding: 10px 10px;
  border: none;
  background-color: #f1f1f1;
  border-radius: 8px;
  margin: 5px 0;
}
onfigr .save-design .save-and-design .save-and-design-container .contact .contact-container .form-container .input::-webkit-outer-spin-button,
onfigr .save-design .save-and-design .save-and-design-container .contact .contact-container .form-container .input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
onfigr .save-design .save-and-design .save-and-design-container .contact .contact-container .form-container .input[type='number'] {
  -moz-appearance: textfield;
}
onfigr .save-design .save-and-design .save-and-design-container .contact .contact-container .form-container .input:focus {
  outline-color: #676767;
}
onfigr .save-design .save-and-design .save-and-design-container .contact .contact-container .form-container .form-group {
  display: flex;
  gap: 10px;
}
onfigr .save-design .save-and-design .save-and-design-container .contact .contact-container .check-label {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: #676767;
  cursor: pointer;
}
onfigr .save-design .save-and-design .save-and-design-container .contact .contact-container .check-label a {
  color: #676767;
  font-size: 0.9rem;
}
onfigr .save-design .save-and-design .save-and-design-container .contact .contact-container .check-label input[type='checkbox'] {
  cursor: pointer;
}
onfigr .save-design .save-and-design .save-and-design-container .contact .contact-container .question {
  margin: 1rem 0;
  font-weight: 500;
}
onfigr .save-design .save-and-design .save-and-design-container .contact .contact-container .button-container {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 2rem 0 0.25rem 0;
}
@media only screen and (max-width: 800px) {
  onfigr .save-design .save-and-design .save-and-design-container .contact .contact-container .button-container {
    width: 100%;
    flex-direction: column;
  }
}
onfigr .save-design .save-and-design .save-and-design-container .contact .contact-container .button-container .save-btn,
onfigr .save-design .save-and-design .save-and-design-container .contact .contact-container .button-container .cancel-btn {
  @include button();
  will-change: background-color;
  transition: background-color 150ms ease-in-out;
}
@media only screen and (max-width: 800px) {
  onfigr .save-design .save-and-design .save-and-design-container .contact .contact-container .button-container .save-btn,
  onfigr .save-design .save-and-design .save-and-design-container .contact .contact-container .button-container .cancel-btn {
    width: 100%;
  }
}
onfigr .save-design .save-and-design .save-and-design-container .contact .contact-container .button-container .cancel-btn {
  outline: 1px solid #e4e4e4;
  background-color: #ffffff;
}
onfigr .save-design .save-and-design .save-and-design-container .contact .contact-container .button-container .cancel-btn:hover {
  background-color: #d9d9d9;
}
onfigr .save-design .save-and-design .save-and-design-container .contact .contact-container .button-container .save-btn {
  background-color: #292929;
  color: #ffffff;
  font-weight: 600;
}
onfigr .save-design .save-and-design .save-and-design-container .contact .contact-container .button-container .save-btn:hover {
  background-color: #434343;
}
onfigr .contact-form-notification {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  display: none;
  opacity: 0;
  justify-content: center;
  align-items: center;
}
onfigr .contact-form-notification.active {
  display: flex;
  pointer-events: auto;
  opacity: 1;
  transition: opacity 0.2s ease-in-out;
}
onfigr .contact-form-notification .notify-box {
  background-color: #ffffff;
  padding: 2rem;
  border-radius: 20px;
  max-width: 450px;
  box-shadow: 5px 5px 5px rgba(67, 67, 67, 0.5);
  display: flex;
  align-items: center;
  gap: 2rem;
  will-change: transform, opacity;
  transition: transform 0.2s ease-in-out, opacity 0.2s ease-in-out;
  transform: translateY(100%);
  opacity: 0;
  pointer-events: none;
}
onfigr .contact-form-notification .notify-box.active {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
  z-index: 4;
}
@media only screen and (max-width: 800px) {
  onfigr .contact-form-notification .notify-box {
    width: 100%;
    height: 100%;
    justify-content: center;
    flex-direction: column;
  }
}
onfigr .contact-form-notification .notify-box .notification-icon {
  width: 100px;
  min-width: 75px;
  height: 100px;
}
@media only screen and (max-width: 800px) {
  onfigr .contact-form-notification .notify-box .notification-icon {
    width: 50px;
    height: 50px;
  }
}
onfigr .contact-form-notification .notify-box .notification-icon svg {
  width: 100%;
  height: 100%;
}
onfigr .contact-form-notification .notify-box .notification-content {
  display: flex;
  flex-direction: column;
  align-items: start;
}
@media only screen and (max-width: 800px) {
  onfigr .contact-form-notification .notify-box .notification-content {
    align-items: center;
    text-align: center;
  }
}
onfigr .contact-form-notification .notify-box .notification-content .notification-title {
  font-size: clamp(16px, 5vw, 24px);
  font-weight: 600;
  color: #434343;
}
onfigr .contact-form-notification .notify-box .notification-content .notification-subtext {
  color: #8d99a4;
  margin-top: 5px;
}
onfigr .contact-form-notification .notify-box .notification-content .content-button {
  background-color: #434343;
  color: #ffffff;
  margin-top: 1.5rem;
}
onfigr .contact-form-notification .notify-box .notification-content .content-button:hover {
  background-color: #1c1c1c;
}
onfigr .ui-container {
  position: absolute;
  box-sizing: border-box;
  padding: 1rem 2rem;
  top: 0;
  right: 0;
  width: clamp(300px, 40vw, 400px);
  max-width: 100%;
  height: 100%;
  background-color: #fff;
  overflow: hidden;
  touch-action: none;
  -webkit-user-drag: none;
  display: flex;
  flex-direction: column;
}
onfigr .ui-container .mobile-menu {
  display: none;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  padding: 2rem;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1rem;
}
@media only screen and (max-width: 800px) {
  onfigr .ui-container .mobile-menu {
    display: flex;
  }
}
onfigr .ui-container .mobile-menu button {
  width: 100%;
  padding: 0.675rem 1rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  border-radius: 5px;
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-style: normal;
  border: none;
  pointer-events: auto;
  color: #151515;
}
onfigr .ui-container .mobile-menu button .icon {
  width: 16px;
  height: 16px;
}
onfigr .ui-container .mobile-menu button .icon svg {
  height: 100%;
  width: 100%;
}
onfigr .ui-container .mobile-menu button .label {
  font-size: 12px;
  font-weight: 500;
}
onfigr .ui-container .mobile-menu .menus-section {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 1rem;
}
onfigr .ui-container .mobile-menu .presets-button,
onfigr .ui-container .mobile-menu .customise-button {
  box-shadow: 0 0 0 1px #151515;
  background-color: #ffffff;
}
onfigr .ui-container .mobile-menu .save-design-button {
  background-color: #151515;
  color: #ffffff;
}
onfigr .ui-container .style-finder-desktop-button {
  width: 100%;
  color: #ffffff;
  background: linear-gradient(to right, #c026d3, #f43f5e);
  margin-top: 1rem;
}
onfigr .ui-container .style-finder-desktop-button .text {
  font-weight: 700;
  font-size: 16px;
}
onfigr .ui-container .style-finder-desktop-button .icon {
  width: 20px;
  height: 20px;
}
@media only screen and (max-width: 800px) {
  onfigr .ui-container .style-finder-desktop-button {
    display: none;
  }
}
onfigr .ui-container .sections-panel {
  width: 100%;
  margin-top: 1rem;
}
@media only screen and (max-width: 800px) {
  onfigr .ui-container .sections-panel {
    display: none;
    margin-top: 0;
  }
}
onfigr .ui-container .panel-body {
  margin-top: 1rem;
  flex: 1;
  position: relative;
}
@media only screen and (max-width: 800px) {
  onfigr .ui-container .panel-body {
    margin-top: 0;
    position: absolute;
    left: 0;
    width: 100%;
    height: 100%;
    flex: unset;
  }
}
@media only screen and (max-width: 800px) {
  onfigr .ui-container {
    top: unset;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    margin: 0 auto;
    border-radius: 0;
    padding: 0;
    background-color: transparent;
    pointer-events: none;
  }
}
onfigr .upload-modal-content {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  align-items: center;
  position: relative;
  padding-top: 1rem;
}
onfigr .upload-modal-content .close-icon {
  padding: 0.3rem;
  background: none;
  border-radius: 8px;
  background-color: transparent;
  border: none;
  width: 40px;
  height: 40px;
  cursor: pointer;
  position: absolute;
  top: 0rem;
  right: 0rem;
  transition: background-color 0.1s ease-in-out;
}
onfigr .upload-modal-content .close-icon:hover {
  background-color: rgba(0, 0, 0, 0.1);
}
onfigr .upload-modal-content .close-icon .icon {
  width: 24px;
  height: 24px;
}
onfigr .upload-modal-content .title {
  font-size: 16px;
  text-align: center;
  padding: 1rem;
  text-wrap: balance;
}
onfigr .upload-modal-content .title span {
  font-weight: 600;
}
onfigr .upload-modal-content .footer {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  margin-top: -4rem;
}
@media only screen and (max-width: 800px) {
  onfigr .upload-modal-content .footer {
    margin-top: -2rem;
  }
}
onfigr .upload-modal-content .footer .upload-button {
  padding: 0.5rem 1.5rem;
  background: none;
  border-radius: 8px;
  background-color: #151515;
  border: 1px solid #151515;
  color: #ffffff;
  font-family: 'Poppins', sans-serif;
  cursor: pointer;
}
onfigr .upload-modal-content .footer .logo {
  display: inline-flex;
  gap: 5px;
  align-items: center;
  font-size: 12px;
}
onfigr .upload-modal-content .footer .logo .logo-link {
  display: grid;
  place-content: center;
}
onfigr .upload-modal-content .footer .logo .logo-link .logo-wrapper {
  height: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
onfigr .upload-modal-content .footer .logo .logo-link .logo-wrapper svg {
  width: 100%;
  height: 100%;
}
onfigr [modal-name='style-finder-results-modal'] .modal-content {
  max-width: 1000px;
}
@media only screen and (max-width: 1180px) {
  onfigr [modal-name='style-finder-results-modal'] .modal-content {
    max-width: 600px;
  }
}
onfigr [modal-name='style-finder-results-modal'] .modal-content .results-modal-content {
  width: 100%;
}
onfigr [modal-name='style-finder-results-modal'] .modal-content .results-modal-content .error-container {
  display: none;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  text-align: center;
  text-wrap: balance;
}
onfigr [modal-name='style-finder-results-modal'] .modal-content .results-modal-content .error-container.active {
  display: flex;
}
onfigr [modal-name='style-finder-results-modal'] .modal-content .results-modal-content .error-container .error-icon {
  width: 30px;
  height: 30px;
  color: red;
}
onfigr [modal-name='style-finder-results-modal'] .modal-content .results-modal-content .error-container .error-icon svg {
  width: 100%;
  height: 100%;
}
onfigr [modal-name='style-finder-results-modal'] .modal-content .results-modal-content .error-container .try-again-button {
  padding: 0.5rem 1.5rem;
  background: none;
  border-radius: 8px;
  background-color: #151515;
  border: 1px solid #151515;
  color: #ffffff;
  font-family: 'Poppins', sans-serif;
  cursor: pointer;
}
onfigr [modal-name='style-finder-results-modal'] .modal-content .results-modal-content .processing-container {
  display: none;
  align-items: center;
  padding: 1rem;
  gap: 4rem;
}
@media only screen and (max-width: 800px) {
  onfigr [modal-name='style-finder-results-modal'] .modal-content .results-modal-content .processing-container {
    flex-direction: column;
    gap: 2rem;
  }
}
onfigr [modal-name='style-finder-results-modal'] .modal-content .results-modal-content .processing-container.active {
  display: flex;
}
onfigr [modal-name='style-finder-results-modal'] .modal-content .results-modal-content .processing-container .processing-image {
  flex: 1;
  max-width: 400px;
  width: 100%;
}
onfigr [modal-name='style-finder-results-modal'] .modal-content .results-modal-content .processing-container .processing-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 200px;
}
onfigr [modal-name='style-finder-results-modal'] .modal-content .results-modal-content .processing-container .processing-content .processing-title {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}
onfigr [modal-name='style-finder-results-modal'] .modal-content .results-modal-content .processing-container .processing-content .processing-title .processing-icon {
  display: inline-flex;
  width: 30px;
  height: 30px;
  animation: rotating 2s linear infinite;
  align-items: center;
  justify-content: center;
}
onfigr [modal-name='style-finder-results-modal'] .modal-content .results-modal-content .processing-container .processing-content .processing-title .processing-icon svg {
  width: 100%;
  height: 100%;
}
onfigr [modal-name='style-finder-results-modal'] .modal-content .results-modal-content .processing-container .processing-content .processing-title .processing-text {
  font-size: 20px;
  font-weight: 500;
}
@media only screen and (max-width: 800px) {
  onfigr [modal-name='style-finder-results-modal'] .modal-content .results-modal-content .processing-container .processing-content .processing-title .processing-text {
    font-size: 16px;
  }
}
onfigr [modal-name='style-finder-results-modal'] .modal-content .results-modal-content .processing-container .processing-content .processing-info-text {
  font-size: 14px;
  margin-top: 1rem;
  opacity: 0;
  animation: blur-reveal 0.5s ease-in-out 0.5s forwards;
}
@-webkit-keyframes rotating {
  /* Safari and Chrome */
  from {
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes rotating {
  from {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -ms-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes blur-reveal {
  0% {
    opacity: 0;
    filter: blur(10px);
  }
  100% {
    opacity: 1;
    filter: blur(0);
  }
}
onfigr .desktop-save-button {
  width: 100%;
  height: 45px;
  background-color: #292929;
  color: #ffffff;
  transition: background-color 150ms ease-in-out;
}
onfigr .desktop-save-button:hover {
  background-color: #434343;
}
onfigr .desktop-save-button p {
  font-weight: bold;
}
@media only screen and (max-width: 800px) {
  onfigr .desktop-save-button {
    display: none;
  }
}
onfigr .client-logo {
  height: auto;
  position: absolute;
  left: 2rem;
  bottom: 2rem;
  padding: 1rem;
  background-color: #ffffff;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border: 1px solid #f1f1f1;
  border-radius: 5px;
  font-size: 14px;
}
onfigr .client-logo.active {
  width: 140px;
  padding: 0;
  background-color: transparent;
  border: none;
}
@media only screen and (max-width: 800px) {
  onfigr .client-logo {
    bottom: unset;
    top: 1rem;
    left: 1rem;
    width: 110px;
    height: 30px;
    padding: 0.2rem;
    font-size: 10px;
  }
}
onfigr .onfigr-logo {
  position: absolute;
  left: 1rem;
  top: 10rem;
  width: 40px;
  z-index: 3;
  cursor: pointer;
}
onfigr .onfigr-logo svg {
  width: 100%;
  height: 100%;
}
@media only screen and (max-width: 800px) {
  onfigr .onfigr-logo {
    display: none;
    left: unset;
    right: 1rem;
    top: 1rem;
  }
}
onfigr .onfigr-logo-mobile {
  display: none;
  position: absolute;
  right: 1rem;
  top: 1rem;
  width: 20px;
  z-index: 20;
  opacity: 0.7;
  cursor: pointer;
  pointer-events: unset;
}
onfigr .onfigr-logo-mobile.bottom {
  top: unset;
  right: 10px;
}
onfigr .pricing-container {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 45px;
  top: 1rem;
  right: calc(calc(clamp(21.875rem, 40vw, 25rem)) + 2rem);
  gap: 0.5rem;
  padding: 0 1.5rem;
  background-color: white;
  border-radius: 0.25rem;
  box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.4);
  transform: unset;
  cursor: pointer;
}
onfigr .pricing-container:hover {
  color: white;
  background-color: #333;
}
@media only screen and (max-width: 800px) {
  onfigr .pricing-container {
    width: 80%;
    right: 50%;
    min-height: 40px;
    padding: 0 1rem;
    transform: translateX(50%);
    box-shadow: 0 0 0 1px #151515;
    background-color: #ffffff;
  }
}
onfigr .pricing-container .pricing-title {
  display: flex;
  align-items: center;
  font-family: var(--font-family);
  font-weight: 500;
  font-size: 0.9rem;
  padding: 0;
  margin: 0;
  gap: 0.25rem;
  white-space: nowrap;
}
onfigr .pricing-container .pricing-title .pricing-icon {
  display: inline-block;
  width: 20px;
  height: 20px;
}
onfigr .pricing-container .pricing-value {
  font-family: var(--font-family);
  font-weight: 600;
  font-size: 1rem;
  color: #151515;
  padding: 0;
  margin: 0;
  white-space: nowrap;
}
@media only screen and (max-width: 800px) {
  onfigr .pricing-container .pricing-value {
    font-size: 0.8rem;
    gap: 0.125rem;
  }
}
onfigr .pricing-container .pricing-icon {
  display: flex;
  width: 18px;
  height: 18px;
  padding-bottom: 3px;
}
@media only screen and (max-width: 800px) {
  onfigr .pricing-container .pricing-icon {
    position: absolute;
    right: 0.5rem;
    top: 50%;
    transform: translateY(-50%);
  }
}
onfigr .pricing-container .upgrade-list {
  display: none;
  flex-direction: column;
  gap: 0.25rem;
  padding: 0.5rem 0.25rem 0.5rem 0.25rem;
  overflow-y: auto;
}
onfigr .pricing-container .upgrade-list.open {
  display: flex;
}
onfigr .pricing-container .upgrade-list .upgrade-item-title {
  font-size: 0.75rem;
  font-weight: 600;
  text-decoration: underline;
}
onfigr .pricing-container .upgrade-list .upgrade-item-detail {
  display: flex;
  justify-content: space-between;
  padding: 0;
  margin: 0;
  gap: 0.5rem;
  font-size: 0.8rem;
}
onfigr .summary-modal-content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  max-height: 60vh;
  overflow: hidden;
}
@media only screen and (max-width: 800px) {
  onfigr .summary-modal-content {
    height: 100%;
    max-height: 100%;
    gap: 0.5rem;
  }
}
onfigr .summary-modal-content .summary-modal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1rem 0;
  margin: 0 1rem;
  border-bottom: 1px solid #2f2f2f;
}
@media only screen and (max-width: 800px) {
  onfigr .summary-modal-content .summary-modal-header {
    padding: 0.5rem 0;
    margin: 0;
  }
}
onfigr .summary-modal-content .summary-modal-header .summary-modal-title {
  font-size: 1.25rem;
  font-weight: 600;
}
@media only screen and (max-width: 800px) {
  onfigr .summary-modal-content .summary-modal-header .summary-modal-title {
    font-size: 1rem;
  }
}
onfigr .summary-modal-content .summary-modal-header .modal-close-button {
  padding: 0 0.5rem;
  font-size: 1.25rem;
  border-radius: 6px;
  cursor: pointer;
}
onfigr .summary-modal-content .summary-modal-header .modal-close-button:hover {
  background-color: rgba(0, 0, 0, 0.1);
}
onfigr .summary-modal-content .upgrade-list {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  height: 100%;
  padding: 1rem;
  overflow-y: scroll;
  font-size: 0.875rem;
  font-weight: 400;
}
@media only screen and (max-width: 800px) {
  onfigr .summary-modal-content .upgrade-list {
    gap: 1rem;
    padding: 0.5rem;
    overflow-y: auto;
  }
}
onfigr .summary-modal-content .upgrade-list .upgrade-item {
  display: flex;
  gap: 2rem;
}
@media only screen and (max-width: 800px) {
  onfigr .summary-modal-content .upgrade-list .upgrade-item {
    gap: 1.5rem;
  }
}
onfigr .summary-modal-content .upgrade-list .upgrade-item .upgrade-item-thumbnail {
  width: 75px;
  min-width: 75px;
  height: 75px;
  min-height: 75px;
  background-size: cover;
  border-radius: 6px;
  box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.4);
  border: 1px solid transparent;
}
onfigr .summary-modal-content .upgrade-list .upgrade-item .upgrade-item-thumbnail:hover {
  border-color: #2f2f2f;
  cursor: pointer;
}
@media only screen and (max-width: 800px) {
  onfigr .summary-modal-content .upgrade-list .upgrade-item .upgrade-item-thumbnail {
    width: 55px;
    min-width: 55px;
    height: 55px;
    min-height: 55px;
  }
}
onfigr .summary-modal-content .upgrade-list .upgrade-item .upgrade-item-details {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
onfigr .summary-modal-content .upgrade-list .upgrade-item .upgrade-item-details .upgrade-item-text {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
}
onfigr .summary-modal-content .upgrade-list .upgrade-item .upgrade-item-details .upgrade-item-text .upgrade-item-title {
  font-size: 1rem;
  font-weight: 600;
}
@media only screen and (max-width: 800px) {
  onfigr .summary-modal-content .upgrade-list .upgrade-item .upgrade-item-details .upgrade-item-text .upgrade-item-title {
    font-size: 0.8rem;
  }
}
onfigr .summary-modal-content .upgrade-list .upgrade-item .upgrade-item-details .upgrade-item-text:hover {
  cursor: pointer;
}
onfigr .summary-modal-content .upgrade-list .upgrade-item .upgrade-item-details .upgrade-item-text:hover p {
  text-decoration: underline;
}
@media only screen and (max-width: 800px) {
  onfigr .summary-modal-content .upgrade-list .upgrade-item .upgrade-item-details p {
    font-size: 0.7rem;
  }
}
onfigr .summary-modal-content .upgrade-list .upgrade-item .upgrade-item-details .upgrade-item-price {
  flex: 0 0 auto;
  display: flex;
  font-size: 0.75rem;
  font-weight: 400;
  color: #fff;
  background-color: #151515;
  padding: 0.2rem 0.75rem;
  clip-path: polygon(15% 0%, 100% 0, 100% 100%, 15% 100%, 0% 50%);
}
@media only screen and (max-width: 800px) {
  onfigr .summary-modal-content .upgrade-list .upgrade-item .upgrade-item-details .upgrade-item-price {
    font-size: 0.625rem;
    padding: 0.1rem 0.35rem;
  }
}
onfigr .mobile-x {
  display: none;
  place-content: center;
  width: 40px;
  height: 40px;
  border-radius: 9999px;
  background-color: #ffffff;
  position: absolute;
  top: 0.8rem;
  right: 0.8rem;
  border: none;
  color: #151515;
  pointer-events: auto;
}
onfigr .mobile-x svg {
  width: 24px;
  height: 24px;
  stroke-width: 2;
}
@media only screen and (max-width: 800px) {
  onfigr .mobile-x {
    display: grid;
  }
}