diff --git a/components.js b/components.js
index 826cb07..5b26a5c 100644
--- a/components.js
+++ b/components.js
@@ -3744,7 +3744,7 @@ scrollTabPanels.innerHTML = `
.tab-panels{
display: grid;
gap: var(--gap);
- height: var(--height);
+ // height: var(--height);
overflow-y: auto;
border-radius: var(--border-radius);
background: var(--background);
@@ -3811,10 +3811,11 @@ customElements.define('scroll-tab-panels', class extends HTMLElement {
handlePanelChange = (e) => {
if (e.detail.targetPanelGroup === this.id) {
- this.tabPanels.scrollTo({
+/* this.tabPanels.scrollTo({
top: (this._assignedElements[e.detail.panelIndex].getBoundingClientRect().top - this.tabPanels.getBoundingClientRect().top + this.tabPanels.scrollTop),
behavior: 'smooth'
- })
+ }) */
+ this._assignedElements[e.detail.panelIndex].scrollIntoView({block: "nearest", inline: 'start', behavior: 'smooth'})
}
}
@@ -3837,7 +3838,7 @@ customElements.define('scroll-tab-panels', class extends HTMLElement {
},
{
threshold: 0.8,
- root: this.tabPanels
+ // root: this.tabPanels
})
this.tabPanels.addEventListener('slotchange', e => {
this._assignedElements = this.tabPanelsSlot.assignedElements()
diff --git a/css/main.css b/css/main.css
index f24e02f..f0ba6d4 100644
--- a/css/main.css
+++ b/css/main.css
@@ -12,13 +12,13 @@ body {
--text-color: 17, 17, 17;
--text-color-light: 100, 100, 100;
--foreground-color: 255, 255, 255;
- --background-color: #efefef;
+ --background-color: #F3F3F3;
--error-color: red;
--red: #E84545;
color: rgba(var(--text-color), 1);
height: calc(100%);
font-size: clamp(1rem, 1.2vmax, 3rem);
- background: #F3F3F3;
+ background: var(--background-color);
}
body[data-theme=dark] {
@@ -26,21 +26,20 @@ body[data-theme=dark] {
--text-color: 240, 240, 240;
--text-color-light: 170, 170, 170;
--foreground-color: 20, 20, 20;
+ --background-color: #0a0a0a;
--error-color: rgb(255, 106, 106);
- background: #0a0a0a;
}
body[data-theme=dark] #outlet_switcher {
- background: -webkit-gradient(linear, left top, left bottom, from(rgba(var(--text-color), 0.06)), to(rgba(var(--text-color), 0.06))), rgba(var(--foreground-color), 1);
background: linear-gradient(rgba(var(--text-color), 0.06), rgba(var(--text-color), 0.06)), rgba(var(--foreground-color), 1);
}
-body[data-theme=dark] .outlet-preview__info {
- background-color: #0a0a0a;
-}
.full-bleed {
grid-column: 1/4;
}
+/* .h1, .h2, .h3, .h4, .h5{
+ // font-family: 'Lora', serif;
+} */
.h1 {
font-size: 2.5rem;
}
@@ -75,19 +74,14 @@ p {
}
img {
- -o-object-fit: cover;
- object-fit: cover;
+ object-fit: cover;
}
button {
position: relative;
overflow: hidden;
- display: -webkit-inline-box;
- display: -ms-inline-flexbox;
display: inline-flex;
- -webkit-box-align: center;
- -ms-flex-align: center;
- align-items: center;
+ align-items: center;
border: none;
background: none;
cursor: pointer;
@@ -125,8 +119,7 @@ sm-button {
}
sm-tab-header {
- -ms-flex-item-align: start;
- align-self: flex-start;
+ align-self: flex-start;
}
ul {
@@ -134,8 +127,6 @@ ul {
}
.flex {
- display: -webkit-box;
- display: -ms-flexbox;
display: flex;
}
@@ -176,15 +167,11 @@ ul {
}
.align-start {
- -webkit-box-align: start;
- -ms-flex-align: start;
- align-items: flex-start;
+ align-items: flex-start;
}
.align-center {
- -webkit-box-align: center;
- -ms-flex-align: center;
- align-items: center;
+ align-items: center;
}
.text-center {
@@ -192,15 +179,11 @@ ul {
}
.justify-start {
- -webkit-box-pack: start;
- -ms-flex-pack: start;
- justify-content: start;
+ justify-content: start;
}
.justify-center {
- -webkit-box-pack: center;
- -ms-flex-pack: center;
- justify-content: center;
+ justify-content: center;
}
.justify-right {
@@ -208,8 +191,7 @@ ul {
}
.align-self-center {
- -ms-flex-item-align: center;
- align-self: center;
+ align-self: center;
}
.justify-self-center {
@@ -221,16 +203,11 @@ ul {
}
.direction-column {
- -webkit-box-orient: vertical;
- -webkit-box-direction: normal;
- -ms-flex-direction: column;
- flex-direction: column;
+ flex-direction: column;
}
.space-between {
- -webkit-box-pack: justify;
- -ms-flex-pack: justify;
- justify-content: space-between;
+ justify-content: space-between;
}
.w-100 {
@@ -283,8 +260,7 @@ ul {
}
.no-transformations {
- -webkit-transform: none !important;
- transform: none !important;
+ transform: none !important;
}
.overflow-ellipsis {
@@ -297,8 +273,7 @@ ul {
.ripple {
position: absolute;
border-radius: 50%;
- -webkit-transform: scale(0);
- transform: scale(0);
+ transform: scale(0);
background: rgba(var(--text-color), 0.16);
pointer-events: none;
}
@@ -386,9 +361,7 @@ ul {
display: grid;
grid-template-columns: auto 1fr;
gap: 0.5rem;
- -webkit-box-align: center;
- -ms-flex-align: center;
- align-items: center;
+ align-items: center;
width: 100%;
}
@@ -412,42 +385,34 @@ ul {
}
.elevator__header {
- position: -webkit-sticky;
position: sticky;
top: 0;
padding: 1.2rem 1.5rem;
display: grid;
grid-template-columns: auto 1fr;
gap: 0.5rem;
- -webkit-box-align: center;
- -ms-flex-align: center;
- align-items: center;
- -webkit-box-pack: start;
- -ms-flex-pack: start;
- justify-content: flex-start;
+ align-items: center;
+ justify-content: flex-start;
width: 100%;
background: rgba(var(--foreground-color), 1);
z-index: 1;
}
#elevator_sections {
- -ms-flex-line-pack: start;
- align-content: flex-start;
+ align-content: flex-start;
padding: 0 1.5rem 4rem 1.5rem;
}
#elevator_button_panel {
gap: 2rem;
overflow: auto;
- -ms-scroll-snap-type: x proximity;
- scroll-snap-type: x proximity;
+ scroll-snap-type: x proximity;
grid-template-columns: repeat(3, min(40ch, 80%));
}
#elevator_button_panel li {
display: grid;
gap: 2rem;
- -ms-flex-line-pack: start;
- align-content: flex-start;
+ align-content: flex-start;
scroll-snap-align: start;
}
#elevator_button_panel sup {
@@ -457,10 +422,7 @@ ul {
.outlet-section {
display: grid;
- -webkit-user-select: none;
- -moz-user-select: none;
- -ms-user-select: none;
- user-select: none;
+ user-select: none;
}
.popup__header__close {
@@ -473,9 +435,7 @@ ul {
padding: 1rem;
height: 4rem;
width: 4rem;
- -webkit-box-pack: center;
- -ms-flex-pack: center;
- justify-content: center;
+ justify-content: center;
border-radius: 0.5rem;
font-size: 1.5rem;
font-weight: 900;
@@ -483,14 +443,11 @@ ul {
}
.floor__button--active {
background: rgba(var(--text-color), 0.2);
- -webkit-box-shadow: 0 0 0 0.4rem rgba(var(--text-color), 1) inset;
- box-shadow: 0 0 0 0.4rem rgba(var(--text-color), 1) inset;
+ box-shadow: 0 0 0 0.4rem rgba(var(--text-color), 1) inset;
}
.elevator__floor-line {
- -webkit-box-flex: 1;
- -ms-flex: 1;
- flex: 1;
+ flex: 1;
height: 0.1rem;
margin-left: 2rem;
background-color: var(--red);
@@ -522,22 +479,17 @@ ul {
}
.theme-switcher .icon {
position: absolute;
- -webkit-transition: -webkit-transform 0.6s;
- transition: -webkit-transform 0.6s;
transition: transform 0.6s;
- transition: transform 0.6s, -webkit-transform 0.6s;
}
.theme-switcher__checkbox {
display: none;
}
.theme-switcher__checkbox:checked ~ .moon-icon {
- -webkit-transform: scale(0) rotate(90deg);
- transform: scale(0) rotate(90deg);
+ transform: scale(0) rotate(90deg);
}
.theme-switcher__checkbox:not(:checked) ~ .sun-icon {
- -webkit-transform: scale(0) rotate(-90deg);
- transform: scale(0) rotate(-90deg);
+ transform: scale(0) rotate(-90deg);
}
.page {
@@ -563,7 +515,6 @@ ul {
}
#floor_line_map {
- position: -webkit-sticky;
position: sticky;
top: 1rem;
height: 40vh;
@@ -584,10 +535,7 @@ ul {
margin-top: -0.5rem;
background: rgba(var(--foreground-color), 1);
border: solid 0.2rem var(--red);
- -webkit-transition: -webkit-transform 0.1s linear;
- transition: -webkit-transform 0.1s linear;
transition: transform 0.1s linear;
- transition: transform 0.1s linear, -webkit-transform 0.1s linear;
z-index: 5;
}
@@ -600,24 +548,16 @@ ul {
.floor-label {
position: absolute;
- display: -webkit-box;
- display: -ms-flexbox;
display: flex;
- -webkit-box-align: center;
- -ms-flex-align: center;
- align-items: center;
+ align-items: center;
left: 0.75rem;
margin-top: -0.9rem;
padding-bottom: 1rem;
- -webkit-user-select: none;
- -moz-user-select: none;
- -ms-user-select: none;
- user-select: none;
+ user-select: none;
}
.floor-label--active .floor-title {
opacity: 1;
- -webkit-box-shadow: 0 0 0.5rem rgba(0, 0, 0, 0.2);
- box-shadow: 0 0 0.5rem rgba(0, 0, 0, 0.2);
+ box-shadow: 0 0 0.5rem rgba(0, 0, 0, 0.2);
}
.floor-circle {
@@ -636,10 +576,7 @@ ul {
margin-left: 1rem;
border-radius: 0.2rem;
background: rgba(var(--foreground-color), 1);
- -webkit-transition: opacity 0.3s, -webkit-box-shadow 0.3s;
- transition: opacity 0.3s, -webkit-box-shadow 0.3s;
transition: box-shadow 0.3s, opacity 0.3s;
- transition: box-shadow 0.3s, opacity 0.3s, -webkit-box-shadow 0.3s;
}
#floor_container {
@@ -663,16 +600,31 @@ ul {
.outlet-preview {
position: relative;
- -webkit-box-align: center;
- -ms-flex-align: center;
- align-items: center;
+ align-items: center;
display: grid;
}
+.outlet-number {
+ display: grid;
+ position: relative;
+ width: 2rem;
+ height: 2rem;
+ aspect-ratio: 1/1;
+ font-size: 1.3rem;
+ font-weight: 900;
+ margin-bottom: 0.5rem;
+ border-radius: 0.2rem;
+ place-content: center;
+ justify-self: flex-start;
+ background: rgba(var(--text-color), 1);
+ color: rgba(var(--foreground-color), 1);
+ box-shadow: 0.2rem 0.2rem 0 var(--red);
+}
+
.outlet-preview__info {
+ position: relative;
padding: 1rem;
border-radius: 0.5rem;
- background-color: #F3F3F3;
}
.outlet__title {
@@ -691,15 +643,17 @@ ul {
height: 100%;
width: 100%;
z-index: -1;
- -webkit-box-shadow: 0 0 0 0.1rem rgba(var(--text-color), 0.3);
- box-shadow: 0 0 0 0.1rem rgba(var(--text-color), 0.3);
+ box-shadow: 0 0 0 0.1rem rgba(var(--text-color), 0.2);
border-radius: 0.5rem;
}
.outlet-preview__button {
- justify-self: flex-start;
+ justify-self: flex-end;
}
+/* .outlet-preview__carousel{
+}
+ */
.label {
position: relative;
font-size: 0.8rem;
@@ -732,9 +686,7 @@ sm-carousel {
}
.investor-card {
- -webkit-box-align: start;
- -ms-flex-align: start;
- align-items: flex-start;
+ align-items: flex-start;
grid-template-columns: auto 1fr;
grid-template-rows: auto 1fr;
}
@@ -771,8 +723,7 @@ sm-carousel {
padding: 1rem;
border-radius: 0.3rem;
background: rgba(var(--foreground-color), 1);
- -webkit-box-shadow: 0 2rem 4rem -1rem rgba(0, 0, 0, 0.2);
- box-shadow: 0 2rem 4rem -1rem rgba(0, 0, 0, 0.2);
+ box-shadow: 0 2rem 4rem -1rem rgba(0, 0, 0, 0.2);
z-index: 2;
}
@@ -793,12 +744,8 @@ sm-carousel {
}
.outlet-label {
- display: -webkit-box;
- display: -ms-flexbox;
display: flex;
- -webkit-box-align: center;
- -ms-flex-align: center;
- align-items: center;
+ align-items: center;
justify-self: flex-start;
color: var(--accent-color);
margin-bottom: 0.5rem;
@@ -809,36 +756,24 @@ sm-carousel {
margin-right: 0.5rem;
}
-scroll-tab-header,
-scroll-tab-panels {
- --border-radius: 0.5rem;
-}
-
scroll-tab-header {
- position: -webkit-sticky;
position: sticky;
top: 0;
- --gap: 0.5rem;
- --padding: 0.5rem;
- margin-right: 1.5rem;
- --background: linear-gradient(rgba(var(--text-color), 0.04), rgba(var(--text-color), 0.04)), rgba(var(--foreground-color), 1);
+ --padding: 0.5rem 0;
+ --border-radius: 0.3rem;
+ --background: var(--background-color);
--grid-auto-flow: column;
- justify-self: flex-start;
z-index: 1;
}
scroll-tab-panels {
- --height: max(24rem, 50vh);
- --gap: 4rem;
--background: transparent;
- -ms-scroll-chaining: none;
- overscroll-behavior: contain;
+ overscroll-behavior: contain;
}
scroll-tab-panels > * {
- min-height: max(24rem, 50vh);
- margin-bottom: 6rem;
+ min-height: 100vh;
+ padding-top: 4rem;
opacity: 0.4;
- -webkit-transition: opacity 0.6s;
transition: opacity 0.6s;
}
scroll-tab-panels > [active] {
@@ -846,9 +781,7 @@ scroll-tab-panels > [active] {
}
.auto-grid-layout {
- -webkit-box-pack: start;
- -ms-flex-pack: start;
- justify-content: flex-start;
+ justify-content: flex-start;
overflow-x: auto;
}
@@ -857,27 +790,34 @@ scroll-tab-panels > [active] {
}
.room-button {
+ position: relative;
+ opacity: 0.6;
+ border-radius: 0;
font-weight: 500;
font-size: 1.1rem;
- opacity: 0.6;
- -webkit-transition: opacity 0.3s, background-color 0.3s;
transition: opacity 0.3s, background-color 0.3s;
padding: 0.6rem 0.8rem;
}
.room-button[active] {
- background-color: rgba(var(--text-color), 0.06);
opacity: 1;
- border-radius: 0.3rem;
color: var(--accent-color);
}
.room-button[active] .icon {
fill: var(--accent-color);
}
+.room-button[active]::after {
+ content: "";
+ position: absolute;
+ height: 0.1rem;
+ width: 100%;
+ bottom: 0;
+ left: 0;
+ border-radius: 0.2rem 0.2rem 0 0;
+ background: var(--accent-color);
+}
table {
border-collapse: collapse;
- width: -webkit-max-content;
- width: -moz-max-content;
width: max-content;
}
@@ -895,8 +835,6 @@ table {
#ico_page__carousel {
width: min(36rem, 100%);
- height: -webkit-max-content;
- height: -moz-max-content;
height: max-content;
}
@@ -915,8 +853,7 @@ table {
position: absolute;
margin-top: 1rem;
left: 50%;
- -webkit-transform: translateX(-50%);
- transform: translateX(-50%);
+ transform: translateX(-50%);
}
.progress-bar__circle {
@@ -947,29 +884,20 @@ table {
}
.floor-label {
- -webkit-transition: -webkit-transform 0.3s;
- transition: -webkit-transform 0.3s;
transition: transform 0.3s;
- transition: transform 0.3s, -webkit-transform 0.3s;
}
.floor-label .floor-title {
opacity: 0;
- -webkit-transform: translateX(-1rem);
- transform: translateX(-1rem);
- -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
- transition: opacity 0.3s, -webkit-transform 0.3s;
+ transform: translateX(-1rem);
transition: opacity 0.3s, transform 0.3s;
- transition: opacity 0.3s, transform 0.3s, -webkit-transform 0.3s;
}
.floor-label--active {
opacity: 1;
}
.floor-label--active .floor-title {
opacity: 1;
- -webkit-box-shadow: 0 0 0.5rem rgba(0, 0, 0, 0.2);
- box-shadow: 0 0 0.5rem rgba(0, 0, 0, 0.2);
- -webkit-transform: none;
- transform: none;
+ box-shadow: 0 0 0.5rem rgba(0, 0, 0, 0.2);
+ transform: none;
}
#outlet_switcher {
@@ -1027,25 +955,21 @@ table {
}
.carousel-holder {
- -ms-flex-item-align: start;
- align-self: flex-start;
- -webkit-transform: translateY(-2rem);
- transform: translateY(-2rem);
+ align-self: flex-start;
+ transform: translateY(-2rem);
z-index: 1;
border-radius: 0.5rem;
}
.carousel-holder--left {
grid-row: 1/2;
grid-column: 1/2;
- -webkit-box-shadow: -2rem 5rem 4rem -2rem rgba(0, 0, 0, 0.2);
- box-shadow: -2rem 5rem 4rem -2rem rgba(0, 0, 0, 0.2);
+ box-shadow: -2rem 5rem 4rem -2rem rgba(0, 0, 0, 0.2);
}
.carousel-holder--left ~ .outlet-preview__border {
justify-self: flex-end;
}
.carousel-holder--right {
- -webkit-box-shadow: 2rem 5rem 4rem -2rem rgba(0, 0, 0, 0.2);
- box-shadow: 2rem 5rem 4rem -2rem rgba(0, 0, 0, 0.2);
+ box-shadow: 2rem 5rem 4rem -2rem rgba(0, 0, 0, 0.2);
}
.outlet-preview__border {
@@ -1053,7 +977,7 @@ table {
}
.outlet-preview__info {
- padding: 2rem 3rem;
+ padding: 2rem;
}
.outlet-preview__carousel {
@@ -1068,10 +992,6 @@ table {
margin-top: 4rem;
}
- scroll-tab-header {
- --grid-auto-flow: row;
- }
-
.auto-grid-layout {
grid-template-columns: auto 1fr;
}
@@ -1086,9 +1006,7 @@ table {
}
.grid-3 {
- -webkit-box-pack: center;
- -ms-flex-pack: center;
- justify-content: center;
+ justify-content: center;
/* & > .grid:not(:last-of-type){
position: relative;
&::after{
@@ -1126,7 +1044,6 @@ table {
.page-link {
cursor: pointer;
- -webkit-transition: color 0.3s;
transition: color 0.3s;
}
.page-link:hover {
@@ -1137,16 +1054,11 @@ table {
}
.outlet-section .icon {
- -webkit-transform: translateX(-0.5rem);
- transform: translateX(-0.5rem);
- -webkit-transition: -webkit-transform 0.3s;
- transition: -webkit-transform 0.3s;
+ transform: translateX(-0.5rem);
transition: transform 0.3s;
- transition: transform 0.3s, -webkit-transform 0.3s;
}
.outlet-section:hover .icon {
- -webkit-transform: none;
- transform: none;
+ transform: none;
}
.floor__button:hover {
diff --git a/css/main.min.css b/css/main.min.css
index f02e7dc..8056119 100644
--- a/css/main.min.css
+++ b/css/main.min.css
@@ -1 +1 @@
-*{padding:0;margin:0;-webkit-box-sizing:border-box;box-sizing:border-box;font-family:"Roboto Slab",serif}body{--accent-color: #1042e9;--light-shade: rgba(var(--text-color), 0.06);--text-color: 17, 17, 17;--text-color-light: 100, 100, 100;--foreground-color: 255, 255, 255;--background-color: #efefef;--error-color: red;--red: #E84545;color:rgba(var(--text-color), 1);height:calc(100%);font-size:clamp(1rem, 1.2vmax, 3rem);background:#f3f3f3}body[data-theme=dark]{--accent-color:#2fb3ff;--text-color: 240, 240, 240;--text-color-light: 170, 170, 170;--foreground-color: 20, 20, 20;--error-color: rgb(255, 106, 106);background:#0a0a0a}body[data-theme=dark] #outlet_switcher{background:-webkit-gradient(linear, left top, left bottom, from(rgba(var(--text-color), 0.06)), to(rgba(var(--text-color), 0.06))),rgba(var(--foreground-color), 1);background:linear-gradient(rgba(var(--text-color), 0.06), rgba(var(--text-color), 0.06)),rgba(var(--foreground-color), 1)}body[data-theme=dark] .outlet-preview__info{background-color:#0a0a0a}.full-bleed{grid-column:1/4}.h1{font-size:2.5rem}.h2{font-size:2rem}.h3{font-size:1.4rem}.h4{font-size:1rem}.h5{font-size:.8rem}.uppercase{text-transform:uppercase}.capitalize{text-transform:capitalize}p{max-width:60ch;line-height:1.7}img{-o-object-fit:cover;object-fit:cover}button{position:relative;overflow:hidden;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;border:none;background:none;cursor:pointer;outline:none;color:inherit;font-weight:500;-webkit-tap-highlight-color:transparent}.button{border-radius:.2rem;padding:.5rem .6rem}.button--primary{background:var(--accent-color);color:rgba(var(--foreground-color), 1)}.button--primary .icon{fill:rgba(var(--foreground-color), 1)}button:focus-visible{outline:rgba(var(--text-color), 1) .1rem solid}sm-input,sm-textarea{--border-radius: 0.2rem;--background: rgba(var(--text-color), 0.06)}sm-button{--border-radius: 0.2rem}sm-tab-header{-ms-flex-item-align:start;align-self:flex-start}ul{list-style:none}.flex{display:-webkit-box;display:-ms-flexbox;display:flex}.grid{display:grid}.grid-3{grid-template-columns:repeat(auto-fill, minmax(8rem, 1fr))}.flow-column{grid-auto-flow:column}.gap-0-5{gap:.5rem}.gap-1{gap:1rem}.gap-1-5{gap:1.5rem}.gap-2{gap:2rem}.gap-3{gap:3rem}.pos-relative{position:relative}.align-start{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.align-center{-webkit-box-align:center;-ms-flex-align:center;align-items:center}.text-center{text-align:center}.justify-start{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:start}.justify-center{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.justify-right{margin-left:auto}.align-self-center{-ms-flex-item-align:center;align-self:center}.justify-self-center{justify-self:center}.justify-self-start{justify-self:start}.direction-column{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.space-between{-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.w-100{width:100%}.margin-top-1-5{margin-top:1.5rem}.margin-bottom-0-5r{margin-bottom:.5rem}.margin-bottom-1r{margin-bottom:1rem}.margin-bottom-1-5r{margin-bottom:1.5rem}.margin-bottom-2r{margin-bottom:2rem}.margin-bottom-3r{margin-bottom:3rem}.margin-bottom-4r{margin-bottom:4rem}.margin-left-0-5{margin-left:.5rem}.margin-right-0-5{margin-right:.5rem}.hide{opacity:0;pointer-events:none}.hide-completely{display:none !important}.no-transformations{-webkit-transform:none !important;transform:none !important}.overflow-ellipsis{width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.ripple{position:absolute;border-radius:50%;-webkit-transform:scale(0);transform:scale(0);background:rgba(var(--text-color), 0.16);pointer-events:none}.interact{position:relative;overflow:hidden;cursor:pointer;-webkit-tap-highlight-color:transparent}.observe-empty-state:empty{display:none}.observe-empty-state:not(:empty)~.empty-state{display:none}.icon{width:1.5rem;height:1.5rem;fill:rgba(var(--text-color), 0.9)}.icon-only{height:2.6rem;width:2.6rem;padding:.6rem}.close-icon{padding:.3rem}.close-button{left:-0.5rem}.button__label{font-size:1rem}.button__icon{height:1.1rem;width:1.1rem}.button__icon--left{margin-right:.5rem}.button__icon--right{margin-left:.5rem}.color-0-9{color:rgba(var(--text-color), 0.9)}.color-0-8{color:rgba(var(--text-color), 0.8)}.color-0-7{color:rgba(var(--text-color), 0.7)}.weight-400{font-weight:400}.weight-500{font-weight:500}.weight-700{font-weight:700}.weight-900{font-weight:900}.popup__header{padding:.5rem 1.5rem 0 1rem;display:grid;grid-template-columns:auto 1fr;gap:.5rem;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100%}.popup__header__close{padding:.5rem;cursor:pointer}#elevator_popup{position:absolute;width:100%;height:100%;top:0;left:0;right:0;bottom:0;z-index:10;overflow-y:auto;grid-template-rows:auto 1fr;background:rgba(var(--foreground-color), 1)}.elevator__header{position:-webkit-sticky;position:sticky;top:0;padding:1.2rem 1.5rem;display:grid;grid-template-columns:auto 1fr;gap:.5rem;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;width:100%;background:rgba(var(--foreground-color), 1);z-index:1}#elevator_sections{-ms-flex-line-pack:start;align-content:flex-start;padding:0 1.5rem 4rem 1.5rem}#elevator_button_panel{gap:2rem;overflow:auto;-ms-scroll-snap-type:x proximity;scroll-snap-type:x proximity;grid-template-columns:repeat(3, min(40ch, 80%))}#elevator_button_panel li{display:grid;gap:2rem;-ms-flex-line-pack:start;align-content:flex-start;scroll-snap-align:start}#elevator_button_panel sup{font-weight:500;font-size:1rem}.outlet-section{display:grid;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.popup__header__close{padding:.5rem;cursor:pointer}.floor__button{position:relative;padding:1rem;height:4rem;width:4rem;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;border-radius:.5rem;font-size:1.5rem;font-weight:900;background:rgba(var(--text-color), 0.06)}.floor__button--active{background:rgba(var(--text-color), 0.2);-webkit-box-shadow:0 0 0 .4rem rgba(var(--text-color), 1) inset;box-shadow:0 0 0 .4rem rgba(var(--text-color), 1) inset}.elevator__floor-line{-webkit-box-flex:1;-ms-flex:1;flex:1;height:.1rem;margin-left:2rem;background-color:var(--red)}#main_header{position:relative;padding:1rem;grid-template-columns:repeat(3, 1fr)}#elevator_button{justify-self:flex-start;margin-left:-1rem}#main_header__logo{height:1.8rem;width:1.8rem}.theme-switcher{position:relative;justify-self:flex-end;width:1.5rem;height:1.5rem;cursor:pointer;-webkit-tap-highlight-color:transparent}.theme-switcher .icon{position:absolute;-webkit-transition:-webkit-transform .6s;transition:-webkit-transform .6s;transition:transform .6s;transition:transform .6s, -webkit-transform .6s}.theme-switcher__checkbox{display:none}.theme-switcher__checkbox:checked~.moon-icon{-webkit-transform:scale(0) rotate(90deg);transform:scale(0) rotate(90deg)}.theme-switcher__checkbox:not(:checked)~.sun-icon{-webkit-transform:scale(0) rotate(-90deg);transform:scale(0) rotate(-90deg)}.page{position:relative;display:grid;grid-template-columns:1rem 1fr 1rem}.page>*{grid-column:2/3}.tag{background:var(--accent-color);padding:.4rem .6rem}#home_page{overflow-y:auto;max-height:calc(100vh - 5rem);grid-template-columns:2rem 1fr;background:url(../assets/bg/homepage-bg.svg) no-repeat center;background-size:cover}#floor_line_map{position:-webkit-sticky;position:sticky;top:1rem;height:40vh;z-index:5;grid-template-columns:2rem 1fr;grid-column:1/2}.line-map{height:100%}.line-map__circle{position:absolute;border-radius:1rem;width:1rem;height:1rem;margin-top:-0.5rem;background:rgba(var(--foreground-color), 1);border:solid .2rem var(--red);-webkit-transition:-webkit-transform .1s linear;transition:-webkit-transform .1s linear;transition:transform .1s linear;transition:transform .1s linear, -webkit-transform .1s linear;z-index:5}.line-map__bar{width:.1rem;height:100%;border-radius:1rem;background:var(--red)}.floor-label{position:absolute;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;left:.75rem;margin-top:-0.9rem;padding-bottom:1rem;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.floor-label--active .floor-title{opacity:1;-webkit-box-shadow:0 0 .5rem rgba(0,0,0,.2);box-shadow:0 0 .5rem rgba(0,0,0,.2)}.floor-circle{position:absolute;height:.5rem;width:.5rem;background:rgba(var(--text-color), 1);border-radius:1rem}.floor-title{opacity:.5;font-size:.9rem;white-space:nowrap;padding:.4rem .6rem;margin-left:1rem;border-radius:.2rem;background:rgba(var(--foreground-color), 1);-webkit-transition:opacity .3s,-webkit-box-shadow .3s;transition:opacity .3s,-webkit-box-shadow .3s;transition:box-shadow .3s,opacity .3s;transition:box-shadow .3s,opacity .3s,-webkit-box-shadow .3s}#floor_container{width:calc(100% - 1rem)}.floor{padding-bottom:3rem;width:100%}.big-icon{height:2rem;width:2rem}#floor_1__outlets{margin:3rem 0;gap:1.5rem}.outlet-preview{position:relative;-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:grid}.outlet-preview__info{padding:1rem;border-radius:.5rem;background-color:#f3f3f3}.outlet__title{font-weight:700;font-size:1.8rem;margin-bottom:.8rem;text-transform:capitalize}.outlet__description{color:rgba(var(--text-color), 0.8)}.outlet-preview__border{position:absolute;height:100%;width:100%;z-index:-1;-webkit-box-shadow:0 0 0 .1rem rgba(var(--text-color), 0.3);box-shadow:0 0 0 .1rem rgba(var(--text-color), 0.3);border-radius:.5rem}.outlet-preview__button{justify-self:flex-start}.label{position:relative;font-size:.8rem;margin-bottom:.3rem}.value{font-size:1.3rem}sm-carousel{position:relative;height:100%;border-radius:.5rem;padding:1.5rem 1.5rem 4rem 1.5rem;background:rgba(var(--foreground-color), 1);--arrow-left: 1.5rem;--arrow-right: 1.5rem;--arrow-fill: rgba(var(--text-color), 1);--arrow-background: transparent;--arrow-box-shadow: none;--arrow-bottom: -3.5rem;--indicator-bottom: -2.5rem}.bit-bond-series__row,.bob-fund__row,.investor-card{min-width:100%}.investor-card{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;grid-template-columns:auto 1fr;grid-template-rows:auto 1fr}.investor-card--small{grid-template-areas:"img ." "para para"}.investor-card--small .investor__image{width:4rem;height:4rem;border-radius:50%}.investor-card--big{grid-template-areas:"img ." "img para"}.investor__image{grid-area:img;width:5rem;border-radius:.5rem}.investor__bio{font-size:.9rem;margin-top:.5rem}.investor__contribution-container{grid-area:para}#outlet_switcher{position:absolute;top:0;padding:1rem;border-radius:.3rem;background:rgba(var(--foreground-color), 1);-webkit-box-shadow:0 2rem 4rem -1rem rgba(0,0,0,.2);box-shadow:0 2rem 4rem -1rem rgba(0,0,0,.2);z-index:2}.outlet_switcher__button{font-size:1rem;padding:.4rem 0}.outlet_switcher__button--active{color:var(--accent-color)}.outlet_switcher__button:not(:last-of-type)::after{content:"";position:relative;width:4vw;height:.1rem;margin:0 .5rem;background:var(--red)}.outlet-label{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;justify-self:flex-start;color:var(--accent-color);margin-bottom:.5rem;font-size:1rem}.outlet-label .icon{fill:var(--accent-color);margin-right:.5rem}scroll-tab-header,scroll-tab-panels{--border-radius: 0.5rem}scroll-tab-header{position:-webkit-sticky;position:sticky;top:0;--gap: 0.5rem;--padding: 0.5rem;margin-right:1.5rem;--background: linear-gradient(rgba(var(--text-color), 0.04), rgba(var(--text-color), 0.04)), rgba(var(--foreground-color), 1);--grid-auto-flow: column;justify-self:flex-start;z-index:1}scroll-tab-panels{--height: max(24rem, 50vh);--gap: 4rem;--background: transparent;-ms-scroll-chaining:none;overscroll-behavior:contain}scroll-tab-panels>*{min-height:max(24rem, 50vh);margin-bottom:6rem;opacity:.4;-webkit-transition:opacity .6s;transition:opacity .6s}scroll-tab-panels>[active]{opacity:1}.auto-grid-layout{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;overflow-x:auto}.grid-2{grid-template-columns:auto 1fr}.room-button{font-weight:500;font-size:1.1rem;opacity:.6;-webkit-transition:opacity .3s,background-color .3s;transition:opacity .3s,background-color .3s;padding:.6rem .8rem}.room-button[active]{background-color:rgba(var(--text-color), 0.06);opacity:1;border-radius:.3rem;color:var(--accent-color)}.room-button[active] .icon{fill:var(--accent-color)}table{border-collapse:collapse;width:-webkit-max-content;width:-moz-max-content;width:max-content}.tr{margin:.5rem}.tr:nth-of-type(even){background:rgba(var(--text-color), 0.1)}.td{padding:.6rem .8rem;white-space:nowrap}#ico_page__carousel{width:min(36rem, 100%);height:-webkit-max-content;height:-moz-max-content;height:max-content}.phase{grid-template-columns:4rem 1fr}.phase:not(:last-of-type) .phase__description{padding-bottom:1.5rem}.phase:last-of-type .progress-bar__line{height:0}.progress-bar__circle,.progress-bar__line{position:absolute;margin-top:1rem;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%)}.progress-bar__circle{padding:.4rem;background:rgba(var(--foreground-color), 1);border:solid rgba(var(--text-color), 1) .1rem;border-radius:50%;z-index:1}.progress-bar__line{height:100%;width:.1rem;background:rgba(var(--text-color), 0.9)}.phase__date{margin-top:.3rem}.phase__description{margin-top:1rem}@media only screen and (max-width: 640px){.hide-on-mobile{display:none}.floor-label{-webkit-transition:-webkit-transform .3s;transition:-webkit-transform .3s;transition:transform .3s;transition:transform .3s, -webkit-transform .3s}.floor-label .floor-title{opacity:0;-webkit-transform:translateX(-1rem);transform:translateX(-1rem);-webkit-transition:opacity .3s,-webkit-transform .3s;transition:opacity .3s,-webkit-transform .3s;transition:opacity .3s,transform .3s;transition:opacity .3s,transform .3s,-webkit-transform .3s}.floor-label--active{opacity:1}.floor-label--active .floor-title{opacity:1;-webkit-box-shadow:0 0 .5rem rgba(0,0,0,.2);box-shadow:0 0 .5rem rgba(0,0,0,.2);-webkit-transform:none;transform:none}#outlet_switcher{width:calc(100% - 2rem)}.outlet-hero-section{margin-top:2rem}}@media only screen and (min-width: 640px){.page{grid-template-columns:1fr 90vw 1fr}.h1{font-size:4rem}.h2{font-size:2.5rem}.h3{font-size:1.5rem}.h4{font-size:1.1rem}#main_header{padding:1.2rem 2rem}#elevator_sections{padding:0 3rem 4rem 4.6rem}#home_page{grid-template-columns:1fr 80vw 1fr}#floor_line_map{margin-left:.8rem}#floor_1__outlets{gap:5rem}.outlet-preview{gap:1rem;grid-template-columns:repeat(2, 1fr)}.carousel-holder{-ms-flex-item-align:start;align-self:flex-start;-webkit-transform:translateY(-2rem);transform:translateY(-2rem);z-index:1;border-radius:.5rem}.carousel-holder--left{grid-row:1/2;grid-column:1/2;-webkit-box-shadow:-2rem 5rem 4rem -2rem rgba(0,0,0,.2);box-shadow:-2rem 5rem 4rem -2rem rgba(0,0,0,.2)}.carousel-holder--left~.outlet-preview__border{justify-self:flex-end}.carousel-holder--right{-webkit-box-shadow:2rem 5rem 4rem -2rem rgba(0,0,0,.2);box-shadow:2rem 5rem 4rem -2rem rgba(0,0,0,.2)}.outlet-preview__border{width:66%}.outlet-preview__info{padding:2rem 3rem}.outlet-preview__carousel{padding:2rem 2rem 5rem 2rem}#outlet_switcher{padding:1rem 1.5rem}.outlet-hero-section{margin-top:4rem}scroll-tab-header{--grid-auto-flow: row}.auto-grid-layout{grid-template-columns:auto 1fr}.investor__image{width:8rem}}@media only screen and (min-width: 1280px){.page{grid-template-columns:1fr 80vw 1fr}.grid-3{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.grid-3>.grid{width:100%}}@media only screen and (min-width: 1920px){.page,#home_page{grid-template-columns:1fr 60vw 1fr}}@media(any-hover: hover){::-webkit-scrollbar{width:.5rem;height:.5rem}::-webkit-scrollbar-thumb{background:rgba(var(--text-color), 0.3);border-radius:1rem}::-webkit-scrollbar-thumb:hover{background:rgba(var(--text-color), 0.5)}.page-link{cursor:pointer;-webkit-transition:color .3s;transition:color .3s}.page-link:hover{color:var(--accent-color)}.page-link:hover .icon{fill:var(--accent-color)}.outlet-section .icon{-webkit-transform:translateX(-0.5rem);transform:translateX(-0.5rem);-webkit-transition:-webkit-transform .3s;transition:-webkit-transform .3s;transition:transform .3s;transition:transform .3s, -webkit-transform .3s}.outlet-section:hover .icon{-webkit-transform:none;transform:none}.floor__button:hover{background:rgba(var(--text-color), 0.2)}}
\ No newline at end of file
+.pos-relative,button{position:relative}.floor-title,.overflow-ellipsis,.td{white-space:nowrap}.hide,.ripple{pointer-events:none}.interact,.theme-switcher,button{cursor:pointer;-webkit-tap-highlight-color:transparent}*{padding:0;margin:0;-webkit-box-sizing:border-box;box-sizing:border-box;font-family:"Roboto Slab",serif}.button__icon--left,.margin-right-0-5{margin-right:.5rem}body{--accent-color:#1042e9;--light-shade:rgba(var(--text-color), 0.06);--text-color:17,17,17;--text-color-light:100,100,100;--foreground-color:255,255,255;--background-color:#F3F3F3;--error-color:red;--red:#E84545;color:rgba(var(--text-color),1);height:calc(100%);font-size:clamp(1rem,1.2vmax,3rem);background:var(--background-color)}body[data-theme=dark]{--accent-color:#2fb3ff;--text-color:240,240,240;--text-color-light:170,170,170;--foreground-color:20,20,20;--background-color:#0a0a0a;--error-color:rgb(255, 106, 106)}body[data-theme=dark] #outlet_switcher{background:linear-gradient(rgba(var(--text-color),.06),rgba(var(--text-color),.06)),rgba(var(--foreground-color),1)}.full-bleed{grid-column:1/4}.h1{font-size:2.5rem}.h2{font-size:2rem}.h3{font-size:1.4rem}.h4{font-size:1rem}.h5{font-size:.8rem}.uppercase{text-transform:uppercase}.capitalize,.outlet__title{text-transform:capitalize}p{max-width:60ch;line-height:1.7}img{object-fit:cover}button{overflow:hidden;display:inline-flex;align-items:center;border:none;background:0 0;outline:0;color:inherit;font-weight:500}.flex,.floor-label{display:flex}.button{border-radius:.2rem;padding:.5rem .6rem}.button--primary{background:var(--accent-color);color:rgba(var(--foreground-color),1)}.button--primary .icon{fill:rgba(var(--foreground-color),1)}button:focus-visible{outline:solid rgba(var(--text-color),1)}sm-input,sm-textarea{--border-radius:0.2rem;--background:rgba(var(--text-color), 0.06)}sm-button{--border-radius:0.2rem}sm-tab-header{align-self:flex-start}ul{list-style:none}.grid{display:grid}.grid-3{grid-template-columns:repeat(auto-fill,minmax(8rem,1fr))}.flow-column{grid-auto-flow:column}.gap-0-5{gap:.5rem}.gap-1{gap:1rem}.gap-1-5{gap:1.5rem}.gap-2{gap:2rem}.gap-3{gap:3rem}.elevator__header,.popup__header{grid-template-columns:auto 1fr;gap:.5rem}.align-start{align-items:flex-start}.align-center,.popup__header{align-items:center}.text-center{text-align:center}.justify-start{justify-content:start}.justify-center{justify-content:center}.justify-right{margin-left:auto}.button__icon--right,.margin-left-0-5{margin-left:.5rem}.align-self-center{align-self:center}.justify-self-center{justify-self:center}.justify-self-start{justify-self:start}.direction-column{flex-direction:column}.space-between{justify-content:space-between}.w-100{width:100%}.margin-top-1-5{margin-top:1.5rem}.margin-bottom-0-5r{margin-bottom:.5rem}.margin-bottom-1r{margin-bottom:1rem}.margin-bottom-1-5r{margin-bottom:1.5rem}.margin-bottom-2r{margin-bottom:2rem}.margin-bottom-3r{margin-bottom:3rem}.margin-bottom-4r{margin-bottom:4rem}.hide{opacity:0}.hide-completely{display:none!important}.no-transformations{transform:none!important}.overflow-ellipsis{width:100%;overflow:hidden;text-overflow:ellipsis}.ripple{position:absolute;border-radius:50%;transform:scale(0);background:rgba(var(--text-color),.16)}#elevator_popup,.elevator__header{background:rgba(var(--foreground-color),1);top:0}.interact{position:relative;overflow:hidden}.observe-empty-state:empty{display:none}.observe-empty-state:not(:empty)~.empty-state{display:none}.icon{width:1.5rem;height:1.5rem;fill:rgba(var(--text-color),.9)}.icon-only{height:2.6rem;width:2.6rem;padding:.6rem}.close-icon{padding:.3rem}.close-button{left:-.5rem}.button__label{font-size:1rem}.button__icon{height:1.1rem;width:1.1rem}.color-0-9{color:rgba(var(--text-color),.9)}.color-0-8{color:rgba(var(--text-color),.8)}.color-0-7{color:rgba(var(--text-color),.7)}.weight-400{font-weight:400}.weight-500{font-weight:500}.weight-700{font-weight:700}.weight-900{font-weight:900}.popup__header{padding:.5rem 1.5rem 0 1rem;display:grid;width:100%}#elevator_popup{position:absolute;width:100%;height:100%;left:0;right:0;bottom:0;z-index:10;overflow-y:auto;grid-template-rows:auto 1fr}.elevator__header{position:sticky;padding:1.2rem 1.5rem;display:grid;align-items:center;justify-content:flex-start;width:100%;z-index:1}#elevator_sections{align-content:flex-start;padding:0 1.5rem 4rem}#elevator_button_panel{gap:2rem;overflow:auto;scroll-snap-type:x proximity;grid-template-columns:repeat(3,min(40ch,80%))}#elevator_button_panel li{display:grid;gap:2rem;align-content:flex-start;scroll-snap-align:start}#elevator_button_panel sup{font-weight:500;font-size:1rem}.outlet-section{display:grid;user-select:none}.popup__header__close{padding:.5rem;cursor:pointer}.floor__button{position:relative;padding:1rem;height:4rem;width:4rem;justify-content:center;border-radius:.5rem;font-size:1.5rem;font-weight:900;background:rgba(var(--text-color),.06)}.floor-circle,.line-map__circle{border-radius:1rem;position:absolute}.floor__button--active{background:rgba(var(--text-color),.2);box-shadow:0 0 0 .4rem rgba(var(--text-color),1) inset}.elevator__floor-line{flex:1;height:.1rem;margin-left:2rem;background-color:var(--red)}#main_header{position:relative;padding:1rem;grid-template-columns:repeat(3,1fr)}#elevator_button{justify-self:flex-start;margin-left:-1rem}#main_header__logo{height:1.8rem;width:1.8rem}.theme-switcher{position:relative;justify-self:flex-end;width:1.5rem;height:1.5rem}.theme-switcher .icon{position:absolute;transition:transform .6s}.theme-switcher__checkbox{display:none}.theme-switcher__checkbox:checked~.moon-icon{transform:scale(0) rotate(90deg)}.theme-switcher__checkbox:not(:checked)~.sun-icon{transform:scale(0) rotate(-90deg)}.page{position:relative;display:grid;grid-template-columns:1rem 1fr 1rem}#floor_line_map,#home_page{grid-template-columns:2rem 1fr}.page>*{grid-column:2/3}.tag{background:var(--accent-color);padding:.4rem .6rem}#home_page{overflow-y:auto;max-height:calc(100vh - 5rem);background:url(../assets/bg/homepage-bg.svg) center no-repeat;background-size:cover}#floor_line_map{position:sticky;top:1rem;height:40vh;z-index:5;grid-column:1/2}.grid-2,.investor-card{grid-template-columns:auto 1fr}.line-map{height:100%}.line-map__circle{width:1rem;height:1rem;margin-top:-.5rem;background:rgba(var(--foreground-color),1);border:.2rem solid var(--red);transition:transform .1s linear;z-index:5}.line-map__bar{width:.1rem;height:100%;border-radius:1rem;background:var(--red)}.floor-label{position:absolute;align-items:center;left:.75rem;margin-top:-.9rem;padding-bottom:1rem;user-select:none}.outlet-number,.outlet-preview{display:grid;position:relative}.floor-label--active .floor-title{opacity:1;box-shadow:0 0 .5rem rgba(0,0,0,.2)}.floor-circle{height:.5rem;width:.5rem;background:rgba(var(--text-color),1)}#outlet_switcher,.floor-title,sm-carousel{background:rgba(var(--foreground-color),1)}.floor-title{opacity:.5;font-size:.9rem;padding:.4rem .6rem;margin-left:1rem;border-radius:.2rem;transition:box-shadow .3s,opacity .3s}#floor_container{width:calc(100% - 1rem)}.floor{padding-bottom:3rem;width:100%}.big-icon,.outlet-number{width:2rem;height:2rem}#floor_1__outlets{margin:3rem 0;gap:1.5rem}.outlet-preview{align-items:center}.outlet-number{aspect-ratio:1/1;font-size:1.3rem;font-weight:900;margin-bottom:.5rem;border-radius:.2rem;place-content:center;justify-self:flex-start;background:rgba(var(--text-color),1);color:rgba(var(--foreground-color),1);box-shadow:.2rem .2rem 0 var(--red)}.outlet-preview__info{position:relative;padding:1rem;border-radius:.5rem}.outlet__title{font-weight:700;font-size:1.8rem;margin-bottom:.8rem}.outlet__description{color:rgba(var(--text-color),.8)}.outlet-label,.outlet_switcher__button--active,.room-button[active]{color:var(--accent-color)}.outlet-preview__border{position:absolute;height:100%;width:100%;z-index:-1;box-shadow:0 0 0 .1rem rgba(var(--text-color),.2);border-radius:.5rem}.outlet-preview__button{justify-self:flex-end}.label{position:relative;font-size:.8rem;margin-bottom:.3rem}.value{font-size:1.3rem}sm-carousel{position:relative;height:100%;border-radius:.5rem;padding:1.5rem 1.5rem 4rem;--arrow-left:1.5rem;--arrow-right:1.5rem;--arrow-fill:rgba(var(--text-color), 1);--arrow-background:transparent;--arrow-box-shadow:none;--arrow-bottom:-3.5rem;--indicator-bottom:-2.5rem}.bit-bond-series__row,.bob-fund__row,.investor-card{min-width:100%}.investor-card{align-items:flex-start;grid-template-rows:auto 1fr}.investor-card--small{grid-template-areas:"img ." "para para"}.investor-card--small .investor__image{width:4rem;height:4rem;border-radius:50%}.investor-card--big{grid-template-areas:"img ." "img para"}.investor__image{grid-area:img;width:5rem;border-radius:.5rem}.investor__bio{font-size:.9rem;margin-top:.5rem}.investor__contribution-container{grid-area:para}#outlet_switcher{position:absolute;top:0;padding:1rem;border-radius:.3rem;box-shadow:0 2rem 4rem -1rem rgba(0,0,0,.2);z-index:2}.outlet_switcher__button{font-size:1rem;padding:.4rem 0}.outlet_switcher__button:not(:last-of-type)::after{content:"";position:relative;width:4vw;height:.1rem;margin:0 .5rem;background:var(--red)}.outlet-label{display:flex;align-items:center;justify-self:flex-start;margin-bottom:.5rem;font-size:1rem}.outlet-label .icon{fill:var(--accent-color);margin-right:.5rem}scroll-tab-header{position:sticky;top:0;--padding:0.5rem 0;--border-radius:0.3rem;--background:var(--background-color);--grid-auto-flow:column;z-index:1}scroll-tab-panels{--background:transparent;overscroll-behavior:contain}scroll-tab-panels>*{min-height:100vh;padding-top:4rem;opacity:.4;transition:opacity .6s}.room-button,.td{padding:.6rem .8rem}scroll-tab-panels>[active]{opacity:1}.auto-grid-layout{justify-content:flex-start;overflow-x:auto}.room-button{position:relative;opacity:.6;border-radius:0;font-weight:500;font-size:1.1rem;transition:opacity .3s,background-color .3s}.room-button[active]{opacity:1}.room-button[active] .icon{fill:var(--accent-color)}.room-button[active]::after{content:"";position:absolute;height:.1rem;width:100%;bottom:0;left:0;border-radius:.2rem .2rem 0 0;background:var(--accent-color)}table{border-collapse:collapse;width:max-content}.tr{margin:.5rem}.tr:nth-of-type(even){background:rgba(var(--text-color),.1)}#ico_page__carousel{width:min(36rem,100%);height:max-content}.phase{grid-template-columns:4rem 1fr}.phase:not(:last-of-type) .phase__description{padding-bottom:1.5rem}.phase:last-of-type .progress-bar__line{height:0}.progress-bar__circle,.progress-bar__line{position:absolute;margin-top:1rem;left:50%;transform:translateX(-50%)}.progress-bar__circle{padding:.4rem;background:rgba(var(--foreground-color),1);border:rgba(var(--text-color),1) solid;border-radius:50%;z-index:1}.progress-bar__line{height:100%;width:.1rem;background:rgba(var(--text-color),.9)}.phase__date{margin-top:.3rem}.phase__description{margin-top:1rem}@media only screen and (max-width:640px){.hide-on-mobile{display:none}.floor-label{transition:transform .3s}.floor-label .floor-title{opacity:0;transform:translateX(-1rem);transition:opacity .3s,transform .3s}.floor-label--active{opacity:1}.floor-label--active .floor-title{opacity:1;box-shadow:0 0 .5rem rgba(0,0,0,.2);transform:none}#outlet_switcher{width:calc(100% - 2rem)}.outlet-hero-section{margin-top:2rem}}@media only screen and (min-width:640px){.page{grid-template-columns:1fr 90vw 1fr}.h1{font-size:4rem}.h2{font-size:2.5rem}.h3{font-size:1.5rem}.h4{font-size:1.1rem}#main_header{padding:1.2rem 2rem}#elevator_sections{padding:0 3rem 4rem 4.6rem}#home_page{grid-template-columns:1fr 80vw 1fr}#floor_line_map{margin-left:.8rem}#floor_1__outlets{gap:5rem}.outlet-preview{gap:1rem;grid-template-columns:repeat(2,1fr)}.carousel-holder{align-self:flex-start;transform:translateY(-2rem);z-index:1;border-radius:.5rem}.carousel-holder--left{grid-row:1/2;grid-column:1/2;box-shadow:-2rem 5rem 4rem -2rem rgba(0,0,0,.2)}.carousel-holder--left~.outlet-preview__border{justify-self:flex-end}.carousel-holder--right{box-shadow:2rem 5rem 4rem -2rem rgba(0,0,0,.2)}.outlet-preview__border{width:66%}.outlet-preview__info{padding:2rem}.outlet-preview__carousel{padding:2rem 2rem 5rem}#outlet_switcher{padding:1rem 1.5rem}.outlet-hero-section{margin-top:4rem}.auto-grid-layout{grid-template-columns:auto 1fr}.investor__image{width:8rem}}@media only screen and (min-width:1280px){.page{grid-template-columns:1fr 80vw 1fr}.grid-3{justify-content:center}.grid-3>.grid{width:100%}}@media only screen and (min-width:1920px){#home_page,.page{grid-template-columns:1fr 60vw 1fr}}@media (any-hover:hover){::-webkit-scrollbar{width:.5rem;height:.5rem}::-webkit-scrollbar-thumb{background:rgba(var(--text-color),.3);border-radius:1rem}::-webkit-scrollbar-thumb:hover{background:rgba(var(--text-color),.5)}.page-link{cursor:pointer;transition:color .3s}.page-link:hover{color:var(--accent-color)}.page-link:hover .icon{fill:var(--accent-color)}.outlet-section .icon{transform:translateX(-.5rem);transition:transform .3s}.outlet-section:hover .icon{transform:none}.floor__button:hover{background:rgba(var(--text-color),.2)}}
\ No newline at end of file
diff --git a/css/main.scss b/css/main.scss
index a194d00..0556195 100644
--- a/css/main.scss
+++ b/css/main.scss
@@ -12,36 +12,33 @@ body {
--text-color: 17, 17, 17;
--text-color-light: 100, 100, 100;
--foreground-color: 255, 255, 255;
- --background-color: #efefef;
+ --background-color: #F3F3F3;
--error-color: red;
--red: #E84545;
color: rgba(var(--text-color), 1);
height: calc(100%);
font-size: clamp(1rem, 1.2vmax, 3rem);
- background: #F3F3F3;
+ background: var(--background-color);
}
body[data-theme='dark']{
--accent-color:#2fb3ff;
--text-color: 240, 240, 240;
--text-color-light: 170, 170, 170;
--foreground-color: 20, 20, 20;
+ --background-color: #0a0a0a;
--error-color: rgb(255, 106, 106);
- background: #0a0a0a;
#outlet_switcher{
background: linear-gradient(rgba(var(--text-color), 0.06), rgba(var(--text-color), 0.06)), rgba(var(--foreground-color), 1);
}
- .outlet-preview__info{
- background-color: #0a0a0a;
- }
}
.full-bleed{
grid-column: 1/4;
}
-.h1, .h2, .h3, .h4, .h5{
- // font-family: 'Lorr', serif;
-}
+/* .h1, .h2, .h3, .h4, .h5{
+ // font-family: 'Lora', serif;
+} */
.h1{
font-size: 2.5rem;
}
@@ -534,10 +531,26 @@ ul{
align-items: center;
display: grid;
}
+.outlet-number{
+ display: grid;
+ position: relative;
+ width: 2rem;
+ height: 2rem;
+ aspect-ratio: 1/1;
+ font-size: 1.3rem;
+ font-weight: 900;
+ margin-bottom: 0.5rem;
+ border-radius: 0.2rem;
+ place-content: center;
+ justify-self: flex-start;
+ background: rgba(var(--text-color), 1);
+ color: rgba(var(--foreground-color), 1);
+ box-shadow: 0.2rem 0.2rem 0 var(--red);
+}
.outlet-preview__info{
+ position: relative;
padding: 1rem;
border-radius: 0.5rem;
- background-color: #F3F3F3;
}
.outlet__title{
font-weight: 700;
@@ -553,16 +566,16 @@ ul{
height: 100%;
width: 100%;
z-index: -1;
- box-shadow: 0 0 0 0.1rem rgba(var(--text-color), 0.3);
+ box-shadow: 0 0 0 0.1rem rgba(var(--text-color), 0.2);
border-radius: 0.5rem;
}
.outlet-preview__button{
- justify-self: flex-start;
+ justify-self: flex-end;
}
-.outlet-preview__carousel{
+/* .outlet-preview__carousel{
}
-
+ */
.label{
position: relative;
font-size: 0.8rem;
@@ -658,29 +671,21 @@ sm-carousel{
}
}
-scroll-tab-header,
-scroll-tab-panels{
- --border-radius: 0.5rem;
-}
scroll-tab-header{
position: sticky;
top: 0;
- --gap: 0.5rem;
- --padding: 0.5rem;
- margin-right: 1.5rem;
- --background: linear-gradient(rgba(var(--text-color), 0.04), rgba(var(--text-color), 0.04)), rgba(var(--foreground-color), 1);
+ --padding: 0.5rem 0;
+ --border-radius: 0.3rem;
+ --background: var(--background-color);
--grid-auto-flow: column;
- justify-self: flex-start;
z-index: 1;
}
scroll-tab-panels{
- --height: max(24rem, 50vh);
- --gap: 4rem;
--background: transparent;
overscroll-behavior: contain;
& > *{
- min-height: max(24rem, 50vh);
- margin-bottom: 6rem;
+ min-height: 100vh;
+ padding-top: 4rem;
opacity: 0.4;
transition: opacity 0.6s;
}
@@ -696,19 +701,29 @@ scroll-tab-panels{
grid-template-columns: auto 1fr;
}
.room-button{
+ position: relative;
+ opacity: 0.6;
+ border-radius: 0;
font-weight: 500;
font-size: 1.1rem;
- opacity: 0.6;
transition: opacity 0.3s, background-color 0.3s;
padding: 0.6rem 0.8rem;
&[active]{
- background-color: rgba(var(--text-color), 0.06);
opacity: 1;
- border-radius: 0.3rem;
color: var(--accent-color);
.icon{
fill: var(--accent-color);
}
+ &::after{
+ content: '';
+ position: absolute;
+ height: 0.1rem;
+ width: 100%;
+ bottom: 0;
+ left: 0;
+ border-radius: 0.2rem 0.2rem 0 0;
+ background: var(--accent-color);
+ }
}
}
@@ -857,7 +872,7 @@ table{
width: 66%;
}
.outlet-preview__info{
- padding: 2rem 3rem;
+ padding: 2rem;
}
.outlet-preview__carousel{
padding: 2rem 2rem 5rem 2rem;
@@ -868,9 +883,6 @@ table{
.outlet-hero-section{
margin-top: 4rem;
}
- scroll-tab-header{
- --grid-auto-flow: row;
- }
.auto-grid-layout{
grid-template-columns: auto 1fr;
}
diff --git a/index.html b/index.html
index f06e564..c5f5dca 100644
--- a/index.html
+++ b/index.html
@@ -139,15 +139,15 @@
-
BitCoin Bonds
+
1. BitCoin Bonds
Lorem ipsum dolor sit amet consectetur adipisicing elit. Beatae, quae!
-
Bob's Fund
+
2. Bob's Fund
Lorem ipsum dolor sit amet consectetur adipisicing elit. Beatae, quae!
-
ICO
+
3. ICO
Lorem ipsum dolor sit amet consectetur adipisicing elit. Beatae, quae!
@@ -210,13 +210,14 @@
+
1
bitcoin bonds
Lorem ipsum dolor sit amet consectetur adipisicing elit. Magnam reprehenderit cumque sequi earum.
@@ -226,13 +227,14 @@
+
2
Bob's Fund
Lorem ipsum dolor sit amet consectetur adipisicing elit. Magnam reprehenderit cumque sequi earum.
@@ -242,13 +244,14 @@
+
3
ICO
Lorem ipsum dolor sit amet consectetur adipisicing elit. Magnam reprehenderit cumque sequi earum.
@@ -296,64 +299,62 @@
BitCoin Bonds
-
Lorem ipsum dolor sit amet consectetur adipisicing elit. Harum cumque aut illum soluta. Inventore nihil quisquam harum quo mollitia sunt!
+
lorem40 Lorem ipsum dolor sit amet consectetur adipisicing elit. Harum cumque aut illum soluta. Inventore nihil quisquam harum quo mollitia sunt!
Rooms
-
-
-
-
-
-
-
-
-
-
- | Series |
- Series date |
- Time Elapsed |
- Current value |
- Rate of return |
+
+
+
+
+
+
+
+
+
+ | Series |
+ Series date |
+ Time Elapsed |
+ Current value |
+ Rate of return |
+
+
+
+
+ | $975 |
-
-
- | $975 |
-
-
- | $1057 |
-
-
- | $1064 |
-
-
- | $1205 |
-
-
- | $1285 |
-
-
- | $2513 |
-
+ $1057 |
+
+
+ | $1064 |
-
-
-
-
- Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga inventore error omnis ipsam ut incidunt, doloremque pariatur expedita distinctio itaque.
-
-
-
+
+ | $1205 |
+
+
+ | $1285 |
+
+
+ | $2513 |
+
+
+
+
+
+
+ Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga inventore error omnis ipsam ut incidunt, doloremque pariatur expedita distinctio itaque.
+
+
@@ -367,7 +368,6 @@
Lorem ipsum dolor sit amet consectetur adipisicing elit. Harum cumque aut illum soluta. Inventore nihil quisquam harum quo mollitia sunt!
Rooms
-
-
@@ -405,7 +404,6 @@
Lorem ipsum dolor sit amet consectetur adipisicing elit. Harum cumque aut illum soluta. Inventore nihil quisquam harum quo mollitia sunt!
Rooms
-
-
+