:root {
--grey: #f1f0f6;
--dark-grey: #8d8d8d;
--light: #fff;
--dark: #000;
--green: #81d43a;
--light-green: #e3ffcb;
--blue: #011c41;
--light-blue: #d0e4ff;
--light-bule-2: #e5f1f9;
--dark-blue: #011c41;
--red: #fc3b56;
--textdefault: rgba(51, 51, 51, 1);
--textsubdued: rgba(109, 118, 133, 1);
--syscolorbordersubdued: rgba(219, 221, 221, 1);
--syscolorborderhover: rgba(230, 232, 236, 1);
--texton-accent: rgba(255, 255, 255, 1);
--surfacedefault: rgba(255, 255, 255, 1);
--headings-macos-medium-h6-font-family: "SF Pro Text", Helvetica;
--headings-macos-medium-h6-font-weight: 500;
--headings-macos-medium-h6-font-size: 14px;
--headings-macos-medium-h6-letter-spacing: 0.00800000011920929px;
--headings-macos-medium-h6-line-height: 20px;
--headings-macos-medium-h6-font-style: normal;
--body-macos-description-font-family: "SF Pro Text", Helvetica;
--body-macos-description-font-weight: 400;
--body-macos-description-font-size: 14px;
--body-macos-description-letter-spacing: 0.007000000104308128px;
--body-macos-description-line-height: 20px;
--body-macos-description-font-style: normal;
--body-macos-paragraph-normal-font-family: "SF Pro Text", Helvetica;
--body-macos-paragraph-normal-font-weight: 400;
--body-macos-paragraph-normal-font-size: 16px;
--body-macos-paragraph-normal-letter-spacing: 0.00800000011920929px;
--body-macos-paragraph-normal-line-height: 24px;
--body-macos-paragraph-normal-font-style: normal;
--arcturus-styles-sys-color-border-default: var(--arcturus-primatives-ref-palette-neutral-30);
--arcturus-styles-sys-sizing-icon-m: var(--arcturus-styles-sys-sizing-300);
--arcturus-styles-sys-sizing-300: 24px;
--arcturus-primatives-ref-palette-neutral-30: rgba(194, 196, 197, 1);
--textsubdued: rgba(109, 118, 133, 1);
--textdefault: rgba(51, 51, 51, 1);
--surfacedefault: rgba(255, 255, 255, 1);
--headings-macos-medium-h2-font-family: "SF Pro Display", Helvetica;
--headings-macos-medium-h2-font-weight: 500;
--headings-macos-medium-h2-font-size: 38px;
--headings-macos-medium-h2-letter-spacing: 0.019000000283122064px;
--headings-macos-medium-h2-line-height: 48px;
--headings-macos-medium-h2-font-style: normal;
--headings-macos-medium-h4-font-family: "SF Pro Display", Helvetica;
--headings-macos-medium-h4-font-weight: 500;
--headings-macos-medium-h4-font-size: 24px;
--headings-macos-medium-h4-letter-spacing: 0.012000000178813934px;
--headings-macos-medium-h4-line-height: 30px;
--headings-macos-medium-h4-font-style: normal;
--comp-typography-headings-macos-semibold-h6-font-family: "SF Pro Display", Helvetica;
--comp-typography-headings-macos-semibold-h6-font-weight: 400;
--comp-typography-headings-macos-semibold-h6-font-size: 16px;
--comp-typography-headings-macos-semibold-h6-letter-spacing: 0.00800000011920929px;
--comp-typography-headings-macos-semibold-h6-line-height: 20px;
--comp-typography-headings-macos-semibold-h6-font-style: normal;
--comp-typography-body-macos-description-font-family: "SF Pro Text", Helvetica;
--comp-typography-body-macos-description-font-weight: 400;
--comp-typography-body-macos-description-font-size: 14px;
--comp-typography-body-macos-description-letter-spacing: 0.007000000104308128px;
--comp-typography-body-macos-description-line-height: 20px;
--comp-typography-body-macos-description-font-style: normal;
--comp-typography-headings-macos-bold-h6-font-family: "SF Pro Display", Helvetica;
--comp-typography-headings-macos-bold-h6-font-weight: 700;
--comp-typography-headings-macos-bold-h6-font-size: 16px;
--comp-typography-headings-macos-bold-h6-letter-spacing: 0.00800000011920929px;
--comp-typography-headings-macos-bold-h6-line-height: 20px;
--comp-typography-headings-macos-bold-h6-font-style: normal;
--headings-macos-medium-h5-font-family: "SF Pro Display", Helvetica;
--headings-macos-medium-h5-font-weight: 500;
--headings-macos-medium-h5-font-size: 20px;
--headings-macos-medium-h5-letter-spacing: 0.010000000149011612px;
--headings-macos-medium-h5-line-height: 24px;
--headings-macos-medium-h5-font-style: normal;
--headings-macos-semibold-h6-font-family: "SF Pro Display", Helvetica;
--headings-macos-semibold-h6-font-weight: 400;
--headings-macos-semibold-h6-font-size: 16px;
--headings-macos-semibold-h6-letter-spacing: 0.00800000011920929px;
--headings-macos-semibold-h6-line-height: 20px;
--headings-macos-semibold-h6-font-style: normal;
--body-macos-subtitle-font-family: "SF Pro Text", Helvetica;
--body-macos-subtitle-font-weight: 700;
--body-macos-subtitle-font-size: 14px;
--body-macos-subtitle-letter-spacing: 0.006000000089406967px;
--body-macos-subtitle-line-height: 18px;
--body-macos-subtitle-font-style: normal;
--body-macos-caption-font-family: "SF Pro Text", Helvetica;
--body-macos-caption-font-weight: 400;
--body-macos-caption-font-size: 14px;
--body-macos-caption-letter-spacing: 0.006000000089406967px;
--body-macos-caption-line-height: 18px;
--body-macos-caption-font-style: normal;
--comp-typography-headings-macos-medium-h2-font-family: "SF Pro Display", Helvetica;
--comp-typography-headings-macos-medium-h2-font-weight: 500;
--comp-typography-headings-macos-medium-h2-font-size: 38px;
--comp-typography-headings-macos-medium-h2-letter-spacing: 0.019000000283122064px;
--comp-typography-headings-macos-medium-h2-line-height: 48px;
--comp-typography-headings-macos-medium-h2-font-style: normal;
--body-macos-link-default-font-family: "SF Pro Text", Helvetica;
--body-macos-link-default-font-weight: 500;
--body-macos-link-default-font-size: 16px;
--body-macos-link-default-letter-spacing: 0.00800000011920929px;
--body-macos-link-default-line-height: 24px;
--body-macos-link-default-font-style: normal;
--body-macos-paragraph-small-font-family: "SF Pro Text", Helvetica;
--body-macos-paragraph-small-font-weight: 400;
--body-macos-paragraph-small-font-size: 14px;
--body-macos-paragraph-small-letter-spacing: 0.007000000104308128px;
--body-macos-paragraph-small-line-height: 20px;
--body-macos-paragraph-small-font-style: normal;
--comp-typography-body-macos-link-default-font-family: "SF Pro Text", Helvetica;
--comp-typography-body-macos-link-default-font-weight: 500;
--comp-typography-body-macos-link-default-font-size: 16px;
--comp-typography-body-macos-link-default-letter-spacing: 0.00800000011920929px;
--comp-typography-body-macos-link-default-line-height: 24px;
--comp-typography-body-macos-link-default-font-style: normal;
--body-macos-paragraph-normal-font-family: "SF Pro Text", Helvetica;
--body-macos-paragraph-normal-font-weight: 400;
--body-macos-paragraph-normal-font-size: 16px;
--body-macos-paragraph-normal-letter-spacing: 0.00800000011920929px;
--body-macos-paragraph-normal-line-height: 24px;
--body-macos-paragraph-normal-font-style: normal;
--shadow-md: 0px 2px 4px -2px rgba(16, 24, 41, 0.06), 0px 4px 8px -2px rgba(16, 24, 41, 0.1);
--arcturus-styles-sys-color-text-inverse: var(--arcturus-primatives-ref-palette-neutral-white);
--arcturus-styles-sys-color-text-default: var(--arcturus-primatives-ref-palette-navy-100);
--arcturus-styles-sys-color-text-disabled: var(--arcturus-primatives-ref-palette-navy-30);
--arcturus-styles-sys-color-text-subdued: var(--arcturus-styles-sys-color-semantic-subdued);
--arcturus-styles-sys-color-surface-hover: var(--arcturus-primatives-ref-palette-navy-20);
--arcturus-styles-sys-sizing-icon-m: var(--arcturus-styles-sys-sizing-300);
--arcturus-styles-sys-color-semantic-subdued: var(--arcturus-primatives-ref-palette-navy-60);
--arcturus-styles-sys-sizing-300: 24px;
--arcturus-styles-sys-color-action-secondary-default: var(--arcturus-primatives-ref-palette-neutral-white);
--arcturus-styles-sys-color-border-subdued: var(--arcturus-primatives-ref-palette-neutral-20);
--arcturus-styles-sys-color-semantic-interactive: var(--arcturus-primatives-ref-palette-cobalt-120);
--arcturus-styles-sys-color-surface-highlight: var(--arcturus-primatives-ref-palette-cobalt-20);
--arcturus-styles-sys-color-action-primary-default: var(--arcturus-primatives-ref-palette-cobalt-100);
--arcturus-styles-sys-color-surface-default: var(--arcturus-primatives-ref-palette-neutral-white);
--arcturus-styles-sys-color-border-default: var(--arcturus-primatives-ref-palette-neutral-30);
--arcturus-styles-sys-color-action-secondary-hover: var(--arcturus-primatives-ref-palette-navy-20);
--arcturus-styles-sys-color-action-primary-hover: var(--arcturus-primatives-ref-palette-cobalt-120);
--arcturus-styles-sys-color-border-transparent: var(--arcturus-primatives-ref-palette-neutral-transparent);
--arcturus-styles-sys-color-border-active: var(--arcturus-primatives-ref-palette-cobalt-100);
--arcturus-styles-sys-color-border-hover: var(--arcturus-primatives-ref-palette-neutral-50);
--arcturus-styles-sys-color-semantic-subdued-duplicate: var(--arcturus-primatives-ref-palette-neutral-100);
--arcturus-primatives-ref-palette-neutral-white: rgba(255, 255, 255, 1);
--arcturus-primatives-ref-palette-navy-100: rgba(1, 28, 65, 1);
--arcturus-primatives-ref-palette-navy-30: rgba(179, 187, 198, 1);
--arcturus-primatives-ref-palette-navy-20: rgba(204, 210, 217, 1);
--arcturus-primatives-ref-palette-navy-60: rgba(103, 119, 141, 1);
--arcturus-primatives-ref-palette-neutral-20: rgba(219, 221, 221, 1);
--arcturus-primatives-ref-palette-cobalt-120: rgba(1, 91, 158, 1);
--arcturus-primatives-ref-palette-cobalt-20: rgba(204, 227, 244, 1);
--arcturus-primatives-ref-palette-cobalt-100: rgba(1, 114, 197, 1);
--arcturus-primatives-ref-palette-neutral-30: rgba(194, 196, 197, 1);
--arcturus-primatives-ref-palette-neutral-transparent: rgba(0, 0, 0, 0);
--arcturus-primatives-ref-palette-neutral-50: rgba(146, 147, 148, 1);
--arcturus-primatives-ref-palette-neutral-100: rgba(109, 118, 133, 1);
--shadow-md: 0px 2px 4px -2px rgba(16, 24, 41, 0.06), 0px 4px 8px -2px rgba(16, 24, 41, 0.1);
--arcturus-styles-sys-color-text-default: var(--arcturus-primatives-ref-palette-navy-100);
--arcturus-styles-sys-color-text-subdued: var(--arcturus-primatives-ref-palette-neutral-100);
--arcturus-styles-sys-color-surface-hover: var(--arcturus-primatives-ref-palette-navy-20);
--arcturus-styles-sys-color-surface-default: var(--arcturus-primatives-ref-palette-neutral-white);
--arcturus-styles-sys-sizing-icon-m: var(--arcturus-styles-sys-sizing-300);
--arcturus-styles-sys-color-semantic-subdued: var(--arcturus-primatives-ref-palette-navy-60);
--arcturus-styles-sys-sizing-300: 24px;
--arcturus-styles-sys-color-border-default: var(--arcturus-primatives-ref-palette-neutral-30);
--arcturus-styles-sys-color-surface-default-duplicate: var(--arcturus-primatives-ref-palette-neutral-white-duplicate);
--arcturus-styles-sys-color-surface-background: var(--arcturus-primatives-ref-palette-neutral-10);
--arcturus-styles-sys-color-border-default-duplicate: var(--arcturus-primatives-ref-palette-neutral-70);
--arcturus-styles-sys-color-border-active: var(--arcturus-primatives-ref-palette-cobalt-100);
--arcturus-styles-sys-color-border-hover: var(--arcturus-primatives-ref-palette-neutral-50);
--arcturus-styles-sys-color-semantic-subdued-duplicate: var(--arcturus-primatives-ref-palette-neutral-100);
--arcturus-styles-sys-color-text: var(--arcturus-primatives-ref-palette-neutral-120);
--arcturus-styles-sys-color-semantic-success: var(--arcturus-primatives-ref-palette-green-120);
--arcturus-styles-sys-icon-sm: var(--arcturus-styles-sys-sizing-200);
--arcturus-styles-sys-sizing-200: 16px;
--arcturus-styles-sys-border-radius-squircle: 4px;
--arcturus-styles-sys-icon-m: var(--arcturus-styles-sys-sizing-300-duplicate);
--arcturus-styles-sys-sizing-icon-sm: var(--arcturus-styles-sys-sizing-200-duplicate);
--arcturus-styles-sys-sizing-300-duplicate: 24px;
--arcturus-styles-sys-sizing-200-duplicate: 16px;
--arcturus-styles-sys-color-surface-hover-default: var(--arcturus-primatives-ref-palette-navy-20);
--arcturus-styles-sys-color-text-success: var(--arcturus-primatives-ref-palette-green-120);
--arcturus-styles-sys-color-text-critical: var(--arcturus-primatives-ref-palette-magenta-110);
--arcturus-styles-sys-color-text-inverse: var(--arcturus-primatives-ref-palette-neutral-white);
--arcturus-styles-sys-color-surface-dark: var(--arcturus-primatives-ref-palette-neutral-90);
--arcturus-styles-sys-color-border-transparent: var(--arcturus-primatives-ref-palette-neutral-transparent);
--arcturus-styles-sys-color-border-hover-duplicate: var(--arcturus-primatives-ref-palette-neutral-80);
--arcturus-styles-sys-color-border-active-duplicate: var(--arcturus-primatives-ref-palette-blue-100);
--arcturus-styles-sys-color-text-info: var(--arcturus-primatives-ref-palette-cobalt-120);
--arcturus-styles-sys-color-border-subdued: var(--arcturus-primatives-ref-palette-neutral-20);
--arcturus-styles-sys-color-action-primary-default: var(--arcturus-primatives-ref-palette-cobalt-100);
--arcturus-styles-sys-color-action-primary-hover: var(--arcturus-primatives-ref-palette-cobalt-120);
--arcturus-primatives-ref-palette-navy-100: rgba(1, 28, 65, 1);
--arcturus-primatives-ref-palette-neutral-100: rgba(109, 118, 133, 1);
--arcturus-primatives-ref-palette-navy-20: rgba(204, 210, 217, 1);
--arcturus-primatives-ref-palette-neutral-white: rgba(255, 255, 255, 1);
--arcturus-primatives-ref-palette-navy-60: rgba(103, 119, 141, 1);
--arcturus-primatives-ref-palette-neutral-30: rgba(194, 196, 197, 1);
--arcturus-primatives-ref-palette-neutral-white-duplicate: rgba(255, 255, 255, 1);
--arcturus-primatives-ref-palette-neutral-10: rgba(246, 245, 246, 1);
--arcturus-primatives-ref-palette-neutral-70: rgba(204, 204, 204, 1);
--arcturus-primatives-ref-palette-cobalt-100: rgba(1, 114, 197, 1);
--arcturus-primatives-ref-palette-neutral-50: rgba(146, 147, 148, 1);
--arcturus-primatives-ref-palette-neutral-120: rgba(51, 51, 51, 1);
--arcturus-primatives-ref-palette-green-120: rgba(0, 103, 59, 1);
--arcturus-primatives-ref-palette-magenta-110: rgba(184, 0, 67, 1);
--arcturus-primatives-ref-palette-neutral-90: rgba(49, 49, 49, 1);
--arcturus-primatives-ref-palette-neutral-transparent: rgba(0, 0, 0, 0);
--arcturus-primatives-ref-palette-neutral-80: rgba(184, 184, 184, 1);
--arcturus-primatives-ref-palette-blue-100: rgba(0, 108, 182, 1);
--arcturus-primatives-ref-palette-cobalt-120: rgba(1, 91, 158, 1);
--arcturus-primatives-ref-palette-neutral-20: rgba(219, 221, 221, 1);
--textdefault: rgba(51, 51, 51, 1);
--surfacedefault: rgba(255, 255, 255, 1);
--headings-macos-medium-h4-font-family: "SF Pro Display", Helvetica;
--headings-macos-medium-h4-font-weight: 500;
--headings-macos-medium-h4-font-size: 24px;
--headings-macos-medium-h4-letter-spacing: 0.012000000178813934px;
--headings-macos-medium-h4-line-height: 30px;
--headings-macos-medium-h4-font-style: normal;
--comp-typography-headings-macos-bold-h6-font-family: "SF Pro Display",
Helvetica;
--comp-typography-headings-macos-bold-h6-font-weight: 700;
--comp-typography-headings-macos-bold-h6-font-size: 16px;
--comp-typography-headings-macos-bold-h6-letter-spacing: 0.00800000011920929px;
--comp-typography-headings-macos-bold-h6-line-height: 20px;
--comp-typography-headings-macos-bold-h6-font-style: normal;
--body-macos-paragraph-normal-font-family: "SF Pro Text", Helvetica;
--body-macos-paragraph-normal-font-weight: 400;
--body-macos-paragraph-normal-font-size: 16px;
--body-macos-paragraph-normal-letter-spacing: 0.00800000011920929px;
--body-macos-paragraph-normal-line-height: 24px;
--body-macos-paragraph-normal-font-style: normal;
--comp-typography-headings-macos-semibold-h6-font-family: "SF Pro Display",
Helvetica;
--comp-typography-headings-macos-semibold-h6-font-weight: 400;
--comp-typography-headings-macos-semibold-h6-font-size: 16px;
--comp-typography-headings-macos-semibold-h6-letter-spacing: 0.00800000011920929px;
--comp-typography-headings-macos-semibold-h6-line-height: 20px;
--comp-typography-headings-macos-semibold-h6-font-style: normal;
--arcturus-styles-sys-color-text-default: var(--arcturus-primatives-ref-palette-navy-100);
--arcturus-styles-sys-color-action-primary-default: var(--arcturus-primatives-ref-palette-cobalt-100);
--arcturus-styles-sys-sizing-icon-m: var(--arcturus-styles-sys-sizing-300);
--arcturus-styles-sys-sizing-300: 24px;
--arcturus-styles-sys-color-action-secondary-default: var(--arcturus-primatives-ref-palette-neutral-white);
--arcturus-styles-sys-color-border-default: var(--arcturus-primatives-ref-palette-neutral-30);
--arcturus-primatives-ref-palette-navy-100: rgba(1, 28, 65, 1);
--arcturus-primatives-ref-palette-cobalt-100: rgba(1, 114, 197, 1);
--arcturus-primatives-ref-palette-neutral-white: rgba(255, 255, 255, 1);
--arcturus-primatives-ref-palette-neutral-30: rgba(194, 196, 197, 1);
}
* {
font-family: "SF Pro Text", Helvetica;
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
background: var(--grey);
}
a {
text-decoration: none;
}
li {
list-style: none;
}
h4 {
color: var(--arcturus-styles-sys-color-text-default) 333;
font-size: 1em;
margin: 13px 0;
font-weight: 600;
}
h3 {
font-size: 1.6em;
margin: 15px 0 13px 0;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
font-weight: 600;
color: #011C41;
line-height: 1em;
}
h2 {
color: var(--arcturus-styles-sys-color-text-default)333;
font-size: 1.5em;
margin: 0 0 10px;
}
/* QUESTIONS*/
.q-header {
display: flex;
flex-direction: row;
align-items: flex-end;
justify-content: space-between;
width: 100%;
height: 72px;
background: #fff;
border-bottom: 1px solid #C2C4C5;
box-sizing: border-box;
font-family: 'SF Pro Text', 'SF Pro Display', Arial, sans-serif;
}
.sub-header {
display: flex
;
flex-direction: row;
align-items: flex-end;
justify-content: space-between;
width: 100%;
height: 72px;
background: #fff;
/* border-bottom: 1px solid #C2C4C5; */
padding: 12px 11px 20px 4px;
box-sizing: border-box;
font-family: 'SF Pro Text', 'SF Pro Display', Arial, sans-serif;
}
.logo-title {
display: flex;
flex-direction: row;
align-items: center;
gap: 16px;
}
.logo {
width: 132px;
height: 40px;
object-fit: contain;
}
.title {
font-family: 'SF Pro Display', Arial, sans-serif;
font-weight: 500;
font-size: 20px;
color: #011C41;
}
.section-nav {
flex: 1;
display: flex;
align-items: center;
margin-left: 32px;
}
.section-select {
width: 343px;
height: 32px;
border-radius: 8px;
border: 1px solid #C2C4C5;
padding: 4px 12px;
font-size: 16px;
color: #011C41;
background: #fff;
}
.progress-exit {
display: flex;
align-items: center;
gap: 12px;
padding: 10px;
}
.progress-info {
display: flex;
align-items: center;
gap: 12px;
}
.progress-label {
font-size: 14px;
color: #000;
}
.progress-bar-bg {
width: 120px;
height: 12px;
background: #E9E9EB;
border-radius: 8px;
overflow: hidden;
position: relative;
}
.progress-bar-fill {
height: 100%;
background: #015B9E;
border-radius: 8px 0 0 8px;
transition: width 0.3s;
}
.exit-link {
display: flex;
align-items: center;
color: #011C41;
font-size: 14px;
text-decoration: none;
gap: 4px;
}
.exit-icon {
font-size: 18px;
margin-left: 2px;
}
/* PRODUCT CAROUSEL */
.popular-item {
background-color: white;
border-radius: 8px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
overflow: hidden;
display: flex;
align-items: center;
width: 100%;
height: 100%;
}
.popular-picture {
width: 30%;
height: 100%;
border-top-left-radius: 5px;
border-bottom-left-radius: 5px;
object-fit: cover;
}
.info-container {
padding: 15px 8px;
width: 68%;
}
p {
font-size: 1.2em;
line-height: 1.4;
max-height: 3.6em;
line-height: 24px;
text-wrap: pretty;
word-wrap: normal;
text-align: left;
word-wrap: break-word;
overflow-wrap: break-word;
white-space: normal;
}
/* CAROUSEL V2*/
.slide-container {
border-radius: 30px;
position: relative;
width: 86%;
height: 470px;
padding-top: 10px;
}
h3.event-heading {
margin: 13px 0;
}
span.auditor-name {
margin-left: 15px;
}
.slide-container .slides {
width: 1190px;
height: calc(100% - 9px);
position: relative;
overflow: hidden;
border-radius: 8px;
}
.slide-container .slides img {
width: 100%;
height: 100%;
position: absolute;
object-fit: cover;
margin-left: 0px;
}
/* Approximate 90% Zoom */
@media screen and (min-width: 1450px) {
.slide-container .slides img {
width: 105%; /* Slightly increase width */
}
}
/* Approximate 80% Zoom */
@media screen and (min-width: 1600px) {
.slide-container .slides img {
width: 110%;
}
}
/* Approximate 70% Zoom */
@media screen and (min-width: 1800px) {
.slide-container .slides img {
width: 100%;
}
}
.slide-container .slides img:not(.active) {
top: 0;
left: -175%;
}
.sidebar.hide .secure-page-container .xrm-attribute-value .dashboard-page.content {
left: -175% !important;
}
span.next,
span.prev {
position: absolute;
top: 50%;
transform: translateY(-50%);
padding: 14px;
color: #ffffff;
font-size: 24px;
font-weight: bold;
transition: 0.5s;
border-radius: 3px;
user-select: none;
cursor: pointer;
z-index: 1;
}
.sidebar.hide .menu-footer .keyboard-double {
-webkit-transform: scaleX(-1);
transform: scaleX(-1);
}
@media screen and (min-device-width: 1200px) and (max-device-width: 1600px) and (-webkit-min-device-pixel-ratio: 1) {
.slide-container .slides {
width: 1200px
}
.dashboard-page.content .div {
gap: 14px
}
}
.buttons span.next,
span.prev {
background: #33333300;
height: 4rem;
width: 4rem;
border-radius: 50%;
padding: 14px 18px;
}
span.next {
right: -132px;
}
span.prev {
left: 14px;
}
span.next:hover,
span.prev:hover {
background-color: #000000;
opacity: 0.8;
color: #ffffff !important;
}
.dotsContainer {
display: none;
position: absolute;
bottom: -18px;
z-index: 3;
left: 50%;
transform: translateX(-50%);
}
.dotsContainer .dot {
width: 15px;
height: 15px;
margin: 0px 2px;
border: 3px solid #000000;
border-radius: 50%;
display: inline-block;
cursor: pointer;
transition: background-color 0.6s ease;
}
.dotsContainer .active {
background-color: #000000;
}
.carousel-caption:not(.active) {
/* background: #ffffff; */
position: absolute;
top: 60px;
padding: 19px 100px;
height: 200px;
}
.info-container:not(.active) {
background: #fff;
position: absolute;
right: -100%;
top: 12px;
color: #333;
}
.popular-item:not(.active) {
position: absolute;
right: -100%
}
@keyframes rnext1 {
from {
right: 0%
}
to {
right: -100%;
}
}
@keyframes rnext2 {
from {
right: 100%
}
to {
right: 0%;
}
}
@keyframes next1 {
from {
left: 0%
}
to {
left: -100%;
}
}
@keyframes next2 {
from {
left: 100%
}
to {
left: 0%;
}
}
@keyframes prev1 {
from {
left: 0%
}
to {
left: 100%;
}
}
@keyframes prev2 {
from {
left: -100%
}
to {
left: 0%;
}
}
body {
width: 100%;
margin: 0 auto;
padding: 0 1.25rem;
font-family: 'Lato', sans-serif;
}
* {
box-sizing: border-box;
scrollbar-color: transparent transparent;
/* thumb and track color */
scrollbar-width: 0px;
}
*::-webkit-scrollbar {
width: 0;
}
*::-webkit-scrollbar-track {
background: transparent;
}
*::-webkit-scrollbar-thumb {
background: transparent;
border: none;
}
* {
-ms-overflow-style: none;
}
/* SIDEBAR */
.standard-page.content {
display: flex;
flex-direction: column;
width: 1302px;
height: 1860px;
align-items: flex-start;
gap: 25px;
position: relative;
}
.dt-paging {
display: flex!important;
}
.menu-footer .icon {
position: absolute;
width: 24px;
height: 24px;
top: 0;
left: 0;
transform: rotate(-180deg);
}
/* MAIN */
.unsecure-page-container {
width: 100%;
padding: 31px 52px 20px 207px;
}
.secure-page-container {
width: 100%;
/* margin-left: 350px; */
display: flex;
justify-content: center;
margin-block: 100px;
}
main {
width: 100%;
}
main .title {
font-size: 28px;
font-weight: 600;
margin: 20px;
text-align: left !important;
}
main .breadcrumbs {
display: flex;
grid-gap: 6px;
}
main .breadcrumbs li,
main .breadcrumbs li a {
font-size: 14px;
}
main .breadcrumbs li a {
color: var(--blue);
}
main .breadcrumbs li a.active,
main .breadcrumbs li.divider {
color: var(--dark-grey);
pointer-events: none;
}
.sb-container {
display: flex;
justify-content: center;
width: 100%;
background: #fff;
padding: 27px;
flex-direction: column;
}
div#myTable_wrapper {
padding: 50px;
}
.sidebar {
position: fixed;
max-width: 254px;
width: 100%;
background: var(--light);
top: 63px;
left: 0;
height: 100%;
overflow-y: auto;
scrollbar-width: none;
z-index: 998;
border: 1px solid #cdcdcd;
box-shadow: 6px 1px 8px #cdcdcd38;
}
.sidebar::-webkit-scrollbar {
display: none;
}
.sidebar .brand {
display: flex;
justify-content: center;
align-items: center;
height: 40px;
width: 131px;
position: relative;
object-fit: cover;
margin: 10px 30px;
transition: all .3 ease;
position: sticky;
background: var(--light);
}
.sidebar .icon {
min-width: 32px;
display: flex;
justify-content: center;
align-items: center;
margin-right: 8px;
}
.sidebar .side-menu {
padding: 20px 8px;
transition: all 0.3s ease;
position: absolute;
z-index: 394;
height: 100%;
}
.sidebar.hide {
max-width: 60px !important
}
.sidebar.hide:hover {
max-width: 295px
}
.sidebar.hide .sidemenu {
padding: 0 8px;
}
.sidebar .side-menu a {
display: flex !important;
align-items: center;
font-size: 17px;
color: var(--dark-blue);
padding: 7px 16px 7px 14px;
transition: all 0.3s ease;
margin: 14px 0;
text-decoration: none;
display: block;
}
.sidebar .side-menu>li>a:hover {
background: var(--light-bule-2);
color: #0072c2;
border-radius: 0px 8px 8px 0px;
width: auto;
padding: 7px 16px 7px 14px;
border-left: 3px solid #0072c2;
}
.sidebar .side-menu>li>a.active .icon-right {
transform: rotateZ("90deg");
}
.sidebar .side-menu>li>a.active,
.sidebar .side-menu a.active:hover {
background: var(--blue);
color: var(--light);
}
.sidebar .divider {
margin-top: 24px;
font-size: 12px;
text-transform: uppercase;
font-weight: 700;
color: var(--dark-grey);
}
.sidebar .side-dropdown {
padding-left: 48px;
max-height: 0;
overflow-y: hidden;
transition: all 0.15 ease;
}
.sidebar .side-dropdown.show {
max-height: 1000px;
}
.sidebar .side-dropdown.hide {
max-width: 60px;
}
.sidebar.hide .menu-footer {
cursor: pointer;
padding: 32px 0;
background-color: transparent;
position: absolute;
bottom: 0;
left: -2%;
box-sizing: border-box;
width: 62px;
height: 64px;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
z-index: 999;
top: 50%;
margin-top: 32px;
}
.sidebar.hide .brand {
justify-content: flex-start;
}
.sidebar .side-dropdown a:hover {
color: var(--blue);
}
i {
font-size: 25px;
margin-right: 13px;
padding: 0 8px 0 10px;
}
ul.side-menu {
list-style-type: none;
padding: 0;
}
/* SIDEBAR */
/* -- SIDEBAR OLD */
.menu-footer .keyboard-double {
position: relative;
width: 24px;
height: 24px;
}
.toggle-sidebar {
font-size: 18px;
cursor: pointer;
}
/* -- SIDEBAR OLD */
/* NAVBAR */
nav .toggle-sidebar {
font-size: 18px;
cursor: pointer;
}
nav form {
max-width: 900px;
width: 100%;
margin-right: auto;
}
nav .form-group {
position: relative;
}
nav .form-group input {
width: 100%;
background: var(--grey);
border-radius: 5px;
border: none;
outline: none;
padding: 10px 36px 10px 16px;
transition: all 0.3s ease;
display: none;
}
nav .form-group input:focus {
box-shadow: 0 0 0 1px var(--blue), 0 0 0 4px var(--light-blue);
}
nav .form-group .icon {
position: absolute;
top: 50%;
transform: translateY(-50%);
right: 16px;
color: var(--dark-grey);
}
nav .nav-link {
position: absolute;
top: 21px;
right: 87px;
}
nav .nav-link .icon {
font-size: 18px;
color: var(--dark);
}
nav .nav-link .badge {
position: absolute;
top: -12px;
right: 0px;
width: 20px;
height: 20px;
border-radius: 50%;
border: 2px solid var(--light);
background: var(--red);
display: flex;
justify-content: center;
align-items: center;
color: var(--light);
font-size: 10px;
font-weight: 700;
}
nav .divider {
width: 1px;
background: var(--grey);
height: 12px;
display: block;
}
nav .profile {
position: relative;
}
nav .profile img {
width: 36px;
height: 36px;
border-radius: 50%;
object-fit: cover;
cursor: pointer;
}
nav .profile .profile-link {
position: absolute;
top: calc(100% + 10px);
right: 14px;
background: var(--light);
padding: 10px 0;
box-shadow: 4px 4px 16px rgba(0, 0, 0, 0.1);
width: 360px;
opacity: 0;
pointer-events: none;
transition: all 0.3s ease;
width: 289px;
background-color: #ffffff;
border-radius: 8px;
overflow: hidden;
border: 1px solid #cdcdcd;
}
nav .profile .profile-link.show {
opacity: 1;
pointer-events: visible;
top: 100%;
z-index: 1001
}
nav .profile .profile-link a {
padding: 5px 10px;
display: flex;
grid-gap: 10px;
font-size: 16px;
color: var(--dark);
align-items: center;
transition: all 0.3s ease;
}
nav .profile .profile-link a:hover {
background: var(--grey);
}
.name-photo {
display: flex;
align-items: center;
gap: 16px;
position: relative;
flex: 1;
flex-grow: 1;
}
.menu-dropdown {
display: flex;
align-items: center;
gap: 8px;
padding: 10px 15px;
position: relative;
align-self: stretch;
width: 100%;
border-top: 1px solid #ddd;
border-bottom: 1px solid #ddd;
flex: 0 0 auto;
}
.profile {
gap: 16px;
padding: 14px;
position: relative;
margin-top: -1px;
margin-left: -1px;
margin-right: -1px;
}
.notification {
gap: 16px;
padding: 14px;
position: relative;
margin-top: -1px;
margin-left: -1px;
margin-right: -1px;
}
.frame {
gap: 4px;
flex: 1;
flex-grow: 1;
display: flex;
flex-direction: column;
align-items: flex-start;
position: relative;
}
.menu-dropdown-2 {
display: flex;
align-items: center;
gap: 8px;
padding: 8px 24px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
.polygon {
position: absolute;
width: 29px;
height: 11px;
top: 0;
left: 290px;
display: none;
}
.ellipse {
position: relative;
width: 64px !important;
height: 64px !important;
object-fit: cover;
}
.rectangle {
position: relative;
align-self: stretch;
width: 100%;
height: 1px;
background-color: var(--syscolorbordersubdued);
}
.rectangle-2 {
position: relative;
align-self: stretch;
width: 100%;
height: 1px;
background-color: var(--syscolorborderhover);
}
.help-support-wrapper {
background-color: var(--texton-accent);
display: flex;
align-items: center;
gap: 8px;
padding: 7px 11px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
.div {
position: relative;
align-self: stretch;
font-family: var(--body-macos-description-font-family);
font-weight: var(--body-macos-description-font-weight);
color: var(--textsubdued);
font-size: var(--body-macos-description-font-size);
letter-spacing: var(--body-macos-description-letter-spacing);
line-height: var(--body-macos-description-line-height);
font-style: var(--body-macos-description-font-style);
}
.text-wrapper-2 {
position: relative;
width: fit-content;
margin-top: -1px;
font-family: var(--body-macos-paragraph-normal-font-family);
font-weight: var(--body-macos-paragraph-normal-font-weight);
color: var(--textdefault);
font-size: var(--body-macos-paragraph-normal-font-size);
letter-spacing: var(--body-macos-paragraph-normal-letter-spacing);
line-height: var(--body-macos-paragraph-normal-line-height);
white-space: nowrap;
font-style: var(--body-macos-paragraph-normal-font-style);
}
.page-container {
background: #fff;
padding: 35px;
}
/* Notifications */
.np {
padding: 10px;
}
.notifications-fly {
width: 296px;
height: 415px;
/* padding: 207px 0px; */
}
.notifications-fly .overlap-group {
position: relative;
height: 414px;
top: 229px;
}
.notifications-fly .notifications-list {
display: flex;
flex-direction: column;
width: 302px;
align-items: flex-start;
justify-content: flex-end;
position: absolute;
top: 10px;
left: 0;
background-color: var(--arcturus-styles-sys-color-surface-default);
border-radius: 8px;
overflow: hidden;
border: 1px solid;
border-color: rgb(226 226 226);
box-shadow: 0px 2px 8px #0000001f;
}
.notifications-fly .notification {
display: flex;
align-items: center;
gap: 0px;
padding: 6px 15px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
border-bottom-width: 1px;
border-bottom-style: solid;
border-color: rgb(238 238 238);
}
.notifications-fly .text-wrapper {
position: relative;
align-self: stretch;
width: 232px;
margin-top: -1px;
font-family: var(--comp-typography-body-macos-paragraph-small-font-family);
font-weight: var(--comp-typography-body-macos-paragraph-small-font-weight);
color: var(--arcturus-styles-sys-color-text-subdued);
font-size: var(--comp-typography-body-macos-paragraph-small-font-size);
letter-spacing: var(--comp-typography-body-macos-paragraph-small-letter-spacing);
line-height: var(--comp-typography-body-macos-paragraph-small-line-height);
white-space: nowrap;
font-style: var(--comp-typography-body-macos-paragraph-small-font-style);
padding: 10px;
}
.notifications-fly .detail {
display: flex;
width: 288px;
align-items: flex-start;
gap: 16px;
position: relative;
}
.notifications-fly .frame {
background-color: var(--arcturus-styles-sys-color-semantic-interactive);
display: inline-flex;
align-items: center;
gap: 10px;
padding: 8px;
position: relative;
flex: 0 0 auto;
border-radius: 50px;
}
.notifications-fly .today {
position: relative;
width: 24px;
height: 24px;
background-image: url(./img/image.svg);
background-size: 100% 100%;
}
.notifications-fly .div {
display: flex;
flex-direction: column;
align-items: flex-start;
justify-content: center;
position: relative;
flex: 1;
flex-grow: 1;
}
.notifications-fly .text-wrapper-2 {
position: relative;
align-self: stretch;
margin-top: -1px;
font-family: var(--headings-macos-medium-h6-font-family);
font-weight: var(--headings-macos-medium-h6-font-weight);
color: var(--arcturus-styles-sys-color-text-default);
font-size: var(--headings-macos-medium-h6-font-size);
letter-spacing: 0px;
line-height: 0px;
font-style: var(--headings-macos-medium-h6-font-style);
}
.notifications-fly .text-wrapper-3 {
position: relative;
align-self: stretch;
font-family: var(--comp-typography-body-macos-caption-font-family);
font-weight: var(--comp-typography-body-macos-caption-font-weight);
color: var(--arcturus-styles-sys-color-text-subdued);
font-size: var(--comp-typography-body-macos-caption-font-size);
letter-spacing: var(--comp-typography-body-macos-caption-letter-spacing);
line-height: var(--comp-typography-body-macos-caption-line-height);
font-style: var(--comp-typography-body-macos-caption-font-style);
}
.notifications-fly .gpp-good-wrapper {
background-color: #00804a;
display: inline-flex;
align-items: center;
gap: 10px;
padding: 8px;
position: relative;
flex: 0 0 auto;
border-radius: 50px;
}
.notifications-fly .gpp-good {
position: relative;
width: 24px;
height: 24px;
background-image: url(./img/icon.svg);
background-size: 100% 100%;
}
.notifications-fly .home-repair-service-wrapper {
display: inline-flex;
align-items: center;
gap: 10px;
padding: 8px;
position: relative;
flex: 0 0 auto;
background-color: #3c2869;
border-radius: 50px;
}
.notifications-fly .home-repair-service {
position: relative;
width: 24px;
height: 24px;
background-image: url(./img/icon-3.svg);
background-size: 100% 100%;
}
.notifications-fly .menu-dropdown {
display: flex;
align-items: center;
justify-content: flex-end;
gap: 8px;
padding: 7px 24px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
background-color: rgb(255 255 255);
}
.notifications-fly .singular-button {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
padding: 4px 16px;
position: relative;
flex: 0 0 auto;
background-color: #fff;
border-radius: 50px;
}
.notifications-fly .label {
position: relative;
width: fit-content;
font-family: "SF Pro Display-Semibold", Helvetica;
font-weight: 400;
color: var(--arcturus-styles-sys-color-text-default);
font-size: 16px;
text-align: center;
letter-spacing: 0.01px;
line-height: 24px;
white-space: nowrap;
}
.notifications-fly .suffix-icon {
position: relative;
width: var(--arcturus-styles-sys-sizing-icon-m);
height: var(--arcturus-styles-sys-sizing-icon-m);
background-image: url(./img/icon-2.svg);
background-size: 100% 100%;
}
.notifications-fly .polygon {
position: absolute;
width: 28px;
height: 11px;
top: 0;
left: 270px;
}
.notifications-fly .rectangle {
position: absolute;
width: 29px;
height: 3px;
top: 10px;
left: 270px;
display: none;
}
nav .notification {
position: relative;
}
nav .notification img {
width: 36px;
height: 36px;
border-radius: 50%;
object-fit: cover;
cursor: pointer;
}
nav .notification .notification-link {
position: absolute;
top: calc(100% + 10px);
right: 0;
background: var(--light);
padding: 10px 0;
box-shadow: 4px 4px 16px rgba(0, 0, 0, 0.1);
width: 360px;
opacity: 0;
pointer-events: none;
transition: all 0.3s ease;
width: 336px;
background-color: #ffffff;
border-radius: 8px;
overflow: hidden;
border: 1px solid #cdcdcd;
}
nav .notification .notification-link.show {
opacity: 1;
pointer-events: visible;
top: 100%;
}
nav .notification .notification-link a {
padding: 11px 10px;
display: flex;
grid-gap: 10px;
font-size: 16px;
color: var(--dark);
align-items: center;
transition: all 0.3s ease;
}
nav .notification .notification-link a:hover {
background: var(--grey);
}
/* Loading Spinner */
/* ----------------------------------------------------------------- */
/* Loading logo animation... */
/* -------------------------------------------------------------------------- */
.logo-flower {
position: absolute;
top: 50%;
left: 50%;
width: 120px;
height: 120px;
margin: -60px 0 0 -60px;
-webkit-animation: spin 4s linear infinite;
-moz-animation: spin 4s linear infinite;
animation: spin 4s linear infinite;
}
@-moz-keyframes spin {
100% {
-moz-transform: rotate(360deg);
}
}
@-webkit-keyframes spin {
100% {
-webkit-transform: rotate(360deg);
}
}
@keyframes spin {
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.br {
border-radius: 8px;
}
.w80 {
width: 80%;
}
.card-loading {
border: 2px solid #fff;
box-shadow: 0px 0px 10px 0 #a9a9a9;
padding: 30px 40px;
width: 80%;
margin: 50px auto;
}
.wrapper {
width: 0px;
animation: fullView 0.5s forwards cubic-bezier(0.250, 0.460, 0.450, 0.940);
}
/* .profilePic {
height: 65px;
width: 65px;
border-radius: 50%;
} */
.comment {
height: 10px;
background: #777;
margin-top: 20px;
}
@keyframes fullView {
100% {
width: 100%;
}
}
.animate {
animation: shimmer 2s infinite linear;
background: linear-gradient(to right, #eff1f3 4%, #e2e2e2 25%, #eff1f3 36%);
background-size: 1000px 100%;
}
@keyframes shimmer {
0% {
background-position: -1000px 0;
}
100% {
background-position: 1000px 0;
}
}
/* Banner */
/* ----------------------------------------------------------------- */
/* Banner */
/* -------------------------------------------------------------------------- */
.banner-description {
width: 500px;
color: #fff;
font-size: 28px;
overflow-wrap: break-word;
white-space: normal;
line-height: 49px;
}
/* Product Banner */
/* ----------------------------------------------------------------- */
/* Product Banner */
/* -------------------------------------------------------------------------- */
h4.product-subheading {
margin: 8px 0;
}
p.info-content {
font-size: 13px;
}
/* NAVBAR */
/* ----------------------------------------------------------------- */
/* Navigation */
/* -------------------------------------------------------------------------- */
.top-menu .ISOQAR-full-colour {
position: relative;
width: 131.75px;
height: 40px;
object-fit: cover;
}
.top-menu .logo {
position: relative;
flex: 1;
flex-grow: 1;
height: 36.52px;
}
.top-menu .group {
position: relative;
width: 374px;
height: 40px;
}
.top-menu .single-select {
display: flex;
flex-direction: column;
width: 259px;
align-items: flex-start;
gap: 4px;
position: absolute;
top: 0;
left: 113px;
}
.top-menu .field {
flex-direction: column;
align-items: flex-start;
gap: 4px;
flex: 0 0 auto;
display: flex;
position: relative;
align-self: stretch;
width: 100%;
border-radius: 8px;
}
.top-menu .div {
height: 40px;
align-items: center;
justify-content: flex-end;
gap: 8px;
padding: 0 12px;
background-color: #fff;
border: 1px solid;
border-color: #c5c5c5;
display: flex;
position: relative;
align-self: stretch;
width: 100%;
border-radius: 8px;
}
.top-menu .input-text {
position: relative;
flex: 1;
font-family: "SF Pro Text-Regular", Helvetica;
font-weight: 400;
color: #001c40;
font-size: 16px;
letter-spacing: 0.01px;
line-height: 24px;
}
.top-menu .suffix-icon {
position: relative;
width: var(--arcturus-styles-sys-sizing-icon-m);
height: var(--arcturus-styles-sys-sizing-icon-m);
background-image: url(./icon.svg);
background-size: 100% 100%;
}
.top-menu .text-wrapper {
position: absolute;
top: 8px;
left: 0;
font-family: var(--body-macos-paragraph-normal-font-family);
font-weight: var(--body-macos-paragraph-normal-font-weight);
color: #001c40;
font-size: var(--body-macos-paragraph-normal-font-size);
letter-spacing: var(--body-macos-paragraph-normal-letter-spacing);
line-height: var(--body-macos-paragraph-normal-line-height);
white-space: nowrap;
font-style: var(--body-macos-paragraph-normal-font-style);
}
.top-menu .icons {
display: inline-flex;
align-items: center;
gap: 16px;
position: relative;
flex: 0 0 auto;
}
.top-menu .notifications {
position: relative;
width: 24px;
height: 24px;
}
.top-menu .avatar {
position: relative;
width: 32px;
height: 32px;
object-fit: cover;
}
.top-menu .ellipse {
position: absolute;
width: 8px;
height: 8px;
top: 5px;
left: 15px;
background-color: var(--arcturus-styles-sys-color-semantic-critical);
border-radius: 4px;
}
/* i {
font-size: 20px;
padding: 5px 10px;
} */
i:hover {
color: #0072c2;
}
/* ----------------------------------------------------------------- */
/* Booking Cards */
/* -------------------------------------------------------------------------- */
.card-content-booking .text-wrapper-5 {
color: #fff !important;
}
.card-content-booking h4 {
color: #fff !important;
}
.card-container-booking {
display: flex;
justify-content: center;
align-items: center;
}
.card-booking {
display: flex;
flex-direction: row;
background: #011C41;
border: 1px solid #ddd;
border-radius: 8px;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
min-width: 465px;
min-height: 238px;
width: 100%;
overflow: hidden;
}
.card-image {
flex: 1;
display: flex;
max-width: 135px;
}
.card-image img {
width: 100%;
/* Adjust to container */
height: auto;
/* Maintain aspect ratio */
object-fit: cover;
/* Ensures proper fit for varying image sizes */
border-radius: 8px 0 0 8px;
/* Rounded corners for the left side */
}
.card-content-booking {
flex: 1;
display: flex;
flex-direction: column;
padding: 35px 0px 10px 20px;
min-height: 127px;
max-width: 320px;
word-wrap: break-word;
overflow-wrap: break-word;
white-space: normal;
}
.card-content-booking h2 {
margin: 0 0 10px 0;
font-size: 1.5rem;
color: #ffffff;
}
.card-content-booking p {
margin: 0;
line-height: 1.6;
color: #ffffff;
word-wrap: break-word;
overflow-wrap: break-word;
white-space: normal;
font-size: 1em;
}
p.event-title {
margin-bottom: 10px;
}
/* Responsive Design */
@media (max-width: 600px) {
.card-booking {
flex-direction: column;
}
.card-image,
.card-content-booking {
flex: none;
width: 100%;
}
.card-image img {
border-radius: 8px 8px 0 0;
}
}
/* ----------------------------------------------------------------- */
/* Dashboard Cards */
/* -------------------------------------------------------------------------- */
.popup-content {
position: absolute;
top: 18%;
padding: 30px;
}
.card-container-x {
display: flex;
justify-content: center;
align-items: center;
}
.card-tile {
display: flex;
flex-direction: row;
background-color: #fff;
border-radius: 8px;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
min-width: 465px;
min-height: 238px;
width: 100%;
overflow: hidden;
}
.card-image {
flex: 1;
display: flex;
max-width: 135px;
}
.card-image img {
width: 100%;
/* Adjust to container */
height: auto;
/* Maintain aspect ratio */
object-fit: cover;
/* Ensures proper fit for varying image sizes */
border-radius: 8px 0 0 8px;
/* Rounded corners for the left side */
}
.card-content-x {
flex: 1;
display: flex;
flex-direction: column;
padding: 35px 0px 10px 20px;
min-height: 127px;
max-width: 320px;
word-wrap: break-word;
overflow-wrap: break-word;
white-space: normal;
}
.card-content-x h2 {
margin: 0 0 10px 0;
font-size: 1.5rem;
color: #333;
}
.card-content-x p {
margin: 0;
line-height: 1.6;
color: #333;
word-wrap: break-word;
overflow-wrap: break-word;
white-space: normal;
font-size: 1em;
}
p.event-title {
margin-bottom: 10px;
}
/* Responsive Design */
@media (max-width: 600px) {
.card-title {
flex-direction: column;
}
.card-image,
.card-content-x {
flex: none;
width: 100%;
}
.card-image img {
border-radius: 8px 8px 0 0;
}
}
/* dasboard */
.dashboard.frame {
display: flex;
align-items: flex-start;
position: relative;
}
.dashboard.frame .card {
position: relative;
align-self: stretch;
width: 133px;
border-radius: 8px 0px 0px 8px;
background-image: url(./img/card.png);
background-size: cover;
background-position: 50% 50%;
}
.dashboard.frame .div {
flex-direction: column;
align-items: flex-start;
gap: 16px;
padding: 24px;
flex: 1;
flex-grow: 1;
background-color: var(--surfacedefault);
border-radius: 0px 8px 8px 0px;
display: flex;
position: relative;
}
.dashboard.frame .card-heading {
align-items: center;
gap: 16px;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
display: flex;
position: relative;
}
.dashboard.frame .text-wrapper {
position: relative;
width: fit-content;
margin-top: -1px;
font-family: var(--headings-macos-medium-h5-font-family);
font-weight: var(--headings-macos-medium-h5-font-weight);
color: var(--arcturus-styles-sys-color-text-default);
font-size: var(--headings-macos-medium-h5-font-size);
letter-spacing: var(--headings-macos-medium-h5-letter-spacing);
line-height: var(--headings-macos-medium-h5-line-height);
white-space: nowrap;
font-style: var(--headings-macos-medium-h5-font-style);
}
.dashboard.frame .card-content {
flex-direction: column;
align-items: flex-start;
justify-content: center;
gap: 32px;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
display: flex;
position: relative;
}
.dashboard.frame .div-2 {
display: flex;
flex-direction: column;
align-items: flex-start;
justify-content: center;
gap: 8px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
.dashboard.frame .text-wrapper-2 {
position: relative;
width: fit-content;
margin-top: -1px;
font-family: var(--comp-typography-headings-macos-medium-h2-font-family);
font-weight: var(--comp-typography-headings-macos-medium-h2-font-weight);
color: var(--arcturus-styles-sys-color-text-default);
font-size: var(--comp-typography-headings-macos-medium-h2-font-size);
letter-spacing: var(--comp-typography-headings-macos-medium-h2-letter-spacing);
line-height: var(--comp-typography-headings-macos-medium-h2-line-height);
white-space: nowrap;
font-style: var(--comp-typography-headings-macos-medium-h2-font-style);
}
.dashboard.frame .div-3 {
display: flex;
align-items: flex-start;
gap: 8px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
.dashboard.frame .text-wrapper-3 {
position: relative;
width: fit-content;
margin-top: -1px;
font-family: var(--comp-typography-body-macos-description-font-family);
font-weight: var(--comp-typography-body-macos-description-font-weight);
color: var(--arcturus-styles-sys-color-text-default);
font-size: var(--comp-typography-body-macos-description-font-size);
letter-spacing: var(--comp-typography-body-macos-description-letter-spacing);
line-height: var(--comp-typography-body-macos-description-line-height);
white-space: nowrap;
font-style: var(--comp-typography-body-macos-description-font-style);
}
.dashboard.frame .rectangle {
position: relative;
align-self: stretch;
width: 1px;
background-color: var(--arcturus-styles-sys-color-surface-hover);
}
.dashboard.frame .singular-button {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
padding: 4px 16px;
position: relative;
flex: 0 0 auto;
background-color: var(--arcturus-styles-sys-color-action-primary-default);
border-radius: 50px;
}
.dashboard.frame .label {
position: relative;
width: fit-content;
font-family: "SF Pro Display-Semibold", Helvetica;
font-weight: 400;
color: var(--arcturus-styles-sys-color-text-inverse);
font-size: 16px;
text-align: center;
letter-spacing: 0.01px;
line-height: 24px;
white-space: nowrap;
}
.dashboard-page.content {
display: flex;
flex-direction: column;
width: 100%;
height: 1860px;
align-items: flex-start;
gap: 32px;
padding: 9px 0px;
position: relative;
/* margin: 56px 0 0 200px; */
padding: 16px;
height: auto;
/* background-color: #f7f7f7; */
}
.dashboard-page.content .frame {
align-items: flex-end;
justify-content: flex-end;
gap: 24px;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
display: flex;
position: relative;
}
.dashboard-page.content .page-title {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 16px 16px;
position: relative;
flex: 1;
flex-grow: 1;
}
.dashboard-page.content .site-bookings {
font-family: var(--headings-macos-medium-h2-font-family);
font-weight: var(--headings-macos-medium-h2-font-weight);
color: #000000;
font-size: var(--headings-macos-medium-h2-font-size);
letter-spacing: var(--headings-macos-medium-h2-letter-spacing);
line-height: var(--headings-macos-medium-h2-line-height);
position: relative;
width: fit-content;
margin-top: -1px;
white-space: nowrap;
font-style: var(--headings-macos-medium-h2-font-style);
}
#organisation-selector-holder{
display:none;
align-items: center;
float:right;
}
#nav-action-holder{
margin-right: 2em!important;
max-width: 100%!important;
max-width: 900px;
width: 100%;
margin-right: auto;
}
.organisation-selector{
width: 20em !important;
}
.organisation-text{
color:#011C41;
margin-right: 0.5em;
}
.select2-container--default .select2-selection--single {
border-radius: 8px!important;
height: 2.5em!important;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
line-height: 35px!important;
color: #011C41!important;
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
height: 2.5em!important;
top: 0!important;
}
/* .dashboard-page.content {
position: relative;
width: calc(100% - 111px);
left: 111px;
transition: all 0.3s ease;
}
*/
/* .sidebar.hide + mainn {
width: calc(100% - -60px);
left: -60px;
} */
.sidebar.hide+.dashboard-page.content {
margin-right: -75px;
}
.sidebar.hide+main {
padding-right: 90px;
}
.dashboard-page.content .div {
display: flex;
align-items: flex-start;
gap: 40px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
.dashboard-page.content .left-column {
display: flex;
flex-direction: column;
width: 294px;
align-items: flex-start;
gap: 24px;
position: relative;
}
.dashboard-page.content .card-profile {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 16px;
padding: 24px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
background-color: #011c41;
border-radius: 8px;
box-shadow: 0px 2px 4px -2px #1018280f, 0px 4px 8px -2px #1018281a;
}
.dashboard-page.content .div-2 {
display: flex;
align-items: center;
gap: 16px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
flex-wrap: wrap;
}
.dashboard-page.content .text-wrapper {
position: relative;
width: fit-content;
margin-top: -1px;
font-family: var(--headings-macos-medium-h4-font-family);
font-weight: var(--headings-macos-medium-h4-font-weight);
color: var(--arcturus-styles-sys-color-text-inverse);
font-size: var(--headings-macos-medium-h4-font-size);
letter-spacing: var(--headings-macos-medium-h4-letter-spacing);
line-height: var(--headings-macos-medium-h4-line-height);
white-space: nowrap;
font-style: var(--headings-macos-medium-h4-font-style);
}
.dashboard-page.content .card-content {
align-items: flex-start;
justify-content: center;
gap: 24px;
flex: 0 0 auto;
display: flex;
flex-direction: column;
position: relative;
align-self: stretch;
width: 100%;
}
.dashboard-page.content .ellipse {
position: relative;
width: 64px;
height: 64px;
object-fit: cover;
}
.dashboard-page.content .frame-2 {
flex-direction: column;
align-items: flex-start;
flex: 1;
flex-grow: 1;
display: flex;
position: relative;
}
.dashboard-page.content .text-wrapper-2 {
position: relative;
align-self: stretch;
margin-top: -1px;
font-family: var(--comp-typography-headings-macos-semibold-h6-font-family);
font-weight: var(--comp-typography-headings-macos-semibold-h6-font-weight);
color: var(--arcturus-styles-sys-color-text-inverse);
font-size: var(--comp-typography-headings-macos-semibold-h6-font-size);
letter-spacing: var(--comp-typography-headings-macos-semibold-h6-letter-spacing);
line-height: var(--comp-typography-headings-macos-semibold-h6-line-height);
font-style: var(--comp-typography-headings-macos-semibold-h6-font-style);
}
.dashboard-page.content .text-wrapper-3 {
position: relative;
align-self: stretch;
font-family: var(--comp-typography-body-macos-description-font-family);
font-weight: var(--comp-typography-body-macos-description-font-weight);
color: var(--arcturus-styles-sys-color-text-inverse);
font-size: var(--comp-typography-body-macos-description-font-size);
letter-spacing: var(--comp-typography-body-macos-description-letter-spacing);
line-height: var(--comp-typography-body-macos-description-line-height);
font-style: var(--comp-typography-body-macos-description-font-style);
word-wrap: break-word;
overflow-wrap: break-word;
white-space: normal;
}
.dashboard-page.content .singular-button {
display: flex;
align-items: center;
justify-content: center;
gap: 8px;
padding: 4px 16px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
margin-bottom: -1px;
margin-left: -1px;
margin-right: -1px;
background-color: var(--arcturus-styles-sys-color-action-secondary-default);
border-radius: 50px;
border: 1px solid;
border-color: var(--arcturus-styles-sys-color-border-default);
}
.dashboard-page.content .label {
margin-top: -0.5px;
color: var(--arcturus-styles-sys-color-text-default);
position: relative;
width: fit-content;
font-family: "SF Pro Display-Semibold", Helvetica;
font-weight: 400;
font-size: 16px;
text-align: center;
letter-spacing: 0.01px;
line-height: 24px;
white-space: nowrap;
}
.dashboard-page.content .card-company {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 16px;
padding: 24px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
background-color: #0172c5;
border-radius: 8px;
box-shadow: 0px 2px 4px -2px #1018280f, 0px 4px 8px -2px #1018281a;
}
.dashboard-page.content .div-3 {
align-items: flex-start;
justify-content: center;
gap: 16px;
flex: 0 0 auto;
display: flex;
flex-direction: column;
position: relative;
align-self: stretch;
width: 100%;
}
.dashboard-page.content .frame-3 {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 4px;
position: relative;
flex: 1;
flex-grow: 1;
flex-wrap: wrap;
}
.dashboard-page.content .text-wrapper-4 {
position: relative;
align-self: stretch;
margin-top: -1px;
font-family: var(--comp-typography-headings-macos-bold-h6-font-family);
font-weight: var(--comp-typography-headings-macos-bold-h6-font-weight);
color: var(--arcturus-styles-sys-color-text-inverse);
font-size: var(--comp-typography-headings-macos-bold-h6-font-size);
letter-spacing: var(--comp-typography-headings-macos-bold-h6-letter-spacing);
line-height: var(--comp-typography-headings-macos-bold-h6-line-height);
font-style: var(--comp-typography-headings-macos-bold-h6-font-style);
}
.dashboard-page.content .div-4 {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 41px;
padding: 24px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
background-color: var(--surfacedefault);
border-radius: 8px;
box-shadow: 0px 2px 4px -2px #1018280f, 0px 4px 8px -2px #1018281a;
max-width: 863px;
}
.dashboard-page.content .text-wrapper-5 {
position: relative;
width: fit-content;
margin-top: -12px;
font-family: var(--headings-macos-medium-h5-font-family);
font-weight: var(--headings-macos-medium-h5-font-weight);
color: var(--arcturus-styles-sys-color-text-default);
font-size: var(--headings-macos-medium-h5-font-size);
letter-spacing: var(--headings-macos-medium-h5-letter-spacing);
line-height: var(--headings-macos-medium-h5-line-height);
white-space: nowrap;
font-style: var(--headings-macos-medium-h5-font-style);
}
.dashboard-page.content .card-content-2 {
display: flex;
flex-direction: column;
align-items: flex-start;
justify-content: center;
gap: 32px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
.dashboard-page.content .header {
display: inline-flex;
align-items: center;
gap: 54px;
position: relative;
flex: 0 0 auto;
margin-right: -6px;
background-color: transparent;
}
.dashboard-page.content .text-wrapper-6 {
position: relative;
width: 162px;
margin-top: -1px;
font-family: var(--headings-macos-semibold-h6-font-family);
font-weight: var(--headings-macos-semibold-h6-font-weight);
color: var(--textsubdued);
font-size: var(--headings-macos-semibold-h6-font-size);
letter-spacing: var(--headings-macos-semibold-h6-letter-spacing);
line-height: var(--headings-macos-semibold-h6-line-height);
font-style: var(--headings-macos-semibold-h6-font-style);
}
.dashboard-page.content .group {
position: relative;
width: 36px;
height: 16px;
}
.dashboard-page.content .calendar {
flex-direction: column;
height: 238px;
align-items: flex-start;
justify-content: center;
display: flex;
position: relative;
align-self: stretch;
width: 100%;
margin-bottom: 14px;
}
.dashboard-page.content .row {
align-items: center;
flex: 1;
flex-grow: 1;
display: flex;
position: relative;
align-self: stretch;
width: 100%;
}
.dashboard-page.content .date-default {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 4px;
flex: 1;
align-self: stretch;
flex-grow: 1;
margin-bottom: -1px;
margin-left: -1px;
border: 1px solid;
border-color: var(--arcturus-styles-sys-color-border-subdued);
position: relative;
margin-top: -1px;
}
.dashboard-page.content .text-wrapper-7 {
position: relative;
width: 20px;
height: 20px;
font-family: var(--body-macos-subtitle-font-family);
font-weight: var(--body-macos-subtitle-font-weight);
color: var(--arcturus-styles-sys-color-text-default);
font-size: var(--body-macos-subtitle-font-size);
text-align: center;
letter-spacing: var(--body-macos-subtitle-letter-spacing);
line-height: var(--body-macos-subtitle-line-height);
white-space: nowrap;
font-style: var(--body-macos-subtitle-font-style);
}
.dashboard-page.content .div-wrapper {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 4px;
position: relative;
flex: 1;
align-self: stretch;
flex-grow: 1;
margin-top: -1px;
margin-bottom: -1px;
border: 1px solid;
border-color: var(--arcturus-styles-sys-color-border-subdued);
}
.dashboard-page.content .date-default-2 {
margin-right: -1px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 4px;
position: relative;
flex: 1;
align-self: stretch;
flex-grow: 1;
margin-top: -1px;
margin-bottom: -1px;
border: 1px solid;
border-color: var(--arcturus-styles-sys-color-border-subdued);
}
.dashboard-page.content .text-wrapper-8 {
color: var(--arcturus-styles-sys-color-text-disabled);
position: relative;
width: 20px;
height: 20px;
font-family: var(--body-macos-caption-font-family);
font-weight: var(--body-macos-caption-font-weight);
font-size: var(--body-macos-caption-font-size);
text-align: center;
letter-spacing: var(--body-macos-caption-letter-spacing);
line-height: var(--body-macos-caption-line-height);
white-space: nowrap;
font-style: var(--body-macos-caption-font-style);
}
.dashboard-page.content .text-wrapper-9 {
color: var(--arcturus-styles-sys-color-text-default);
position: relative;
width: 20px;
height: 20px;
font-family: var(--body-macos-caption-font-family);
font-weight: var(--body-macos-caption-font-weight);
font-size: var(--body-macos-caption-font-size);
text-align: center;
letter-spacing: var(--body-macos-caption-letter-spacing);
line-height: var(--body-macos-caption-line-height);
white-space: nowrap;
font-style: var(--body-macos-caption-font-style);
}
.dashboard-page.content .date-default-3 {
background-color: var(--arcturus-styles-sys-color-semantic-interactive);
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 4px;
position: relative;
flex: 1;
align-self: stretch;
flex-grow: 1;
margin-top: -1px;
margin-bottom: -1px;
border: 1px solid;
border-color: var(--arcturus-styles-sys-color-border-subdued);
}
.dashboard-page.content .text-wrapper-10 {
color: var(--arcturus-styles-sys-color-text-inverse);
position: relative;
width: 20px;
height: 20px;
font-family: var(--body-macos-caption-font-family);
font-weight: var(--body-macos-caption-font-weight);
font-size: var(--body-macos-caption-font-size);
text-align: center;
letter-spacing: var(--body-macos-caption-letter-spacing);
line-height: var(--body-macos-caption-line-height);
white-space: nowrap;
font-style: var(--body-macos-caption-font-style);
}
.dashboard-page.content .date-default-4 {
background-color: var(--arcturus-styles-sys-color-surface-highlight);
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 4px;
position: relative;
flex: 1;
align-self: stretch;
flex-grow: 1;
margin-top: -1px;
margin-bottom: -1px;
border: 1px solid;
border-color: var(--arcturus-styles-sys-color-border-subdued);
}
.dashboard-page.content .suffix-icon {
position: relative;
width: var(--arcturus-styles-sys-sizing-icon-m);
height: var(--arcturus-styles-sys-sizing-icon-m);
background-image: url('data:image/svg+xml,');
background-size: 100% 100%;
}
.dashboard-page.content .main-column {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 24px;
position: relative;
flex: 1;
flex-grow: 1;
}
.dashboard-page.content .div-5 {
display: flex;
align-items: flex-start;
gap: 24px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
.dashboard-page.content .frame-4 {
align-items: flex-start;
flex: 1;
flex-grow: 1;
box-shadow: var(--shadow-md);
display: flex;
position: relative;
}
.dashboard-page.content .card {
position: relative;
align-self: stretch;
/* width: 133px; */
border-radius: 8px 0px 0px 8px;
background-image: url(./inspector.png);
background-size: cover;
background-position: 50% 50%;
}
.dashboard-page.content .card-2 {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 16px;
padding: 24px;
position: relative;
flex: 1;
flex-grow: 1;
background-color: var(--surfacedefault);
border-radius: 0px 8px 8px 0px;
}
.dashboard-page.content .div-6 {
flex-direction: column;
align-items: flex-start;
justify-content: center;
gap: 8px;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
display: flex;
position: relative;
}
.dashboard-page.content .text-wrapper-11 {
width: fit-content;
margin-top: -1px;
font-family: var(--comp-typography-headings-macos-medium-h2-font-family);
font-size: 28px;
letter-spacing: var(--comp-typography-headings-macos-medium-h2-letter-spacing);
line-height: var(--comp-typography-headings-macos-medium-h2-line-height);
white-space: nowrap;
position: relative;
font-weight: var(--comp-typography-headings-macos-medium-h2-font-weight);
color: var(--arcturus-styles-sys-color-text-default);
font-style: var(--comp-typography-headings-macos-medium-h2-font-style);
}
.dashboard-page.content .frame-5 {
display: flex;
align-items: flex-start;
gap: 8px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
a svg {
margin-right: 18px;
}
.dashboard-page.content .text-wrapper-12 {
position: relative;
width: fit-content;
margin-top: -1px;
font-family: var(--comp-typography-body-macos-description-font-family);
font-weight: var(--comp-typography-body-macos-description-font-weight);
color: var(--arcturus-styles-sys-color-text-default);
font-size: var(--comp-typography-body-macos-description-font-size);
letter-spacing: var(--comp-typography-body-macos-description-letter-spacing);
line-height: var(--comp-typography-body-macos-description-line-height);
white-space: nowrap;
font-style: var(--comp-typography-body-macos-description-font-style);
}
.dashboard-page.content .rectangle {
position: relative;
align-self: stretch;
width: 1px;
background-color: var(--arcturus-styles-sys-color-surface-hover);
}
.dashboard-page.content .label-wrapper {
background-color: var(--arcturus-styles-sys-color-action-primary-default);
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
padding: 4px 16px;
position: relative;
flex: 0 0 auto;
border-radius: 50px;
margin: 30px 0px 20px 0px;
width: 120px;
}
.dashboard-page.content .label-2 {
color: var(--arcturus-styles-sys-color-text-inverse);
position: relative;
width: fit-content;
font-family: "SF Pro Display-Semibold", Helvetica;
font-weight: 400;
font-size: 16px;
text-align: center;
letter-spacing: 0.01px;
line-height: 24px;
white-space: nowrap;
}
.dashboard-page.content .frame-6 {
align-items: flex-start;
flex: 1;
align-self: stretch;
flex-grow: 1;
/* box-shadow: var(--shadow-md); */
display: flex;
position: relative;
max-width: 371px;
}
.dashboard-page.content .card-3 {
position: relative;
align-self: stretch;
width: 133px;
border-radius: 8px 0px 0px 8px;
background-image: url(./people.png);
background-size: cover;
background-position: 50% 50%;
}
.dashboard-page.content .card-4 {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 16px;
padding: 24px;
position: relative;
flex: 1;
align-self: stretch;
flex-grow: 1;
background-color: var(--arcturus-styles-sys-color-surface-default);
border-radius: 0px 8px 8px 0px;
}
.dashboard-page.content .text-wrapper-13 {
position: relative;
flex: 1;
margin-top: -1px;
font-family: var(--headings-macos-medium-h5-font-family);
font-weight: 600;
color: var(--arcturus-styles-sys-color-text-default);
font-size: 15px;
letter-spacing: var(--headings-macos-medium-h5-letter-spacing);
line-height: var(--headings-macos-medium-h5-line-height);
font-style: var(--headings-macos-medium-h5-font-style);
}
.dashboard-page.content .card-content-3 {
align-items: flex-start;
gap: 32px;
flex: 1;
flex-grow: 1;
display: flex;
flex-direction: column;
position: relative;
align-self: stretch;
width: 100%;
}
.dashboard-page.content .frame-7 {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 8px;
position: relative;
flex: 1;
align-self: stretch;
width: 100%;
flex-grow: 1;
}
.dashboard-page.content .p {
position: relative;
align-self: stretch;
margin-top: -1px;
font-family: var(--comp-typography-body-macos-description-font-family);
font-weight: var(--comp-typography-body-macos-description-font-weight);
color: var(--arcturus-styles-sys-color-text-default);
font-size: var(--comp-typography-body-macos-description-font-size);
letter-spacing: var(--comp-typography-body-macos-description-letter-spacing);
line-height: var(--comp-typography-body-macos-description-line-height);
font-style: var(--comp-typography-body-macos-description-font-style);
}
.dashboard-page.content .button {
all: unset;
box-sizing: border-box;
background-color: var(--arcturus-styles-sys-color-action-primary-default);
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
padding: 4px 16px;
position: relative;
flex: 0 0 auto;
border-radius: 50px;
}
.dashboard-page.content .img {
position: relative;
width: 24px;
height: 24px;
}
.dashboard-page.content .card-5 {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 24px;
padding: 24px;
position: relative;
flex: 1;
align-self: stretch;
flex-grow: 1;
background-color: var(--surfacedefault);
border-radius: 8px;
box-shadow: 0px 2px 4px -2px #1018280f, 0px 4px 8px -2px #1018281a;
max-width: 863px
}
.dashboard-page.content .card-content-4 {
align-items: flex-end;
gap: 16px;
flex: 0 0 auto;
display: flex;
flex-direction: column;
position: relative;
align-self: stretch;
width: 100%;
}
.dashboard-page.content .frame-8 {
align-items: center;
gap: 24px;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
display: flex;
position: relative;
}
.dashboard-page.content .thumbnail {
gap: 10px;
background-color: #0f9996;
display: inline-flex;
align-items: flex-start;
padding: 16px 48px;
position: relative;
flex: 0 0 auto;
border-radius: 8px;
overflow: hidden;
}
.dashboard-page.content .gpp-good {
background-image: url('data:image/svg+xml,');
width: 48px;
height: 48px;
background-size: 100% 100%;
}
.dashboard-page.content .detail {
display: flex;
align-items: center;
gap: 32px;
position: relative;
flex: 1;
flex-grow: 1;
background-color: #ffffff;
}
.dashboard-page.content .name {
display: flex;
flex-direction: column;
align-items: flex-start;
justify-content: center;
gap: 8px;
position: relative;
flex: 1;
flex-grow: 1;
}
.dashboard-page.content .text-wrapper-14 {
position: relative;
width: fit-content;
margin-top: -1px;
font-family: var(--body-macos-caption-font-family);
font-weight: var(--body-macos-caption-font-weight);
color: var(--arcturus-styles-sys-color-text-subdued);
font-size: var(--body-macos-caption-font-size);
letter-spacing: var(--body-macos-caption-letter-spacing);
line-height: var(--body-macos-caption-line-height);
white-space: nowrap;
font-style: var(--body-macos-caption-font-style);
}
.dashboard-page.content .text-wrapper-15 {
align-self: stretch;
font-family: var(--body-macos-link-default-font-family);
font-size: var(--body-macos-link-default-font-size);
letter-spacing: var(--body-macos-link-default-letter-spacing);
line-height: var(--body-macos-link-default-line-height);
text-decoration: underline;
position: relative;
font-weight: var(--body-macos-link-default-font-weight);
color: var(--arcturus-styles-sys-color-text-default);
font-style: var(--body-macos-link-default-font-style);
}
.dashboard-page.content .text-wrapper-16 {
position: relative;
width: fit-content;
font-family: var(--body-macos-paragraph-small-font-family);
font-weight: var(--body-macos-paragraph-small-font-weight);
color: var(--arcturus-styles-sys-color-text-subdued);
font-size: var(--body-macos-paragraph-small-font-size);
letter-spacing: var(--body-macos-paragraph-small-letter-spacing);
line-height: var(--body-macos-paragraph-small-line-height);
white-space: nowrap;
font-style: var(--body-macos-paragraph-small-font-style);
}
.dashboard-page.content .icons {
gap: 8px;
display: inline-flex;
align-items: center;
justify-content: flex-end;
position: relative;
flex: 0 0 auto;
}
.dashboard-page.content .update {
height: 88px;
display: flex;
flex-direction: column;
align-items: flex-start;
justify-content: center;
position: relative;
align-self: stretch;
width: 100%;
}
.dashboard-page.content .inventory-wrapper {
background-color: #00804a;
display: inline-flex;
align-items: flex-start;
padding: 16px 48px;
position: relative;
flex: 0 0 auto;
border-radius: 8px;
overflow: hidden;
}
.dashboard-page.content .img-2 {
position: relative;
width: 48px;
height: 48px;
}
.dashboard-page.content .detail-2 {
align-self: stretch;
display: flex;
align-items: center;
gap: 32px;
position: relative;
flex: 1;
flex-grow: 1;
background-color: #ffffff;
}
.dashboard-page.content .bookmark-border {
background-image: url('data:image/svg+xml,');
position: relative;
width: var(--arcturus-styles-sys-sizing-icon-m);
height: var(--arcturus-styles-sys-sizing-icon-m);
background-size: 100% 100%;
}
.dashboard-page.content .img-wrapper {
gap: 10px;
background-color: #00804a;
display: inline-flex;
align-items: flex-start;
padding: 16px 48px;
position: relative;
flex: 0 0 auto;
border-radius: 8px;
overflow: hidden;
}
.dashboard-page.content .today-wrapper {
gap: 10px;
background-color: #3c2869;
display: inline-flex;
align-items: flex-start;
padding: 16px 48px;
position: relative;
flex: 0 0 auto;
border-radius: 8px;
overflow: hidden;
}
.dashboard-page.content .article-wrapper {
gap: 10px;
background-color: #fbcb21;
display: inline-flex;
align-items: flex-start;
padding: 16px 48px;
position: relative;
flex: 0 0 auto;
border-radius: 8px;
overflow: hidden;
}
.dashboard-page.content .text-wrapper-17 {
align-self: stretch;
font-family: var(--comp-typography-body-macos-link-default-font-family);
font-size: var(--comp-typography-body-macos-link-default-font-size);
letter-spacing: var(--comp-typography-body-macos-link-default-letter-spacing);
line-height: var(--comp-typography-body-macos-link-default-line-height);
text-decoration: underline;
position: relative;
font-weight: var(--comp-typography-body-macos-link-default-font-weight);
color: var(--arcturus-styles-sys-color-text-default);
font-style: var(--comp-typography-body-macos-link-default-font-style);
}
.dashboard-page.content .card-content-5 {
align-items: flex-end;
justify-content: flex-end;
gap: 32px;
flex: 0 0 auto;
display: flex;
flex-direction: column;
position: relative;
align-self: stretch;
width: 100%;
}
.dashboard-page.content .div-7 {
display: flex;
flex-direction: column;
align-items: flex-start;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
.dashboard-page.content .invoice-row {
display: flex;
align-items: center;
gap: 32px;
padding: 24px 0px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
background-color: var(--arcturus-styles-sys-color-surface-default);
border-top-width: 1px;
border-top-style: solid;
border-bottom-width: 1px;
border-bottom-style: solid;
border-color: var(--arcturus-styles-sys-color-border-default);
}
.dashboard-page.content .name-check-box {
display: flex;
align-items: center;
gap: 8px;
position: relative;
flex: 1;
flex-grow: 1;
}
.dashboard-page.content .text-wrapper-18 {
position: relative;
flex: 1;
margin-top: -1px;
font-family: var(--body-macos-link-default-font-family);
font-weight: var(--body-macos-link-default-font-weight);
color: var(--arcturus-styles-sys-color-text-default);
font-size: 13px;
letter-spacing: var(--body-macos-link-default-letter-spacing);
line-height: var(--body-macos-link-default-line-height);
text-decoration: underline;
overflow-wrap: break-word;
white-space: normal;
}
.dashboard-page.content .text-wrapper-19 {
position: relative;
width: fit-content;
margin-top: -1px;
font-family: "SF Pro Text-Regular", Helvetica;
font-weight: 400;
color: var(--textdefault);
font-size: 13px;
letter-spacing: 0.01px;
line-height: 24px;
white-space: nowrap;
}
.dashboard-page.content .text-wrapper-20 {
width: fit-content;
font-family: "SF Pro Text-Regular", Helvetica;
font-weight: 400;
color: var(--arcturus-styles-sys-color-text-default);
font-size: 13px;
letter-spacing: 0.01px;
line-height: 24px;
white-space: nowrap;
position: relative;
margin-top: -1px;
}
.dashboard-page.content .icons-2 {
gap: 16px;
display: inline-flex;
align-items: center;
justify-content: flex-end;
position: relative;
flex: 0 0 auto;
}
.dashboard-page.content .invoice-row-2 {
display: flex;
align-items: center;
gap: 32px;
padding: 24px 0px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
background-color: var(--arcturus-styles-sys-color-surface-default);
border-bottom-width: 1px;
border-bottom-style: solid;
border-color: var(--arcturus-styles-sys-color-border-default);
}
.dashboard-page.content .singular-button-2 {
margin-bottom: -1px;
margin-right: -1px;
background-color: var(--arcturus-styles-sys-color-action-secondary-default);
border: 1px solid;
border-color: var(--arcturus-styles-sys-color-border-default);
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
padding: 4px 16px;
position: relative;
flex: 0 0 auto;
border-radius: 50px;
}
/* -------------------------------------------------------------------------------------------- */
.home {
align-self: stretch;
position: relative;
text-decoration: underline;
line-height: 18px;
}
.chevron-right-icon {
height: 16px;
width: 16px;
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.site-bookings {
align-self: stretch;
position: relative;
line-height: 18px;
}
.breadcrumb {
height: 18px;
display: none;
flex-direction: row;
align-items: center;
justify-content: flex-start;
}
.gpp-good-icon {
height: 32px;
width: 32px;
position: relative;
}
/* .thumbnail {
border-radius: var(--br-5xs);
background-color: #0f9996;
overflow: hidden;
display: none;
flex-direction: row;
align-items: flex-start;
justify-content: flex-start;
padding: var(--padding-5xs);
} */
.site-bookings1 {
margin: 0;
position: relative;
font-size: var(--headings-macos-medium-h2-size);
line-height: 48px;
font-weight: 500;
font-family: var(--components-desktop-button-text-small);
color: var(--color-black);
}
.page-title-breadcrumb {
flex: 1;
display: flex;
flex-direction: row;
flex-wrap: wrap;
align-items: center;
justify-content: flex-start;
gap: var(--gap-base);
min-width: 223px;
max-width: 100%;
}
.add-icon {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
display: none;
min-height: 24px;
}
.label {
position: relative;
font-size: var(--components-desktop-button-text-small-size);
line-height: 24px;
font-weight: 600;
font-family: var(--components-desktop-button-text-small);
color: var(--text-on-accent);
text-align: center;
}
.suffix-icon {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
display: none;
min-height: 24px;
}
.singular-button {
cursor: pointer;
border: 0;
padding: var(--padding-5xs) var(--padding-5xl);
background-color: var(--sys-color-action-primary-default);
border-radius: var(--br-31xl);
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
gap: var(--gap-5xs);
}
.page-title-breadcrumb-parent {
align-self: stretch;
display: flex;
flex-direction: row;
flex-wrap: wrap;
align-items: flex-end;
justify-content: flex-end;
gap: var(--gap-5xl);
max-width: 100%;
font-size: var(--comp-typography-body-macos-caption-size);
}
.showing-1-10-of,
.upcoming-bookings {
position: relative;
display: inline-block;
}
.upcoming-bookings {
height: 24px;
line-height: 24px;
font-weight: 500;
}
.showing-1-10-of {
height: 20px;
flex: 1;
line-height: 20px;
min-width: 456px;
max-width: 100%;
}
.flag-icon,
.prefix-icon {
position: relative;
display: none;
}
.flag-icon {
height: 24px;
width: var(--sys-sizing-icon-l);
object-fit: cover;
z-index: 0;
}
.prefix-icon {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
overflow: hidden;
flex-shrink: 0;
z-index: 1;
}
.prefix-iconbutton-atom {
height: 24px;
width: 24px;
position: relative;
border-radius: var(--br-9xs);
z-index: 2;
}
.input-text,
.search-text {
position: relative;
line-height: 24px;
align-items: center;
}
.input-text {
flex: 1;
display: flex;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
height: 32px;
z-index: 3;
}
.search-text {
align-self: stretch;
width: 58.5px;
color: var(--sys-color-text-default);
display: none;
z-index: 4;
}
.loading-animation-icon {
height: 24px;
width: 24px;
position: relative;
object-fit: cover;
display: none;
z-index: 5;
}
.suffix-icon1 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
display: none;
z-index: 6;
}
.suffix-iconbutton-atom {
height: 24px;
width: 24px;
z-index: 7;
}
.see-hide-password,
.suffix-iconbutton-atom,
.suffix-iconbutton-atom1 {
position: relative;
border-radius: var(--br-9xs);
display: none;
}
.suffix-iconbutton-atom1 {
height: 24px;
width: 24px;
z-index: 8;
}
.see-hide-password {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
z-index: 9;
}
.focused-outline {
height: 100%;
width: 100%;
position: absolute;
margin: 0 !important;
top: -4px;
right: -4px;
bottom: -4px;
left: -4px;
border-radius: var(--br-4xs);
border: 2px solid var(--color-steelblue-100);
box-sizing: border-box;
display: none;
z-index: 10;
}
.field,
.search {
display: flex;
justify-content: flex-start;
}
.field {
align-self: stretch;
height: 32px;
border-radius: var(--br-5xs);
background-color: var(--text-on-accent);
border: 1px solid var(--sys-color-border-default);
box-sizing: border-box;
flex-direction: row;
align-items: center;
padding: var(--padding-9xs) var(--padding-2xs);
position: relative;
gap: var(--gap-5xs);
}
.search {
width: 344px;
flex-direction: column;
align-items: flex-start;
max-width: 100%;
}
.file-download-icon,
.filter-alt-icon {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
min-height: 24px;
}
.controls,
.filter-alt-parent,
.heading {
display: flex;
flex-direction: row;
align-items: center;
}
.filter-alt-parent {
justify-content: flex-end;
gap: var(--gap-base);
}
.controls,
.heading {
gap: var(--gap-5xl);
max-width: 100%;
}
.controls {
justify-content: flex-end;
font-size: var(--components-desktop-button-text-small-size);
color: var(--sys-color-text-subdued1);
}
.heading {
align-self: stretch;
flex-wrap: wrap;
justify-content: flex-start;
}
.expand-less-icon,
.text {
position: relative;
overflow: hidden;
}
.text {
flex: 1;
line-height: 20px;
font-weight: 500;
display: flex;
align-items: center;
text-overflow: ellipsis;
white-space: nowrap;
height: 24px;
}
.expand-less-icon {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
flex-shrink: 0;
}
.header-cell {
width: 160px;
background-color: var(--sys-color-surface-background);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
gap: var(--gap-5xs);
z-index: 27;
}
.text1 {
flex: 1;
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
}
.row-1,
.text1,
.text2 {
white-space: nowrap;
}
.row-1 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 26;
}
.text2 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
}
.row-2 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 25;
}
.text3 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-3 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 24;
}
.text4 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-4 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 23;
}
.text5 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-5 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 22;
}
.text6 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-6 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 21;
}
.text7 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-7 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 20;
}
.text8 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-8 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 19;
}
.text9 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-9 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 18;
}
.text10 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-10 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 17;
}
.text11 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-11 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 16;
}
.text12 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-12 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 15;
}
.text13 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-13 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 14;
}
.text14 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-14 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 13;
}
.text15 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-15 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 12;
}
.text16 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-16 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 11;
}
.text17 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-17 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 10;
}
.text18 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-18 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 9;
}
.text19 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-19 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 8;
}
.text20 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-20 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 7;
}
.text21 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-21 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 6;
}
.text22 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-22 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 5;
}
.text23 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-23 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 4;
}
.text24 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-24 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 3;
}
.group-container {
display: flex !important;
flex-direction: row;
gap: 2px;
width: 100%;
}
div#myBtn {
color: #fff;
margin: 10px 0px;
background: rgba(1, 114, 197, 1);
}
.value-container {
font-size: 0.8rem;
margin-top: 5px;
}
.text25 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-25 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 2;
}
.text26 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-26 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 1;
}
.text27 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.columns,
.row-27 {
flex-shrink: 0;
display: flex;
justify-content: flex-start;
}
.row-27 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-direction: row;
align-items: center;
padding: var(--padding-base);
z-index: 0;
}
.columns {
height: 1460px;
width: 56px;
overflow-y: auto;
flex-direction: column;
align-items: flex-start;
}
.expand-more-icon,
.text28 {
position: relative;
overflow: hidden;
}
.text28 {
flex: 1;
line-height: 20px;
font-weight: 500;
display: flex;
align-items: center;
text-overflow: ellipsis;
white-space: nowrap;
height: 24px;
}
.expand-more-icon {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
flex-shrink: 0;
display: none;
}
.header {
align-self: stretch;
background-color: var(--sys-color-surface-background);
border-bottom: 1px solid var(--sys-color-border-subdued);
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
gap: var(--gap-5xs);
z-index: 27;
color: var(--sys-color-text-default);
}
.text29 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.body-cell {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-default1);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
white-space: nowrap;
z-index: 26;
color: var(--sys-color-text-default);
}
.text30 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.body-cell1 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-default1);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 25;
color: var(--sys-color-text-default);
}
.text31 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.body-cell2 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-default1);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 24;
color: var(--sys-color-text-default);
}
.text32 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.body-cell3 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-default1);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 23;
color: var(--sys-color-text-default);
}
.text33 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.body-cell4 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-default1);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 22;
color: var(--sys-color-text-default);
}
.text34 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.body-cell5 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-default1);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 21;
color: var(--sys-color-text-default);
}
.text35 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.body-cell6 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-default1);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 20;
color: var(--sys-color-text-default);
}
.text36 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.body-cell7 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-default1);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 19;
color: var(--sys-color-text-default);
}
.text37 {
height: 24px;
flex: 1;
position: relative;
text-decoration: underline;
line-height: 24px;
font-weight: 500;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-91 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-default1);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 18;
}
.text38 {
height: 24px;
flex: 1;
position: relative;
text-decoration: underline;
line-height: 24px;
font-weight: 500;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-101 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-default1);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 17;
}
.text39 {
height: 24px;
flex: 1;
position: relative;
text-decoration: underline;
line-height: 24px;
font-weight: 500;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-111 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-default1);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 16;
}
.text40 {
height: 24px;
flex: 1;
position: relative;
text-decoration: underline;
line-height: 24px;
font-weight: 500;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-121 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-default1);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 15;
}
.text41 {
height: 24px;
flex: 1;
position: relative;
text-decoration: underline;
line-height: 24px;
font-weight: 500;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-131 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-default1);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 14;
}
.text42 {
height: 24px;
flex: 1;
position: relative;
text-decoration: underline;
line-height: 24px;
font-weight: 500;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-141 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-default1);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 13;
}
.text43 {
height: 24px;
flex: 1;
position: relative;
text-decoration: underline;
line-height: 24px;
font-weight: 500;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-151 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-default1);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 12;
}
.text44 {
height: 24px;
flex: 1;
position: relative;
text-decoration: underline;
line-height: 24px;
font-weight: 500;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-161 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-default1);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 11;
}
.text45 {
height: 24px;
flex: 1;
position: relative;
text-decoration: underline;
line-height: 24px;
font-weight: 500;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-171 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-default1);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 10;
}
.text46 {
height: 24px;
flex: 1;
position: relative;
text-decoration: underline;
line-height: 24px;
font-weight: 500;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-181 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-default1);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 9;
}
.text47 {
height: 24px;
flex: 1;
position: relative;
text-decoration: underline;
line-height: 24px;
font-weight: 500;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-191 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-default1);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 8;
}
.text48 {
height: 24px;
flex: 1;
position: relative;
text-decoration: underline;
line-height: 24px;
font-weight: 500;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-201 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-default1);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 7;
}
.text49 {
height: 24px;
flex: 1;
position: relative;
text-decoration: underline;
line-height: 24px;
font-weight: 500;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-211 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-default1);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 6;
}
.text50 {
height: 24px;
flex: 1;
position: relative;
text-decoration: underline;
line-height: 24px;
font-weight: 500;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-221 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-default1);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 5;
}
.text51 {
height: 24px;
flex: 1;
position: relative;
text-decoration: underline;
line-height: 24px;
font-weight: 500;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-231 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-default1);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 4;
}
.text52 {
height: 24px;
flex: 1;
position: relative;
text-decoration: underline;
line-height: 24px;
font-weight: 500;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-241 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-default1);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 3;
}
.text53 {
height: 24px;
flex: 1;
position: relative;
text-decoration: underline;
line-height: 24px;
font-weight: 500;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-251 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-default1);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 2;
}
.text54 {
height: 24px;
flex: 1;
position: relative;
text-decoration: underline;
line-height: 24px;
font-weight: 500;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-261 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-default1);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 1;
}
.text55 {
height: 24px;
flex: 1;
position: relative;
text-decoration: underline;
line-height: 24px;
font-weight: 500;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.column-2,
.row-271 {
display: flex;
justify-content: flex-start;
}
.row-271 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-default1);
box-sizing: border-box;
flex-shrink: 0;
flex-direction: row;
align-items: center;
padding: var(--padding-base);
z-index: 0;
}
.column-2 {
height: 1460px;
flex: 1;
overflow-y: auto;
flex-direction: column;
align-items: flex-start;
color: var(--sys-color-text-info);
}
.expand-less-icon1,
.text56 {
position: relative;
overflow: hidden;
}
.text56 {
flex: 1;
line-height: 20px;
font-weight: 500;
display: flex;
align-items: center;
text-overflow: ellipsis;
white-space: nowrap;
height: 24px;
}
.expand-less-icon1 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
flex-shrink: 0;
}
.header-cell1 {
align-self: stretch;
background-color: var(--sys-color-surface-background);
border-bottom: 1px solid var(--sys-color-border-subdued);
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
gap: var(--gap-5xs);
z-index: 27;
}
.text57 {
height: 24px;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
flex-shrink: 0;
}
.row-110,
.text57,
.text58 {
white-space: nowrap;
}
.row-110 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 26;
}
.text58 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
}
.row-28 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 25;
}
.text59 {
height: 24px;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex-shrink: 0;
}
.row-31 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 24;
}
.text60 {
height: 24px;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex-shrink: 0;
}
.row-41 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 23;
}
.text61 {
height: 24px;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex-shrink: 0;
}
.row-51 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 22;
}
.text62 {
height: 24px;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex-shrink: 0;
}
.row-61 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 21;
}
.text63 {
height: 24px;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex-shrink: 0;
}
.row-71 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 20;
}
.text64 {
height: 24px;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex-shrink: 0;
}
.row-81 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 19;
}
.text65 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-92 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 18;
}
.text66 {
height: 24px;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex-shrink: 0;
}
.row-102 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 17;
}
.text67 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-112 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 16;
}
.text68 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-122 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 15;
}
.text69 {
height: 24px;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex-shrink: 0;
}
.row-132 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 14;
}
.text70 {
height: 24px;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex-shrink: 0;
}
.row-142 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 13;
}
.text71 {
height: 24px;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex-shrink: 0;
}
.row-152 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 12;
}
.text72 {
height: 24px;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex-shrink: 0;
}
.row-162 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 11;
}
.text73 {
height: 24px;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex-shrink: 0;
}
.row-172 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 10;
}
.text74 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-182 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 9;
}
.text75 {
height: 24px;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex-shrink: 0;
}
.row-192 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 8;
}
.text76 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-202 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 7;
}
.text77 {
height: 24px;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex-shrink: 0;
}
.row-212 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 6;
}
.text78 {
height: 24px;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex-shrink: 0;
}
.row-222 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 5;
}
.text79 {
height: 24px;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex-shrink: 0;
}
.row-232 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 4;
}
.text80 {
height: 24px;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex-shrink: 0;
}
.row-242 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 3;
}
.text81 {
height: 24px;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex-shrink: 0;
}
.row-252 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 2;
}
.text82 {
height: 24px;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex-shrink: 0;
}
.row-262 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 1;
}
.text83 {
height: 24px;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex-shrink: 0;
}
.column-3,
.row-272 {
display: flex;
justify-content: flex-start;
}
.row-272 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
flex-direction: row;
align-items: center;
padding: var(--padding-base);
z-index: 0;
}
.column-3 {
height: 1460px;
flex: 1;
overflow-y: auto;
flex-direction: column;
align-items: flex-start;
}
.expand-less,
.text84 {
position: relative;
overflow: hidden;
}
.text84 {
flex: 1;
line-height: 20px;
font-weight: 500;
display: flex;
align-items: center;
text-overflow: ellipsis;
white-space: nowrap;
height: 24px;
}
.expand-less {
margin: 0;
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
flex-shrink: 0;
}
.header-cell2 {
align-self: stretch;
background-color: var(--sys-color-surface-background);
border-bottom: 1px solid var(--sys-color-border-subdued);
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
gap: var(--gap-5xs);
z-index: 27;
}
.text85 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-113 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 26;
}
.text86 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-29 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 25;
}
.text87 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-32 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 24;
}
.text88 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-42 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 23;
}
.text89 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-52 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 22;
}
.text90 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-62 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 21;
}
.text91 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-72 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 20;
}
.text92 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-82 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 19;
}
.text93 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-93 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 18;
}
.text94 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-103 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 17;
}
.text95 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-114 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 16;
}
.text96 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-123 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 15;
}
.text97 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-133 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 14;
}
.text98 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-143 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 13;
}
.text99 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-153 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 12;
}
.text100 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-163 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 11;
}
.text101 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-173 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 10;
}
.text102 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-183 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 9;
}
.text103 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-193 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 8;
}
.text104 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-203 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 7;
}
.text105 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-213 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 6;
}
.text106 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-223 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 5;
}
.text107 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-233 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 4;
}
.text108 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-243 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 3;
}
.text109 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-253 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 2;
}
.text110 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-263 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 1;
}
.text111 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.column-4,
.row-273 {
display: flex;
justify-content: flex-start;
}
.row-273 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
flex-direction: row;
align-items: center;
padding: var(--padding-base);
z-index: 0;
}
.column-4 {
height: 1460px;
flex: 1;
overflow-y: auto;
flex-direction: column;
align-items: flex-start;
}
.expand-less-icon2,
.text112 {
position: relative;
overflow: hidden;
}
.text112 {
flex: 1;
line-height: 20px;
font-weight: 500;
display: flex;
align-items: center;
text-overflow: ellipsis;
white-space: nowrap;
height: 24px;
}
.expand-less-icon2 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
flex-shrink: 0;
}
.header-cell3 {
align-self: stretch;
background-color: var(--sys-color-surface-background);
border-bottom: 1px solid var(--sys-color-border-subdued);
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
gap: var(--gap-5xs);
z-index: 27;
}
.text113 {
height: 24px;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex-shrink: 0;
}
.row-115 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 26;
}
.text114 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-210 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 25;
}
.text115 {
height: 24px;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex-shrink: 0;
}
.row-33 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 24;
}
.text116 {
height: 24px;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex-shrink: 0;
}
.row-43 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 23;
}
.text117 {
height: 24px;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex-shrink: 0;
}
.row-53 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 22;
}
.text118 {
height: 24px;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex-shrink: 0;
}
.row-63 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 21;
}
.text119 {
height: 24px;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex-shrink: 0;
}
.row-73 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 20;
}
.text120 {
height: 24px;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex-shrink: 0;
}
.row-83 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 19;
}
.text121 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-94 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 18;
}
.text122 {
height: 24px;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex-shrink: 0;
}
.row-104 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 17;
}
.text123 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-116 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 16;
}
.text124 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-124 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 15;
}
.text125 {
height: 24px;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex-shrink: 0;
}
.row-134 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 14;
}
.text126 {
height: 24px;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex-shrink: 0;
}
.row-144 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 13;
}
.text127 {
height: 24px;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex-shrink: 0;
}
.row-154 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 12;
}
.text128 {
height: 24px;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex-shrink: 0;
}
.row-164 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 11;
}
.text129 {
height: 24px;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex-shrink: 0;
}
.row-174 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 10;
}
.text130 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-184 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 9;
}
.text131 {
height: 24px;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex-shrink: 0;
}
.row-194 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 8;
}
.text132 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-204 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 7;
}
.text133 {
height: 24px;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex-shrink: 0;
}
.row-214 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 6;
}
.text134 {
height: 24px;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex-shrink: 0;
}
.row-224 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 5;
}
.text135 {
height: 24px;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex-shrink: 0;
}
.row-234 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 4;
}
.text136 {
height: 24px;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex-shrink: 0;
}
.row-244 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 3;
}
.text137 {
height: 24px;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex-shrink: 0;
}
.row-254 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 2;
}
.text138 {
height: 24px;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex-shrink: 0;
}
.row-264 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 1;
}
.text139 {
height: 24px;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex-shrink: 0;
}
.column-5,
.row-274 {
display: flex;
justify-content: flex-start;
}
.row-274 {
width: 160px;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
flex-direction: row;
align-items: center;
padding: var(--padding-base);
z-index: 0;
}
.column-5 {
height: 1460px;
flex: 1;
overflow-y: auto;
flex-direction: column;
align-items: flex-start;
}
.expand-less-icon3,
.text140 {
position: relative;
overflow: hidden;
}
.text140 {
flex: 1;
line-height: 20px;
font-weight: 500;
display: flex;
align-items: center;
text-overflow: ellipsis;
white-space: nowrap;
height: 24px;
}
.expand-less-icon3 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
flex-shrink: 0;
}
.header-cell4 {
align-self: stretch;
background-color: var(--sys-color-surface-background);
border-bottom: 1px solid var(--sys-color-border-subdued);
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
gap: var(--gap-5xs);
white-space: nowrap;
z-index: 27;
}
.text141 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-117 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 26;
}
.text142 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-215 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 25;
}
.text143 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-34 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 24;
}
.text144 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-44 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 23;
}
.text145 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-54 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 22;
}
.text146 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-64 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 21;
}
.text147 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-74 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 20;
}
.text148 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-84 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 19;
}
.text149 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-95 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 18;
}
.text150 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-105 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 17;
}
.text151 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-118 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 16;
}
.text152 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-125 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 15;
}
.text153 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-135 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 14;
}
.text154 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-145 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 13;
}
.text155 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-155 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 12;
}
.text156 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-165 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 11;
}
.text157 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-175 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 10;
}
.text158 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-185 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 9;
}
.text159 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-195 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 8;
}
.text160 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-205 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 7;
}
.text161 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-216 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 6;
}
.text162 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-225 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 5;
}
.text163 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-235 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 4;
}
.text164 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-245 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 3;
}
.text165 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-255 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 2;
}
.text166 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-265 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 1;
}
.text167 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.column-6,
.row-275 {
display: flex;
justify-content: flex-start;
}
.row-275 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
flex-direction: row;
align-items: center;
padding: var(--padding-base);
z-index: 0;
}
.column-6 {
height: 1460px;
flex: 1;
overflow-y: auto;
flex-direction: column;
align-items: flex-start;
}
.expand-less-icon4,
.text168 {
position: relative;
overflow: hidden;
}
.text168 {
flex: 1;
line-height: 20px;
font-weight: 500;
display: flex;
align-items: center;
text-overflow: ellipsis;
white-space: nowrap;
height: 24px;
}
.expand-less-icon4 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
flex-shrink: 0;
}
.header-cell5 {
align-self: stretch;
background-color: var(--sys-color-surface-background);
border-bottom: 1px solid var(--sys-color-border-subdued);
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
gap: var(--gap-5xs);
z-index: 27;
}
.text169 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-119 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 26;
}
.text170 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-217 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 25;
}
.text171 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-35 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 24;
}
.text172 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-45 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 23;
}
.text173 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-55 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 22;
}
.text174 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-65 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 21;
}
.text175 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-75 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 20;
}
.text176 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-85 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 19;
}
.text177 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-96 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 18;
}
.text178 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-106 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 17;
}
.text179 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-1110 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 16;
}
.text180 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-126 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 15;
}
.text181 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-136 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 14;
}
.text182 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-146 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 13;
}
.text183 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-156 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 12;
}
.text184 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-166 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 11;
}
.text185 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-176 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 10;
}
.text186 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-186 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 9;
}
.text187 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-196 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 8;
}
.text188 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-206 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 7;
}
.text189 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-218 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 6;
}
.text190 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-226 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 5;
}
.text191 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-236 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 4;
}
.text192 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-246 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 3;
}
.text193 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-256 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 2;
}
.text194 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-266 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 1;
}
.text195 {
height: 24px;
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.column-7,
.row-276 {
display: flex;
justify-content: flex-start;
}
.row-276 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
flex-direction: row;
align-items: center;
padding: var(--padding-base);
z-index: 0;
}
.column-7 {
height: 1460px;
flex: 1;
overflow-y: auto;
flex-direction: column;
align-items: flex-start;
}
.expand-less-icon5,
.text196 {
position: relative;
overflow: hidden;
}
.text196 {
flex: 1;
line-height: 20px;
font-weight: 500;
display: flex;
align-items: center;
text-overflow: ellipsis;
white-space: nowrap;
height: 24px;
}
.expand-less-icon5 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
flex-shrink: 0;
}
.header-cell6 {
align-self: stretch;
background-color: var(--sys-color-surface-background);
border-bottom: 1px solid var(--sys-color-border-subdued);
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
gap: var(--gap-5xs);
z-index: 27;
}
.text197 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-120 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 26;
}
.text198 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-219 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 25;
}
.text199 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-36 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 24;
}
.text200 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-46 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 23;
}
.text201 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-56 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 22;
}
.text202 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-66 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 21;
}
.text203 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-76 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 20;
}
.text204 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-86 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 19;
}
.text205 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-97 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 18;
}
.text206 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-107 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 17;
}
.text207 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-1111 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 16;
}
.text208 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-127 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 15;
}
.text209 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-137 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 14;
}
.text210 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-147 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 13;
}
.text211 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-157 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 12;
}
.text212 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-167 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 11;
}
.text213 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-177 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 10;
}
.text214 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-187 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 9;
}
.text215 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-197 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 8;
}
.text216 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-207 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 7;
}
.text217 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-2110 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 6;
}
.text218 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-227 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 5;
}
.text219 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-237 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 4;
}
.text220 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-247 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 3;
}
.text221 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-257 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 2;
}
.text222 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-267 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 1;
}
.text223 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.column-8,
.row-277 {
justify-content: flex-start;
}
.row-277 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
padding: var(--padding-base);
z-index: 0;
}
.column-8 {
height: 1460px;
width: 170.4px;
overflow-y: auto;
display: none;
flex-direction: column;
align-items: flex-start;
}
.expand-less-icon6,
.text224 {
position: relative;
overflow: hidden;
}
.text224 {
flex: 1;
line-height: 20px;
font-weight: 500;
display: flex;
align-items: center;
text-overflow: ellipsis;
white-space: nowrap;
height: 24px;
}
.expand-less-icon6 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
flex-shrink: 0;
}
.header-cell7 {
align-self: stretch;
background-color: var(--sys-color-surface-background);
border-bottom: 1px solid var(--sys-color-border-subdued);
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
gap: var(--gap-5xs);
z-index: 27;
}
.text225 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-128 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 26;
}
.text226 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-220 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 25;
}
.text227 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-37 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 24;
}
.text228 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-47 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 23;
}
.text229 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-57 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 22;
}
.text230 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-67 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 21;
}
.text231 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-77 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 20;
}
.text232 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-87 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 19;
}
.text233 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-98 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 18;
}
.text234 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-108 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 17;
}
.text235 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-1112 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 16;
}
.text236 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-129 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 15;
}
.text237 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-138 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 14;
}
.text238 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-148 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 13;
}
.text239 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-158 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 12;
}
.text240 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-168 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 11;
}
.text241 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-178 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 10;
}
.text242 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-188 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 9;
}
.text243 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-198 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 8;
}
.text244 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-208 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 7;
}
.text245 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-2111 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 6;
}
.text246 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-228 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 5;
}
.text247 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-238 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 4;
}
.text248 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-248 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 3;
}
.text249 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-258 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 2;
}
.text250 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-268 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 1;
}
.text251 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.column-9,
.row-278 {
justify-content: flex-start;
}
.row-278 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
padding: var(--padding-base);
z-index: 0;
}
.column-9 {
height: 1460px;
width: 170.4px;
overflow-y: auto;
display: none;
flex-direction: column;
align-items: flex-start;
}
.expand-less-icon7,
.text252 {
position: relative;
overflow: hidden;
}
.text252 {
flex: 1;
line-height: 20px;
font-weight: 500;
display: flex;
align-items: center;
text-overflow: ellipsis;
white-space: nowrap;
height: 24px;
}
.expand-less-icon7 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
flex-shrink: 0;
}
.header-cell8 {
align-self: stretch;
background-color: var(--sys-color-surface-background);
border-bottom: 1px solid var(--sys-color-border-subdued);
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
gap: var(--gap-5xs);
z-index: 27;
}
.text253 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-130 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 26;
}
.text254 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-229 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 25;
}
.text255 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-38 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 24;
}
.text256 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-48 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 23;
}
.text257 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-58 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 22;
}
.text258 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-68 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 21;
}
.text259 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-78 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 20;
}
.text260 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-88 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 19;
}
.text261 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-99 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 18;
}
.text262 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-109 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 17;
}
.text263 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-1113 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 16;
}
.text264 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-1210 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 15;
}
.text265 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-139 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 14;
}
.text266 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-149 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 13;
}
.text267 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-159 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 12;
}
.text268 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-169 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 11;
}
.text269 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-179 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 10;
}
.text270 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-189 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 9;
}
.text271 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-199 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 8;
}
.text272 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-209 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 7;
}
.text273 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-2112 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 6;
}
.text274 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-2210 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 5;
}
.text275 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-239 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 4;
}
.text276 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-249 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 3;
}
.text277 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-259 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 2;
}
.text278 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-269 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
z-index: 1;
}
.text279 {
position: relative;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.column-10,
.row-279 {
justify-content: flex-start;
}
.row-279 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
padding: var(--padding-base);
z-index: 0;
}
.column-10 {
height: 1460px;
width: 170.4px;
overflow-y: auto;
display: none;
flex-direction: column;
align-items: flex-start;
}
.expand-more-icon1,
.text280 {
position: relative;
overflow: hidden;
}
.text280 {
flex: 1;
line-height: 20px;
font-weight: 500;
display: flex;
align-items: center;
text-overflow: ellipsis;
white-space: nowrap;
height: 24px;
}
.expand-more-icon1 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
flex-shrink: 0;
display: none;
}
.header1 {
align-self: stretch;
background-color: var(--sys-color-surface-background);
border-bottom: 1px solid var(--sys-color-border-subdued);
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
gap: var(--gap-5xs);
z-index: 27;
font-size: var(--components-desktop-button-text-small-size);
}
.semantic-icon {
height: 24px;
width: 24px;
position: relative;
}
.status {
position: relative;
line-height: 20px;
}
.row-140,
.tag {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
}
.tag {
gap: var(--gap-5xs);
}
.row-140 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
padding: var(--padding-base);
z-index: 26;
}
.semantic-icon1 {
height: 24px;
width: 24px;
position: relative;
}
.status1 {
position: relative;
line-height: 20px;
}
.row-230,
.tag1 {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
}
.tag1 {
gap: var(--gap-5xs);
}
.row-230 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
padding: var(--padding-base);
z-index: 25;
}
.semantic-icon2 {
height: 24px;
width: 24px;
position: relative;
}
.status2 {
position: relative;
line-height: 20px;
}
.row-39,
.tag2 {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
}
.tag2 {
gap: var(--gap-5xs);
}
.row-39 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
padding: var(--padding-base);
z-index: 24;
}
.semantic-icon3 {
height: 24px;
width: 24px;
position: relative;
}
.status3 {
position: relative;
line-height: 20px;
}
.row-49,
.tag3 {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
}
.tag3 {
gap: var(--gap-5xs);
}
.row-49 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
padding: var(--padding-base);
z-index: 23;
}
.semantic-icon4 {
height: 24px;
width: 24px;
position: relative;
}
.status4 {
position: relative;
line-height: 20px;
}
.row-59,
.tag4 {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
}
.tag4 {
gap: var(--gap-5xs);
}
.row-59 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
padding: var(--padding-base);
z-index: 22;
}
.semantic-icon5 {
height: 24px;
width: 24px;
position: relative;
}
.status5 {
position: relative;
line-height: 20px;
}
.row-69,
.tag5 {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
}
.tag5 {
gap: var(--gap-5xs);
}
.row-69 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
padding: var(--padding-base);
z-index: 21;
}
.semantic-icon6 {
height: 24px;
width: 24px;
position: relative;
}
.status6 {
position: relative;
line-height: 20px;
}
.row-79,
.tag6 {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
}
.tag6 {
gap: var(--gap-5xs);
}
.row-79 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
padding: var(--padding-base);
z-index: 20;
}
.semantic-icon7 {
height: 24px;
width: 24px;
position: relative;
}
.status7 {
position: relative;
line-height: 20px;
}
.row-89,
.tag7 {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
}
.tag7 {
gap: var(--gap-5xs);
}
.row-89 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
padding: var(--padding-base);
z-index: 19;
}
.semantic-icon8 {
height: 24px;
width: 24px;
position: relative;
}
.status8 {
position: relative;
line-height: 20px;
}
.row-910,
.tag8 {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
}
.tag8 {
gap: var(--gap-5xs);
}
.row-910 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
padding: var(--padding-base);
z-index: 18;
}
.semantic-icon9 {
height: 24px;
width: 24px;
position: relative;
}
.status9 {
position: relative;
line-height: 20px;
}
.row-1010,
.tag9 {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
}
.tag9 {
gap: var(--gap-5xs);
}
.row-1010 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
padding: var(--padding-base);
z-index: 17;
}
.semantic-icon10 {
height: 24px;
width: 24px;
position: relative;
}
.status10 {
position: relative;
line-height: 20px;
}
.row-1114,
.tag10 {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
}
.tag10 {
gap: var(--gap-5xs);
}
.row-1114 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
padding: var(--padding-base);
z-index: 16;
}
.semantic-icon11 {
height: 24px;
width: 24px;
position: relative;
}
.status11 {
position: relative;
line-height: 20px;
}
.row-1211,
.tag11 {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
}
.tag11 {
gap: var(--gap-5xs);
}
.row-1211 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
padding: var(--padding-base);
z-index: 15;
}
.semantic-icon12 {
height: 24px;
width: 24px;
position: relative;
}
.status12 {
position: relative;
line-height: 20px;
}
.row-1310,
.tag12 {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
}
.tag12 {
gap: var(--gap-5xs);
}
.row-1310 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
padding: var(--padding-base);
z-index: 14;
}
.semantic-icon13 {
height: 24px;
width: 24px;
position: relative;
}
.status13 {
position: relative;
line-height: 20px;
}
.row-1410,
.tag13 {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
}
.tag13 {
gap: var(--gap-5xs);
}
.row-1410 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
padding: var(--padding-base);
z-index: 13;
}
.semantic-icon14 {
height: 24px;
width: 24px;
position: relative;
}
.status14 {
position: relative;
line-height: 20px;
}
.row-1510,
.tag14 {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
}
.tag14 {
gap: var(--gap-5xs);
}
.row-1510 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
padding: var(--padding-base);
z-index: 12;
}
.semantic-icon15 {
height: 24px;
width: 24px;
position: relative;
}
.status15 {
position: relative;
line-height: 20px;
}
.row-1610,
.tag15 {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
}
.tag15 {
gap: var(--gap-5xs);
}
.row-1610 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
padding: var(--padding-base);
z-index: 11;
}
.semantic-icon16 {
height: 24px;
width: 24px;
position: relative;
}
.status16 {
position: relative;
line-height: 20px;
}
.row-1710,
.tag16 {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
}
.tag16 {
gap: var(--gap-5xs);
}
.row-1710 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
padding: var(--padding-base);
z-index: 10;
}
.semantic-icon17 {
height: 24px;
width: 24px;
position: relative;
}
.status17 {
position: relative;
line-height: 20px;
}
.row-1810,
.tag17 {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
}
.tag17 {
gap: var(--gap-5xs);
}
.row-1810 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
padding: var(--padding-base);
z-index: 9;
}
.semantic-icon18 {
height: 24px;
width: 24px;
position: relative;
}
.status18 {
position: relative;
line-height: 20px;
}
.row-1910,
.tag18 {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
}
.tag18 {
gap: var(--gap-5xs);
}
.row-1910 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
padding: var(--padding-base);
z-index: 8;
}
.semantic-icon19 {
height: 24px;
width: 24px;
position: relative;
}
.status19 {
position: relative;
line-height: 20px;
}
.row-2010,
.tag19 {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
}
.tag19 {
gap: var(--gap-5xs);
}
.row-2010 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
padding: var(--padding-base);
z-index: 7;
}
.semantic-icon20 {
height: 24px;
width: 24px;
position: relative;
}
.status20 {
position: relative;
line-height: 20px;
}
.row-2113,
.tag20 {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
}
.tag20 {
gap: var(--gap-5xs);
}
.row-2113 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
padding: var(--padding-base);
z-index: 6;
}
.semantic-icon21 {
height: 24px;
width: 24px;
position: relative;
}
.status21 {
position: relative;
line-height: 20px;
}
.row-2211,
.tag21 {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
}
.tag21 {
gap: var(--gap-5xs);
}
.row-2211 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
padding: var(--padding-base);
z-index: 5;
}
.semantic-icon22 {
height: 24px;
width: 24px;
position: relative;
}
.status22 {
position: relative;
line-height: 20px;
}
.row-2310,
.tag22 {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
}
.tag22 {
gap: var(--gap-5xs);
}
.row-2310 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
padding: var(--padding-base);
z-index: 4;
}
.semantic-icon23 {
height: 24px;
width: 24px;
position: relative;
}
.status23 {
position: relative;
line-height: 20px;
}
.row-2410,
.tag23 {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
}
.tag23 {
gap: var(--gap-5xs);
}
.row-2410 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
padding: var(--padding-base);
z-index: 3;
}
.semantic-icon24 {
height: 24px;
width: 24px;
position: relative;
}
.status24 {
position: relative;
line-height: 20px;
}
.row-2510,
.tag24 {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
}
.tag24 {
gap: var(--gap-5xs);
}
.row-2510 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
padding: var(--padding-base);
z-index: 2;
}
.semantic-icon25 {
height: 24px;
width: 24px;
position: relative;
}
.status25 {
position: relative;
line-height: 20px;
}
.row-2610,
.tag25 {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
}
.tag25 {
gap: var(--gap-5xs);
}
.row-2610 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
padding: var(--padding-base);
z-index: 1;
}
.semantic-icon26 {
height: 24px;
width: 24px;
position: relative;
}
.status26 {
position: relative;
line-height: 20px;
}
.tag26 {
display: flex;
flex-direction: row;
align-items: center;
gap: var(--gap-5xs);
}
.columns1,
.row-2710,
.tag26 {
justify-content: flex-start;
}
.row-2710 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
padding: var(--padding-base);
z-index: 0;
}
.columns1 {
height: 1460px;
width: 170.4px;
overflow-y: auto;
display: none;
flex-direction: column;
align-items: flex-start;
font-size: var(--body-macos-paragraph-small-size);
}
.text281,
.unfold-more-icon {
height: 24px;
position: relative;
display: none;
}
.text281 {
width: 96px;
line-height: 20px;
font-weight: 500;
align-items: center;
justify-content: center;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.unfold-more-icon {
width: 24px;
}
.header2 {
align-self: stretch;
background-color: var(--sys-color-surface-background);
border-bottom: 1px solid var(--sys-color-border-subdued);
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-base);
gap: var(--gap-5xs);
z-index: 27;
}
.more-vert-icon {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button {
position: absolute;
top: 0;
left: 4px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.edit-icon {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button1 {
position: absolute;
top: 0;
left: 44px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.delete-icon {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button2 {
position: absolute;
top: 0;
left: 84px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.icon-button-parent {
height: 40px;
flex: 1;
position: relative;
}
.row-150 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-base);
z-index: 26;
}
.more-vert-icon1 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button3 {
position: absolute;
top: 0;
left: 4px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.edit-icon1 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button4 {
position: absolute;
top: 0;
left: 44px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.delete-icon1 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button5 {
position: absolute;
top: 0;
left: 84px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.icon-button-group {
height: 40px;
flex: 1;
position: relative;
}
.row-240 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-base);
z-index: 25;
}
.more-vert-icon2 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button6 {
position: absolute;
top: 0;
left: 4px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.edit-icon2 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button7 {
position: absolute;
top: 0;
left: 44px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.delete-icon2 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button8 {
position: absolute;
top: 0;
left: 84px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.icon-button-container {
height: 40px;
flex: 1;
position: relative;
}
.row-310 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-base);
z-index: 24;
}
.more-vert-icon3 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button9 {
position: absolute;
top: 0;
left: 4px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.edit-icon3 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button10 {
position: absolute;
top: 0;
left: 44px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.delete-icon3 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button11 {
position: absolute;
top: 0;
left: 84px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.group-div {
height: 40px;
flex: 1;
position: relative;
}
.row-410 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-base);
z-index: 23;
}
.more-vert-icon4 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button12 {
position: absolute;
top: 0;
left: 4px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.edit-icon4 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button13 {
position: absolute;
top: 0;
left: 44px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.delete-icon4 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button14 {
position: absolute;
top: 0;
left: 84px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.icon-button-parent1 {
height: 40px;
flex: 1;
position: relative;
}
.row-510 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-base);
z-index: 22;
}
.more-vert-icon5 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button15 {
position: absolute;
top: 0;
left: 4px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.edit-icon5 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button16 {
position: absolute;
top: 0;
left: 44px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.delete-icon5 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button17 {
position: absolute;
top: 0;
left: 84px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.icon-button-parent2 {
height: 40px;
flex: 1;
position: relative;
}
.row-610 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-base);
z-index: 21;
}
.more-vert-icon6 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button18 {
position: absolute;
top: 0;
left: 4px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.edit-icon6 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button19 {
position: absolute;
top: 0;
left: 44px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.delete-icon6 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button20 {
position: absolute;
top: 0;
left: 84px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.icon-button-parent3 {
height: 40px;
flex: 1;
position: relative;
}
.row-710 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-base);
z-index: 20;
}
.more-vert-icon7 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button21 {
position: absolute;
top: 0;
left: 4px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.edit-icon7 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button22 {
position: absolute;
top: 0;
left: 44px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.delete-icon7 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button23 {
position: absolute;
top: 0;
left: 84px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.icon-button-parent4 {
height: 40px;
flex: 1;
position: relative;
}
.row-810 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-5xs) var(--padding-base);
z-index: 19;
}
.more-vert-icon8 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button24 {
position: absolute;
top: 0;
left: 4px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.edit-icon8 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button25 {
position: absolute;
top: 0;
left: 44px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.delete-icon8 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button26 {
position: absolute;
top: 0;
left: 84px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.icon-button-parent5 {
height: 40px;
flex: 1;
position: relative;
}
.row-911 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-5xs) var(--padding-base);
z-index: 18;
}
.more-vert-icon9 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button27 {
position: absolute;
top: 0;
left: 4px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.edit-icon9 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button28 {
position: absolute;
top: 0;
left: 44px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.delete-icon9 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button29 {
position: absolute;
top: 0;
left: 84px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.icon-button-parent6 {
height: 40px;
flex: 1;
position: relative;
}
.row-1011 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-5xs) var(--padding-base);
z-index: 17;
}
.more-vert-icon10 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button30 {
position: absolute;
top: 0;
left: 4px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.edit-icon10 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button31 {
position: absolute;
top: 0;
left: 44px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.delete-icon10 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button32 {
position: absolute;
top: 0;
left: 84px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.icon-button-parent7 {
height: 40px;
flex: 1;
position: relative;
}
.row-1115 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-5xs) var(--padding-base);
z-index: 16;
}
.more-vert-icon11 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button33 {
position: absolute;
top: 0;
left: 4px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.edit-icon11 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button34 {
position: absolute;
top: 0;
left: 44px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.delete-icon11 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button35 {
position: absolute;
top: 0;
left: 84px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.icon-button-parent8 {
height: 40px;
flex: 1;
position: relative;
}
.row-1212 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-5xs) var(--padding-base);
z-index: 15;
}
.more-vert-icon12 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button36 {
position: absolute;
top: 0;
left: 4px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.edit-icon12 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button37 {
position: absolute;
top: 0;
left: 44px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.delete-icon12 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button38 {
position: absolute;
top: 0;
left: 84px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.icon-button-parent9 {
height: 40px;
flex: 1;
position: relative;
}
.row-1311 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-5xs) var(--padding-base);
z-index: 14;
}
.more-vert-icon13 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button39 {
position: absolute;
top: 0;
left: 4px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.edit-icon13 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button40 {
position: absolute;
top: 0;
left: 44px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.delete-icon13 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button41 {
position: absolute;
top: 0;
left: 84px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.icon-button-parent10 {
height: 40px;
flex: 1;
position: relative;
}
.row-1411 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-5xs) var(--padding-base);
z-index: 13;
}
.more-vert-icon14 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button42 {
position: absolute;
top: 0;
left: 4px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.edit-icon14 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button43 {
position: absolute;
top: 0;
left: 44px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.delete-icon14 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button44 {
position: absolute;
top: 0;
left: 84px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.icon-button-parent11 {
height: 40px;
flex: 1;
position: relative;
}
.row-1511 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-5xs) var(--padding-base);
z-index: 12;
}
.more-vert-icon15 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button45 {
position: absolute;
top: 0;
left: 4px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.edit-icon15 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button46 {
position: absolute;
top: 0;
left: 44px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.delete-icon15 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button47 {
position: absolute;
top: 0;
left: 84px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.icon-button-parent12 {
height: 40px;
flex: 1;
position: relative;
}
.row-1611 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-5xs) var(--padding-base);
z-index: 11;
}
.more-vert-icon16 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button48 {
position: absolute;
top: 0;
left: 4px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.edit-icon16 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button49 {
position: absolute;
top: 0;
left: 44px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.delete-icon16 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button50 {
position: absolute;
top: 0;
left: 84px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.icon-button-parent13 {
height: 40px;
flex: 1;
position: relative;
}
.row-1711 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-5xs) var(--padding-base);
z-index: 10;
}
.more-vert-icon17 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button51 {
position: absolute;
top: 0;
left: 4px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.edit-icon17 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button52 {
position: absolute;
top: 0;
left: 44px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.delete-icon17 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button53 {
position: absolute;
top: 0;
left: 84px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.icon-button-parent14 {
height: 40px;
flex: 1;
position: relative;
}
.row-1811 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-5xs) var(--padding-base);
z-index: 9;
}
.more-vert-icon18 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button54 {
position: absolute;
top: 0;
left: 4px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.edit-icon18 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button55 {
position: absolute;
top: 0;
left: 44px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.delete-icon18 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button56 {
position: absolute;
top: 0;
left: 84px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.icon-button-parent15 {
height: 40px;
flex: 1;
position: relative;
}
.row-1911 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-5xs) var(--padding-base);
z-index: 8;
}
.more-vert-icon19 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button57 {
position: absolute;
top: 0;
left: 4px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.edit-icon19 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button58 {
position: absolute;
top: 0;
left: 44px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.delete-icon19 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button59 {
position: absolute;
top: 0;
left: 84px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.icon-button-parent16 {
height: 40px;
flex: 1;
position: relative;
}
.row-2011 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-5xs) var(--padding-base);
z-index: 7;
}
.more-vert-icon20 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button60 {
position: absolute;
top: 0;
left: 4px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.edit-icon20 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button61 {
position: absolute;
top: 0;
left: 44px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.delete-icon20 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button62 {
position: absolute;
top: 0;
left: 84px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.icon-button-parent17 {
height: 40px;
flex: 1;
position: relative;
}
.row-2114 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-5xs) var(--padding-base);
z-index: 6;
}
.more-vert-icon21 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button63 {
position: absolute;
top: 0;
left: 4px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.edit-icon21 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button64 {
position: absolute;
top: 0;
left: 44px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.delete-icon21 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button65 {
position: absolute;
top: 0;
left: 84px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.icon-button-parent18 {
height: 40px;
flex: 1;
position: relative;
}
.row-2212 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-5xs) var(--padding-base);
z-index: 5;
}
.more-vert-icon22 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button66 {
position: absolute;
top: 0;
left: 4px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.edit-icon22 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button67 {
position: absolute;
top: 0;
left: 44px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.delete-icon22 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button68 {
position: absolute;
top: 0;
left: 84px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.icon-button-parent19 {
height: 40px;
flex: 1;
position: relative;
}
.row-2311 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-5xs) var(--padding-base);
z-index: 4;
}
.more-vert-icon23 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button69 {
position: absolute;
top: 0;
left: 4px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.edit-icon23 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button70 {
position: absolute;
top: 0;
left: 44px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.delete-icon23 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button71 {
position: absolute;
top: 0;
left: 84px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.icon-button-parent20 {
height: 40px;
flex: 1;
position: relative;
}
.row-2411 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-5xs) var(--padding-base);
z-index: 3;
}
.more-vert-icon24 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button72 {
position: absolute;
top: 0;
left: 4px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.edit-icon24 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button73 {
position: absolute;
top: 0;
left: 44px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.delete-icon24 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button74 {
position: absolute;
top: 0;
left: 84px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.icon-button-parent21 {
height: 40px;
flex: 1;
position: relative;
}
.row-2511 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-5xs) var(--padding-base);
z-index: 2;
}
.more-vert-icon25 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button75 {
position: absolute;
top: 0;
left: 4px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.edit-icon25 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button76 {
position: absolute;
top: 0;
left: 44px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.delete-icon25 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button77 {
position: absolute;
top: 0;
left: 84px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.icon-button-parent22 {
height: 40px;
flex: 1;
position: relative;
}
.row-2611 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-5xs) var(--padding-base);
z-index: 1;
}
.more-vert-icon26 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button78 {
position: absolute;
top: 0;
left: 4px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.edit-icon26 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button79 {
position: absolute;
top: 0;
left: 44px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.delete-icon26 {
width: var(--sys-icon-m);
height: var(--sys-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.icon-button80 {
position: absolute;
top: 0;
left: 84px;
border-radius: var(--br-9xs);
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs) 0 0;
box-sizing: border-box;
min-width: 40px;
min-height: 40px;
}
.icon-button-parent23 {
height: 40px;
flex: 1;
position: relative;
}
.row-2711 {
align-self: stretch;
height: 80px;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-subdued);
box-sizing: border-box;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-5xs) var(--padding-base);
z-index: 0;
}
.column-12,
.table-by-columns {
overflow-y: auto;
align-items: flex-start;
justify-content: flex-start;
}
.column-12 {
height: 1460px;
width: 160px;
display: none;
flex-direction: column;
max-width: 160px;
text-align: center;
}
.table-by-columns {
align-self: stretch;
height: 524px;
flex-shrink: 0;
display: flex;
flex-direction: row;
font-size: var(--components-desktop-button-text-small-size);
color: var(--sys-color-text-default);
}
.design-system-style-table,
.table {
align-self: stretch;
flex-direction: column;
justify-content: flex-start;
max-width: 100%;
}
.table {
border-radius: var(--br-5xs);
background-color: var(--text-on-accent);
box-shadow: 0 4px 8px -2px rgba(16, 24, 40, 0.1),
0 2px 4px -2px rgba(16, 24, 40, 0.06);
display: flex;
align-items: flex-end;
padding: var(--padding-5xl);
box-sizing: border-box;
gap: var(--gap-5xl);
font-size: var(--body-macos-paragraph-small-size);
color: var(--sys-color-text-subdued);
font-family: var(--body-macos-paragraph-normal);
}
.design-system-style-table {
display: none;
align-items: flex-start;
gap: var(--gap-base);
color: var(--color-black);
font-family: var(--components-desktop-button-text-small);
}
.image-icon {
align-self: stretch;
width: 176px;
border-radius: var(--br-5xs) 0 0 var(--br-5xs);
max-height: 100%;
object-fit: cover;
min-height: 224px;
}
.bookings,
.next-site-booking {
position: relative;
line-height: 24px;
font-weight: 500;
}
.bookings {
width: 86px;
font-size: var(--components-desktop-button-text-small-size);
line-height: 20px;
font-family: var(--body-macos-paragraph-normal);
color: var(--sys-color-text-subdued);
display: none;
}
button#close-request-btn {
background: #ffffff;
color: #333 !important;
}
.booking-request-dialog {
display: none;
}
.cancel-request-dialog {
display: none;
}
.audit-date {
padding: 5px 0;
}
.audit-date-dark {
color: #fff;
padding: 5px 0;
}
h3.audit-days-left {
color: #fff;
margin: 10px 0px;
}
.card-heading {
align-self: stretch;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
gap: var(--gap-base);
}
.today-icon {
height: 48px;
width: 48px;
position: relative;
overflow: hidden;
flex-shrink: 0;
display: none;
min-height: 48px;
}
.days {
position: relative;
line-height: 48px;
font-weight: 500;
}
.today-parent {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
gap: var(--gap-5xs);
}
.th-march {
position: relative;
line-height: 20px;
}
.date-highlight {
height: 20px;
width: 1px;
position: relative;
background-color: var(--sys-color-surface-hover);
}
.nordan-uk-ltd {
position: relative;
line-height: 20px;
}
.booking-details-child {
height: 20px;
width: 1px;
position: relative;
background-color: var(--sys-color-surface-hover);
display: none;
}
.onsite {
width: 43px;
position: relative;
line-height: 20px;
color: var(--sys-color-text-default);
display: none;
}
.booking-details,
.guide-info {
align-self: stretch;
display: flex;
align-items: flex-start;
gap: var(--gap-5xs);
}
.booking-details {
flex-direction: row;
justify-content: flex-start;
font-size: var(--body-macos-paragraph-small-size);
font-family: var(--body-macos-paragraph-normal);
}
.guide-info {
flex-direction: column;
justify-content: center;
}
.add-icon1 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
display: none;
}
.label1 {
position: relative;
font-size: var(--components-desktop-button-text-small-size);
line-height: 24px;
font-weight: 600;
font-family: var(--components-desktop-button-text-small);
color: var(--sys-color-text-default);
text-align: center;
}
.suffix-icon2 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.singular-button1 {
height: 33px;
border-radius: var(--br-31xl);
background-color: var(--text-on-accent);
border: 1px solid var(--sys-color-border-default1);
box-sizing: border-box;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-9xs) var(--padding-mini);
gap: var(--gap-5xs);
}
.add-icon2 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
display: none;
}
.label2 {
position: relative;
font-size: var(--components-desktop-button-text-small-size);
line-height: 24px;
font-weight: 600;
font-family: var(--components-desktop-button-text-small);
color: var(--sys-color-text-default);
text-align: center;
}
.suffix-icon3 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
display: none;
}
.singular-button2,
.view-button {
flex-direction: row;
align-items: center;
gap: var(--gap-5xs);
}
.singular-button2 {
height: 33px;
border-radius: var(--br-31xl);
background-color: var(--text-on-accent);
border: 1px solid var(--sys-color-border-default1);
box-sizing: border-box;
display: none;
justify-content: center;
padding: var(--padding-9xs) var(--padding-base);
}
.view-button {
cursor: pointer;
border: 0;
padding: 0;
background-color: transparent;
height: 32px;
display: flex;
justify-content: flex-start;
}
.card,
.card-content,
.next-booking {
display: flex;
align-items: flex-start;
}
.card-content {
align-self: stretch;
flex-direction: column;
justify-content: center;
gap: var(--gap-5xl);
font-size: var(--headings-macos-medium-h2-size);
}
.card,
.next-booking {
flex: 1;
justify-content: flex-start;
max-width: 100%;
}
.card {
border-radius: 0 var(--br-5xs) var(--br-5xs) 0;
background-color: var(--sys-color-text-default);
flex-direction: column;
padding: var(--padding-5xl);
box-sizing: border-box;
gap: var(--gap-base);
min-width: 130px;
}
.next-booking {
/* box-shadow: var(--shadow-md); */
flex-direction: row;
min-width: 384px;
row-gap: 20px;
}
.image-icon1 {
height: 224px;
width: 176px;
border-radius: var(--br-5xs) 0 0 var(--br-5xs);
object-fit: cover;
min-height: 224px;
}
.bookings1,
.user-guide {
position: relative;
line-height: 24px;
font-weight: 500;
}
.bookings1 {
width: 86px;
font-size: var(--components-desktop-button-text-small-size);
line-height: 20px;
font-family: var(--body-macos-paragraph-normal);
color: var(--sys-color-text-subdued);
display: none;
}
.card-heading1 {
align-self: stretch;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
gap: var(--gap-base);
}
.download-our-handy {
align-self: stretch;
height: 72px;
position: relative;
line-height: 24px;
display: inline-block;
}
.th-march1 {
position: relative;
line-height: 20px;
}
.frame-child {
height: 20px;
width: 1px;
position: relative;
background-color: var(--sys-color-surface-hover);
}
.nordan-uk-ltd1 {
position: relative;
line-height: 20px;
}
.frame-item,
.onsite1 {
position: relative;
display: none;
}
.frame-item {
height: 20px;
width: 1px;
background-color: var(--sys-color-surface-hover);
}
.onsite1 {
width: 43px;
line-height: 20px;
}
.download-our-handy-user-guide-parent,
.th-march-parent {
align-self: stretch;
align-items: flex-start;
gap: var(--gap-5xs);
}
.th-march-parent {
display: none;
flex-direction: row;
justify-content: flex-start;
font-size: var(--body-macos-paragraph-small-size);
color: var(--sys-color-text-default);
}
.download-our-handy-user-guide-parent {
display: flex;
flex-direction: column;
justify-content: center;
}
.add-icon3 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
display: none;
}
.label3 {
position: relative;
font-size: var(--components-desktop-button-text-small-size);
line-height: 24px;
font-weight: 600;
font-family: var(--components-desktop-button-text-small);
color: var(--sys-color-text-default);
text-align: center;
}
.file-download-icon1 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.card-content1,
.singular-button3 {
display: flex;
justify-content: center;
}
.singular-button3 {
cursor: pointer;
border: 1px solid var(--sys-color-border-default1);
padding: var(--padding-9xs) var(--padding-mini);
background-color: var(--text-on-accent);
border-radius: var(--br-31xl);
flex-direction: row;
align-items: center;
gap: var(--gap-5xs);
}
.card-content1 {
align-self: stretch;
flex-direction: column;
align-items: flex-start;
gap: var(--gap-5xl);
font-size: var(--components-desktop-button-text-small-size);
font-family: var(--body-macos-paragraph-normal);
}
.card1,
.next-booking1 {
flex: 1;
display: flex;
align-items: flex-start;
justify-content: flex-start;
max-width: 100%;
}
.card1 {
border-radius: 0 var(--br-5xs) var(--br-5xs) 0;
background-color: #3c2869;
flex-direction: column;
padding: var(--padding-5xl);
box-sizing: border-box;
gap: var(--gap-base);
min-width: 270px;
min-height: 224px;
}
.next-booking1 {
box-shadow: var(--shadow-md);
flex-direction: row;
min-width: 384px;
row-gap: 20px;
}
.header-sections,
.option-1 {
font-family: var(--components-desktop-button-text-small);
color: var(--text-on-accent);
}
.header-sections {
align-self: stretch;
display: flex;
flex-direction: row;
flex-wrap: wrap;
align-items: flex-start;
justify-content: flex-start;
padding: 0 0 var(--padding-7xs);
box-sizing: border-box;
gap: var(--gap-5xl);
max-width: 100%;
}
.option-1 {
position: relative;
font-size: var(--components-desktop-button-text-small-size);
line-height: 24px;
font-weight: 600;
text-align: center;
}
.active-filter,
.button-group-2-itemsselecte {
display: flex;
flex-direction: row;
align-items: flex-start;
justify-content: flex-start;
}
.active-filter {
height: 42px;
border-radius: var(--br-5xs) 0 0 var(--br-5xs);
background-color: var(--sys-color-action-primary-default);
border: 1px solid var(--sys-color-border-default1);
box-sizing: border-box;
padding: var(--padding-5xs) var(--padding-base);
}
.button-group-2-itemsselecte {
cursor: pointer;
border: 0;
padding: 0;
background-color: transparent;
height: 40px;
}
.option-2 {
position: relative;
font-size: var(--components-desktop-button-text-small-size);
line-height: 24px;
font-weight: 600;
font-family: var(--components-desktop-button-text-small);
color: var(--sys-color-text-default);
text-align: center;
}
.filter-options {
cursor: pointer;
border: 1px solid var(--sys-color-border-default1);
padding: var(--padding-5xs) var(--padding-base);
background-color: var(--text-on-accent);
height: 42px;
flex: 1;
box-sizing: border-box;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
}
.filter-options1:hover,
.filter-options:hover {
background-color: var(--color-gainsboro-100);
border: 1px solid var(--color-gray-100);
box-sizing: border-box;
}
.option-3 {
position: relative;
font-size: var(--components-desktop-button-text-small-size);
line-height: 24px;
font-weight: 600;
font-family: var(--components-desktop-button-text-small);
color: var(--sys-color-text-default);
text-align: center;
}
.filter-options1 {
cursor: pointer;
border: 1px solid var(--sys-color-border-default1);
padding: var(--padding-5xs) var(--padding-base);
background-color: var(--text-on-accent);
height: 42px;
border-radius: 0 var(--br-5xs) var(--br-5xs) 0;
box-sizing: border-box;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
}
.button-group-3-items {
width: 219px;
height: 40px;
display: flex;
flex-direction: row;
align-items: flex-start;
justify-content: flex-start;
}
.showing-1-10-of1 {
height: 20px;
flex: 1;
position: relative;
line-height: 20px;
display: inline-block;
min-width: 474px;
max-width: 100%;
}
.flag-icon1,
.prefix-icon1 {
position: relative;
display: none;
}
.flag-icon1 {
height: 24px;
width: var(--sys-sizing-icon-l);
object-fit: cover;
z-index: 0;
}
.prefix-icon1 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
overflow: hidden;
flex-shrink: 0;
z-index: 1;
}
.prefix-iconbutton-atom1 {
height: 24px;
width: 24px;
position: relative;
border-radius: var(--br-9xs);
z-index: 2;
}
.input-text1,
.search-text1 {
position: relative;
line-height: 24px;
align-items: center;
}
.input-text1 {
flex: 1;
display: flex;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
height: 32px;
z-index: 3;
}
.search-text1 {
align-self: stretch;
width: 58.5px;
color: var(--sys-color-text-default);
display: none;
z-index: 4;
}
.loading-animation-icon1 {
height: 24px;
width: 24px;
position: relative;
object-fit: cover;
display: none;
z-index: 5;
}
.suffix-icon4 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
display: none;
z-index: 6;
}
.suffix-iconbutton-atom2 {
height: 24px;
width: 24px;
z-index: 7;
}
.see-hide-password1,
.suffix-iconbutton-atom2,
.suffix-iconbutton-atom3 {
position: relative;
border-radius: var(--br-9xs);
display: none;
}
.suffix-iconbutton-atom3 {
height: 24px;
width: 24px;
z-index: 8;
}
.see-hide-password1 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
z-index: 9;
}
.focused-outline1 {
height: 100%;
width: 100%;
position: absolute;
margin: 0 !important;
top: -4px;
right: -4px;
bottom: -4px;
left: -4px;
border-radius: var(--br-4xs);
border: 2px solid var(--color-steelblue-100);
box-sizing: border-box;
display: none;
z-index: 10;
}
.field1,
.search1 {
display: flex;
justify-content: flex-start;
}
.field1 {
align-self: stretch;
height: 32px;
border-radius: var(--br-5xs);
background-color: var(--text-on-accent);
border: 1px solid var(--sys-color-border-default);
box-sizing: border-box;
flex-direction: row;
align-items: center;
padding: var(--padding-9xs) var(--padding-2xs);
position: relative;
gap: var(--gap-5xs);
}
.search1 {
width: 344px;
flex-direction: column;
align-items: flex-start;
max-width: 100%;
}
.file-download,
.filter-alt-icon1 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
min-height: 24px;
}
.file-download {
margin: 0;
}
.filter-alt-group {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-end;
gap: var(--gap-base);
}
.controls1,
.heading1 {
flex-direction: row;
align-items: center;
gap: var(--gap-5xl);
max-width: 100%;
}
.controls1 {
display: flex;
justify-content: flex-end;
font-size: var(--components-desktop-button-text-small-size);
color: var(--sys-color-text-subdued1);
}
.heading1 {
align-self: stretch;
display: none;
flex-wrap: wrap;
justify-content: flex-start;
}
.active-bookings {
margin: 0;
position: relative;
font-size: inherit;
line-height: 30px;
font-weight: 500;
font-family: inherit;
}
.card-heading-child {
height: 30px;
width: 1px;
position: relative;
background-color: var(--sys-color-surface-hover);
}
.bookings2 {
position: relative;
font-size: var(--components-desktop-button-text-small-size);
line-height: 20px;
font-weight: 500;
font-family: var(--body-macos-paragraph-normal);
color: var(--sys-color-text-subdued);
}
.card-heading2,
.start-date {
color: var(--sys-color-text-default);
display: flex;
align-items: center;
}
.card-heading2 {
flex-direction: row;
justify-content: flex-start;
gap: var(--gap-base);
font-size: var(--headings-macos-medium-h4-size);
font-family: var(--components-desktop-button-text-small);
}
.start-date {
width: 160px;
position: relative;
line-height: 20px;
flex-shrink: 0;
white-space: nowrap;
z-index: 0;
}
.column-titles,
.product,
.site,
.state,
.type,
.visible-for {
height: 24px;
position: relative;
line-height: 20px;
display: flex;
align-items: center;
}
.site {
flex: 1;
z-index: 1;
}
.column-titles,
.product,
.state,
.type,
.visible-for {
width: 80px;
flex-shrink: 0;
z-index: 2;
}
.column-titles,
.product,
.state,
.visible-for {
width: 104px;
z-index: 3;
}
.column-titles,
.state,
.visible-for {
width: 144px;
z-index: 4;
}
.column-titles,
.visible-for {
width: 80px;
white-space: nowrap;
z-index: 5;
}
.column-titles {
width: 104px;
z-index: 6;
}
.group-child,
.group-inner,
.group-item,
.rectangle-div {
position: absolute;
border-radius: var(--br-5xs);
background-color: var(--border-subdued);
width: 353px;
height: 19.2px;
display: none;
}
.group-inner,
.group-item,
.rectangle-div {
width: 174.8px;
}
.group-inner,
.rectangle-div {
width: 119.4px;
}
.rectangle-div {
width: 256px;
}
.rectangle-parent,
.table-header-inner {
position: absolute;
width: 0;
height: 0;
}
.table-header-inner {
margin: 0 !important;
top: 11%;
left: 6.11%;
z-index: 7;
}
.empty-cell,
.table-header {
display: flex;
align-items: center;
}
.table-header {
align-self: stretch;
background-color: var(--sys-color-surface-background);
border-bottom: 1px solid var(--sys-color-border-default1);
flex-direction: row;
flex-wrap: wrap;
justify-content: flex-start;
padding: var(--padding-5xs) var(--padding-base);
position: sticky;
gap: 0 32px;
top: 0;
z-index: 99;
}
.empty-cell {
width: 160px;
position: relative;
line-height: 20px;
font-weight: 500;
color: var(--sys-color-text-default);
flex-shrink: 0;
}
.nordan-uk-ltd2 {
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
min-width: 88px;
}
.onsite2 {
position: absolute;
height: 100%;
width: 100%;
top: 0;
left: 0;
line-height: 24px;
display: flex;
align-items: center;
}
.booking-type {
height: 24px;
width: 80px;
position: relative;
color: var(--sys-color-text-default);
}
.iso-45001,
.scheduled {
line-height: 24px;
display: flex;
align-items: center;
}
.iso-45001 {
width: 104px;
position: relative;
flex-shrink: 0;
}
.scheduled {
position: absolute;
height: 100%;
width: 100%;
top: 0;
left: 0;
}
.booking-status {
height: 24px;
width: 144px;
position: relative;
color: var(--sys-color-text-default);
}
.days1,
.manage-booking {
position: relative;
line-height: 24px;
align-items: center;
flex-shrink: 0;
}
.days1 {
width: 80px;
display: flex;
}
.manage-booking {
width: 160px;
text-align: right;
display: none;
}
.prefix-icon2 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
display: none;
min-height: 24px;
}
.label4 {
position: relative;
font-size: var(--components-desktop-button-text-small-size);
line-height: 24px;
font-weight: 600;
font-family: var(--components-desktop-button-text-small);
color: var(--sys-color-text-default);
text-align: center;
}
.chevron-right-icon1 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
min-height: 24px;
}
.singular-button4 {
border-radius: var(--br-31xl);
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-9xs) var(--padding-lg);
gap: var(--gap-5xs);
}
.action-cells {
cursor: pointer;
border: 0;
padding: 0;
background-color: transparent;
flex-direction: column;
justify-content: flex-start;
}
.action-cells,
.booking-row,
.div {
display: flex;
align-items: center;
}
.booking-row {
align-self: stretch;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-default1);
flex-direction: row;
flex-wrap: wrap;
justify-content: flex-start;
padding: var(--padding-5xl) var(--padding-base);
gap: var(--gap-13xl);
}
.div {
width: 160px;
position: relative;
line-height: 20px;
font-weight: 500;
color: var(--sys-color-text-default);
flex-shrink: 0;
white-space: nowrap;
}
.nordan-uk-ltd3 {
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
min-width: 40px;
}
.onsite3 {
position: absolute;
height: 100%;
width: 100%;
top: 0;
left: 0;
line-height: 24px;
display: flex;
align-items: center;
}
.booking-type1 {
height: 24px;
width: 80px;
position: relative;
color: var(--sys-color-text-default);
}
.iso-450011,
.scheduled1 {
line-height: 24px;
display: flex;
align-items: center;
}
.iso-450011 {
width: 104px;
position: relative;
flex-shrink: 0;
}
.scheduled1 {
position: absolute;
height: 100%;
width: 100%;
top: 0;
left: 0;
}
.booking-status1 {
height: 24px;
width: 144px;
position: relative;
color: var(--sys-color-text-default);
}
.days2,
.manage-booking1 {
position: relative;
line-height: 24px;
align-items: center;
flex-shrink: 0;
}
.days2 {
width: 80px;
display: flex;
}
.manage-booking1 {
width: 160px;
text-align: right;
display: none;
}
.prefix-icon3 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
display: none;
min-height: 24px;
}
.label5 {
position: relative;
font-size: var(--components-desktop-button-text-small-size);
line-height: 24px;
font-weight: 600;
font-family: var(--components-desktop-button-text-small);
color: var(--sys-color-text-default);
text-align: center;
}
.chevron-right-icon2 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
min-height: 24px;
}
.singular-button5 {
border-radius: var(--br-31xl);
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-9xs) var(--padding-lg);
gap: var(--gap-5xs);
}
.singular-button-wrapper {
cursor: pointer;
border: 0;
padding: 0;
background-color: transparent;
flex-direction: column;
justify-content: flex-start;
}
.booking-row1,
.div1,
.singular-button-wrapper {
display: flex;
align-items: center;
}
.booking-row1 {
align-self: stretch;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-default1);
flex-direction: row;
flex-wrap: wrap;
justify-content: flex-start;
padding: var(--padding-5xl) var(--padding-base);
gap: var(--gap-13xl);
}
.div1 {
width: 160px;
position: relative;
line-height: 20px;
font-weight: 500;
color: var(--sys-color-text-default);
flex-shrink: 0;
white-space: nowrap;
}
.nordan-uk-ltd4 {
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
min-width: 41px;
}
.onsite4 {
position: absolute;
height: 100%;
width: 100%;
top: 0;
left: 0;
line-height: 24px;
display: flex;
align-items: center;
}
.booking-type2 {
height: 24px;
width: 80px;
position: relative;
color: var(--sys-color-text-default);
}
.change-requested,
.iso-450012 {
line-height: 24px;
display: flex;
align-items: center;
}
.iso-450012 {
width: 104px;
position: relative;
flex-shrink: 0;
}
.change-requested {
position: absolute;
height: 100%;
width: 180%;
top: 0;
left: 0;
}
.booking-status2 {
height: 24px;
width: 144px;
position: relative;
color: var(--sys-color-text-default);
}
.days3,
.manage-booking2 {
position: relative;
line-height: 24px;
align-items: center;
flex-shrink: 0;
}
.days3 {
width: 80px;
display: flex;
}
.manage-booking2 {
width: 160px;
text-align: right;
display: none;
}
.prefix-icon4 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
display: none;
min-height: 24px;
}
.label6 {
position: relative;
font-size: var(--components-desktop-button-text-small-size);
line-height: 24px;
font-weight: 600;
font-family: var(--components-desktop-button-text-small);
color: var(--sys-color-text-default);
text-align: center;
}
.chevron-right-icon3 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
min-height: 24px;
}
.singular-button6 {
border-radius: var(--br-31xl);
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-9xs) var(--padding-lg);
gap: var(--gap-5xs);
}
.singular-button-container {
cursor: pointer;
border: 0;
padding: 0;
background-color: transparent;
flex-direction: column;
justify-content: flex-start;
}
.booking-row2,
.div2,
.singular-button-container {
display: flex;
align-items: center;
}
.booking-row2 {
align-self: stretch;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-default1);
flex-direction: row;
flex-wrap: wrap;
justify-content: flex-start;
padding: var(--padding-5xl) var(--padding-base);
gap: var(--gap-13xl);
}
.div2 {
width: 160px;
position: relative;
line-height: 20px;
font-weight: 500;
color: var(--sys-color-text-default);
flex-shrink: 0;
white-space: nowrap;
}
.nordan-uk-ltd5 {
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
min-width: 47px;
}
.onsite5 {
position: absolute;
height: 100%;
width: 100%;
top: 0;
left: 0;
line-height: 24px;
display: flex;
align-items: center;
}
.booking-type3 {
height: 24px;
width: 80px;
position: relative;
color: var(--sys-color-text-default);
}
.iso-450013,
.scheduled2 {
line-height: 24px;
display: flex;
align-items: center;
}
.iso-450013 {
width: 104px;
position: relative;
flex-shrink: 0;
}
.scheduled2 {
position: absolute;
height: 100%;
width: 100%;
top: 0;
left: 0;
}
.booking-status3 {
height: 24px;
width: 144px;
position: relative;
color: var(--sys-color-text-default);
}
.days4,
.manage-booking3 {
position: relative;
line-height: 24px;
align-items: center;
flex-shrink: 0;
}
.days4 {
width: 80px;
display: flex;
}
.manage-booking3 {
width: 160px;
text-align: right;
display: none;
}
.prefix-icon5 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
display: none;
min-height: 24px;
}
.label7 {
position: relative;
font-size: var(--components-desktop-button-text-small-size);
line-height: 24px;
font-weight: 600;
font-family: var(--components-desktop-button-text-small);
color: var(--sys-color-text-default);
text-align: center;
}
.chevron-right-icon4 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
min-height: 24px;
}
.singular-button7 {
border-radius: var(--br-31xl);
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-9xs) var(--padding-lg);
gap: var(--gap-5xs);
}
.singular-button-frame {
cursor: pointer;
border: 0;
padding: 0;
background-color: transparent;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
}
.booking-row3,
.table-rows {
align-self: stretch;
display: flex;
justify-content: flex-start;
}
.booking-row3 {
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-default1);
flex-direction: row;
flex-wrap: wrap;
align-items: center;
padding: var(--padding-5xl) var(--padding-base);
gap: var(--gap-13xl);
}
.table-rows {
flex-direction: column;
align-items: flex-start;
font-size: var(--components-desktop-button-text-small-size);
}
.showing-1-4-of {
width: 168px;
position: relative;
line-height: 20px;
display: flex;
align-items: center;
flex-shrink: 0;
}
.first-page-icon {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
min-height: 24px;
}
.chevron-left-icon,
.chevron-right-icon5 {
overflow: hidden;
flex-shrink: 0;
}
.chevron-left-icon,
.chevron-right-icon5,
.last-page-icon {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
min-height: 24px;
}
.icons {
flex: 1;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-end;
gap: var(--gap-base);
min-width: 96px;
max-width: 100%;
}
.table-footer,
.table2 {
align-self: stretch;
display: flex;
justify-content: flex-start;
max-width: 100%;
}
.table-footer {
background-color: var(--text-on-accent);
flex-direction: row;
flex-wrap: wrap;
align-items: center;
padding: var(--padding-5xl) 0 var(--padding-base);
box-sizing: border-box;
gap: var(--gap-29xl);
color: var(--sys-color-text-subdued);
}
.table2 {
flex-direction: column;
align-items: flex-start;
color: var(--text-default);
}
.table1 {
border-radius: var(--br-5xs);
background-color: var(--text-on-accent);
box-shadow: 0 4px 8px -2px rgba(16, 24, 40, 0.1),
0 2px 4px -2px rgba(16, 24, 40, 0.06);
padding: var(--padding-5xl);
box-sizing: border-box;
gap: var(--gap-13xl);
}
.table1,
.upcoming {
align-self: stretch;
display: flex;
flex-direction: column;
align-items: flex-start;
justify-content: flex-start;
max-width: 100%;
}
.showing-1-10-of2 {
height: 20px;
flex: 1;
position: relative;
line-height: 20px;
display: inline-block;
min-width: 474px;
max-width: 100%;
}
.flag-icon2,
.prefix-icon6 {
position: relative;
display: none;
}
.flag-icon2 {
height: 24px;
width: var(--sys-sizing-icon-l);
object-fit: cover;
z-index: 0;
}
.prefix-icon6 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
overflow: hidden;
flex-shrink: 0;
z-index: 1;
}
.prefix-iconbutton-atom2 {
height: 24px;
width: 24px;
position: relative;
border-radius: var(--br-9xs);
z-index: 2;
}
.input-text2,
.search-text2 {
position: relative;
line-height: 24px;
align-items: center;
}
.input-text2 {
flex: 1;
display: flex;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
height: 32px;
z-index: 3;
}
.search-text2 {
align-self: stretch;
width: 58.5px;
color: var(--sys-color-text-default);
display: none;
z-index: 4;
}
.loading-animation-icon2 {
height: 24px;
width: 24px;
position: relative;
object-fit: cover;
display: none;
z-index: 5;
}
.suffix-icon5 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
display: none;
z-index: 6;
}
.suffix-iconbutton-atom4 {
height: 24px;
width: 24px;
z-index: 7;
}
.see-hide-password2,
.suffix-iconbutton-atom4,
.suffix-iconbutton-atom5 {
position: relative;
border-radius: var(--br-9xs);
display: none;
}
.suffix-iconbutton-atom5 {
height: 24px;
width: 24px;
z-index: 8;
}
.see-hide-password2 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
z-index: 9;
}
.focused-outline2 {
height: 100%;
width: 100%;
position: absolute;
margin: 0 !important;
top: -4px;
right: -4px;
bottom: -4px;
left: -4px;
border-radius: var(--br-4xs);
border: 2px solid var(--color-steelblue-100);
box-sizing: border-box;
display: none;
z-index: 10;
}
.field2,
.search2 {
display: flex;
justify-content: flex-start;
}
.field2 {
align-self: stretch;
height: 32px;
border-radius: var(--br-5xs);
background-color: var(--text-on-accent);
border: 1px solid var(--sys-color-border-default);
box-sizing: border-box;
flex-direction: row;
align-items: center;
padding: var(--padding-9xs) var(--padding-2xs);
position: relative;
gap: var(--gap-5xs);
}
.search2 {
width: 344px;
flex-direction: column;
align-items: flex-start;
max-width: 100%;
}
.file-download1,
.filter-alt-icon2 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
min-height: 24px;
}
.file-download1 {
margin: 0;
}
.filter-alt-container {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-end;
gap: var(--gap-base);
}
.controls2,
.heading2 {
flex-direction: row;
align-items: center;
gap: var(--gap-5xl);
max-width: 100%;
}
.controls2 {
display: flex;
justify-content: flex-end;
font-size: var(--components-desktop-button-text-small-size);
color: var(--sys-color-text-subdued1);
}
.heading2 {
align-self: stretch;
display: none;
flex-wrap: wrap;
justify-content: flex-start;
}
.historical-bookings {
margin: 0;
position: relative;
font-size: inherit;
line-height: 30px;
font-weight: 500;
font-family: inherit;
}
.title-bar {
height: 30px;
width: 1px;
position: relative;
background-color: var(--sys-color-surface-hover);
}
.bookings3 {
position: relative;
font-size: var(--components-desktop-button-text-small-size);
line-height: 20px;
font-weight: 500;
font-family: var(--body-macos-paragraph-normal);
color: var(--sys-color-text-subdued);
}
.card-heading3,
.start-date1 {
color: var(--sys-color-text-default);
display: flex;
align-items: center;
}
.card-heading3 {
flex-direction: row;
justify-content: flex-start;
gap: var(--gap-base);
max-width: 100%;
font-size: var(--headings-macos-medium-h4-size);
font-family: var(--components-desktop-button-text-small);
}
.start-date1 {
width: 160px;
position: relative;
line-height: 20px;
flex-shrink: 0;
z-index: 0;
}
.column-labels,
.product1,
.site1,
.state1,
.type1,
.visible-for1 {
height: 24px;
position: relative;
line-height: 20px;
display: flex;
align-items: center;
}
.site1 {
flex: 1;
min-width: 105px;
z-index: 1;
}
.column-labels,
.product1,
.state1,
.type1,
.visible-for1 {
width: 80px;
flex-shrink: 0;
z-index: 2;
}
.column-labels,
.product1,
.state1,
.visible-for1 {
width: 104px;
z-index: 3;
}
.column-labels,
.state1,
.visible-for1 {
width: 144px;
z-index: 4;
}
.column-labels,
.visible-for1 {
width: 80px;
z-index: 5;
}
.column-labels {
width: 104px;
z-index: 6;
}
.group-child1,
.group-child2,
.group-child3,
.group-child4 {
position: absolute;
border-radius: var(--br-5xs);
background-color: var(--border-subdued);
width: 353px;
height: 19.2px;
display: none;
}
.group-child2,
.group-child3,
.group-child4 {
width: 174.8px;
}
.group-child3,
.group-child4 {
width: 119.4px;
}
.group-child4 {
width: 256px;
}
.rectangle-group,
.table-header-child {
position: absolute;
width: 0;
height: 0;
}
.table-header-child {
margin: 0 !important;
top: 11%;
left: 6.11%;
z-index: 7;
}
.empty-cells,
.table-header1 {
position: relative;
display: flex;
align-items: center;
}
.table-header1 {
align-self: stretch;
background-color: var(--sys-color-surface-background);
border-bottom: 1px solid var(--sys-color-border-default1);
flex-direction: row;
flex-wrap: wrap;
justify-content: flex-start;
padding: var(--padding-5xs) var(--padding-base);
gap: 0 32px;
}
.empty-cells {
width: 160px;
line-height: 20px;
font-weight: 500;
color: var(--sys-color-text-default);
flex-shrink: 0;
}
.nordan-uk-ltd6 {
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
min-width: 88px;
}
.onsite6 {
position: absolute;
height: 100%;
width: 100%;
top: 0;
left: 0;
line-height: 24px;
display: flex;
align-items: center;
}
.booking-type4 {
height: 24px;
width: 80px;
position: relative;
color: var(--sys-color-text-default);
}
.iso-450014,
.scheduled3 {
line-height: 24px;
display: flex;
align-items: center;
}
.iso-450014 {
width: 104px;
position: relative;
flex-shrink: 0;
}
.scheduled3 {
position: absolute;
height: 100%;
width: 100%;
top: 0;
left: 0;
}
.booking-status4 {
height: 24px;
width: 144px;
position: relative;
color: var(--sys-color-text-default);
}
.days5,
.manage-booking4 {
position: relative;
line-height: 24px;
align-items: center;
flex-shrink: 0;
}
.days5 {
width: 80px;
display: flex;
}
.manage-booking4 {
width: 160px;
text-align: right;
display: none;
}
.prefix-icon7 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
display: none;
min-height: 24px;
}
.label8 {
position: relative;
font-size: var(--components-desktop-button-text-small-size);
line-height: 24px;
font-weight: 600;
font-family: var(--components-desktop-button-text-small);
color: var(--sys-color-text-default);
text-align: center;
}
.chevron-right-icon6 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
min-height: 24px;
}
.singular-button8 {
border-radius: var(--br-31xl);
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-9xs) var(--padding-lg);
gap: var(--gap-5xs);
}
.past-booking-actions {
cursor: pointer;
border: 0;
padding: 0;
background-color: transparent;
flex-direction: column;
justify-content: flex-start;
}
.booking-row4,
.div3,
.past-booking-actions {
display: flex;
align-items: center;
}
.booking-row4 {
align-self: stretch;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-default1);
flex-direction: row;
flex-wrap: wrap;
justify-content: flex-start;
padding: var(--padding-5xl) var(--padding-base);
gap: var(--gap-13xl);
}
.div3 {
width: 160px;
position: relative;
line-height: 20px;
font-weight: 500;
color: var(--sys-color-text-default);
flex-shrink: 0;
}
.nordan-uk-ltd7 {
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
min-width: 88px;
}
.onsite7 {
position: absolute;
height: 100%;
width: 100%;
top: 0;
left: 0;
line-height: 24px;
display: flex;
align-items: center;
}
.booking-type5 {
height: 24px;
width: 80px;
position: relative;
color: var(--sys-color-text-default);
}
.iso-450015,
.scheduled4 {
line-height: 24px;
display: flex;
align-items: center;
}
.iso-450015 {
width: 104px;
position: relative;
flex-shrink: 0;
}
.scheduled4 {
position: absolute;
height: 100%;
width: 100%;
top: 0;
left: 0;
}
.booking-status5 {
height: 24px;
width: 144px;
position: relative;
color: var(--sys-color-text-default);
}
.days6,
.manage-booking5 {
position: relative;
line-height: 24px;
align-items: center;
flex-shrink: 0;
}
.days6 {
width: 80px;
display: flex;
}
.manage-booking5 {
width: 160px;
text-align: right;
display: none;
}
.prefix-icon8 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
display: none;
min-height: 24px;
}
.label9 {
position: relative;
font-size: var(--components-desktop-button-text-small-size);
line-height: 24px;
font-weight: 600;
font-family: var(--components-desktop-button-text-small);
color: var(--sys-color-text-default);
text-align: center;
}
.chevron-right-icon7 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
min-height: 24px;
}
.singular-button9 {
border-radius: var(--br-31xl);
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-9xs) var(--padding-lg);
gap: var(--gap-5xs);
}
.frame-button {
cursor: pointer;
border: 0;
padding: 0;
background-color: transparent;
flex-direction: column;
justify-content: flex-start;
}
.booking-row5,
.div4,
.frame-button {
display: flex;
align-items: center;
}
.booking-row5 {
align-self: stretch;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-default1);
flex-direction: row;
flex-wrap: wrap;
justify-content: flex-start;
padding: var(--padding-5xl) var(--padding-base);
gap: var(--gap-13xl);
}
.div4 {
width: 160px;
position: relative;
line-height: 20px;
font-weight: 500;
color: var(--sys-color-text-default);
flex-shrink: 0;
}
.nordan-uk-ltd8 {
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
min-width: 88px;
}
.onsite8 {
position: absolute;
height: 100%;
width: 100%;
top: 0;
left: 0;
line-height: 24px;
display: flex;
align-items: center;
}
.booking-type6 {
height: 24px;
width: 80px;
position: relative;
color: var(--sys-color-text-default);
}
.iso-450016,
.scheduled5 {
line-height: 24px;
display: flex;
align-items: center;
}
.iso-450016 {
width: 104px;
position: relative;
flex-shrink: 0;
}
.scheduled5 {
position: absolute;
height: 100%;
width: 100%;
top: 0;
left: 0;
}
.booking-status6 {
height: 24px;
width: 144px;
position: relative;
color: var(--sys-color-text-default);
}
.days7,
.manage-booking6 {
position: relative;
line-height: 24px;
align-items: center;
flex-shrink: 0;
}
.days7 {
width: 80px;
display: flex;
}
.manage-booking6 {
width: 160px;
text-align: right;
display: none;
}
.prefix-icon9 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
display: none;
min-height: 24px;
}
.label10 {
position: relative;
font-size: var(--components-desktop-button-text-small-size);
line-height: 24px;
font-weight: 600;
font-family: var(--components-desktop-button-text-small);
color: var(--sys-color-text-default);
text-align: center;
}
.chevron-right-icon8 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
min-height: 24px;
}
.singular-button10 {
border-radius: var(--br-31xl);
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-9xs) var(--padding-lg);
gap: var(--gap-5xs);
}
.singular-button-wrapper1 {
cursor: pointer;
border: 0;
padding: 0;
background-color: transparent;
flex-direction: column;
justify-content: flex-start;
}
.booking-row6,
.div5,
.singular-button-wrapper1 {
display: flex;
align-items: center;
}
.booking-row6 {
align-self: stretch;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-default1);
flex-direction: row;
flex-wrap: wrap;
justify-content: flex-start;
padding: var(--padding-5xl) var(--padding-base);
gap: var(--gap-13xl);
}
.div5 {
width: 160px;
position: relative;
line-height: 20px;
font-weight: 500;
color: var(--sys-color-text-default);
flex-shrink: 0;
}
.nordan-uk-ltd9 {
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
min-width: 88px;
}
.onsite9 {
position: absolute;
height: 100%;
width: 100%;
top: 0;
left: 0;
line-height: 24px;
display: flex;
align-items: center;
}
.booking-type7 {
height: 24px;
width: 80px;
position: relative;
color: var(--sys-color-text-default);
}
.iso-450017,
.scheduled6 {
line-height: 24px;
display: flex;
align-items: center;
}
.iso-450017 {
width: 104px;
position: relative;
flex-shrink: 0;
}
.scheduled6 {
position: absolute;
height: 100%;
width: 100%;
top: 0;
left: 0;
}
.booking-status7 {
height: 24px;
width: 144px;
position: relative;
color: var(--sys-color-text-default);
}
.days8,
.manage-booking7 {
position: relative;
line-height: 24px;
align-items: center;
flex-shrink: 0;
}
.days8 {
width: 80px;
display: flex;
}
.manage-booking7 {
width: 160px;
text-align: right;
display: none;
}
.prefix-icon10 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
display: none;
min-height: 24px;
}
.label11 {
position: relative;
font-size: var(--components-desktop-button-text-small-size);
line-height: 24px;
font-weight: 600;
font-family: var(--components-desktop-button-text-small);
color: var(--sys-color-text-default);
text-align: center;
}
.chevron-right-icon9 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
min-height: 24px;
}
.singular-button11 {
border-radius: var(--br-31xl);
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-9xs) var(--padding-lg);
gap: var(--gap-5xs);
}
.singular-button-wrapper2 {
cursor: pointer;
border: 0;
padding: 0;
background-color: transparent;
flex-direction: column;
justify-content: flex-start;
}
.booking-row7,
.div6,
.singular-button-wrapper2 {
display: flex;
align-items: center;
}
.booking-row7 {
align-self: stretch;
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-default1);
flex-direction: row;
flex-wrap: wrap;
justify-content: flex-start;
padding: var(--padding-5xl) var(--padding-base);
gap: var(--gap-13xl);
}
.div6 {
width: 160px;
position: relative;
line-height: 20px;
font-weight: 500;
color: var(--sys-color-text-default);
flex-shrink: 0;
}
.nordan-uk-ltd10 {
flex: 1;
position: relative;
line-height: 24px;
display: inline-block;
min-width: 88px;
}
.onsite10 {
position: absolute;
height: 100%;
width: 100%;
top: 0;
left: 0;
line-height: 24px;
display: flex;
align-items: center;
}
.booking-type8 {
height: 24px;
width: 80px;
position: relative;
color: var(--sys-color-text-default);
}
.iso-450018,
.scheduled7 {
line-height: 24px;
display: flex;
align-items: center;
}
.iso-450018 {
width: 104px;
position: relative;
flex-shrink: 0;
}
.scheduled7 {
position: absolute;
height: 100%;
width: 100%;
top: 0;
left: 0;
}
.booking-status8 {
height: 24px;
width: 144px;
position: relative;
color: var(--sys-color-text-default);
}
.days9,
.manage-booking8 {
position: relative;
line-height: 24px;
align-items: center;
flex-shrink: 0;
}
.days9 {
width: 80px;
display: flex;
}
.manage-booking8 {
width: 160px;
text-align: right;
display: none;
}
.prefix-icon11 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
display: none;
min-height: 24px;
}
.label12 {
position: relative;
font-size: var(--components-desktop-button-text-small-size);
line-height: 24px;
font-weight: 600;
font-family: var(--components-desktop-button-text-small);
color: var(--sys-color-text-default);
text-align: center;
}
.chevron-right-icon10 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
min-height: 24px;
}
.singular-button12 {
border-radius: var(--br-31xl);
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-9xs) var(--padding-lg);
gap: var(--gap-5xs);
}
.singular-button-wrapper3 {
cursor: pointer;
border: 0;
padding: 0;
background-color: transparent;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
}
.booking-row8,
.table-rows1 {
align-self: stretch;
display: flex;
justify-content: flex-start;
}
.booking-row8 {
background-color: var(--text-on-accent);
border-bottom: 1px solid var(--sys-color-border-default1);
flex-direction: row;
flex-wrap: wrap;
align-items: center;
padding: var(--padding-5xl) var(--padding-base);
gap: var(--gap-13xl);
}
.table-rows1 {
flex-direction: column;
align-items: flex-start;
font-size: var(--components-desktop-button-text-small-size);
}
.showing-1-5-of {
width: 168px;
position: relative;
line-height: 20px;
display: flex;
align-items: center;
flex-shrink: 0;
}
.first-page-icon1 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
min-height: 24px;
}
.chevron-left-icon1,
.chevron-right-icon11 {
overflow: hidden;
flex-shrink: 0;
}
.chevron-left-icon1,
.chevron-right-icon11,
.last-page-icon1 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
min-height: 24px;
}
.icons1 {
flex: 1;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-end;
gap: var(--gap-base);
min-width: 96px;
max-width: 100%;
}
.table-footer1,
.table3,
.table4 {
display: flex;
justify-content: flex-start;
max-width: 100%;
}
.table-footer1 {
align-self: stretch;
background-color: var(--text-on-accent);
flex-direction: row;
flex-wrap: wrap;
align-items: center;
padding: var(--padding-5xl) 0 var(--padding-base);
box-sizing: border-box;
gap: var(--gap-29xl);
color: var(--sys-color-text-subdued);
}
.table3,
.table4 {
flex-direction: column;
align-items: flex-start;
}
.table4 {
align-self: stretch;
color: var(--text-default);
}
.table3 {
border-radius: var(--br-5xs);
background-color: var(--text-on-accent);
box-shadow: 0 4px 8px -2px rgba(16, 24, 40, 0.1),
0 2px 4px -2px rgba(16, 24, 40, 0.06);
padding: var(--padding-5xl);
box-sizing: border-box;
gap: var(--gap-13xl);
}
.past,
.table3 {
align-self: stretch;
}
.dashboard-page.content,
.past,
.tables {
display: flex;
flex-direction: column;
align-items: flex-start;
justify-content: flex-start;
max-width: 100%;
}
.tables {
align-self: stretch;
gap: var(--gap-5xl);
font-size: var(--body-macos-paragraph-small-size);
color: var(--sys-color-text-subdued);
}
.main-content {
/* margin-top: 65px; */
}
.dashboard-page.content {
/* height: 100vh; */
/* position: absolute; */
left: 0px;
/* margin-left: 320px; */
box-sizing: border-box;
/* gap: var(--gap-13xl); */
text-align: left;
font-family: var(--body-macos-paragraph-normal);
padding: 55px 0;
}
.isoqar-full-colour-1-1 {
height: 40px;
width: 131px;
position: relative;
object-fit: cover;
}
.logo {
height: 36.5px;
flex: 1;
position: relative;
min-width: 335px;
max-width: 100%;
}
.single-select {
position: absolute;
top: 0;
left: 113px;
border-radius: var(--br-5xs);
background-color: var(--text-on-accent);
border: 1px solid var(--sys-color-border-default);
box-sizing: border-box;
width: 259px;
height: 40px;
display: flex;
flex-direction: column;
align-items: flex-start;
justify-content: flex-start;
padding: var(--padding-9xs) var(--padding-2xs);
font-family: var(--body-macos-paragraph-normal);
font-size: var(--components-desktop-button-text-small-size);
color: var(--sys-color-text-default);
}
.organisation {
position: absolute;
top: 8px;
left: 0;
line-height: 24px;
}
.ellipse-icon {
position: absolute;
height: 60%;
width: 6.45%;
top: 20%;
right: 61.02%;
bottom: 20%;
left: 32.53%;
border-radius: 50%;
max-width: 100%;
overflow: hidden;
max-height: 100%;
object-fit: cover;
display: none;
}
.single-select-parent {
height: 40px;
width: 372px;
position: relative;
max-width: 100%;
}
.apps-icon,
.notifications-icon,
.settings-icon {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
}
.notifications-icon {
overflow: hidden;
flex-shrink: 0;
z-index: 0;
}
.apps-icon,
.settings-icon {
display: none;
}
.settings-icon {
overflow: hidden;
flex-shrink: 0;
z-index: 1;
}
.apps-icon {
z-index: 2;
}
.avatar-icon {
height: 32px;
width: 32px;
position: relative;
border-radius: 50%;
object-fit: cover;
z-index: 3;
}
.avatar-background {
height: 8px;
width: 8px;
position: absolute;
margin: 0 !important;
top: 5px;
left: 15px;
border-radius: 50%;
background-color: var(--sys-color-semantic-critical);
z-index: 4;
}
.icons2 {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
position: relative;
gap: var(--gap-base);
}
.top-menu-child {
height: 36px;
width: 1px;
position: relative;
background-color: #d9d9d9;
display: none;
}
.top-menu-item {
height: 1px;
width: 1366px;
position: relative;
background-color: var(--border-subdued);
display: none;
max-width: 100%;
}
.top-menu {
z-index: 1000;
position: absolute;
top: 0;
left: 0;
background-color: var(--text-on-accent);
border-bottom: 1px solid #cdcdcd;
box-sizing: border-box;
width: 100%;
overflow: hidden;
display: flex;
flex-direction: row;
flex-wrap: wrap;
align-items: center;
justify-content: flex-start;
padding: 0 34px;
gap: 12px 24px;
min-height: 64px;
max-width: 100%;
text-align: left;
font-size: var(--components-desktop-button-text-small-size);
color: var(--sys-color-text-default);
font-family: var(--body-macos-paragraph-normal);
}
.home-icon {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.menu-home {
background-color: var(--text-on-accent);
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-xs) var(--padding-xl);
cursor: pointer;
}
.assetsitemscollapsed {
height: 48px;
width: 4px;
background-color: var(--sys-color-action-primary-default);
border-right: 1px solid var(--text-on-accent);
box-sizing: border-box;
}
.today-icon1 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.assetsitemscollapsed1 {
cursor: pointer;
border: 0;
padding: var(--padding-xs) 0;
background-color: var(--sys-color-surface-selected);
flex: 1;
border-radius: 0 var(--br-9xs) var(--br-9xs) 0;
border-left: 2px solid var(--text-on-accent);
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
}
.menu-bookings {
align-self: stretch;
display: flex;
flex-direction: row;
align-items: flex-start;
justify-content: flex-start;
padding: 0 var(--padding-9xs) 0 0;
}
.inventory-icon {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.menu-audits {
background-color: var(--text-on-accent);
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-xs) var(--padding-xl);
cursor: pointer;
}
.warning-attention-icon {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.menu {
background-color: var(--text-on-accent);
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-xs) var(--padding-xl);
cursor: pointer;
}
.fact-check-icon {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.menu-registrations {
background-color: var(--text-on-accent);
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-xs) var(--padding-xl);
cursor: pointer;
}
.fact-check-icon1 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.menu-invoices {
background-color: var(--text-on-accent);
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-xs) var(--padding-xl);
cursor: pointer;
}
.gpp-good-icon1 {
height: 24px;
width: 24px;
position: relative;
}
.menu-certificates {
background-color: var(--text-on-accent);
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-xs) var(--padding-xl);
cursor: pointer;
}
.school-icon {
height: 24px;
width: 24px;
position: relative;
}
.menu1 {
background-color: var(--text-on-accent);
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-xs) var(--padding-xl);
cursor: pointer;
}
.assetsside-navigationcollaps {
align-self: stretch;
flex: 1;
display: flex;
flex-direction: column;
align-items: flex-start;
justify-content: flex-start;
padding: var(--padding-base) 0 0;
}
.expand-child {
align-self: stretch;
height: 1px;
position: relative;
background-color: var(--border-subdued);
}
.keyboard-double-arrow-left-icon {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
object-fit: contain;
}
.keyboard-double-arrow-left-wrapper {
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-5xl) var(--padding-xl);
}
.expand {
align-self: stretch;
display: none;
flex-direction: column;
align-items: center;
justify-content: flex-end;
}
.side-navigationcollapsed {
align-self: stretch;
flex: 1;
background-color: var(--text-on-accent);
box-shadow: var(--shadow-md);
}
.left-hand-nav,
.navigation-list,
.side-navigationcollapsed {
display: flex;
flex-direction: column;
align-items: flex-start;
justify-content: flex-start;
}
.navigation-list {
align-self: stretch;
flex: 1;
}
.left-hand-nav {
position: absolute;
top: 64px;
left: 0;
border-right: 1px solid var(--sys-color-border-hover);
box-sizing: border-box;
height: 1860px;
}
.url-controls-bg {
position: absolute;
height: 100%;
width: 100%;
top: 0;
right: 0;
bottom: 0;
left: 0;
background-color: var(--text-on-accent);
box-shadow: 0-1px 0#dadce0 inset;
}
.right-locked-icons {
position: absolute;
top: calc(50% - 11px);
right: 14px;
width: 51px;
height: 22px;
overflow: hidden;
object-fit: contain;
}
.url-fill-bg {
position: absolute;
width: 100%;
top: calc(50% - 14px);
right: 0;
left: 0;
border-radius: 14px;
background-color: #f1f3f4;
height: 100%;
}
.icon-favorite {
position: absolute;
top: calc(50% - 8px);
right: 10px;
width: 16px;
height: 16px;
object-fit: cover;
}
.domaincom,
.subdomain {
align-self: stretch;
position: relative;
letter-spacing: 0.25px;
display: flex;
align-items: center;
}
.domaincom-parent {
position: absolute;
top: 0;
left: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
}
.wrapper {
padding: 0px 32px;
display: grid;
grid-auto-flow: dense;
grid-template-columns: repeat(auto-fill, minmax(1000px, 1fr));
grid-auto-rows: 181px;
grid-gap: 20px;
}
.icon-secure,
.url-text {
position: absolute;
top: calc(50% - 8px);
left: 33px;
width: 165px;
height: 16px;
}
.icon-secure {
top: calc(50% - 6px);
left: 11px;
width: 12px;
height: 12px;
object-fit: cover;
}
.url-bar {
position: absolute;
width: calc(100% - 215px);
top: calc(50% - 14px);
right: 81px;
left: 134px;
height: 28px;
overflow: hidden;
}
.icon-home,
.icon-refresh {
position: absolute;
top: calc(50% - 8px);
width: 16px;
height: 16px;
}
.icon-home {
left: calc(50% + 38.5px);
object-fit: cover;
}
.icon-refresh {
left: calc(50% + 7.5px);
}
.icon-forward {
left: calc(50% - 23.5px);
width: 16px;
}
.icon-back,
.icon-forward,
.left-locked-icons {
position: absolute;
top: calc(50% - 8px);
height: 16px;
}
.icon-back {
left: calc(50% - 54.5px);
width: 16px;
}
.left-locked-icons {
left: 12px;
width: 109px;
overflow: hidden;
}
.toolbar-url-controls1 {
position: absolute;
width: 100%;
top: 0;
right: 0;
left: 0;
height: 100%;
overflow: hidden;
}
.broswer-control-bar-bg,
.toolbar-url-controls {
position: absolute;
width: 100%;
top: 42px;
right: 0;
left: 0;
height: 38px;
}
.broswer-control-bar-bg {
height: 100%;
top: 0;
bottom: 0;
border-radius: var(--br-5xs) var(--br-5xs) 0 0;
background-color: #dee1e6;
}
.curve-l-icon,
.favicon {
height: 8px;
width: 6px;
position: relative;
}
.favicon {
height: 16px;
width: 16px;
flex-shrink: 0;
object-fit: cover;
}
.tab-name {
position: relative;
letter-spacing: 0.2px;
}
.icon-close {
height: 18px;
width: 18px;
position: relative;
flex-shrink: 0;
min-height: 18px;
}
.favicon-text-icons {
border-radius: var(--br-5xs) var(--br-5xs) 0 0;
background-color: var(--text-on-accent);
overflow-x: auto;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
padding: var(--padding-5xs);
gap: 9px;
}
.curve-r-icon {
height: 8px;
width: 6px;
position: relative;
object-fit: contain;
}
.curve-l-parent {
display: flex;
flex-direction: row;
align-items: flex-start;
justify-content: flex-start;
}
.icon-plus {
height: 20px;
width: 20px;
position: relative;
}
.frame-parent {
position: absolute;
top: 0;
left: -6px;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
gap: var(--gap-5xs);
}
.browser-tab-with-plus,
.tab-plus {
position: absolute;
top: calc(50% - 17px);
left: 8px;
width: 131px;
height: 34px;
}
.tab-plus {
top: calc(50% - 13px);
left: 72px;
width: 167px;
}
.browser-controls-icon {
position: absolute;
top: calc(50% - 5.5px);
left: 13px;
width: 52px;
height: 12px;
overflow: hidden;
}
.broswer-control-bar {
height: 100%;
bottom: 0;
overflow: hidden;
}
.broswer-control-bar,
.browser-url-controls,
.toolbar-browser-controls {
position: absolute;
width: 100%;
top: 0;
right: 0;
left: 0;
}
.toolbar-browser-controls {
height: 52.5%;
bottom: 47.5%;
font-size: var(--comp-typography-body-macos-caption-size);
color: #494c4f;
}
.browser-url-controls {
height: 80px;
overflow: hidden;
display: none;
}
.label13 {
position: relative;
line-height: 24px;
font-weight: 600;
}
.secondary {
border-radius: 205px;
background-color: var(--text-on-accent);
border: 1px solid var(--sys-color-border-default);
display: none;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-5xs) var(--padding-5xl);
color: var(--text-default);
}
.expand-more-icon2 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
overflow: hidden;
flex-shrink: 0;
display: none;
}
.label14 {
position: relative;
line-height: 24px;
font-weight: 600;
}
.primary {
border-radius: var(--br-81xl);
background-color: var(--action-primary-default);
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: var(--padding-5xs) var(--padding-5xl);
opacity: 0.3;
white-space: nowrap;
}
.label15 {
align-self: stretch;
position: relative;
line-height: 20px;
font-weight: 600;
}
.footer,
.primary1 {
box-sizing: border-box;
display: none;
flex-direction: row;
align-items: center;
}
.primary1 {
height: 32px;
border-radius: var(--br-81xl);
background-color: var(--action-primary-default);
justify-content: center;
padding: var(--padding-7xs) var(--padding-base);
}
.footer {
position: absolute;
bottom: 0;
left: 0;
background-color: rgba(255, 255, 255, 0.9);
border-top: 1px solid var(--sys-color-border-default);
width: 100%;
justify-content: flex-end;
padding: var(--padding-base) var(--padding-5xl);
gap: var(--gap-base);
max-width: 100%;
text-align: center;
font-size: var(--components-desktop-button-text-small-size);
color: var(--text-on-accent);
font-family: var(--components-desktop-button-text-small);
}
.chat-icon {
position: absolute;
right: 24px;
bottom: 24px;
width: 64px;
height: 64px;
}
.keyboard-double-arrow-left-icon1 {
height: var(--sys-sizing-icon-m);
width: var(--sys-sizing-icon-m);
position: relative;
object-fit: contain;
}
.menu-footer {
width: 100%;
cursor: pointer;
padding: 32px;
background-color: transparent;
position: absolute;
bottom: 0;
border-top: 1px solid #cdcdcd;
box-sizing: border-box;
height: 64px;
display: flex;
flex-direction: column;
align-items: flex-end;
justify-content: center;
z-index: 999;
top: 50%;
margin-top: 32px;
}
.bookings1toggle-list {
width: 100%;
height: 1922px;
position: relative;
background-color: var(--surface-surface-background);
border: 1px solid var(--color-black);
box-sizing: border-box;
overflow-y: auto;
line-height: normal;
letter-spacing: normal;
text-align: left;
font-size: var(--body-macos-paragraph-small-size);
color: var(--text-default);
font-family: var(--font-roboto);
}
/* Booking */
.site-booking-page.content {
display: flex;
flex-direction: column;
width: 1200px;
/* height: 1860px; */
/* align-items: flex-start; */
gap: 32px;
position: relative;
}
.site-booking-page.content .frame {
display: flex;
align-items: flex-end;
justify-content: flex-end;
gap: 24px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
.site-booking-page.content .page-title {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 16px 16px;
position: relative;
flex: 1;
flex-grow: 1;
}
.site-booking-page.content .text-wrapper {
width: fit-content;
font-family: var(--headings-macos-medium-h2-font-family);
font-weight: var(--headings-macos-medium-h2-font-weight);
color: #000000;
font-size: var(--headings-macos-medium-h2-font-size);
letter-spacing: var(--headings-macos-medium-h2-letter-spacing);
line-height: var(--headings-macos-medium-h2-line-height);
position: relative;
margin-top: -1px;
white-space: nowrap;
font-style: var(--headings-macos-medium-h2-font-style);
}
.site-booking-page.content .singular-button {
padding: 8px 24px;
background-color: var(--arcturus-styles-sys-color-action-primary-default);
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
position: relative;
flex: 0 0 auto;
border-radius: 50px;
}
.site-booking-page.content .label {
color: var(--arcturus-styles-sys-color-text-inverse);
position: relative;
width: fit-content;
font-family: "SF Pro Display-Semibold", Helvetica;
font-weight: 400;
font-size: 16px;
text-align: center;
letter-spacing: 0.01px;
line-height: 24px;
white-space: nowrap;
}
.site-booking-page.content .header-sections {
display: flex;
align-items: flex-start;
gap: 24px;
padding: 0px 0px 6px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
.site-booking-page.content .next-booking {
display: flex;
align-items: flex-start;
position: relative;
flex: 1;
align-self: stretch;
flex-grow: 1;
/* box-shadow: var(--shadow-md); */
}
.site-booking-page.content .image {
background-image: url(./inspector.png);
position: relative;
width: 176px;
height: 224px;
border-radius: 8px 0px 0px 8px;
background-size: cover;
background-position: 50% 50%;
}
.site-booking-page.content .card {
flex-direction: column;
height: 224px;
align-items: flex-start;
gap: 16px;
padding: 24px;
flex: 1;
flex-grow: 1;
background-color: #011c41;
border-radius: 0px 8px 8px 0px;
display: flex;
position: relative;
}
.site-booking-page.content .card-heading {
align-items: center;
gap: 16px;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
display: flex;
position: relative;
}
.site-booking-page.content .div {
position: relative;
width: fit-content;
margin-top: -1px;
font-family: var(--headings-macos-medium-h5-font-family);
font-weight: var(--headings-macos-medium-h5-font-weight);
color: var(--arcturus-styles-sys-color-text-inverse);
font-size: var(--headings-macos-medium-h5-font-size);
letter-spacing: var(--headings-macos-medium-h5-letter-spacing);
line-height: var(--headings-macos-medium-h5-line-height);
white-space: nowrap;
font-style: var(--headings-macos-medium-h5-font-style);
}
.site-booking-page.content .card-content {
flex-direction: column;
align-items: flex-start;
justify-content: center;
gap: 24px;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
display: flex;
position: relative;
}
.site-booking-page.content .frame-2 {
display: flex;
flex-direction: column;
align-items: flex-start;
justify-content: center;
gap: 8px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
.site-booking-page.content .frame-3 {
display: inline-flex;
align-items: center;
gap: 8px;
position: relative;
flex: 0 0 auto;
}
.site-booking-page.content .text-wrapper-2 {
position: relative;
width: fit-content;
margin-top: -1px;
font-family: var(--headings-macos-medium-h2-font-family);
font-weight: var(--headings-macos-medium-h2-font-weight);
color: var(--arcturus-styles-sys-color-text-inverse);
font-size: var(--headings-macos-medium-h2-font-size);
letter-spacing: var(--headings-macos-medium-h2-letter-spacing);
line-height: var(--headings-macos-medium-h2-line-height);
white-space: nowrap;
font-style: var(--headings-macos-medium-h2-font-style);
}
.site-booking-page.content .frame-4 {
display: flex;
align-items: flex-start;
gap: 8px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
.site-booking-page.content .text-wrapper-3 {
position: relative;
width: fit-content;
margin-top: -1px;
font-family: var(--comp-typography-body-macos-description-font-family);
font-weight: var(--comp-typography-body-macos-description-font-weight);
color: var(--arcturus-styles-sys-color-text-inverse);
font-size: var(--comp-typography-body-macos-description-font-size);
letter-spacing: var(--comp-typography-body-macos-description-letter-spacing);
line-height: var(--comp-typography-body-macos-description-line-height);
white-space: nowrap;
font-style: var(--comp-typography-body-macos-description-font-style);
}
.site-booking-page.content .rectangle {
position: relative;
align-self: stretch;
width: 1px;
background-color: var(--arcturus-styles-sys-color-surface-hover);
}
.site-booking-page.content .singular-button-2 {
padding: 4px 16px;
margin-top: -1px;
margin-bottom: -1px;
margin-left: -1px;
margin-right: -1px;
background-color: var(--arcturus-styles-sys-color-action-secondary-default);
border: 1px solid;
border-color: var(--arcturus-styles-sys-color-border-default);
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
position: relative;
flex: 0 0 auto;
border-radius: 50px;
}
.site-booking-page.content .label-2 {
margin-top: -0.5px;
color: var(--arcturus-styles-sys-color-text-default);
position: relative;
width: fit-content;
font-family: "SF Pro Display-Semibold", Helvetica;
font-weight: 400;
font-size: 16px;
text-align: center;
letter-spacing: 0.01px;
line-height: 24px;
white-space: nowrap;
}
.site-booking-page.content .suffix-icon {
position: relative;
width: var(--arcturus-styles-sys-sizing-icon-m);
height: var(--arcturus-styles-sys-sizing-icon-m);
background-image: url(./img/icon-11.svg);
background-size: 100% 100%;
}
.site-booking-page.content .image-2 {
background-image: url(./people.png);
position: relative;
width: 176px;
height: 244px;
border-radius: 8px 0px 0px 8px;
background-size: cover;
background-position: 50% 50%;
}
.site-booking-page.content .card-2 {
flex-direction: column;
height: 244px;
align-items: flex-start;
gap: 16px;
padding: 24px;
flex: 1;
flex-grow: 1;
background-color: #3c2869;
border-radius: 0px 8px 8px 0px;
display: flex;
position: relative;
}
.site-booking-page.content .p {
position: relative;
align-self: stretch;
margin-top: -1px;
font-family: var(--comp-typography-body-macos-paragraph-normal-font-family);
font-weight: var(--comp-typography-body-macos-paragraph-normal-font-weight);
color: var(--arcturus-styles-sys-color-text-inverse);
font-size: var(--comp-typography-body-macos-paragraph-normal-font-size);
letter-spacing: var(--comp-typography-body-macos-paragraph-normal-letter-spacing);
line-height: 22px;
font-style: var(--comp-typography-body-macos-paragraph-normal-font-style);
}
.site-booking-page.content .singular-button-3 {
padding: 4px 16px;
margin-bottom: -1px;
margin-left: -1px;
margin-top: 15px;
background-color: var(--arcturus-styles-sys-color-action-secondary-default);
border: 1px solid;
border-color: var(--arcturus-styles-sys-color-border-default);
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
position: relative;
flex: 0 0 auto;
border-radius: 50px;
}
.site-booking-page.content .img {
position: relative;
width: 24px;
height: 24px;
}
.site-booking-page.content .tables {
gap: 24px;
display: flex;
flex-direction: column;
align-items: flex-start;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
.site-booking-page.content .button-group-items {
display: inline-flex;
align-items: flex-start;
position: relative;
flex: 0 0 auto;
}
.site-booking-page.content .option-wrapper {
display: inline-flex;
align-items: flex-start;
gap: 10px;
padding: 8px 16px;
position: relative;
flex: 0 0 auto;
margin-top: -1px;
margin-bottom: -1px;
margin-left: -1px;
margin-right: -1px;
background-color: var(--arcturus-styles-sys-color-action-primary-default);
border-radius: 8px 0px 0px 8px;
border: 1px solid;
border-color: var(--arcturus-styles-sys-color-border-default);
}
.site-booking-page.content .option {
color: var(--arcturus-styles-sys-color-text-inverse);
position: relative;
width: fit-content;
font-family: var(--components-button-group-text-normal-on-font-family);
font-weight: var(--components-button-group-text-normal-on-font-weight);
font-size: var(--components-button-group-text-normal-on-font-size);
text-align: center;
letter-spacing: var(--components-button-group-text-normal-on-letter-spacing);
line-height: var(--components-button-group-text-normal-on-line-height);
white-space: nowrap;
font-style: var(--components-button-group-text-normal-on-font-style);
}
.site-booking-page.content .div-wrapper {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 10px;
padding: 8px 16px;
position: relative;
flex: 0 0 auto;
margin-top: -1px;
margin-bottom: -1px;
background-color: var(--arcturus-styles-sys-color-action-secondary-default);
border: 1px solid;
border-color: var(--arcturus-styles-sys-color-border-default);
}
.site-booking-page.content .option-2 {
color: var(--arcturus-styles-sys-color-text);
position: relative;
width: fit-content;
font-family: var(--components-button-group-text-normal-off-font-family);
font-weight: var(--components-button-group-text-normal-off-font-weight);
font-size: var(--components-button-group-text-normal-off-font-size);
text-align: center;
letter-spacing: var(--components-button-group-text-normal-off-letter-spacing);
line-height: var(--components-button-group-text-normal-off-line-height);
white-space: nowrap;
font-style: var(--components-button-group-text-normal-off-font-style);
}
.site-booking-page.content .frame-5 {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 10px;
padding: 8px 16px;
position: relative;
flex: 0 0 auto;
margin-top: -1px;
margin-bottom: -1px;
margin-right: -1px;
background-color: var(--arcturus-styles-sys-color-action-secondary-default);
border-radius: 0px 8px 8px 0px;
border: 1px solid;
border-color: var(--arcturus-styles-sys-color-border-default);
}
.site-booking-page.content .table-wrapper {
gap: 16px;
display: flex;
flex-direction: column;
align-items: flex-start;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
.site-booking-page.content .table {
flex-direction: column;
align-items: flex-start;
gap: 32px;
padding: 24px;
background-color: var(--surfacedefault);
border-radius: 8px;
box-shadow: 0px 2px 4px -2px #1018280f, 0px 4px 8px -2px #1018281a;
display: flex;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
.site-booking-page.content .card-heading-2 {
/* display: flex; */
/* align-items: center; */
/* gap: 16px; */
/* position: relative; */
/* flex: 0 0 auto; */
/* padding: 45px 0 0 45px; */
}
.site-booking-page.content .text-wrapper-4 {
position: relative;
width: fit-content;
margin-top: -1px;
font-family: var(--headings-macos-medium-h4-font-family);
font-weight: var(--headings-macos-medium-h4-font-weight);
color: var(--arcturus-styles-sys-color-text-default);
font-size: var(--headings-macos-medium-h4-font-size);
letter-spacing: var(--headings-macos-medium-h4-letter-spacing);
line-height: var(--headings-macos-medium-h4-line-height);
white-space: nowrap;
font-style: var(--headings-macos-medium-h4-font-style);
}
.site-booking-page.content .text-wrapper-5 {
position: relative;
width: fit-content;
font-family: "SF Pro Text-Medium", Helvetica;
font-weight: 500;
color: var(--arcturus-styles-sys-color-text-subdued);
letter-spacing: 0.01px;
line-height: 31px;
white-space: nowrap;
}
.site-booking-page.content .div-2 {
flex-direction: column;
align-items: flex-start;
display: flex;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
.site-booking-page.content .table-header {
flex-wrap: wrap;
align-items: center;
gap: 0px 32px;
padding: 8px 16px;
background-color: var(--arcturus-styles-sys-color-surface-background);
border-bottom-width: 1px;
border-bottom-style: solid;
border-color: var(--arcturus-styles-sys-color-border-default);
display: flex;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
.site-booking-page.content .text-wrapper-6 {
position: relative;
width: 160px;
font-family: var(--body-macos-description-font-family);
font-weight: var(--body-macos-description-font-weight);
color: var(--syscolortextdefault);
font-size: var(--body-macos-description-font-size);
letter-spacing: var(--body-macos-description-letter-spacing);
line-height: var(--body-macos-description-line-height);
font-style: var(--body-macos-description-font-style);
}
.site-booking-page.content .text-wrapper-7 {
flex: 1;
height: 24px;
font-family: var(--body-macos-description-font-family);
font-weight: var(--body-macos-description-font-weight);
color: var(--textdefault);
font-size: var(--body-macos-description-font-size);
letter-spacing: var(--body-macos-description-letter-spacing);
line-height: var(--body-macos-description-line-height);
position: relative;
margin-top: -1px;
white-space: nowrap;
font-style: var(--body-macos-description-font-style);
}
.site-booking-page.content .text-wrapper-8 {
position: relative;
width: 80px;
height: 24px;
margin-top: -1px;
font-family: var(--body-macos-description-font-family);
font-weight: var(--body-macos-description-font-weight);
color: var(--textdefault);
font-size: var(--body-macos-description-font-size);
letter-spacing: var(--body-macos-description-letter-spacing);
line-height: var(--body-macos-description-line-height);
white-space: nowrap;
font-style: var(--body-macos-description-font-style);
}
.site-booking-page.content .text-wrapper-9 {
position: relative;
width: 104px;
height: 24px;
margin-top: -1px;
font-family: var(--body-macos-description-font-family);
font-weight: var(--body-macos-description-font-weight);
color: var(--textdefault);
font-size: var(--body-macos-description-font-size);
letter-spacing: var(--body-macos-description-letter-spacing);
line-height: var(--body-macos-description-line-height);
white-space: nowrap;
font-style: var(--body-macos-description-font-style);
}
.site-booking-page.content .text-wrapper-10 {
position: relative;
width: 144px;
height: 10px;
margin-top: -12px;
font-family: var(--body-macos-description-font-family);
font-weight: var(--body-macos-description-font-weight);
color: var(--textdefault);
font-size: var(--body-macos-description-font-size);
letter-spacing: var(--body-macos-description-letter-spacing);
line-height: var(--body-macos-description-line-height);
white-space: nowrap;
font-style: var(--body-macos-description-font-style);
}
.site-booking-page.content .group {
position: absolute;
width: 1px;
height: 1px;
top: 4px;
left: 71px;
}
.site-booking-page.content .booking-row {
display: flex;
align-items: center;
gap: 32px;
padding: 24px 16px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
background-color: #ffffff;
border-bottom-width: 1px;
border-bottom-style: solid;
border-color: var(--arcturus-styles-sys-color-border-default);
}
.site-booking-page.content .text-wrapper-11 {
position: relative;
width: 160px;
font-family: "SF Pro Text-Medium", Helvetica;
font-weight: 500;
color: var(--arcturus-styles-sys-color-text-default);
font-size: 16px;
letter-spacing: 0.01px;
line-height: 20px;
}
.site-booking-page.content .text-wrapper-12 {
position: relative;
flex: 1;
font-family: "SF Pro Text-Regular", Helvetica;
font-weight: 400;
color: var(--textdefault);
font-size: 16px;
letter-spacing: 0.01px;
line-height: 24px;
width: 260px;
}
.site-booking-page.content .booking-type {
position: relative;
width: 80px;
height: 24px;
}
.site-booking-page.content .text-wrapper-13 {
position: absolute;
width: 80px;
height: 24px;
top: -1px;
left: 0;
font-family: "SF Pro Text-Regular", Helvetica;
font-weight: 400;
color: var(--arcturus-styles-sys-color-text-default);
font-size: 16px;
letter-spacing: 0.01px;
line-height: 24px;
white-space: nowrap;
}
.site-booking-page.content .text-wrapper-14 {
position: relative;
width: 104px;
font-family: "SF Pro Text-Regular", Helvetica;
font-weight: 400;
color: var(--textdefault);
font-size: 16px;
letter-spacing: 0.01px;
line-height: 24px;
}
.site-booking-page.content .booking-status {
position: relative;
width: 144px;
height: 24px;
}
.site-booking-page.content .text-wrapper-15 {
position: absolute;
width: 144px;
height: 24px;
top: -1px;
left: 0;
font-family: "SF Pro Text-Regular", Helvetica;
font-weight: 400;
color: var(--arcturus-styles-sys-color-text-default);
font-size: 16px;
letter-spacing: 0.01px;
line-height: 24px;
white-space: nowrap;
}
.site-booking-page.content .text-wrapper-16 {
position: relative;
width: 80px;
font-family: "SF Pro Text-Regular", Helvetica;
font-weight: 400;
color: var(--textdefault);
font-size: 16px;
letter-spacing: 0.01px;
line-height: 24px;
text-align: center;
}
.site-booking-page.content .singular-button-wrapper {
display: flex;
flex-direction: column;
width: 104px;
align-items: center;
gap: 10px;
position: relative;
}
.site-booking-page.content .singular-button-4 {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
padding: 4px 16px;
position: relative;
flex: 0 0 auto;
border-radius: 50px;
}
.site-booking-page.content .label-3 {
color: var(--arcturus-styles-sys-color-text-default);
position: relative;
width: fit-content;
font-family: "SF Pro Display-Semibold", Helvetica;
font-weight: 400;
font-size: 16px;
text-align: center;
letter-spacing: 0.01px;
line-height: 24px;
white-space: nowrap;
}
.site-booking-page.content .text-wrapper-17 {
position: absolute;
width: 259px;
height: 24px;
top: -1px;
left: 0;
font-family: "SF Pro Text-Regular", Helvetica;
font-weight: 400;
color: var(--arcturus-styles-sys-color-text-default);
font-size: 16px;
letter-spacing: 0.01px;
line-height: 24px;
white-space: nowrap;
}
.site-booking-page.content .table-footer {
align-items: center;
gap: 48px;
padding: 24px 0px 16px;
background-color: #ffffff;
display: flex;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
.site-booking-page.content .text-wrapper-18 {
position: relative;
width: 168px;
font-family: var(--body-macos-paragraph-small-font-family);
font-weight: var(--body-macos-paragraph-small-font-weight);
color: var(--arcturus-styles-sys-color-text-subdued);
font-size: var(--body-macos-paragraph-small-font-size);
letter-spacing: var(--body-macos-paragraph-small-letter-spacing);
line-height: var(--body-macos-paragraph-small-line-height);
font-style: var(--body-macos-paragraph-small-font-style);
}
.site-booking-page.content .icons {
display: flex;
align-items: center;
justify-content: flex-end;
gap: 16px;
position: relative;
flex: 1;
flex-grow: 1;
}
.site-booking-page.content .first-page {
background-image: url(./img/icon-45.svg);
position: relative;
width: var(--arcturus-styles-sys-sizing-icon-m);
height: var(--arcturus-styles-sys-sizing-icon-m);
background-size: 100% 100%;
}
.site-booking-page.content .last-page {
background-image: url(./img/icon-44.svg);
position: relative;
width: var(--arcturus-styles-sys-sizing-icon-m);
height: var(--arcturus-styles-sys-sizing-icon-m);
background-size: 100% 100%;
}
.site-booking-page.content .last-page-2 {
background-image: url(./img/icon.svg);
position: relative;
width: var(--arcturus-styles-sys-sizing-icon-m);
height: var(--arcturus-styles-sys-sizing-icon-m);
background-size: 100% 100%;
}
/* Audit Page */
.audit-page.content {
display: flex;
flex-direction: column;
width: 1302px;
height: 1860px;
align-items: flex-start;
gap: 32px;
padding: 32px 48px;
position: relative;
}
.audit-page.content .frame {
display: flex;
align-items: flex-end;
justify-content: flex-end;
gap: 24px;
align-self: stretch;
width: 100%;
position: relative;
flex: 0 0 auto;
}
.audit-page.content .page-title {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 16px 16px;
position: relative;
flex: 1;
flex-grow: 1;
}
.audit-page.content .site-bookings {
position: relative;
width: fit-content;
margin-top: -1px;
font-family: var(--headings-macos-medium-h2-font-family);
font-weight: var(--headings-macos-medium-h2-font-weight);
color: #000000;
font-size: var(--headings-macos-medium-h2-font-size);
letter-spacing: var(--headings-macos-medium-h2-letter-spacing);
line-height: var(--headings-macos-medium-h2-line-height);
white-space: nowrap;
font-style: var(--headings-macos-medium-h2-font-style);
}
.audit-page.content .tables {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 40px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
.audit-page.content .v-search {
display: flex;
flex-direction: column;
align-items: flex-end;
gap: 24px;
padding: 24px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
background-color: var(--surfacedefault);
border-radius: 8px;
box-shadow: 0px 2px 4px -2px #1018280f, 0px 4px 8px -2px #1018281a;
}
.audit-page.content .div {
display: flex;
align-items: center;
gap: 24px;
align-self: stretch;
width: 100%;
position: relative;
flex: 0 0 auto;
}
.audit-page.content .card-heading {
display: flex;
align-items: center;
gap: 16px;
position: relative;
flex: 1;
flex-grow: 1;
}
.audit-page.content .text-wrapper {
position: relative;
width: fit-content;
margin-top: -1px;
font-family: var(--headings-macos-medium-h4-font-family);
font-weight: var(--headings-macos-medium-h4-font-weight);
color: var(--arcturus-styles-sys-color-text-default);
font-size: var(--headings-macos-medium-h4-font-size);
letter-spacing: var(--headings-macos-medium-h4-letter-spacing);
line-height: var(--headings-macos-medium-h4-line-height);
white-space: nowrap;
font-style: var(--headings-macos-medium-h4-font-style);
}
.audit-page.content .rectangle {
position: relative;
align-self: stretch;
width: 1px;
background-color: var(--arcturus-styles-sys-color-surface-hover);
}
.audit-page.content .text-wrapper-2 {
width: fit-content;
font-family: "SF Pro Text-Medium", Helvetica;
font-weight: 500;
color: var(--arcturus-styles-sys-color-text-subdued);
line-height: 20px;
white-space: nowrap;
position: relative;
letter-spacing: 0.01px;
}
.audit-page.content .controls {
display: inline-flex;
align-items: center;
justify-content: flex-end;
gap: 24px;
position: relative;
flex: 0 0 auto;
}
.audit-page.content .search {
display: flex;
flex-direction: column;
width: 344px;
align-items: flex-start;
position: relative;
}
.audit-page.content .field {
height: 32px;
align-items: center;
gap: 8px;
padding: 4px 12px;
background-color: var(--arcturus-styles-sys-color-surface-default-duplicate);
border: 1px solid;
border-color: var(--arcturus-styles-sys-color-border-default-duplicate);
display: flex;
position: relative;
align-self: stretch;
width: 100%;
border-radius: 8px;
}
.audit-page.content .prefix-iconbutton {
position: relative;
width: 24px;
height: 24px;
border-radius: 4px;
background-image: url(./img/search-1.svg);
background-size: 100% 100%;
}
.audit-page.content .input-text {
position: relative;
flex: 1;
height: 32px;
margin-top: -5px;
margin-bottom: -3px;
font-family: "SF Pro Text-Regular", Helvetica;
font-weight: 400;
color: var(--arcturus-styles-sys-color-text-subdued);
font-size: 16px;
letter-spacing: 0.01px;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
background: transparent;
border: none;
padding: 0;
}
.audit-page.content .view {
display: inline-flex;
align-items: center;
justify-content: flex-end;
gap: 8px;
position: relative;
flex: 0 0 auto;
}
.audit-page.content .text-wrapper-3 {
position: relative;
width: fit-content;
font-family: "SF Pro Text-Regular", Helvetica;
font-weight: 400;
color: #000000;
font-size: 12px;
letter-spacing: 0.01px;
line-height: 18px;
white-space: nowrap;
}
.audit-page.content .single-select {
display: flex;
flex-direction: column;
width: 197px;
align-items: flex-start;
gap: 4px;
position: relative;
}
.audit-page.content .field-wrapper {
flex-direction: column;
align-items: flex-start;
gap: 4px;
flex: 0 0 auto;
display: flex;
position: relative;
align-self: stretch;
width: 100%;
border-radius: 8px;
}
.audit-page.content .field-2 {
height: 32px;
align-items: center;
justify-content: flex-end;
gap: 8px;
padding: 4px 12px;
background-color: var(--arcturus-styles-sys-color-surface-default);
border: 1px solid;
border-color: var(--arcturus-styles-sys-color-border-default);
display: flex;
position: relative;
align-self: stretch;
width: 100%;
border-radius: 8px;
}
.audit-page.content .input-text-2 {
position: relative;
flex: 1;
margin-top: -1px;
font-family: "SF Pro Text-Regular", Helvetica;
font-weight: 400;
color: var(--arcturus-styles-sys-color-text-default);
font-size: 16px;
letter-spacing: 0.01px;
line-height: 24px;
}
.audit-page.content .suffix-icon {
position: relative;
width: var(--arcturus-styles-sys-sizing-icon-m);
height: var(--arcturus-styles-sys-sizing-icon-m);
background-image: url(./img/icon-48.svg);
background-size: 100% 100%;
}
.audit-page.content .img {
position: relative;
flex: 0 0 auto;
}
.audit-page.content .div-2 {
flex-direction: column;
align-items: flex-start;
display: flex;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
.audit-page.content .audits-table-header {
display: flex;
flex-wrap: wrap;
width: 1158px;
align-items: flex-start;
gap: 0px 32px;
padding: 8px 16px;
position: relative;
flex: 0 0 auto;
background-color: var(--arcturus-styles-sys-color-surface-background);
border-bottom-width: 1px;
border-bottom-style: solid;
border-color: var(--arcturus-styles-sys-color-border-default);
}
.audit-page.content .name-check-box {
display: flex;
align-items: center;
gap: 8px;
position: relative;
flex: 1;
flex-grow: 1;
}
.audit-page.content .checkbox {
display: inline-flex;
align-items: flex-start;
gap: 8px;
position: relative;
flex: 0 0 auto;
}
.audit-page.content .img-2 {
position: relative;
width: 24px;
height: 24px;
}
.audit-page.content .inner-rectangle {
position: relative;
width: 18px;
height: 18px;
top: 3px;
left: 3px;
background-color: var(--arcturus-styles-sys-color-surface-default);
border-radius: 2px;
border: 2px solid;
border-color: var(--arcturus-styles-sys-color-border-default);
}
.audit-page.content .text-wrapper-4 {
position: relative;
flex: 1;
font-family: var(--body-macos-description-font-family);
font-weight: var(--body-macos-description-font-weight);
color: var(--arcturus-styles-sys-color-text-default);
font-size: var(--body-macos-description-font-size);
letter-spacing: var(--body-macos-description-letter-spacing);
line-height: var(--body-macos-description-line-height);
font-style: var(--body-macos-description-font-style);
}
.audit-page.content .text-wrapper-5 {
position: relative;
width: 104px;
height: 24px;
margin-top: -1px;
font-family: var(--body-macos-description-font-family);
font-weight: var(--body-macos-description-font-weight);
color: var(--textdefault);
font-size: var(--body-macos-description-font-size);
letter-spacing: var(--body-macos-description-letter-spacing);
line-height: var(--body-macos-description-line-height);
white-space: nowrap;
font-style: var(--body-macos-description-font-style);
}
.audit-page.content .text-wrapper-6 {
position: relative;
width: 192px;
height: 24px;
margin-top: -1px;
font-family: var(--body-macos-description-font-family);
font-weight: var(--body-macos-description-font-weight);
color: var(--textdefault);
font-size: var(--body-macos-description-font-size);
letter-spacing: var(--body-macos-description-letter-spacing);
line-height: var(--body-macos-description-line-height);
white-space: nowrap;
font-style: var(--body-macos-description-font-style);
}
.audit-page.content .invoice-row {
display: flex;
align-items: center;
gap: 32px;
padding: 24px 16px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
background-color: #ffffff;
border-bottom-width: 1px;
border-bottom-style: solid;
border-color: var(--arcturus-styles-sys-color-border-default);
}
.audit-page.content .text-wrapper-7 {
position: relative;
flex: 1;
margin-top: -1px;
font-family: "SF Pro Text-Medium", Helvetica;
font-weight: 500;
color: var(--arcturus-styles-sys-color-text-default);
font-size: 16px;
letter-spacing: 0.01px;
line-height: 24px;
text-decoration: underline;
}
.audit-page.content .text-wrapper-8 {
width: 104px;
margin-top: -1px;
font-family: var(--body-macos-paragraph-normal-font-family);
font-weight: var(--body-macos-paragraph-normal-font-weight);
color: var(--textdefault);
line-height: var(--body-macos-paragraph-normal-line-height);
position: relative;
font-size: var(--body-macos-paragraph-normal-font-size);
letter-spacing: var(--body-macos-paragraph-normal-letter-spacing);
font-style: var(--body-macos-paragraph-normal-font-style);
}
.audit-page.content .text-wrapper-9 {
position: relative;
width: 104px;
margin-top: -1px;
font-family: var(--body-macos-paragraph-normal-font-family);
font-weight: var(--body-macos-paragraph-normal-font-weight);
color: var(--arcturus-styles-sys-color-text-default);
font-size: var(--body-macos-paragraph-normal-font-size);
letter-spacing: var(--body-macos-paragraph-normal-letter-spacing);
line-height: var(--body-macos-paragraph-normal-line-height);
font-style: var(--body-macos-paragraph-normal-font-style);
}
.audit-page.content .text-wrapper-10 {
position: relative;
width: 96px;
margin-top: -1px;
font-family: var(--body-macos-paragraph-normal-font-family);
font-weight: var(--body-macos-paragraph-normal-font-weight);
color: var(--textdefault);
font-size: var(--body-macos-paragraph-normal-font-size);
letter-spacing: var(--body-macos-paragraph-normal-letter-spacing);
line-height: var(--body-macos-paragraph-normal-line-height);
font-style: var(--body-macos-paragraph-normal-font-style);
}
.audit-page.content .icons {
display: inline-flex;
flex: 0 0 auto;
align-items: center;
justify-content: flex-end;
gap: 16px;
position: relative;
}
.audit-page.content .bookmark-border {
background-image: url(./img/icon-6.svg);
position: relative;
width: var(--arcturus-styles-sys-sizing-icon-m);
height: var(--arcturus-styles-sys-sizing-icon-m);
background-size: 100% 100%;
}
.audit-page.content .table-footer {
align-items: center;
gap: 48px;
padding: 24px 0px;
background-color: #ffffff;
display: flex;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
.audit-page.content .text-wrapper-11 {
position: relative;
width: 168px;
font-family: "SF Pro Text-Regular", Helvetica;
font-weight: 400;
color: var(--arcturus-styles-sys-color-text-subdued);
font-size: 14px;
letter-spacing: 0.01px;
line-height: 20px;
}
.audit-page.content .icons-2 {
display: flex;
flex: 1;
flex-grow: 1;
align-items: center;
justify-content: flex-end;
gap: 16px;
position: relative;
}
.audit-page.content .first-page {
position: relative;
width: var(--arcturus-styles-sys-sizing-icon-m);
height: var(--arcturus-styles-sys-sizing-icon-m);
background-image: url(./img/icon-59.svg);
background-size: 100% 100%;
}
.audit-page.content .last-page {
position: relative;
width: var(--arcturus-styles-sys-sizing-icon-m);
height: var(--arcturus-styles-sys-sizing-icon-m);
background-image: url(./img/icon-60.svg);
background-size: 100% 100%;
}
/* Invoice Page */
.invoice-page.content {
display: flex;
flex-direction: column;
width: 1302px;
height: 1860px;
align-items: flex-start;
gap: 32px;
padding: 32px 48px;
position: relative;
}
.invoice-page.content .frame {
display: flex;
align-items: flex-end;
justify-content: flex-end;
gap: 24px;
align-self: stretch;
width: 100%;
position: relative;
flex: 0 0 auto;
}
.invoice-page.content .page-title {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 16px 16px;
position: relative;
flex: 1;
flex-grow: 1;
}
.invoice-page.content .site-bookings {
position: relative;
width: fit-content;
margin-top: -1px;
font-family: var(--headings-macos-medium-h2-font-family);
font-weight: var(--headings-macos-medium-h2-font-weight);
color: #000000;
font-size: var(--headings-macos-medium-h2-font-size);
letter-spacing: var(--headings-macos-medium-h2-letter-spacing);
line-height: var(--headings-macos-medium-h2-line-height);
white-space: nowrap;
font-style: var(--headings-macos-medium-h2-font-style);
}
.invoice-page.content .tables {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 40px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
.invoice-page.content .v-search {
display: flex;
flex-direction: column;
align-items: flex-end;
gap: 24px;
padding: 24px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
background-color: var(--surfacedefault);
border-radius: 8px;
box-shadow: 0px 2px 4px -2px #1018280f, 0px 4px 8px -2px #1018281a;
}
.invoice-page.content .div {
display: flex;
align-items: center;
gap: 24px;
align-self: stretch;
width: 100%;
position: relative;
flex: 0 0 auto;
}
.invoice-page.content .card-heading {
display: flex;
align-items: center;
gap: 16px;
position: relative;
flex: 1;
flex-grow: 1;
}
.invoice-page.content .text-wrapper {
position: relative;
width: fit-content;
margin-top: -1px;
font-family: var(--headings-macos-medium-h4-font-family);
font-weight: var(--headings-macos-medium-h4-font-weight);
color: var(--arcturus-styles-sys-color-text-default);
font-size: var(--headings-macos-medium-h4-font-size);
letter-spacing: var(--headings-macos-medium-h4-letter-spacing);
line-height: var(--headings-macos-medium-h4-line-height);
white-space: nowrap;
font-style: var(--headings-macos-medium-h4-font-style);
}
.invoice-page.content .rectangle {
position: relative;
align-self: stretch;
width: 1px;
background-color: var(--arcturus-styles-sys-color-surface-hover);
}
.invoice-page.content .text-wrapper-2 {
position: relative;
width: fit-content;
font-family: "SF Pro Text-Medium", Helvetica;
font-weight: 500;
color: var(--arcturus-styles-sys-color-text-subdued);
letter-spacing: 0.01px;
line-height: 20px;
white-space: nowrap;
}
.invoice-page.content .controls {
display: inline-flex;
align-items: center;
justify-content: flex-end;
gap: 24px;
position: relative;
flex: 0 0 auto;
}
.invoice-page.content .search {
display: flex;
flex-direction: column;
width: 344px;
align-items: flex-start;
position: relative;
}
.invoice-page.content .field {
height: 32px;
align-items: center;
gap: 8px;
padding: 4px 12px;
background-color: var(--arcturus-styles-sys-color-surface-default-duplicate);
border: 1px solid;
border-color: var(--arcturus-styles-sys-color-border-default-duplicate);
display: flex;
position: relative;
align-self: stretch;
width: 100%;
border-radius: 8px;
}
.invoice-page.content .prefix-iconbutton {
position: relative;
width: 24px;
height: 24px;
border-radius: 4px;
background-image: url(./img/search-1.svg);
background-size: 100% 100%;
}
.invoice-page.content .input-text {
position: relative;
flex: 1;
height: 32px;
margin-top: -5px;
margin-bottom: -3px;
font-family: "SF Pro Text-Regular", Helvetica;
font-weight: 400;
color: var(--arcturus-styles-sys-color-text-subdued);
font-size: 16px;
letter-spacing: 0.01px;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
background: transparent;
border: none;
padding: 0;
}
.invoice-page.content .view {
display: inline-flex;
align-items: center;
justify-content: flex-end;
gap: 8px;
position: relative;
flex: 0 0 auto;
}
.invoice-page.content .text-wrapper-3 {
position: relative;
width: fit-content;
font-family: "SF Pro Text-Regular", Helvetica;
font-weight: 400;
color: #000000;
font-size: 12px;
letter-spacing: 0.01px;
line-height: 18px;
white-space: nowrap;
}
.invoice-page.content .single-select {
display: flex;
flex-direction: column;
width: 197px;
align-items: flex-start;
gap: 4px;
position: relative;
}
.invoice-page.content .field-wrapper {
flex-direction: column;
align-items: flex-start;
gap: 4px;
flex: 0 0 auto;
display: flex;
position: relative;
align-self: stretch;
width: 100%;
border-radius: 8px;
}
.invoice-page.content .field-2 {
height: 32px;
align-items: center;
justify-content: flex-end;
gap: 8px;
padding: 4px 12px;
background-color: var(--arcturus-styles-sys-color-surface-default);
border: 1px solid;
border-color: var(--arcturus-styles-sys-color-border-default);
display: flex;
position: relative;
align-self: stretch;
width: 100%;
border-radius: 8px;
}
.invoice-page.content .input-text-2 {
position: relative;
flex: 1;
margin-top: -1px;
font-family: "SF Pro Text-Regular", Helvetica;
font-weight: 400;
color: var(--arcturus-styles-sys-color-text-default);
font-size: 16px;
letter-spacing: 0.01px;
line-height: 24px;
}
.invoice-page.content .suffix-icon {
position: relative;
width: var(--arcturus-styles-sys-sizing-icon-m);
height: var(--arcturus-styles-sys-sizing-icon-m);
background-image: url(./img/icon-48.svg);
background-size: 100% 100%;
}
.invoice-page.content .div-2 {
display: inline-flex;
align-items: center;
justify-content: flex-end;
gap: 16px;
position: relative;
flex: 0 0 auto;
}
.invoice-page.content .img {
position: relative;
width: 24px;
height: 24px;
}
.invoice-page.content .div-3 {
flex-direction: column;
align-items: flex-start;
display: flex;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
.invoice-page.content .invoice-table-header {
display: flex;
flex-wrap: wrap;
width: 1158px;
align-items: flex-start;
gap: 0px 32px;
padding: 8px 16px;
position: relative;
flex: 0 0 auto;
background-color: var(--arcturus-styles-sys-color-surface-background);
border-bottom-width: 1px;
border-bottom-style: solid;
border-color: var(--arcturus-styles-sys-color-border-default);
}
.invoice-page.content .name-check-box {
display: flex;
align-items: center;
gap: 8px;
position: relative;
flex: 1;
flex-grow: 1;
}
.invoice-page.content .checkbox {
display: inline-flex;
align-items: flex-start;
gap: 8px;
position: relative;
flex: 0 0 auto;
}
.invoice-page.content .inner-rectangle {
position: relative;
width: 18px;
height: 18px;
top: 3px;
left: 3px;
background-color: var(--arcturus-styles-sys-color-surface-default);
border-radius: 2px;
border: 2px solid;
border-color: var(--arcturus-styles-sys-color-border-default);
}
.invoice-page.content .text-wrapper-4 {
position: relative;
flex: 1;
font-family: var(--body-macos-description-font-family);
font-weight: var(--body-macos-description-font-weight);
color: var(--arcturus-styles-sys-color-text-default);
font-size: var(--body-macos-description-font-size);
letter-spacing: var(--body-macos-description-letter-spacing);
line-height: var(--body-macos-description-line-height);
font-style: var(--body-macos-description-font-style);
}
.invoice-page.content .text-wrapper-5 {
position: relative;
width: 192px;
height: 24px;
margin-top: -1px;
font-family: var(--body-macos-description-font-family);
font-weight: var(--body-macos-description-font-weight);
color: var(--textdefault);
font-size: var(--body-macos-description-font-size);
letter-spacing: var(--body-macos-description-letter-spacing);
line-height: var(--body-macos-description-line-height);
white-space: nowrap;
font-style: var(--body-macos-description-font-style);
}
.invoice-page.content .text-wrapper-6 {
position: relative;
width: 104px;
height: 24px;
margin-top: -1px;
font-family: var(--body-macos-description-font-family);
font-weight: var(--body-macos-description-font-weight);
color: var(--textdefault);
font-size: var(--body-macos-description-font-size);
letter-spacing: var(--body-macos-description-letter-spacing);
line-height: var(--body-macos-description-line-height);
white-space: nowrap;
font-style: var(--body-macos-description-font-style);
}
.invoice-page.content .text-wrapper-7 {
width: 96px;
position: relative;
height: 24px;
margin-top: -1px;
font-family: var(--body-macos-description-font-family);
font-weight: var(--body-macos-description-font-weight);
color: var(--textdefault);
font-size: var(--body-macos-description-font-size);
letter-spacing: var(--body-macos-description-letter-spacing);
line-height: var(--body-macos-description-line-height);
white-space: nowrap;
font-style: var(--body-macos-description-font-style);
}
.invoice-page.content .text-wrapper-8 {
width: 216px;
position: relative;
height: 24px;
margin-top: -1px;
font-family: var(--body-macos-description-font-family);
font-weight: var(--body-macos-description-font-weight);
color: var(--textdefault);
font-size: var(--body-macos-description-font-size);
letter-spacing: var(--body-macos-description-letter-spacing);
line-height: var(--body-macos-description-line-height);
white-space: nowrap;
font-style: var(--body-macos-description-font-style);
}
.invoice-page.content .invoice-row {
display: flex;
align-items: center;
gap: 32px;
padding: 24px 16px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
background-color: #ffffff;
border-bottom-width: 1px;
border-bottom-style: solid;
border-color: var(--arcturus-styles-sys-color-border-default);
}
.invoice-page.content .text-wrapper-9 {
position: relative;
flex: 1;
margin-top: -1px;
font-family: "SF Pro Text-Medium", Helvetica;
font-weight: 500;
color: var(--arcturus-styles-sys-color-text-default);
font-size: 16px;
letter-spacing: 0.01px;
line-height: 24px;
text-decoration: underline;
width: 300px;
}
.invoice-page.content .text-wrapper-10 {
position: relative;
width: 212px;
margin-top: -1px;
font-family: var(--body-macos-paragraph-normal-font-family);
font-weight: var(--body-macos-paragraph-normal-font-weight);
color: var(--textdefault);
font-size: 16px;
letter-spacing: var(--body-macos-paragraph-normal-letter-spacing);
line-height: var(--body-macos-paragraph-normal-line-height);
font-style: var(--body-macos-paragraph-normal-font-style);
/* text-align: center; */
}
.invoice-page.content .text-wrapper-11 {
position: relative;
width: 118px;
margin-top: -1px;
font-family: var(--body-macos-paragraph-normal-font-family);
font-weight: var(--body-macos-paragraph-normal-font-weight);
color: var(--arcturus-styles-sys-color-text-default);
font-size: 15px;
letter-spacing: var(--body-macos-paragraph-normal-letter-spacing);
line-height: var(--body-macos-paragraph-normal-line-height);
font-style: var(--body-macos-paragraph-normal-font-style);
text-align: center;
}
.invoice-page.content .text-wrapper-12 {
position: relative;
width: 91px;
/* text-align: center; */
margin-top: -1px;
font-family: var(--body-macos-paragraph-normal-font-family);
font-weight: var(--body-macos-paragraph-normal-font-weight);
color: var(--textdefault);
font-size: 15px;
letter-spacing: var(--body-macos-paragraph-normal-letter-spacing);
line-height: var(--body-macos-paragraph-normal-line-height);
font-style: var(--body-macos-paragraph-normal-font-style);
}
.invoice-page.content .text-wrapper-13 {
position: relative;
width: 108px;
margin-top: -1px;
font-family: var(--body-macos-paragraph-normal-font-family);
font-weight: var(--body-macos-paragraph-normal-font-weight);
color: var(--textdefault);
font-size: 15px;
letter-spacing: var(--body-macos-paragraph-normal-letter-spacing);
line-height: var(--body-macos-paragraph-normal-line-height);
font-style: var(--body-macos-paragraph-normal-font-style);
}
.invoice-page.content .bookmark-border {
background-image: url(./img/icon-6.svg);
position: relative;
width: var(--arcturus-styles-sys-sizing-icon-m);
height: var(--arcturus-styles-sys-sizing-icon-m);
background-size: 100% 100%;
}
.invoice-page.content .table-footer {
align-items: center;
gap: 48px;
padding: 24px 0px;
background-color: #ffffff;
display: flex;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
.invoice-page.content .text-wrapper-14 {
position: relative;
width: 168px;
font-family: "SF Pro Text-Regular", Helvetica;
font-weight: 400;
color: var(--arcturus-styles-sys-color-text-subdued);
font-size: 14px;
letter-spacing: 0.01px;
line-height: 20px;
}
.invoice-page.content .icons {
display: flex;
flex: 1;
flex-grow: 1;
align-items: center;
justify-content: flex-end;
gap: 16px;
position: relative;
}
.invoice-page.content .first-page {
position: relative;
width: var(--arcturus-styles-sys-sizing-icon-m);
height: var(--arcturus-styles-sys-sizing-icon-m);
background-image: url(./img/icon-58.svg);
background-size: 100% 100%;
}
.invoice-page.content .last-page {
position: relative;
width: var(--arcturus-styles-sys-sizing-icon-m);
height: var(--arcturus-styles-sys-sizing-icon-m);
background-image: url(./img/icon-59.svg);
background-size: 100% 100%;
}
/* Certificates Page */
.certificates-page.content {
display: flex;
flex-direction: column;
width: 1302px;
height: 1860px;
align-items: flex-start;
gap: 32px;
padding: 32px 48px;
position: relative;
}
.certificates-page.content .frame {
display: flex;
align-items: flex-end;
justify-content: flex-end;
gap: 24px;
align-self: stretch;
width: 100%;
position: relative;
flex: 0 0 auto;
}
.certificates-page.content .page-title {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 16px 16px;
position: relative;
flex: 1;
flex-grow: 1;
}
.certificates-page.content .site-bookings {
position: relative;
width: fit-content;
margin-top: -1px;
font-family: var(--headings-macos-medium-h2-font-family);
font-weight: var(--headings-macos-medium-h2-font-weight);
color: #000000;
font-size: var(--headings-macos-medium-h2-font-size);
letter-spacing: var(--headings-macos-medium-h2-letter-spacing);
line-height: var(--headings-macos-medium-h2-line-height);
white-space: nowrap;
font-style: var(--headings-macos-medium-h2-font-style);
}
.certificates-page.content .tables {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 32px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
.certificates-page.content .ISO {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 16px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
.certificates-page.content .table {
flex-direction: column;
align-items: flex-start;
gap: 32px;
padding: 24px;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
background-color: var(--surfacedefault);
border-radius: 8px;
box-shadow: 0px 2px 4px -2px #1018280f, 0px 4px 8px -2px #1018281a;
display: flex;
position: relative;
}
.certificates-page.content .div {
display: flex;
align-items: center;
gap: 24px;
align-self: stretch;
width: 100%;
position: relative;
flex: 0 0 auto;
}
.certificates-page.content .card-heading {
display: flex;
align-items: center;
gap: 16px;
position: relative;
flex: 1;
flex-grow: 1;
}
.certificates-page.content .text-wrapper {
position: relative;
width: fit-content;
margin-top: -1px;
font-family: var(--headings-macos-medium-h4-font-family);
font-weight: var(--headings-macos-medium-h4-font-weight);
color: var(--arcturus-styles-sys-color-text-default);
font-size: var(--headings-macos-medium-h4-font-size);
letter-spacing: var(--headings-macos-medium-h4-letter-spacing);
line-height: var(--headings-macos-medium-h4-line-height);
white-space: nowrap;
font-style: var(--headings-macos-medium-h4-font-style);
}
.certificates-page.content .rectangle {
position: relative;
align-self: stretch;
width: 1px;
background-color: var(--arcturus-styles-sys-color-surface-hover);
}
.certificates-page.content .text-wrapper-2 {
position: relative;
width: fit-content;
font-family: "SF Pro Text-Medium", Helvetica;
font-weight: 500;
color: var(--arcturus-styles-sys-color-text-subdued);
letter-spacing: 0.01px;
line-height: 20px;
white-space: nowrap;
}
.certificates-page.content .controls {
display: inline-flex;
align-items: center;
justify-content: flex-end;
gap: 24px;
position: relative;
flex: 0 0 auto;
}
.certificates-page.content .search {
display: flex;
flex-direction: column;
width: 344px;
align-items: flex-start;
position: relative;
}
.certificates-page.content .field {
height: 32px;
align-items: center;
gap: 8px;
padding: 4px 12px;
background-color: var(--arcturus-styles-sys-color-surface-default-duplicate);
border: 1px solid;
border-color: var(--arcturus-styles-sys-color-border-default-duplicate);
display: flex;
position: relative;
align-self: stretch;
width: 100%;
border-radius: 8px;
}
.certificates-page.content .prefix-iconbutton {
position: relative;
width: 24px;
height: 24px;
border-radius: 4px;
background-image: url(./img/search-1.svg);
background-size: 100% 100%;
}
.certificates-page.content .input-text {
position: relative;
flex: 1;
height: 32px;
margin-top: -5px;
margin-bottom: -3px;
font-family: "SF Pro Text-Regular", Helvetica;
font-weight: 400;
color: var(--arcturus-styles-sys-color-text-subdued);
font-size: 16px;
letter-spacing: 0.01px;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
background: transparent;
border: none;
padding: 0;
}
.certificates-page.content .view {
display: inline-flex;
align-items: center;
justify-content: flex-end;
gap: 8px;
position: relative;
flex: 0 0 auto;
}
.certificates-page.content .text-wrapper-3 {
position: relative;
width: fit-content;
font-family: "SF Pro Text-Regular", Helvetica;
font-weight: 400;
color: #000000;
font-size: 12px;
letter-spacing: 0.01px;
line-height: 18px;
white-space: nowrap;
}
.certificates-page.content .single-select {
display: flex;
flex-direction: column;
width: 197px;
align-items: flex-start;
gap: 4px;
position: relative;
}
.certificates-page.content .field-wrapper {
flex-direction: column;
align-items: flex-start;
gap: 4px;
flex: 0 0 auto;
display: flex;
position: relative;
align-self: stretch;
width: 100%;
border-radius: 8px;
}
.certificates-page.content .field-2 {
height: 32px;
align-items: center;
justify-content: flex-end;
gap: 8px;
padding: 4px 12px;
background-color: var(--arcturus-styles-sys-color-surface-default);
border: 1px solid;
border-color: var(--arcturus-styles-sys-color-border-default);
display: flex;
position: relative;
align-self: stretch;
width: 100%;
border-radius: 8px;
}
.certificates-page.content .input-text-2 {
position: relative;
flex: 1;
margin-top: -1px;
font-family: "SF Pro Text-Regular", Helvetica;
font-weight: 400;
color: var(--arcturus-styles-sys-color-text-default);
font-size: 16px;
letter-spacing: 0.01px;
line-height: 24px;
}
.certificates-page.content .suffix-icon {
position: relative;
width: var(--arcturus-styles-sys-sizing-icon-m);
height: var(--arcturus-styles-sys-sizing-icon-m);
background-image: url(./img/icon-48.svg);
background-size: 100% 100%;
}
.certificates-page.content .div-2 {
display: inline-flex;
align-items: center;
justify-content: flex-end;
gap: 16px;
position: relative;
flex: 0 0 auto;
}
.certificates-page.content .img {
position: relative;
width: 24px;
height: 24px;
}
.certificates-page.content .table-wrapper {
display: flex;
align-items: flex-start;
gap: 32px;
align-self: stretch;
width: 100%;
position: relative;
flex: 0 0 auto;
}
.certificates-page.content .table-2 {
flex-direction: column;
align-items: flex-start;
flex: 1;
flex-grow: 1;
display: flex;
position: relative;
}
.certificates-page.content .certificate-table {
display: flex;
flex-wrap: wrap;
width: 1158px;
align-items: flex-start;
gap: 0px 32px;
padding: 8px 16px;
position: relative;
flex: 0 0 auto;
background-color: var(--arcturus-styles-sys-color-surface-background);
border-bottom-width: 1px;
border-bottom-style: solid;
border-color: var(--arcturus-styles-sys-color-border-default);
}
.certificates-page.content .name-check-box {
display: flex;
align-items: center;
gap: 8px;
position: relative;
flex: 1;
flex-grow: 1;
}
.certificates-page.content .checkbox {
display: inline-flex;
align-items: flex-start;
gap: 8px;
position: relative;
flex: 0 0 auto;
}
.certificates-page.content .inner-rectangle {
position: relative;
width: 18px;
height: 18px;
top: 3px;
left: 3px;
background-color: var(--arcturus-styles-sys-color-surface-default);
border-radius: 2px;
border: 2px solid;
border-color: var(--arcturus-styles-sys-color-border-default);
}
.certificates-page.content .text-wrapper-4 {
position: relative;
flex: 1;
font-family: var(--body-macos-description-font-family);
font-weight: var(--body-macos-description-font-weight);
color: var(--arcturus-styles-sys-color-text-default);
font-size: var(--body-macos-description-font-size);
letter-spacing: var(--body-macos-description-letter-spacing);
line-height: var(--body-macos-description-line-height);
font-style: var(--body-macos-description-font-style);
}
.certificates-page.content .text-wrapper-5 {
position: relative;
width: 112px;
height: 24px;
margin-top: -1px;
font-family: var(--body-macos-description-font-family);
font-weight: var(--body-macos-description-font-weight);
color: var(--textdefault);
font-size: var(--body-macos-description-font-size);
letter-spacing: var(--body-macos-description-letter-spacing);
line-height: var(--body-macos-description-line-height);
white-space: nowrap;
font-style: var(--body-macos-description-font-style);
}
.certificates-page.content .text-wrapper-6 {
position: relative;
width: 80px;
height: 24px;
margin-top: -1px;
font-family: var(--body-macos-description-font-family);
font-weight: var(--body-macos-description-font-weight);
color: var(--textdefault);
font-size: var(--body-macos-description-font-size);
letter-spacing: var(--body-macos-description-letter-spacing);
line-height: var(--body-macos-description-line-height);
white-space: nowrap;
font-style: var(--body-macos-description-font-style);
}
.certificates-page.content .text {
position: relative;
width: 64px;
height: 24px;
margin-top: -1px;
font-family: var(--body-macos-description-font-family);
font-weight: var(--body-macos-description-font-weight);
color: var(--textdefault);
font-size: var(--body-macos-description-font-size);
letter-spacing: var(--body-macos-description-letter-spacing);
line-height: var(--body-macos-description-line-height);
white-space: nowrap;
font-style: var(--body-macos-description-font-style);
}
.certificates-page.content .certificate-row {
display: flex;
align-items: center;
gap: 32px;
padding: 16px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
background-color: #ffffff;
border-bottom-width: 1px;
border-bottom-style: solid;
border-color: var(--arcturus-styles-sys-color-border-default);
}
.certificates-page.content .text-wrapper-7 {
position: relative;
flex: 1;
margin-top: -1px;
font-family: "SF Pro Text-Medium", Helvetica;
font-weight: 500;
color: var(--arcturus-styles-sys-color-text-default);
font-size: 16px;
letter-spacing: 0.01px;
line-height: 24px;
text-decoration: underline;
}
.certificates-page.content .text-wrapper-8 {
position: relative;
width: 112px;
margin-top: -1px;
font-family: var(--body-macos-paragraph-normal-font-family);
font-weight: var(--body-macos-paragraph-normal-font-weight);
color: var(--arcturus-styles-sys-color-text-default);
font-size: var(--body-macos-paragraph-normal-font-size);
letter-spacing: var(--body-macos-paragraph-normal-letter-spacing);
line-height: var(--body-macos-paragraph-normal-line-height);
font-style: var(--body-macos-paragraph-normal-font-style);
}
.certificates-page.content .text-wrapper-9 {
position: relative;
width: 80px;
margin-top: -1px;
font-family: var(--body-macos-paragraph-normal-font-family);
font-weight: var(--body-macos-paragraph-normal-font-weight);
color: var(--textdefault);
font-size: var(--body-macos-paragraph-normal-font-size);
letter-spacing: var(--body-macos-paragraph-normal-letter-spacing);
line-height: var(--body-macos-paragraph-normal-line-height);
font-style: var(--body-macos-paragraph-normal-font-style);
}
.certificates-page.content .bookmark-border {
background-image: url(./img/icon-6.svg);
position: relative;
width: var(--arcturus-styles-sys-sizing-icon-m);
height: var(--arcturus-styles-sys-sizing-icon-m);
background-size: 100% 100%;
}
.certificates-page.content .table-footer {
align-items: center;
gap: 48px;
padding: 24px 0px;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
background-color: #ffffff;
display: flex;
position: relative;
}
.certificates-page.content .text-wrapper-10 {
position: relative;
width: 168px;
font-family: "SF Pro Text-Regular", Helvetica;
font-weight: 400;
color: var(--arcturus-styles-sys-color-text-subdued);
font-size: 14px;
letter-spacing: 0.01px;
line-height: 20px;
}
.certificates-page.content .icons {
display: flex;
flex: 1;
flex-grow: 1;
align-items: center;
justify-content: flex-end;
gap: 16px;
position: relative;
}
.certificates-page.content .first-page {
position: relative;
width: var(--arcturus-styles-sys-sizing-icon-m);
height: var(--arcturus-styles-sys-sizing-icon-m);
background-image: url(./img/icon-59.svg);
background-size: 100% 100%;
}
.certificates-page.content .last-page {
position: relative;
width: var(--arcturus-styles-sys-sizing-icon-m);
height: var(--arcturus-styles-sys-sizing-icon-m);
background-image: url(./img/icon-60.svg);
background-size: 100% 100%;
}
/* Training Page */
.training-page.content {
display: flex;
flex-direction: column;
width: 1302px;
height: 1860px;
align-items: flex-start;
gap: 32px;
padding: 32px 48px;
position: relative;
}
.training-page.content .frame {
display: flex;
align-items: flex-end;
justify-content: flex-end;
gap: 24px;
align-self: stretch;
width: 100%;
position: relative;
flex: 0 0 auto;
}
.training-page.content .page-title {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 16px 16px;
position: relative;
flex: 1;
flex-grow: 1;
}
.training-page.content .site-bookings {
position: relative;
width: fit-content;
margin-top: -1px;
font-family: var(--headings-macos-medium-h2-font-family);
font-weight: var(--headings-macos-medium-h2-font-weight);
color: #000000;
font-size: var(--headings-macos-medium-h2-font-size);
letter-spacing: var(--headings-macos-medium-h2-letter-spacing);
line-height: var(--headings-macos-medium-h2-line-height);
white-space: nowrap;
font-style: var(--headings-macos-medium-h2-font-style);
}
.training-page.content .header-sections {
display: flex;
align-items: flex-start;
gap: 24px;
padding: 0px 0px 6px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
.training-page.content .next-booking {
display: flex;
align-items: flex-start;
position: relative;
flex: 1;
align-self: stretch;
flex-grow: 1;
box-shadow: var(--shadow-md);
}
.training-page.content .image {
background-image: url(./inspector.png);
position: relative;
width: 176px;
height: 224px;
border-radius: 8px 0px 0px 8px;
background-size: cover;
background-position: 50% 50%;
}
.training-page.content .card {
flex-direction: column;
height: 224px;
align-items: flex-start;
gap: 16px;
padding: 24px;
flex: 1;
flex-grow: 1;
background-color: #00804a;
border-radius: 0px 8px 8px 0px;
display: flex;
position: relative;
}
.training-page.content .card-heading {
align-items: center;
gap: 16px;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
display: flex;
position: relative;
}
.training-page.content .text-wrapper {
position: relative;
width: fit-content;
margin-top: -1px;
font-family: var(--headings-macos-medium-h5-font-family);
font-weight: var(--headings-macos-medium-h5-font-weight);
color: var(--arcturus-styles-sys-color-text-inverse);
font-size: var(--headings-macos-medium-h5-font-size);
letter-spacing: var(--headings-macos-medium-h5-letter-spacing);
line-height: var(--headings-macos-medium-h5-line-height);
white-space: nowrap;
font-style: var(--headings-macos-medium-h5-font-style);
}
.training-page.content .card-content {
flex-direction: column;
align-items: flex-start;
justify-content: center;
gap: 24px;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
display: flex;
position: relative;
}
.training-page.content .div {
width: 390px;
position: relative;
align-self: stretch;
margin: 12px 0;
font-family: var(--comp-typography-body-macos-description-font-family);
font-weight: var(--comp-typography-body-macos-description-font-weight);
color: var(--arcturus-styles-sys-color-text-inverse);
font-size: var(--comp-typography-body-macos-description-font-size);
letter-spacing: var(--comp-typography-body-macos-description-letter-spacing);
line-height: var(--comp-typography-body-macos-description-line-height);
font-style: var(--comp-typography-body-macos-description-font-style);
}
.training-page.content .singular-button-wrapper {
display: inline-flex;
align-items: center;
gap: 8px;
position: relative;
flex: 0 0 auto;
}
.training-page.content .singular-button {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
padding: 4px 16px;
position: relative;
flex: 0 0 auto;
margin-top: -1px;
margin-bottom: -1px;
margin-left: -1px;
margin-right: -1px;
background-color: var(--arcturus-styles-sys-color-action-secondary-default);
border-radius: 50px;
border: 1px solid;
border-color: var(--arcturus-styles-sys-color-border-default);
}
.training-page.content .label {
position: relative;
width: fit-content;
margin-top: -0.5px;
font-family: "SF Pro Display-Semibold", Helvetica;
font-weight: 400;
color: var(--arcturus-styles-sys-color-text-default);
font-size: 16px;
text-align: center;
letter-spacing: 0.01px;
line-height: 24px;
white-space: nowrap;
}
.training-page.content .img {
position: relative;
width: 24px;
height: 24px;
}
.training-page.content .image-2 {
background-image: url(./people.png);
position: relative;
width: 176px;
height: 224px;
border-radius: 8px 0px 0px 8px;
background-size: cover;
background-position: 50% 50%;
}
.training-page.content .card-2 {
flex-direction: column;
height: 224px;
align-items: flex-start;
gap: 16px;
padding: 24px;
flex: 1;
flex-grow: 1;
background-color: #3c2869;
border-radius: 0px 8px 8px 0px;
display: flex;
position: relative;
}
.training-page.content .p {
position: relative;
flex: 1;
margin-top: -1px;
font-family: var(--headings-macos-medium-h5-font-family);
font-weight: var(--headings-macos-medium-h5-font-weight);
color: var(--arcturus-styles-sys-color-text-inverse);
font-size: var(--headings-macos-medium-h5-font-size);
letter-spacing: var(--headings-macos-medium-h5-letter-spacing);
line-height: var(--headings-macos-medium-h5-line-height);
font-style: var(--headings-macos-medium-h5-font-style);
}
.training-page.content .frame-2 {
display: flex;
flex-direction: column;
align-items: flex-start;
justify-content: center;
gap: 8px;
align-self: stretch;
width: 100%;
position: relative;
flex: 0 0 auto;
}
.training-page.content .text-wrapper-2 {
position: relative;
align-self: stretch;
margin-top: -1px;
font-family: var(--comp-typography-body-macos-paragraph-normal-font-family);
font-weight: var(--comp-typography-body-macos-paragraph-normal-font-weight);
color: var(--arcturus-styles-sys-color-text-inverse);
font-size: var(--comp-typography-body-macos-paragraph-normal-font-size);
letter-spacing: var(--comp-typography-body-macos-paragraph-normal-letter-spacing);
line-height: var(--comp-typography-body-macos-paragraph-normal-line-height);
font-style: var(--comp-typography-body-macos-paragraph-normal-font-style);
}
.training-page.content .singular-button-2 {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
padding: 4px 16px;
position: relative;
flex: 0 0 auto;
margin-bottom: -1px;
margin-left: -1px;
background-color: var(--arcturus-styles-sys-color-action-secondary-default);
border-radius: 50px;
border: 1px solid;
border-color: var(--arcturus-styles-sys-color-border-default);
}
.training-page.content .tables {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 40px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
.training-page.content .v-search {
display: flex;
flex-direction: column;
align-items: flex-end;
gap: 32px;
padding: 24px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
background-color: var(--surfacedefault);
border-radius: 8px;
box-shadow: 0px 2px 4px -2px #1018280f, 0px 4px 8px -2px #1018281a;
}
.training-page.content .frame-3 {
display: flex;
align-items: center;
gap: 24px;
align-self: stretch;
width: 100%;
position: relative;
flex: 0 0 auto;
}
.training-page.content .card-heading-2 {
display: flex;
align-items: center;
gap: 16px;
position: relative;
flex: 1;
flex-grow: 1;
}
.training-page.content .text-wrapper-3 {
position: relative;
width: fit-content;
margin-top: -1px;
font-family: var(--headings-macos-medium-h4-font-family);
font-weight: var(--headings-macos-medium-h4-font-weight);
color: var(--arcturus-styles-sys-color-text-default);
font-size: var(--headings-macos-medium-h4-font-size);
letter-spacing: var(--headings-macos-medium-h4-letter-spacing);
line-height: var(--headings-macos-medium-h4-line-height);
white-space: nowrap;
font-style: var(--headings-macos-medium-h4-font-style);
}
.training-page.content .rectangle {
position: relative;
align-self: stretch;
width: 1px;
background-color: var(--arcturus-styles-sys-color-surface-hover);
}
.training-page.content .text-wrapper-4 {
position: relative;
width: fit-content;
font-family: "SF Pro Text-Medium", Helvetica;
font-weight: 500;
color: var(--arcturus-styles-sys-color-text-subdued);
font-size: 16px;
letter-spacing: 0.01px;
line-height: 20px;
white-space: nowrap;
}
.training-page.content .controls {
display: inline-flex;
align-items: center;
justify-content: flex-end;
gap: 24px;
position: relative;
flex: 0 0 auto;
}
.training-page.content .search {
display: flex;
flex-direction: column;
width: 344px;
align-items: flex-start;
position: relative;
}
.training-page.content .field {
height: 32px;
align-items: center;
gap: 8px;
padding: 4px 12px;
background-color: var(--arcturus-styles-sys-color-surface-default);
border: 1px solid;
border-color: var(--arcturus-styles-sys-color-border-default-duplicate);
display: flex;
position: relative;
align-self: stretch;
width: 100%;
border-radius: 8px;
}
.training-page.content .prefix-iconbutton {
position: relative;
width: 24px;
height: 24px;
border-radius: 4px;
background-image: url(./img/search-1.svg);
background-size: 100% 100%;
}
.training-page.content .input-text {
position: relative;
flex: 1;
height: 32px;
margin-top: -5px;
margin-bottom: -3px;
font-family: "SF Pro Text-Regular", Helvetica;
font-weight: 400;
color: var(--arcturus-styles-sys-color-text-subdued);
font-size: 16px;
letter-spacing: 0.01px;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
background: transparent;
border: none;
padding: 0;
}
.training-page.content .view {
display: inline-flex;
align-items: center;
justify-content: flex-end;
gap: 8px;
position: relative;
flex: 0 0 auto;
}
.training-page.content .text-wrapper-5 {
position: relative;
width: fit-content;
font-family: "SF Pro Text-Regular", Helvetica;
font-weight: 400;
color: #000000;
font-size: 12px;
letter-spacing: 0.01px;
line-height: 18px;
white-space: nowrap;
}
.training-page.content .single-select {
display: flex;
flex-direction: column;
width: 197px;
align-items: flex-start;
gap: 4px;
position: relative;
}
.training-page.content .field-wrapper {
flex-direction: column;
align-items: flex-start;
gap: 4px;
flex: 0 0 auto;
display: flex;
position: relative;
align-self: stretch;
width: 100%;
border-radius: 8px;
}
.training-page.content .field-2 {
height: 32px;
align-items: center;
justify-content: flex-end;
gap: 8px;
padding: 4px 12px;
background-color: var(--arcturus-styles-sys-color-surface-default-duplicate);
border: 1px solid;
border-color: var(--arcturus-styles-sys-color-border-default);
display: flex;
position: relative;
align-self: stretch;
width: 100%;
border-radius: 8px;
}
.training-page.content .input-text-2 {
position: relative;
flex: 1;
margin-top: -1px;
font-family: var(--body-macos-paragraph-normal-font-family);
font-weight: var(--body-macos-paragraph-normal-font-weight);
color: var(--arcturus-styles-sys-color-text-default);
font-size: var(--body-macos-paragraph-normal-font-size);
letter-spacing: var(--body-macos-paragraph-normal-letter-spacing);
line-height: var(--body-macos-paragraph-normal-line-height);
font-style: var(--body-macos-paragraph-normal-font-style);
}
.training-page.content .suffix-icon {
position: relative;
width: var(--arcturus-styles-sys-sizing-icon-m);
height: var(--arcturus-styles-sys-sizing-icon-m);
background-image: url(./img/icon-51.svg);
background-size: 100% 100%;
}
.training-page.content .frame-4 {
display: inline-flex;
align-items: center;
justify-content: flex-end;
gap: 16px;
position: relative;
flex: 0 0 auto;
}
.training-page.content .div-2 {
display: flex;
flex-direction: column;
align-items: flex-start;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
.training-page.content .courses {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 24px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
.training-page.content .row {
display: flex;
align-items: flex-start;
gap: 24px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
.training-page.content .training-course-card {
display: flex;
flex-direction: column;
height: 220px;
align-items: flex-end;
justify-content: flex-end;
gap: 8px;
padding: 24px;
position: relative;
flex: 1;
flex-grow: 1;
z-index: 3;
background-color: var(--arcturus-styles-sys-color-surface-default);
border-radius: 8px;
border: 1px solid;
border-color: var(--arcturus-styles-sys-color-border-default-duplicate);
}
.training-page.content .information {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 8px;
position: relative;
flex: 1;
align-self: stretch;
width: 100%;
flex-grow: 1;
}
.training-page.content .training-icon {
position: relative;
width: 32px;
height: 32px;
background-image: url(./img/image-4-1.png);
background-size: cover;
background-position: 50% 50%;
}
.training-page.content .text-wrapper-6 {
position: relative;
align-self: stretch;
margin-top: -1px;
font-family: "SF Pro Text-Medium", Helvetica;
font-weight: 500;
color: var(--arcturus-styles-sys-color-text-default);
font-size: 16px;
letter-spacing: 0.01px;
line-height: 24px;
text-decoration: underline;
}
.training-page.content .training-course-card-2 {
z-index: 2;
display: flex;
flex-direction: column;
height: 220px;
align-items: flex-end;
justify-content: flex-end;
gap: 8px;
padding: 24px;
position: relative;
flex: 1;
flex-grow: 1;
background-color: var(--arcturus-styles-sys-color-surface-default);
border-radius: 8px;
border: 1px solid;
border-color: var(--arcturus-styles-sys-color-border-default-duplicate);
}
.training-page.content .training-icon-2 {
background-image: url(./img/image-4-9.png);
position: relative;
width: 32px;
height: 32px;
background-size: cover;
background-position: 50% 50%;
}
.training-page.content .training-course-card-3 {
z-index: 1;
display: flex;
flex-direction: column;
height: 220px;
align-items: flex-end;
justify-content: flex-end;
gap: 8px;
padding: 24px;
position: relative;
flex: 1;
flex-grow: 1;
background-color: var(--arcturus-styles-sys-color-surface-default);
border-radius: 8px;
border: 1px solid;
border-color: var(--arcturus-styles-sys-color-border-default-duplicate);
}
.training-page.content .training-icon-3 {
background-image: url(./img/image-7-2.png);
position: relative;
width: 32px;
height: 32px;
background-size: cover;
background-position: 50% 50%;
}
.training-page.content .training-course-card-4 {
z-index: 0;
display: flex;
flex-direction: column;
height: 220px;
align-items: flex-end;
justify-content: flex-end;
gap: 8px;
padding: 24px;
position: relative;
flex: 1;
flex-grow: 1;
background-color: var(--arcturus-styles-sys-color-surface-default);
border-radius: 8px;
border: 1px solid;
border-color: var(--arcturus-styles-sys-color-border-default-duplicate);
}
.training-page.content .CQI-IRCA-ISO {
position: relative;
align-self: stretch;
margin-top: -1px;
font-family: "SF Pro Display-Semibold", Helvetica;
font-weight: 400;
color: var(--arcturus-styles-sys-color-text-default);
font-size: 16px;
letter-spacing: 0.01px;
line-height: 20px;
text-decoration: underline;
}
.training-page.content .training-icon-4 {
background-image: url(./inspection.png);
position: relative;
width: 32px;
height: 32px;
background-size: cover;
background-position: 50% 50%;
}
.training-page.content .training-icon-5 {
background-image: url(./img/image-6-2.png);
position: relative;
width: 32px;
height: 32px;
background-size: cover;
background-position: 50% 50%;
}
/* Non-conformances-page */
.non-conformances-page.content {
display: flex;
flex-direction: column;
width: 1302px;
height: 1860px;
align-items: flex-start;
gap: 32px;
padding: 32px 48px;
position: relative;
}
.non-conformances-page.content .frame {
justify-content: flex-end;
gap: 24px;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
display: flex;
align-items: flex-end;
position: relative;
}
.non-conformances-page.content .page-title {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 16px 16px;
position: relative;
flex: 1;
flex-grow: 1;
}
.non-conformances-page.content .site-bookings {
position: relative;
width: fit-content;
margin-top: -1px;
font-family: var(--headings-macos-medium-h2-font-family);
font-weight: var(--headings-macos-medium-h2-font-weight);
color: #000000;
font-size: var(--headings-macos-medium-h2-font-size);
letter-spacing: var(--headings-macos-medium-h2-letter-spacing);
line-height: var(--headings-macos-medium-h2-line-height);
white-space: nowrap;
font-style: var(--headings-macos-medium-h2-font-style);
}
.non-conformances-page.content .tables {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 40px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
.non-conformances-page.content .upcoming {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 16px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
.non-conformances-page.content .table {
flex-direction: column;
align-items: flex-start;
gap: 32px;
padding: 24px;
background-color: var(--surfacedefault);
border-radius: 8px;
box-shadow: 0px 2px 4px -2px #1018280f, 0px 4px 8px -2px #1018281a;
display: flex;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
.non-conformances-page.content .div {
display: flex;
align-items: center;
gap: 24px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
.non-conformances-page.content .card-heading {
display: flex;
align-items: center;
gap: 16px;
position: relative;
flex: 1;
flex-grow: 1;
}
.non-conformances-page.content .text-wrapper {
position: relative;
width: fit-content;
margin-top: -1px;
font-family: var(--headings-macos-medium-h4-font-family);
font-weight: var(--headings-macos-medium-h4-font-weight);
color: var(--arcturus-styles-sys-color-text-default);
font-size: var(--headings-macos-medium-h4-font-size);
letter-spacing: var(--headings-macos-medium-h4-letter-spacing);
line-height: var(--headings-macos-medium-h4-line-height);
white-space: nowrap;
font-style: var(--headings-macos-medium-h4-font-style);
}
.non-conformances-page.content .rectangle {
position: relative;
align-self: stretch;
width: 1px;
background-color: var(--arcturus-styles-sys-color-surface-hover);
}
.non-conformances-page.content .text-wrapper-2 {
position: relative;
width: fit-content;
font-family: "SF Pro Text-Medium", Helvetica;
font-weight: 500;
color: var(--arcturus-styles-sys-color-text-subdued);
letter-spacing: 0.01px;
line-height: 20px;
white-space: nowrap;
margin-top: 5px;
}
.non-conformances-page.content .controls {
display: inline-flex;
align-items: center;
justify-content: flex-end;
gap: 24px;
position: relative;
flex: 0 0 auto;
}
.non-conformances-page.content .search {
display: flex;
flex-direction: column;
width: 264px;
align-items: flex-start;
position: relative;
}
.non-conformances-page.content .field {
height: 32px;
align-items: center;
gap: 8px;
padding: 4px 12px;
background-color: var(--arcturus-styles-sys-color-surface-default-duplicate);
border: 1px solid;
border-color: var(--arcturus-styles-sys-color-border-default-duplicate);
display: flex;
position: relative;
align-self: stretch;
width: 100%;
border-radius: 8px;
}
.non-conformances-page.content .prefix-iconbutton {
position: relative;
width: 24px;
height: 24px;
border-radius: 4px;
background-image: url(./img/search-1.svg);
background-size: 100% 100%;
}
.non-conformances-page.content .input-text {
position: relative;
flex: 1;
height: 32px;
margin-top: -5px;
margin-bottom: -3px;
font-family: "SF Pro Text-Regular", Helvetica;
font-weight: 400;
color: var(--arcturus-styles-sys-color-text-subdued);
font-size: 16px;
letter-spacing: 0.01px;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
background: transparent;
border: none;
padding: 0;
}
.non-conformances-page.content .filters {
gap: 16px;
display: inline-flex;
align-items: center;
justify-content: flex-end;
position: relative;
flex: 0 0 auto;
}
.non-conformances-page.content .div-2 {
gap: 8px;
display: inline-flex;
align-items: center;
justify-content: flex-end;
position: relative;
flex: 0 0 auto;
}
.non-conformances-page.content .text-wrapper-3 {
position: relative;
width: fit-content;
font-family: "SF Pro Text-Regular", Helvetica;
font-weight: 400;
color: #000000;
font-size: 12px;
letter-spacing: 0.01px;
line-height: 18px;
white-space: nowrap;
}
.non-conformances-page.content .single-select {
display: flex;
flex-direction: column;
width: 152px;
align-items: flex-start;
gap: 4px;
position: relative;
}
.non-conformances-page.content .field-wrapper {
flex-direction: column;
align-items: flex-start;
gap: 4px;
flex: 0 0 auto;
display: flex;
position: relative;
align-self: stretch;
width: 100%;
border-radius: 8px;
}
.non-conformances-page.content .field-2 {
height: 32px;
align-items: center;
justify-content: flex-end;
gap: 8px;
padding: 4px 12px;
background-color: var(--arcturus-styles-sys-color-surface-default);
border: 1px solid;
border-color: var(--arcturus-styles-sys-color-border-default);
display: flex;
position: relative;
align-self: stretch;
width: 100%;
border-radius: 8px;
}
.non-conformances-page.content .input-text-2 {
position: relative;
flex: 1;
margin-top: -1px;
font-family: "SF Pro Text-Regular", Helvetica;
font-weight: 400;
color: var(--arcturus-styles-sys-color-text-default);
font-size: 16px;
letter-spacing: 0.01px;
line-height: 24px;
}
.non-conformances-page.content .suffix-icon {
position: relative;
width: var(--arcturus-styles-sys-sizing-icon-m);
height: var(--arcturus-styles-sys-sizing-icon-m);
background-image: url(./img/icon-49.svg);
background-size: 100% 100%;
}
.non-conformances-page.content .div-3 {
flex-direction: column;
align-items: flex-start;
display: flex;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
.non-conformances-page.content .non-conf-table {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 0px 32px;
padding: 8px 16px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
background-color: var(--arcturus-styles-sys-color-surface-background);
border-bottom-width: 1px;
border-bottom-style: solid;
border-color: var(--arcturus-styles-sys-color-border-default);
}
.non-conformances-page.content .name-check-box {
display: flex;
width: 0;
align-items: center;
gap: 8px;
position: relative;
}
.non-conformances-page.content .text-wrapper-4 {
position: relative;
flex: 1;
margin-top: -1px;
font-family: var(--body-macos-description-font-family);
font-weight: var(--body-macos-description-font-weight);
color: var(--arcturus-styles-sys-color-text-default);
font-size: var(--body-macos-description-font-size);
letter-spacing: var(--body-macos-description-letter-spacing);
line-height: var(--body-macos-description-line-height);
font-style: var(--body-macos-description-font-style);
}
.non-conformances-page.content .text-wrapper-5 {
position: relative;
width: 80px;
height: 24px;
margin-top: -1px;
font-family: var(--body-macos-description-font-family);
font-weight: var(--body-macos-description-font-weight);
color: var(--textdefault);
font-size: var(--body-macos-description-font-size);
letter-spacing: var(--body-macos-description-letter-spacing);
line-height: var(--body-macos-description-line-height);
white-space: nowrap;
font-style: var(--body-macos-description-font-style);
}
.non-conformances-page.content .text-wrapper-6 {
position: relative;
width: 88px;
height: 24px;
margin-top: -1px;
font-family: var(--body-macos-description-font-family);
font-weight: var(--body-macos-description-font-weight);
color: var(--textdefault);
font-size: var(--body-macos-description-font-size);
letter-spacing: var(--body-macos-description-letter-spacing);
line-height: var(--body-macos-description-line-height);
white-space: nowrap;
font-style: var(--body-macos-description-font-style);
}
.non-conformances-page.content .text {
position: relative;
flex: 1;
height: 24px;
margin-top: -1px;
font-family: var(--body-macos-description-font-family);
font-weight: var(--body-macos-description-font-weight);
color: var(--textdefault);
font-size: var(--body-macos-description-font-size);
letter-spacing: var(--body-macos-description-letter-spacing);
line-height: var(--body-macos-description-line-height);
white-space: nowrap;
font-style: var(--body-macos-description-font-style);
}
.non-conformances-page.content .booking-row {
display: flex;
align-items: center;
gap: 32px;
padding: 24px 16px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
background-color: #ffffff;
border-bottom-width: 1px;
border-bottom-style: solid;
border-color: var(--arcturus-styles-sys-color-border-default);
}
.non-conformances-page.content .text-wrapper-7 {
position: relative;
width: 480px;
margin-top: -1px;
margin-right: -80px;
font-family: "SF Pro Text-Medium", Helvetica;
font-weight: 500;
color: var(--arcturus-styles-sys-color-text-default);
font-size: 16px;
letter-spacing: 0.01px;
line-height: 20px;
}
.non-conformances-page.content .text-wrapper-8 {
position: relative;
width: 80px;
font-family: var(--body-macos-paragraph-normal-font-family);
font-weight: var(--body-macos-paragraph-normal-font-weight);
color: var(--textdefault);
font-size: var(--body-macos-paragraph-normal-font-size);
letter-spacing: var(--body-macos-paragraph-normal-letter-spacing);
line-height: var(--body-macos-paragraph-normal-line-height);
font-style: var(--body-macos-paragraph-normal-font-style);
}
.non-conformances-page.content .div-wrapper {
position: relative;
width: 80px;
height: 24px;
}
.non-conformances-page.content .text-wrapper-9 {
position: absolute;
width: 80px;
height: 24px;
top: -1px;
left: 0;
font-family: var(--body-macos-paragraph-normal-font-family);
font-weight: var(--body-macos-paragraph-normal-font-weight);
color: var(--arcturus-styles-sys-color-text-default);
font-size: var(--body-macos-paragraph-normal-font-size);
letter-spacing: var(--body-macos-paragraph-normal-letter-spacing);
line-height: var(--body-macos-paragraph-normal-line-height);
white-space: nowrap;
font-style: var(--body-macos-paragraph-normal-font-style);
}
.non-conformances-page.content .booking-status {
position: relative;
width: 88px;
height: 24px;
}
.non-conformances-page.content .text-wrapper-10 {
width: 97px;
position: absolute;
height: 24px;
top: -1px;
left: 0;
font-family: var(--body-macos-paragraph-normal-font-family);
font-weight: var(--body-macos-paragraph-normal-font-weight);
color: var(--arcturus-styles-sys-color-text-default);
font-size: var(--body-macos-paragraph-normal-font-size);
letter-spacing: var(--body-macos-paragraph-normal-letter-spacing);
line-height: var(--body-macos-paragraph-normal-line-height);
white-space: nowrap;
font-style: var(--body-macos-paragraph-normal-font-style);
}
.non-conformances-page.content .text-wrapper-11 {
width: 88px;
position: absolute;
height: 24px;
top: -1px;
left: 0;
font-family: var(--body-macos-paragraph-normal-font-family);
font-weight: var(--body-macos-paragraph-normal-font-weight);
color: var(--arcturus-styles-sys-color-text-default);
font-size: var(--body-macos-paragraph-normal-font-size);
letter-spacing: var(--body-macos-paragraph-normal-letter-spacing);
line-height: var(--body-macos-paragraph-normal-line-height);
white-space: nowrap;
font-style: var(--body-macos-paragraph-normal-font-style);
}
.non-conformances-page.content .singular-button-wrapper {
flex-direction: column;
gap: 10px;
flex: 1;
flex-grow: 1;
display: flex;
align-items: flex-end;
position: relative;
}
.non-conformances-page.content .singular-button {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
padding: 4px 16px;
position: relative;
flex: 0 0 auto;
border-radius: 50px;
background-color: #fff;
}
.non-conformances-page.content .label {
position: relative;
width: fit-content;
font-family: "SF Pro Display-Semibold", Helvetica;
font-weight: 400;
color: var(--arcturus-styles-sys-color-text-default);
font-size: 16px;
text-align: center;
letter-spacing: 0.01px;
line-height: 24px;
white-space: nowrap;
}
.non-conformances-page.content .img {
position: relative;
width: 24px;
height: 24px;
}
.non-conformances-page.content .table-footer {
align-items: center;
gap: 48px;
padding: 24px 0px 16px;
background-color: #ffffff;
display: flex;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
.non-conformances-page.content .text-wrapper-12 {
position: relative;
width: 168px;
font-family: "SF Pro Text-Regular", Helvetica;
font-weight: 400;
color: var(--arcturus-styles-sys-color-text-subdued);
font-size: 14px;
letter-spacing: 0.01px;
line-height: 20px;
}
.non-conformances-page.content .icons {
display: flex;
align-items: center;
justify-content: flex-end;
gap: 16px;
position: relative;
flex: 1;
flex-grow: 1;
}
.non-conformances-page.content .first-page {
position: relative;
width: var(--arcturus-styles-sys-sizing-icon-m);
height: var(--arcturus-styles-sys-sizing-icon-m);
background-image: url(./img/icon-50.svg);
background-size: 100% 100%;
}
.non-conformances-page.content .last-page {
position: relative;
width: var(--arcturus-styles-sys-sizing-icon-m);
height: var(--arcturus-styles-sys-sizing-icon-m);
background-image: url(./img/icon-51.svg);
background-size: 100% 100%;
}
/* Sign-In Page */
.SSO .header {
display: flex;
align-items: center;
padding: 24px 32px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
background-color: var(--arcturus-styles-sys-color-surface-default);
}
.SSO .logo {
position: absolute;
left: 100px;
top: 0;
/* flex-direction: column; */
align-items: flex-start;
/* justify-content: center; */
/* gap: 10px; */
/* position: relative; */
flex: 1;
flex-grow: 1;
}
.SSO .ISOQAR-full-colour {
position: relative;
width: 131.75px;
height: 40px;
object-fit: cover;
}
.SSO .content {
/* display: flex; */
flex-direction: column;
/* align-items: center; */
/* gap: 39px; */
padding: 0px 225px;
position: relative;
align-self: stretch;
width: 100%;
margin-bottom: 34px;
flex: 0 0 auto;
}
.SSO .frame {
display: flex;
flex-direction: column;
gap: 24px;
align-self: stretch;
width: 100%;
align-items: center;
position: relative;
flex: 0 0 auto;
}
.SSO .text-wrapper {
position: relative;
align-self: stretch;
margin-top: 50px;
font-family: var(--headings-macos-medium-h3-font-family);
font-weight: var(--headings-macos-medium-h3-font-weight);
color: var(--textdefault);
font-size: var(--headings-macos-medium-h3-font-size);
text-align: center;
letter-spacing: var(--headings-macos-medium-h3-letter-spacing);
line-height: var(--headings-macos-medium-h3-line-height);
font-style: var(--headings-macos-medium-h3-font-style);
}
.SSO .group {
position: relative;
align-self: stretch;
width: 100%;
height: 152px;
}
.SSO .password {
display: flex;
flex-direction: column;
width: 500px;
align-items: flex-start;
gap: 4px;
position: absolute;
top: 88px;
left: 0;
}
.SSO .div {
position: relative;
/* align-self: stretch; */
/* margin-top: -1px; */
font-family: "Roboto", Helvetica;
font-weight: 400;
color: var(--textdefault);
font-size: 14px;
letter-spacing: 0.01px;
line-height: 20px;
}
.SSO .large {
display: flex;
height: 40px;
align-items: center;
justify-content: flex-end;
gap: 8px;
padding: 4px 12px;
position: relative;
align-self: stretch;
width: 100%;
background-color: var(--surfacedefault);
border-radius: 8px;
border: 1px solid;
border-color: var(--borderdefault);
}
.SSO .remove-red-eye-wrapper {
display: inline-flex;
justify-content: flex-end;
gap: 8px;
align-items: center;
position: relative;
flex: 0 0 auto;
}
.SSO .remove-red-eye {
position: relative;
width: 24px;
height: 24px;
}
.SSO .with-label {
display: flex;
flex-direction: column;
width: 500px;
align-items: flex-start;
gap: 4px;
position: absolute;
top: 0;
left: 0;
}
.SSO .label {
/* align-self: stretch; */
margin-top: -1px;
font-family: var(--body-macos-paragraph-small-font-family);
color: transparent;
font-size: var(--body-macos-paragraph-small-font-size);
line-height: var(--body-macos-paragraph-small-line-height);
position: relative;
font-weight: var(--body-macos-paragraph-small-font-weight);
letter-spacing: var(--body-macos-paragraph-small-letter-spacing);
font-style: var(--body-macos-paragraph-small-font-style);
}
.SSO .span {
color: #333333;
letter-spacing: var(--body-macos-paragraph-small-letter-spacing);
font-family: var(--body-macos-paragraph-small-font-family);
font-style: var(--body-macos-paragraph-small-font-style);
font-weight: var(--body-macos-paragraph-small-font-weight);
line-height: var(--body-macos-paragraph-small-line-height);
font-size: var(--body-macos-paragraph-small-font-size);
}
.SSO .text-wrapper-2 {
color: #c40000;
letter-spacing: var(--body-macos-paragraph-small-letter-spacing);
font-family: var(--body-macos-paragraph-small-font-family);
font-style: var(--body-macos-paragraph-small-font-style);
font-weight: var(--body-macos-paragraph-small-font-weight);
line-height: var(--body-macos-paragraph-small-line-height);
font-size: var(--body-macos-paragraph-small-font-size);
}
.SSO .big-no-default {
display: flex;
height: 40px;
align-items: center;
gap: 8px;
padding: 4px 12px;
position: relative;
align-self: stretch;
width: 100%;
background-color: var(--surfacedefault);
border-radius: 8px;
border: 1px solid;
border-color: var(--borderdefault);
}
.SSO .label-wrapper {
display: flex;
align-items: flex-start;
gap: 8px;
position: relative;
flex: 1;
flex-grow: 1;
}
.SSO .label-2 {
flex: 1;
margin-top: -1px;
font-family: "SF Pro Text-Regular", Helvetica;
color: var(--textdefault);
font-size: 16px;
line-height: 24px;
position: relative;
font-weight: 400;
letter-spacing: 0.01px;
}
.SSO .singular-button {
display: flex;
align-items: center;
justify-content: center;
gap: 12px;
padding: 12px 24px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
background-color: var(--arcturus-styles-sys-color-action-primary-disabled);
border-radius: 50px;
}
.SSO .label-3 {
width: fit-content;
font-family: var(--components-desktop-button-text-large-font-family);
color: var(--arcturus-styles-sys-color-text-disabled);
font-size: var(--components-desktop-button-text-large-font-size);
text-align: center;
line-height: var(--components-desktop-button-text-large-line-height);
white-space: nowrap;
position: relative;
font-weight: var(--components-desktop-button-text-large-font-weight);
letter-spacing: var(--components-desktop-button-text-large-letter-spacing);
font-style: var(--components-desktop-button-text-large-font-style);
}
.SSO .text-wrapper-3 {
position: relative;
width: 488px;
height: 23px;
font-family: var(--body-macos-link-default-font-family);
font-weight: var(--body-macos-link-default-font-weight);
color: var(--textdefault);
font-size: var(--body-macos-link-default-font-size);
text-align: center;
letter-spacing: var(--body-macos-link-default-letter-spacing);
line-height: var(--body-macos-link-default-line-height);
text-decoration: underline;
white-space: nowrap;
font-style: var(--body-macos-link-default-font-style);
}
.SSO .divider {
position: relative;
width: 488px;
height: 24px;
}
.SSO .line {
position: absolute;
width: 488px;
height: 2px;
top: 10px;
left: 0;
}
.SSO .div-wrapper {
display: flex;
width: 488px;
align-items: center;
justify-content: center;
gap: 12px;
padding: 12px 24px;
position: relative;
flex: 0 0 auto;
background-color: var(--arcturus-styles-sys-color-action-secondary-default);
border-radius: 50px;
border: 1px solid;
border-color: var(--arcturus-styles-sys-color-border-default);
}
.SSO .label-4 {
width: fit-content;
margin-top: -1px;
font-family: "SF Pro Display-Semibold", Helvetica;
color: var(--arcturus-styles-sys-color-text-default);
font-size: 20px;
text-align: center;
line-height: 24px;
white-space: nowrap;
position: relative;
font-weight: 400;
letter-spacing: 0.01px;
}
.SSO .policy {
position: relative;
align-self: stretch;
width: 100%;
height: 48px;
}
.SSO .by-using-the-system {
position: absolute;
width: 500px;
top: -1px;
left: 0;
font-family: "Montserrat", Helvetica;
font-weight: 400;
color: var(--textdefault);
font-size: 14px;
text-align: center;
letter-spacing: 0.01px;
line-height: 20px;
}
.SSO .text-wrapper-4 {
letter-spacing: var(--body-web-center-description-letter-spacing);
font-family: var(--body-web-center-description-font-family);
font-style: var(--body-web-center-description-font-style);
font-weight: var(--body-web-center-description-font-weight);
line-height: var(--body-web-center-description-line-height);
font-size: var(--body-web-center-description-font-size);
}
.SSO .text-wrapper-5 {
font-family: var(--body-macos-description-font-family);
letter-spacing: var(--body-macos-description-letter-spacing);
font-style: var(--body-macos-description-font-style);
font-weight: var(--body-macos-description-font-weight);
line-height: var(--body-macos-description-line-height);
font-size: var(--body-macos-description-font-size);
}
.SSO .text-wrapper-6 {
font-family: var(--body-macos-description-link-font-family);
font-weight: var(--body-macos-description-link-font-weight);
letter-spacing: var(--body-macos-description-link-letter-spacing);
text-decoration: underline;
font-style: var(--body-macos-description-link-font-style);
line-height: var(--body-macos-description-link-line-height);
font-size: var(--body-macos-description-link-font-size);
}
/* styles.css */
body,
html {
margin: 0;
padding: 0;
height: 100%;
font-family: Arial, sans-serif;
}
.SSO {
display: flex;
flex-direction: column;
height: 100%;
}
.header {
background-color: #333;
padding: 10px;
text-align: center;
color: white;
}
.grid-container {
display: grid;
grid-template-columns: 1fr 1fr;
/* Two columns of equal width */
height: calc(100% - 50px);
/* Adjust based on header height */
}
.grid-child {
display: flex;
align-items: center;
justify-content: center;
padding: 20px;
}
div#bookings-main_wrapper {
padding: 26px;
background: #fff;
}
.logo img {
max-width: 100%;
height: auto;
}
.content .frame {
text-align: center;
}
.group .password,
.group .with-label {
margin-bottom: 20px;
}
.singular-button {
background-color: #444;
padding: 10px;
color: white;
cursor: pointer;
}
.policy p {
font-size: 12px;
}
/* styles.css */
body,
html {
margin: 0;
padding: 0;
height: 100%;
font-family: Arial, sans-serif;
}
.SSO {
display: flex;
flex-direction: column;
height: 100%;
}
.header {
background-color: #333;
padding: 10px;
text-align: center;
color: white;
}
.grid-container {
display: grid;
grid-template-columns: 1fr 1fr;
/* Two columns of equal width */
height: calc(100% - 50px);
/* Adjust based on header height */
}
.grid-child {
display: flex;
align-items: center;
justify-content: center;
}
.hero-image-v {
position: relative;
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
background-color: var(--arcturus-styles-sys-color-surface-default);
}
.hero-image-v img {
width: 100%;
height: 100%;
max-width: 100%;
max-height: 100%;
object-fit: cover;
}
.logo img {
max-width: 100%;
height: auto;
}
.content .frame {
text-align: center;
}
.crmEntityFormView .cell {
padding: 20px 25px 24px !important;
}
.group .password,
.group .with-label {
margin-bottom: 20px;
}
.singular-button {
background-color: #444;
padding: 10px;
color: white;
cursor: pointer;
}
.policy p {
font-size: 12px;
}
.bg {
background: #fff;
}
/* Xait */
form#regForm {
background: #fff;
padding: 200px;
width: 100%;
border-radius: 10px;
height: auto;
margin-top: 30px;
}
form#regForm input {
width: 100%;
padding: 15px 120px;
margin: 8px 0;
box-sizing: border-box;
border-radius: 9px;
border: 1px #bdbdbd solid;
}
.form-box {
background: #fff;
padding: 68px;
height: 425px;
border-radius: 20px;
}
.form-box p {
padding: 20px 0;
}
form#emailForm {
padding: 0px 0px 23px 0px;
}
input#emailInput {
padding: 13px 21px;
margin-left: 12px;
width: 70%;
}
input#codeInput {
padding: 13px 21px;
margin-left: 12px;
width: 70%;
}
p#message1 {
padding-bottom: 30px;
}
a#marketing-button {
margin: 100px 0;
}
.width-1{
width: 100px;
}
.width-2{
width: 200px;
}
.width-3{
width: 300px;
}
.width-4{
width: 400px;
}
.button-primary {
width: 120px;
display: inline-block;
font-weight: 400;
color: #fff;
text-align: center;
vertical-align: middle;
user-select: none;
background-color: #0072c2;
border: 1px solid #0072c2;
padding: 0.3rem 0.6rem;
font-size: 1.2rem;
line-height: 1.3;
border-radius: 2.25rem;
transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
text-decoration: none;
}
.button-primary-1 {
display: inline-block;
font-weight: 400;
color: #fff;
text-align: center;
vertical-align: middle;
user-select: none;
background-color: #0072c2;
border: 1px solid #0072c2;
padding: 0.3rem 0.6rem;
font-size: 1.2rem;
line-height: 1.3;
border-radius: 2.25rem;
transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
text-decoration: none;
}
.button-primary:hover {
background-color: #0056b3;
border-color: #0056b3;
color: #fff;
}
.button-primary:focus,
.button-primary:active {
background-color: #0056b3;
border-color: #0056b3;
color: #fff;
outline: none;
box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.5);
}
/* x-session Page */
.x-session-page.content {
display: flex;
flex-direction: column;
width: 1302px;
height: 1860px;
align-items: flex-start;
gap: 32px;
padding: 32px 48px;
position: relative;
}
.x-session-page.content .frame {
display: flex;
align-items: flex-end;
justify-content: flex-end;
gap: 24px;
align-self: stretch;
width: 100%;
position: relative;
flex: 0 0 auto;
}
.x-session-page.content .page-title {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 16px 16px;
position: relative;
flex: 1;
flex-grow: 1;
}
.x-session-page.content .site-bookings {
position: relative;
width: fit-content;
margin-top: -1px;
font-family: var(--headings-macos-medium-h2-font-family);
font-weight: var(--headings-macos-medium-h2-font-weight);
color: #000000;
font-size: var(--headings-macos-medium-h2-font-size);
letter-spacing: var(--headings-macos-medium-h2-letter-spacing);
line-height: var(--headings-macos-medium-h2-line-height);
white-space: nowrap;
font-style: var(--headings-macos-medium-h2-font-style);
}
.x-session-page.content .tables {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 40px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
.x-session-page.content .v-search {
display: flex;
flex-direction: column;
align-items: flex-end;
gap: 24px;
padding: 24px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
background-color: var(--surfacedefault);
border-radius: 8px;
box-shadow: 0px 2px 4px -2px #1018280f, 0px 4px 8px -2px #1018281a;
}
.x-session-page.content .div {
display: flex;
align-items: center;
gap: 24px;
align-self: stretch;
width: 100%;
position: relative;
flex: 0 0 auto;
}
.x-session-page.content .card-heading {
display: flex;
align-items: center;
gap: 16px;
position: relative;
flex: 1;
flex-grow: 1;
}
.x-session-page.content .text-wrapper {
position: relative;
width: fit-content;
margin-top: -1px;
font-family: var(--headings-macos-medium-h4-font-family);
font-weight: var(--headings-macos-medium-h4-font-weight);
color: var(--arcturus-styles-sys-color-text-default);
font-size: var(--headings-macos-medium-h4-font-size);
letter-spacing: var(--headings-macos-medium-h4-letter-spacing);
line-height: var(--headings-macos-medium-h4-line-height);
white-space: nowrap;
font-style: var(--headings-macos-medium-h4-font-style);
}
.x-session-page.content .rectangle {
position: relative;
align-self: stretch;
width: 1px;
background-color: var(--arcturus-styles-sys-color-surface-hover);
}
.x-session-page.content .text-wrapper-2 {
position: relative;
width: fit-content;
font-family: "SF Pro Text-Medium", Helvetica;
font-weight: 500;
color: var(--arcturus-styles-sys-color-text-subdued);
font-size: 16px;
letter-spacing: 0.01px;
line-height: 20px;
white-space: nowrap;
}
.x-session-page.content .controls {
display: inline-flex;
align-items: center;
justify-content: flex-end;
gap: 24px;
position: relative;
flex: 0 0 auto;
}
.x-session-page.content .search {
display: flex;
flex-direction: column;
width: 344px;
align-items: flex-start;
position: relative;
}
.x-session-page.content .field {
height: 32px;
align-items: center;
gap: 8px;
padding: 4px 12px;
background-color: var(--arcturus-styles-sys-color-surface-default-duplicate);
border: 1px solid;
border-color: var(--arcturus-styles-sys-color-border-default-duplicate);
display: flex;
position: relative;
align-self: stretch;
width: 100%;
border-radius: 8px;
}
.x-session-page.content .prefix-iconbutton {
position: relative;
width: 24px;
height: 24px;
border-radius: 4px;
background-image: url(./img/search-1.svg);
background-size: 100% 100%;
}
.x-session-page.content .input-text {
position: relative;
flex: 1;
height: 32px;
margin-top: -5px;
margin-bottom: -3px;
font-family: "SF Pro Text-Regular", Helvetica;
font-weight: 400;
color: var(--arcturus-styles-sys-color-text-subdued);
font-size: 16px;
letter-spacing: 0.01px;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
background: transparent;
border: none;
padding: 0;
}
.x-session-page.content .view {
display: inline-flex;
align-items: center;
justify-content: flex-end;
gap: 8px;
position: relative;
flex: 0 0 auto;
}
.x-session-page.content .text-wrapper-3 {
position: relative;
width: fit-content;
font-family: "SF Pro Text-Regular", Helvetica;
font-weight: 400;
color: #000000;
font-size: 12px;
letter-spacing: 0.01px;
line-height: 18px;
white-space: nowrap;
}
.x-session-page.content .single-select {
display: flex;
flex-direction: column;
width: 197px;
align-items: flex-start;
gap: 4px;
position: relative;
}
.x-session-page.content .field-wrapper {
flex-direction: column;
align-items: flex-start;
gap: 4px;
flex: 0 0 auto;
display: flex;
position: relative;
align-self: stretch;
width: 100%;
border-radius: 8px;
}
.x-session-page.content .field-2 {
height: 32px;
align-items: center;
justify-content: flex-end;
gap: 8px;
padding: 4px 12px;
background-color: var(--arcturus-styles-sys-color-surface-default);
border: 1px solid;
border-color: var(--arcturus-styles-sys-color-border-default);
display: flex;
position: relative;
align-self: stretch;
width: 100%;
border-radius: 8px;
}
.x-session-page.content .input-text-2 {
position: relative;
flex: 1;
margin-top: -1px;
font-family: "SF Pro Text-Regular", Helvetica;
font-weight: 400;
color: var(--arcturus-styles-sys-color-text-default);
font-size: 16px;
letter-spacing: 0.01px;
line-height: 24px;
}
.x-session-page.content .suffix-icon {
position: relative;
width: var(--arcturus-styles-sys-sizing-icon-m);
height: var(--arcturus-styles-sys-sizing-icon-m);
background-image: url(./img/icon-48.svg);
background-size: 100% 100%;
}
.x-session-page.content .div-2 {
display: inline-flex;
align-items: center;
justify-content: flex-end;
gap: 16px;
position: relative;
flex: 0 0 auto;
}
.x-session-page.content .img {
position: relative;
width: 24px;
height: 24px;
}
.x-session-page.content .div-3 {
flex-direction: column;
align-items: flex-start;
display: flex;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
.x-session-page.content .x-session-table-header {
display: flex;
flex-wrap: wrap;
width: 1158px;
align-items: flex-start;
gap: 0px 32px;
padding: 8px 16px;
position: relative;
flex: 0 0 auto;
background-color: var(--arcturus-styles-sys-color-surface-background);
border-bottom-width: 1px;
border-bottom-style: solid;
border-color: var(--arcturus-styles-sys-color-border-default);
}
.x-session-page.content .name-check-box {
display: flex;
align-items: center;
gap: 8px;
position: relative;
flex: 1;
flex-grow: 1;
}
.x-session-page.content .checkbox {
display: inline-flex;
align-items: flex-start;
gap: 8px;
position: relative;
flex: 0 0 auto;
}
.x-session-page.content .inner-rectangle {
position: relative;
width: 18px;
height: 18px;
top: 3px;
left: 3px;
background-color: var(--arcturus-styles-sys-color-surface-default);
border-radius: 2px;
border: 2px solid;
border-color: var(--arcturus-styles-sys-color-border-default);
}
.x-session-page.content .text-wrapper-4 {
position: relative;
flex: 1;
font-family: var(--body-macos-description-font-family);
font-weight: var(--body-macos-description-font-weight);
color: var(--arcturus-styles-sys-color-text-default);
font-size: var(--body-macos-description-font-size);
letter-spacing: var(--body-macos-description-letter-spacing);
line-height: var(--body-macos-description-line-height);
font-style: var(--body-macos-description-font-style);
}
.x-session-page.content .text-wrapper-5 {
position: relative;
width: 192px;
height: 24px;
margin-top: -1px;
font-family: var(--body-macos-description-font-family);
font-weight: var(--body-macos-description-font-weight);
color: var(--textdefault);
font-size: var(--body-macos-description-font-size);
letter-spacing: var(--body-macos-description-letter-spacing);
line-height: var(--body-macos-description-line-height);
white-space: nowrap;
font-style: var(--body-macos-description-font-style);
}
.x-session-page.content .text-wrapper-6 {
position: relative;
width: 104px;
height: 24px;
margin-top: -1px;
font-family: var(--body-macos-description-font-family);
font-weight: var(--body-macos-description-font-weight);
color: var(--textdefault);
font-size: var(--body-macos-description-font-size);
letter-spacing: var(--body-macos-description-letter-spacing);
line-height: var(--body-macos-description-line-height);
white-space: nowrap;
font-style: var(--body-macos-description-font-style);
}
.x-session-page.content .text-wrapper-7 {
width: 96px;
position: relative;
height: 24px;
margin-top: -1px;
font-family: var(--body-macos-description-font-family);
font-weight: var(--body-macos-description-font-weight);
color: var(--textdefault);
font-size: var(--body-macos-description-font-size);
letter-spacing: var(--body-macos-description-letter-spacing);
line-height: var(--body-macos-description-line-height);
white-space: nowrap;
font-style: var(--body-macos-description-font-style);
}
.x-session-page.content .text-wrapper-8 {
width: 128px;
position: relative;
height: 24px;
margin-top: -1px;
font-family: var(--body-macos-description-font-family);
font-weight: var(--body-macos-description-font-weight);
color: var(--textdefault);
font-size: var(--body-macos-description-font-size);
letter-spacing: var(--body-macos-description-letter-spacing);
line-height: var(--body-macos-description-line-height);
white-space: nowrap;
font-style: var(--body-macos-description-font-style);
}
.x-session-page.content .x-session-row {
display: flex;
align-items: center;
gap: 32px;
padding: 24px 16px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
background-color: #ffffff;
border-bottom-width: 1px;
border-bottom-style: solid;
border-color: var(--arcturus-styles-sys-color-border-default);
}
.x-session-page.content .text-wrapper-9 {
position: relative;
flex: 1;
margin-top: -1px;
font-family: "SF Pro Text-Medium", Helvetica;
font-weight: 500;
color: var(--arcturus-styles-sys-color-text-default);
font-size: 16px;
letter-spacing: 0.01px;
line-height: 24px;
text-decoration: underline;
}
.x-session-page.content .text-wrapper-10 {
position: relative;
width: 281px;
margin-top: -1px;
font-family: var(--body-macos-paragraph-normal-font-family);
font-weight: var(--body-macos-paragraph-normal-font-weight);
color: var(--textdefault);
font-size: var(--body-macos-paragraph-normal-font-size);
letter-spacing: var(--body-macos-paragraph-normal-letter-spacing);
line-height: var(--body-macos-paragraph-normal-line-height);
font-style: var(--body-macos-paragraph-normal-font-style);
}
.x-session-page.content .text-wrapper-11 {
position: relative;
width: 104px;
margin-top: -1px;
font-family: var(--body-macos-paragraph-normal-font-family);
font-weight: var(--body-macos-paragraph-normal-font-weight);
color: var(--arcturus-styles-sys-color-text-default);
font-size: var(--body-macos-paragraph-normal-font-size);
letter-spacing: var(--body-macos-paragraph-normal-letter-spacing);
line-height: var(--body-macos-paragraph-normal-line-height);
font-style: var(--body-macos-paragraph-normal-font-style);
}
.x-session-page.content .text-wrapper-12 {
position: relative;
width: 96px;
margin-top: -1px;
font-family: var(--body-macos-paragraph-normal-font-family);
font-weight: var(--body-macos-paragraph-normal-font-weight);
color: var(--textdefault);
font-size: var(--body-macos-paragraph-normal-font-size);
letter-spacing: var(--body-macos-paragraph-normal-letter-spacing);
line-height: var(--body-macos-paragraph-normal-line-height);
font-style: var(--body-macos-paragraph-normal-font-style);
}
span.auditor-name {
font-size: 14px;
}
.x-session-page.content .text-wrapper-13 {
position: relative;
width: 120px;
margin-top: -1px;
font-family: var(--body-macos-paragraph-normal-font-family);
font-weight: var(--body-macos-paragraph-normal-font-weight);
color: var(--textdefault);
font-size: var(--body-macos-paragraph-normal-font-size);
letter-spacing: var(--body-macos-paragraph-normal-letter-spacing);
line-height: var(--body-macos-paragraph-normal-line-height);
font-style: var(--body-macos-paragraph-normal-font-style);
}
.x-session-page.content .bookmark-border {
background-image: url(./img/icon-6.svg);
position: relative;
width: var(--arcturus-styles-sys-sizing-icon-m);
height: var(--arcturus-styles-sys-sizing-icon-m);
background-size: 100% 100%;
}
.x-session-page.content .table-footer {
align-items: center;
gap: 48px;
padding: 24px 0px;
background-color: #ffffff;
display: flex;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
.x-session-page.content .text-wrapper-14 {
position: relative;
width: 168px;
font-family: "SF Pro Text-Regular", Helvetica;
font-weight: 400;
color: var(--arcturus-styles-sys-color-text-subdued);
font-size: 14px;
letter-spacing: 0.01px;
line-height: 20px;
}
.x-session-page.content .icons {
display: flex;
flex: 1;
flex-grow: 1;
align-items: center;
justify-content: flex-end;
gap: 16px;
position: relative;
}
.x-session-page.content .first-page {
position: relative;
width: var(--arcturus-styles-sys-sizing-icon-m);
height: var(--arcturus-styles-sys-sizing-icon-m);
background-image: url(./img/icon-58.svg);
background-size: 100% 100%;
}
.x-session-page.content .last-page {
position: relative;
width: var(--arcturus-styles-sys-sizing-icon-m);
height: var(--arcturus-styles-sys-sizing-icon-m);
background-image: url(./img/icon-59.svg);
background-size: 100% 100%;
}
/* slide-out page */
.popup {
position: absolute;
width: 100%;
height: 2630px;
display: none;
justify-content: center;
align-items: center;
overflow: hidden;
/* background-color: aqua; */
}
/* Manage Account */
.sites {
width: 100%;
/* Full width of container */
overflow: hidden;
/* Ensure no overflow issues */
margin: 50px;
font-size: 16px;
}
.site-row {
width: 47%;
/* Each column will take 48% of the width */
float: left;
/* Float each address row to the left */
margin-right: 10;
/* Add some space between columns */
box-sizing: border-box;
margin-bottom: 20px;
/* Space between rows */
padding-right: 212px;
}
.site-row:nth-child(2n+1) {
clear: left;
/* Clear float after every two rows */
}
.site-list {
padding: 10px;
border-radius: 5px;
}
.text-wrapper-10 {
font-weight: bold;
/* margin-bottom: 10px; */
}
.site-item {
margin-bottom: 6px;
}
.site-item.bold-address {
font-weight: 600;
}
.manage-account.content {
display: flex;
flex-direction: column;
width: 1302px;
height: 1860px;
align-items: flex-start;
gap: 32px;
padding: 32px 48px;
position: relative;
}
.manage-account.content .frame {
display: flex;
justify-content: center;
gap: 10px;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
align-items: flex-start;
position: relative;
}
.manage-account.content .div {
display: inline-flex;
flex-direction: column;
gap: 24px;
flex: 0 0 auto;
align-items: flex-start;
position: relative;
}
.manage-account.content .header-exit {
display: flex;
align-items: flex-start;
gap: 10px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
.manage-account.content .text-wrapper {
position: relative;
flex: 1;
margin-top: -1px;
font-family: var(--headings-macos-medium-h4-font-family);
font-weight: var(--headings-macos-medium-h4-font-weight);
color: var(--textdefault);
font-size: var(--headings-macos-medium-h4-font-size);
letter-spacing: var(--headings-macos-medium-h4-letter-spacing);
line-height: var(--headings-macos-medium-h4-line-height);
font-style: var(--headings-macos-medium-h4-font-style);
}
.manage-account.content .singular-button {
all: unset;
box-sizing: border-box;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
padding: 4px 16px;
position: relative;
flex: 0 0 auto;
margin-top: -1px;
margin-bottom: -1px;
margin-right: -1px;
background-color: var(--arcturus-styles-sys-color-action-secondary-default);
border-radius: 50px;
border: 1px solid;
border-color: var(--arcturus-styles-sys-color-border-default);
}
.manage-account.content .prefix-icon {
position: relative;
width: var(--arcturus-styles-sys-sizing-icon-m);
height: var(--arcturus-styles-sys-sizing-icon-m);
background-image: url(./img/icon-10.svg);
background-size: 100% 100%;
}
.manage-account.content .label {
position: relative;
width: fit-content;
margin-top: -0.5px;
font-family: "SF Pro Display-Semibold", Helvetica;
color: var(--arcturus-styles-sys-color-text-default);
text-align: center;
white-space: nowrap;
font-weight: 400;
font-size: 16px;
letter-spacing: 0.01px;
line-height: 24px;
}
.manage-account.content {
display: flex;
flex-direction: column;
gap: 32px;
padding: 24px;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
background-color: var(--surfacedefault);
border-radius: 8px;
box-shadow: 0px 2px 4px -2px #1018280f, 0px 4px 8px -2px #1018281a;
align-items: flex-start;
position: relative;
}
.manage-account.content .frame-2 {
display: flex;
flex-direction: column;
gap: 24px;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
align-items: flex-start;
position: relative;
}
.manage-account.content .heading {
gap: 66px;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
display: flex;
align-items: flex-start;
position: relative;
}
.manage-account.content .div-3 {
flex-direction: column;
gap: 4px;
flex: 1;
flex-grow: 1;
display: flex;
align-items: flex-start;
position: relative;
}
.manage-account.content .text-wrapper-2 {
position: relative;
align-self: stretch;
margin-top: 25px;
margin-bottom: 12px;
font-family: var(--headings-macos-medium-h4-font-family);
font-weight: var(--headings-macos-medium-h4-font-weight);
color: var(--textdefault);
font-size: var(--headings-macos-medium-h4-font-size);
letter-spacing: var(--headings-macos-medium-h4-letter-spacing);
line-height: var(--headings-macos-medium-h4-line-height);
font-style: var(--headings-macos-medium-h4-font-style);
}
.manage-account.content .div-4 {
display: flex;
gap: 24px;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
align-items: flex-start;
position: relative;
}
.manage-account.content .thumbnail {
border-radius: 60px;
position: relative;
width: 104px;
height: 104px;
}
.manage-account.content .frame-3 {
display: flex;
flex-direction: column;
justify-content: center;
gap: 16px;
flex: 1;
flex-grow: 1;
align-items: flex-start;
position: relative;
}
.manage-account.content .plaintext-w-label {
position: relative;
width: 147.75px;
height: 48px;
}
.manage-account.content .text-wrapper-3 {
position: absolute;
/* width: 148px; */
top: -1px;
left: 0;
font-family: var(--comp-typography-headings-macos-bold-h6-font-family);
font-weight: var(--comp-typography-headings-macos-bold-h6-font-weight);
color: var(--textdefault);
font-size: var(--comp-typography-headings-macos-bold-h6-font-size);
letter-spacing: var(--comp-typography-headings-macos-bold-h6-letter-spacing);
line-height: var(--comp-typography-headings-macos-bold-h6-line-height);
font-style: var(--comp-typography-headings-macos-bold-h6-font-style);
}
.manage-account.content .label-2 {
position: absolute;
top: 23px;
left: 0;
font-family: var(--body-macos-paragraph-normal-font-family);
color: var(--textdefault);
white-space: nowrap;
font-weight: var(--body-macos-paragraph-normal-font-weight);
font-size: var(--body-macos-paragraph-normal-font-size);
letter-spacing: var(--body-macos-paragraph-normal-letter-spacing);
line-height: var(--body-macos-paragraph-normal-line-height);
font-style: var(--body-macos-paragraph-normal-font-style);
}
.manage-account.content .text-wrapper-4 {
position: absolute;
width: 361px;
top: -23px;
left: 0;
font-family: var(--comp-typography-headings-macos-semibold-h6-font-family);
font-weight: var(--comp-typography-headings-macos-semibold-h6-font-weight);
color: var(--textdefault);
font-size: var(--comp-typography-headings-macos-semibold-h6-font-size);
letter-spacing: var(--comp-typography-headings-macos-semibold-h6-letter-spacing);
line-height: var(--comp-typography-headings-macos-semibold-h6-line-height);
font-style: var(--comp-typography-headings-macos-semibold-h6-font-style);
}
.manage-account.content .label-wrapper {
all: unset;
box-sizing: border-box;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
padding: 8px 24px;
position: relative;
flex: 0 0 auto;
margin-top: -1px;
margin-right: -1px;
background-color: var(--arcturus-styles-sys-color-action-secondary-default);
border-radius: 50px;
border: 1px solid;
border-color: var(--arcturus-styles-sys-color-border-default);
}
.manage-account.content .frame-4 {
display: flex;
flex-direction: column;
width: 585px;
gap: 24px;
flex: 0 0 auto;
align-items: flex-start;
position: relative;
}
.manage-account.content .plaintext-w-label-2 {
height: 48px;
position: relative;
flex: 1;
flex-grow: 1;
}
.manage-account.content .text-wrapper-5 {
font-weight: 600;
position: absolute;
width: 328px;
top: 5px;
left: 0;
font-family: var(--comp-typography-headings-macos-semibold-h6-font-family);
font-weight: 700;
color: var(--textdefault);
font-size: var(--comp-typography-headings-macos-semibold-h6-font-size);
letter-spacing: var(--comp-typography-headings-macos-semibold-h6-letter-spacing);
line-height: var(--comp-typography-headings-macos-semibold-h6-line-height);
font-style: var(--comp-typography-headings-macos-semibold-h6-font-style);
}
.manage-account.content .label-44 {
font-weight: 600;
position: absolute;
width: 328px;
top: 25px;
left: 0;
font-family: var(--comp-typography-headings-macos-semibold-h6-font-family);
font-weight: 700;
color: var(--textdefault);
font-size: var(--comp-typography-headings-macos-semibold-h6-font-size);
letter-spacing: var(--comp-typography-headings-macos-semibold-h6-letter-spacing);
line-height: var(--comp-typography-headings-macos-semibold-h6-line-height);
font-style: var(--comp-typography-headings-macos-semibold-h6-font-style);
}
.manage-account.content .text-wrapper-4 {
position: absolute;
width: 296px;
top: 5px;
left: 0;
font-family: var(--comp-typography-headings-macos-semibold-h6-font-family);
font-weight: 700;
color: var(--textdefault);
font-size: var(--comp-typography-headings-macos-semibold-h6-font-size);
letter-spacing: var(--comp-typography-headings-macos-semibold-h6-letter-spacing);
line-height: var(--comp-typography-headings-macos-semibold-h6-line-height);
font-style: var(--comp-typography-headings-macos-semibold-h6-font-style);
}
.manage-account.content .text-wrapper-6 {
position: absolute;
width: 296px;
top: 5px;
left: 0;
font-family: var(--comp-typography-headings-macos-semibold-h6-font-family);
font-weight: var(--comp-typography-headings-macos-semibold-h6-font-weight);
color: var(--textdefault);
font-size: var(--comp-typography-headings-macos-semibold-h6-font-size);
letter-spacing: var(--comp-typography-headings-macos-semibold-h6-letter-spacing);
line-height: var(--comp-typography-headings-macos-semibold-h6-line-height);
font-style: var(--comp-typography-headings-macos-semibold-h6-font-style);
}
.manage-account.content .label-3 {
position: absolute;
width: 457px;
top: 29px;
left: 0;
font-family: var(--body-macos-paragraph-normal-font-family);
color: var(--textdefault);
font-weight: var(--body-macos-paragraph-normal-font-weight);
font-size: var(--body-macos-paragraph-normal-font-size);
letter-spacing: var(--body-macos-paragraph-normal-letter-spacing);
line-height: var(--body-macos-paragraph-normal-line-height);
font-style: var(--body-macos-paragraph-normal-font-style);
}
.manage-account.content .text-wrapper-6 {
width: 366px;
margin-top: -1px;
font-family: var(--comp-typography-headings-macos-semibold-h6-font-family);
font-weight: 700;
color: var(--textdefault);
font-size: var(--comp-typography-headings-macos-semibold-h6-font-size);
letter-spacing: var(--comp-typography-headings-macos-semibold-h6-letter-spacing);
line-height: var(--comp-typography-headings-macos-semibold-h6-line-height);
position: relative;
align-self: stretch;
font-style: var(--comp-typography-headings-macos-semibold-h6-font-style);
}
.manage-account.content .label-4 {
top: -2px;
width: 310px;
position: relative;
align-self: stretch;
font-family: var(--body-macos-paragraph-normal-font-family);
color: var(--textdefault);
font-weight: var(--body-macos-paragraph-normal-font-weight);
width: 312px;
font-size: var(--body-macos-paragraph-normal-font-size);
letter-spacing: var(--body-macos-paragraph-normal-letter-spacing);
line-height: var(--body-macos-paragraph-normal-line-height);
font-style: var(--body-macos-paragraph-normal-font-style);
}
.manage-account.content .text-wrapper-7 {
font-weight: 700;
position: absolute;
width: 355px;
top: 8px;
left: 0;
font-family: var(--comp-typography-headings-macos-semibold-h6-font-family);
/* font-weight: var(--comp-typography-headings-macos-semibold-h6-font-weight); */
color: var(--textdefault);
font-size: var(--comp-typography-headings-macos-semibold-h6-font-size);
letter-spacing: var(--comp-typography-headings-macos-semibold-h6-letter-spacing);
line-height: var(--comp-typography-headings-macos-semibold-h6-line-height);
font-style: var(--comp-typography-headings-macos-semibold-h6-font-style);
}
.manage-account.content .label-5 {
position: absolute;
width: 348px;
top: 29px;
left: 0;
font-family: var(--body-macos-paragraph-normal-font-family);
color: var(--textdefault);
font-weight: var(--body-macos-paragraph-normal-font-weight);
font-size: var(--body-macos-paragraph-normal-font-size);
letter-spacing: var(--body-macos-paragraph-normal-letter-spacing);
line-height: var(--body-macos-paragraph-normal-line-height);
font-style: var(--body-macos-paragraph-normal-font-style);
}
.manage-account.content .text-wrapper-8 {
position: relative;
width: 348px;
margin-top: -6px;
font-family: var(--comp-typography-headings-macos-bold-h6-font-family);
font-weight: var(--comp-typography-headings-macos-bold-h6-font-weight);
color: var(--textdefault);
font-size: var(--comp-typography-headings-macos-bold-h6-font-size);
letter-spacing: var(--comp-typography-headings-macos-bold-h6-letter-spacing);
line-height: var(--comp-typography-headings-macos-bold-h6-line-height);
font-style: var(--comp-typography-headings-macos-bold-h6-font-style);
}
.manage-account.content .text-wrapper-10 {
position: relative;
margin-top: 20px;
margin-bottom: -12px;
font-family: var(--comp-typography-headings-macos-bold-h6-font-family);
font-weight: var(--comp-typography-headings-macos-bold-h6-font-weight);
color: var(--textdefault);
font-size: var(--comp-typography-headings-macos-bold-h6-font-size);
letter-spacing: var(--comp-typography-headings-macos-bold-h6-letter-spacing);
line-height: var(--comp-typography-headings-macos-bold-h6-line-height);
font-style: var(--comp-typography-headings-macos-bold-h6-font-style);
}
.manage-account.content .contact {
display: flex;
width: 585px;
align-items: flex-start;
gap: 24px;
position: relative;
flex: 0 0 auto;
}
.manage-account.content .text-wrapper-9 {
position: relative;
width: 437px;
margin-top: -13px;
font-family: var(--comp-typography-headings-macos-semibold-h6-font-family);
font-weight: 700;
color: var(--textdefault);
font-size: var(--comp-typography-headings-macos-semibold-h6-font-size);
letter-spacing: var(--comp-typography-headings-macos-semibold-h6-letter-spacing);
line-height: var(--comp-typography-headings-macos-semibold-h6-line-height);
font-style: var(--comp-typography-headings-macos-semibold-h6-font-style);
}
.manage-account.content .frame-5 {
display: flex;
flex-direction: column;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
align-items: flex-start;
position: relative;
}
.manage-account.content .label-6 {
position: relative;
align-self: stretch;
margin-top: -1px;
font-family: var(--body-macos-paragraph-normal-font-family);
color: var(--textdefault);
font-weight: var(--body-macos-paragraph-normal-font-weight);
font-size: var(--body-macos-paragraph-normal-font-size);
letter-spacing: var(--body-macos-paragraph-normal-letter-spacing);
line-height: var(--body-macos-paragraph-normal-line-height);
font-style: var(--body-macos-paragraph-normal-font-style);
width: 331px;
}
.manage-account.content .label-7 {
position: relative;
align-self: stretch;
font-family: var(--body-macos-paragraph-normal-font-family);
color: var(--arcturus-styles-sys-color-action-primary-default);
font-weight: var(--body-macos-paragraph-normal-font-weight);
font-size: var(--body-macos-paragraph-normal-font-size);
letter-spacing: var(--body-macos-paragraph-normal-letter-spacing);
line-height: var(--body-macos-paragraph-normal-line-height);
font-style: var(--body-macos-paragraph-normal-font-style);
width: 396px;
}
.manage-account.content .addresses {
display: inline-flex;
flex-direction: column;
align-items: flex-start;
gap: 32px;
position: relative;
flex: 0 0 auto;
margin-left: 120px;
}
.manage-account.content .address-row {
width: 275px;
gap: 32px;
flex: 0 0 auto;
display: flex;
align-items: flex-start;
position: relative;
}
.manage-account.content .address {
flex-direction: column;
gap: 8px;
flex: 1;
flex-grow: 1;
display: flex;
align-items: flex-start;
position: relative;
}
.entry-item {
text-align: left !important;
}
.profile-initials {
background: #01579b;
color: #fff;
border-radius: 140px;
padding: 9px 7px;
cursor: pointer;
}
div#profilepic,
#profilepic-manage-account {
display: flex;
justify-content: center;
align-items: center;
font-size: 20px;
}
/* loading skeleton */
.skeleton-container-tables {
display: flex;
align-items: center;
}
.skeleton-container {
display: flex;
align-items: center;
}
.banner {
width: 1185px;
height: 400px;
border-radius: 4px;
margin-bottom: 3px;
}
p.div {
text-wrap: auto;
}
.product-banner {
width: 351px;
height: 276px;
border-radius: 4px;
margin-bottom: 3px;
}
.table-skeleton {
width: 1096px;
height: 16px;
border-radius: 4px;
margin-bottom: 3px;
}
#productContentDiv {
display: none;
}
#dashboardcontentDiv {
display: none;
}
#contentDiv {
display: none;
}
.skeleton {
background: linear-gradient(90deg, #eee, #f9f9f9, #eee);
animation: leftToRight 1.5s infinite reverse;
background-size: 200%;
}
.header-container.text-wrapper-2.data-certificate-results {
margin-top: 5px;
}
.header-container.text-wrapper-2.data-audit-results {
margin-top: 5px;
}
.banner-description {
color: #fff;
font-size: 28px;
}
.avatar {
width: 50px;
height: 50px;
border-radius: 50%;
}
.info {
margin-left: 10px;
}
.info-page {
margin-top: 100px;
margin-left: 10px;
}
.info-table {
margin-top: 10px;
margin-left: 10px;
}
.text-long {
width: 350px;
height: 16px;
border-radius: 4px;
margin-bottom: 15px;
}
.text-short {
width: 250px;
height: 16px;
border-radius: 4px;
margin-bottom: 15px;
}
.text-medium {
width: 170px;
height: 16px;
border-radius: 4px;
margin-bottom: 15px;
}
@keyframes leftToRight {
0% {
background-position: -100% 0;
}
100% {
background-position: 100% 0;
}
}
/* fullcalendar io */
#calendar[data-page="dashboard"] {
width: 220px;
height: 305px;
margin: 0 auto;
font-size: 12px;
}
[data-page="dashboard"] .fc .fc-daygrid-body-unbalanced .fc-daygrid-day-events {
height: 1em !important;
position: relative;
}
.fc .fc-daygrid-day.fc-day-today {
background-color: rgb(204 227 244) !important;
}
.fc-h-event {
background-color: #015b9e !important;
border: 1px solid #015b9e !important;
display: block
}
[data-page="dashboard"] .fc .fc-toolbar-title {
font-size: 1.5em !important;
margin: 0;
}
[data-page="dashboard"] .fc-toolbar {
font-size: .8em;
}
[data-page="dashboard"] .fc-toolbar h2 {
font-size: 12px;
white-space: normal !important;
}
/* click +2 more for popup */
[data-page="dashboard"] .fc-more-cell a {
display: block;
width: 85%;
margin: 1px auto 0 auto;
border-radius: 3px;
background: grey;
color: transparent;
overflow: hidden;
height: 4px;
}
[data-page="dashboard"] .fc-more-popover {
width: 100px;
}
[data-page="dashboard"] .fc-view-month .fc-event,
.fc-view-agendaWeek .fc-event,
.fc-content {
font-size: 0;
overflow: hidden;
height: 2px;
}
[data-page="dashboard"] .fc-view-agendaWeek .fc-event-vert {
font-size: 0;
overflow: hidden;
width: 2px !important;
}
[data-page="dashboard"] .fc-agenda-axis {
width: 20px !important;
font-size: .7em;
}
[data-page="dashboard"] .fc-button-content {
padding: 0;
}
/* manage-account-2 */
img#profilePictureUploaded {
border-radius: 50%;
object-fit: cover;
cursor: pointer;
}
.holder {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 24px;
position: relative;
}
.holder .header-exit {
display: flex;
align-items: flex-start;
gap: 10px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
.holder .text-holder {
position: relative;
flex: 1;
margin-top: -1.00px;
font-family: var(--headings-macos-medium-h4-font-family);
font-weight: var(--headings-macos-medium-h4-font-weight);
color: var(--textdefault);
font-size: var(--headings-macos-medium-h4-font-size);
letter-spacing: var(--headings-macos-medium-h4-letter-spacing);
line-height: var(--headings-macos-medium-h4-line-height);
font-style: var(--headings-macos-medium-h4-font-style);
}
.holder .singular-button {
all: unset;
box-sizing: border-box;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
padding: 4px 16px;
position: relative;
flex: 0 0 auto;
margin-top: -1.00px;
margin-bottom: -1.00px;
margin-right: -1.00px;
background-color: var(--arcturus-styles-sys-color-action-secondary-default);
border-radius: 50px;
border: 1px solid;
border-color: var(--arcturus-styles-sys-color-border-default);
}
.holder .prefix-icon {
position: relative;
width: var(--arcturus-styles-sys-sizing-icon-m);
height: var(--arcturus-styles-sys-sizing-icon-m);
background-image: url(./img/icon.svg);
background-size: 100% 100%;
}
.holder .text-value {
position: relative;
width: fit-content;
margin-top: -0.50px;
font-family: "SF Pro Display-Semibold", Helvetica;
color: var(--arcturus-styles-sys-color-text-default);
text-align: center;
white-space: nowrap;
font-weight: 400;
font-size: 16px;
letter-spacing: 0.01px;
line-height: 24px;
}
.holder .your-details {
display: flex;
align-items: flex-start;
gap: 32px;
padding: 24px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
height: 435px;
background-color: var(--surfacedefault);
border-radius: 8px;
box-shadow: 0px 2px 4px -2px #1018280f, 0px 4px 8px -2px #1018281a;
}
.holder .text-container {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 24px;
position: relative;
flex: 1;
flex-grow: 1;
}
.holder .heading {
gap: 66px;
padding: 0px 0px 8px;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
display: flex;
align-items: flex-start;
position: relative;
}
.holder .text-container-2 {
flex-direction: column;
gap: 4px;
flex: 1;
flex-grow: 1;
display: flex;
align-items: flex-start;
position: relative;
}
.holder .text-holder-2 {
position: relative;
margin-top: -1.00px;
font-family: var(--headings-macos-medium-h4-font-family);
font-weight: var(--headings-macos-medium-h4-font-weight);
color: var(--textdefault);
font-size: var(--headings-macos-medium-h4-font-size);
letter-spacing: var(--headings-macos-medium-h4-letter-spacing);
line-height: var(--headings-macos-medium-h4-line-height);
font-style: var(--headings-macos-medium-h4-font-style);
}
.holder .text-container-3 {
display: flex;
align-items: flex-start;
gap: 24px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
.holder .thumbnail {
position: relative;
width: 104px;
height: 104px;
}
.holder .text-container-4 {
justify-content: center;
gap: 16px;
flex: 1;
flex-grow: 1;
display: flex;
flex-direction: column;
align-items: flex-start;
position: relative;
}
.holder .plaintext-w-text-value {
position: relative;
width: 147.75px;
height: 48px;
}
.holder .text-holder-3 {
position: absolute;
width: 148px;
top: -1px;
left: 0;
font-family: var(--comp-typography-headings-macos-bold-h6-font-family);
font-weight: var(--comp-typography-headings-macos-bold-h6-font-weight);
color: var(--textdefault);
font-size: var(--comp-typography-headings-macos-bold-h6-font-size);
letter-spacing: var(--comp-typography-headings-macos-bold-h6-letter-spacing);
line-height: var(--comp-typography-headings-macos-bold-h6-line-height);
font-style: var(--comp-typography-headings-macos-bold-h6-font-style);
}
.holder .text-value-2 {
position: absolute;
top: 23px;
left: 0;
font-family: var(--body-macos-paragraph-normal-font-family);
font-weight: var(--body-macos-paragraph-normal-font-weight);
color: var(--textdefault);
font-size: var(--body-macos-paragraph-normal-font-size);
letter-spacing: var(--body-macos-paragraph-normal-letter-spacing);
line-height: var(--body-macos-paragraph-normal-line-height);
white-space: nowrap;
font-style: var(--body-macos-paragraph-normal-font-style);
}
.holder .text-holder-4 {
position: absolute;
width: 148px;
top: -1px;
left: 0;
font-family: var(--comp-typography-headings-macos-semibold-h6-font-family);
font-weight: var(--comp-typography-headings-macos-semibold-h6-font-weight);
color: var(--textdefault);
font-size: var(--comp-typography-headings-macos-semibold-h6-font-size);
letter-spacing: var(--comp-typography-headings-macos-semibold-h6-letter-spacing);
line-height: var(--comp-typography-headings-macos-semibold-h6-line-height);
font-style: var(--comp-typography-headings-macos-semibold-h6-font-style);
}
.holder .plaintext-w-text-value-2 {
height: 48px;
position: relative;
flex: 1;
flex-grow: 1;
}
.holder .text-holder-5 {
position: absolute;
width: 563px;
top: -1px;
left: 0;
font-family: var(--comp-typography-headings-macos-semibold-h6-font-family);
font-weight: var(--comp-typography-headings-macos-semibold-h6-font-weight);
color: var(--textdefault);
font-size: var(--comp-typography-headings-macos-semibold-h6-font-size);
letter-spacing: var(--comp-typography-headings-macos-semibold-h6-letter-spacing);
line-height: var(--comp-typography-headings-macos-semibold-h6-line-height);
font-style: var(--comp-typography-headings-macos-semibold-h6-font-style);
}
.holder .text-value-3 {
position: absolute;
width: 443px;
top: 23px;
left: 0;
font-family: var(--body-macos-paragraph-normal-font-family);
color: var(--textdefault);
font-weight: var(--body-macos-paragraph-normal-font-weight);
font-size: var(--body-macos-paragraph-normal-font-size);
letter-spacing: var(--body-macos-paragraph-normal-letter-spacing);
line-height: var(--body-macos-paragraph-normal-line-height);
font-style: var(--body-macos-paragraph-normal-font-style);
}
.holder .text-holder-6 {
position: relative;
align-self: stretch;
margin-top: 20px;
font-family: var(--comp-typography-headings-macos-semibold-h6-font-family);
font-weight: var(--comp-typography-headings-macos-semibold-h6-font-weight);
color: var(--textdefault);
font-size: var(--comp-typography-headings-macos-semibold-h6-font-size);
letter-spacing: var(--comp-typography-headings-macos-semibold-h6-letter-spacing);
line-height: var(--comp-typography-headings-macos-semibold-h6-line-height);
font-style: var(--comp-typography-headings-macos-semibold-h6-font-style);
}
.holder .text-value-4 {
position: relative;
align-self: stretch;
font-family: var(--body-macos-paragraph-normal-font-family);
color: var(--textdefault);
font-weight: var(--body-macos-paragraph-normal-font-weight);
font-size: var(--body-macos-paragraph-normal-font-size);
letter-spacing: var(--body-macos-paragraph-normal-letter-spacing);
line-height: var(--body-macos-paragraph-normal-line-height);
font-style: var(--body-macos-paragraph-normal-font-style);
max-width: 320px;
word-wrap: break-word;
overflow-wrap: break-word;
white-space: normal;
}
.holder .company-heading {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 24px;
padding: 0px 0px 8px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
background-color: transparent;
}
.holder .heading-holder {
display: flex;
align-items: flex-start;
gap: 66px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
.holder .text-value-5 {
position: absolute;
width: 250px;
top: 16px;
left: 0;
font-family: var(--body-macos-paragraph-normal-font-family);
color: var(--textdefault);
font-weight: var(--body-macos-paragraph-normal-font-weight);
font-size: var(--body-macos-paragraph-normal-font-size);
letter-spacing: var(--body-macos-paragraph-normal-letter-spacing);
line-height: var(--body-macos-paragraph-normal-line-height);
font-style: var(--body-macos-paragraph-normal-font-style);
margin-bottom: 50px;
}
.holder .text-holder-7 {
position: relative;
width: 585px;
margin-top: -1.00px;
margin-right: -22.00px;
font-family: var(--comp-typography-headings-macos-bold-h6-font-family);
font-weight: var(--comp-typography-headings-macos-bold-h6-font-weight);
color: var(--textdefault);
font-size: var(--comp-typography-headings-macos-bold-h6-font-size);
letter-spacing: var(--comp-typography-headings-macos-bold-h6-letter-spacing);
line-height: var(--comp-typography-headings-macos-bold-h6-line-height);
font-style: var(--comp-typography-headings-macos-bold-h6-font-style);
}
.holder .text-holder-8 {
position: relative;
width: 585px;
margin-top: 120px;
margin-right: -22.00px;
font-family: var(--comp-typography-headings-macos-semibold-h6-font-family);
font-weight: var(--comp-typography-headings-macos-semibold-h6-font-weight);
color: var(--textdefault);
font-size: var(--comp-typography-headings-macos-semibold-h6-font-size);
letter-spacing: var(--comp-typography-headings-macos-semibold-h6-letter-spacing);
line-height: var(--comp-typography-headings-macos-semibold-h6-line-height);
font-style: var(--comp-typography-headings-macos-semibold-h6-font-style);
}
.holder .text-container-5 {
align-self: stretch;
width: 100%;
flex: 0 0 auto;
display: flex;
flex-direction: column;
align-items: flex-start;
position: relative;
}
.holder .text-value-6 {
position: relative;
align-self: stretch;
font-family: var(--body-macos-paragraph-normal-font-family);
color: var(--textdefault);
font-weight: var(--body-macos-paragraph-normal-font-weight);
font-size: var(--body-macos-paragraph-normal-font-size);
letter-spacing: var(--body-macos-paragraph-normal-letter-spacing);
line-height: var(--body-macos-paragraph-normal-line-height);
font-style: var(--body-macos-paragraph-normal-font-style);
}
.holder .text-value-7 {
position: relative;
align-self: stretch;
font-family: var(--body-macos-paragraph-normal-font-family);
color: var(--arcturus-styles-sys-color-action-primary-default);
font-weight: var(--body-macos-paragraph-normal-font-weight);
font-size: var(--body-macos-paragraph-normal-font-size);
letter-spacing: var(--body-macos-paragraph-normal-letter-spacing);
line-height: var(--body-macos-paragraph-normal-line-height);
font-style: var(--body-macos-paragraph-normal-font-style);
}
.text-holder-6.bold-address {
font-weight: bold;
}
.holder .cards-my-account {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 32px;
padding: 67px 67px 90px 67px;
position: relative;
align-self: stretch;
flex-wrap: wrap;
width: 100%;
flex: 0 0 auto;
background-color: var(--surfacedefault);
border-radius: 8px;
box-shadow: 0px 2px 4px -2px #1018280f, 0px 4px 8px -2px #1018281a;
}
.text-holder-8.bold-address {
font-weight: bold;
}
.holder .text-container-6 {
gap: 24px;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
display: flex;
flex-direction: column;
align-items: flex-start;
position: relative;
}
.holder .addresses-row {
display: flex;
align-items: flex-start;
gap: 32px;
position: relative;
flex: 0 0 auto;
background: #fff;
flex-wrap: wrap;
}
.holder .address {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 8px;
position: relative;
width: 317px;
flex-wrap: wrap;
}
/* dashboard under construction */
.holding-page {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 24px;
position: relative;
WIDTH: 800PX;
margin: 30px 220px auto;
background: #fff;
padding: 50px;
text-align: center;
border-radius: 5px;
}
.under-construction-text-header .header-holder {
padding: 0px 120px;
position: relative;
font-family: var(--headings-macos-medium-h4-font-family);
font-weight: var(--headings-macos-medium-h4-font-weight);
color: rgb(1 28 65);
font-size: var(--headings-macos-medium-h4-font-size);
letter-spacing: var(--headings-macos-medium-h4-letter-spacing);
line-height: var(--headings-macos-medium-h4-line-height);
font-style: var(--headings-macos-medium-h4-font-style);
text-align: center;
}
.button-container .button-holder {
display: flex;
align-items: flex-start;
gap: 15px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
padding: 0 186px;
}
.under-construction-text-container {
color: #7a8da7;
padding: 20px;
line-height: 22px;
}
.last-step-of-the {
position: relative;
width: 400px;
height: 209px;
background-image: url(./img/background-frame-07.svg);
background-size: 100% 100%;
}
.last-step-of-the .overlap-group {
position: relative;
width: 260px;
height: 209px;
left: 63px;
}
.last-step-of-the .shelve {
position: absolute;
width: 116px;
height: 67px;
top: 142px;
left: 0;
}
.last-step-of-the .puzzel {
position: absolute;
width: 111px;
height: 89px;
top: 120px;
left: 149px;
}
.last-step-of-the .photo-frames {
position: absolute;
width: 63px;
height: 59px;
top: 36px;
left: 6px;
}
.last-step-of-the .piece-of-puzzel {
position: absolute;
width: 57px;
height: 57px;
top: 91px;
left: 120px;
}
.last-step-of-the .construction-worker {
position: absolute;
width: 157px;
height: 209px;
top: 0;
left: 31px;
}
/* page not found */
.pagenotfound {
position: absolute;
top: 25%;
left: 35%;
margin-top: -50px;
margin-left: -50px;
margin: 0 auto;
}
h1.page-not-found-header {
padding: 50px 50px 0 0;
font-size: 60px;
color: #0172c5;
}
p.page-not-found-subheader {
padding: 20px 45px;
font-size: 25px;
}
a.primary-button {
padding: 200px;
}
/* Footer */
.menu-footer .icon {
position: absolute;
width: 24px;
height: 24px;
top: 0;
left: 0;
transform: rotate(-180deg);
}
div#data {
display: none;
}
.label-2.open-btn,
.open-booking {
cursor: pointer;
}
.footer {
background: #284975;
margin: 0 auto;
width: 100%;
position: relative;
color: #fff;
}
.ag-footer-container {
position: relative;
padding-top: 40px;
}
.footerNav {
width: 100%;
height: 14%;
background: white;
bottom: -4026px;
position: absolute;
z-index: 984;
border-top: 1px solid #cdcdcd;
margin: 0 auto;
display: flex;
justify-content: center;
align-items: center;
align-self: center;
}
section.ag-footer-copyright {
color: black;
}
.ag-footer {
width: 100%;
display: flex;
align-items: center;
justify-content: flex-end;
gap: 23px;
margin-top: -3px;
}
.ag-footer ul {
display: flex;
flex-direction: row;
align-content: flex-start;
justify-content: flex-start;
align-items: stretch;
width: 35%;
color: #fff;
font-size: 12px;
text-decoration: none;
margin: 0 0 9px 0;
}
.ag-footer li {
margin: 0 18px;
}
.ag-footer ul li a {
color: #333 !important;
padding: 0 8px 0 0;
}
nav.ag-footer-bottom-links ul li:last-child a {
border-right: 0;
padding-right: 0;
}
@media (min-width: 620px) {
.ag-footer-container {
padding-top: 81px;
}
}
.footer ul {
list-style: none;
padding: 0;
margin: 0;
}
.ag-footer-nav nav {
margin-bottom: 20px;
}
.ag-footer-nav-menu {
margin: 0 -15px;
}
.ag-footer-nav-menu {
display: flex;
}
.ag-footer-nav-menu>li {
padding: 0 15px;
vertical-align: top;
}
.ag-footer-nav-menu-1,
.ag-footer-nav-menu-2,
.ag-footer-nav-menu-4 {
display: none;
}
@media (min-width: 620px) {
.ag-footer-nav-menu-1,
.ag-footer-nav-menu-2,
.ag-footer-nav-menu-4 {
display: block;
}
.ag-footer-nav-menu-4 {
flex-grow: 2;
text-align: right;
}
}
.ag-footer-nav-menu>li .ag-footer-nav-list-header,
.ag-footer-nav-menu>li>span {
text-transform: uppercase;
color: #fff;
font-size: 16px;
}
.ag-footer-nav-menu li a {
color: #009fd9;
font-size: 14px;
font-weight: 500;
text-decoration: none;
}
.ag-footer-bottom {
border-bottom: 1px solid #cdcdcd;
-ms-flex-pack: justify;
bottom: 0;
width: 100%;
clear: both;
padding: 0 26px 0 308px;
}
.ag-footer a:hover {
text-decoration: underline;
}
@media screen and (min-device-width: 1200px) and (max-device-width: 1599px) and (-webkit-min-device-pixel-ratio: 1) {
div#contentDiv {
margin-left: 80px;
}
@media screen and (min-device-width: 1600px) {
span.next {
right: -160px;
}
}
@media screen and (min-device-width: 1850px) {
span.next {
right: -132px;
}
}
.sidebar.hide .menu-footer {
top: 70%;
}
span.next {
right: -136px;
}
.menu-footer {
top: 70%;
}
.table .p {
width: 173px;
}
.table .registration-row {
width: 69%;
}
.site-booking-page.content .table-wrapper {
width: 86%;
}
.card,
.next-booking {
flex: 1;
justify-content: flex-start;
max-width: 70%;
}
.dashboard-page.content .div-5 {
display: flex;
align-items: flex-start;
gap: 24px;
position: relative;
align-self: stretch;
width: 78%;
flex: 0 0 auto;
}
.dashboard-page.content .div {
display: flex;
align-items: flex-start;
gap: 25px;
position: relative;
align-self: stretch;
width: 100%;
flex: 0 0 auto;
}
.card-content-x {
flex: 1;
display: flex;
flex-direction: column;
padding: 35px 0px 10px 20px;
min-height: 127px;
word-wrap: break-word;
overflow-wrap: break-word;
white-space: normal;
width: 380px;
}
.card-container-x {
width: 380px;
display: flex;
justify-content: center;
}
.card-tile {
display: flex;
flex-direction: row;
background-color: #fff;
border-radius: 8px;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
min-width: 384px;
min-height: 238px;
width: 100%;
overflow: hidden;
}
.footerNav {
height: 20%;
left: 0;
}
.ag-footer li {
width: 100%;
}
.dashboard-page.content {
padding: 0px;
}
.wrapper {
padding: 0px;
}
.secure-page-container {
width: 100%;
padding: 24px 41px 17px 201px;
}
.sidebar {
width: 15%!important;
}
.sidebar .side-menu a {
font-size: 12px;
line-height: 16px;
}
}
@media screen and (min-device-width: 1200px) and (max-device-width: 1600px) and (-webkit-min-device-pixel-ratio: 2) and (min-resolution: 192dpi) {
.footerNav {
height: 20%;
width: 80%;
}
.ag-footer li {
width: 0px;
margin: 0px;
}
}
@media (min-width: 620px) {
.ag-footer-bottom {
-ms-flex-pack: justify;
justify-content: space-between;
padding: 0 26px 0 215px;
}
}
.ag-footer-copyright p {
line-height: 22px;
font-size: 12px;
color: #333;
margin-top: 9px;
}
nav.ag-footer-bottom-links {
display: none;
}
.ag-footer-social-media {
display: inline-block;
padding: 15px;
}
.ag-footer-social-media>a {
display: inline-block;
margin: 0 5px;
}
.ag-footer-social-media>a img {
max-width: 40px;
}
@media (min-width: 800px) {
nav.ag-footer-bottom-links {
display: -ms-flexbox;
display: flex;
position: relative;
max-width: 70%;
flex: 0 0 1;
}
nav.ag-footer-bottom-links ul {
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-ms-flex-pack: end;
justify-content: flex-end;
}
nav.ag-footer-bottom-links ul li a {
border-right: 1px solid #fff;
color: #fff;
font-size: 10px;
line-height: 22px;
text-decoration: none;
padding: 0 10px;
margin: 9px 0;
}
}
.carousel-caption h3 {
color: #fff;
width: 600px;
font-size: 38px;
margin: 20px 0px;
word-wrap: break-word;
overflow-wrap: break-word;
white-space: normal;
line-height: 49px;
}
/* Cancel Booking Request Page */
:root {
--dl-size-size-large: 144px;
--dl-size-size-small: 48px;
--dl-size-size-medium: 96px;
--dl-size-size-xlarge: 192px;
--dl-size-size-xsmall: 16px;
--dl-space-space-unit: 16px;
--dl-size-size-xxlarge: 288px;
--dl-size-size-maxwidth: 1400px;
--dl-color-theme-accent1: #FFFFFF;
--dl-color-theme-accent2: #F5D1B0;
--dl-radius-radius-round: 50%;
--dl-color-theme-primary1: #BF4408;
--dl-color-theme-primary2: #E65103;
--dl-space-space-halfunit: 8px;
--dl-space-space-sixunits: 96px;
--dl-space-space-twounits: 32px;
--dl-radius-radius-radius2: 2px;
--dl-radius-radius-radius4: 4px;
--dl-radius-radius-radius8: 8px;
--dl-space-space-fiveunits: 80px;
--dl-space-space-fourunits: 64px;
--dl-color-theme-secondary1: #FFFFFF;
--dl-color-theme-secondary2: #FBF1EB;
--dl-space-space-threeunits: 48px;
--dl-color-theme-neutral-dark: #191818;
--dl-radius-radius-cardradius: 8px;
--dl-color-theme-neutral-light: #FBFAF9;
--dl-radius-radius-imageradius: 8px;
--dl-radius-radius-inputradius: 24px;
--dl-radius-radius-buttonradius: 24px;
--dl-space-space-oneandhalfunits: 24px;
}
.modal {
display: none;
/* Hidden by default */
position: fixed;
/* Stay in place */
z-index: 4001;
/* Sit on top */
left: 0;
top: 0;
width: 100%;
/* Full width */
height: 100%;
/* Full height */
overflow: auto;
/* Enable scroll if needed */
background-color: rgb(0, 0, 0);
/* Fallback color */
background-color: rgba(0, 0, 0, 0.4);
/* Black w/ opacity */
}
/* Modal Content/Box */
.modal-content {
background-color: #fff;
margin: 15% auto;
padding: 20px;
border: 1px solid #888;
border-radius: 8px;
width: 44%;
/* height: 100%; */
}
/* The Close Button */
.close {
color: #aaa;
float: right;
font-size: 28px;
font-weight: bold;
}
.close:hover,
.close:focus {
color: black;
text-decoration: none;
cursor: pointer;
}
.dialog-requestsitebooking-container {
width: 100%;
display: flex;
overflow: auto;
align-items: center;
flex-direction: column;
}
.dialog-requestsitebooking-dialog-requestsitebooking {
gap: 32px;
width: 100%;
height: auto;
display: flex;
padding: 24px 0;
align-items: flex-end;
flex-shrink: 0;
border-radius: 8px;
flex-direction: column;
background-color: rgba(255, 255, 255, 1);
}
.dialog-requestsitebooking-message-body {
display: flex;
position: relative;
align-self: stretch;
align-items: flex-start;
flex-shrink: 0;
}
.dialog-requestsitebooking-icon-button-atom {
gap: 8px;
width: 24px;
height: 24px;
display: flex;
padding: 8px 20px 8px 24px;
position: relative;
align-items: center;
border-radius: 4px;
justify-content: center;
}
.dialog-requestsitebooking-close {
top: 0px;
left: 0px;
width: 24px;
height: 24px;
display: flex;
overflow: hidden;
position: absolute;
align-items: flex-start;
flex-shrink: 0;
}
.dialog-requestsitebooking-icon1 {
top: 0px;
left: 0px;
width: 24px;
height: 24px;
position: absolute;
}
.dialog-requestsitebooking-message-content {
gap: 16px;
width: 775px;
display: flex;
z-index: 1;
flex-grow: 1;
align-items: flex-start;
flex-shrink: 0;
flex-direction: column;
}
.dialog-requestsitebooking-message-title-icon {
gap: 8px;
display: flex;
align-self: stretch;
align-items: center;
flex-shrink: 0;
}
.dialog-requestsitebooking-text10 {
color: rgba(1, 28, 65, 1);
height: auto;
flex-grow: 1;
font-size: 20px;
font-style: Medium;
text-align: left;
font-weight: 500;
line-height: 20px;
font-stretch: normal;
text-decoration: none;
}
.dialog-requestsitebooking-dialogsitebooking {
gap: 24px;
display: flex;
align-self: stretch;
align-items: flex-start;
flex-direction: column;
}
.dialog-requestsitebooking-text11 {
color: rgba(1, 28, 65, 1);
width: 776px;
height: auto;
font-size: 16px;
text-align: left;
font-weight: 400;
line-height: 24px;
font-stretch: normal;
text-decoration: none;
}
.dialog-requestsitebooking-frame99871 {
gap: 24px;
width: 776px;
display: flex;
align-items: flex-start;
flex-shrink: 0;
flex-direction: column;
}
.dialog-requestsitebooking-frame99872 {
gap: 24px;
display: flex;
align-self: stretch;
align-items: flex-start;
flex-shrink: 0;
}
.dialog-requestsitebooking-singleselect1 {
gap: 4px;
width: 376px;
display: flex;
flex-grow: 1;
align-items: flex-start;
flex-shrink: 0;
flex-direction: column;
}
.dialog-requestsitebooking-selectfield1 {
gap: 4px;
display: flex;
align-self: stretch;
align-items: flex-start;
border-radius: 8px;
flex-direction: column;
}
.dialog-requestsitebooking-field1 {
gap: 8px;
display: flex;
padding: 4px 12px;
align-self: stretch;
align-items: center;
flex-shrink: 0;
border-color: rgba(204, 204, 204, 1);
border-style: solid;
border-width: 1px;
border-radius: 8px;
justify-content: flex-end;
background-color: rgba(255, 255, 255, 1);
}
.dialog-requestsitebooking-text12 {
color: rgba(103, 119, 141, 1);
height: auto;
flex-grow: 1;
text-align: left;
line-height: 24px;
}
.dialog-requestsitebooking-text13 {
color: rgba(1, 28, 65, 1);
height: auto;
flex-grow: 1;
align-self: stretch;
text-align: left;
line-height: 24px;
}
.dialog-requestsitebooking-suffixicon1 {
width: 24px;
height: 24px;
display: flex;
overflow: hidden;
position: relative;
align-items: flex-start;
flex-shrink: 0;
}
.dialog-requestsitebooking-icon2 {
top: 0px;
left: 0px;
width: 24px;
height: 24px;
position: absolute;
}
.dialog-requestsitebooking-singleselect2 {
gap: 4px;
width: 376px;
display: flex;
flex-grow: 1;
align-items: flex-start;
flex-shrink: 0;
flex-direction: column;
}
.dialog-requestsitebooking-selectfield2 {
gap: 4px;
display: flex;
align-self: stretch;
align-items: flex-start;
border-radius: 8px;
flex-direction: column;
}
.dialog-requestsitebooking-field2 {
gap: 8px;
display: flex;
padding: 4px 12px;
align-self: stretch;
align-items: center;
flex-shrink: 0;
border-color: rgba(204, 204, 204, 1);
border-style: solid;
border-width: 1px;
border-radius: 8px;
justify-content: flex-end;
background-color: rgba(255, 255, 255, 1);
}
.dialog-requestsitebooking-text14 {
color: rgba(103, 119, 141, 1);
height: auto;
flex-grow: 1;
text-align: left;
line-height: 24px;
}
.dialog-requestsitebooking-text15 {
color: rgba(1, 28, 65, 1);
height: auto;
flex-grow: 1;
align-self: stretch;
text-align: left;
line-height: 24px;
}
.dialog-requestsitebooking-suffixicon2 {
width: 24px;
height: 24px;
display: flex;
overflow: hidden;
position: relative;
align-items: flex-start;
flex-shrink: 0;
}
.dialog-requestsitebooking-icon3 {
top: 0px;
left: 0px;
width: 24px;
height: 24px;
position: absolute;
}
.dialog-requestsitebooking-frame9988 {
gap: 24px;
display: flex;
align-self: stretch;
align-items: flex-start;
flex-shrink: 0;
}
.dialog-requestsitebooking-dateinput1 {
gap: 8px;
width: 376px;
display: flex;
flex-grow: 1;
align-items: flex-start;
flex-shrink: 0;
flex-direction: column;
}
.dialog-requestsitebooking-dateinput2 {
gap: 4px;
display: flex;
align-self: stretch;
align-items: flex-start;
flex-direction: column;
}
.dialog-requestsitebooking-prefix1 {
gap: 4px;
display: flex;
align-self: stretch;
align-items: center;
flex-shrink: 0;
}
.dialog-requestsitebooking-requiredsymbol1 {
width: 7px;
height: 20px;
display: flex;
position: relative;
align-items: flex-start;
flex-shrink: 0;
}
.dialog-requestsitebooking-text16 {
color: rgba(51, 51, 51, 1);
height: auto;
text-align: left;
line-height: 20px;
}
.dialog-requestsitebooking-field3 {
gap: 8px;
display: flex;
padding: 4px 12px;
align-self: stretch;
align-items: center;
flex-shrink: 0;
border-radius: 8px;
justify-content: flex-end;
background-color: rgba(255, 255, 255, 1);
}
.dialog-requestsitebooking-suffixicon3 {
width: 24px;
height: 24px;
display: flex;
overflow: hidden;
position: relative;
align-items: flex-start;
flex-shrink: 0;
}
.dialog-requestsitebooking-icon4 {
top: 0px;
left: 0px;
width: 24px;
height: 24px;
position: absolute;
}
.dialog-requestsitebooking-text17 {
color: rgba(103, 119, 141, 1);
height: auto;
flex-grow: 1;
font-size: 16px;
font-style: Regular;
text-align: left;
font-weight: 400;
line-height: 24px;
font-stretch: normal;
text-decoration: none;
}
.dialog-requestsitebooking-dateinput3 {
gap: 8px;
width: 376px;
display: flex;
flex-grow: 1;
align-items: flex-start;
flex-shrink: 0;
flex-direction: column;
}
.dialog-requestsitebooking-dateinput4 {
gap: 4px;
display: flex;
align-self: stretch;
align-items: flex-start;
flex-direction: column;
}
.dialog-requestsitebooking-prefix2 {
gap: 4px;
display: flex;
align-self: stretch;
align-items: center;
flex-shrink: 0;
}
.dialog-requestsitebooking-requiredsymbol2 {
width: 7px;
height: 20px;
display: flex;
position: relative;
align-items: flex-start;
flex-shrink: 0;
}
.dialog-requestsitebooking-text18 {
color: rgba(51, 51, 51, 1);
height: auto;
text-align: left;
line-height: 20px;
}
.dialog-requestsitebooking-field4 {
gap: 8px;
display: flex;
padding: 4px 12px;
align-self: stretch;
align-items: center;
flex-shrink: 0;
border-radius: 8px;
justify-content: flex-end;
background-color: rgba(255, 255, 255, 1);
}
.dialog-requestsitebooking-suffixicon4 {
width: 24px;
height: 24px;
display: flex;
overflow: hidden;
position: relative;
align-items: flex-start;
flex-shrink: 0;
}
.dialog-requestsitebooking-icon5 {
top: 0px;
left: 0px;
width: 24px;
height: 24px;
position: absolute;
}
.dialog-requestsitebooking-text19 {
color: rgba(103, 119, 141, 1);
height: auto;
flex-grow: 1;
font-size: 16px;
font-style: Regular;
text-align: left;
font-weight: 400;
line-height: 24px;
font-stretch: normal;
text-decoration: none;
}
.dialog-requestsitebooking-multilinetextarea1 {
display: flex;
align-self: stretch;
align-items: flex-start;
flex-direction: column;
}
.dialog-requestsitebooking-multilinetextarea2 {
gap: 4px;
height: 200px;
display: flex;
align-self: stretch;
align-items: flex-start;
flex-shrink: 0;
flex-direction: column;
}
.dialog-requestsitebooking-prefix3 {
gap: 4px;
display: flex;
align-self: stretch;
align-items: center;
flex-shrink: 0;
}
.dialog-requestsitebooking-text20 {
color: rgba(51, 51, 51, 1);
height: auto;
text-align: left;
line-height: 20px;
}
.dialog-requestsitebooking-multilinetextfield {
gap: 8px;
display: flex;
padding: 8px 12px;
position: relative;
flex-grow: 1;
align-self: stretch;
align-items: flex-start;
border-radius: 8px;
background-color: rgba(255, 255, 255, 1);
}
.dialog-requestsitebooking-dragicon {
gap: 8px;
display: flex;
position: relative;
align-items: flex-end;
justify-content: flex-end;
}
.dialog-requestsitebooking-line12 {
width: 8px;
height: 1px;
}
.dialog-requestsitebooking-line13 {
top: 6.000115871429443px;
left: 2px;
width: 6px;
height: 1px;
z-index: 1;
position: absolute;
}
.dialog-requestsitebooking-buttons {
gap: 8px;
display: flex;
align-items: center;
justify-content: center;
}
.dialog-requestsitebooking-singular-button1 {
gap: 8px;
height: 32px;
display: flex;
padding: 4px 24px;
align-items: center;
flex-shrink: 0;
border-color: rgba(194, 196, 197, 1);
border-style: solid;
border-width: 1px;
border-radius: 50px;
justify-content: center;
background-color: rgba(255, 255, 255, 1);
}
.dialog-requestsitebooking-text21 {
color: rgba(1, 28, 65, 1);
height: auto;
text-align: center;
line-height: 20px;
}
.dialog-requestsitebooking-singular-button2 {
gap: 8px;
height: 32px;
display: flex;
padding: 4px 24px;
align-items: center;
flex-shrink: 0;
border-color: rgba(0, 0, 0, 0);
border-radius: 50px;
justify-content: center;
background-color: rgba(1, 114, 197, 1);
}
.dialog-requestsitebooking-text22 {
color: rgba(255, 255, 255, 1);
height: auto;
text-align: center;
line-height: 20px;
}
.button {
color: var(--dl-color-theme-neutral-dark);
display: inline-block;
padding: 0.5rem 1rem;
border-color: var(--dl-color-theme-neutral-dark);
border-width: 1px;
border-radius: 4px;
background-color: var(--dl-color-theme-neutral-light);
}
.input {
color: var(--dl-color-theme-neutral-dark);
cursor: auto;
padding: 0.5rem 1rem;
border-color: var(--dl-color-theme-neutral-dark);
border-width: 1px;
border-radius: 4px;
background-color: var(--dl-color-theme-neutral-light);
}
.textarea {
color: var(--dl-color-theme-neutral-dark);
cursor: auto;
padding: 0.5rem;
border-color: var(--dl-color-theme-neutral-dark);
border-width: 1px;
border-radius: 4px;
background-color: var(--dl-color-theme-neutral-light);
}
.list {
width: 100%;
margin: 1em 0px 1em 0px;
display: block;
padding: 0px 0px 0px 1.5rem;
list-style-type: none;
list-style-position: outside;
}
.list-item {
display: list-item;
}
.teleport-show {
display: flex !important;
transform: none !important;
}
.thq-input {
color: var(--dl-color-theme-neutral-dark);
cursor: auto;
outline: none;
padding: 0.5rem 1rem;
align-self: stretch;
text-align: center;
border-color: var(--dl-color-theme-neutral-dark);
border-width: 1px;
border-radius: var(--dl-radius-radius-inputradius);
background-color: var(--dl-color-theme-neutral-light);
}
.thq-input:focus {
outline: 1px solid var(--dl-color-theme-primary1);
}
.highlight-question {
transition: background 0.5s;
background: #ffe066;
}
.thq-button-filled {
gap: var(--dl-space-space-halfunit);
fill: var(--dl-color-theme-secondary1);
color: var(--dl-color-theme-secondary1);
cursor: pointer;
display: flex;
transition: 0.3s;
align-items: center;
font-weight: bold;
padding-top: var(--dl-space-space-halfunit);
white-space: nowrap;
border-color: var(--dl-color-theme-primary1);
border-width: 1px;
padding-left: var(--dl-space-space-oneandhalfunits);
border-radius: var(--dl-radius-radius-buttonradius);
padding-right: var(--dl-space-space-oneandhalfunits);
padding-bottom: var(--dl-space-space-halfunit);
justify-content: center;
background-color: var(--dl-color-theme-primary1);
}
.thq-button-filled:hover {
fill: var(--dl-color-theme-secondary2);
color: var(--dl-color-theme-secondary2);
border-color: var(--dl-color-theme-primary2);
background-color: var(--dl-color-theme-primary2);
}
.thq-button-outline {
gap: var(--dl-space-space-halfunit);
fill: var(--dl-color-theme-primary1);
color: var(--dl-color-theme-primary1);
border: 1px solid;
cursor: pointer;
display: flex;
transition: 0.3s;
align-items: center;
font-weight: bold;
padding-top: var(--dl-space-space-halfunit);
white-space: nowrap;
border-color: var(--dl-color-theme-primary1);
padding-left: var(--dl-space-space-oneandhalfunits);
border-radius: var(--dl-radius-radius-buttonradius);
padding-right: var(--dl-space-space-oneandhalfunits);
padding-bottom: var(--dl-space-space-halfunit);
justify-content: center;
}
.thq-button-outline:hover {
fill: var(--dl-color-theme-secondary2);
color: var(--dl-color-theme-secondary2);
border-color: var(--dl-color-theme-primary2);
background-color: var(--dl-color-theme-primary2);
}
.thq-button-flat {
gap: var(--dl-space-space-halfunit);
fill: var(--dl-color-theme-primary1);
color: var(--dl-color-theme-primary1);
cursor: pointer;
display: flex;
transition: 0.3s;
align-items: center;
font-weight: bold;
padding-top: var(--dl-space-space-halfunit);
white-space: nowrap;
border-color: transparent;
border-width: 1px;
padding-left: var(--dl-space-space-oneandhalfunits);
border-radius: var(--dl-radius-radius-buttonradius);
padding-right: var(--dl-space-space-oneandhalfunits);
padding-bottom: var(--dl-space-space-halfunit);
justify-content: center;
}
.thq-button-flat:hover {
fill: var(--dl-color-theme-secondary1);
color: var(--dl-color-theme-secondary1);
border-color: var(--dl-color-theme-primary2);
background-color: var(--dl-color-theme-primary2);
}
.thq-heading-1 {
font-size: 48px;
font-family: STIX Two Text;
font-weight: 700;
line-height: 1.5;
}
.thq-heading-2 {
font-size: 35px;
font-family: STIX Two Text;
font-weight: 600;
line-height: 1.5;
}
.thq-heading-3 {
font-size: 26px;
font-family: STIX Two Text;
font-weight: 600;
line-height: 1.5;
}
.thq-body-large {
font-size: 18px;
font-family: Noto Sans;
line-height: 1.5;
}
.thq-body-small {
font-size: 16px;
font-family: Noto Sans;
line-height: 1.5;
}
.thq-team-image-round {
width: 80px;
height: 80px;
object-fit: cover;
border-radius: 50%;
}
.thq-section-padding {
width: 100%;
display: flex;
padding: var(--dl-space-space-fiveunits);
position: relative;
align-items: center;
flex-direction: column;
}
.thq-section-max-width {
width: 100%;
max-width: var(--dl-size-size-maxwidth);
}
.thq-img-ratio-1-1 {
width: 100%;
object-fit: cover;
aspect-ratio: 1/1;
border-radius: var(--dl-radius-radius-imageradius);
}
.thq-img-ratio-16-9 {
width: 100%;
object-fit: cover;
aspect-ratio: 16/9;
border-radius: var(--dl-radius-radius-imageradius);
}
.thq-img-ratio-4-3 {
width: 100%;
object-fit: cover;
aspect-ratio: 4/3;
border-radius: var(--dl-radius-radius-imageradius);
}
.thq-img-ratio-4-6 {
width: 100%;
object-fit: cover;
aspect-ratio: 4/6;
border-radius: var(--dl-radius-radius-imageradius);
}
.thq-img-round {
width: 100%;
border-radius: var(--dl-radius-radius-round);
}
.thq-flex-column {
gap: var(--dl-space-space-twounits);
display: flex;
overflow: hidden;
position: relative;
align-items: center;
flex-direction: column;
}
.thq-flex-row {
gap: var(--dl-space-space-twounits);
display: flex;
overflow: hidden;
position: relative;
align-items: center;
}
.thq-grid-6 {
display: grid;
grid-gap: var(--dl-space-space-twounits);
grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
}
.thq-grid-5 {
display: grid;
grid-gap: var(--dl-space-space-twounits);
grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
}
.thq-card {
gap: var(--dl-space-space-oneandhalfunits);
display: flex;
padding: var(--dl-space-space-twounits);
align-items: stretch;
border-radius: var(--dl-radius-radius-cardradius);
flex-direction: column;
}
.thq-box-shadow {
box-shadow: 0px 0px 5px -2px var(--dl-color-theme-neutral-dark);
}
.thq-grid-3 {
display: grid;
grid-gap: var(--dl-space-space-twounits);
grid-template-columns: 1fr 1fr 1fr;
}
.thq-grid-4 {
display: grid;
grid-gap: var(--dl-space-space-twounits);
grid-template-columns: 1fr 1fr 1fr 1fr;
}
.thq-grid-2 {
width: 100%;
display: grid;
grid-gap: var(--dl-space-space-twounits);
grid-template-columns: 1fr 1fr;
}
.thq-checkbox {
width: var(--dl-size-size-xsmall);
height: var(--dl-size-size-xsmall);
}
.thq-select {
cursor: pointer;
appearance: none;
padding-top: var(--dl-space-space-halfunit);
padding-left: var(--dl-space-space-unit);
border-radius: var(--dl-radius-radius-inputradius);
padding-right: var(--dl-space-space-twounits);
padding-bottom: var(--dl-space-space-halfunit);
background-color: var(--dl-color-theme-neutral-light);
background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg width%3D%2220%22 height%3D%2220%22 xmlns%3D%22http%3A//www.w3.org/2000/svg%22 viewBox%3D%220 0 20 20%22 fill%3D%22%23000%22%3E%3Cpath d%3D%22M4.293 7.293a1 1 0 011.414 0L10 11.586l4.293-4.293a1 1 0 111.414 1.414l-5 5a1 1 0 01-1.414 0l-5-5a1 1 0 010-1.414z%22/%3E%3C/svg%3E');
background-repeat: no-repeat;
background-position: right 8px center;
}
.thq-divider-horizontal {
width: 100%;
height: 1px;
background-color: var(--dl-color-theme-neutral-dark);
}
.thq-icon-small {
width: 24px;
height: 24px;
}
.thq-button-icon {
fill: var(--dl-color-theme-secondary1);
padding: 3px;
transition: 0.3s;
border-radius: var(--dl-radius-radius-round);
}
.thq-button-icon:hover {
fill: var(--dl-color-theme-secondary2);
}
.thq-icon-medium {
width: var(--dl-size-size-small);
height: var(--dl-size-size-small);
}
.thq-icon-x-small {
width: var(--dl-size-size-xsmall);
height: var(--dl-size-size-xsmall);
}
.thq-link {
cursor: pointer;
display: inline-block;
overflow: hidden;
background: linear-gradient(to right, var(--dl-color-theme-primary1) 50%, var(--dl-color-theme-neutral-dark) 50%);
transition: background-position 300ms ease;
font-weight: 600;
background-clip: text;
background-size: 200% 100%;
background-position: 100%;
-webkit-text-fill-color: transparent;
}
.thq-link:hover {
background-position: 0 100%;
}
.thq-grid-auto-300 {
display: grid;
grid-gap: var(--dl-space-space-oneandhalfunits);
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}
.thq-animated-group-vertical-reverse {
gap: var(--dl-space-space-unit);
width: 100%;
display: flex;
animation: scroll-y 20s linear infinite;
align-items: flex-start;
flex-direction: column;
justify-content: space-around;
animation-direction: reverse;
}
.thq-animated-group-horizontal-reverse {
gap: var(--dl-space-space-unit);
display: flex;
animation: scroll-x 20s linear infinite;
min-width: 100%;
align-items: center;
flex-shrink: 0;
justify-content: space-around;
animation-direction: reverse;
}
.thq-animated-group-vertical {
gap: var(--dl-space-space-unit);
width: 100%;
display: flex;
animation: scroll-y 20s linear infinite;
align-items: flex-start;
flex-direction: column;
justify-content: space-around;
}
.thq-animated-group-horizontal {
gap: var(--dl-space-space-unit);
display: flex;
animation: scroll-x 20s linear infinite;
min-width: 100%;
align-items: center;
flex-shrink: 0;
justify-content: space-around;
}
.thq-animated-group-container-vertical {
gap: var(--dl-space-space-unit);
display: flex;
overflow: hidden;
flex-direction: column;
}
.thq-animated-group-container-horizontal {
gap: var(--dl-space-space-unit);
display: flex;
overflow: hidden;
}
.thq-mask-image-vertical {
mask-image: linear-gradient(to bottom, transparent, black 1%, black 99%, transparent);
}
.thq-mask-image-horizontal {
mask-image: linear-gradient(to right, transparent, black 1%, black 99%, transparent);
}
.thq-img-scale {
transition: 0.3s;
}
.thq-img-scale:hover {
scale: 1.05;
}
.thq-animated-card-bg-1 {
width: 100%;
height: 100%;
transition: transform 0.3s;
border-radius: var(--dl-radius-radius-cardradius);
background-color: var(--dl-color-theme-accent1);
}
.thq-animated-card-bg-2 {
transition: transform 0.3s;
border-radius: var(--dl-radius-radius-cardradius);
background-color: var(--dl-color-theme-accent2);
}
.thq-button-animated {
outline: none;
z-index: 1;
overflow: hidden;
position: relative;
border-width: 2px;
}
.thq-input::placeholder {
text-align: center;
vertical-align: middle;
}
.thq-animated-group-container-vertical:hover div {
animation-play-state: paused;
}
.thq-animated-group-container-horizontal:hover div {
animation-play-state: paused;
}
.thq-animated-card-bg-2:has([data-animated="true"]:hover) {
transform: translate3d(0px, 0px, 0px) scale3d(1, 1, 1) rotateX(0deg) rotateY(0deg) rotateZ(3deg) skew(0deg, 0deg);
}
.thq-animated-card-bg-1:has([data-animated="true"]:hover) {
transform: translate3d(0px, 0px, 0px) scale3d(1, 1, 1) rotateX(0deg) rotateY(0deg) rotateZ(-6deg) skew(0deg, 0deg);
}
.thq-button-animated:before {
top: 0;
left: -20%;
color: var(--dl-color-theme-neutral-light);
width: 200%;
height: 101%;
content: "";
z-index: 1;
position: absolute;
transform: scaleX(0);
transition: transform 0.5s;
border-radius: var(--dl-radius-radius-buttonradius);
background-color: var(--dl-color-theme-neutral-dark);
transform-origin: 0 0;
transition-timing-function: cubic-bezier(0.5, 1.6, 0.4, 0.7);
}
.thq-button-animated:hover::before {
color: var(--dl-color-theme-neutral-light);
z-index: -1;
transform: scaleX(1);
}
.bodymacOSparagraphNormal {
font-size: 16px;
font-style: normal;
font-weight: 400px;
font-stretch: normal;
letter-spacing: 0.0005000000074505806em;
}
.bodymacOSparagraphSmall {
font-size: 14px;
font-style: normal;
font-weight: 400px;
font-stretch: normal;
letter-spacing: 0.0005000000074505806em;
}
.componentsdesktopbuttontextsmall {
font-size: 16px;
font-style: normal;
font-weight: 600px;
font-stretch: normal;
letter-spacing: 0.0005000000074505806em;
}
.manage-account-page.content {
margin: 12px 250px;
}
.title {
margin: 0 50px 20px 25px;
}
.manage-account-title{
margin: 0 250px 0;
font-family: 'SF Pro Display', Arial, sans-serif;
font-weight: 500;
font-size: 20px!important;
color: #011C41;
}
header.company-header {
color: #333;
padding: 1rem;
text-align: center;
border-bottom: 1px solid #d1d1d1;
background: var(--light);
height: 64px;
width: 100%;
padding: 0 20px;
display: flex;
align-items: center;
grid-gap: 12px;
position: fixed;
top: 0;
left: 0;
z-index: 100;
}
@media(max-width: 991px) {
.thq-grid-4 {
grid-template-columns: 1fr 1fr 1fr;
}
}
@media(max-width: 767px) {
.thq-section-padding {
padding: var(--dl-space-space-threeunits);
}
.thq-flex-column {
gap: var(--dl-space-space-oneandhalfunits);
}
.thq-flex-row {
gap: var(--dl-space-space-oneandhalfunits);
}
.thq-grid-6 {
grid-gap: var(--dl-space-space-oneandhalfunits);
grid-template-columns: 1fr 1fr 1fr;
}
.thq-grid-5 {
grid-gap: var(--dl-space-space-oneandhalfunits);
grid-template-columns: 1fr 1fr 1fr;
}
.thq-card {
padding: var(--dl-space-space-oneandhalfunits);
}
.thq-grid-3 {
grid-gap: var(--dl-space-space-oneandhalfunits);
grid-template-columns: 1fr 1fr;
}
.thq-grid-4 {
grid-gap: var(--dl-space-space-oneandhalfunits);
flex-direction: row;
grid-template-columns: 1fr 1fr;
}
.thq-grid-2 {
grid-gap: var(--dl-space-space-oneandhalfunits);
grid-template-columns: 1fr;
}
.thq-img-scale {
width: 100%;
}
}
@media(max-width: 479px) {
.thq-section-padding {
padding: var(--dl-space-space-oneandhalfunits);
}
.thq-flex-column {
gap: var(--dl-space-space-unit);
}
.thq-flex-row {
gap: var(--dl-space-space-unit);
}
.thq-grid-6 {
grid-gap: var(--dl-space-space-unit);
grid-template-columns: 1fr 1fr;
}
.thq-grid-5 {
grid-gap: var(--dl-space-space-unit);
grid-template-columns: 1fr 1fr;
}
.thq-grid-3 {
grid-gap: var(--dl-space-space-unit);
align-items: center;
grid-template-columns: 1fr;
}
.thq-grid-4 {
grid-gap: var(--dl-space-space-unit);
align-items: center;
flex-direction: column;
grid-template-columns: 1fr;
}
.thq-grid-2 {
grid-gap: var(--dl-space-space-unit);
}
.thq-grid-auto-300 {
grid-template-columns: 1fr;
}
}
@media screen and (max-width: 1050px) {
.bookings1toggle-list {
height: auto;
min-height: 1922;
}
}
@media screen and (max-width: 1000px) {
.days,
.site-bookings1 {
font-size: var(--font-size-11xl);
line-height: 38px;
}
.table-header {
display: none;
}
}
@media screen and (max-width: 725px) {
.showing-1-10-of {
min-width: 100%;
}
.controls {
flex-wrap: wrap;
}
.image-icon {
flex: 1;
}
.next-booking {
flex-wrap: wrap;
min-width: 100%;
}
.image-icon1 {
flex: 1;
}
.next-booking1 {
flex-wrap: wrap;
min-width: 100%;
}
.showing-1-10-of1 {
min-width: 100%;
}
.controls1 {
flex-wrap: wrap;
}
.showing-1-10-of2 {
min-width: 100%;
}
.controls2 {
flex-wrap: wrap;
}
}
@media screen and (max-width: 450px) {
.site-bookings1 {
font-size: var(--font-size-4xl);
line-height: 29px;
}
.next-site-booking,
.upcoming-bookings {
font-size: var(--components-desktop-button-text-small-size);
line-height: 19px;
}
.days {
font-size: var(--font-size-4xl);
line-height: 29px;
}
.date-highlight {
width: 100%;
height: 1px;
}
.booking-details {
flex-wrap: wrap;
}
.user-guide {
font-size: var(--components-desktop-button-text-small-size);
line-height: 19px;
}
.manage-account.frame-child {
width: 100%;
height: 1px;
}
.th-march-parent {
flex-wrap: wrap;
}
.active-bookings {
font-size: var(--font-size-lgi);
line-height: 24px;
}
.card-heading-child {
width: 100%;
height: 1px;
}
.card-heading2,
.icons {
flex-wrap: wrap;
}
.icons {
justify-content: center;
}
.historical-bookings {
font-size: var(--font-size-lgi);
line-height: 24px;
}
.title-bar {
width: 100%;
height: 1px;
}
.card-heading3,
.icons1 {
flex-wrap: wrap;
}
.icons1 {
justify-content: center;
}
@media (max-width: 800px) {
.sidebar {
width: 193px;
background-color: #fff;
color: #333;
border: 1px solid #cdcdcd;
box-shadow: 6px 1px 8px #cdcdcd38;
transition: all 0.3s ease;
position: fixed;
height: 100%;
overflow-y: auto;
scrollbar-width: none;
top: 63px;
left: 0;
}
}
}