html {height: 100%; } body {height: 100%;padding-top: 4rem; } .form {display: flex;flex-direction: column;height: 100%; } .btn {display: inline-flex; } .btn.btn-more {padding: 0.625rem;color: var(--body-color);background: #d9d9d9;font-size: 1rem;text-decoration: none;width: 100%; } .btn.btn-more svg {transition: transform 250ms;margin-top: 1px; } .btn.btn-more.collapsed svg {transform: rotate(180deg); } .btn.btn-more:not(.collapsed) {margin-bottom: 0; } .btn.btn-more.btn-more-advanced {margin-bottom: 2rem; } .btn.btn-submit {display: inline-flex;align-items: center;justify-content: center; } .btn.btn-submit .spinner-border {position: absolute;display: none; } .btn.btn-submit.loading .spinner-border {display: block; } .btn.btn-submit.loading span {display: none; } .border-btn {border-top: 1px solid #d9d9d9; } .invalid-tooltip {list-style-type: none;left: auto;right: 0.5rem;top: calc(100% - 1.125rem); } .form-header {margin-bottom: 1.5625rem; } .form-fieldset:not(.form-fieldset-advanced) {margin-bottom: 1.25rem; } .form-fieldset:last-child {margin-bottom: 0; } .form-fieldset-more {margin-top: -1rem; } .form-fieldset-more .form-fieldset {padding: 0; } .form-fieldset-advanced {display: none; } .form-fieldset-advanced.show {display: block !important; } .form-fieldset-advanced hr {display: none; } .form-fieldset-advanced .form-group-product:first-child {margin-top: 1rem; } .custom-checkbox .custom-control-input {left: 0;top: 0.25rem; } .form-group .col label {min-height: 2.6875rem;display: flex;align-items: center; } .form-group .col p {margin-bottom: 0; } .form-group.form-group-product .product-name {display: flex;height: 2.8625rem;flex-direction: column;justify-content: center; } .form-group .input-group-text {font-size: 1.25rem;padding: 0 0.625rem;border-left: 0; } .collapse-content {display: none; } .collapse-content.show {display: block; } .hr-r {border-right: solid 1px var(--hr-border-color); } .tab-content {display: flex;flex-direction: row;min-height: 100%;width: 100% !important; } .row-btn-group {margin-top: 2rem; } .header {position: fixed;top: 0;width: 100%;z-index: 100;min-width: 270px;max-width: 1920px;background-color: #f6f6f7; } .header .navbar {height: 4.5rem;background: var(--light);justify-content: space-between;flex-wrap: nowrap;padding: 0;border-bottom: solid 1px var(--light); } @media (max-width: 1099.98px) {.header .navbar {height: 4rem;} } .header .navbar .navbar-brand {display: flex;align-items: center;justify-content: flex-start;font-size: 1.625rem;text-transform: none;font-weight: 600;color: var(--black);height: 100%;padding: 0; } @media (max-width: 991.98px) {.header .navbar .navbar-brand {flex-direction: column;align-items: center;justify-content: center;width: 100%;} } .header .navbar .navbar-brand img {display: block;max-height: 80%;max-width: 18.9375rem;margin-left: 1.25rem; } @media (max-width: 380px) {.header .navbar .navbar-brand img {max-width: 135px;margin-bottom: 4px;margin-top: 7px;} } @media (max-width: 991.98px) {.header .navbar .navbar-brand img {max-width: 135px;margin-bottom: 4px;margin-top: 7px;} } .header .navbar .navbar-brand span {position: relative;display: block;font-size: 1rem;text-transform: uppercase;color: gray;font-weight: normal; } @media (min-width: 992px) {.header .navbar .navbar-brand span {padding-left: 2.875rem;top: 0.0625rem;} } @media (max-width: 991.98px) {.header .navbar .navbar-brand span {text-transform: uppercase;font-size: 1rem;top: -0.3125rem;} } @media (max-width: 380px) {.header .navbar .navbar-brand span {font-size: 9px;} } @media (min-width: 992px) {.header .navbar .navbar-brand img + span::before {content: " ";height: 1.625rem;width: 1px;background: #737575;display: block;top: 1px;position: absolute;left: 1.25rem;} } .header .navbar .navbar-help {display: flex;align-items: center;font-size: 1rem;color: var(--white);text-decoration: none; } @media (max-width: 991.98px) {.header .navbar .navbar-help {position: absolute;right: 0;padding: 0 0.75rem;height: 100%;background: transparent;} } .header .navbar .navbar-help svg {height: 1.5rem;width: auto;margin-right: 0.3125rem; } @media (max-width: 991.98px) {.header .navbar .navbar-help svg {height: 2.125rem;margin-right: 0;} } @media (max-width: 991.98px) {.header .navbar .navbar-help span {display: none;} } .header .navbar .navbar-help:hover, .header .navbar .navbar-help:focus, .header .navbar .navbar-help:active {color: var(--primary); } .nav-header {position: fixed;top: 4.5rem;left: 0;width: 100%;z-index: 20;background: var(--white);gap: 0.25rem;min-width: 270px; } @media (max-width: 1099.98px) {.nav-header {top: 4rem;} } @media (max-width: 991.98px) {.nav-header {top: auto;bottom: 0;z-index: 1001;gap: 1px;} } .nav-header .nav-link {display: flex;align-items: center;justify-content: center;flex-grow: 1;position: relative;padding: 0 0 0 1rem;border: 0;background: var(--color2);color: var(--white);height: 4rem; } @media (max-width: 1099.98px) {.nav-header .nav-link {padding: 0;} } .nav-header .nav-link svg {height: 1.5rem;width: auto; } @media (min-width: 992px) {.nav-header .nav-link svg {margin-right: 0.3125rem;} } @media (min-width: 992px) {.nav-header .nav-link:nth-child(2)::before {border-color: transparent transparent transparent var(--color2);} } @media (min-width: 992px) {.nav-header .nav-link::before {content: " ";position: absolute;width: 0;height: 0;border-style: solid;border-width: 2rem 0 2rem 1rem;border-color: transparent transparent transparent var(--white);left: 0;top: 0;z-index: 1;} } @media (min-width: 992px) {.nav-header .nav-link::after {content: " ";position: absolute;width: 0;height: 0;border-style: solid;border-width: 2rem 0 2rem 1rem;border-color: transparent transparent transparent var(--color2);right: -0.9375rem;top: 0;z-index: 2;} } .nav-header .nav-link:disabled {color: rgba(var(--navbar-light-color), 0.5); } .nav-header .nav-link:not(:disabled):hover, .nav-header .nav-link:not(:disabled):focus, .nav-header .nav-link:not(:disabled):active, .nav-header .nav-link:not(:disabled).active {background: var(--primary);color: white; } .nav-header .nav-link:not(:disabled):hover:nth-child(2)::before, .nav-header .nav-link:not(:disabled):focus:nth-child(2)::before, .nav-header .nav-link:not(:disabled):active:nth-child(2)::before, .nav-header .nav-link:not(:disabled).active:nth-child(2)::before {border-color: transparent transparent transparent var(--primary); } .nav-header .nav-link:not(:disabled):hover::after, .nav-header .nav-link:not(:disabled):focus::after, .nav-header .nav-link:not(:disabled):active::after, .nav-header .nav-link:not(:disabled).active::after {border-color: transparent transparent transparent var(--primary); } .nav-header .nav-link.nav-link-home {background: #d9d9d9;color: var(--color2);flex-direction: row;font-size: 1rem;max-width: 11rem; } @media (max-width: 991.98px) {.nav-header .nav-link.nav-link-home {position: fixed;top: 0;height: 4rem;padding: 0 0.75rem;} } @media (max-width: 991.98px) {.nav-header .nav-link.nav-link-home span {display: none;} } .nav-header .nav-link.nav-link-home svg {height: 1.875rem;width: auto;line-height: 1; } @media (max-width: 991.98px) {.nav-header .nav-link.nav-link-home svg {height: 2.125rem;margin-left: 0;} } .nav-header .nav-link.nav-link-home::before {content: none; } .nav-header .nav-link.nav-link-home::after {content: none; } .nav-header .nav-link.nav-link-home:hover, .nav-header .nav-link.nav-link-home:focus, .nav-header .nav-link.nav-link-home:active, .nav-header .nav-link.nav-link-home.active {background: var(--color3); } .nav-header .nav-link.nav-link-arrow::before {content: " ";position: absolute;width: 0;height: 0;border-style: solid;border-width: 2rem 0 2rem 2rem;border-color: transparent transparent transparent var(--black);left: 0;top: 0; } @media (min-width: 992px) {.nav-header .nav-link:not(.nav-link-arrow) {padding-left: 0;} } .nav-header .nav-link.nav-link-primary {background: var(--primary);color: var(--white); } .nav-header .nav-link.nav-link-primary::after {border-color: transparent transparent transparent var(--primary); } .nav-header .nav-link.nav-link-primary:not(:disabled):hover, .nav-header .nav-link.nav-link-primary:not(:disabled):focus, .nav-header .nav-link.nav-link-primary:not(:disabled):active, .nav-header .nav-link.nav-link-primary:not(:disabled).active {background: var(--color4); } .nav-header .nav-link.nav-link-primary:not(:disabled):hover::after, .nav-header .nav-link.nav-link-primary:not(:disabled):focus::after, .nav-header .nav-link.nav-link-primary:not(:disabled):active::after, .nav-header .nav-link.nav-link-primary:not(:disabled).active::after {border-color: transparent transparent transparent var(--color4); } .nav-header .nav-link.nav-link-success {background: var(--success);color: var(--white); } .nav-header .nav-link.nav-link-success::after {border-color: transparent transparent transparent var(--success); } .nav-header .nav-link.nav-link-success:not(:disabled):hover, .nav-header .nav-link.nav-link-success:not(:disabled):focus, .nav-header .nav-link.nav-link-success:not(:disabled):active, .nav-header .nav-link.nav-link-success:not(:disabled).active {background: var(--color5); } .nav-header .nav-link.nav-link-success:not(:disabled):hover::after, .nav-header .nav-link.nav-link-success:not(:disabled):focus::after, .nav-header .nav-link.nav-link-success:not(:disabled):active::after, .nav-header .nav-link.nav-link-success:not(:disabled).active::after {border-color: transparent transparent transparent var(--color5); } .nav-price {position: fixed;left: 0;bottom: 0;width: 100%;color: var(--white);background: #000;display: flex;flex-direction: column;align-items: center;justify-content: center;z-index: 999;bottom: 4rem;padding: 0.25rem 0;font-size: 1.625rem;line-height: 1.2;height: 4rem;min-width: 270px; } .container-fluid {padding-top: 4.5625rem;height: 100%;margin-left: 0;margin-right: 0;padding-left: 0;padding-right: 0; } @media (max-width: 991.98px) {.container-fluid {padding-top: 4rem;} } .main {background: var(--body-bg);overflow: auto;height: 100%;padding-left: 0;padding-right: 0;scroll-behavior: smooth;padding-left: 1rem;padding-right: 1rem; } @media (min-width: 1100px) {.main {flex: 0 0 54%;max-width: 54%;} } @media (max-width: 991.98px) {.main {height: calc(100% - 8rem);} } .main .tab-content {flex-direction: column; } .main .tab-pane {border: 0;padding: 1.25rem;display: block !important; } @media (max-width: 991.98px) {.main .form-header .title {display: none;} } .main .mobile-header {display: none; } @media (max-width: 991.98px) {.main .mobile-header {display: block;} } @media (max-width: 991.98px) {.main .mobile-header .title {position: fixed;top: 4rem;height: 4rem;margin: 0;display: flex;align-items: center;justify-content: center;padding: 0;background: var(--black);color: var(--white);width: 100%;min-width: 270px;left: 0;z-index: 1;} } .loader, .exception {position: fixed;left: 0;bottom: 0;width: 100%;color: var(--white);background: #000;display: flex;flex-direction: row;align-items: center;justify-content: center;padding: 0.625rem 0;z-index: 1001;opacity: 0;visibility: hidden;transform: translateY(100%);transition-duration: 0.1s;transition-property: transform, opacity, visibility;height: 4rem;margin: 0;min-height: auto; } .loader .spinner, .exception .spinner {width: 1.25rem;height: 1.25rem;border-width: 1px;margin-right: 0.625rem; } .loader svg, .exception svg {height: 1.625rem;width: auto;margin: 0;line-height: 1; } .loader.active, .exception.active {opacity: 1;visibility: visible;transform: translateY(0); } .exception {z-index: 1000;background: var(--warning); } .tab-gallery, .tab-scene, .tab-summary {position: absolute;z-index: 11;background: var(--body-bg);left: 0;top: 8.5625rem;width: 100%;min-height: calc(100% - 8.5625rem);display: none;z-index: 10; } .tab-gallery.active, .tab-scene.active, .tab-summary.active {display: block; } .tab-gallery .nav-note, .tab-scene .nav-note, .tab-summary .nav-note {position: absolute;background: rgba(var(--white), 0.5);padding: 1rem;width: calc(100% - 18.9375rem);left: 18.9375rem;top: 0;z-index: 5; } @media (max-width: 650.98px) {.tab-gallery .nav-note, .tab-scene .nav-note, .tab-summary .nav-note {width: 100%;left: 0;} } .tab-gallery .nav-note .col, .tab-scene .nav-note .col, .tab-summary .nav-note .col {display: flex;flex-direction: column;align-items: center;justify-content: center; } .tab-gallery .nav-note p, .tab-scene .nav-note p, .tab-summary .nav-note p {margin-bottom: 0;text-align: center;display: flex;flex-direction: row;align-items: center;justify-content: center; } .tab-gallery .nav-note.nav-bottom, .tab-scene .nav-note.nav-bottom, .tab-summary .nav-note.nav-bottom {top: auto;bottom: 0; } @media (max-width: 991.98px) {.tab-gallery .nav-note.nav-bottom, .tab-scene .nav-note.nav-bottom, .tab-summary .nav-note.nav-bottom {bottom: 4rem;} } .tab-gallery .nav-note.nav-bottom svg, .tab-scene .nav-note.nav-bottom svg, .tab-summary .nav-note.nav-bottom svg {height: 1.875rem;width: auto;margin-right: 0.625rem; } .tab-gallery .nav-note.nav-bottom svg.icon-lg, .tab-scene .nav-note.nav-bottom svg.icon-lg, .tab-summary .nav-note.nav-bottom svg.icon-lg {height: 3.125rem; } .tab-summary {padding-top: 0.5rem;padding-bottom: 0.5rem; } @media (max-width: 991.98px) {.tab-summary {padding-bottom: 9.375rem;} } .tab-summary .tab-pane {border: 0;margin-left: 0.5rem;margin-right: 0.5rem; } .tab-summary label.required {font-weight: bold; } .tab-summary label.required::after {content: " *"; } .tab-gallery {height: calc(100% - 8.5625rem); } @media (max-width: 991.98px) {.tab-gallery {margin-top: -4.5625rem;height: calc(100% - 8rem);} } .tab-gallery.active {display: block; } .tab-gallery .nav-note {width: 100%;left: 0;top: 0; } .tab-gallery .tab-pane {border: 0;width: 100%; } .tab-gallery > .row {height: 100%; } .tab-gallery > .row > .col {height: 100%; } @media (max-width: 650.98px) {.tab-gallery > .row > .col {max-width: 100%;} } @media (max-width: 650.98px) {.tab-gallery > .row > .col.col-detail {max-height: 85%;flex: 0 0 85%;} } .tab-gallery > .row > .col.col-detail .img-fluid {position: absolute;left: 0;top: 0;object-fit: cover;width: 100%;height: 100%; } .tab-gallery > .row > .col.col-list {overflow-y: auto; } @media (max-width: 650.98px) {.tab-gallery > .row > .col.col-list {max-height: 15%;} } .tab-gallery > .row > .col.col-list .row {flex-direction: column;margin: 0.5rem 0;flex-wrap: nowrap; } @media (max-width: 650.98px) {.tab-gallery > .row > .col.col-list .row {height: 100%;margin: 0 0.25rem;overflow-x: auto;position: absolute;} } .tab-gallery > .row > .col.col-list .row .col {width: calc(100% - 2rem); } @media (max-width: 650.98px) {.tab-gallery > .row > .col.col-list .row .col {max-width: 33.3%;flex-grow: 0;flex-basis: 33.3%;width: auto;} } .tab-gallery > .row > .col.col-list .row .btn {margin: 0.5rem 1rem;padding: 0;box-shadow: none;position: relative; } @media (max-width: 650.98px) {.tab-gallery > .row > .col.col-list .row .btn {max-height: 100%;height: calc(100% - 1rem);margin: 0.5rem 0.25rem;width: calc(100% - 0.5rem);aspect-ratio: 4/3;} } @media (max-width: 650.98px) {.tab-gallery > .row > .col.col-list .row .btn .img-fluid {position: absolute;left: 0;top: 0;width: 100%;height: 100%;object-fit: cover;} } .tab-gallery > .row > .col.col-list .row .btn > svg {position: absolute !important;right: 0;top: 0;background: var(--color1);color: var(--white);font-size: 2rem !important;line-height: 1;display: none !important;width: auto; } .tab-gallery > .row > .col.col-list .row .btn > svg::before {z-index: 1;position: relative; } .tab-gallery > .row > .col.col-list .row .btn.active {background: var(--white);border-color: var(--primary); } .tab-gallery > .row > .col.col-list .row .btn.active > svg {display: block !important;background: var(--primary); } .tab-scene {overflow: hidden; } @media (max-width: 991.98px) {.tab-scene {margin-top: -4.5625rem;height: calc(100% - 8rem);} } .tab-scene .scene {position: absolute;left: 0;top: 0;width: 100%;height: 100%;background: var(--white); } .tab-scene .scene-loader {position: fixed;background: var(--light);top: 8rem;left: 0;width: 100%;height: calc(100% - 8rem);z-index: 10;display: flex;align-items: center;justify-content: center;visibility: visible;opacity: 1;transition-property: opacity, visibility;transition-duration: 0.25s; } @media (max-width: 991.98px) {.tab-scene .scene-loader {height: calc(100% - 4rem);top: 4rem;} } .tab-scene .scene-loader .message {display: none; } .tab-scene .scene-loader.hidden {visibility: hidden;opacity: 0; } .tab-scene .scene-loader.unload .spinner-border {display: none; } .tab-scene .scene-loader.unavailable .spinner-border {display: none; } .tab-scene .scene-loader.unavailable .message {display: block; } .tab-scene .scene-tool {position: fixed;top: 8.5625rem;padding: 0.625rem;width: 18.9375rem;z-index: 7;background: rgba(var(--white), 0.5);height: calc(100% - 8.5625rem); } @media (max-width: 991.98px) {.tab-scene .scene-tool {top: 4rem;} } .tab-scene .scene-tool .nav {margin-bottom: 2px;border: 0;flex-wrap: nowrap; } .tab-scene .scene-tool .nav .nav-link {display: flex;flex-direction: column;align-items: center;justify-content: space-between;border: 0;width: 4.1875rem;height: 4.125rem;font-size: 0.75rem;text-transform: uppercase;padding: 0.9375rem;background: transparent;margin-right: 0.3125rem;color: #000;padding: 0.3125rem; } .tab-scene .scene-tool .nav .nav-link.active {background: #fff; } .tab-scene .scene-tool .nav .nav-link .img-fluid {display: block;margin-bottom: 0;flex-grow: 1;object-fit: scale-down; } .tab-scene .scene-tool .tab-pane {border: 0;width: 100%; } .tab-scene .scene-tool .card {margin-bottom: 1rem;border: 0; } .tab-scene .scene-tool .card .card-header {padding-top: 0.3125rem;padding-bottom: 0;text-align: center;border: 0;display: flex;flex-direction: column; } .tab-scene .scene-tool .card .card-body {padding-bottom: 0; } .tab-scene .scene-tool .card .card-body .row {width: 100%; } .tab-scene .scene-tool .btn-color {width: 100%;padding: 0 !important;padding-top: 100% !important;margin-bottom: 1rem;border: solid 1px #aaa; } .tab-scene .scene-tool .btn-color.active {border-color: var(--primary);outline: solid 2px var(--primary) !important; } .person:not(.show) {display: none; } .agreement {font-size: 0.875rem;color: #4c4c4c; } .col-interest .invalid-tooltip {position: relative;top: -0.625rem; } .col-interest .form-group {display: flex;flex-direction: row; } .col-interest .form-group > label {display: none; } .col-interest .form-group .custom-checkbox {margin-right: 1.25rem; } .col-interest .form-group .invalid-tooltip {display: none; } .col-interest .form-group .custom-control-label {color: #000 !important; } .col-interest .form-group .was-validated .custom-control-input:invalid ~ .custom-control-label, .col-interest .form-group .custom-control-input.is-invalid ~ .custom-control-label {color: var(--danger) !important; } .col-interest .form-group .was-validated .custom-control-input:invalid ~ .custom-control-label::before, .col-interest .form-group .custom-control-input.is-invalid ~ .custom-control-label::before {border-color: #d9dfe3; } 