.aside {background: var(--color2);height: 100%;color: var(--white);z-index: 10;min-width: 270px; } @media (min-width: 1100px) {.aside {flex: 0 0 46%;max-width: 46%;} } @media (max-width: 991.98px) {.aside {position: fixed;right: 0;transform: translateX(100%);top: 7rem;height: calc(100% - 7rem);} } @media (max-width: 991.98px) {.aside.animated {transition-duration: 0.25s;transition-property: transform;} } @media (max-width: 991.98px) {.aside.show {transform: translateX(0);} } .aside.show svg {transform: rotate(180deg); } .aside h1, .aside .h1, .aside h2, .aside .h2, .aside h3, .aside .h3, .aside h4, .aside .h4, .aside h5, .aside .h5, .aside h6, .aside .h6 {color: var(--white); } .aside hr {border-top: 1px solid #737575;width: 100%;margin-bottom: 0; } .aside .col-rooms hr {border-top: 1px solid var(--white);margin-bottom: 1rem; } .aside .btn-close {background: transparent;border: 0;box-shadow: none;color: white;font-size: 1.875rem;margin-left: -1.25rem;padding: 0 0.625rem;position: absolute;top: 0;right: 0;z-index: 1; } @media (min-width: 992px) {.aside .btn-close {display: none !important;} } .aside .content {height: 100%;overflow: auto;overflow-x: hidden;padding: 1.125rem 3.625rem;position: relative; } @media (max-width: 991.98px) {.aside .content {height: calc(100% - 8rem);padding: 1.125rem 1.25rem;} } .aside .btn-collapse {position: fixed;right: calc(100% - 29px);z-index: 1;top: 50%;display: block !important;border-top-left-radius: 10px;border-top-right-radius: 10px;text-transform: none !important;font-size: 10px !important;padding: 2px 9px 0px 19px !important;height: 21px;width: 85px;white-space: nowrap;transform: rotate(-90deg) translate(100%, 3px);transform-origin: center;border: 0;border-bottom: solid 4px var(--primary);box-shadow: none !important; } @media (min-width: 992px) {.aside .btn-collapse {display: none !important;} } .aside .btn-collapse svg {height: 16px !important;width: auto;margin-right: 0;top: 2px;position: absolute !important;left: 7px; } .aside .btn-collapse:hover {border-bottom-color: #8d0000; } .aside .mdi-alert {font-size: 1.5625rem;position: relative;color: rgba(255, 255, 255, 0.5);top: -0.4375rem;margin-right: 0.9375rem; } .aside .form-checkbox .form-switch .form-slider {background-color: transparent !important;border: solid 1.5px #fff;box-shadow: 0 0 0px 0.4px #fff; } .aside .form-checkbox .form-switch .form-slider::before {bottom: 0.125rem; } .aside .form-checkbox .form-switch input[type=checkbox]:checked + .form-slider::before {transform: translateX(0.9375rem); } .aside .input-group-name label {cursor: pointer; } .aside .input-group-name .input-group-append {position: absolute;right: 0;top: 0;height: calc(100% - 1px);border: 0; } .aside .input-group-name .input-group-append .input-group-text {color: var(--color2);background: #c3c3c3;font-size: 1.875rem; } .aside .form-control-name {background: transparent;border: 0;box-shadow: none;font-size: 1.5rem;color: white;padding-left: 0; } .aside .form-control-name::-webkit-input-placeholder {font-size: 1.5rem;color: white; } .aside .form-control-name:-ms-input-placeholder {font-size: 1.5rem;color: white; } .aside .form-control-name::placeholder {font-size: 1.5rem;color: white; } .aside .btn-storeys {display: flex;align-items: center;padding-left: 1rem; } .aside .btn-storeys svg {margin-left: 0.5rem;transition: transform 0.5s; } .aside .btn-storeys:not(.collapsed) svg {transform: rotate(180deg); } .aside .storeys {display: none; } .aside .storeys.show {display: block; } .aside .storeys h4, .aside .storeys .h4 {font-weight: 500;min-height: 3.25rem;padding-top: 0.3125rem;padding-bottom: 0.3125rem;display: flex;align-items: center;text-transform: uppercase;margin-bottom: 0; } .aside .storeys h5 b, .aside .storeys .h5 b {font-weight: 600;color: var(--black);font-size: 1.25rem;color: var(--white); } .aside .storeys h5 span, .aside .storeys .h5 span {margin-right: 0.3125rem; } .aside .storeys table th, .aside .storeys table .head {font-size: 0.8125rem;font-weight: normal;text-transform: uppercase;color: #d9d9d9;padding: 0;border-top: 0; } .aside .storeys table td {vertical-align: middle;padding: 0 0.1875rem;border: 0;color: white; } .aside .storeys .form-control {display: inline-block;text-align: right; } .aside .storeys .form-control[type=number]::-webkit-inner-spin-button {opacity: 1;margin-top: -0.625rem;margin-bottom: -0.625rem;margin-right: -0.625rem;margin-left: 0.625rem;display: none; } .aside .storeys .input-group-text {background: transparent;color: var(--white);border-color: transparent;padding-left: 0; } .aside .storeys .row-room {align-items: center; } .aside .storeys .row-room .room {font-weight: bold;background: #737575;padding: 0.3125rem 0.625rem;margin-bottom: 0.3125rem; } .aside .storeys .row-room .col {display: flex;flex-direction: row;align-items: center; } .aside .storeys .row-room .form-control {margin-right: 0.625rem;background: transparent;color: var(--white);border-color: #707070;margin-bottom: 0.3125rem;font-size: 1rem;padding-top: 0;padding-bottom: 0;height: 2.5rem;-moz-appearance: textfield; } .aside .storeys .row-room .form-control::-webkit-inner-spin-button {-webkit-appearance: none;margin: 0; } .aside .storeys .row-room .custom-checkbox-lock .custom-control-label {cursor: pointer;display: none;top: -0.1875rem; } .aside .storeys .row-room .custom-checkbox-lock .custom-control-label::before, .aside .storeys .row-room .custom-checkbox-lock .custom-control-label::after {width: 1.5rem;height: 1.5rem; } .aside .storeys .row-room .custom-checkbox-lock .custom-control-label::before {background-color: #a00000; } .aside .storeys .row-room .custom-checkbox-lock .custom-control-label::after {background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3e%3cpath fill='%23ffffff' d='M13,3A9,9 0 0,0 4,12H1L4.89,15.89L4.96,16.03L9,12H6A7,7 0 0,1 13,5A7,7 0 0,1 20,12A7,7 0 0,1 13,19C11.07,19 9.32,18.21 8.06,16.94L6.64,18.36C8.27,20 10.5,21 13,21A9,9 0 0,0 22,12A9,9 0 0,0 13,3Z'/%3e%3c/svg%3e"); } .aside .storeys .row-room .custom-checkbox-lock .custom-control-label:focus {box-shadow: none; } .aside .storeys .row-room .custom-checkbox-lock .custom-control-input {display: none; } .aside .storeys .row-room .custom-checkbox-lock .custom-control-input:checked ~ .custom-control-label {display: block; } .aside .storeys .row-room .custom-checkbox-lock svg {height: 1.5625rem !important;width: auto;height: 100%;line-height: 1.2; } .aside .custom-checkbox {margin-bottom: 0; } .aside .img-fluid {height: 26.25rem;object-fit: cover;width: 100%; } .aside .btn-group {position: absolute;top: 1.6875rem;right: 1.6875rem; } .aside .btn-group .btn {color: var(--primary);width: 3.625rem;height: 3.625rem;margin-left: 0.3125rem;display: flex;align-items: center;justify-content: center; } .aside .btn-group .btn svg {width: 1.875rem;height: auto; } .aside .btn-group .btn span {display: none; } .aside .row-total-area {padding-top: 0.3125rem;padding-bottom: 0.3125rem; } .aside .row-total-area .col {display: flex;flex-direction: column;padding-top: 0.3125rem;padding-bottom: 0.3125rem; } .aside .row-total-area h3, .aside .row-total-area .h3 {margin-bottom: 0;font-size: 1.125rem;font-weight: 500; } .aside .row-total-area label {display: flex;flex-direction: row;align-items: center;margin: 0; } .aside .row-total-area .form-checkbox {margin-bottom: 1.25rem; } .aside .row-total-area .form-switch {margin-left: 0.9375rem;margin-right: 0.9375rem;top: 0; } .aside .pricelist .price-items {margin-bottom: 0.8125rem;border-bottom: 1px solid #737575; } .aside .pricelist .col-price {align-items: flex-end; } @media (min-width: 319px) {.aside .pricelist .col-price {align-items: flex-start;} } .aside .pricelist .col-btn-storeys {justify-content: flex-end;padding-bottom: 1rem; } .aside .pricelist .btn-house-storeys {background: #d9d9d9;color: var(--color2);display: inline-flex;margin-left: auto;padding: 0.75rem 1.25rem;font-weight: bold; } @media (min-width: 576px) {.aside .pricelist .btn-house-storeys {width: auto;justify-content: flex-end;} } .aside .pricelist .btn-house-storeys svg {margin-left: 0.375rem;position: relative;top: 0.125rem;left: 0.3125rem;transition: transform 0.5s; } .aside .pricelist .btn-house-storeys:not(.collapsed) svg {transform: rotate(180deg); } .aside .pricelist .row-area {margin: 0;margin-bottom: 16px;color: var(--primary);justify-content: space-between;align-items: center;border-bottom: 1px solid white; } .aside .pricelist .row-area .col {display: flex;flex-direction: row;gap: 0.625rem;align-items: last baseline;min-height: 3.25rem; } .aside .pricelist .row-area h4.storey-type, .aside .pricelist .row-area .h4.storey-type {font-size: 1.25rem; } .aside .pricelist .row-area h5, .aside .pricelist .row-area .h5 {font-weight: normal;font-size: 0.8125rem;color: #d9d9d9;margin-bottom: 0;text-transform: uppercase;min-height: 3.25rem;padding-top: 0.3125rem;padding-bottom: 0.3125rem;display: flex;align-items: center;text-transform: uppercase;margin-bottom: 0;justify-content: flex-end;width: 100%; } .aside .pricelist .row-area h6 span, .aside .pricelist .row-area .h6 span {font-size: 1.25rem;font-weight: bold; } .aside .pricelist h3, .aside .pricelist .h3 {font-size: 1.125rem;font-weight: 600;margin-bottom: 0; } .aside .pricelist h3 small, .aside .pricelist .h3 small {font-weight: 600; } .aside .pricelist h4, .aside .pricelist .h4, .aside .pricelist h5, .aside .pricelist .h5 {font-weight: bold;margin-top: -0.25rem;margin-bottom: 0.375rem; } .aside .pricelist h4, .aside .pricelist .h4 {font-size: 2.3125rem; } .aside .pricelist h5, .aside .pricelist .h5 {font-size: 1.9375rem; } .aside .pricelist h6, .aside .pricelist .h6 {font-weight: normal;font-size: 0.8125rem;color: #d9d9d9;margin-bottom: 0;text-transform: uppercase; } .aside .pricelist p {margin-bottom: 0; } .aside .pricelist small {font-size: 1.125rem; } .aside .card-enb {background: transparent;border: 0;padding: 0; } .aside .card-enb label {padding-bottom: 0;margin: 0;position: relative;top: -0.25rem; } .aside .card-enb .form-checkbox {margin: 0;padding: 0;position: relative;top: -0.3125rem; } .aside .card-enb svg {position: relative;line-height: 1;transform: none;top: 0.25rem;height: 1.5rem;width: auto;margin-right: 0.3125rem; } .aside .card-enb a {text-align: center;color: white;display: flex;align-items: center;line-height: 1.1;position: relative;height: 1.125rem;top: -0.3125rem; } .aside .card-enb .message {text-align: center;font-size: 0.9375rem;font-weight: 600;padding-bottom: 0; } .aside .card-enb .message svg {position: absolute;transform: translate(-1.875rem, -0.1875rem); } .aside .card-enb .traffic {display: flex;flex-direction: row;position: relative;margin-top: 0.375rem; } .aside .card-enb .traffic .light {width: 33.333%;height: 0.875rem; } .aside .card-enb .traffic .light.light-1 {background: var(--danger); } .aside .card-enb .traffic .light.light-2 {background: var(--warning); } .aside .card-enb .traffic .light.light-3 {background: var(--success); } .aside .card-enb .traffic .point {position: absolute;background: url("/static/img/logo_pointer.svg");background-size: cover;background-position: center;background-repeat: no-repeat;top: 50%;width: 1.75rem;height: 1.75rem;border: 1px solid var(--color2);border-radius: 50%;transform: translateX(-0.875rem);transform: translateY(-50%); } .aside .card-enb .traffic .point.point-1 {left: 15%; } .aside .card-enb .traffic .point.point-2 {left: 50%; } .aside .card-enb .traffic .point.point-3 {left: 73%; }