11231 lines
294 KiB
CSS
11231 lines
294 KiB
CSS
/***
|
|
The new CSS reset - version 1.7.3 (last updated 7.8.2022)
|
|
GitHub page: https://github.com/elad2412/the-new-css-reset
|
|
***/
|
|
/*
|
|
Customized reset:
|
|
- Added .gv-activated class
|
|
- Moved all:unset; display: revert; part to component level
|
|
- Added reset for buttons and form elements
|
|
*/
|
|
.gv-activated {
|
|
/* Preferred box-sizing value */
|
|
/* Remove margins around the body */
|
|
/* Reset buttons and form elements */
|
|
/* Set cursor for interactive elements */
|
|
/* Remove list styles (bullets/numbers) */
|
|
/* For images to not be able to exceed their container */
|
|
/* removes spacing between cells in tables */
|
|
/* revert the 'white-space' property for textarea elements on Safari */
|
|
/* minimum style to allow to style meter element */
|
|
/* reset default text opacity of input placeholder */
|
|
/* fix the feature of 'hidden' attribute.
|
|
display:revert; revert to element instead of attribute */
|
|
/* revert for bug in Chromium browsers
|
|
- fix for the content editable attribute will work properly.
|
|
- webkit-user-select: auto; added for Safari in case of using user-select:none on wrapper element */
|
|
/* apply back the draggable feature - exist only in Chromium and Safari */
|
|
}
|
|
.gv-activated,
|
|
.gv-activated *,
|
|
.gv-activated *::before,
|
|
.gv-activated *::after {
|
|
box-sizing: border-box;
|
|
}
|
|
body.gv-activated {
|
|
margin: 0;
|
|
}
|
|
.gv-activated button,
|
|
.gv-activated input,
|
|
.gv-activated optgroup,
|
|
.gv-activated select,
|
|
.gv-activated textarea {
|
|
color: inherit;
|
|
font-family: inherit;
|
|
font-feature-settings: inherit;
|
|
font-variation-settings: inherit;
|
|
font-size: inherit;
|
|
font-weight: inherit;
|
|
letter-spacing: inherit;
|
|
line-height: inherit;
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
.gv-activated button:focus,
|
|
.gv-activated input:focus,
|
|
.gv-activated optgroup:focus,
|
|
.gv-activated select:focus,
|
|
.gv-activated textarea:focus {
|
|
outline: none;
|
|
}
|
|
.gv-activated button,
|
|
.gv-activated select {
|
|
text-transform: none;
|
|
}
|
|
.gv-activated button,
|
|
.gv-activated [type="button"],
|
|
.gv-activated [type="reset"],
|
|
.gv-activated [type="submit"] {
|
|
background-color: transparent;
|
|
background-image: none;
|
|
border: none;
|
|
user-select: none;
|
|
}
|
|
.gv-activated input,
|
|
.gv-activated textarea {
|
|
box-shadow: none;
|
|
outline: none;
|
|
/* Safari - solving issue when using user-select:none on the <body> text input doesn't working */
|
|
user-select: auto;
|
|
}
|
|
.gv-activated a[href],
|
|
.gv-activated button:not(:disabled),
|
|
.gv-activated [role="button"] {
|
|
cursor: pointer;
|
|
}
|
|
.gv-activated :disabled {
|
|
cursor: default;
|
|
}
|
|
.gv-activated ol,
|
|
.gv-activated ul,
|
|
.gv-activated menu {
|
|
list-style: none;
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
.gv-activated img {
|
|
max-width: 100%;
|
|
}
|
|
.gv-activated table {
|
|
border-collapse: collapse;
|
|
}
|
|
.gv-activated textarea {
|
|
white-space: revert;
|
|
}
|
|
.gv-activated meter {
|
|
appearance: revert;
|
|
}
|
|
.gv-activated ::placeholder {
|
|
color: unset;
|
|
}
|
|
.gv-activated :where([hidden]) {
|
|
display: none;
|
|
}
|
|
.gv-activated :where([contenteditable]:not([contenteditable="false"])) {
|
|
-moz-user-modify: read-write;
|
|
-webkit-user-modify: read-write;
|
|
overflow-wrap: break-word;
|
|
-webkit-line-break: after-white-space;
|
|
user-select: auto;
|
|
}
|
|
.gv-activated :where([draggable="true"]) {
|
|
-webkit-user-drag: element;
|
|
}
|
|
/* Fluid */
|
|
/* Typography
|
|
* Mixins to reuse text styles in other components
|
|
*/
|
|
/* Truncate */
|
|
/* Fluid space */
|
|
/* Container */
|
|
/* Stack space */
|
|
/* Flex layout */
|
|
/* Condensed */
|
|
/* Progress circle */
|
|
/* Reset */
|
|
/* Spacers for margin, paddings, etc. */
|
|
/* Icons sizes */
|
|
/* Breakpoints */
|
|
/* Fine grained break points */
|
|
/* Min and Max container sizes. */
|
|
/* Media queries */
|
|
/* Colors (for LESS functions) */
|
|
/* Z-level indexes
|
|
* TODO: Would be nice to generate levels automatically by a constant number, based
|
|
* on a list - LESS does not offer a solution for this currently without drawbacks
|
|
*/
|
|
@font-face {
|
|
font-display: swap;
|
|
font-family: PlusJakartaSans;
|
|
font-style: normal;
|
|
font-weight: 400 700;
|
|
src: url("../fonts/PlusJakartaSans.woff2") format("woff2"), url("../fonts/PlusJakartaSans.ttf") format("truetype");
|
|
}
|
|
/* Condensed mode */
|
|
.gv-activated {
|
|
/* Deprecated long name classes */
|
|
}
|
|
.gv-activated .gv-mode-condensed {
|
|
/* Form */
|
|
--form-element-height: 30px;
|
|
}
|
|
@media (max-width: 599px ) {
|
|
.gv-activated .gv-max-mob-mode-condensed {
|
|
/* Form */
|
|
--form-element-height: 30px;
|
|
}
|
|
}
|
|
@media (min-width: 600px ) {
|
|
.gv-activated .gv-tab-mode-condensed {
|
|
/* Form */
|
|
--form-element-height: 30px;
|
|
}
|
|
}
|
|
@media (max-width: 767px ) {
|
|
.gv-activated .gv-max-tab-sm-mode-condensed {
|
|
/* Form */
|
|
--form-element-height: 30px;
|
|
}
|
|
}
|
|
@media (min-width: 768px ) {
|
|
.gv-activated .gv-tab-lg-mode-condensed {
|
|
/* Form */
|
|
--form-element-height: 30px;
|
|
}
|
|
}
|
|
@media (max-width: 1023px ) {
|
|
.gv-activated .gv-max-tab-mode-condensed {
|
|
/* Form */
|
|
--form-element-height: 30px;
|
|
}
|
|
}
|
|
@media (min-width: 1024px ) {
|
|
.gv-activated .gv-desk-mode-condensed {
|
|
/* Form */
|
|
--form-element-height: 30px;
|
|
}
|
|
}
|
|
@media (max-width: 599px ) {
|
|
.gv-activated .gv-mobile-mode-condensed {
|
|
/* Form */
|
|
--form-element-height: 30px;
|
|
}
|
|
}
|
|
@media (min-width: 600px ) and (max-width: 1023px ) {
|
|
.gv-activated .gv-tablet-mode-condensed {
|
|
/* Form */
|
|
--form-element-height: 30px;
|
|
}
|
|
}
|
|
@media (min-width: 600px ) and (max-width: 767px ) {
|
|
.gv-activated .gv-tablet-small-mode-condensed {
|
|
/* Form */
|
|
--form-element-height: 30px;
|
|
}
|
|
}
|
|
@media (min-width: 768px ) and (max-width: 1023px ) {
|
|
.gv-activated .gv-tablet-large-mode-condensed {
|
|
/* Form */
|
|
--form-element-height: 30px;
|
|
}
|
|
}
|
|
@media (min-width: 1024px ) {
|
|
.gv-activated .gv-desktop-mode-condensed {
|
|
/* Form */
|
|
--form-element-height: 30px;
|
|
}
|
|
}
|
|
.gv-activated .gv-accordion .gv-acc-item:not(:first-child) {
|
|
border-top: var(--size-border) solid var(--color-border);
|
|
}
|
|
.gv-activated .gv-accordion .gv-acc-header {
|
|
display: block;
|
|
width: 100%;
|
|
font-weight: var(--font-weight-semibold);
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-accordion .gv-acc-header .gv-acc-trigger {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: var(--size-xs);
|
|
padding: var(--size-md) 0 var(--size-md) 0;
|
|
position: relative;
|
|
text-align: left;
|
|
width: 100%;
|
|
}
|
|
.gv-activated .gv-accordion .gv-acc-header .gv-acc-trigger .gv-acc-title {
|
|
display: block;
|
|
padding-right: var(--size-xl);
|
|
position: relative;
|
|
width: 100%;
|
|
}
|
|
.gv-activated .gv-accordion .gv-acc-header .gv-acc-trigger .gv-acc-title::after {
|
|
background-color: var(--color-body-on-default);
|
|
content: "";
|
|
display: block;
|
|
-webkit-mask: url("../images/chevron-down.svg") no-repeat 50% 50%;
|
|
mask: url("../images/chevron-down.svg") no-repeat 50% 50%;
|
|
-webkit-mask-size: contain;
|
|
mask-size: contain;
|
|
height: var(--size-icon-md);
|
|
right: var(--size-sm);
|
|
position: absolute;
|
|
top: 0;
|
|
width: var(--size-icon-md);
|
|
}
|
|
.gv-activated .gv-accordion .gv-acc-header .gv-acc-trigger.gv-expanded .gv-acc-title::after {
|
|
transform: rotate(180deg);
|
|
}
|
|
.gv-activated .gv-accordion .gv-acc-content {
|
|
padding: 0 var(--size-xl) var(--size-lg) 0;
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
@media (min-width: 600px ) {
|
|
.gv-activated .gv-accordion .gv-acc-header .gv-acc-trigger {
|
|
gap: var(--size-sm);
|
|
padding: var(--size-lg) 0 var(--size-lg) 0;
|
|
}
|
|
}
|
|
.gv-activated .gv-action {
|
|
align-items: center;
|
|
color: var(--color-state-form-active);
|
|
cursor: pointer;
|
|
display: inline-flex;
|
|
flex-wrap: nowrap;
|
|
gap: 4px;
|
|
text-decoration: none;
|
|
font-weight: var(--font-weight-semibold);
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-action:hover {
|
|
color: var(--color-state-form-active);
|
|
}
|
|
.gv-activated .gv-badge {
|
|
--badge-color-background: inherit;
|
|
--badge-color-border: inherit;
|
|
--badge-color-text: inherit;
|
|
background-color: var(--badge-color-background);
|
|
border: var(--size-border) solid var(--badge-color-border);
|
|
border-radius: var(--border-radius);
|
|
color: var(--badge-color-text);
|
|
display: inline-block;
|
|
/* text-overflow doesn't work on flex or inline-flex, so use inline-block to keep the component simple */
|
|
height: 26px;
|
|
max-width: 100%;
|
|
padding: calc(var(--size-xs) - var(--size-border)) var(--size-sm);
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
font-size: 12px;
|
|
font-weight: var(--font-weight-medium);
|
|
letter-spacing: 0.048px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-badge.gv-badge-generic {
|
|
--badge-color-background: var(--color-surface-bright);
|
|
--badge-color-border: var(--color-border);
|
|
--badge-color-text: var(--color-body-on-default);
|
|
}
|
|
.gv-activated .gv-badge.gv-badge-alert {
|
|
--badge-color-background: var(--color-signal-alert-light);
|
|
--badge-color-border: var(--color-signal-alert);
|
|
--badge-color-text: var(--color-signal-alert);
|
|
}
|
|
.gv-activated .gv-badge.gv-badge-warning {
|
|
--badge-color-background: var(--color-signal-warning-light);
|
|
--badge-color-border: var(--color-signal-warning);
|
|
--badge-color-text: var(--color-signal-warning);
|
|
}
|
|
.gv-activated .gv-badge.gv-badge-info {
|
|
--badge-color-background: var(--color-signal-info-light);
|
|
--badge-color-border: var(--color-signal-info);
|
|
--badge-color-text: var(--color-signal-info);
|
|
}
|
|
.gv-activated .gv-badge.gv-badge-success {
|
|
--badge-color-background: var(--color-signal-success-light);
|
|
--badge-color-border: var(--color-signal-success);
|
|
--badge-color-text: var(--color-signal-success);
|
|
}
|
|
.gv-activated .gv-breadcrumbs {
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
line-height: var(--line-height-body);
|
|
/* Back link */
|
|
}
|
|
.gv-activated .gv-breadcrumbs a,
|
|
.gv-activated .gv-breadcrumbs span {
|
|
/* Apply values to calculate em_based margins that work with any font size */
|
|
}
|
|
.gv-activated .gv-breadcrumbs a::before,
|
|
.gv-activated .gv-breadcrumbs span::before {
|
|
margin-bottom: calc(-0.375em + 0px);
|
|
}
|
|
.gv-activated .gv-breadcrumbs a::after,
|
|
.gv-activated .gv-breadcrumbs span::after {
|
|
margin-top: calc(-0.3125em + 0px);
|
|
}
|
|
.gv-activated .gv-breadcrumbs a::before,
|
|
.gv-activated .gv-breadcrumbs span::before,
|
|
.gv-activated .gv-breadcrumbs a::after,
|
|
.gv-activated .gv-breadcrumbs span::after {
|
|
content: "";
|
|
display: block;
|
|
height: 0;
|
|
width: 0;
|
|
}
|
|
.gv-activated .gv-breadcrumbs a {
|
|
color: var(--color-body-on-alternative);
|
|
text-decoration: none;
|
|
}
|
|
.gv-activated .gv-breadcrumbs a:hover {
|
|
color: var(--color-body-on-alternative);
|
|
}
|
|
.gv-activated .gv-breadcrumbs > a {
|
|
align-items: center;
|
|
display: inline-flex;
|
|
}
|
|
.gv-activated .gv-breadcrumbs > a gv-icon {
|
|
margin-right: var(--size-xs);
|
|
}
|
|
.gv-activated ul.gv-breadcrumbs {
|
|
align-items: center;
|
|
color: var(--color-body-on-alternative);
|
|
display: inline-flex;
|
|
flex-wrap: wrap;
|
|
gap: var(--size-sm);
|
|
padding: 0;
|
|
}
|
|
.gv-activated ul.gv-breadcrumbs li {
|
|
align-items: center;
|
|
display: inline-flex;
|
|
list-style: none;
|
|
margin: 0;
|
|
}
|
|
.gv-activated ul.gv-breadcrumbs li:last-child {
|
|
color: var(--color-body-on-default);
|
|
font-weight: var(--font-weight-semibold);
|
|
}
|
|
.gv-activated ul.gv-breadcrumbs li gv-icon {
|
|
margin-left: var(--size-sm);
|
|
}
|
|
/* Button group mixin */
|
|
/* Button component */
|
|
.gv-activated .gv-button {
|
|
--button-color-background: inherit;
|
|
--button-color-border: transparent;
|
|
--button-color-text: inherit;
|
|
--button-height: var(--form-element-height);
|
|
align-items: center;
|
|
background: var(--button-color-background);
|
|
border: var(--size-border) solid var(--button-color-border);
|
|
border-radius: var(--button-radius);
|
|
color: var(--button-color-text);
|
|
cursor: pointer;
|
|
display: inline-flex;
|
|
gap: var(--size-xs);
|
|
height: var(--button-height);
|
|
font-family: inherit;
|
|
font-weight: var(--font-weight-semibold);
|
|
justify-content: center;
|
|
outline: none;
|
|
padding: var(--size-sm) var(--size-md);
|
|
text-align: center;
|
|
text-decoration: none;
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
line-height: var(--line-height-body);
|
|
/* Condensed mode */
|
|
/* Deprecated long name classes */
|
|
}
|
|
.gv-activated .gv-button.gv-button-primary {
|
|
--button-color-background: var(--color-button-bg-primary);
|
|
--button-color-border: var(--color-button-bg-primary);
|
|
--button-color-text: var(--color-button-fg-on-primary);
|
|
}
|
|
.gv-activated .gv-button.gv-button-secondary {
|
|
--button-color-background: var(--color-surface-bright);
|
|
--button-color-border: var(--color-button-border-secondary);
|
|
--button-color-text: var(--color-body-on-default);
|
|
}
|
|
.gv-activated .gv-button.gv-button-cta {
|
|
--button-color-background: var(--color-button-bg-cta);
|
|
--button-color-border: var(--color-button-bg-cta);
|
|
--button-color-text: var(--color-button-fg-on-cta);
|
|
}
|
|
.gv-activated .gv-button.gv-button-cancel {
|
|
--button-color-background: transparent;
|
|
--button-color-border: var(--color-border);
|
|
--button-color-text: var(--color-body-on-default);
|
|
}
|
|
.gv-activated .gv-button.gv-button-destructive {
|
|
--button-color-background: var(--color-signal-alert);
|
|
--button-color-border: var(--color-signal-alert);
|
|
--button-color-text: var(--color-body-on-inverted);
|
|
}
|
|
.gv-activated .gv-button.gv-button-neutral {
|
|
--button-color-background: var(--color-on-fixed-white);
|
|
--button-color-border: var(--color-on-fixed-white);
|
|
--button-color-text: var(--color-on-fixed-black);
|
|
}
|
|
.gv-activated .gv-button.gv-button-icon {
|
|
border-radius: var(--button-height);
|
|
padding-left: 0;
|
|
padding-right: 0;
|
|
width: var(--button-height);
|
|
}
|
|
.gv-activated .gv-button:active,
|
|
.gv-activated .gv-button:hover,
|
|
.gv-activated .gv-button:focus {
|
|
color: var(--button-color-text);
|
|
opacity: var(--opacity-active-elements);
|
|
text-decoration: none;
|
|
}
|
|
.gv-activated .gv-button.gv-disabled,
|
|
.gv-activated .gv-button:disabled {
|
|
cursor: auto;
|
|
opacity: var(--opacity-disabled-elements);
|
|
pointer-events: none;
|
|
}
|
|
@media (max-width: 599px ) {
|
|
.gv-activated .gv-button {
|
|
width: 100%;
|
|
}
|
|
}
|
|
.gv-activated .gv-button .gv-mode-condensed .gv-button,
|
|
.gv-activated .gv-button .gv-button.gv-mode-condensed {
|
|
font-size: 12px;
|
|
font-weight: var(--font-weight-semibold);
|
|
letter-spacing: 0.048px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
@media (max-width: 599px ) {
|
|
.gv-activated .gv-button .gv-max-mob-mode-condensed .gv-button,
|
|
.gv-activated .gv-button .gv-button.gv-max-mob-mode-condensed {
|
|
font-size: 12px;
|
|
font-weight: var(--font-weight-semibold);
|
|
letter-spacing: 0.048px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
}
|
|
@media (min-width: 600px ) {
|
|
.gv-activated .gv-button .gv-tab-mode-condensed .gv-button,
|
|
.gv-activated .gv-button .gv-button.gv-tab-mode-condensed {
|
|
font-size: 12px;
|
|
font-weight: var(--font-weight-semibold);
|
|
letter-spacing: 0.048px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
}
|
|
@media (max-width: 767px ) {
|
|
.gv-activated .gv-button .gv-max-tab-sm-mode-condensed .gv-button,
|
|
.gv-activated .gv-button .gv-button.gv-max-tab-sm-mode-condensed {
|
|
font-size: 12px;
|
|
font-weight: var(--font-weight-semibold);
|
|
letter-spacing: 0.048px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
}
|
|
@media (min-width: 768px ) {
|
|
.gv-activated .gv-button .gv-tab-lg-mode-condensed .gv-button,
|
|
.gv-activated .gv-button .gv-button.gv-tab-lg-mode-condensed {
|
|
font-size: 12px;
|
|
font-weight: var(--font-weight-semibold);
|
|
letter-spacing: 0.048px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
}
|
|
@media (max-width: 1023px ) {
|
|
.gv-activated .gv-button .gv-max-tab-mode-condensed .gv-button,
|
|
.gv-activated .gv-button .gv-button.gv-max-tab-mode-condensed {
|
|
font-size: 12px;
|
|
font-weight: var(--font-weight-semibold);
|
|
letter-spacing: 0.048px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
}
|
|
@media (min-width: 1024px ) {
|
|
.gv-activated .gv-button .gv-desk-mode-condensed .gv-button,
|
|
.gv-activated .gv-button .gv-button.gv-desk-mode-condensed {
|
|
font-size: 12px;
|
|
font-weight: var(--font-weight-semibold);
|
|
letter-spacing: 0.048px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
}
|
|
@media (max-width: 599px ) {
|
|
.gv-activated .gv-button .gv-mobile-mode-condensed .gv-button,
|
|
.gv-activated .gv-button .gv-button.gv-mobile-mode-condensed {
|
|
font-size: 12px;
|
|
font-weight: var(--font-weight-semibold);
|
|
letter-spacing: 0.048px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
}
|
|
@media (min-width: 600px ) and (max-width: 1023px ) {
|
|
.gv-activated .gv-button .gv-tablet-mode-condensed .gv-button,
|
|
.gv-activated .gv-button .gv-button.gv-tablet-mode-condensed {
|
|
font-size: 12px;
|
|
font-weight: var(--font-weight-semibold);
|
|
letter-spacing: 0.048px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
}
|
|
@media (min-width: 600px ) and (max-width: 767px ) {
|
|
.gv-activated .gv-button .gv-tablet-small-mode-condensed .gv-button,
|
|
.gv-activated .gv-button .gv-button.gv-tablet-small-mode-condensed {
|
|
font-size: 12px;
|
|
font-weight: var(--font-weight-semibold);
|
|
letter-spacing: 0.048px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
}
|
|
@media (min-width: 768px ) and (max-width: 1023px ) {
|
|
.gv-activated .gv-button .gv-tablet-large-mode-condensed .gv-button,
|
|
.gv-activated .gv-button .gv-button.gv-tablet-large-mode-condensed {
|
|
font-size: 12px;
|
|
font-weight: var(--font-weight-semibold);
|
|
letter-spacing: 0.048px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
}
|
|
@media (min-width: 1024px ) {
|
|
.gv-activated .gv-button .gv-desktop-mode-condensed .gv-button,
|
|
.gv-activated .gv-button .gv-button.gv-desktop-mode-condensed {
|
|
font-size: 12px;
|
|
font-weight: var(--font-weight-semibold);
|
|
letter-spacing: 0.048px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
}
|
|
.gv-activated .gv-button-group {
|
|
align-items: flex-start;
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: var(--size-md);
|
|
}
|
|
.gv-activated .gv-button-group.gv-vertical {
|
|
align-items: stretch;
|
|
flex-direction: column;
|
|
gap: var(--size-sm);
|
|
width: 100%;
|
|
}
|
|
@media (max-width: 599px ) {
|
|
.gv-activated .gv-button-group {
|
|
align-items: stretch;
|
|
flex-direction: column;
|
|
gap: var(--size-sm);
|
|
width: 100%;
|
|
}
|
|
}
|
|
.gv-activated .gv-button-toggle-group {
|
|
display: flex;
|
|
flex-wrap: nowrap;
|
|
}
|
|
.gv-activated .gv-button-toggle-group .gv-button-toggle {
|
|
align-items: center;
|
|
background: none;
|
|
border-radius: var(--button-radius);
|
|
color: var(--color-body-on-alternative);
|
|
cursor: pointer;
|
|
display: inline-flex;
|
|
font-family: inherit;
|
|
height: var(--form-element-height);
|
|
justify-content: center;
|
|
outline: none;
|
|
padding: var(--size-sm) var(--size-md);
|
|
}
|
|
.gv-activated .gv-button-toggle-group .gv-button-toggle:hover {
|
|
background-color: var(--color-state-hover);
|
|
}
|
|
.gv-activated .gv-button-toggle-group .gv-button-toggle.gv-active {
|
|
background-color: var(--color-state-active);
|
|
color: var(--color-body-on-default);
|
|
}
|
|
.gv-activated .gv-card {
|
|
border-radius: var(--border-radius);
|
|
border: var(--size-border) solid var(--color-border-alt);
|
|
color: var(--color-body-on-default);
|
|
display: flex;
|
|
flex-direction: column;
|
|
max-width: 100%;
|
|
position: relative;
|
|
text-decoration: none;
|
|
}
|
|
.gv-activated .gv-card:hover {
|
|
color: var(--color-body-on-default);
|
|
}
|
|
.gv-activated .gv-card .gv-card-image,
|
|
.gv-activated .gv-card .gv-card-video {
|
|
border-top-left-radius: var(--border-radius);
|
|
border-top-right-radius: var(--border-radius);
|
|
height: 200px;
|
|
overflow: hidden;
|
|
width: 100%;
|
|
}
|
|
.gv-activated .gv-card .gv-card-image img,
|
|
.gv-activated .gv-card .gv-card-video img {
|
|
height: 100%;
|
|
object-fit: cover;
|
|
object-position: center center;
|
|
transition: all 0.2s ease-out;
|
|
width: 100%;
|
|
}
|
|
.gv-activated .gv-card .gv-card-video {
|
|
position: relative;
|
|
}
|
|
.gv-activated .gv-card .gv-card-video > * {
|
|
height: 100%;
|
|
width: 100%;
|
|
}
|
|
.gv-activated .gv-card .gv-card-video .gv-video-overlay {
|
|
align-items: center;
|
|
background-color: var(--color-overlay-dark);
|
|
bottom: 0;
|
|
color: var(--color-on-fixed-white);
|
|
cursor: pointer;
|
|
display: flex;
|
|
justify-content: center;
|
|
left: 0;
|
|
position: absolute;
|
|
right: 0;
|
|
top: 0;
|
|
z-index: 200;
|
|
}
|
|
.gv-activated .gv-card .gv-card-content,
|
|
.gv-activated .gv-card .gv-card-illustration,
|
|
.gv-activated .gv-card .gv-card-icon {
|
|
padding: 24px 24px 0;
|
|
}
|
|
.gv-activated .gv-card .gv-card-content {
|
|
flex-grow: 1;
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-card .gv-card-content > *:not(:last-child) {
|
|
margin-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-card .gv-card-content:last-child {
|
|
padding-bottom: 24px;
|
|
}
|
|
.gv-activated .gv-card .gv-card-content + .gv-notice-addon {
|
|
margin-top: 24px;
|
|
}
|
|
.gv-activated .gv-card .gv-card-title {
|
|
font-weight: var(--font-weight-semibold);
|
|
line-height: var(--line-height-body);
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-card .gv-card-title {
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-card .gv-card-title {
|
|
font-size: calc(14px + 4 * ((100vw - 360px ) / 1080 ));
|
|
letter-spacing: calc(0.035px + -0.035 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-card .gv-card-title {
|
|
font-size: 18px;
|
|
letter-spacing: 0px;
|
|
}
|
|
}
|
|
.gv-activated .gv-card .gv-card-footer {
|
|
padding: 16px 24px 24px;
|
|
}
|
|
.gv-activated a.gv-card:hover .gv-card-image img {
|
|
transform: scale(1.05);
|
|
}
|
|
/* Comparison table mixins */
|
|
.gv-activated .gv-comparison-table {
|
|
--comparison-sidebar-width: 220px;
|
|
--recommended-label-height: 0;
|
|
--slider-dots-height: var(--size-lg);
|
|
--slider-dots-space: calc(var(--slider-dots-height) + var(--size-sm));
|
|
}
|
|
.gv-activated .gv-comparison-table.gv-has-recommended {
|
|
--recommended-label-height: 26px;
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-dots-scroll-area {
|
|
position: relative;
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-slider-pagination {
|
|
display: none;
|
|
justify-content: center;
|
|
bottom: var(--size-lg);
|
|
position: sticky;
|
|
z-index: 210;
|
|
width: 100%;
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-slider-pagination .gv-dots {
|
|
align-items: center;
|
|
background-color: transparent;
|
|
border: 1px solid transparent;
|
|
border-radius: var(--border-radius);
|
|
display: flex;
|
|
gap: var(--size-sm);
|
|
height: var(--slider-dots-height);
|
|
padding: 0 var(--size-md);
|
|
transition: all 1s;
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-slider-pagination .gv-dots > * {
|
|
background: var(--color-gray-400);
|
|
border-radius: var(--size-sm);
|
|
color: transparent;
|
|
display: block;
|
|
height: var(--size-sm);
|
|
width: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-slider-pagination .gv-dots > *.gv-active {
|
|
background: var(--color-primary);
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-slider-pagination.gv-state-top {
|
|
bottom: 100%;
|
|
transform: translateY(calc(var(--slider-dots-space) * -1));
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-slider-pagination.gv-state-overlay .gv-dots {
|
|
background-color: rgb(from var(--color-surface-bright) r g b / 90%);
|
|
border: 1px solid var(--color-border);
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-slider-nav {
|
|
display: none;
|
|
position: sticky;
|
|
top: 0;
|
|
width: 100%;
|
|
z-index: 210;
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-slider-nav.gv-state-bottom {
|
|
position: absolute;
|
|
top: auto !important;
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-slider-nav:not(.gv-state-bottom) {
|
|
bottom: auto !important;
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-slider-nav .gv-nav-button {
|
|
align-items: center;
|
|
background-color: var(--color-primary);
|
|
border-radius: var(--border-radius);
|
|
color: var(--color-button-fg-on);
|
|
display: flex;
|
|
height: 40px;
|
|
justify-content: center;
|
|
position: absolute;
|
|
top: 0;
|
|
width: 40px;
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-slider-nav .gv-nav-button.gv-previous {
|
|
left: 0;
|
|
transform: translate(-50%, -50%);
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-slider-nav .gv-nav-button.gv-next {
|
|
right: 0;
|
|
transform: translate(50%, -50%);
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-slider-nav .gv-nav-button.gv-disabled {
|
|
cursor: auto;
|
|
opacity: var(--opacity-disabled-elements);
|
|
pointer-events: none;
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-table-container {
|
|
position: relative;
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-table-container::before,
|
|
.gv-activated .gv-comparison-table .gv-table-container::after {
|
|
background-color: var(--color-border);
|
|
bottom: 0;
|
|
content: "";
|
|
position: absolute;
|
|
top: var(--recommended-label-height);
|
|
width: 1px;
|
|
z-index: 201;
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-table-container::before {
|
|
left: 0;
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-table-container::after {
|
|
right: 0;
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-comparison-table .gv-table-slider {
|
|
padding-right: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-comparison-table .gv-table-slider {
|
|
padding-right: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-comparison-table .gv-table-slider {
|
|
padding-right: 48px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-comparison-table .gv-table-slider {
|
|
margin-right: -24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-comparison-table .gv-table-slider {
|
|
margin-right: calc(-24px + -24 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-comparison-table .gv-table-slider {
|
|
margin-right: -48px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-comparison-table .gv-table-slider .gv-table {
|
|
padding-right: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-comparison-table .gv-table-slider .gv-table {
|
|
padding-right: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-comparison-table .gv-table-slider .gv-table {
|
|
padding-right: 48px;
|
|
}
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-table {
|
|
box-sizing: content-box;
|
|
padding-top: var(--recommended-label-height);
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-table-row {
|
|
display: flex;
|
|
flex-wrap: nowrap;
|
|
position: relative;
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-header-info,
|
|
.gv-activated .gv-comparison-table .gv-cell-info {
|
|
border-right: 1px solid var(--color-border);
|
|
flex: 0 0 var(--comparison-sidebar-width);
|
|
left: 0;
|
|
position: sticky;
|
|
width: var(--comparison-sidebar-width);
|
|
z-index: 200;
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-product,
|
|
.gv-activated .gv-comparison-table .gv-cell {
|
|
border-right: 1px solid var(--color-border);
|
|
flex: 1;
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-table-header,
|
|
.gv-activated .gv-comparison-table .gv-header-info,
|
|
.gv-activated .gv-comparison-table .gv-section,
|
|
.gv-activated .gv-comparison-table .gv-table-row:nth-child(odd) .gv-cell-info {
|
|
background: var(--color-surface-bright);
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-table-row:nth-child(even),
|
|
.gv-activated .gv-comparison-table .gv-table-row:nth-child(even) .gv-cell-info {
|
|
background: var(--color-surface-dim);
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-table-header {
|
|
border-bottom: 1px solid var(--color-border);
|
|
border-top: 1px solid var(--color-border);
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-table-info {
|
|
padding: var(--size-lg);
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-bottom-info {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-product {
|
|
display: flex;
|
|
flex-direction: column;
|
|
padding: var(--size-lg);
|
|
position: relative;
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-product .gv-recommended-label {
|
|
background: var(--color-button-bg-cta);
|
|
border-top-left-radius: var(--button-radius);
|
|
border-top-right-radius: var(--button-radius);
|
|
color: var(--color-button-fg-on-cta);
|
|
left: 0;
|
|
opacity: 1;
|
|
padding: var(--size-xs) var(--size-sm);
|
|
position: absolute;
|
|
right: 0;
|
|
text-align: center;
|
|
top: 0;
|
|
transform: translateY(-100%);
|
|
transition: opacity 0.2s linear 0s;
|
|
font-size: 12px;
|
|
font-weight: var(--font-weight-semibold);
|
|
letter-spacing: 0.048px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-product .gv-content {
|
|
flex-grow: 1;
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-product .gv-content > *:not(:last-child) {
|
|
margin-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-product .gv-content .gv-title {
|
|
font-weight: var(--font-weight-semibold);
|
|
letter-spacing: 0;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-comparison-table .gv-product .gv-content .gv-title {
|
|
font-size: 16px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-comparison-table .gv-product .gv-content .gv-title {
|
|
font-size: calc(16px + 8 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-comparison-table .gv-product .gv-content .gv-title {
|
|
font-size: 24px;
|
|
}
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-product .gv-bottom {
|
|
padding-top: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-product .gv-bottom > *:not(:last-child) {
|
|
margin-bottom: 24px;
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-product .gv-bottom .gv-price-container > *:not(:last-child) {
|
|
margin-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-product .gv-bottom .gv-price-container .gv-price {
|
|
align-items: flex-end;
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-product .gv-bottom .gv-price-container .gv-price-text {
|
|
white-space: nowrap;
|
|
font-weight: var(--font-weight-bold);
|
|
line-height: var(--line-height-heading);
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-comparison-table .gv-product .gv-bottom .gv-price-container .gv-price-text {
|
|
font-size: 16px;
|
|
letter-spacing: 0.048px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-comparison-table .gv-product .gv-bottom .gv-price-container .gv-price-text {
|
|
font-size: calc(16px + 12 * ((100vw - 360px ) / 1080 ));
|
|
letter-spacing: calc(0.048px + -0.006 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-comparison-table .gv-product .gv-bottom .gv-price-container .gv-price-text {
|
|
font-size: 28px;
|
|
letter-spacing: 0.042px;
|
|
}
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-product .gv-bottom .gv-price-container .gv-period {
|
|
padding-bottom: var(--size-xs);
|
|
white-space: nowrap;
|
|
font-weight: var(--font-weight-semibold);
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-product .gv-bottom .gv-price-container .gv-price-info {
|
|
color: var(--color-body-on-alternative);
|
|
font-size: 12px;
|
|
font-weight: var(--font-weight-medium);
|
|
letter-spacing: 0.048px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-product .gv-bottom .gv-price-container .gv-price-tooltip {
|
|
display: inline-block;
|
|
position: relative;
|
|
vertical-align: middle;
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-product .gv-bottom .gv-price-container .gv-price-tooltip gv-icon {
|
|
height: var(--size-icon-sm);
|
|
width: var(--size-icon-sm);
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-product .gv-bottom .gv-price-container .gv-price-tooltip .gv-tooltip {
|
|
bottom: 100%;
|
|
display: none;
|
|
left: 50%;
|
|
position: absolute;
|
|
transform: translateX(-50%);
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-product .gv-bottom .gv-price-container .gv-price-tooltip:hover .gv-tooltip {
|
|
display: block;
|
|
width: 120px;
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-product .gv-bottom .gv-button {
|
|
width: 100%;
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-section {
|
|
border-bottom: 1px solid var(--color-border);
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-section .gv-section-header {
|
|
border-bottom: 1px solid var(--color-border);
|
|
border-right: 1px solid var(--color-border);
|
|
position: relative;
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-section .gv-section-header .gv-title {
|
|
display: block;
|
|
left: 0;
|
|
padding: var(--size-md) 0 var(--size-md) var(--size-lg);
|
|
position: sticky;
|
|
font-weight: var(--font-weight-semibold);
|
|
line-height: var(--line-height-body);
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-comparison-table .gv-section .gv-section-header .gv-title {
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-comparison-table .gv-section .gv-section-header .gv-title {
|
|
font-size: calc(14px + 2 * ((100vw - 360px ) / 1080 ));
|
|
letter-spacing: calc(0.035px + 0.045 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-comparison-table .gv-section .gv-section-header .gv-title {
|
|
font-size: 16px;
|
|
letter-spacing: 0.08px;
|
|
}
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-section .gv-table-row {
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-cell-info,
|
|
.gv-activated .gv-comparison-table .gv-cell {
|
|
display: flex;
|
|
gap: var(--size-sm);
|
|
padding: var(--size-sm) var(--size-lg);
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-cell-tooltip {
|
|
position: relative;
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-cell-tooltip .gv-tooltip {
|
|
bottom: 100%;
|
|
display: none;
|
|
left: 50%;
|
|
position: absolute;
|
|
transform: translateX(-50%);
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-cell-tooltip:hover .gv-tooltip {
|
|
display: block;
|
|
min-width: 120px;
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-cell {
|
|
justify-content: center;
|
|
}
|
|
.gv-activated .gv-comparison-table.gv-products-2 .gv-product,
|
|
.gv-activated .gv-comparison-table.gv-products-2 .gv-cell {
|
|
max-width: calc((100% - var(--comparison-sidebar-width)) / 2);
|
|
}
|
|
.gv-activated .gv-comparison-table.gv-products-3 .gv-product,
|
|
.gv-activated .gv-comparison-table.gv-products-3 .gv-cell {
|
|
max-width: calc((100% - var(--comparison-sidebar-width)) / 3);
|
|
}
|
|
.gv-activated .gv-comparison-table.gv-products-4 .gv-product,
|
|
.gv-activated .gv-comparison-table.gv-products-4 .gv-cell {
|
|
max-width: calc((100% - var(--comparison-sidebar-width)) / 4);
|
|
}
|
|
.gv-activated .gv-comparison-table.gv-products-5 .gv-product,
|
|
.gv-activated .gv-comparison-table.gv-products-5 .gv-cell {
|
|
max-width: calc((100% - var(--comparison-sidebar-width)) / 5);
|
|
}
|
|
@media (max-width: 599px ) {
|
|
.gv-activated .gv-comparison-table.gv-products-1 .gv-header-info {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-bottom-info {
|
|
display: block;
|
|
}
|
|
.gv-activated .gv-comparison-table.gv-products-2 .gv-table {
|
|
width: calc(var(--comparison-sidebar-width) + (100% * 2));
|
|
}
|
|
.gv-activated .gv-comparison-table.gv-products-2 .gv-section-header .gv-title {
|
|
width: calc(((100% - var(--comparison-sidebar-width)) / 2) - 1px);
|
|
}
|
|
.gv-activated .gv-comparison-table.gv-products-2 .gv-slider-nav,
|
|
.gv-activated .gv-comparison-table.gv-products-2 .gv-slider-pagination {
|
|
display: flex;
|
|
}
|
|
.gv-activated .gv-comparison-table.gv-products-2 .gv-dots-scroll-area {
|
|
padding-top: var(--slider-dots-space);
|
|
}
|
|
.gv-activated .gv-comparison-table.gv-products-2 .gv-table-slider {
|
|
margin-bottom: var(--size-lg);
|
|
overflow-x: auto;
|
|
overscroll-behavior-x: none;
|
|
position: relative;
|
|
scroll-snap-type: x mandatory;
|
|
-webkit-overflow-scrolling: touch;
|
|
-ms-overflow-style: none;
|
|
scrollbar-width: none;
|
|
}
|
|
.gv-activated .gv-comparison-table.gv-products-2 .gv-table-slider::-webkit-scrollbar {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-comparison-table.gv-products-2 .gv-table-header {
|
|
scroll-snap-align: start;
|
|
}
|
|
.gv-activated .gv-comparison-table.gv-products-2 .gv-product {
|
|
scroll-snap-align: end;
|
|
}
|
|
.gv-activated .gv-comparison-table.gv-products-3 .gv-table {
|
|
width: calc(var(--comparison-sidebar-width) + (100% * 3));
|
|
}
|
|
.gv-activated .gv-comparison-table.gv-products-3 .gv-section-header .gv-title {
|
|
width: calc(((100% - var(--comparison-sidebar-width)) / 3) - 1px);
|
|
}
|
|
.gv-activated .gv-comparison-table.gv-products-4 .gv-table {
|
|
width: calc(var(--comparison-sidebar-width) + (100% * 4));
|
|
}
|
|
.gv-activated .gv-comparison-table.gv-products-4 .gv-section-header .gv-title {
|
|
width: calc(((100% - var(--comparison-sidebar-width)) / 4) - 1px);
|
|
}
|
|
.gv-activated .gv-comparison-table.gv-products-5 .gv-table {
|
|
width: calc(var(--comparison-sidebar-width) + (100% * 5));
|
|
}
|
|
.gv-activated .gv-comparison-table.gv-products-5 .gv-section-header .gv-title {
|
|
width: calc(((100% - var(--comparison-sidebar-width)) / 5) - 1px);
|
|
}
|
|
.gv-activated .gv-comparison-table:not(.gv-products-1) .gv-table-container::after {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-comparison-table:not(.gv-products-1) .gv-table-header {
|
|
scroll-snap-align: none !important;
|
|
}
|
|
.gv-activated .gv-comparison-table:not(.gv-products-1) .gv-product {
|
|
scroll-snap-align: start !important;
|
|
}
|
|
.gv-activated .gv-comparison-table:not(.gv-products-1) .gv-header-info {
|
|
opacity: 0;
|
|
pointer-events: none;
|
|
}
|
|
.gv-activated .gv-comparison-table:not(.gv-products-1) .gv-cell {
|
|
padding-left: calc(var(--comparison-sidebar-width) + var(--size-lg));
|
|
}
|
|
}
|
|
@media (min-width: 600px ) and (max-width: 1023px ) {
|
|
.gv-activated .gv-comparison-table .gv-slider-pagination .gv-dots > *:last-child {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-comparison-table.gv-products-3 .gv-table {
|
|
width: calc(100% + ((100% - var(--comparison-sidebar-width)) / (3 - 1) * 1));
|
|
}
|
|
.gv-activated .gv-comparison-table.gv-products-3 .gv-section-header .gv-title {
|
|
width: calc(var(--comparison-sidebar-width) - 1px + (((100% - var(--comparison-sidebar-width)) / 3) * (3 - 1)));
|
|
}
|
|
.gv-activated .gv-comparison-table.gv-products-4 .gv-table {
|
|
width: calc(100% + ((100% - var(--comparison-sidebar-width)) / (4 - 2) * 2));
|
|
}
|
|
.gv-activated .gv-comparison-table.gv-products-4 .gv-section-header .gv-title {
|
|
width: calc(var(--comparison-sidebar-width) - 1px + (((100% - var(--comparison-sidebar-width)) / 4) * (4 - 2)));
|
|
}
|
|
.gv-activated .gv-comparison-table.gv-products-5 .gv-table {
|
|
width: calc(100% + ((100% - var(--comparison-sidebar-width)) / (5 - 3) * 3));
|
|
}
|
|
.gv-activated .gv-comparison-table.gv-products-5 .gv-section-header .gv-title {
|
|
width: calc(var(--comparison-sidebar-width) - 1px + (((100% - var(--comparison-sidebar-width)) / 5) * (5 - 3)));
|
|
}
|
|
}
|
|
@media (min-width: 600px ) {
|
|
.gv-activated .gv-comparison-table .gv-table-slider {
|
|
margin-right: 0 !important;
|
|
padding-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-table-slider .gv-table {
|
|
padding-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-comparison-table .gv-product .gv-recommended-label.gv-off-view {
|
|
opacity: 0;
|
|
}
|
|
}
|
|
@media (max-width: 1023px ) {
|
|
.gv-activated .gv-comparison-table.gv-products-3 .gv-slider-nav,
|
|
.gv-activated .gv-comparison-table.gv-products-4 .gv-slider-nav,
|
|
.gv-activated .gv-comparison-table.gv-products-3 .gv-slider-pagination,
|
|
.gv-activated .gv-comparison-table.gv-products-4 .gv-slider-pagination {
|
|
display: flex;
|
|
}
|
|
.gv-activated .gv-comparison-table.gv-products-3 .gv-dots-scroll-area,
|
|
.gv-activated .gv-comparison-table.gv-products-4 .gv-dots-scroll-area {
|
|
padding-top: var(--slider-dots-space);
|
|
}
|
|
.gv-activated .gv-comparison-table.gv-products-3 .gv-table-slider,
|
|
.gv-activated .gv-comparison-table.gv-products-4 .gv-table-slider {
|
|
margin-bottom: var(--size-lg);
|
|
overflow-x: auto;
|
|
overscroll-behavior-x: none;
|
|
position: relative;
|
|
scroll-snap-type: x mandatory;
|
|
-webkit-overflow-scrolling: touch;
|
|
-ms-overflow-style: none;
|
|
scrollbar-width: none;
|
|
}
|
|
.gv-activated .gv-comparison-table.gv-products-3 .gv-table-slider::-webkit-scrollbar,
|
|
.gv-activated .gv-comparison-table.gv-products-4 .gv-table-slider::-webkit-scrollbar {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-comparison-table.gv-products-3 .gv-table-header,
|
|
.gv-activated .gv-comparison-table.gv-products-4 .gv-table-header {
|
|
scroll-snap-align: start;
|
|
}
|
|
.gv-activated .gv-comparison-table.gv-products-3 .gv-product,
|
|
.gv-activated .gv-comparison-table.gv-products-4 .gv-product {
|
|
scroll-snap-align: end;
|
|
}
|
|
}
|
|
@media (max-width: 1279px ) {
|
|
.gv-activated .gv-comparison-table.gv-products-5 .gv-slider-nav,
|
|
.gv-activated .gv-comparison-table.gv-products-5 .gv-slider-pagination {
|
|
display: flex;
|
|
}
|
|
.gv-activated .gv-comparison-table.gv-products-5 .gv-dots-scroll-area {
|
|
padding-top: var(--slider-dots-space);
|
|
}
|
|
.gv-activated .gv-comparison-table.gv-products-5 .gv-table-slider {
|
|
margin-bottom: var(--size-lg);
|
|
overflow-x: auto;
|
|
overscroll-behavior-x: none;
|
|
position: relative;
|
|
scroll-snap-type: x mandatory;
|
|
-webkit-overflow-scrolling: touch;
|
|
-ms-overflow-style: none;
|
|
scrollbar-width: none;
|
|
}
|
|
.gv-activated .gv-comparison-table.gv-products-5 .gv-table-slider::-webkit-scrollbar {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-comparison-table.gv-products-5 .gv-table-header {
|
|
scroll-snap-align: start;
|
|
}
|
|
.gv-activated .gv-comparison-table.gv-products-5 .gv-product {
|
|
scroll-snap-align: end;
|
|
}
|
|
}
|
|
@media (min-width: 1024px ) and (max-width: 1279px ) {
|
|
.gv-activated .gv-comparison-table.gv-products-5 .gv-table {
|
|
width: calc(100% + ((100% - var(--comparison-sidebar-width)) / (5 - 1) * 1));
|
|
}
|
|
.gv-activated .gv-comparison-table.gv-products-5 .gv-section-header .gv-title {
|
|
width: calc(var(--comparison-sidebar-width) - 1px + (((100% - var(--comparison-sidebar-width)) / 5) * (5 - 1)));
|
|
}
|
|
.gv-activated .gv-comparison-table.gv-products-5 .gv-slider-pagination .gv-dots > *:nth-last-child(-n + 3) {
|
|
display: none;
|
|
}
|
|
}
|
|
.gv-activated .gv-content-container {
|
|
background-color: var(--color-surface-bright);
|
|
border: var(--size-border) solid var(--color-border-alt);
|
|
border-radius: var(--border-radius);
|
|
box-shadow: var(--color-shadow-subtle);
|
|
}
|
|
.gv-activated .gv-contextual-menu {
|
|
z-index: 1100;
|
|
}
|
|
.gv-activated .gv-contextual-menu .gv-menu {
|
|
background-color: var(--color-surface-bright);
|
|
padding: var(--size-sm);
|
|
width: 100%;
|
|
}
|
|
.gv-activated .gv-contextual-menu .gv-menu > *:not(:last-child) {
|
|
margin-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-contextual-menu .gv-btn-close {
|
|
display: none;
|
|
padding: 8px;
|
|
position: absolute;
|
|
right: var(--size-sm);
|
|
top: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-contextual-menu ul {
|
|
list-style: none;
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-contextual-menu ul > *:not(:last-child) {
|
|
margin-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-contextual-menu ul li {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-contextual-menu .gv-menu-item {
|
|
align-items: center;
|
|
border-radius: var(--border-radius);
|
|
display: flex;
|
|
gap: var(--size-sm);
|
|
height: var(--size-xl);
|
|
padding: 0 var(--size-sm);
|
|
position: relative;
|
|
text-align: left;
|
|
text-decoration: none;
|
|
width: 100%;
|
|
}
|
|
.gv-activated .gv-contextual-menu .gv-menu-item:hover {
|
|
background-color: var(--color-state-hover);
|
|
}
|
|
.gv-activated .gv-contextual-menu .gv-menu-item.gv-active,
|
|
.gv-activated .gv-contextual-menu .gv-menu-item[aria-selected="true"] {
|
|
background-color: var(--color-state-active);
|
|
}
|
|
.gv-activated .gv-contextual-menu .gv-menu-item[target="_blank"] {
|
|
padding-right: 32px;
|
|
}
|
|
.gv-activated .gv-contextual-menu .gv-menu-item[target="_blank"] .gv-indicator {
|
|
margin-left: var(--size-xs);
|
|
margin-right: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-contextual-menu .gv-menu-item[target="_blank"]::after {
|
|
background-color: var(--color-body-on-default);
|
|
content: "";
|
|
display: block;
|
|
-webkit-mask: url("../images/open_in_new.svg") no-repeat 50% 50%;
|
|
mask: url("../images/open_in_new.svg") no-repeat 50% 50%;
|
|
-webkit-mask-size: contain;
|
|
mask-size: contain;
|
|
height: 100%;
|
|
right: var(--size-sm);
|
|
position: absolute;
|
|
top: 0;
|
|
width: var(--size-icon-md);
|
|
}
|
|
.gv-activated .gv-contextual-menu .gv-menu-item gv-icon {
|
|
flex-shrink: 0;
|
|
}
|
|
.gv-activated .gv-contextual-menu .gv-menu-item > span {
|
|
flex-grow: 1;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
.gv-activated .gv-contextual-menu .gv-divider {
|
|
margin-top: var(--size-md);
|
|
}
|
|
@media (max-width: 599px ) {
|
|
.gv-activated .gv-contextual-menu {
|
|
bottom: 0;
|
|
background: var(--color-overlay-dark);
|
|
left: 0;
|
|
position: fixed;
|
|
right: 0;
|
|
top: 0;
|
|
}
|
|
.gv-activated .gv-contextual-menu .gv-menu {
|
|
bottom: 0;
|
|
left: 0;
|
|
padding-top: var(--size-xl);
|
|
position: absolute;
|
|
}
|
|
.gv-activated .gv-contextual-menu .gv-btn-close {
|
|
display: block;
|
|
}
|
|
}
|
|
@media (min-width: 600px ) {
|
|
.gv-activated .gv-contextual-menu {
|
|
max-width: 300px;
|
|
min-width: 200px;
|
|
position: absolute;
|
|
}
|
|
.gv-activated .gv-contextual-menu .gv-menu {
|
|
border: 1px solid var(--color-border-alt);
|
|
border-radius: var(--border-radius);
|
|
box-shadow: var(--color-shadow-elevated);
|
|
}
|
|
.gv-activated .gv-contextual-menu .gv-menu gv-icon {
|
|
height: var(--size-icon-sm);
|
|
width: var(--size-icon-sm);
|
|
}
|
|
.gv-activated .gv-contextual-menu .gv-menu-item {
|
|
height: 30px;
|
|
}
|
|
.gv-activated .gv-contextual-menu .gv-menu-item[target="_blank"]::after {
|
|
width: var(--size-icon-sm);
|
|
}
|
|
}
|
|
.gv-activated .gv-chip {
|
|
--chip-color-background: var(--color-surface-dim);
|
|
--chip-color-border: var(--color-border);
|
|
--chip-color-text: var(--color-body-on-default);
|
|
--chip-height: 28px;
|
|
background-color: var(--chip-color-background);
|
|
border: var(--size-border) solid var(--chip-color-border);
|
|
border-radius: var(--chip-radius);
|
|
color: var(--chip-color-text);
|
|
cursor: pointer;
|
|
display: inline-block;
|
|
/* text-overflow doesn't work on flex or inline-flex, so use inline-block to keep the component simple */
|
|
height: var(--chip-height);
|
|
max-width: 100%;
|
|
padding: var(--size-xs) var(--size-md);
|
|
position: relative;
|
|
font-size: 12px;
|
|
font-weight: var(--font-weight-medium);
|
|
letter-spacing: 0.048px;
|
|
line-height: var(--line-height-body);
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
.gv-activated .gv-chip.gv-chip-active {
|
|
--chip-color-background: var(--color-state-active);
|
|
--chip-color-border: var(--color-state-focus);
|
|
}
|
|
.gv-activated .gv-chip.gv-chip-active:not(.gv-chip-radio) {
|
|
padding-right: 40px;
|
|
/* Padding-right + icon size + gap */
|
|
}
|
|
.gv-activated .gv-chip.gv-chip-active:not(.gv-chip-radio)::after {
|
|
background-color: var(--chip-color-text);
|
|
content: "";
|
|
display: block;
|
|
-webkit-mask: url("../images/close.svg") no-repeat 50% 50%;
|
|
mask: url("../images/close.svg") no-repeat 50% 50%;
|
|
-webkit-mask-size: contain;
|
|
mask-size: contain;
|
|
height: 100%;
|
|
right: 16px;
|
|
position: absolute;
|
|
top: 0;
|
|
width: var(--size-icon-sm);
|
|
}
|
|
.gv-activated .gv-chip.gv-chip-active.gv-chip-radio {
|
|
cursor: default;
|
|
}
|
|
.gv-activated .gv-chip-labels {
|
|
--chip-label-height: 16px;
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: 4px;
|
|
}
|
|
.gv-activated .gv-chip-labels .gv-item {
|
|
background-color: var(--color-state-active);
|
|
border-radius: 16px;
|
|
color: var(--color-body-on-default);
|
|
height: var(--chip-label-height);
|
|
line-height: var(--chip-label-height);
|
|
padding: 0 8px;
|
|
text-transform: uppercase;
|
|
font-size: 10px;
|
|
font-weight: var(--font-weight-semibold);
|
|
letter-spacing: 0.04px;
|
|
line-height: var(--line-height-body);
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
.gv-activated .gv-chip-labels .gv-more {
|
|
color: var(--color-state-form-active);
|
|
line-height: var(--chip-label-height);
|
|
padding-left: 8px;
|
|
position: relative;
|
|
text-decoration: none;
|
|
white-space: nowrap;
|
|
font-size: 10px;
|
|
font-weight: var(--font-weight-semibold);
|
|
letter-spacing: 0.04px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-chip-labels .gv-more::before {
|
|
content: "+";
|
|
display: block;
|
|
left: 0;
|
|
position: absolute;
|
|
top: -1px;
|
|
}
|
|
/* Data table mixins */
|
|
.gv-activated .gv-data-table {
|
|
background-color: var(--color-surface-bright);
|
|
border: 1px solid var(--color-border-alt);
|
|
border-radius: var(--border-radius);
|
|
box-shadow: var(--color-shadow-subtle);
|
|
overflow: hidden;
|
|
width: 100%;
|
|
/* Form */
|
|
--form-element-height: 30px;
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-data-table .gv-button {
|
|
font-size: 12px;
|
|
font-weight: var(--font-weight-semibold);
|
|
letter-spacing: 0.048px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-data-table .gv-checkbox {
|
|
height: var(--size-md);
|
|
width: var(--size-md);
|
|
}
|
|
.gv-activated .gv-data-table .gv-radio {
|
|
height: var(--size-md);
|
|
width: var(--size-md);
|
|
}
|
|
.gv-activated .gv-data-table .gv-radio:checked::after {
|
|
border-width: 5px;
|
|
}
|
|
.gv-activated .gv-data-table .gv-input.gv-input-number button {
|
|
padding: 0;
|
|
}
|
|
.gv-activated .gv-data-table .gv-toggle {
|
|
--toggle-height: 16px;
|
|
--toggle-width: 28px;
|
|
--toggle-dot-indent: 2px;
|
|
}
|
|
.gv-activated .gv-data-table .gv-col-1-text-right tr > *:nth-child(1) {
|
|
text-align: right;
|
|
}
|
|
.gv-activated .gv-data-table .gv-col-1-shrink tr > *:nth-child(1) {
|
|
width: 1px;
|
|
}
|
|
.gv-activated .gv-data-table .gv-col-1-truncate tr > *:nth-child(1) {
|
|
max-width: 1px;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
.gv-activated .gv-data-table .gv-col-2-text-right tr > *:nth-child(2) {
|
|
text-align: right;
|
|
}
|
|
.gv-activated .gv-data-table .gv-col-2-shrink tr > *:nth-child(2) {
|
|
width: 1px;
|
|
}
|
|
.gv-activated .gv-data-table .gv-col-2-truncate tr > *:nth-child(2) {
|
|
max-width: 1px;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
.gv-activated .gv-data-table .gv-col-3-text-right tr > *:nth-child(3) {
|
|
text-align: right;
|
|
}
|
|
.gv-activated .gv-data-table .gv-col-3-shrink tr > *:nth-child(3) {
|
|
width: 1px;
|
|
}
|
|
.gv-activated .gv-data-table .gv-col-3-truncate tr > *:nth-child(3) {
|
|
max-width: 1px;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
.gv-activated .gv-data-table .gv-col-4-text-right tr > *:nth-child(4) {
|
|
text-align: right;
|
|
}
|
|
.gv-activated .gv-data-table .gv-col-4-shrink tr > *:nth-child(4) {
|
|
width: 1px;
|
|
}
|
|
.gv-activated .gv-data-table .gv-col-4-truncate tr > *:nth-child(4) {
|
|
max-width: 1px;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
.gv-activated .gv-data-table .gv-col-5-text-right tr > *:nth-child(5) {
|
|
text-align: right;
|
|
}
|
|
.gv-activated .gv-data-table .gv-col-5-shrink tr > *:nth-child(5) {
|
|
width: 1px;
|
|
}
|
|
.gv-activated .gv-data-table .gv-col-5-truncate tr > *:nth-child(5) {
|
|
max-width: 1px;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
.gv-activated .gv-data-table .gv-col-6-text-right tr > *:nth-child(6) {
|
|
text-align: right;
|
|
}
|
|
.gv-activated .gv-data-table .gv-col-6-shrink tr > *:nth-child(6) {
|
|
width: 1px;
|
|
}
|
|
.gv-activated .gv-data-table .gv-col-6-truncate tr > *:nth-child(6) {
|
|
max-width: 1px;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
.gv-activated .gv-data-table .gv-col-7-text-right tr > *:nth-child(7) {
|
|
text-align: right;
|
|
}
|
|
.gv-activated .gv-data-table .gv-col-7-shrink tr > *:nth-child(7) {
|
|
width: 1px;
|
|
}
|
|
.gv-activated .gv-data-table .gv-col-7-truncate tr > *:nth-child(7) {
|
|
max-width: 1px;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
.gv-activated .gv-data-table .gv-col-8-text-right tr > *:nth-child(8) {
|
|
text-align: right;
|
|
}
|
|
.gv-activated .gv-data-table .gv-col-8-shrink tr > *:nth-child(8) {
|
|
width: 1px;
|
|
}
|
|
.gv-activated .gv-data-table .gv-col-8-truncate tr > *:nth-child(8) {
|
|
max-width: 1px;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
.gv-activated .gv-data-table .gv-col-9-text-right tr > *:nth-child(9) {
|
|
text-align: right;
|
|
}
|
|
.gv-activated .gv-data-table .gv-col-9-shrink tr > *:nth-child(9) {
|
|
width: 1px;
|
|
}
|
|
.gv-activated .gv-data-table .gv-col-9-truncate tr > *:nth-child(9) {
|
|
max-width: 1px;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
.gv-activated .gv-data-table .gv-col-10-text-right tr > *:nth-child(10) {
|
|
text-align: right;
|
|
}
|
|
.gv-activated .gv-data-table .gv-col-10-shrink tr > *:nth-child(10) {
|
|
width: 1px;
|
|
}
|
|
.gv-activated .gv-data-table .gv-col-10-truncate tr > *:nth-child(10) {
|
|
max-width: 1px;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
.gv-activated .gv-data-table .gv-col-11-text-right tr > *:nth-child(11) {
|
|
text-align: right;
|
|
}
|
|
.gv-activated .gv-data-table .gv-col-11-shrink tr > *:nth-child(11) {
|
|
width: 1px;
|
|
}
|
|
.gv-activated .gv-data-table .gv-col-11-truncate tr > *:nth-child(11) {
|
|
max-width: 1px;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
.gv-activated .gv-data-table .gv-col-12-text-right tr > *:nth-child(12) {
|
|
text-align: right;
|
|
}
|
|
.gv-activated .gv-data-table .gv-col-12-shrink tr > *:nth-child(12) {
|
|
width: 1px;
|
|
}
|
|
.gv-activated .gv-data-table .gv-col-12-truncate tr > *:nth-child(12) {
|
|
max-width: 1px;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
.gv-activated .gv-data-table .gv-empty-state {
|
|
gap: 16px;
|
|
padding: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-data-table .gv-empty-state .gv-empty-state-content > *:not(:last-child) {
|
|
margin-bottom: 0;
|
|
}
|
|
.gv-activated .gv-data-table .gv-empty-state .gv-empty-state-content .gv-title {
|
|
font-weight: var(--font-weight-semibold);
|
|
line-height: var(--line-height-body);
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-data-table .gv-empty-state .gv-empty-state-content .gv-title {
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-data-table .gv-empty-state .gv-empty-state-content .gv-title {
|
|
font-size: calc(14px + 4 * ((100vw - 360px ) / 1080 ));
|
|
letter-spacing: calc(0.035px + -0.035 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-data-table .gv-empty-state .gv-empty-state-content .gv-title {
|
|
font-size: 18px;
|
|
letter-spacing: 0px;
|
|
}
|
|
}
|
|
.gv-activated .gv-data-table .gv-load-more {
|
|
padding: 16px 24px;
|
|
text-align: center;
|
|
}
|
|
.gv-activated .gv-data-table table {
|
|
line-height: var(--line-height-body);
|
|
width: 100%;
|
|
}
|
|
.gv-activated .gv-data-table thead {
|
|
border-bottom: 1px solid var(--color-border-alt);
|
|
}
|
|
.gv-activated .gv-data-table tbody tr:nth-child(even) {
|
|
background-color: var(--color-zebra-even);
|
|
}
|
|
.gv-activated .gv-data-table tbody tr:nth-child(odd) {
|
|
background-color: var(--color-zebra-odd);
|
|
}
|
|
.gv-activated .gv-data-table tbody tr:hover {
|
|
background-color: var(--color-zebra-hover);
|
|
}
|
|
.gv-activated .gv-data-table.gv-data-table-alternative tbody tr {
|
|
background-color: var(--color-zebra-even);
|
|
}
|
|
.gv-activated .gv-data-table.gv-data-table-alternative tbody tr:not(:last-child) {
|
|
border-bottom: 1px solid var(--color-border-alt);
|
|
}
|
|
.gv-activated .gv-data-table th,
|
|
.gv-activated .gv-data-table td {
|
|
padding: 8px 16px;
|
|
white-space: nowrap;
|
|
}
|
|
.gv-activated .gv-data-table th {
|
|
font-weight: var(--font-weight-semibold);
|
|
}
|
|
.gv-activated .gv-data-table th:not(.gv-text-right) {
|
|
text-align: left;
|
|
}
|
|
.gv-activated .gv-data-table th .gv-th-sort {
|
|
align-items: center;
|
|
display: inline-flex;
|
|
flex-wrap: nowrap;
|
|
gap: 16px;
|
|
}
|
|
.gv-activated .gv-data-table .gv-col-shrink {
|
|
width: 1px;
|
|
}
|
|
.gv-activated .gv-data-table .gv-col-truncate {
|
|
max-width: 1px;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
.gv-activated .gv-data-table .gv-underline {
|
|
color: var(--color-body-on-alternative);
|
|
display: block;
|
|
font-size: 10px;
|
|
font-weight: var(--font-weight-medium);
|
|
letter-spacing: 0.04px;
|
|
line-height: var(--line-height-body);
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
.gv-activated .gv-data-table .gv-text-icon {
|
|
align-items: center;
|
|
max-width: 100%;
|
|
}
|
|
.gv-activated .gv-data-table .gv-text-icon gv-icon {
|
|
height: var(--size-icon-sm);
|
|
width: var(--size-icon-sm);
|
|
}
|
|
.gv-activated .gv-data-table .gv-text-icon span {
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
.gv-activated .gv-data-table a[target="_blank"]:not(.gv-button, .gv-no-external-icon) {
|
|
padding-right: calc(var(--size-icon-sm) + var(--size-xs));
|
|
position: relative;
|
|
}
|
|
.gv-activated .gv-data-table a[target="_blank"]:not(.gv-button, .gv-no-external-icon)::after {
|
|
background-color: var(--color-body-on-default);
|
|
content: "";
|
|
display: block;
|
|
-webkit-mask: url("../images/open_in_new.svg") no-repeat 50% 50%;
|
|
mask: url("../images/open_in_new.svg") no-repeat 50% 50%;
|
|
-webkit-mask-size: contain;
|
|
mask-size: contain;
|
|
height: 100%;
|
|
right: 0;
|
|
position: absolute;
|
|
top: 0;
|
|
width: var(--size-icon-sm);
|
|
}
|
|
.gv-activated .gv-data-table a[target="_blank"]:not(.gv-button, .gv-no-external-icon).gv-action::after {
|
|
background-color: var(--color-state-form-active);
|
|
}
|
|
@media (max-width: 599px ) {
|
|
.gv-activated .gv-data-table .gv-max-mob-col-1-hidden tr > *:nth-child(1) {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-data-table .gv-max-mob-col-2-hidden tr > *:nth-child(2) {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-data-table .gv-max-mob-col-3-hidden tr > *:nth-child(3) {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-data-table .gv-max-mob-col-4-hidden tr > *:nth-child(4) {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-data-table .gv-max-mob-col-5-hidden tr > *:nth-child(5) {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-data-table .gv-max-mob-col-6-hidden tr > *:nth-child(6) {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-data-table .gv-max-mob-col-7-hidden tr > *:nth-child(7) {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-data-table .gv-max-mob-col-8-hidden tr > *:nth-child(8) {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-data-table .gv-max-mob-col-9-hidden tr > *:nth-child(9) {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-data-table .gv-max-mob-col-10-hidden tr > *:nth-child(10) {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-data-table .gv-max-mob-col-11-hidden tr > *:nth-child(11) {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-data-table .gv-max-mob-col-12-hidden tr > *:nth-child(12) {
|
|
display: none;
|
|
}
|
|
}
|
|
@media (max-width: 767px ) {
|
|
.gv-activated .gv-data-table .gv-max-tab-sm-col-1-hidden tr > *:nth-child(1) {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-data-table .gv-max-tab-sm-col-2-hidden tr > *:nth-child(2) {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-data-table .gv-max-tab-sm-col-3-hidden tr > *:nth-child(3) {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-data-table .gv-max-tab-sm-col-4-hidden tr > *:nth-child(4) {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-data-table .gv-max-tab-sm-col-5-hidden tr > *:nth-child(5) {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-data-table .gv-max-tab-sm-col-6-hidden tr > *:nth-child(6) {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-data-table .gv-max-tab-sm-col-7-hidden tr > *:nth-child(7) {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-data-table .gv-max-tab-sm-col-8-hidden tr > *:nth-child(8) {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-data-table .gv-max-tab-sm-col-9-hidden tr > *:nth-child(9) {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-data-table .gv-max-tab-sm-col-10-hidden tr > *:nth-child(10) {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-data-table .gv-max-tab-sm-col-11-hidden tr > *:nth-child(11) {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-data-table .gv-max-tab-sm-col-12-hidden tr > *:nth-child(12) {
|
|
display: none;
|
|
}
|
|
}
|
|
@media (max-width: 1023px ) {
|
|
.gv-activated .gv-data-table .gv-max-tab-col-1-hidden tr > *:nth-child(1) {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-data-table .gv-max-tab-col-2-hidden tr > *:nth-child(2) {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-data-table .gv-max-tab-col-3-hidden tr > *:nth-child(3) {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-data-table .gv-max-tab-col-4-hidden tr > *:nth-child(4) {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-data-table .gv-max-tab-col-5-hidden tr > *:nth-child(5) {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-data-table .gv-max-tab-col-6-hidden tr > *:nth-child(6) {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-data-table .gv-max-tab-col-7-hidden tr > *:nth-child(7) {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-data-table .gv-max-tab-col-8-hidden tr > *:nth-child(8) {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-data-table .gv-max-tab-col-9-hidden tr > *:nth-child(9) {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-data-table .gv-max-tab-col-10-hidden tr > *:nth-child(10) {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-data-table .gv-max-tab-col-11-hidden tr > *:nth-child(11) {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-data-table .gv-max-tab-col-12-hidden tr > *:nth-child(12) {
|
|
display: none;
|
|
}
|
|
}
|
|
.gv-activated .gv-pagination {
|
|
--pagination-btn-size: 40px;
|
|
align-items: center;
|
|
border-top: 1px solid var(--color-border-alt);
|
|
display: flex;
|
|
flex-flow: column nowrap;
|
|
gap: var(--size-sm);
|
|
padding: var(--size-sm) var(--size-md);
|
|
/* Form */
|
|
--form-element-height: 30px;
|
|
font-size: 12px;
|
|
font-weight: var(--font-weight-medium);
|
|
letter-spacing: 0.048px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-pagination .gv-button {
|
|
font-size: 12px;
|
|
font-weight: var(--font-weight-semibold);
|
|
letter-spacing: 0.048px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-pagination .gv-checkbox {
|
|
height: var(--size-md);
|
|
width: var(--size-md);
|
|
}
|
|
.gv-activated .gv-pagination .gv-radio {
|
|
height: var(--size-md);
|
|
width: var(--size-md);
|
|
}
|
|
.gv-activated .gv-pagination .gv-radio:checked::after {
|
|
border-width: 5px;
|
|
}
|
|
.gv-activated .gv-pagination .gv-input.gv-input-number button {
|
|
padding: 0;
|
|
}
|
|
.gv-activated .gv-pagination .gv-toggle {
|
|
--toggle-height: 16px;
|
|
--toggle-width: 28px;
|
|
--toggle-dot-indent: 2px;
|
|
}
|
|
.gv-activated .gv-pagination gv-icon {
|
|
height: var(--size-icon-sm);
|
|
width: var(--size-icon-sm);
|
|
}
|
|
.gv-activated .gv-pagination nav ul {
|
|
display: flex;
|
|
flex-wrap: nowrap;
|
|
list-style: none;
|
|
padding: 0;
|
|
}
|
|
.gv-activated .gv-pagination nav li {
|
|
display: block;
|
|
height: var(--pagination-btn-size);
|
|
}
|
|
.gv-activated .gv-pagination nav li.gv-page-select {
|
|
align-items: center;
|
|
display: flex;
|
|
padding-left: var(--size-xs);
|
|
padding-right: var(--size-xs);
|
|
}
|
|
.gv-activated .gv-pagination nav li.gv-page-select .gv-input-select {
|
|
width: 112px;
|
|
}
|
|
.gv-activated .gv-pagination nav li:not(.gv-page-select) {
|
|
width: var(--pagination-btn-size);
|
|
}
|
|
.gv-activated .gv-pagination nav li:not(.gv-page-select) > * {
|
|
align-items: center;
|
|
display: inline-flex;
|
|
justify-content: center;
|
|
height: 100%;
|
|
width: 100%;
|
|
}
|
|
.gv-activated .gv-pagination nav li:not(.gv-page-select) > *:not(span) {
|
|
border-radius: var(--border-radius);
|
|
text-decoration: none;
|
|
font-weight: var(--font-weight-semibold);
|
|
}
|
|
.gv-activated .gv-pagination nav li:not(.gv-page-select) > *:not(span):hover {
|
|
background-color: var(--color-state-hover);
|
|
}
|
|
.gv-activated .gv-pagination nav li:not(.gv-page-select).gv-active > * {
|
|
background-color: var(--color-state-active);
|
|
pointer-events: none;
|
|
}
|
|
.gv-activated .gv-pagination nav li:not(.gv-page-select).gv-disabled > * {
|
|
color: var(--color-body-on-alternative);
|
|
pointer-events: none;
|
|
}
|
|
.gv-activated .gv-pagination .gv-amount-select {
|
|
align-items: center;
|
|
display: flex;
|
|
gap: var(--size-sm);
|
|
white-space: nowrap;
|
|
}
|
|
.gv-activated .gv-pagination .gv-amount-select .gv-input-select {
|
|
width: 120px;
|
|
}
|
|
@media (max-width: 599px ) {
|
|
.gv-activated .gv-pagination nav li.gv-page {
|
|
display: none;
|
|
}
|
|
}
|
|
@media (min-width: 600px ) {
|
|
.gv-activated .gv-pagination nav li.gv-first,
|
|
.gv-activated .gv-pagination nav li.gv-last,
|
|
.gv-activated .gv-pagination nav li.gv-page-select {
|
|
display: none;
|
|
}
|
|
}
|
|
@media (min-width: 1024px ) {
|
|
.gv-activated .gv-pagination {
|
|
flex-flow: row-reverse wrap;
|
|
justify-content: space-between;
|
|
}
|
|
.gv-activated .gv-pagination .gv-note {
|
|
flex: 1;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
}
|
|
.gv-activated .gv-divider {
|
|
--divider-color: var(--color-border);
|
|
--divider-color-alternative: var(--color-border-alt);
|
|
border-top: 1px solid var(--divider-color);
|
|
border-right: 0;
|
|
border-bottom: 0;
|
|
border-left: 0;
|
|
display: block;
|
|
height: 1px;
|
|
width: 100%;
|
|
}
|
|
.gv-activated .gv-divider.gv-divider-vertical {
|
|
border-left: 1px solid var(--divider-color);
|
|
border-top: 0;
|
|
height: 100%;
|
|
min-height: var(--size-md);
|
|
width: 1px;
|
|
}
|
|
.gv-activated .gv-divider.gv-divider-dashed {
|
|
border-style: dashed;
|
|
}
|
|
.gv-activated .gv-divider.gv-divider-light {
|
|
border-color: var(--divider-color-alternative);
|
|
}
|
|
.gv-activated .gv-donut-chart {
|
|
align-items: center;
|
|
display: flex;
|
|
height: 72px;
|
|
justify-content: center;
|
|
width: 72px;
|
|
}
|
|
.gv-activated .gv-donut-chart .gv-progress-circle {
|
|
background-color: var(--color-surface-dim);
|
|
color: var(--color-body-on-alternative);
|
|
align-items: center;
|
|
border-radius: 50%;
|
|
display: flex;
|
|
height: 60px;
|
|
justify-content: center;
|
|
position: relative;
|
|
width: 60px;
|
|
font-weight: var(--font-weight-semibold);
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-donut-chart .gv-progress-circle gv-indicator {
|
|
height: 100%;
|
|
left: 0;
|
|
position: absolute;
|
|
top: 0;
|
|
transform: rotate(-90deg);
|
|
transform-origin: center;
|
|
width: 100%;
|
|
}
|
|
.gv-activated .gv-donut-chart .gv-progress-circle .gv-circle-top {
|
|
transition: stroke-dashoffset 400ms ease-in-out;
|
|
}
|
|
.gv-activated .gv-donut-chart .gv-progress-circle[data-progress-percent="20"] .gv-circle-top {
|
|
stroke-dasharray: 188.49555922;
|
|
stroke-dashoffset: 150.79644737;
|
|
}
|
|
.gv-activated .gv-donut-chart .gv-progress-circle[data-progress-percent="40"] .gv-circle-top {
|
|
stroke-dasharray: 188.49555922;
|
|
stroke-dashoffset: 113.09733553;
|
|
}
|
|
.gv-activated .gv-donut-chart .gv-progress-circle[data-progress-percent="60"] .gv-circle-top {
|
|
stroke-dasharray: 188.49555922;
|
|
stroke-dashoffset: 75.39822369;
|
|
}
|
|
.gv-activated .gv-donut-chart .gv-progress-circle[data-progress-percent="80"] .gv-circle-top {
|
|
stroke-dasharray: 188.49555922;
|
|
stroke-dashoffset: 37.69911184;
|
|
}
|
|
.gv-activated .gv-donut-chart .gv-progress-circle[data-progress-percent="100"] .gv-circle-top {
|
|
stroke-dasharray: 188.49555922;
|
|
stroke-dashoffset: 0;
|
|
}
|
|
.gv-activated .gv-donut-chart .gv-progress-circle circle {
|
|
stroke-width: 3px;
|
|
}
|
|
.gv-activated .gv-donut-chart .gv-progress-circle.gv-state-success {
|
|
background-color: var(--color-signal-success-light);
|
|
color: var(--color-signal-success);
|
|
}
|
|
.gv-activated .gv-donut-chart .gv-progress-circle.gv-state-warning {
|
|
background-color: var(--color-signal-warning-light);
|
|
color: var(--color-signal-warning);
|
|
}
|
|
.gv-activated .gv-donut-chart .gv-progress-circle.gv-state-alert {
|
|
background-color: var(--color-signal-alert-light);
|
|
color: var(--color-signal-alert);
|
|
}
|
|
.gv-activated .gv-empty-state {
|
|
align-items: center;
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: var(--size-lg);
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-empty-state {
|
|
padding: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-empty-state {
|
|
padding: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-empty-state {
|
|
padding: 48px;
|
|
}
|
|
}
|
|
.gv-activated .gv-empty-state .gv-empty-state-content {
|
|
text-align: center;
|
|
}
|
|
.gv-activated .gv-empty-state .gv-empty-state-content > *:not(:last-child) {
|
|
margin-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-empty-state .gv-empty-state-content .gv-title {
|
|
font-weight: var(--font-weight-bold);
|
|
line-height: var(--line-height-heading);
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-empty-state .gv-empty-state-content .gv-title {
|
|
font-size: 14px;
|
|
letter-spacing: 0.042px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-empty-state .gv-empty-state-content .gv-title {
|
|
font-size: calc(14px + 10 * ((100vw - 360px ) / 1080 ));
|
|
letter-spacing: calc(0.042px + -0.006 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-empty-state .gv-empty-state-content .gv-title {
|
|
font-size: 24px;
|
|
letter-spacing: 0.036px;
|
|
}
|
|
}
|
|
.gv-activated .gv-mode-condensed .gv-empty-state .gv-empty-state-content,
|
|
.gv-activated .gv-empty-state.gv-mode-condensed .gv-empty-state-content {
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-mode-condensed .gv-empty-state .gv-empty-state-content .gv-title,
|
|
.gv-activated .gv-empty-state.gv-mode-condensed .gv-empty-state-content .gv-title {
|
|
font-weight: var(--font-weight-semibold);
|
|
line-height: var(--line-height-body);
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-mode-condensed .gv-empty-state .gv-empty-state-content .gv-title,
|
|
.gv-activated .gv-empty-state.gv-mode-condensed .gv-empty-state-content .gv-title {
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-mode-condensed .gv-empty-state .gv-empty-state-content .gv-title,
|
|
.gv-activated .gv-empty-state.gv-mode-condensed .gv-empty-state-content .gv-title {
|
|
font-size: calc(14px + 2 * ((100vw - 360px ) / 1080 ));
|
|
letter-spacing: calc(0.035px + 0.045 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-mode-condensed .gv-empty-state .gv-empty-state-content .gv-title,
|
|
.gv-activated .gv-empty-state.gv-mode-condensed .gv-empty-state-content .gv-title {
|
|
font-size: 16px;
|
|
letter-spacing: 0.08px;
|
|
}
|
|
}
|
|
.gv-activated .gv-filter-options {
|
|
/* Form */
|
|
--form-element-height: 30px;
|
|
}
|
|
.gv-activated .gv-filter-options .gv-button {
|
|
font-size: 12px;
|
|
font-weight: var(--font-weight-semibold);
|
|
letter-spacing: 0.048px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-filter-options .gv-checkbox {
|
|
height: var(--size-md);
|
|
width: var(--size-md);
|
|
}
|
|
.gv-activated .gv-filter-options .gv-radio {
|
|
height: var(--size-md);
|
|
width: var(--size-md);
|
|
}
|
|
.gv-activated .gv-filter-options .gv-radio:checked::after {
|
|
border-width: 5px;
|
|
}
|
|
.gv-activated .gv-filter-options .gv-input.gv-input-number button {
|
|
padding: 0;
|
|
}
|
|
.gv-activated .gv-filter-options .gv-toggle {
|
|
--toggle-height: 16px;
|
|
--toggle-width: 28px;
|
|
--toggle-dot-indent: 2px;
|
|
}
|
|
.gv-activated .gv-filter-options .gv-options {
|
|
border: none;
|
|
margin: 0;
|
|
min-width: 0;
|
|
padding: 0;
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-filter-options .gv-option {
|
|
align-items: center;
|
|
cursor: pointer;
|
|
display: flex;
|
|
gap: var(--size-sm);
|
|
padding: var(--size-sm) 0;
|
|
text-align: left;
|
|
text-decoration: none;
|
|
width: 100%;
|
|
}
|
|
.gv-activated .gv-filter-options .gv-option .gv-checkbox,
|
|
.gv-activated .gv-filter-options .gv-option .gv-radio {
|
|
flex-shrink: 0;
|
|
}
|
|
.gv-activated .gv-filter-options .gv-option .gv-item-text {
|
|
display: inline-flex;
|
|
gap: var(--size-xs);
|
|
min-width: 0;
|
|
}
|
|
.gv-activated .gv-filter-options .gv-option .gv-item-label {
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
.gv-activated .gv-filter-options .gv-option .gv-item-count {
|
|
color: var(--color-body-on-alternative);
|
|
flex-shrink: 0;
|
|
}
|
|
.gv-activated .gv-filter-bar {
|
|
position: relative;
|
|
}
|
|
.gv-activated .gv-filter-bar .gv-bar {
|
|
display: flex;
|
|
flex-direction: row;
|
|
gap: var(--size-sm);
|
|
overflow-x: auto;
|
|
scroll-behavior: smooth;
|
|
scroll-snap-type: x mandatory;
|
|
}
|
|
.gv-activated .gv-filter-bar .gv-filter-button {
|
|
align-items: center;
|
|
border: 1px solid var(--color-border-alt);
|
|
border-radius: var(--chip-radius);
|
|
display: flex;
|
|
flex-shrink: 0;
|
|
gap: var(--size-sm);
|
|
min-width: 0;
|
|
padding: var(--size-xs) var(--size-md);
|
|
position: relative;
|
|
scroll-snap-align: start;
|
|
}
|
|
.gv-activated .gv-filter-bar .gv-filter-button.gv-all-filters {
|
|
border: none;
|
|
padding-left: var(--size-sm);
|
|
padding-right: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-filter-bar .gv-filter-button.gv-expanded gv-icon:last-child {
|
|
transform: rotate(180deg);
|
|
}
|
|
.gv-activated .gv-filter-bar .gv-filter-button .gv-button-label {
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-filter-bar .gv-filter-button gv-icon {
|
|
flex-shrink: 0;
|
|
}
|
|
.gv-activated .gv-filter-bar .gv-filter-button .gv-total-selected {
|
|
align-items: center;
|
|
background-color: var(--color-surface-highlight);
|
|
border-radius: var(--border-radius);
|
|
flex-shrink: 0;
|
|
height: var(--size-lg);
|
|
justify-content: center;
|
|
width: var(--size-lg);
|
|
font-size: 12px;
|
|
font-weight: var(--font-weight-medium);
|
|
letter-spacing: 0.048px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-filter-bar .gv-filter-button .gv-total-selected:not(.gv-hidden) {
|
|
display: flex;
|
|
}
|
|
.gv-activated .gv-filter-bar .gv-bar-actions {
|
|
align-items: stretch;
|
|
display: flex;
|
|
flex-shrink: 0;
|
|
gap: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-filter-bar .gv-bar-actions .gv-action-reset {
|
|
border-left: 1px solid var(--color-border);
|
|
padding-left: var(--size-md);
|
|
}
|
|
.gv-activated .gv-filter-panel {
|
|
left: 0;
|
|
}
|
|
.gv-activated .gv-filter-panel .gv-filter-options {
|
|
background-color: var(--color-surface-bright);
|
|
}
|
|
.gv-activated .gv-filter-panel .gv-filter-options .gv-panel-header {
|
|
margin-bottom: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-filter-panel .gv-filter-options .gv-panel-header .gv-btn-close {
|
|
padding: var(--size-sm);
|
|
position: absolute;
|
|
right: var(--size-md);
|
|
top: var(--size-md);
|
|
}
|
|
.gv-activated .gv-filter-panel .gv-filter-options .gv-button-group {
|
|
padding-top: var(--size-md);
|
|
}
|
|
.gv-activated .gv-filter-panel .gv-filter-options .gv-filter-name {
|
|
display: block;
|
|
padding-bottom: var(--size-md);
|
|
font-weight: var(--font-weight-semibold);
|
|
line-height: var(--line-height-body);
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-filter-panel .gv-filter-options .gv-filter-name {
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-filter-panel .gv-filter-options .gv-filter-name {
|
|
font-size: calc(14px + 2 * ((100vw - 360px ) / 1080 ));
|
|
letter-spacing: calc(0.035px + 0.045 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-filter-panel .gv-filter-options .gv-filter-name {
|
|
font-size: 16px;
|
|
letter-spacing: 0.08px;
|
|
}
|
|
}
|
|
.gv-activated .gv-filters-drawer .gv-side-content {
|
|
display: flex;
|
|
flex-direction: column;
|
|
height: 100%;
|
|
}
|
|
.gv-activated .gv-filters-drawer .gv-side-header {
|
|
padding: var(--size-md) var(--size-sm) var(--size-sm);
|
|
}
|
|
.gv-activated .gv-filters-drawer .gv-filter-options {
|
|
flex: 1;
|
|
overflow-y: auto;
|
|
padding-left: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-filters-drawer .gv-filter-options .gv-options-title {
|
|
margin-bottom: var(--size-md);
|
|
font-weight: var(--font-weight-semibold);
|
|
line-height: var(--line-height-body);
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-filters-drawer .gv-filter-options .gv-options-title {
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-filters-drawer .gv-filter-options .gv-options-title {
|
|
font-size: calc(14px + 2 * ((100vw - 360px ) / 1080 ));
|
|
letter-spacing: calc(0.035px + 0.045 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-filters-drawer .gv-filter-options .gv-options-title {
|
|
font-size: 16px;
|
|
letter-spacing: 0.08px;
|
|
}
|
|
}
|
|
.gv-activated .gv-filters-drawer .gv-filter-options .gv-options {
|
|
padding-top: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-filters-drawer .gv-filter-options .gv-options .gv-filter-name {
|
|
padding: var(--size-sm) 0 var(--size-md);
|
|
}
|
|
.gv-activated .gv-filters-drawer .gv-filter-options .gv-options:not(:last-child) {
|
|
border-bottom: 1px solid var(--color-border);
|
|
padding-bottom: var(--size-md);
|
|
}
|
|
.gv-activated .gv-filters-drawer .gv-filter-options .gv-options:not(:first-child) .gv-filter-name {
|
|
padding-top: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-filters-drawer .gv-side-footer {
|
|
padding: var(--size-md) var(--size-sm);
|
|
}
|
|
@media (max-width: 599px ) {
|
|
.gv-activated .gv-filter-panel {
|
|
background-color: var(--color-overlay-dark);
|
|
display: flex;
|
|
flex-direction: column;
|
|
height: 100%;
|
|
justify-content: flex-end;
|
|
left: 0 !important;
|
|
padding-top: var(--size-xl);
|
|
position: fixed;
|
|
top: 0;
|
|
width: 100%;
|
|
z-index: 1100;
|
|
}
|
|
.gv-activated .gv-filter-panel .gv-filter-options {
|
|
display: flex;
|
|
flex-direction: column;
|
|
flex-shrink: 1;
|
|
min-height: 0;
|
|
padding: var(--size-lg);
|
|
position: relative;
|
|
}
|
|
.gv-activated .gv-filter-panel .gv-options-content {
|
|
overflow-y: auto;
|
|
}
|
|
.gv-activated .gv-filter-panel .gv-button-group {
|
|
flex-shrink: 0;
|
|
}
|
|
.gv-activated .gv-filter-panel .gv-button-group .gv-clear {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-sidedrawer.gv-filters-drawer {
|
|
padding-top: var(--size-xl);
|
|
}
|
|
.gv-activated .gv-sidedrawer.gv-filters-drawer.gv-sidedrawer-open {
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: flex-end;
|
|
}
|
|
.gv-activated .gv-sidedrawer.gv-filters-drawer .gv-side-content {
|
|
flex-shrink: 1;
|
|
height: auto;
|
|
min-height: 0;
|
|
padding: var(--size-sm) var(--size-md);
|
|
position: relative;
|
|
width: 100%;
|
|
}
|
|
.gv-activated .gv-sidedrawer.gv-filters-drawer .gv-side-content .gv-btn-close {
|
|
top: var(--size-md);
|
|
}
|
|
.gv-activated .gv-sidedrawer.gv-filters-drawer .gv-side-footer {
|
|
padding-top: 0;
|
|
}
|
|
}
|
|
@media (min-width: 600px ) {
|
|
.gv-activated .gv-filter-panel {
|
|
position: absolute;
|
|
top: calc(100% + var(--size-xs));
|
|
z-index: 200;
|
|
}
|
|
.gv-activated .gv-filter-panel .gv-filter-options {
|
|
border: 1px solid var(--color-border-alt);
|
|
border-radius: var(--border-radius);
|
|
padding: var(--size-md) var(--size-lg);
|
|
width: 300px;
|
|
}
|
|
.gv-activated .gv-filter-panel .gv-panel-header,
|
|
.gv-activated .gv-filter-panel .gv-button-group .gv-cancel {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-filter-bar .gv-filter-panel .gv-filter-name {
|
|
display: none;
|
|
}
|
|
}
|
|
.gv-activated .gv-footer {
|
|
background-color: var(--color-surface-bright);
|
|
color: var(--color-body-on-default);
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
line-height: var(--line-height-body);
|
|
/* Hide border if support block is added/visible */
|
|
}
|
|
.gv-activated .gv-footer .gv-footer-content {
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
max-width: 1536px;
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-footer .gv-footer-content {
|
|
padding-left: 24px;
|
|
padding-right: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-footer .gv-footer-content {
|
|
padding-left: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
padding-right: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-footer .gv-footer-content {
|
|
padding-left: 48px;
|
|
padding-right: 48px;
|
|
}
|
|
}
|
|
.gv-activated .gv-footer .gv-footer-support {
|
|
background-color: var(--color-surface-highlight);
|
|
}
|
|
.gv-activated .gv-footer .gv-footer-support .gv-footer-content {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 16px;
|
|
padding-bottom: 24px;
|
|
padding-top: 16px;
|
|
}
|
|
.gv-activated .gv-footer .gv-footer-support .gv-support-text {
|
|
align-items: center;
|
|
display: flex;
|
|
gap: 24px;
|
|
}
|
|
.gv-activated .gv-footer .gv-footer-support gv-tile,
|
|
.gv-activated .gv-footer .gv-footer-support .gv-button {
|
|
flex-shrink: 0;
|
|
}
|
|
.gv-activated .gv-footer .gv-footer-bar {
|
|
background-color: var(--color-surface-bright);
|
|
border-top: 1px solid var(--color-border-alt);
|
|
}
|
|
.gv-activated .gv-footer .gv-footer-bar .gv-footer-content {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 8px;
|
|
padding-bottom: 24px;
|
|
padding-top: 24px;
|
|
}
|
|
.gv-activated .gv-footer .gv-footer-support:not(.gv-hidden) + .gv-footer-bar {
|
|
border: none;
|
|
}
|
|
.gv-activated .gv-footer ul.gv-footer-links {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 8px;
|
|
list-style: none;
|
|
padding: 0;
|
|
}
|
|
.gv-activated .gv-footer ul.gv-footer-links li {
|
|
margin: 0;
|
|
}
|
|
.gv-activated .gv-footer ul.gv-footer-links a {
|
|
color: var(--color-body-on-default);
|
|
text-decoration: none;
|
|
white-space: nowrap;
|
|
}
|
|
.gv-activated .gv-footer .gv-footer-copyright {
|
|
color: var(--color-body-on-alternative);
|
|
}
|
|
@media (min-width: 600px ) {
|
|
.gv-activated .gv-footer .gv-footer-support .gv-footer-content {
|
|
align-items: center;
|
|
flex-direction: row;
|
|
gap: 24px;
|
|
justify-content: center;
|
|
padding-bottom: 16px;
|
|
}
|
|
}
|
|
@media (min-width: 1024px ) {
|
|
.gv-activated .gv-footer .gv-footer-bar .gv-footer-content {
|
|
flex-direction: row;
|
|
gap: 24px;
|
|
justify-content: space-between;
|
|
}
|
|
.gv-activated .gv-footer ul.gv-footer-links {
|
|
align-items: center;
|
|
flex-direction: row;
|
|
gap: 16px;
|
|
}
|
|
.gv-activated .gv-footer ul.gv-footer-links li:not(:last-child) {
|
|
border-right: 1px solid var(--color-border-alt);
|
|
padding-right: 16px;
|
|
}
|
|
}
|
|
/* Start grid mixins */
|
|
/* Grid template columns */
|
|
/* Grid item width */
|
|
/* Column start */
|
|
/* End grid mixins */
|
|
.gv-activated {
|
|
/* Deprecated grid classes */
|
|
/* Deprecated long name classes */
|
|
/* Grid order */
|
|
}
|
|
.gv-activated .gv-grid {
|
|
display: grid;
|
|
}
|
|
.gv-activated .gv-grid-container {
|
|
display: grid;
|
|
grid-template-columns: repeat(12, 1fr);
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-grid-container {
|
|
gap: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-grid-container {
|
|
gap: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-grid-container {
|
|
gap: 48px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-grid-container {
|
|
padding-left: 24px;
|
|
padding-right: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-grid-container {
|
|
padding-left: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
padding-right: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-grid-container {
|
|
padding-left: 48px;
|
|
padding-right: 48px;
|
|
}
|
|
}
|
|
.gv-activated .gv-grid-container > * {
|
|
grid-column: auto / span 12;
|
|
max-width: 100%;
|
|
}
|
|
.gv-activated .gv-grid-container > * > .gv-grid-container {
|
|
padding-left: 0;
|
|
padding-right: 0;
|
|
}
|
|
.gv-activated .gv-grid-dense {
|
|
grid-auto-flow: dense;
|
|
}
|
|
.gv-activated .gv-span-1 {
|
|
grid-column: auto / span 1;
|
|
}
|
|
.gv-activated .gv-span-2 {
|
|
grid-column: auto / span 2;
|
|
}
|
|
.gv-activated .gv-span-3 {
|
|
grid-column: auto / span 3;
|
|
}
|
|
.gv-activated .gv-span-4 {
|
|
grid-column: auto / span 4;
|
|
}
|
|
.gv-activated .gv-span-5 {
|
|
grid-column: auto / span 5;
|
|
}
|
|
.gv-activated .gv-span-6 {
|
|
grid-column: auto / span 6;
|
|
}
|
|
.gv-activated .gv-span-7 {
|
|
grid-column: auto / span 7;
|
|
}
|
|
.gv-activated .gv-span-8 {
|
|
grid-column: auto / span 8;
|
|
}
|
|
.gv-activated .gv-span-9 {
|
|
grid-column: auto / span 9;
|
|
}
|
|
.gv-activated .gv-span-10 {
|
|
grid-column: auto / span 10;
|
|
}
|
|
.gv-activated .gv-span-11 {
|
|
grid-column: auto / span 11;
|
|
}
|
|
.gv-activated .gv-span-12 {
|
|
grid-column: auto / span 12;
|
|
}
|
|
.gv-activated .gv-grid-cols-1 {
|
|
grid-template-columns: repeat(1, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-grid-cols-2 {
|
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-grid-cols-3 {
|
|
grid-template-columns: repeat(3, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-grid-cols-4 {
|
|
grid-template-columns: repeat(4, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-grid-cols-5 {
|
|
grid-template-columns: repeat(5, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-grid-cols-6 {
|
|
grid-template-columns: repeat(6, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-grid-cols-7 {
|
|
grid-template-columns: repeat(7, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-grid-cols-8 {
|
|
grid-template-columns: repeat(8, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-grid-cols-9 {
|
|
grid-template-columns: repeat(9, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-grid-cols-10 {
|
|
grid-template-columns: repeat(10, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-grid-cols-11 {
|
|
grid-template-columns: repeat(11, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-grid-cols-12 {
|
|
grid-template-columns: repeat(12, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-start-1 {
|
|
grid-column-start: 1;
|
|
}
|
|
.gv-activated .gv-start-2 {
|
|
grid-column-start: 2;
|
|
}
|
|
.gv-activated .gv-start-3 {
|
|
grid-column-start: 3;
|
|
}
|
|
.gv-activated .gv-start-4 {
|
|
grid-column-start: 4;
|
|
}
|
|
.gv-activated .gv-start-5 {
|
|
grid-column-start: 5;
|
|
}
|
|
.gv-activated .gv-start-6 {
|
|
grid-column-start: 6;
|
|
}
|
|
.gv-activated .gv-start-7 {
|
|
grid-column-start: 7;
|
|
}
|
|
.gv-activated .gv-start-8 {
|
|
grid-column-start: 8;
|
|
}
|
|
.gv-activated .gv-start-9 {
|
|
grid-column-start: 9;
|
|
}
|
|
.gv-activated .gv-start-10 {
|
|
grid-column-start: 10;
|
|
}
|
|
.gv-activated .gv-start-11 {
|
|
grid-column-start: 11;
|
|
}
|
|
.gv-activated .gv-start-12 {
|
|
grid-column-start: 12;
|
|
}
|
|
@media (min-width: 600px ) {
|
|
.gv-activated .gv-tab-span-1 {
|
|
grid-column: auto / span 1;
|
|
}
|
|
.gv-activated .gv-tab-span-2 {
|
|
grid-column: auto / span 2;
|
|
}
|
|
.gv-activated .gv-tab-span-3 {
|
|
grid-column: auto / span 3;
|
|
}
|
|
.gv-activated .gv-tab-span-4 {
|
|
grid-column: auto / span 4;
|
|
}
|
|
.gv-activated .gv-tab-span-5 {
|
|
grid-column: auto / span 5;
|
|
}
|
|
.gv-activated .gv-tab-span-6 {
|
|
grid-column: auto / span 6;
|
|
}
|
|
.gv-activated .gv-tab-span-7 {
|
|
grid-column: auto / span 7;
|
|
}
|
|
.gv-activated .gv-tab-span-8 {
|
|
grid-column: auto / span 8;
|
|
}
|
|
.gv-activated .gv-tab-span-9 {
|
|
grid-column: auto / span 9;
|
|
}
|
|
.gv-activated .gv-tab-span-10 {
|
|
grid-column: auto / span 10;
|
|
}
|
|
.gv-activated .gv-tab-span-11 {
|
|
grid-column: auto / span 11;
|
|
}
|
|
.gv-activated .gv-tab-span-12 {
|
|
grid-column: auto / span 12;
|
|
}
|
|
.gv-activated .gv-tab-grid-cols-1 {
|
|
grid-template-columns: repeat(1, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-tab-grid-cols-2 {
|
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-tab-grid-cols-3 {
|
|
grid-template-columns: repeat(3, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-tab-grid-cols-4 {
|
|
grid-template-columns: repeat(4, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-tab-grid-cols-5 {
|
|
grid-template-columns: repeat(5, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-tab-grid-cols-6 {
|
|
grid-template-columns: repeat(6, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-tab-grid-cols-7 {
|
|
grid-template-columns: repeat(7, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-tab-grid-cols-8 {
|
|
grid-template-columns: repeat(8, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-tab-grid-cols-9 {
|
|
grid-template-columns: repeat(9, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-tab-grid-cols-10 {
|
|
grid-template-columns: repeat(10, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-tab-grid-cols-11 {
|
|
grid-template-columns: repeat(11, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-tab-grid-cols-12 {
|
|
grid-template-columns: repeat(12, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-tab-start-1 {
|
|
grid-column-start: 1;
|
|
}
|
|
.gv-activated .gv-tab-start-2 {
|
|
grid-column-start: 2;
|
|
}
|
|
.gv-activated .gv-tab-start-3 {
|
|
grid-column-start: 3;
|
|
}
|
|
.gv-activated .gv-tab-start-4 {
|
|
grid-column-start: 4;
|
|
}
|
|
.gv-activated .gv-tab-start-5 {
|
|
grid-column-start: 5;
|
|
}
|
|
.gv-activated .gv-tab-start-6 {
|
|
grid-column-start: 6;
|
|
}
|
|
.gv-activated .gv-tab-start-7 {
|
|
grid-column-start: 7;
|
|
}
|
|
.gv-activated .gv-tab-start-8 {
|
|
grid-column-start: 8;
|
|
}
|
|
.gv-activated .gv-tab-start-9 {
|
|
grid-column-start: 9;
|
|
}
|
|
.gv-activated .gv-tab-start-10 {
|
|
grid-column-start: 10;
|
|
}
|
|
.gv-activated .gv-tab-start-11 {
|
|
grid-column-start: 11;
|
|
}
|
|
.gv-activated .gv-tab-start-12 {
|
|
grid-column-start: 12;
|
|
}
|
|
}
|
|
@media (min-width: 768px ) {
|
|
.gv-activated .gv-tab-lg-span-1 {
|
|
grid-column: auto / span 1;
|
|
}
|
|
.gv-activated .gv-tab-lg-span-2 {
|
|
grid-column: auto / span 2;
|
|
}
|
|
.gv-activated .gv-tab-lg-span-3 {
|
|
grid-column: auto / span 3;
|
|
}
|
|
.gv-activated .gv-tab-lg-span-4 {
|
|
grid-column: auto / span 4;
|
|
}
|
|
.gv-activated .gv-tab-lg-span-5 {
|
|
grid-column: auto / span 5;
|
|
}
|
|
.gv-activated .gv-tab-lg-span-6 {
|
|
grid-column: auto / span 6;
|
|
}
|
|
.gv-activated .gv-tab-lg-span-7 {
|
|
grid-column: auto / span 7;
|
|
}
|
|
.gv-activated .gv-tab-lg-span-8 {
|
|
grid-column: auto / span 8;
|
|
}
|
|
.gv-activated .gv-tab-lg-span-9 {
|
|
grid-column: auto / span 9;
|
|
}
|
|
.gv-activated .gv-tab-lg-span-10 {
|
|
grid-column: auto / span 10;
|
|
}
|
|
.gv-activated .gv-tab-lg-span-11 {
|
|
grid-column: auto / span 11;
|
|
}
|
|
.gv-activated .gv-tab-lg-span-12 {
|
|
grid-column: auto / span 12;
|
|
}
|
|
.gv-activated .gv-tab-lg-grid-cols-1 {
|
|
grid-template-columns: repeat(1, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-tab-lg-grid-cols-2 {
|
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-tab-lg-grid-cols-3 {
|
|
grid-template-columns: repeat(3, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-tab-lg-grid-cols-4 {
|
|
grid-template-columns: repeat(4, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-tab-lg-grid-cols-5 {
|
|
grid-template-columns: repeat(5, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-tab-lg-grid-cols-6 {
|
|
grid-template-columns: repeat(6, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-tab-lg-grid-cols-7 {
|
|
grid-template-columns: repeat(7, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-tab-lg-grid-cols-8 {
|
|
grid-template-columns: repeat(8, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-tab-lg-grid-cols-9 {
|
|
grid-template-columns: repeat(9, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-tab-lg-grid-cols-10 {
|
|
grid-template-columns: repeat(10, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-tab-lg-grid-cols-11 {
|
|
grid-template-columns: repeat(11, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-tab-lg-grid-cols-12 {
|
|
grid-template-columns: repeat(12, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-tab-lg-start-1 {
|
|
grid-column-start: 1;
|
|
}
|
|
.gv-activated .gv-tab-lg-start-2 {
|
|
grid-column-start: 2;
|
|
}
|
|
.gv-activated .gv-tab-lg-start-3 {
|
|
grid-column-start: 3;
|
|
}
|
|
.gv-activated .gv-tab-lg-start-4 {
|
|
grid-column-start: 4;
|
|
}
|
|
.gv-activated .gv-tab-lg-start-5 {
|
|
grid-column-start: 5;
|
|
}
|
|
.gv-activated .gv-tab-lg-start-6 {
|
|
grid-column-start: 6;
|
|
}
|
|
.gv-activated .gv-tab-lg-start-7 {
|
|
grid-column-start: 7;
|
|
}
|
|
.gv-activated .gv-tab-lg-start-8 {
|
|
grid-column-start: 8;
|
|
}
|
|
.gv-activated .gv-tab-lg-start-9 {
|
|
grid-column-start: 9;
|
|
}
|
|
.gv-activated .gv-tab-lg-start-10 {
|
|
grid-column-start: 10;
|
|
}
|
|
.gv-activated .gv-tab-lg-start-11 {
|
|
grid-column-start: 11;
|
|
}
|
|
.gv-activated .gv-tab-lg-start-12 {
|
|
grid-column-start: 12;
|
|
}
|
|
}
|
|
@media (min-width: 1024px ) {
|
|
.gv-activated .gv-desk-span-1 {
|
|
grid-column: auto / span 1;
|
|
}
|
|
.gv-activated .gv-desk-span-2 {
|
|
grid-column: auto / span 2;
|
|
}
|
|
.gv-activated .gv-desk-span-3 {
|
|
grid-column: auto / span 3;
|
|
}
|
|
.gv-activated .gv-desk-span-4 {
|
|
grid-column: auto / span 4;
|
|
}
|
|
.gv-activated .gv-desk-span-5 {
|
|
grid-column: auto / span 5;
|
|
}
|
|
.gv-activated .gv-desk-span-6 {
|
|
grid-column: auto / span 6;
|
|
}
|
|
.gv-activated .gv-desk-span-7 {
|
|
grid-column: auto / span 7;
|
|
}
|
|
.gv-activated .gv-desk-span-8 {
|
|
grid-column: auto / span 8;
|
|
}
|
|
.gv-activated .gv-desk-span-9 {
|
|
grid-column: auto / span 9;
|
|
}
|
|
.gv-activated .gv-desk-span-10 {
|
|
grid-column: auto / span 10;
|
|
}
|
|
.gv-activated .gv-desk-span-11 {
|
|
grid-column: auto / span 11;
|
|
}
|
|
.gv-activated .gv-desk-span-12 {
|
|
grid-column: auto / span 12;
|
|
}
|
|
.gv-activated .gv-desk-grid-cols-1 {
|
|
grid-template-columns: repeat(1, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-desk-grid-cols-2 {
|
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-desk-grid-cols-3 {
|
|
grid-template-columns: repeat(3, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-desk-grid-cols-4 {
|
|
grid-template-columns: repeat(4, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-desk-grid-cols-5 {
|
|
grid-template-columns: repeat(5, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-desk-grid-cols-6 {
|
|
grid-template-columns: repeat(6, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-desk-grid-cols-7 {
|
|
grid-template-columns: repeat(7, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-desk-grid-cols-8 {
|
|
grid-template-columns: repeat(8, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-desk-grid-cols-9 {
|
|
grid-template-columns: repeat(9, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-desk-grid-cols-10 {
|
|
grid-template-columns: repeat(10, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-desk-grid-cols-11 {
|
|
grid-template-columns: repeat(11, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-desk-grid-cols-12 {
|
|
grid-template-columns: repeat(12, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-desk-start-1 {
|
|
grid-column-start: 1;
|
|
}
|
|
.gv-activated .gv-desk-start-2 {
|
|
grid-column-start: 2;
|
|
}
|
|
.gv-activated .gv-desk-start-3 {
|
|
grid-column-start: 3;
|
|
}
|
|
.gv-activated .gv-desk-start-4 {
|
|
grid-column-start: 4;
|
|
}
|
|
.gv-activated .gv-desk-start-5 {
|
|
grid-column-start: 5;
|
|
}
|
|
.gv-activated .gv-desk-start-6 {
|
|
grid-column-start: 6;
|
|
}
|
|
.gv-activated .gv-desk-start-7 {
|
|
grid-column-start: 7;
|
|
}
|
|
.gv-activated .gv-desk-start-8 {
|
|
grid-column-start: 8;
|
|
}
|
|
.gv-activated .gv-desk-start-9 {
|
|
grid-column-start: 9;
|
|
}
|
|
.gv-activated .gv-desk-start-10 {
|
|
grid-column-start: 10;
|
|
}
|
|
.gv-activated .gv-desk-start-11 {
|
|
grid-column-start: 11;
|
|
}
|
|
.gv-activated .gv-desk-start-12 {
|
|
grid-column-start: 12;
|
|
}
|
|
}
|
|
@media (min-width: 1280px ) {
|
|
.gv-activated .gv-desk-lg-span-1 {
|
|
grid-column: auto / span 1;
|
|
}
|
|
.gv-activated .gv-desk-lg-span-2 {
|
|
grid-column: auto / span 2;
|
|
}
|
|
.gv-activated .gv-desk-lg-span-3 {
|
|
grid-column: auto / span 3;
|
|
}
|
|
.gv-activated .gv-desk-lg-span-4 {
|
|
grid-column: auto / span 4;
|
|
}
|
|
.gv-activated .gv-desk-lg-span-5 {
|
|
grid-column: auto / span 5;
|
|
}
|
|
.gv-activated .gv-desk-lg-span-6 {
|
|
grid-column: auto / span 6;
|
|
}
|
|
.gv-activated .gv-desk-lg-span-7 {
|
|
grid-column: auto / span 7;
|
|
}
|
|
.gv-activated .gv-desk-lg-span-8 {
|
|
grid-column: auto / span 8;
|
|
}
|
|
.gv-activated .gv-desk-lg-span-9 {
|
|
grid-column: auto / span 9;
|
|
}
|
|
.gv-activated .gv-desk-lg-span-10 {
|
|
grid-column: auto / span 10;
|
|
}
|
|
.gv-activated .gv-desk-lg-span-11 {
|
|
grid-column: auto / span 11;
|
|
}
|
|
.gv-activated .gv-desk-lg-span-12 {
|
|
grid-column: auto / span 12;
|
|
}
|
|
.gv-activated .gv-desk-lg-grid-cols-1 {
|
|
grid-template-columns: repeat(1, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-desk-lg-grid-cols-2 {
|
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-desk-lg-grid-cols-3 {
|
|
grid-template-columns: repeat(3, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-desk-lg-grid-cols-4 {
|
|
grid-template-columns: repeat(4, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-desk-lg-grid-cols-5 {
|
|
grid-template-columns: repeat(5, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-desk-lg-grid-cols-6 {
|
|
grid-template-columns: repeat(6, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-desk-lg-grid-cols-7 {
|
|
grid-template-columns: repeat(7, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-desk-lg-grid-cols-8 {
|
|
grid-template-columns: repeat(8, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-desk-lg-grid-cols-9 {
|
|
grid-template-columns: repeat(9, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-desk-lg-grid-cols-10 {
|
|
grid-template-columns: repeat(10, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-desk-lg-grid-cols-11 {
|
|
grid-template-columns: repeat(11, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-desk-lg-grid-cols-12 {
|
|
grid-template-columns: repeat(12, minmax(0, 1fr));
|
|
}
|
|
.gv-activated .gv-desk-lg-start-1 {
|
|
grid-column-start: 1;
|
|
}
|
|
.gv-activated .gv-desk-lg-start-2 {
|
|
grid-column-start: 2;
|
|
}
|
|
.gv-activated .gv-desk-lg-start-3 {
|
|
grid-column-start: 3;
|
|
}
|
|
.gv-activated .gv-desk-lg-start-4 {
|
|
grid-column-start: 4;
|
|
}
|
|
.gv-activated .gv-desk-lg-start-5 {
|
|
grid-column-start: 5;
|
|
}
|
|
.gv-activated .gv-desk-lg-start-6 {
|
|
grid-column-start: 6;
|
|
}
|
|
.gv-activated .gv-desk-lg-start-7 {
|
|
grid-column-start: 7;
|
|
}
|
|
.gv-activated .gv-desk-lg-start-8 {
|
|
grid-column-start: 8;
|
|
}
|
|
.gv-activated .gv-desk-lg-start-9 {
|
|
grid-column-start: 9;
|
|
}
|
|
.gv-activated .gv-desk-lg-start-10 {
|
|
grid-column-start: 10;
|
|
}
|
|
.gv-activated .gv-desk-lg-start-11 {
|
|
grid-column-start: 11;
|
|
}
|
|
.gv-activated .gv-desk-lg-start-12 {
|
|
grid-column-start: 12;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-gap-medium {
|
|
gap: 16px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-gap-medium {
|
|
gap: calc(16px + 8 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-gap-medium {
|
|
gap: 24px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-gap-small {
|
|
gap: 8px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-gap-small {
|
|
gap: calc(8px + 8 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-gap-small {
|
|
gap: 16px;
|
|
}
|
|
}
|
|
.gv-activated .gv-no-gap {
|
|
gap: 0;
|
|
}
|
|
.gv-activated .gv-align-center {
|
|
align-items: center;
|
|
}
|
|
@media (max-width: 599px ) {
|
|
.gv-activated .gv-grid-container .gv-grid-item.gv-mobile-order-first {
|
|
order: -1;
|
|
}
|
|
.gv-activated .gv-grid-container .gv-grid-item.gv-mobile-order-last {
|
|
order: 99;
|
|
}
|
|
}
|
|
@media (min-width: 600px ) {
|
|
.gv-activated .gv-tabletspan-1 {
|
|
grid-column: auto / span 1;
|
|
}
|
|
.gv-activated .gv-tabletspan-2 {
|
|
grid-column: auto / span 2;
|
|
}
|
|
.gv-activated .gv-tabletspan-3 {
|
|
grid-column: auto / span 3;
|
|
}
|
|
.gv-activated .gv-tabletspan-4 {
|
|
grid-column: auto / span 4;
|
|
}
|
|
.gv-activated .gv-tabletspan-5 {
|
|
grid-column: auto / span 5;
|
|
}
|
|
.gv-activated .gv-tabletspan-6 {
|
|
grid-column: auto / span 6;
|
|
}
|
|
.gv-activated .gv-tabletspan-7 {
|
|
grid-column: auto / span 7;
|
|
}
|
|
.gv-activated .gv-tabletspan-8 {
|
|
grid-column: auto / span 8;
|
|
}
|
|
.gv-activated .gv-tabletspan-9 {
|
|
grid-column: auto / span 9;
|
|
}
|
|
.gv-activated .gv-tabletspan-10 {
|
|
grid-column: auto / span 10;
|
|
}
|
|
.gv-activated .gv-tabletspan-11 {
|
|
grid-column: auto / span 11;
|
|
}
|
|
.gv-activated .gv-tabletspan-12 {
|
|
grid-column: auto / span 12;
|
|
}
|
|
.gv-activated .gv-tabletstart-1 {
|
|
grid-column-start: 1;
|
|
}
|
|
.gv-activated .gv-tabletstart-2 {
|
|
grid-column-start: 2;
|
|
}
|
|
.gv-activated .gv-tabletstart-3 {
|
|
grid-column-start: 3;
|
|
}
|
|
.gv-activated .gv-tabletstart-4 {
|
|
grid-column-start: 4;
|
|
}
|
|
.gv-activated .gv-tabletstart-5 {
|
|
grid-column-start: 5;
|
|
}
|
|
.gv-activated .gv-tabletstart-6 {
|
|
grid-column-start: 6;
|
|
}
|
|
.gv-activated .gv-tabletstart-7 {
|
|
grid-column-start: 7;
|
|
}
|
|
.gv-activated .gv-tabletstart-8 {
|
|
grid-column-start: 8;
|
|
}
|
|
.gv-activated .gv-tabletstart-9 {
|
|
grid-column-start: 9;
|
|
}
|
|
.gv-activated .gv-tabletstart-10 {
|
|
grid-column-start: 10;
|
|
}
|
|
.gv-activated .gv-tabletstart-11 {
|
|
grid-column-start: 11;
|
|
}
|
|
.gv-activated .gv-tabletstart-12 {
|
|
grid-column-start: 12;
|
|
}
|
|
.gv-activated .gv-grid-container .gv-grid-item.gv-tablet-order-first {
|
|
order: -1;
|
|
}
|
|
.gv-activated .gv-grid-container .gv-grid-item.gv-tablet-order-last {
|
|
order: 99;
|
|
}
|
|
}
|
|
@media (min-width: 768px ) {
|
|
.gv-activated .gv-tablet-largespan-1 {
|
|
grid-column: auto / span 1;
|
|
}
|
|
.gv-activated .gv-tablet-largespan-2 {
|
|
grid-column: auto / span 2;
|
|
}
|
|
.gv-activated .gv-tablet-largespan-3 {
|
|
grid-column: auto / span 3;
|
|
}
|
|
.gv-activated .gv-tablet-largespan-4 {
|
|
grid-column: auto / span 4;
|
|
}
|
|
.gv-activated .gv-tablet-largespan-5 {
|
|
grid-column: auto / span 5;
|
|
}
|
|
.gv-activated .gv-tablet-largespan-6 {
|
|
grid-column: auto / span 6;
|
|
}
|
|
.gv-activated .gv-tablet-largespan-7 {
|
|
grid-column: auto / span 7;
|
|
}
|
|
.gv-activated .gv-tablet-largespan-8 {
|
|
grid-column: auto / span 8;
|
|
}
|
|
.gv-activated .gv-tablet-largespan-9 {
|
|
grid-column: auto / span 9;
|
|
}
|
|
.gv-activated .gv-tablet-largespan-10 {
|
|
grid-column: auto / span 10;
|
|
}
|
|
.gv-activated .gv-tablet-largespan-11 {
|
|
grid-column: auto / span 11;
|
|
}
|
|
.gv-activated .gv-tablet-largespan-12 {
|
|
grid-column: auto / span 12;
|
|
}
|
|
.gv-activated .gv-tablet-largestart-1 {
|
|
grid-column-start: 1;
|
|
}
|
|
.gv-activated .gv-tablet-largestart-2 {
|
|
grid-column-start: 2;
|
|
}
|
|
.gv-activated .gv-tablet-largestart-3 {
|
|
grid-column-start: 3;
|
|
}
|
|
.gv-activated .gv-tablet-largestart-4 {
|
|
grid-column-start: 4;
|
|
}
|
|
.gv-activated .gv-tablet-largestart-5 {
|
|
grid-column-start: 5;
|
|
}
|
|
.gv-activated .gv-tablet-largestart-6 {
|
|
grid-column-start: 6;
|
|
}
|
|
.gv-activated .gv-tablet-largestart-7 {
|
|
grid-column-start: 7;
|
|
}
|
|
.gv-activated .gv-tablet-largestart-8 {
|
|
grid-column-start: 8;
|
|
}
|
|
.gv-activated .gv-tablet-largestart-9 {
|
|
grid-column-start: 9;
|
|
}
|
|
.gv-activated .gv-tablet-largestart-10 {
|
|
grid-column-start: 10;
|
|
}
|
|
.gv-activated .gv-tablet-largestart-11 {
|
|
grid-column-start: 11;
|
|
}
|
|
.gv-activated .gv-tablet-largestart-12 {
|
|
grid-column-start: 12;
|
|
}
|
|
.gv-activated .gv-grid-container .gv-grid-item.gv-tablet-large-order-first {
|
|
order: -1;
|
|
}
|
|
.gv-activated .gv-grid-container .gv-grid-item.gv-tablet-large-order-last {
|
|
order: 99;
|
|
}
|
|
}
|
|
@media (min-width: 1024px ) {
|
|
.gv-activated .gv-desktopspan-1 {
|
|
grid-column: auto / span 1;
|
|
}
|
|
.gv-activated .gv-desktopspan-2 {
|
|
grid-column: auto / span 2;
|
|
}
|
|
.gv-activated .gv-desktopspan-3 {
|
|
grid-column: auto / span 3;
|
|
}
|
|
.gv-activated .gv-desktopspan-4 {
|
|
grid-column: auto / span 4;
|
|
}
|
|
.gv-activated .gv-desktopspan-5 {
|
|
grid-column: auto / span 5;
|
|
}
|
|
.gv-activated .gv-desktopspan-6 {
|
|
grid-column: auto / span 6;
|
|
}
|
|
.gv-activated .gv-desktopspan-7 {
|
|
grid-column: auto / span 7;
|
|
}
|
|
.gv-activated .gv-desktopspan-8 {
|
|
grid-column: auto / span 8;
|
|
}
|
|
.gv-activated .gv-desktopspan-9 {
|
|
grid-column: auto / span 9;
|
|
}
|
|
.gv-activated .gv-desktopspan-10 {
|
|
grid-column: auto / span 10;
|
|
}
|
|
.gv-activated .gv-desktopspan-11 {
|
|
grid-column: auto / span 11;
|
|
}
|
|
.gv-activated .gv-desktopspan-12 {
|
|
grid-column: auto / span 12;
|
|
}
|
|
.gv-activated .gv-desktopstart-1 {
|
|
grid-column-start: 1;
|
|
}
|
|
.gv-activated .gv-desktopstart-2 {
|
|
grid-column-start: 2;
|
|
}
|
|
.gv-activated .gv-desktopstart-3 {
|
|
grid-column-start: 3;
|
|
}
|
|
.gv-activated .gv-desktopstart-4 {
|
|
grid-column-start: 4;
|
|
}
|
|
.gv-activated .gv-desktopstart-5 {
|
|
grid-column-start: 5;
|
|
}
|
|
.gv-activated .gv-desktopstart-6 {
|
|
grid-column-start: 6;
|
|
}
|
|
.gv-activated .gv-desktopstart-7 {
|
|
grid-column-start: 7;
|
|
}
|
|
.gv-activated .gv-desktopstart-8 {
|
|
grid-column-start: 8;
|
|
}
|
|
.gv-activated .gv-desktopstart-9 {
|
|
grid-column-start: 9;
|
|
}
|
|
.gv-activated .gv-desktopstart-10 {
|
|
grid-column-start: 10;
|
|
}
|
|
.gv-activated .gv-desktopstart-11 {
|
|
grid-column-start: 11;
|
|
}
|
|
.gv-activated .gv-desktopstart-12 {
|
|
grid-column-start: 12;
|
|
}
|
|
.gv-activated .gv-grid-container .gv-grid-item.gv-desktop-order-first {
|
|
order: -1;
|
|
}
|
|
.gv-activated .gv-grid-container .gv-grid-item.gv-desktop-order-last {
|
|
order: 99;
|
|
}
|
|
}
|
|
@media (min-width: 1280px ) {
|
|
.gv-activated .gv-desktop-largespan-1 {
|
|
grid-column: auto / span 1;
|
|
}
|
|
.gv-activated .gv-desktop-largespan-2 {
|
|
grid-column: auto / span 2;
|
|
}
|
|
.gv-activated .gv-desktop-largespan-3 {
|
|
grid-column: auto / span 3;
|
|
}
|
|
.gv-activated .gv-desktop-largespan-4 {
|
|
grid-column: auto / span 4;
|
|
}
|
|
.gv-activated .gv-desktop-largespan-5 {
|
|
grid-column: auto / span 5;
|
|
}
|
|
.gv-activated .gv-desktop-largespan-6 {
|
|
grid-column: auto / span 6;
|
|
}
|
|
.gv-activated .gv-desktop-largespan-7 {
|
|
grid-column: auto / span 7;
|
|
}
|
|
.gv-activated .gv-desktop-largespan-8 {
|
|
grid-column: auto / span 8;
|
|
}
|
|
.gv-activated .gv-desktop-largespan-9 {
|
|
grid-column: auto / span 9;
|
|
}
|
|
.gv-activated .gv-desktop-largespan-10 {
|
|
grid-column: auto / span 10;
|
|
}
|
|
.gv-activated .gv-desktop-largespan-11 {
|
|
grid-column: auto / span 11;
|
|
}
|
|
.gv-activated .gv-desktop-largespan-12 {
|
|
grid-column: auto / span 12;
|
|
}
|
|
.gv-activated .gv-desktop-largestart-1 {
|
|
grid-column-start: 1;
|
|
}
|
|
.gv-activated .gv-desktop-largestart-2 {
|
|
grid-column-start: 2;
|
|
}
|
|
.gv-activated .gv-desktop-largestart-3 {
|
|
grid-column-start: 3;
|
|
}
|
|
.gv-activated .gv-desktop-largestart-4 {
|
|
grid-column-start: 4;
|
|
}
|
|
.gv-activated .gv-desktop-largestart-5 {
|
|
grid-column-start: 5;
|
|
}
|
|
.gv-activated .gv-desktop-largestart-6 {
|
|
grid-column-start: 6;
|
|
}
|
|
.gv-activated .gv-desktop-largestart-7 {
|
|
grid-column-start: 7;
|
|
}
|
|
.gv-activated .gv-desktop-largestart-8 {
|
|
grid-column-start: 8;
|
|
}
|
|
.gv-activated .gv-desktop-largestart-9 {
|
|
grid-column-start: 9;
|
|
}
|
|
.gv-activated .gv-desktop-largestart-10 {
|
|
grid-column-start: 10;
|
|
}
|
|
.gv-activated .gv-desktop-largestart-11 {
|
|
grid-column-start: 11;
|
|
}
|
|
.gv-activated .gv-desktop-largestart-12 {
|
|
grid-column-start: 12;
|
|
}
|
|
.gv-activated .gv-grid-container .gv-grid-item.gv-desktop-large-order-first {
|
|
order: -1;
|
|
}
|
|
.gv-activated .gv-grid-container .gv-grid-item.gv-desktop-large-order-last {
|
|
order: 99;
|
|
}
|
|
}
|
|
.gv-activated gv-icon {
|
|
width: var(--size-icon-md);
|
|
height: var(--size-icon-md);
|
|
display: inline-block;
|
|
vertical-align: text-bottom;
|
|
font-size: 0;
|
|
}
|
|
.gv-activated gv-icon svg {
|
|
width: 100%;
|
|
height: 100%;
|
|
fill: currentcolor;
|
|
}
|
|
.gv-activated .gv-mode-condensed gv-icon,
|
|
.gv-activated gv-icon.gv-mode-condensed,
|
|
.gv-activated gv-icon[size="small"] {
|
|
height: var(--size-icon-sm);
|
|
width: var(--size-icon-sm);
|
|
}
|
|
.gv-activated gv-illustration {
|
|
align-items: center;
|
|
display: flex;
|
|
}
|
|
.gv-activated gv-illustration svg,
|
|
.gv-activated gv-tile svg {
|
|
color: var(--color-illustration-line);
|
|
height: 100%;
|
|
width: 100%;
|
|
}
|
|
.gv-activated gv-illustration svg .gv-stroke-alert,
|
|
.gv-activated gv-tile svg .gv-stroke-alert {
|
|
stroke: var(--color-signal-alert);
|
|
}
|
|
.gv-activated gv-illustration svg .gv-fill-bg,
|
|
.gv-activated gv-tile svg .gv-fill-bg {
|
|
fill: var(--color-illustration-background);
|
|
}
|
|
.gv-activated gv-illustration svg .gv-fill-gray,
|
|
.gv-activated gv-tile svg .gv-fill-gray {
|
|
fill: var(--color-illustration-gray);
|
|
}
|
|
.gv-activated gv-illustration svg .gv-fill-line,
|
|
.gv-activated gv-tile svg .gv-fill-line {
|
|
fill: var(--color-illustration-line);
|
|
}
|
|
.gv-activated gv-illustration svg .gv-fill-100,
|
|
.gv-activated gv-tile svg .gv-fill-100 {
|
|
fill: var(--color-illustration-100);
|
|
}
|
|
.gv-activated gv-illustration svg .gv-fill-200,
|
|
.gv-activated gv-tile svg .gv-fill-200 {
|
|
fill: var(--color-illustration-200);
|
|
}
|
|
.gv-activated gv-illustration svg .gv-fill-300,
|
|
.gv-activated gv-tile svg .gv-fill-300 {
|
|
fill: var(--color-illustration-300);
|
|
}
|
|
.gv-activated gv-illustration svg .gv-fill-alert-light,
|
|
.gv-activated gv-tile svg .gv-fill-alert-light {
|
|
fill: var(--color-signal-alert-light);
|
|
}
|
|
.gv-activated .gv-indicator {
|
|
background-color: var(--color-signal-info);
|
|
border-radius: 50%;
|
|
display: inline-block;
|
|
flex-shrink: 0;
|
|
height: 8px;
|
|
width: 8px;
|
|
}
|
|
.gv-activated .gv-text-indicator {
|
|
align-items: center;
|
|
display: inline-flex;
|
|
gap: 8px;
|
|
max-width: 100%;
|
|
}
|
|
.gv-activated .gv-text-indicator > span {
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
.gv-activated .gv-icon-indicator {
|
|
position: relative;
|
|
}
|
|
.gv-activated .gv-icon-indicator::before {
|
|
background-color: var(--color-primary);
|
|
border: 1px solid var(--color-body-on-default);
|
|
border-radius: 50%;
|
|
content: "";
|
|
display: block;
|
|
position: absolute;
|
|
right: 0;
|
|
top: 2px;
|
|
height: 8px;
|
|
width: 8px;
|
|
}
|
|
.gv-activated gv-indicator {
|
|
display: inline-block;
|
|
font-size: 0;
|
|
}
|
|
.gv-activated gv-indicator svg {
|
|
height: 100%;
|
|
width: 100%;
|
|
}
|
|
.gv-activated .gv-sort {
|
|
color: var(--color-body-on-alternative);
|
|
display: flex;
|
|
flex: 0 0 9px;
|
|
flex-direction: column;
|
|
gap: 4px;
|
|
}
|
|
.gv-activated .gv-sort gv-indicator {
|
|
height: 6px;
|
|
width: 9px;
|
|
}
|
|
.gv-activated .gv-sort.gv-asc gv-indicator:first-child {
|
|
color: var(--color-body-on-default);
|
|
}
|
|
.gv-activated .gv-sort.gv-desc gv-indicator:last-child {
|
|
color: var(--color-body-on-default);
|
|
}
|
|
.gv-activated .gv-initials {
|
|
align-items: center;
|
|
background-color: var(--color-surface-highlight);
|
|
border-radius: var(--size-xl);
|
|
color: var(--color-body-on-default);
|
|
display: flex;
|
|
height: var(--size-xl);
|
|
justify-content: center;
|
|
text-transform: uppercase;
|
|
width: var(--size-xl);
|
|
font-weight: var(--font-weight-semibold);
|
|
line-height: var(--line-height-body);
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-initials {
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-initials {
|
|
font-size: calc(14px + 2 * ((100vw - 360px ) / 1080 ));
|
|
letter-spacing: calc(0.035px + 0.045 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-initials {
|
|
font-size: 16px;
|
|
letter-spacing: 0.08px;
|
|
}
|
|
}
|
|
.gv-activated .gv-initials > span {
|
|
/* Apply values to calculate em_based margins that work with any font size */
|
|
}
|
|
.gv-activated .gv-initials > span::before {
|
|
margin-bottom: calc(-0.375em + 0px);
|
|
}
|
|
.gv-activated .gv-initials > span::after {
|
|
margin-top: calc(-0.3125em + 0px);
|
|
}
|
|
.gv-activated .gv-initials > span::before,
|
|
.gv-activated .gv-initials > span::after {
|
|
content: "";
|
|
display: block;
|
|
height: 0;
|
|
width: 0;
|
|
}
|
|
.gv-activated .gv-mode-condensed .gv-initials,
|
|
.gv-activated .gv-initials.gv-mode-condensed {
|
|
height: var(--size-lg);
|
|
width: var(--size-lg);
|
|
font-size: 10px;
|
|
font-weight: var(--font-weight-semibold);
|
|
letter-spacing: 0.04px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-autocomplete .gv-input:not(.gv-input-search) .gv-expanded gv-icon {
|
|
transform: rotate(180deg);
|
|
}
|
|
.gv-activated .gv-autocomplete .gv-input [aria-expanded="true"] + .gv-clear {
|
|
visibility: visible;
|
|
}
|
|
.gv-activated .gv-autocomplete-panel {
|
|
background: var(--color-surface-bright);
|
|
border: 1px solid var(--color-border);
|
|
border-radius: var(--border-radius);
|
|
padding: var(--size-sm);
|
|
position: absolute;
|
|
inset: 0 auto auto 0;
|
|
width: 100%;
|
|
z-index: 200;
|
|
}
|
|
.gv-activated .gv-autocomplete-panel .gv-state-info {
|
|
padding: var(--size-sm);
|
|
width: 100%;
|
|
}
|
|
.gv-activated .gv-autocomplete-panel .gv-state-info > *:not(:last-child) {
|
|
margin-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-autocomplete-panel .gv-listbox {
|
|
max-height: 40vh;
|
|
overflow: auto;
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-autocomplete-panel .gv-listbox > *:not(:last-child) {
|
|
margin-bottom: 4px;
|
|
}
|
|
.gv-activated .gv-autocomplete-panel .gv-listbox .gv-option {
|
|
border-radius: var(--border-radius);
|
|
cursor: pointer;
|
|
min-height: 40px;
|
|
padding: var(--size-sm);
|
|
text-align: left;
|
|
text-decoration: none;
|
|
width: 100%;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
.gv-activated .gv-autocomplete-panel .gv-listbox .gv-option:hover {
|
|
background-color: var(--color-state-hover);
|
|
}
|
|
.gv-activated .gv-autocomplete-panel .gv-listbox .gv-option[aria-selected="true"],
|
|
.gv-activated .gv-autocomplete-panel .gv-listbox .gv-option:focus {
|
|
background-color: var(--color-state-active);
|
|
}
|
|
.gv-activated .gv-autocomplete-panel .gv-listbox .gv-option .gv-highlight {
|
|
font-weight: var(--font-weight-semibold);
|
|
}
|
|
.gv-activated .gv-autocomplete-panel .gv-listbox .gv-option .gv-text-icon {
|
|
align-items: center;
|
|
display: flex;
|
|
}
|
|
.gv-activated .gv-autocomplete-panel .gv-listbox .gv-option .gv-text-icon span {
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
.gv-activated .gv-autocomplete-panel .gv-listbox .gv-option .gv-with-underline {
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
.gv-activated .gv-autocomplete-panel .gv-listbox .gv-option .gv-with-underline span {
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
.gv-activated .gv-autocomplete-panel .gv-listbox .gv-option .gv-with-underline .gv-underline {
|
|
color: var(--color-body-on-alternative);
|
|
font-size: 12px;
|
|
font-weight: var(--font-weight-medium);
|
|
letter-spacing: 0.048px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-char-counter-input {
|
|
position: relative;
|
|
}
|
|
.gv-activated .gv-char-counter-input .gv-highlighted {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
color: transparent;
|
|
z-index: 0;
|
|
pointer-events: none;
|
|
}
|
|
.gv-activated .gv-char-counter-input .gv-highlighted .gv-exceed {
|
|
background-color: var(--color-signal-alert-light);
|
|
color: transparent;
|
|
}
|
|
.gv-activated .gv-char-counter-input .gv-highlighted:not(.gv-input-textarea) {
|
|
white-space: nowrap;
|
|
}
|
|
.gv-activated .gv-char-counter-input .gv-highlighted.gv-input-textarea {
|
|
white-space: pre-wrap;
|
|
}
|
|
.gv-activated .gv-char-counter-input input,
|
|
.gv-activated .gv-char-counter-input textarea {
|
|
position: relative;
|
|
z-index: 1;
|
|
background: transparent;
|
|
}
|
|
.gv-activated .gv-char-counter-info {
|
|
display: flex;
|
|
gap: var(--size-xs);
|
|
justify-content: flex-end;
|
|
}
|
|
.gv-activated .gv-char-counter-info .gv-input-message {
|
|
flex-grow: 1;
|
|
}
|
|
.gv-activated .gv-char-counter-info .gv-char-counter {
|
|
color: var(--color-body-on-alternative);
|
|
white-space: nowrap;
|
|
font-size: 12px;
|
|
font-weight: var(--font-weight-medium);
|
|
letter-spacing: 0.048px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-error .gv-char-counter {
|
|
color: var(--color-signal-alert);
|
|
}
|
|
.gv-activated .gv-checkbox {
|
|
--checkbox-color-fill: var(--color-surface-form);
|
|
--checkbox-color-border: var(--color-border-form);
|
|
--checkbox-color-fill-checked: var(--color-state-form-active);
|
|
--checkbox-color-border-checked: transparent;
|
|
--checkbox-color-icon-checked: var(--color-fg-form-on);
|
|
all: unset;
|
|
box-sizing: border-box;
|
|
display: revert;
|
|
cursor: pointer;
|
|
height: var(--size-lg);
|
|
position: relative;
|
|
width: var(--size-lg);
|
|
/* The custom unchecked appearance: */
|
|
/* The custom ticked appearance: */
|
|
}
|
|
.gv-activated .gv-checkbox:disabled {
|
|
cursor: default;
|
|
opacity: var(--opacity-disabled-elements);
|
|
pointer-events: none;
|
|
}
|
|
.gv-activated .gv-checkbox::before {
|
|
background-color: var(--checkbox-color-fill);
|
|
border: var(--size-border) solid var(--checkbox-color-border);
|
|
border-radius: var(--border-radius);
|
|
content: "";
|
|
height: 100%;
|
|
left: 0;
|
|
position: absolute;
|
|
top: 0;
|
|
width: 100%;
|
|
}
|
|
.gv-activated .gv-checkbox:checked::before {
|
|
align-items: center;
|
|
background-color: var(--checkbox-color-fill-checked);
|
|
border-color: var(--checkbox-color-border-checked);
|
|
}
|
|
.gv-activated .gv-checkbox:checked::after {
|
|
background-color: var(--checkbox-color-icon-checked);
|
|
content: "";
|
|
-webkit-mask: url("../images/check.svg") no-repeat 50% 50%;
|
|
mask: url("../images/check.svg") no-repeat 50% 50%;
|
|
-webkit-mask-size: contain;
|
|
mask-size: contain;
|
|
height: 100%;
|
|
left: 0;
|
|
position: absolute;
|
|
top: 0;
|
|
width: 100%;
|
|
}
|
|
.gv-activated .gv-checkbox.gv-checkbox-mixed:checked::after {
|
|
-webkit-mask: url("../images/mixed.svg") no-repeat 50% 50%;
|
|
mask: url("../images/mixed.svg") no-repeat 50% 50%;
|
|
-webkit-mask-size: contain;
|
|
mask-size: contain;
|
|
}
|
|
.gv-activated .gv-mode-condensed .gv-checkbox,
|
|
.gv-activated .gv-checkbox.gv-mode-condensed {
|
|
height: var(--size-md);
|
|
width: var(--size-md);
|
|
}
|
|
.gv-activated .gv-input {
|
|
--input-color-background: var(--color-surface-form);
|
|
--input-color-text: var(--color-body-on-default);
|
|
--input-color-border: var(--color-border-form);
|
|
--input-padding: var(--size-md);
|
|
background: var(--input-color-background);
|
|
border: var(--size-border) solid var(--input-color-border);
|
|
border-radius: var(--input-radius);
|
|
color: var(--input-color-text);
|
|
cursor: text;
|
|
font-family: inherit;
|
|
font-size: 16px;
|
|
font-weight: var(--font-weight-regular);
|
|
height: var(--form-element-height);
|
|
line-height: var(--form-element-height);
|
|
overflow: hidden;
|
|
padding: 0 var(--input-padding);
|
|
text-align: left;
|
|
width: 100%;
|
|
}
|
|
.gv-activated .gv-input input,
|
|
.gv-activated .gv-input select,
|
|
.gv-activated .gv-input textarea {
|
|
all: unset;
|
|
box-sizing: border-box;
|
|
display: revert;
|
|
height: 100%;
|
|
width: 100%;
|
|
}
|
|
.gv-activated .gv-input:not(.gv-disabled, .gv-read-only) select:not(:disabled, [readonly]) {
|
|
background: var(--input-color-background);
|
|
}
|
|
.gv-activated .gv-input:hover:not([readonly], .gv-read-only, .gv-disabled),
|
|
.gv-activated .gv-input:focus:not([readonly], .gv-read-only, .gv-disabled),
|
|
.gv-activated .gv-input:focus-within:not([readonly], .gv-read-only, .gv-disabled) {
|
|
--input-color-border: var(--color-state-form-active);
|
|
}
|
|
.gv-activated .gv-input:disabled,
|
|
.gv-activated .gv-input.gv-disabled {
|
|
cursor: default;
|
|
pointer-events: none;
|
|
}
|
|
.gv-activated .gv-input:disabled,
|
|
.gv-activated .gv-input.gv-disabled,
|
|
.gv-activated .gv-input[readonly],
|
|
.gv-activated .gv-input.gv-read-only {
|
|
--input-color-background: var(--color-surface-form-disabled);
|
|
--input-color-text: var(--color-body-on-disabled);
|
|
--input-color-border: var(--color-border-form-disabled);
|
|
}
|
|
.gv-activated .gv-input[readonly] .gv-addon,
|
|
.gv-activated .gv-input.gv-read-only .gv-addon,
|
|
.gv-activated .gv-input[readonly] .gv-prefix,
|
|
.gv-activated .gv-input.gv-read-only .gv-prefix {
|
|
color: var(--color-body-on-default);
|
|
}
|
|
.gv-activated .gv-input.gv-input-select.gv-read-only {
|
|
pointer-events: none;
|
|
}
|
|
.gv-activated .gv-input::placeholder,
|
|
.gv-activated .gv-input input::placeholder,
|
|
.gv-activated .gv-input textarea::placeholder,
|
|
.gv-activated .gv-input.gv-has-placeholder {
|
|
color: var(--color-body-on-placeholder);
|
|
opacity: 1;
|
|
}
|
|
.gv-activated .gv-input.gv-input-textarea {
|
|
min-height: 100px;
|
|
line-height: var(--line-height-body);
|
|
padding: var(--input-padding);
|
|
overflow: auto;
|
|
resize: none;
|
|
overflow-wrap: break-word;
|
|
word-break: break-word;
|
|
word-wrap: break-word;
|
|
}
|
|
.gv-activated .gv-input.gv-input-textarea textarea {
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-input.gv-input-select {
|
|
padding: 0;
|
|
position: relative;
|
|
}
|
|
.gv-activated .gv-input.gv-input-select select {
|
|
cursor: pointer;
|
|
line-height: calc(var(--form-element-height) - (var(--size-border) * 2));
|
|
padding-left: var(--input-padding);
|
|
padding-right: 72px;
|
|
}
|
|
.gv-activated .gv-input.gv-input-select gv-icon {
|
|
border-left: var(--size-border) solid var(--input-color-border);
|
|
box-sizing: content-box;
|
|
height: 100%;
|
|
padding: 0 var(--size-md);
|
|
pointer-events: none;
|
|
position: absolute;
|
|
right: 0;
|
|
top: 0;
|
|
width: 24px;
|
|
}
|
|
.gv-activated .gv-input.gv-with-addon,
|
|
.gv-activated .gv-input.gv-input-search {
|
|
align-items: center;
|
|
display: flex;
|
|
padding: 0;
|
|
}
|
|
.gv-activated .gv-input.gv-with-addon input,
|
|
.gv-activated .gv-input.gv-input-search input {
|
|
padding: 0 var(--input-padding);
|
|
}
|
|
.gv-activated .gv-input.gv-with-addon .gv-addon,
|
|
.gv-activated .gv-input.gv-input-search .gv-addon,
|
|
.gv-activated .gv-input.gv-with-addon .gv-prefix,
|
|
.gv-activated .gv-input.gv-input-search .gv-prefix {
|
|
align-items: center;
|
|
display: flex;
|
|
height: 100%;
|
|
max-width: 156px;
|
|
padding: 0 var(--input-padding);
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-input.gv-with-addon .gv-addon gv-icon,
|
|
.gv-activated .gv-input.gv-input-search .gv-addon gv-icon,
|
|
.gv-activated .gv-input.gv-with-addon .gv-prefix gv-icon,
|
|
.gv-activated .gv-input.gv-input-search .gv-prefix gv-icon {
|
|
height: 100%;
|
|
}
|
|
.gv-activated .gv-input.gv-with-addon .gv-addon,
|
|
.gv-activated .gv-input.gv-input-search .gv-addon {
|
|
border-left: var(--size-border) solid var(--input-color-border);
|
|
}
|
|
.gv-activated .gv-input.gv-with-addon .gv-prefix,
|
|
.gv-activated .gv-input.gv-input-search .gv-prefix {
|
|
border-right: var(--size-border) solid var(--input-color-border);
|
|
}
|
|
.gv-activated .gv-input.gv-input-date.gv-with-addon {
|
|
position: relative;
|
|
}
|
|
.gv-activated .gv-input.gv-input-date.gv-with-addon .gv-addon {
|
|
background: var(--input-color-background);
|
|
pointer-events: none;
|
|
position: absolute;
|
|
right: 0;
|
|
}
|
|
.gv-activated .gv-input.gv-input-date.gv-with-addon.gv-read-only .gv-addon {
|
|
color: var(--color-body-on-disabled);
|
|
}
|
|
.gv-activated .gv-input.gv-input-textarea.gv-with-addon textarea {
|
|
padding: var(--input-padding);
|
|
}
|
|
.gv-activated .gv-input.gv-input-textarea.gv-with-addon .gv-addon {
|
|
align-items: flex-start;
|
|
padding: var(--input-padding);
|
|
}
|
|
.gv-activated .gv-input.gv-input-textarea.gv-with-addon .gv-addon gv-icon {
|
|
height: var(--size-icon-md);
|
|
}
|
|
.gv-activated .gv-input.gv-input-search.gv-with-clear input[type="search"]::-ms-clear,
|
|
.gv-activated .gv-input.gv-input-search.gv-with-clear input[type="search"]::-ms-reveal {
|
|
display: none;
|
|
height: 0;
|
|
width: 0;
|
|
}
|
|
.gv-activated .gv-input.gv-input-search.gv-with-clear input[type="search"]::-webkit-search-decoration,
|
|
.gv-activated .gv-input.gv-input-search.gv-with-clear input[type="search"]::-webkit-search-cancel-button,
|
|
.gv-activated .gv-input.gv-input-search.gv-with-clear input[type="search"]::-webkit-search-results-button,
|
|
.gv-activated .gv-input.gv-input-search.gv-with-clear input[type="search"]::-webkit-search-results-decoration {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-input .gv-clear {
|
|
align-items: center;
|
|
display: flex;
|
|
height: 100%;
|
|
padding: 0 var(--input-padding);
|
|
visibility: hidden;
|
|
}
|
|
.gv-activated .gv-input .gv-clear gv-icon {
|
|
height: 100%;
|
|
}
|
|
.gv-activated .gv-input:hover .gv-clear,
|
|
.gv-activated .gv-input:focus-within .gv-clear {
|
|
visibility: visible;
|
|
}
|
|
.gv-activated .gv-input .gv-shortcut {
|
|
align-items: center;
|
|
background-color: var(--color-surface-dim);
|
|
border: var(--size-border) solid var(--color-border-alt);
|
|
border-radius: var(--border-radius);
|
|
box-shadow: var(--color-shadow-subtle);
|
|
display: flex;
|
|
flex-wrap: nowrap;
|
|
gap: var(--size-xs);
|
|
height: 18px;
|
|
margin-right: var(--input-padding);
|
|
padding: 0 var(--size-xs);
|
|
font-size: 10px;
|
|
font-weight: var(--font-weight-semibold);
|
|
letter-spacing: 0.04px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-input.gv-input-domain-checker {
|
|
--checker-padding: calc(var(--size-xs) - var(--size-border));
|
|
display: flex;
|
|
height: calc(var(--form-element-height) + (var(--size-xs) * 2));
|
|
padding: var(--checker-padding) var(--checker-padding) var(--checker-padding) 0;
|
|
}
|
|
.gv-activated .gv-input.gv-input-domain-checker input {
|
|
padding: 0 var(--input-padding);
|
|
}
|
|
.gv-activated .gv-input.gv-input-number {
|
|
align-items: center;
|
|
display: flex;
|
|
gap: var(--size-md);
|
|
padding: 0 var(--size-sm);
|
|
}
|
|
.gv-activated .gv-input.gv-input-number input[type="number"] {
|
|
appearance: textfield;
|
|
text-align: center;
|
|
}
|
|
.gv-activated .gv-input.gv-input-number input[type="number"]::-webkit-inner-spin-button,
|
|
.gv-activated .gv-input.gv-input-number input[type="number"]::-webkit-outer-spin-button {
|
|
appearance: none;
|
|
margin: 0;
|
|
}
|
|
.gv-activated .gv-input.gv-input-number button {
|
|
background-color: var(--color-surface-bright);
|
|
border-radius: var(--border-radius);
|
|
color: var(--color-body-on-default);
|
|
padding: var(--size-xs);
|
|
}
|
|
.gv-activated .gv-input.gv-input-number button:disabled,
|
|
.gv-activated .gv-input.gv-input-number button.gv-disabled {
|
|
cursor: default;
|
|
opacity: var(--opacity-disabled-elements);
|
|
pointer-events: none;
|
|
}
|
|
@media (max-width: 599px ) {
|
|
.gv-activated .gv-input .gv-button {
|
|
width: auto;
|
|
}
|
|
.gv-activated .gv-input.gv-input-domain-checker .gv-button span {
|
|
display: none;
|
|
}
|
|
}
|
|
@media (min-width: 600px ) {
|
|
.gv-activated .gv-input:not(.gv-w-full).gv-input-country-number,
|
|
.gv-activated .gv-input:not(.gv-w-full).gv-input-zipcode {
|
|
width: 134px;
|
|
}
|
|
.gv-activated .gv-input:not(.gv-w-full).gv-input-date {
|
|
width: 270px;
|
|
}
|
|
}
|
|
.gv-activated .gv-mode-condensed .gv-input.gv-input-number button,
|
|
.gv-activated .gv-input.gv-mode-condensed.gv-input-number button {
|
|
padding: 0;
|
|
}
|
|
.gv-activated .gv-on-surface-dim .gv-input,
|
|
.gv-activated .gv-input.gv-on-surface-dim {
|
|
--input-color-background: var(--color-surface-bright);
|
|
}
|
|
.gv-activated .gv-input-message {
|
|
font-size: 12px;
|
|
font-weight: var(--font-weight-medium);
|
|
letter-spacing: 0.048px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-error .gv-input,
|
|
.gv-activated .gv-input.gv-error {
|
|
--input-color-border: var(--color-signal-alert);
|
|
}
|
|
.gv-activated .gv-error .gv-input-message:not(.gv-message-info),
|
|
.gv-activated .gv-input-message.gv-error:not(.gv-message-info) {
|
|
color: var(--color-signal-alert);
|
|
}
|
|
.gv-activated .gv-password {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 24px;
|
|
}
|
|
.gv-activated .gv-password .gv-password-form .gv-strength {
|
|
margin-top: 8px;
|
|
position: relative;
|
|
}
|
|
.gv-activated .gv-password .gv-password-form .gv-strength .gv-strength-label {
|
|
position: absolute;
|
|
right: 0;
|
|
top: 8px;
|
|
font-size: 10px;
|
|
font-weight: var(--font-weight-medium);
|
|
letter-spacing: 0.04px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-password .gv-password-form .gv-action {
|
|
margin-top: 16px;
|
|
}
|
|
.gv-activated .gv-password .gv-requirements {
|
|
background-color: var(--color-surface-dim);
|
|
border-radius: var(--border-radius);
|
|
padding: 24px;
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-password .gv-requirements > *:not(:last-child) {
|
|
margin-bottom: 16px;
|
|
}
|
|
.gv-activated .gv-password .gv-requirements .gv-title {
|
|
margin-bottom: 4px;
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
line-height: var(--line-height-body);
|
|
font-weight: var(--font-weight-semibold);
|
|
}
|
|
.gv-activated .gv-password .gv-requirements .gv-list {
|
|
list-style: none;
|
|
padding: 0;
|
|
}
|
|
.gv-activated .gv-password .gv-requirements .gv-list > *:not(:last-child) {
|
|
margin-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-password .gv-requirements .gv-list li {
|
|
padding-left: 24px;
|
|
position: relative;
|
|
}
|
|
.gv-activated .gv-password .gv-requirements .gv-list li::before {
|
|
background-color: var(--color-body-on-default);
|
|
content: "";
|
|
-webkit-mask: url("../images/remove.svg") no-repeat 50% 50%;
|
|
mask: url("../images/remove.svg") no-repeat 50% 50%;
|
|
-webkit-mask-size: contain;
|
|
mask-size: contain;
|
|
height: 20px;
|
|
left: 0;
|
|
position: absolute;
|
|
top: 0;
|
|
width: 20px;
|
|
}
|
|
.gv-activated .gv-password .gv-requirements .gv-list li.gv-valid::before {
|
|
background-color: var(--color-signal-success);
|
|
-webkit-mask: url("../images/check.svg") no-repeat 50% 50%;
|
|
mask: url("../images/check.svg") no-repeat 50% 50%;
|
|
}
|
|
.gv-activated .gv-radio {
|
|
--radio-color-fill: var(--color-surface-form);
|
|
--radio-color-border: var(--color-border-form);
|
|
--radio-color-fill-selected: var(--color-fg-form-on);
|
|
--radio-color-border-selected: var(--color-state-form-active);
|
|
all: unset;
|
|
box-sizing: border-box;
|
|
display: revert;
|
|
cursor: pointer;
|
|
height: var(--size-lg);
|
|
position: relative;
|
|
width: var(--size-lg);
|
|
/* The custom unchecked appearance: */
|
|
/* The custom checked appearance: */
|
|
}
|
|
.gv-activated .gv-radio:disabled {
|
|
cursor: default;
|
|
opacity: var(--opacity-disabled-elements);
|
|
pointer-events: none;
|
|
}
|
|
.gv-activated .gv-radio::after {
|
|
background-color: var(--radio-color-fill);
|
|
border: var(--size-border) solid var(--radio-color-border);
|
|
border-radius: 100%;
|
|
box-sizing: border-box;
|
|
content: "";
|
|
height: 100%;
|
|
left: 0;
|
|
position: absolute;
|
|
top: 0;
|
|
width: 100%;
|
|
}
|
|
.gv-activated .gv-radio:checked::after {
|
|
background-color: var(--radio-color-fill-selected);
|
|
border-color: var(--radio-color-border-selected);
|
|
border-width: 7px;
|
|
}
|
|
.gv-activated .gv-mode-condensed .gv-radio,
|
|
.gv-activated .gv-radio.gv-mode-condensed {
|
|
height: var(--size-md);
|
|
width: var(--size-md);
|
|
}
|
|
.gv-activated .gv-mode-condensed .gv-radio:checked::after,
|
|
.gv-activated .gv-radio.gv-mode-condensed:checked::after {
|
|
border-width: 5px;
|
|
}
|
|
.gv-activated .gv-search-advanced {
|
|
height: 100%;
|
|
left: 0;
|
|
position: fixed;
|
|
top: 0;
|
|
width: 100%;
|
|
z-index: 1100;
|
|
}
|
|
.gv-activated .gv-search-advanced .gv-search-container {
|
|
height: 100%;
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
max-width: 1536px;
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-search-advanced .gv-search-container {
|
|
padding-bottom: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-search-advanced .gv-search-container {
|
|
padding-bottom: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-search-advanced .gv-search-container {
|
|
padding-bottom: 48px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-search-advanced .gv-search-container {
|
|
padding-left: 24px;
|
|
padding-right: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-search-advanced .gv-search-container {
|
|
padding-left: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
padding-right: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-search-advanced .gv-search-container {
|
|
padding-left: 48px;
|
|
padding-right: 48px;
|
|
}
|
|
}
|
|
.gv-activated .gv-search-advanced .gv-search-content {
|
|
display: flex;
|
|
flex-direction: column;
|
|
height: 100%;
|
|
}
|
|
.gv-activated .gv-search-advanced .gv-autocomplete-panel {
|
|
overflow-y: auto;
|
|
padding: var(--size-lg);
|
|
position: relative;
|
|
}
|
|
.gv-activated .gv-search-advanced .gv-autocomplete-panel > *:not(:last-child) {
|
|
margin-bottom: 24px;
|
|
}
|
|
.gv-activated .gv-search-advanced .gv-autocomplete-panel .gv-state-info {
|
|
padding: 0;
|
|
text-align: center;
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-search-advanced .gv-autocomplete-panel .gv-state-info .gv-title {
|
|
font-weight: var(--font-weight-semibold);
|
|
line-height: var(--line-height-body);
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-search-advanced .gv-autocomplete-panel .gv-state-info .gv-title {
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-search-advanced .gv-autocomplete-panel .gv-state-info .gv-title {
|
|
font-size: calc(14px + 2 * ((100vw - 360px ) / 1080 ));
|
|
letter-spacing: calc(0.035px + 0.045 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-search-advanced .gv-autocomplete-panel .gv-state-info .gv-title {
|
|
font-size: 16px;
|
|
letter-spacing: 0.08px;
|
|
}
|
|
}
|
|
.gv-activated .gv-search-advanced .gv-autocomplete-panel .gv-state-info gv-loader {
|
|
height: var(--size-lg);
|
|
width: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-search-advanced .gv-autocomplete-panel .gv-panel-chips {
|
|
position: relative;
|
|
}
|
|
.gv-activated .gv-search-advanced .gv-autocomplete-panel .gv-panel-chips .gv-slide-button {
|
|
height: 100%;
|
|
position: absolute;
|
|
top: 0;
|
|
z-index: 1;
|
|
}
|
|
.gv-activated .gv-search-advanced .gv-autocomplete-panel .gv-panel-chips .gv-slide-button.gv-previous {
|
|
background: linear-gradient(270deg, rgb(from var(--color-surface-bright) r g b / 0%) 0%, var(--color-surface-bright) 40%);
|
|
left: calc(-1 * var(--size-lg));
|
|
padding: 0 var(--size-sm) 0 var(--size-lg);
|
|
}
|
|
.gv-activated .gv-search-advanced .gv-autocomplete-panel .gv-panel-chips .gv-slide-button.gv-next {
|
|
background: linear-gradient(270deg, var(--color-surface-bright) 60%, rgb(from var(--color-surface-bright) r g b / 0%) 100%);
|
|
padding: 0 var(--size-lg) 0 var(--size-sm);
|
|
right: calc(-1 * var(--size-lg));
|
|
}
|
|
.gv-activated .gv-search-advanced .gv-autocomplete-panel .gv-panel-chips .gv-bar {
|
|
overflow: hidden;
|
|
}
|
|
.gv-activated .gv-search-advanced .gv-autocomplete-panel .gv-panel-chips .gv-items {
|
|
display: flex;
|
|
gap: var(--size-md);
|
|
transition: transform 0.2s ease;
|
|
}
|
|
.gv-activated .gv-search-advanced .gv-autocomplete-panel .gv-panel-chips .gv-chip {
|
|
flex-shrink: 0;
|
|
}
|
|
.gv-activated .gv-search-advanced .gv-autocomplete-panel .gv-panel-results > *:not(:last-child) {
|
|
margin-bottom: 16px;
|
|
}
|
|
.gv-activated .gv-search-advanced .gv-autocomplete-panel .gv-panel-header {
|
|
display: flex;
|
|
gap: var(--size-md);
|
|
justify-content: space-between;
|
|
}
|
|
.gv-activated .gv-search-advanced .gv-autocomplete-panel .gv-panel-header .gv-title {
|
|
color: var(--color-body-on-alternative);
|
|
font-weight: var(--font-weight-semibold);
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-search-advanced .gv-autocomplete-panel .gv-listbox {
|
|
max-height: none;
|
|
overflow: visible;
|
|
}
|
|
@media (max-width: 1023px ) {
|
|
.gv-activated .gv-search-advanced {
|
|
background-color: var(--color-surface-bright);
|
|
}
|
|
.gv-activated .gv-search-advanced .gv-search-container {
|
|
padding: 0;
|
|
}
|
|
.gv-activated .gv-search-advanced .gv-autocomplete-panel {
|
|
border: none;
|
|
display: flex;
|
|
flex-direction: column;
|
|
flex-grow: 1;
|
|
}
|
|
.gv-activated .gv-search-advanced .gv-autocomplete-panel .gv-state-info {
|
|
align-items: center;
|
|
display: flex;
|
|
flex-direction: column;
|
|
flex-grow: 1;
|
|
justify-content: center;
|
|
}
|
|
.gv-activated .gv-search-advanced .gv-search-header {
|
|
display: flex;
|
|
gap: var(--size-md);
|
|
padding: var(--size-lg) var(--size-lg) 0;
|
|
}
|
|
.gv-activated .gv-search-advanced .gv-search-header .gv-button {
|
|
width: auto;
|
|
}
|
|
}
|
|
@media (min-width: 1024px ) {
|
|
.gv-activated .gv-search-advanced {
|
|
background-color: var(--color-overlay-dark);
|
|
}
|
|
.gv-activated .gv-search-advanced .gv-search-container {
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
}
|
|
.gv-activated .gv-search-advanced .gv-search-content {
|
|
width: 360px;
|
|
}
|
|
.gv-activated .gv-search-advanced .gv-search-header {
|
|
padding-top: var(--size-xs);
|
|
}
|
|
.gv-activated .gv-search-advanced .gv-search-header .gv-button-cancel {
|
|
display: none;
|
|
}
|
|
}
|
|
.gv-activated .gv-toggle {
|
|
--toggle-color-on: var(--color-state-form-active);
|
|
--toggle-color-off: var(--color-border-form);
|
|
--toggle-color-dot: var(--color-fg-form-on);
|
|
--toggle-height: 24px;
|
|
--toggle-width: 42px;
|
|
--toggle-dot-indent: 3px;
|
|
--toggle-dot-size: calc(var(--toggle-height) - (var(--toggle-dot-indent) * 2));
|
|
display: inline-block;
|
|
position: relative;
|
|
}
|
|
.gv-activated .gv-toggle .gv-toggle-slider {
|
|
background-color: var(--toggle-color-off);
|
|
border-radius: 100px;
|
|
height: var(--toggle-height);
|
|
position: relative;
|
|
width: var(--toggle-width);
|
|
}
|
|
.gv-activated .gv-toggle .gv-toggle-slider::before {
|
|
background-color: var(--toggle-color-dot);
|
|
border-radius: 100px;
|
|
box-sizing: content-box;
|
|
content: "";
|
|
display: block;
|
|
height: var(--toggle-dot-size);
|
|
left: var(--toggle-dot-indent);
|
|
position: absolute;
|
|
top: var(--toggle-dot-indent);
|
|
transition: all 0.2s ease-out;
|
|
width: var(--toggle-dot-size);
|
|
}
|
|
.gv-activated .gv-toggle input[type="checkbox"] {
|
|
all: unset;
|
|
box-sizing: border-box;
|
|
display: revert;
|
|
cursor: pointer;
|
|
height: 100%;
|
|
left: 0;
|
|
opacity: 0;
|
|
position: absolute;
|
|
top: 0;
|
|
width: 100%;
|
|
z-index: 1;
|
|
}
|
|
.gv-activated .gv-toggle input[type="checkbox"]:checked + .gv-toggle-slider {
|
|
background-color: var(--toggle-color-on);
|
|
}
|
|
.gv-activated .gv-toggle input[type="checkbox"]:checked + .gv-toggle-slider::before {
|
|
transform: translateX(calc(var(--toggle-width) - var(--toggle-height)));
|
|
}
|
|
.gv-activated .gv-toggle input[type="checkbox"]:disabled {
|
|
cursor: default;
|
|
opacity: var(--opacity-disabled-elements);
|
|
pointer-events: none;
|
|
}
|
|
.gv-activated .gv-toggle input[type="checkbox"]:disabled + .gv-toggle-slider {
|
|
opacity: var(--opacity-disabled-elements);
|
|
}
|
|
.gv-activated .gv-mode-condensed .gv-toggle,
|
|
.gv-activated .gv-toggle.gv-mode-condensed {
|
|
--toggle-height: 16px;
|
|
--toggle-width: 28px;
|
|
--toggle-dot-indent: 2px;
|
|
}
|
|
.gv-activated .gv-form-option {
|
|
display: flex;
|
|
gap: var(--size-xs);
|
|
flex-direction: column;
|
|
}
|
|
.gv-activated .gv-form-option .gv-option-inline {
|
|
align-items: flex-start;
|
|
display: flex;
|
|
flex-wrap: nowrap;
|
|
gap: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-form-option .gv-option-inline .gv-checkbox,
|
|
.gv-activated .gv-form-option .gv-option-inline .gv-radio,
|
|
.gv-activated .gv-form-option .gv-option-inline .gv-toggle {
|
|
flex-shrink: 0;
|
|
}
|
|
.gv-activated .gv-form-option .gv-option-inline .gv-label {
|
|
cursor: pointer;
|
|
font-weight: var(--font-weight-regular);
|
|
padding-top: 6px;
|
|
line-height: var(--line-height-body);
|
|
/* Apply values to calculate em_based margins that work with any font size */
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-form-option .gv-option-inline .gv-label {
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-form-option .gv-option-inline .gv-label {
|
|
font-size: calc(14px + 2 * ((100vw - 360px ) / 1080 ));
|
|
letter-spacing: calc(0.035px + 0.045 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-form-option .gv-option-inline .gv-label {
|
|
font-size: 16px;
|
|
letter-spacing: 0.08px;
|
|
}
|
|
}
|
|
.gv-activated .gv-form-option .gv-option-inline .gv-label::before {
|
|
margin-bottom: calc(-0.375em + 0px);
|
|
}
|
|
.gv-activated .gv-form-option .gv-option-inline .gv-label::after {
|
|
margin-top: calc(-0.3125em + 0px);
|
|
}
|
|
.gv-activated .gv-form-option .gv-option-inline .gv-label::before,
|
|
.gv-activated .gv-form-option .gv-option-inline .gv-label::after {
|
|
content: "";
|
|
display: block;
|
|
height: 0;
|
|
width: 0;
|
|
}
|
|
.gv-activated .gv-form-option .gv-option-inline .gv-label .gv-description {
|
|
color: var(--color-body-on-alternative);
|
|
display: block;
|
|
font-size: 12px;
|
|
font-weight: var(--font-weight-medium);
|
|
letter-spacing: 0.048px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-mode-condensed .gv-option-inline .gv-label {
|
|
padding-top: 3px;
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-label {
|
|
font-weight: var(--font-weight-semibold);
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-label .gv-label-optional {
|
|
color: var(--color-body-on-alternative);
|
|
margin-left: var(--size-sm);
|
|
font-size: 12px;
|
|
font-weight: var(--font-weight-medium);
|
|
letter-spacing: 0.048px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-label.gv-label-with-icon {
|
|
align-items: center;
|
|
display: flex;
|
|
gap: var(--size-xs);
|
|
}
|
|
.gv-activated .gv-label.gv-label-with-icon gv-icon {
|
|
height: var(--size-icon-sm);
|
|
width: var(--size-icon-sm);
|
|
}
|
|
.gv-activated ul.gv-list-items {
|
|
list-style: none;
|
|
padding: 0;
|
|
}
|
|
.gv-activated ul.gv-list-items > *:not(:last-child) {
|
|
margin-bottom: 16px;
|
|
}
|
|
.gv-activated ul.gv-list-items li {
|
|
padding-left: 24px;
|
|
position: relative;
|
|
}
|
|
.gv-activated ul.gv-list-items li::before {
|
|
background-color: var(--color-body-on-default);
|
|
content: "";
|
|
-webkit-mask: url("../images/remove.svg") no-repeat 50% 50%;
|
|
mask: url("../images/remove.svg") no-repeat 50% 50%;
|
|
-webkit-mask-size: contain;
|
|
mask-size: contain;
|
|
height: 20px;
|
|
left: 0;
|
|
position: absolute;
|
|
top: 0;
|
|
width: 20px;
|
|
}
|
|
.gv-activated ul.gv-list-items.gv-list-check li::before {
|
|
-webkit-mask: url("../images/check.svg") no-repeat 50% 50%;
|
|
mask: url("../images/check.svg") no-repeat 50% 50%;
|
|
}
|
|
.gv-activated .gv-list-table {
|
|
text-align: left;
|
|
width: 100%;
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
line-height: var(--line-height-body);
|
|
/* Form */
|
|
--form-element-height: 30px;
|
|
}
|
|
.gv-activated .gv-list-table tr:nth-child(even) {
|
|
background-color: var(--color-zebra-even);
|
|
}
|
|
.gv-activated .gv-list-table tr:nth-child(odd) {
|
|
background-color: var(--color-zebra-odd);
|
|
}
|
|
.gv-activated .gv-list-table tr:hover {
|
|
background-color: var(--color-zebra-hover);
|
|
}
|
|
.gv-activated .gv-list-table th {
|
|
font-weight: var(--font-weight-semibold);
|
|
}
|
|
.gv-activated .gv-list-table .gv-col-action {
|
|
width: 1px;
|
|
}
|
|
.gv-activated .gv-list-table th,
|
|
.gv-activated .gv-list-table td:not(.gv-col-action) {
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
@media (max-width: 599px ) {
|
|
.gv-activated .gv-list-table,
|
|
.gv-activated .gv-list-table tbody {
|
|
display: block;
|
|
}
|
|
.gv-activated .gv-list-table tr {
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
.gv-activated .gv-list-table th {
|
|
padding: var(--size-sm) var(--size-md);
|
|
}
|
|
.gv-activated .gv-list-table td:not(.gv-col-action) {
|
|
padding: 0 var(--size-md) var(--size-sm);
|
|
}
|
|
.gv-activated .gv-list-table td.gv-col-action {
|
|
padding: 0 var(--size-md);
|
|
}
|
|
.gv-activated .gv-list-table td.gv-col-action > * {
|
|
margin-bottom: var(--size-sm);
|
|
}
|
|
}
|
|
@media (min-width: 600px ) {
|
|
.gv-activated .gv-list-table th,
|
|
.gv-activated .gv-list-table td {
|
|
padding: var(--size-sm) var(--size-md);
|
|
}
|
|
.gv-activated .gv-list-table th {
|
|
max-width: 200px;
|
|
width: 200px;
|
|
}
|
|
.gv-activated .gv-list-table td:not(.gv-col-action) {
|
|
max-width: 1px;
|
|
}
|
|
}
|
|
@keyframes gv-spin {
|
|
0% {
|
|
transform: rotate(0deg);
|
|
}
|
|
100% {
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
.gv-activated gv-loader {
|
|
align-items: center;
|
|
animation: gv-spin 1s linear infinite;
|
|
display: inline-flex;
|
|
height: var(--size-xl);
|
|
width: var(--size-xl);
|
|
}
|
|
.gv-activated gv-loader svg {
|
|
height: 100%;
|
|
width: 100%;
|
|
}
|
|
.gv-activated gv-loader .gv-primary-color {
|
|
fill: var(--color-loader-primary);
|
|
}
|
|
.gv-activated gv-loader .gv-secondary-color {
|
|
fill: var(--color-loader-secondary);
|
|
}
|
|
.gv-activated .gv-mode-condensed gv-loader,
|
|
.gv-activated gv-loader.gv-mode-condensed {
|
|
height: var(--size-lg);
|
|
width: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-loader-container {
|
|
align-items: center;
|
|
background-color: var(--color-overlay-light);
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: var(--size-sm);
|
|
padding: var(--size-lg);
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-loader-container gv-loader {
|
|
height: var(--size-lg);
|
|
width: var(--size-lg);
|
|
}
|
|
.gv-activated gv-logo {
|
|
align-items: center;
|
|
display: inline-flex;
|
|
height: 40px;
|
|
}
|
|
.gv-activated gv-logo svg {
|
|
height: 100%;
|
|
width: 100%;
|
|
}
|
|
.gv-activated.gv-dark-mode gv-logo .gv-mode-color {
|
|
fill: var(--color-gray-100);
|
|
}
|
|
.gv-activated .gv-modal {
|
|
align-items: center;
|
|
background-color: var(--color-overlay-dark);
|
|
display: flex;
|
|
height: 100%;
|
|
justify-content: center;
|
|
left: 0;
|
|
overflow: auto;
|
|
position: fixed;
|
|
top: 0;
|
|
width: 100%;
|
|
z-index: 1100;
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-modal {
|
|
padding: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-modal {
|
|
padding: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-modal {
|
|
padding: 48px;
|
|
}
|
|
}
|
|
.gv-activated .gv-modal .gv-modal-content {
|
|
background-color: var(--color-surface-bright);
|
|
border-radius: var(--border-radius);
|
|
color: var(--color-body-on-default);
|
|
margin: auto;
|
|
max-width: 700px;
|
|
position: relative;
|
|
width: 100%;
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-modal .gv-modal-content {
|
|
padding: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-modal .gv-modal-content {
|
|
padding: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-modal .gv-modal-content {
|
|
padding: 48px;
|
|
}
|
|
}
|
|
.gv-activated .gv-modal .gv-modal-content > *:not(:last-child) {
|
|
margin-bottom: 24px;
|
|
}
|
|
.gv-activated .gv-modal .gv-modal-content .gv-modal-close {
|
|
cursor: pointer;
|
|
padding: var(--size-sm);
|
|
position: absolute;
|
|
right: 0;
|
|
top: 0;
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-modal .gv-modal-content .gv-modal-close {
|
|
right: 8px;
|
|
top: 8px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-modal .gv-modal-content .gv-modal-close {
|
|
right: calc(8px + 8 * ((100vw - 360px ) / 1080 ));
|
|
top: calc(8px + 8 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-modal .gv-modal-content .gv-modal-close {
|
|
right: 16px;
|
|
top: 16px;
|
|
}
|
|
}
|
|
.gv-activated .gv-modal .gv-modal-content .gv-modal-body > *:not(:last-child) {
|
|
margin-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-modal .gv-modal-content .gv-modal-title {
|
|
margin-right: 24px;
|
|
font-weight: var(--font-weight-bold);
|
|
line-height: var(--line-height-heading);
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-modal .gv-modal-content .gv-modal-title {
|
|
font-size: 14px;
|
|
letter-spacing: 0.042px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-modal .gv-modal-content .gv-modal-title {
|
|
font-size: calc(14px + 10 * ((100vw - 360px ) / 1080 ));
|
|
letter-spacing: calc(0.042px + -0.006 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-modal .gv-modal-content .gv-modal-title {
|
|
font-size: 24px;
|
|
letter-spacing: 0.036px;
|
|
}
|
|
}
|
|
.gv-activated .gv-modal .gv-modal-content .gv-modal-subtitle {
|
|
font-weight: var(--font-weight-semibold);
|
|
line-height: var(--line-height-body);
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-modal .gv-modal-content .gv-modal-subtitle {
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-modal .gv-modal-content .gv-modal-subtitle {
|
|
font-size: calc(14px + 4 * ((100vw - 360px ) / 1080 ));
|
|
letter-spacing: calc(0.035px + -0.035 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-modal .gv-modal-content .gv-modal-subtitle {
|
|
font-size: 18px;
|
|
letter-spacing: 0px;
|
|
}
|
|
}
|
|
.gv-activated .gv-modal .gv-modal-content .gv-modal-progress {
|
|
align-items: center;
|
|
display: flex;
|
|
gap: 16px;
|
|
justify-content: space-between;
|
|
}
|
|
.gv-activated .gv-modal .gv-progress-bullets {
|
|
align-items: center;
|
|
display: flex;
|
|
gap: 8px;
|
|
}
|
|
.gv-activated .gv-modal .gv-progress-bullets > span {
|
|
background-color: var(--color-state-hover);
|
|
border-radius: 50%;
|
|
display: block;
|
|
height: 8px;
|
|
width: 8px;
|
|
}
|
|
.gv-activated .gv-modal .gv-progress-bullets > span.gv-bullet-current {
|
|
background-color: var(--color-state-focus);
|
|
}
|
|
.gv-activated .gv-modal .gv-progress-bullets > span.gv-bullet-done {
|
|
background-color: var(--color-state-active);
|
|
}
|
|
@media (max-width: 599px ) {
|
|
.gv-activated .gv-modal {
|
|
align-items: flex-end;
|
|
padding-bottom: 0;
|
|
padding-left: 0;
|
|
padding-right: 0;
|
|
}
|
|
.gv-activated .gv-modal .gv-modal-content {
|
|
border-radius: 0;
|
|
margin: 0;
|
|
max-height: 100%;
|
|
overflow: auto;
|
|
}
|
|
.gv-activated .gv-modal .gv-modal-content .gv-modal-progress .gv-button {
|
|
width: auto;
|
|
}
|
|
}
|
|
.gv-activated .gv-main-header {
|
|
background-color: var(--color-surface-bright);
|
|
border-bottom: 1px solid var(--color-border-alt);
|
|
height: var(--navigation-bar-height);
|
|
left: 0;
|
|
position: fixed;
|
|
top: 0;
|
|
width: 100%;
|
|
z-index: 1000;
|
|
}
|
|
.gv-activated .gv-main-header .gv-header-nav {
|
|
align-items: center;
|
|
display: flex;
|
|
flex-wrap: nowrap;
|
|
gap: 24px;
|
|
height: var(--navigation-bar-height);
|
|
justify-content: space-between;
|
|
position: relative;
|
|
width: 100%;
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
max-width: 1536px;
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-main-header .gv-header-nav {
|
|
padding-left: 24px;
|
|
padding-right: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-main-header .gv-header-nav {
|
|
padding-left: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
padding-right: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-main-header .gv-header-nav {
|
|
padding-left: 48px;
|
|
padding-right: 48px;
|
|
}
|
|
}
|
|
.gv-activated .gv-main-header .gv-nav-left {
|
|
align-items: center;
|
|
display: flex;
|
|
gap: 24px;
|
|
flex-wrap: nowrap;
|
|
}
|
|
.gv-activated .gv-main-header .gv-nav-menu {
|
|
align-items: center;
|
|
display: flex;
|
|
flex-wrap: nowrap;
|
|
gap: 24px;
|
|
}
|
|
.gv-activated .gv-main-header .gv-nav-menu > * {
|
|
display: block;
|
|
position: relative;
|
|
text-decoration: none;
|
|
}
|
|
.gv-activated .gv-main-header .gv-nav-menu .gv-btn-cart {
|
|
align-items: center;
|
|
display: flex;
|
|
flex-wrap: nowrap;
|
|
gap: 4px;
|
|
}
|
|
.gv-activated .gv-main-header .gv-nav-menu .gv-btn-cart .gv-amount {
|
|
background-color: var(--color-surface-muted);
|
|
border-radius: var(--border-radius);
|
|
color: var(--color-body-on-placeholder);
|
|
line-height: 1;
|
|
padding: 4px;
|
|
font-size: 10px;
|
|
font-weight: var(--font-weight-semibold);
|
|
letter-spacing: 0.04px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-main-header .gv-nav-menu .gv-btn-cart.gv-filled .gv-amount {
|
|
background-color: var(--color-cta);
|
|
color: var(--color-button-fg-on);
|
|
}
|
|
.gv-activated .gv-main-header .gv-nav-menu .gv-btn-account {
|
|
align-items: center;
|
|
display: flex;
|
|
gap: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-main-header .gv-nav-menu .gv-btn-account .gv-btn-label {
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
line-height: var(--line-height-body);
|
|
/* Apply values to calculate em_based margins that work with any font size */
|
|
}
|
|
.gv-activated .gv-main-header .gv-nav-menu .gv-btn-account .gv-btn-label::before {
|
|
margin-bottom: calc(-0.375em + 0px);
|
|
}
|
|
.gv-activated .gv-main-header .gv-nav-menu .gv-btn-account .gv-btn-label::after {
|
|
margin-top: calc(-0.3125em + 0px);
|
|
}
|
|
.gv-activated .gv-main-header .gv-nav-menu .gv-btn-account .gv-btn-label::before,
|
|
.gv-activated .gv-main-header .gv-nav-menu .gv-btn-account .gv-btn-label::after {
|
|
content: "";
|
|
display: block;
|
|
height: 0;
|
|
width: 0;
|
|
}
|
|
.gv-activated .gv-main-header .gv-nav-menu .gv-btn-account.gv-icon-indicator::before {
|
|
left: calc(var(--size-icon-md) - var(--size-sm));
|
|
right: auto;
|
|
}
|
|
@media (max-width: 599px ) {
|
|
.gv-activated .gv-main-header .gv-nav-menu .gv-btn-account .gv-btn-label {
|
|
display: none;
|
|
}
|
|
}
|
|
@media (max-width: 1023px ) {
|
|
.gv-activated .gv-main-header .gv-nav-links,
|
|
.gv-activated .gv-main-header .gv-btn-notification,
|
|
.gv-activated .gv-main-header .gv-btn-search {
|
|
display: none;
|
|
}
|
|
}
|
|
@media (min-width: 1024px ) {
|
|
.gv-activated .gv-main-header .gv-btn-menu {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-main-header .gv-nav-links ul {
|
|
display: flex;
|
|
list-style: none;
|
|
padding: 0;
|
|
}
|
|
.gv-activated .gv-main-header .gv-nav-links ul a {
|
|
border-bottom: 1px solid var(--color-border-alt);
|
|
display: block;
|
|
font-weight: var(--font-weight-medium);
|
|
height: var(--navigation-bar-height);
|
|
padding: 16px 24px;
|
|
text-decoration: none;
|
|
white-space: nowrap;
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-main-header .gv-nav-links ul a:hover {
|
|
background-color: var(--color-state-hover);
|
|
}
|
|
.gv-activated .gv-main-header .gv-nav-links ul .gv-active a {
|
|
background-color: var(--color-state-active);
|
|
border-color: var(--color-border);
|
|
}
|
|
}
|
|
.gv-activated .gv-notice {
|
|
--notice-color-background: inherit;
|
|
--notice-color-icon: inherit;
|
|
--notice-color-text: var(--color-body-on-default);
|
|
align-items: center;
|
|
background: var(--notice-color-background);
|
|
border-radius: var(--notice-radius);
|
|
color: var(--notice-color-text);
|
|
display: flex;
|
|
flex-wrap: nowrap;
|
|
gap: var(--size-md);
|
|
padding: var(--size-lg);
|
|
position: relative;
|
|
}
|
|
.gv-activated .gv-notice .gv-notice-icon {
|
|
color: var(--notice-color-icon);
|
|
flex-shrink: 0;
|
|
}
|
|
.gv-activated .gv-notice .gv-notice-content {
|
|
flex-grow: 1;
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-notice .gv-notice-content > *:not(:last-child) {
|
|
margin-bottom: var(--size-xs);
|
|
}
|
|
.gv-activated .gv-notice .gv-notice-title {
|
|
font-weight: var(--font-weight-semibold);
|
|
}
|
|
.gv-activated .gv-notice .gv-button {
|
|
flex-shrink: 0;
|
|
}
|
|
.gv-activated .gv-notice .gv-notice-close {
|
|
cursor: pointer;
|
|
padding: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-notice.gv-notice-alert {
|
|
--notice-color-background: var(--color-signal-alert-light);
|
|
--notice-color-icon: var(--color-signal-alert);
|
|
}
|
|
.gv-activated .gv-notice.gv-notice-warning {
|
|
--notice-color-background: var(--color-signal-warning-light);
|
|
--notice-color-icon: var(--color-signal-warning);
|
|
}
|
|
.gv-activated .gv-notice.gv-notice-success {
|
|
--notice-color-background: var(--color-signal-success-light);
|
|
--notice-color-icon: var(--color-signal-success);
|
|
}
|
|
.gv-activated .gv-notice.gv-notice-info {
|
|
--notice-color-background: var(--color-signal-info-light);
|
|
--notice-color-icon: var(--color-signal-info);
|
|
}
|
|
.gv-activated .gv-notice.gv-notice-addon {
|
|
border-top-left-radius: 0;
|
|
border-top-right-radius: 0;
|
|
padding: var(--size-sm) var(--size-lg);
|
|
/* Form */
|
|
--form-element-height: 30px;
|
|
}
|
|
.gv-activated .gv-notice.gv-notice-addon .gv-button {
|
|
font-size: 12px;
|
|
font-weight: var(--font-weight-semibold);
|
|
letter-spacing: 0.048px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
@media (max-width: 599px ) {
|
|
.gv-activated .gv-notice {
|
|
flex-wrap: wrap;
|
|
gap: var(--size-sm);
|
|
justify-content: space-between;
|
|
}
|
|
.gv-activated .gv-notice .gv-notice-content {
|
|
width: 100%;
|
|
}
|
|
.gv-activated .gv-notice .gv-button {
|
|
margin-top: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-notice .gv-notice-close {
|
|
position: absolute;
|
|
right: var(--size-lg);
|
|
top: var(--size-md);
|
|
}
|
|
}
|
|
.gv-activated .gv-mode-condensed .gv-notice,
|
|
.gv-activated .gv-notice.gv-mode-condensed {
|
|
gap: var(--size-sm);
|
|
padding: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-mode-condensed .gv-notice .gv-notice-content,
|
|
.gv-activated .gv-notice.gv-mode-condensed .gv-notice-content {
|
|
font-size: 12px;
|
|
font-weight: var(--font-weight-medium);
|
|
letter-spacing: 0.048px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
@media (max-width: 599px ) {
|
|
.gv-activated .gv-mode-condensed .gv-notice .gv-notice-close,
|
|
.gv-activated .gv-notice.gv-mode-condensed .gv-notice-close {
|
|
right: var(--size-sm);
|
|
top: 0;
|
|
}
|
|
}
|
|
.gv-activated .gv-main-header .gv-nav-select .gv-btn-select {
|
|
display: flex;
|
|
gap: 4px;
|
|
padding: 8px 0 8px 8px;
|
|
}
|
|
.gv-activated .gv-main-header .gv-nav-select .gv-nav-dropdown {
|
|
background-color: var(--color-surface-bright);
|
|
border: 1px solid var(--color-border-alt);
|
|
border-radius: var(--border-radius);
|
|
display: none;
|
|
padding: 16px;
|
|
position: absolute;
|
|
right: 0;
|
|
top: 100%;
|
|
width: 200px;
|
|
}
|
|
.gv-activated .gv-main-header .gv-nav-select .gv-nav-dropdown ul {
|
|
list-style: none;
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-main-header .gv-nav-select .gv-nav-dropdown ul > *:not(:last-child) {
|
|
margin-bottom: 4px;
|
|
}
|
|
.gv-activated .gv-main-header .gv-nav-select .gv-nav-dropdown li {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 8px;
|
|
}
|
|
.gv-activated .gv-main-header .gv-nav-select [aria-expanded="true"] gv-icon:last-child {
|
|
transform: rotate(180deg);
|
|
}
|
|
.gv-activated .gv-main-header .gv-nav-select [aria-expanded="true"] + .gv-nav-dropdown {
|
|
display: block;
|
|
}
|
|
.gv-activated gv-pay-icon {
|
|
display: inline-block;
|
|
height: 26px;
|
|
width: 34px;
|
|
font-size: 0;
|
|
vertical-align: text-bottom;
|
|
}
|
|
.gv-activated gv-pay-icon svg {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
.gv-activated .gv-resource {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 8px;
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-resource .gv-content {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 4px;
|
|
}
|
|
.gv-activated .gv-resource .gv-amount {
|
|
font-weight: var(--font-weight-semibold);
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
.gv-activated .gv-resource .gv-description {
|
|
color: var(--color-body-on-alternative);
|
|
font-size: 12px;
|
|
font-weight: var(--font-weight-medium);
|
|
letter-spacing: 0.048px;
|
|
line-height: var(--line-height-body);
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
.gv-activated .gv-progress {
|
|
background-color: var(--color-border-alt);
|
|
border-radius: var(--border-radius);
|
|
height: 8px;
|
|
overflow: hidden;
|
|
position: relative;
|
|
width: 100%;
|
|
}
|
|
.gv-activated .gv-progress .gv-bar {
|
|
background-color: var(--color-signal-info);
|
|
border-radius: var(--border-radius);
|
|
display: block;
|
|
height: 100%;
|
|
transition: width 400ms ease-in-out;
|
|
}
|
|
.gv-activated .gv-progress .gv-bar.gv-alert {
|
|
background-color: var(--color-signal-alert);
|
|
}
|
|
.gv-activated .gv-progress .gv-bar.gv-good {
|
|
background-color: var(--color-signal-success);
|
|
}
|
|
.gv-activated .gv-progress .gv-bar.gv-warning {
|
|
background-color: var(--color-signal-warning);
|
|
}
|
|
.gv-activated .gv-shortcut {
|
|
align-items: center;
|
|
background: var(--color-surface-bright);
|
|
border: 1px solid var(--color-border-alt);
|
|
border-radius: var(--border-radius);
|
|
cursor: pointer;
|
|
display: flex;
|
|
gap: var(--size-md);
|
|
padding: var(--size-md) var(--size-lg);
|
|
text-decoration: none;
|
|
}
|
|
.gv-activated .gv-shortcut gv-icon {
|
|
flex-shrink: 0;
|
|
}
|
|
.gv-activated .gv-shortcut .gv-content {
|
|
color: var(--color-body-on-alternative);
|
|
flex: 1;
|
|
font-size: 12px;
|
|
font-weight: var(--font-weight-medium);
|
|
letter-spacing: 0.048px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-shortcut .gv-content .gv-status {
|
|
align-items: center;
|
|
display: flex;
|
|
gap: var(--size-xs);
|
|
font-size: 12px;
|
|
font-weight: var(--font-weight-semibold);
|
|
letter-spacing: 0.048px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-shortcut .gv-content .gv-status.gv-active {
|
|
color: var(--color-signal-success);
|
|
}
|
|
.gv-activated .gv-shortcut .gv-content .gv-status.gv-active .gv-indicator {
|
|
background-color: var(--color-signal-success);
|
|
}
|
|
.gv-activated .gv-shortcut .gv-content .gv-status.gv-inactive-prio-high {
|
|
color: var(--color-signal-warning);
|
|
}
|
|
.gv-activated .gv-shortcut .gv-content .gv-status.gv-inactive-prio-high .gv-indicator {
|
|
background-color: var(--color-signal-warning);
|
|
}
|
|
.gv-activated .gv-shortcut .gv-content .gv-status.gv-inactive-prio-low {
|
|
color: var(--color-body-on-alternative);
|
|
}
|
|
.gv-activated .gv-shortcut .gv-content .gv-status.gv-inactive-prio-low .gv-indicator {
|
|
background-color: var(--color-body-on-alternative);
|
|
}
|
|
.gv-activated .gv-shortcut .gv-content .gv-status.gv-new {
|
|
color: var(--color-signal-info);
|
|
}
|
|
.gv-activated .gv-shortcut .gv-content .gv-status.gv-new .gv-indicator {
|
|
background-color: var(--color-signal-info);
|
|
}
|
|
.gv-activated .gv-shortcut .gv-content .gv-title {
|
|
color: var(--color-body-on-default);
|
|
font-weight: var(--font-weight-semibold);
|
|
line-height: var(--line-height-body);
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-shortcut .gv-content .gv-title {
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-shortcut .gv-content .gv-title {
|
|
font-size: calc(14px + 4 * ((100vw - 360px ) / 1080 ));
|
|
letter-spacing: calc(0.035px + -0.035 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-shortcut .gv-content .gv-title {
|
|
font-size: 18px;
|
|
letter-spacing: 0px;
|
|
}
|
|
}
|
|
.gv-activated .gv-shortcut-tile {
|
|
align-items: center;
|
|
background: var(--color-surface-bright);
|
|
border: 1px solid var(--color-border-alt);
|
|
border-radius: var(--border-radius);
|
|
cursor: pointer;
|
|
display: flex;
|
|
gap: var(--size-md);
|
|
padding: var(--size-lg);
|
|
text-decoration: none;
|
|
}
|
|
.gv-activated .gv-shortcut-tile gv-icon,
|
|
.gv-activated .gv-shortcut-tile gv-tile {
|
|
flex-shrink: 0;
|
|
}
|
|
.gv-activated .gv-shortcut-tile .gv-content {
|
|
flex: 1;
|
|
min-width: 0;
|
|
}
|
|
.gv-activated .gv-shortcut-tile .gv-content .gv-title {
|
|
font-weight: var(--font-weight-semibold);
|
|
line-height: var(--line-height-body);
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-shortcut-tile .gv-content .gv-title {
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-shortcut-tile .gv-content .gv-title {
|
|
font-size: calc(14px + 4 * ((100vw - 360px ) / 1080 ));
|
|
letter-spacing: calc(0.035px + -0.035 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-shortcut-tile .gv-content .gv-title {
|
|
font-size: 18px;
|
|
letter-spacing: 0px;
|
|
}
|
|
}
|
|
.gv-activated .gv-shortcut-tile .gv-content .gv-description {
|
|
align-items: center;
|
|
display: flex;
|
|
gap: var(--size-md);
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-shortcut-tile .gv-content .gv-text {
|
|
flex: 1;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
.gv-activated .gv-sidedrawer {
|
|
--side-content-width: 300px;
|
|
background-color: var(--color-overlay-dark);
|
|
bottom: 0;
|
|
display: none;
|
|
left: 0;
|
|
position: fixed;
|
|
right: 0;
|
|
top: 0;
|
|
z-index: 1100;
|
|
}
|
|
.gv-activated .gv-sidedrawer.gv-slide-in {
|
|
display: block;
|
|
opacity: 0;
|
|
transition: opacity 0.2s;
|
|
visibility: hidden;
|
|
}
|
|
.gv-activated .gv-sidedrawer.gv-slide-in .gv-side-content {
|
|
transition: transform 0.3s ease-in-out;
|
|
}
|
|
.gv-activated .gv-sidedrawer.gv-slide-in .gv-side-content:not(.gv-pos-right) {
|
|
left: calc(-1 * var(--side-content-width));
|
|
}
|
|
.gv-activated .gv-sidedrawer.gv-slide-in .gv-side-content.gv-pos-right {
|
|
right: calc(-1 * var(--side-content-width));
|
|
}
|
|
.gv-activated .gv-sidedrawer.gv-sidedrawer-open {
|
|
display: block;
|
|
}
|
|
.gv-activated .gv-sidedrawer.gv-sidedrawer-open.gv-slide-in {
|
|
opacity: 1;
|
|
visibility: visible;
|
|
}
|
|
.gv-activated .gv-sidedrawer.gv-sidedrawer-open.gv-slide-in .gv-side-content:not(.gv-pos-right) {
|
|
transform: translateX(100%);
|
|
}
|
|
.gv-activated .gv-sidedrawer.gv-sidedrawer-open.gv-slide-in .gv-side-content.gv-pos-right {
|
|
transform: translateX(-100%);
|
|
}
|
|
.gv-activated .gv-sidedrawer .gv-side-content {
|
|
background: var(--color-surface-bright);
|
|
bottom: 0;
|
|
height: 100%;
|
|
overflow: auto;
|
|
overscroll-behavior: contain;
|
|
padding: 24px 32px;
|
|
position: absolute;
|
|
top: 0;
|
|
width: var(--side-content-width);
|
|
}
|
|
.gv-activated .gv-sidedrawer .gv-side-content > *:not(:last-child) {
|
|
margin-bottom: 16px;
|
|
}
|
|
.gv-activated .gv-sidedrawer .gv-side-content .gv-btn-close {
|
|
padding: 8px;
|
|
position: absolute;
|
|
right: 16px;
|
|
top: 8px;
|
|
}
|
|
.gv-activated .gv-sidedrawer .gv-side-content .gv-side-account {
|
|
padding: 16px 8px;
|
|
}
|
|
.gv-activated .gv-sidedrawer .gv-side-content .gv-side-account > *:not(:last-child) {
|
|
margin-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-sidedrawer .gv-side-content .gv-side-account .gv-account-info {
|
|
padding-right: 24px;
|
|
}
|
|
.gv-activated .gv-sidedrawer .gv-side-content .gv-side-account .gv-account-info > *:not(:last-child) {
|
|
margin-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-sidedrawer .gv-side-content .gv-side-account .gv-name {
|
|
font-weight: var(--font-weight-semibold);
|
|
}
|
|
.gv-activated .gv-sidedrawer .gv-side-content .gv-side-account .gv-sub {
|
|
color: var(--color-body-on-alternative);
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-sidedrawer .gv-side-content .gv-side-account .gv-name,
|
|
.gv-activated .gv-sidedrawer .gv-side-content .gv-side-account .gv-sub {
|
|
display: block;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
.gv-activated .gv-sidedrawer .gv-side-content .gv-side-dropdown {
|
|
display: none;
|
|
padding: 0 8px 0 32px;
|
|
}
|
|
.gv-activated .gv-sidedrawer .gv-side-content [aria-expanded="true"] gv-icon:last-child {
|
|
transform: rotate(180deg);
|
|
}
|
|
.gv-activated .gv-sidedrawer .gv-side-content [aria-expanded="true"] + .gv-side-dropdown {
|
|
display: block;
|
|
}
|
|
.gv-activated .gv-sidebar {
|
|
border-right: 1px solid var(--color-border-alt);
|
|
flex: 0 0 232px;
|
|
width: 232px;
|
|
padding: 24px 16px 24px 40px;
|
|
}
|
|
.gv-activated .gv-sidebar > *:not(:last-child) {
|
|
margin-bottom: 16px;
|
|
}
|
|
.gv-activated .gv-side-nav ul {
|
|
list-style: none;
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-side-nav ul > *:not(:last-child) {
|
|
margin-bottom: 4px;
|
|
}
|
|
.gv-activated .gv-side-nav ul li {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 8px;
|
|
}
|
|
.gv-activated .gv-side-label {
|
|
color: var(--color-body-on-alternative);
|
|
margin-bottom: 8px;
|
|
padding: 0 8px 8px;
|
|
font-weight: var(--font-weight-semibold);
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
line-height: var(--line-height-body);
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
.gv-activated .gv-nav-item {
|
|
align-items: flex-start;
|
|
border-radius: var(--border-radius);
|
|
display: flex;
|
|
gap: 8px;
|
|
min-height: 40px;
|
|
padding: 8px 8px;
|
|
text-align: left;
|
|
text-decoration: none;
|
|
width: 100%;
|
|
hyphens: auto;
|
|
overflow-wrap: break-word;
|
|
word-break: break-word;
|
|
word-wrap: break-word;
|
|
}
|
|
.gv-activated .gv-nav-item:hover {
|
|
background-color: var(--color-state-hover);
|
|
}
|
|
.gv-activated .gv-nav-item.gv-active,
|
|
.gv-activated .gv-nav-item[aria-selected="true"] {
|
|
background-color: var(--color-state-active);
|
|
}
|
|
.gv-activated .gv-nav-item gv-icon {
|
|
flex-shrink: 0;
|
|
}
|
|
.gv-activated .gv-nav-item > span {
|
|
flex-grow: 1;
|
|
padding-top: 1px;
|
|
}
|
|
@keyframes gv-pulse {
|
|
50% {
|
|
opacity: 0.4;
|
|
}
|
|
}
|
|
.gv-activated .gv-skeleton {
|
|
animation: gv-pulse 2s ease-in-out infinite;
|
|
background-color: var(--color-surface-muted);
|
|
border-radius: var(--border-radius);
|
|
min-width: var(--size-md);
|
|
}
|
|
.gv-activated .gv-skeleton::before {
|
|
content: "\00a0";
|
|
display: inline-block;
|
|
}
|
|
/* Stepper component */
|
|
.gv-activated {
|
|
--size-stepper-dot: 20px;
|
|
}
|
|
.gv-activated .gv-stepper {
|
|
align-items: flex-start;
|
|
color: var(--color-body-on-alternative);
|
|
display: flex;
|
|
padding-bottom: var(--size-md);
|
|
padding-top: var(--size-md);
|
|
position: relative;
|
|
width: 100%;
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-stepper {
|
|
gap: 24px;
|
|
padding-left: 24px;
|
|
padding-right: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-stepper {
|
|
gap: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
padding-left: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
padding-right: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-stepper {
|
|
gap: 48px;
|
|
padding-left: 48px;
|
|
padding-right: 48px;
|
|
}
|
|
}
|
|
.gv-activated .gv-stepper .gv-stepper-back a {
|
|
align-items: center;
|
|
color: var(--color-body-on-alternative);
|
|
display: inline-flex;
|
|
gap: var(--size-xs);
|
|
text-decoration: none;
|
|
}
|
|
.gv-activated .gv-stepper .gv-stepper-back a:hover {
|
|
color: var(--color-body-on-alternative);
|
|
}
|
|
.gv-activated .gv-stepper .gv-stepper-back a span {
|
|
/* Apply values to calculate em_based margins that work with any font size */
|
|
}
|
|
.gv-activated .gv-stepper .gv-stepper-back a span::before {
|
|
margin-bottom: calc(-0.375em + 0px);
|
|
}
|
|
.gv-activated .gv-stepper .gv-stepper-back a span::after {
|
|
margin-top: calc(-0.3125em + 0px);
|
|
}
|
|
.gv-activated .gv-stepper .gv-stepper-back a span::before,
|
|
.gv-activated .gv-stepper .gv-stepper-back a span::after {
|
|
content: "";
|
|
display: block;
|
|
height: 0;
|
|
width: 0;
|
|
}
|
|
.gv-activated .gv-stepper .gv-stepper-collapsed {
|
|
align-items: center;
|
|
background-color: var(--color-surface-dim);
|
|
cursor: pointer;
|
|
display: flex;
|
|
flex: 1;
|
|
gap: var(--size-md);
|
|
padding: var(--size-md) var(--size-lg);
|
|
}
|
|
.gv-activated .gv-stepper .gv-stepper-collapsed .gv-step-label {
|
|
flex-grow: 1;
|
|
}
|
|
.gv-activated .gv-stepper .gv-stepper-progress {
|
|
background-color: var(--color-state-active);
|
|
color: var(--color-primary);
|
|
font-size: 12px;
|
|
font-weight: var(--font-weight-semibold);
|
|
letter-spacing: 0.048px;
|
|
line-height: var(--line-height-body);
|
|
align-items: center;
|
|
border-radius: 50%;
|
|
display: flex;
|
|
height: 32px;
|
|
justify-content: center;
|
|
position: relative;
|
|
width: 32px;
|
|
}
|
|
.gv-activated .gv-stepper .gv-stepper-progress gv-indicator {
|
|
height: 100%;
|
|
left: 0;
|
|
position: absolute;
|
|
top: 0;
|
|
transform: rotate(-90deg);
|
|
transform-origin: center;
|
|
width: 100%;
|
|
}
|
|
.gv-activated .gv-stepper .gv-stepper-progress .gv-circle-top {
|
|
transition: stroke-dashoffset 400ms ease-in-out;
|
|
}
|
|
.gv-activated .gv-stepper .gv-stepper-progress[data-progress-percent="20"] .gv-circle-top {
|
|
stroke-dasharray: 100.53096491;
|
|
stroke-dashoffset: 80.42477193;
|
|
}
|
|
.gv-activated .gv-stepper .gv-stepper-progress[data-progress-percent="40"] .gv-circle-top {
|
|
stroke-dasharray: 100.53096491;
|
|
stroke-dashoffset: 60.31857895;
|
|
}
|
|
.gv-activated .gv-stepper .gv-stepper-progress[data-progress-percent="60"] .gv-circle-top {
|
|
stroke-dasharray: 100.53096491;
|
|
stroke-dashoffset: 40.21238597;
|
|
}
|
|
.gv-activated .gv-stepper .gv-stepper-progress[data-progress-percent="80"] .gv-circle-top {
|
|
stroke-dasharray: 100.53096491;
|
|
stroke-dashoffset: 20.10619298;
|
|
}
|
|
.gv-activated .gv-stepper .gv-stepper-progress[data-progress-percent="100"] .gv-circle-top {
|
|
stroke-dasharray: 100.53096491;
|
|
stroke-dashoffset: 0;
|
|
}
|
|
.gv-activated .gv-stepper .gv-stepper-list {
|
|
align-items: center;
|
|
color: var(--color-body-on-alternative);
|
|
display: flex;
|
|
flex: 1;
|
|
flex-wrap: nowrap;
|
|
padding: 0;
|
|
}
|
|
.gv-activated .gv-stepper .gv-step {
|
|
align-items: center;
|
|
display: inline-flex;
|
|
flex: 1;
|
|
list-style: none;
|
|
position: relative;
|
|
}
|
|
.gv-activated .gv-stepper .gv-step.gv-step-last {
|
|
max-width: 20px;
|
|
}
|
|
.gv-activated .gv-stepper .gv-step.gv-step-last .gv-step-content {
|
|
align-items: flex-end;
|
|
}
|
|
.gv-activated .gv-stepper .gv-step .gv-step-line {
|
|
background-color: var(--color-border);
|
|
height: 1px;
|
|
left: 0;
|
|
position: absolute;
|
|
top: 10px;
|
|
width: 100%;
|
|
}
|
|
.gv-activated .gv-stepper .gv-step .gv-step-content {
|
|
cursor: default;
|
|
display: inline-flex;
|
|
gap: var(--size-sm);
|
|
flex-direction: column;
|
|
max-width: 100%;
|
|
position: relative;
|
|
z-index: 1;
|
|
}
|
|
.gv-activated .gv-stepper .gv-step .gv-step-type {
|
|
align-items: center;
|
|
background-color: var(--color-surface-muted);
|
|
border-radius: 50%;
|
|
display: flex;
|
|
flex-shrink: 0;
|
|
height: var(--size-stepper-dot);
|
|
justify-content: center;
|
|
width: var(--size-stepper-dot);
|
|
font-size: 10px;
|
|
font-weight: var(--font-weight-semibold);
|
|
letter-spacing: 0.04px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-stepper .gv-step .gv-step-type gv-icon {
|
|
color: var(--color-link);
|
|
display: none;
|
|
height: var(--size-icon-sm);
|
|
width: var(--size-icon-sm);
|
|
}
|
|
.gv-activated .gv-stepper .gv-step .gv-step-label {
|
|
white-space: nowrap;
|
|
/* Apply values to calculate em_based margins that work with any font size */
|
|
}
|
|
.gv-activated .gv-stepper .gv-step .gv-step-label::before {
|
|
margin-bottom: calc(-0.375em + 0px);
|
|
}
|
|
.gv-activated .gv-stepper .gv-step .gv-step-label::after {
|
|
margin-top: calc(-0.3125em + 0px);
|
|
}
|
|
.gv-activated .gv-stepper .gv-step .gv-step-label::before,
|
|
.gv-activated .gv-stepper .gv-step .gv-step-label::after {
|
|
content: "";
|
|
display: block;
|
|
height: 0;
|
|
width: 0;
|
|
}
|
|
.gv-activated .gv-stepper .gv-step.gv-step-current .gv-step-type {
|
|
background-color: var(--color-primary);
|
|
color: var(--color-button-fg-on);
|
|
}
|
|
.gv-activated .gv-stepper .gv-step.gv-step-done .gv-step-line {
|
|
background-color: var(--color-state-focus);
|
|
}
|
|
.gv-activated .gv-stepper .gv-step.gv-step-done .gv-step-type {
|
|
background-color: var(--color-state-active);
|
|
}
|
|
.gv-activated .gv-stepper .gv-step.gv-step-done .gv-step-type gv-icon {
|
|
display: block;
|
|
}
|
|
.gv-activated .gv-stepper .gv-step.gv-step-done .gv-step-type .gv-step-nr {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-stepper .gv-step.gv-step-done .gv-step-type,
|
|
.gv-activated .gv-stepper .gv-step.gv-step-done .gv-step-label {
|
|
cursor: pointer;
|
|
}
|
|
@media (max-width: 599px ) {
|
|
.gv-activated .gv-stepper {
|
|
--size-stepper-dot: 32px;
|
|
background-color: var(--color-overlay-dark);
|
|
padding: 0;
|
|
}
|
|
.gv-activated .gv-stepper .gv-stepper-back {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-stepper .gv-stepper-button-close {
|
|
cursor: pointer;
|
|
display: block;
|
|
}
|
|
.gv-activated .gv-stepper .gv-stepper-list {
|
|
align-items: flex-start;
|
|
background-color: var(--color-surface-dim);
|
|
display: none;
|
|
flex-direction: column;
|
|
padding: var(--size-md) var(--size-lg);
|
|
}
|
|
.gv-activated .gv-stepper .gv-step {
|
|
width: 100%;
|
|
}
|
|
.gv-activated .gv-stepper .gv-step:not(.gv-step-last) {
|
|
padding-bottom: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-stepper .gv-step.gv-step-last {
|
|
align-items: center;
|
|
max-width: none;
|
|
}
|
|
.gv-activated .gv-stepper .gv-step.gv-step-last .gv-step-content {
|
|
align-items: center;
|
|
}
|
|
.gv-activated .gv-stepper .gv-step .gv-step-line {
|
|
bottom: 0;
|
|
height: var(--size-lg);
|
|
left: calc(var(--size-stepper-dot) / 2);
|
|
width: 1px;
|
|
top: auto;
|
|
}
|
|
.gv-activated .gv-stepper .gv-step .gv-step-content {
|
|
align-items: center;
|
|
flex-direction: row;
|
|
flex-grow: 1;
|
|
}
|
|
.gv-activated .gv-stepper .gv-step .gv-step-type {
|
|
height: var(--size-stepper-dot);
|
|
width: var(--size-stepper-dot);
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-stepper .gv-step .gv-step-label {
|
|
flex-grow: 1;
|
|
}
|
|
.gv-activated .gv-stepper.gv-stepper-open {
|
|
bottom: 0;
|
|
left: 0;
|
|
position: fixed;
|
|
right: 0;
|
|
top: var(--navigation-bar-height);
|
|
z-index: 900;
|
|
}
|
|
.gv-activated .gv-stepper.gv-stepper-open .gv-stepper-collapsed {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-stepper.gv-stepper-open .gv-stepper-list {
|
|
display: flex;
|
|
}
|
|
}
|
|
@media (min-width: 600px ) {
|
|
.gv-activated .gv-stepper .gv-stepper-collapsed,
|
|
.gv-activated .gv-stepper .gv-stepper-button-close {
|
|
display: none;
|
|
}
|
|
}
|
|
@media (min-width: 600px ) and (max-width: 1279px ) {
|
|
.gv-activated .gv-stepper {
|
|
align-items: center;
|
|
}
|
|
.gv-activated .gv-stepper .gv-step {
|
|
align-items: center;
|
|
flex-direction: row;
|
|
}
|
|
.gv-activated .gv-stepper .gv-step .gv-step-line {
|
|
flex-grow: 1;
|
|
position: relative;
|
|
top: auto;
|
|
width: auto;
|
|
}
|
|
.gv-activated .gv-stepper .gv-step .gv-step-content {
|
|
align-items: center;
|
|
flex-direction: row;
|
|
}
|
|
.gv-activated .gv-stepper .gv-step.gv-step-last {
|
|
flex: 0 1 auto;
|
|
max-width: none;
|
|
}
|
|
.gv-activated .gv-stepper .gv-step.gv-step-last .gv-step-content {
|
|
align-items: center;
|
|
flex-direction: row-reverse;
|
|
}
|
|
.gv-activated .gv-stepper .gv-step.gv-step-last .gv-step-label {
|
|
padding-left: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-stepper .gv-step:not(.gv-step-last) .gv-step-label {
|
|
padding-right: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-stepper .gv-step:not(.gv-step-current) .gv-step-label {
|
|
display: none;
|
|
}
|
|
}
|
|
.gv-activated .gv-stepper-vertical {
|
|
align-items: flex-start;
|
|
color: var(--color-body-on-alternative);
|
|
counter-reset: list-number;
|
|
display: flex;
|
|
flex-direction: column;
|
|
position: relative;
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-stepper-vertical .gv-step {
|
|
align-items: flex-start;
|
|
display: inline-flex;
|
|
gap: var(--size-sm);
|
|
list-style: none;
|
|
position: relative;
|
|
width: 100%;
|
|
}
|
|
.gv-activated .gv-stepper-vertical .gv-step:not(:last-child) {
|
|
padding-bottom: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-stepper-vertical .gv-step:not(:last-child)::after {
|
|
background-color: var(--color-border);
|
|
bottom: 0;
|
|
content: "";
|
|
height: auto;
|
|
left: calc(var(--size-stepper-dot) / 2);
|
|
position: absolute;
|
|
top: 20px;
|
|
width: 1px;
|
|
}
|
|
.gv-activated .gv-stepper-vertical .gv-step::before {
|
|
align-items: center;
|
|
background-color: var(--color-primary);
|
|
border-radius: 50%;
|
|
color: var(--color-button-fg-on);
|
|
content: counter(list-number);
|
|
counter-increment: list-number;
|
|
display: flex;
|
|
flex-shrink: 0;
|
|
height: var(--size-stepper-dot);
|
|
justify-content: center;
|
|
padding-top: 1px;
|
|
width: var(--size-stepper-dot);
|
|
font-size: 10px;
|
|
font-weight: var(--font-weight-semibold);
|
|
letter-spacing: 0.04px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-sticky-bar .gv-stepper {
|
|
padding: 0;
|
|
align-items: center;
|
|
}
|
|
.gv-activated .gv-sticky-bar .gv-stepper .gv-step {
|
|
align-items: center;
|
|
flex-direction: row;
|
|
}
|
|
.gv-activated .gv-sticky-bar .gv-stepper .gv-step .gv-step-line {
|
|
flex-grow: 1;
|
|
position: relative;
|
|
top: auto;
|
|
width: auto;
|
|
}
|
|
.gv-activated .gv-sticky-bar .gv-stepper .gv-step .gv-step-content {
|
|
align-items: center;
|
|
flex-direction: row;
|
|
}
|
|
.gv-activated .gv-sticky-bar .gv-stepper .gv-step.gv-step-last {
|
|
flex: 0 1 auto;
|
|
max-width: none;
|
|
}
|
|
.gv-activated .gv-sticky-bar .gv-stepper .gv-step.gv-step-last .gv-step-content {
|
|
align-items: center;
|
|
flex-direction: row-reverse;
|
|
}
|
|
.gv-activated .gv-sticky-bar .gv-stepper .gv-step.gv-step-last .gv-step-label {
|
|
padding-left: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-sticky-bar .gv-stepper .gv-step:not(.gv-step-last) .gv-step-label {
|
|
padding-right: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-sticky-bar .gv-stepper .gv-step:not(.gv-step-current) .gv-step-label {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-sticky-bar {
|
|
display: none;
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-sticky-bar .gv-sticky-content {
|
|
padding-left: 24px;
|
|
padding-right: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-sticky-bar .gv-sticky-content {
|
|
padding-left: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
padding-right: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-sticky-bar .gv-sticky-content {
|
|
padding-left: 48px;
|
|
padding-right: 48px;
|
|
}
|
|
}
|
|
@media (min-width: 600px ) {
|
|
.gv-activated .gv-sticky-bar {
|
|
background-color: var(--color-surface-dim);
|
|
box-shadow: var(--color-shadow-elevated);
|
|
left: 0;
|
|
position: fixed;
|
|
top: var(--navigation-bar-height);
|
|
width: 100%;
|
|
z-index: 900;
|
|
}
|
|
.gv-activated .gv-sticky-bar.gv-sticky-visible {
|
|
display: block;
|
|
}
|
|
.gv-activated .gv-sticky-bar .gv-sticky-content {
|
|
padding-bottom: var(--size-md);
|
|
padding-top: var(--size-md);
|
|
width: 100%;
|
|
}
|
|
}
|
|
.gv-activated .gv-tab-list {
|
|
--tab-color-text: var(--color-body-on-alternative);
|
|
display: flex;
|
|
max-width: 100%;
|
|
border-bottom: var(--size-border) solid var(--color-border);
|
|
}
|
|
.gv-activated .gv-tab-list .gv-tab {
|
|
align-items: center;
|
|
background: none;
|
|
border: none;
|
|
color: var(--tab-color-text);
|
|
cursor: pointer;
|
|
display: flex;
|
|
flex: 0 1 auto;
|
|
flex-wrap: nowrap;
|
|
gap: 8px;
|
|
height: 54px;
|
|
margin-bottom: calc(var(--size-border) * -1);
|
|
min-width: 0;
|
|
padding: 0 24px;
|
|
text-decoration: none;
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-tab-list .gv-tab.gv-tab-active {
|
|
--tab-color-text: var(--color-body-on-default);
|
|
border-bottom: var(--size-border) solid var(--color-primary);
|
|
font-weight: var(--font-weight-semibold);
|
|
}
|
|
.gv-activated .gv-tab-list .gv-tab gv-icon {
|
|
flex-shrink: 0;
|
|
height: var(--size-icon-sm);
|
|
width: var(--size-icon-sm);
|
|
}
|
|
.gv-activated .gv-tab-list .gv-tab .gv-tab-content {
|
|
display: block;
|
|
flex-grow: 1;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
.gv-activated .gv-tab-list .gv-tab:hover .gv-tab-content {
|
|
color: var(--color-body-on-default);
|
|
}
|
|
.gv-activated .gv-tab-list .gv-tab .gv-tab-counter {
|
|
align-items: center;
|
|
background-color: var(--color-surface-muted);
|
|
border-radius: var(--border-radius);
|
|
color: var(--color-body-on-alternative);
|
|
display: flex;
|
|
flex-shrink: 0;
|
|
height: var(--size-lg);
|
|
justify-content: center;
|
|
width: var(--size-lg);
|
|
font-size: 12px;
|
|
font-weight: var(--font-weight-medium);
|
|
letter-spacing: 0.048px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
@media (max-width: 599px ) {
|
|
.gv-activated .gv-tab-select + .gv-tab-list {
|
|
display: none;
|
|
}
|
|
}
|
|
@media (min-width: 600px ) {
|
|
.gv-activated .gv-tab-select {
|
|
display: none;
|
|
}
|
|
}
|
|
.gv-activated .gv-tab-panel {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-tab-panel.gv-panel-active {
|
|
display: block;
|
|
}
|
|
.gv-activated .gv-rounded-tabs .gv-tab-bar {
|
|
align-items: center;
|
|
display: flex;
|
|
gap: var(--size-sm);
|
|
justify-content: space-between;
|
|
}
|
|
.gv-activated .gv-rounded-tabs .gv-tab-bar .gv-tab-list {
|
|
border: none;
|
|
flex: 0 1 auto;
|
|
gap: var(--size-xs);
|
|
min-width: 0;
|
|
}
|
|
.gv-activated .gv-rounded-tabs .gv-tab-bar .gv-tab-list .gv-tab {
|
|
border: var(--size-border) solid var(--color-border);
|
|
border-bottom: none;
|
|
border-top-left-radius: var(--border-radius);
|
|
border-top-right-radius: var(--border-radius);
|
|
}
|
|
.gv-activated .gv-rounded-tabs .gv-tab-bar .gv-tab-list .gv-tab.gv-tab-active {
|
|
background-color: var(--color-surface-bright);
|
|
border-bottom: none;
|
|
}
|
|
.gv-activated .gv-rounded-tabs .gv-tab-bar .gv-tabs-addon {
|
|
flex-shrink: 0;
|
|
padding: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-rounded-tabs .gv-tab-panel {
|
|
background: var(--color-surface-bright);
|
|
border: var(--size-border) solid var(--color-border);
|
|
border-radius: var(--border-radius);
|
|
padding: var(--size-md);
|
|
}
|
|
@media (max-width: 599px ) {
|
|
.gv-activated .gv-rounded-tabs .gv-tab-bar {
|
|
margin-bottom: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-rounded-tabs .gv-tab-bar .gv-tab-list {
|
|
display: none;
|
|
}
|
|
}
|
|
@media (min-width: 600px ) {
|
|
.gv-activated .gv-rounded-tabs .gv-tab-bar .gv-input-select {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-rounded-tabs .gv-tab-panel {
|
|
border-top-left-radius: 0;
|
|
}
|
|
}
|
|
.gv-activated gv-tile {
|
|
display: inline-block;
|
|
vertical-align: text-bottom;
|
|
font-size: 0;
|
|
height: var(--size-tile-sm);
|
|
width: var(--size-tile-sm);
|
|
}
|
|
.gv-activated gv-tile[size="md"] {
|
|
height: var(--size-tile-md);
|
|
width: var(--size-tile-md);
|
|
}
|
|
.gv-activated gv-tile[size="lg"] {
|
|
height: var(--size-tile-lg);
|
|
width: var(--size-tile-lg);
|
|
}
|
|
.gv-activated gv-tile[size="xl"] {
|
|
height: var(--size-tile-xl);
|
|
width: var(--size-tile-xl);
|
|
}
|
|
.gv-activated .gv-toast {
|
|
--toast-color-background: inherit;
|
|
--toast-color-text: var(--color-body-on-default);
|
|
align-items: center;
|
|
background: var(--toast-color-background);
|
|
border-radius: var(--notice-radius);
|
|
color: var(--toast-color-text);
|
|
display: flex;
|
|
flex-wrap: nowrap;
|
|
gap: var(--size-md);
|
|
max-width: 100%;
|
|
overflow: hidden;
|
|
padding: var(--size-sm) var(--size-lg);
|
|
position: relative;
|
|
width: 300px;
|
|
}
|
|
.gv-activated .gv-toast .gv-toast-content {
|
|
flex-grow: 1;
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-toast .gv-toast-content > *:not(:last-child) {
|
|
margin-bottom: var(--size-xs);
|
|
}
|
|
.gv-activated .gv-toast .gv-toast-title {
|
|
font-weight: var(--font-weight-semibold);
|
|
}
|
|
.gv-activated .gv-toast .gv-toast-close {
|
|
cursor: pointer;
|
|
padding: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-toast.gv-toast-alert {
|
|
--toast-color-background: var(--color-signal-alert-light);
|
|
}
|
|
.gv-activated .gv-toast.gv-toast-warning {
|
|
--toast-color-background: var(--color-signal-warning-light);
|
|
}
|
|
.gv-activated .gv-toast.gv-toast-success {
|
|
--toast-color-background: var(--color-signal-success-light);
|
|
}
|
|
.gv-activated .gv-toast.gv-toast-info {
|
|
--toast-color-background: var(--color-signal-info-light);
|
|
}
|
|
.gv-activated .gv-toast-container {
|
|
box-sizing: content-box;
|
|
display: flex;
|
|
flex-direction: column-reverse;
|
|
gap: var(--size-sm);
|
|
padding: var(--size-lg);
|
|
pointer-events: none;
|
|
position: fixed;
|
|
right: 0;
|
|
top: 0;
|
|
width: 300px;
|
|
z-index: 999999;
|
|
}
|
|
.gv-activated .gv-toast-container .gv-toast {
|
|
opacity: 0;
|
|
pointer-events: all;
|
|
transform: scale(0.7) translateY(-30px);
|
|
transition: all 0.25s;
|
|
}
|
|
.gv-activated .gv-toast-container .gv-toast + .gv-toast {
|
|
margin-bottom: -50px;
|
|
}
|
|
.gv-activated .gv-toast-container .gv-toast.gv-visible {
|
|
margin: 0 0 var(--size-xs);
|
|
opacity: 1;
|
|
transform: scale(1) translateY(0);
|
|
}
|
|
.gv-activated .gv-toast-container .gv-toast.gv-remove {
|
|
opacity: 0;
|
|
transform: scale(1) translateY(0) translateX(25px);
|
|
}
|
|
@media (max-width: 599px ) {
|
|
.gv-activated .gv-toast-container {
|
|
bottom: 0;
|
|
flex-direction: column;
|
|
max-width: 100%;
|
|
padding: var(--size-sm);
|
|
top: auto;
|
|
}
|
|
.gv-activated .gv-toast-container .gv-toast.gv-remove {
|
|
transform: scale(1) translateY(25px) translateX(0);
|
|
}
|
|
}
|
|
.gv-activated .gv-tooltip {
|
|
background: var(--color-surface-inverted);
|
|
border-radius: var(--border-radius);
|
|
color: var(--color-body-on-inverted);
|
|
max-width: 200px;
|
|
padding: var(--size-md);
|
|
position: fixed;
|
|
text-align: left;
|
|
z-index: 200;
|
|
font-size: 12px;
|
|
font-weight: var(--font-weight-medium);
|
|
letter-spacing: 0.048px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-tooltip::before {
|
|
background: var(--color-surface-inverted);
|
|
content: "";
|
|
-webkit-mask: url("../images/tooltip-arrow.svg") no-repeat 50% 50%;
|
|
mask: url("../images/tooltip-arrow.svg") no-repeat 50% 50%;
|
|
-webkit-mask-size: contain;
|
|
mask-size: contain;
|
|
position: absolute;
|
|
width: 17px;
|
|
height: 6px;
|
|
transform-origin: center;
|
|
z-index: -1;
|
|
}
|
|
.gv-activated .gv-tooltip[class*="gv-arrow-top"] {
|
|
margin-top: 6px;
|
|
}
|
|
.gv-activated .gv-tooltip[class*="gv-arrow-top"]::before {
|
|
top: -6px;
|
|
}
|
|
.gv-activated .gv-tooltip[class*="gv-arrow-bottom"] {
|
|
margin-bottom: 6px;
|
|
}
|
|
.gv-activated .gv-tooltip[class*="gv-arrow-bottom"]::before {
|
|
bottom: -6px;
|
|
transform: rotate(180deg);
|
|
}
|
|
.gv-activated .gv-tooltip.gv-arrow-bottom-left::before,
|
|
.gv-activated .gv-tooltip.gv-arrow-top-left::before {
|
|
left: 8px;
|
|
}
|
|
.gv-activated .gv-tooltip.gv-arrow-bottom-right::before,
|
|
.gv-activated .gv-tooltip.gv-arrow-top-right::before {
|
|
right: 8px;
|
|
}
|
|
.gv-activated .gv-tooltip.gv-arrow-bottom-center::before {
|
|
right: 50%;
|
|
transform: rotate(180deg) translateX(-50%);
|
|
}
|
|
.gv-activated .gv-tooltip.gv-arrow-top-center::before {
|
|
left: 50%;
|
|
transform: translateX(-50%);
|
|
}
|
|
.gv-activated .gv-tour {
|
|
background: var(--color-primary);
|
|
border-radius: var(--border-radius);
|
|
color: var(--color-button-fg-on);
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: var(--size-md);
|
|
padding: var(--size-lg);
|
|
position: relative;
|
|
width: 300px;
|
|
z-index: 200;
|
|
font-size: 12px;
|
|
font-weight: var(--font-weight-medium);
|
|
letter-spacing: 0.048px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-tour::before {
|
|
background: var(--color-primary);
|
|
content: "";
|
|
-webkit-mask: url("../images/tour-arrow.svg") no-repeat 50% 50%;
|
|
mask: url("../images/tour-arrow.svg") no-repeat 50% 50%;
|
|
-webkit-mask-size: contain;
|
|
mask-size: contain;
|
|
position: absolute;
|
|
width: 27px;
|
|
height: 11px;
|
|
transform-origin: center;
|
|
}
|
|
.gv-activated .gv-tour[class*="gv-arrow-top"] {
|
|
margin-top: 11px;
|
|
}
|
|
.gv-activated .gv-tour[class*="gv-arrow-top"]::before {
|
|
top: -11px;
|
|
}
|
|
.gv-activated .gv-tour[class*="gv-arrow-bottom"] {
|
|
margin-bottom: 11px;
|
|
}
|
|
.gv-activated .gv-tour[class*="gv-arrow-bottom"]::before {
|
|
bottom: -11px;
|
|
transform: rotate(180deg);
|
|
}
|
|
.gv-activated .gv-tour.gv-arrow-bottom-left::before,
|
|
.gv-activated .gv-tour.gv-arrow-top-left::before {
|
|
left: 24px;
|
|
}
|
|
.gv-activated .gv-tour.gv-arrow-bottom-right::before,
|
|
.gv-activated .gv-tour.gv-arrow-top-right::before {
|
|
right: 24px;
|
|
}
|
|
.gv-activated .gv-tour.gv-arrow-left {
|
|
margin-left: 11px;
|
|
}
|
|
.gv-activated .gv-tour.gv-arrow-left::before {
|
|
left: -19px;
|
|
top: 24px;
|
|
transform: rotate(270deg);
|
|
}
|
|
.gv-activated .gv-tour.gv-arrow-right {
|
|
margin-right: 11px;
|
|
}
|
|
.gv-activated .gv-tour.gv-arrow-right::before {
|
|
right: -19px;
|
|
top: 24px;
|
|
transform: rotate(90deg);
|
|
}
|
|
.gv-activated .gv-tour .gv-tour-steps {
|
|
display: flex;
|
|
gap: var(--size-xs);
|
|
font-size: 10px;
|
|
font-weight: var(--font-weight-medium);
|
|
letter-spacing: 0.04px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-tour .gv-tour-body {
|
|
padding-right: var(--size-icon-md);
|
|
font-size: 12px;
|
|
font-weight: var(--font-weight-medium);
|
|
letter-spacing: 0.048px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-tour .gv-tour-body > *:not(:last-child) {
|
|
margin-bottom: var(--size-xs);
|
|
}
|
|
.gv-activated .gv-tour .gv-tour-body .gv-tour-title {
|
|
font-weight: var(--font-weight-semibold);
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-tour .gv-button-group {
|
|
/* Form */
|
|
--form-element-height: 30px;
|
|
}
|
|
.gv-activated .gv-tour .gv-button-group .gv-button {
|
|
font-size: 12px;
|
|
font-weight: var(--font-weight-semibold);
|
|
letter-spacing: 0.048px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-tour .gv-button-group .gv-button-cancel {
|
|
color: var(--color-button-fg-on);
|
|
}
|
|
.gv-activated .gv-tour .gv-tour-close {
|
|
cursor: pointer;
|
|
padding: var(--size-sm);
|
|
position: absolute;
|
|
right: 12px;
|
|
top: 12px;
|
|
}
|
|
.gv-activated {
|
|
color: var(--color-body-on-default);
|
|
font-family: PlusJakartaSans, Arial, Verdana, sans-serif;
|
|
font-variant-ligatures: none;
|
|
font-weight: var(--font-weight-regular);
|
|
-webkit-font-smoothing: antialiased;
|
|
/* Headings */
|
|
/* Body text */
|
|
/* Captions */
|
|
/* Links */
|
|
/* Font-weight */
|
|
/* Text with icon */
|
|
/* Text width */
|
|
}
|
|
.gv-activated h1,
|
|
.gv-activated h2,
|
|
.gv-activated h3,
|
|
.gv-activated h4,
|
|
.gv-activated h5,
|
|
.gv-activated h6 {
|
|
margin: 0;
|
|
}
|
|
.gv-activated .gv-heading-xxxl {
|
|
font-weight: var(--font-weight-bold);
|
|
line-height: var(--line-height-heading);
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-heading-xxxl {
|
|
font-size: 26px;
|
|
letter-spacing: 0.065px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-heading-xxxl {
|
|
font-size: calc(26px + 34 * ((100vw - 360px ) / 1080 ));
|
|
letter-spacing: calc(0.065px + -0.065 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-heading-xxxl {
|
|
font-size: 60px;
|
|
letter-spacing: 0px;
|
|
}
|
|
}
|
|
.gv-activated h1,
|
|
.gv-activated .gv-heading-xxl {
|
|
font-weight: var(--font-weight-bold);
|
|
line-height: var(--line-height-heading);
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated h1,
|
|
.gv-activated .gv-heading-xxl {
|
|
font-size: 22px;
|
|
letter-spacing: 0.055px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated h1,
|
|
.gv-activated .gv-heading-xxl {
|
|
font-size: calc(22px + 26 * ((100vw - 360px ) / 1080 ));
|
|
letter-spacing: calc(0.055px + -0.055 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated h1,
|
|
.gv-activated .gv-heading-xxl {
|
|
font-size: 48px;
|
|
letter-spacing: 0px;
|
|
}
|
|
}
|
|
.gv-activated h2,
|
|
.gv-activated .gv-heading-xl {
|
|
font-weight: var(--font-weight-bold);
|
|
line-height: var(--line-height-heading);
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated h2,
|
|
.gv-activated .gv-heading-xl {
|
|
font-size: 18px;
|
|
letter-spacing: 0.045px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated h2,
|
|
.gv-activated .gv-heading-xl {
|
|
font-size: calc(18px + 22 * ((100vw - 360px ) / 1080 ));
|
|
letter-spacing: calc(0.045px + 0.055 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated h2,
|
|
.gv-activated .gv-heading-xl {
|
|
font-size: 40px;
|
|
letter-spacing: 0.1px;
|
|
}
|
|
}
|
|
.gv-activated h3,
|
|
.gv-activated .gv-heading-lg {
|
|
font-weight: var(--font-weight-bold);
|
|
line-height: var(--line-height-heading);
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated h3,
|
|
.gv-activated .gv-heading-lg {
|
|
font-size: 16px;
|
|
letter-spacing: 0px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated h3,
|
|
.gv-activated .gv-heading-lg {
|
|
font-size: calc(16px + 16 * ((100vw - 360px ) / 1080 ));
|
|
letter-spacing: calc(0px + 0.048 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated h3,
|
|
.gv-activated .gv-heading-lg {
|
|
font-size: 32px;
|
|
letter-spacing: 0.048px;
|
|
}
|
|
}
|
|
.gv-activated h4,
|
|
.gv-activated .gv-heading-md {
|
|
font-weight: var(--font-weight-bold);
|
|
line-height: var(--line-height-heading);
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated h4,
|
|
.gv-activated .gv-heading-md {
|
|
font-size: 16px;
|
|
letter-spacing: 0.048px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated h4,
|
|
.gv-activated .gv-heading-md {
|
|
font-size: calc(16px + 12 * ((100vw - 360px ) / 1080 ));
|
|
letter-spacing: calc(0.048px + -0.006 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated h4,
|
|
.gv-activated .gv-heading-md {
|
|
font-size: 28px;
|
|
letter-spacing: 0.042px;
|
|
}
|
|
}
|
|
.gv-activated h5,
|
|
.gv-activated .gv-heading-sm {
|
|
font-weight: var(--font-weight-bold);
|
|
line-height: var(--line-height-heading);
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated h5,
|
|
.gv-activated .gv-heading-sm {
|
|
font-size: 14px;
|
|
letter-spacing: 0.042px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated h5,
|
|
.gv-activated .gv-heading-sm {
|
|
font-size: calc(14px + 10 * ((100vw - 360px ) / 1080 ));
|
|
letter-spacing: calc(0.042px + -0.006 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated h5,
|
|
.gv-activated .gv-heading-sm {
|
|
font-size: 24px;
|
|
letter-spacing: 0.036px;
|
|
}
|
|
}
|
|
.gv-activated h6,
|
|
.gv-activated .gv-heading-xs {
|
|
font-weight: var(--font-weight-bold);
|
|
line-height: var(--line-height-heading);
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated h6,
|
|
.gv-activated .gv-heading-xs {
|
|
font-size: 14px;
|
|
letter-spacing: 0.042px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated h6,
|
|
.gv-activated .gv-heading-xs {
|
|
font-size: calc(14px + 6 * ((100vw - 360px ) / 1080 ));
|
|
letter-spacing: calc(0.042px + -0.012 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated h6,
|
|
.gv-activated .gv-heading-xs {
|
|
font-size: 20px;
|
|
letter-spacing: 0.03px;
|
|
}
|
|
}
|
|
.gv-activated p {
|
|
margin: 0;
|
|
}
|
|
.gv-activated .gv-text-xl {
|
|
letter-spacing: 0;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-text-xl {
|
|
font-size: 16px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-text-xl {
|
|
font-size: calc(16px + 8 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-text-xl {
|
|
font-size: 24px;
|
|
}
|
|
}
|
|
.gv-activated .gv-text-lg {
|
|
line-height: var(--line-height-body);
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-text-lg {
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-text-lg {
|
|
font-size: calc(14px + 4 * ((100vw - 360px ) / 1080 ));
|
|
letter-spacing: calc(0.035px + -0.035 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-text-lg {
|
|
font-size: 18px;
|
|
letter-spacing: 0px;
|
|
}
|
|
}
|
|
.gv-activated,
|
|
.gv-activated .gv-text-md {
|
|
line-height: var(--line-height-body);
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated,
|
|
.gv-activated .gv-text-md {
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated,
|
|
.gv-activated .gv-text-md {
|
|
font-size: calc(14px + 2 * ((100vw - 360px ) / 1080 ));
|
|
letter-spacing: calc(0.035px + 0.045 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated,
|
|
.gv-activated .gv-text-md {
|
|
font-size: 16px;
|
|
letter-spacing: 0.08px;
|
|
}
|
|
}
|
|
.gv-activated .gv-text-sm {
|
|
font-size: 14px;
|
|
letter-spacing: 0.035px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-caption-lg {
|
|
font-size: 12px;
|
|
font-weight: var(--font-weight-medium);
|
|
letter-spacing: 0.048px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated .gv-caption-sm {
|
|
font-size: 10px;
|
|
font-weight: var(--font-weight-medium);
|
|
letter-spacing: 0.04px;
|
|
line-height: var(--line-height-body);
|
|
}
|
|
.gv-activated a {
|
|
color: var(--color-link);
|
|
font-weight: var(--font-weight-regular);
|
|
text-decoration: underline;
|
|
}
|
|
.gv-activated a:hover {
|
|
color: var(--color-link);
|
|
}
|
|
.gv-activated b,
|
|
.gv-activated strong,
|
|
.gv-activated .gv-text-bold {
|
|
font-weight: var(--font-weight-semibold);
|
|
}
|
|
.gv-activated .gv-text-icon {
|
|
display: inline-flex;
|
|
gap: 4px;
|
|
}
|
|
.gv-activated .gv-text-icon gv-icon {
|
|
flex-shrink: 0;
|
|
}
|
|
.gv-activated .gv-text-max {
|
|
max-width: 700px;
|
|
}
|
|
/* Utility classes */
|
|
/* Utility mixins */
|
|
/* Flex layout */
|
|
.gv-flex-row-sm {
|
|
display: flex;
|
|
flex-direction: row;
|
|
gap: 8px;
|
|
}
|
|
.gv-flex-row-md {
|
|
display: flex;
|
|
flex-direction: row;
|
|
gap: 16px;
|
|
}
|
|
.gv-flex-row-lg {
|
|
display: flex;
|
|
flex-direction: row;
|
|
gap: 24px;
|
|
}
|
|
.gv-flex-column-sm {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 8px;
|
|
}
|
|
.gv-flex-column-md {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 16px;
|
|
}
|
|
.gv-flex-column-lg {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 24px;
|
|
}
|
|
.gv-activated {
|
|
/* Accessibility */
|
|
/* Background */
|
|
/* Border */
|
|
/* Flexbox */
|
|
/* Gap */
|
|
/* Overflow */
|
|
/* Position */
|
|
/* Shadow */
|
|
/* Sizing */
|
|
/* Text */
|
|
/* Spacing */
|
|
/* Fluid default */
|
|
/* Fluid sections */
|
|
/* Fluid default */
|
|
/* Fluid sections */
|
|
/* Breakpoint classes */
|
|
/* Flexbox and grid */
|
|
/* Hide */
|
|
/* Spacing */
|
|
/* Text */
|
|
/* Deprecated - Margins and paddings */
|
|
}
|
|
.gv-activated .gv-sr-only {
|
|
position: absolute;
|
|
width: 1px;
|
|
height: 1px;
|
|
padding: 0;
|
|
margin: -1px;
|
|
overflow: hidden;
|
|
clip: rect(0, 0, 0, 0);
|
|
white-space: nowrap;
|
|
border-width: 0;
|
|
}
|
|
.gv-activated .gv-surface-bright {
|
|
background-color: var(--color-surface-bright);
|
|
}
|
|
.gv-activated .gv-surface-dim {
|
|
background-color: var(--color-surface-dim);
|
|
}
|
|
.gv-activated .gv-surface-muted {
|
|
background-color: var(--color-surface-muted);
|
|
}
|
|
.gv-activated .gv-surface-form {
|
|
background-color: var(--color-surface-form);
|
|
}
|
|
.gv-activated .gv-surface-highlight {
|
|
background-color: var(--color-surface-highlight);
|
|
}
|
|
.gv-activated .gv-border {
|
|
border: 1px solid var(--color-border);
|
|
}
|
|
.gv-activated .gv-border-t {
|
|
border-top: 1px solid var(--color-border);
|
|
}
|
|
.gv-activated .gv-border-b {
|
|
border-bottom: 1px solid var(--color-border);
|
|
}
|
|
.gv-activated .gv-border-l {
|
|
border-left: 1px solid var(--color-border);
|
|
}
|
|
.gv-activated .gv-border-r {
|
|
border-right: 1px solid var(--color-border);
|
|
}
|
|
.gv-activated .gv-border-alt {
|
|
border: 1px solid var(--color-border-alt);
|
|
}
|
|
.gv-activated .gv-border-alt-t {
|
|
border-top: 1px solid var(--color-border-alt);
|
|
}
|
|
.gv-activated .gv-border-alt-b {
|
|
border-bottom: 1px solid var(--color-border-alt);
|
|
}
|
|
.gv-activated .gv-border-alt-l {
|
|
border-left: 1px solid var(--color-border-alt);
|
|
}
|
|
.gv-activated .gv-border-alt-r {
|
|
border-right: 1px solid var(--color-border-alt);
|
|
}
|
|
.gv-activated .gv-border-form {
|
|
border: 1px solid var(--color-border-form);
|
|
}
|
|
.gv-activated .gv-radius {
|
|
border-radius: var(--border-radius);
|
|
}
|
|
.gv-activated .gv-radius-0 {
|
|
border-radius: 0 !important;
|
|
}
|
|
.gv-activated .gv-flex {
|
|
display: flex;
|
|
}
|
|
.gv-activated .gv-inline-flex {
|
|
display: inline-flex;
|
|
}
|
|
.gv-activated .gv-flex-1 {
|
|
flex: 1 1 0;
|
|
}
|
|
.gv-activated .gv-flex-auto {
|
|
flex: 1 1 auto;
|
|
}
|
|
.gv-activated .gv-flex-none {
|
|
flex: none;
|
|
}
|
|
.gv-activated .gv-flex-shrink {
|
|
flex-shrink: 1;
|
|
}
|
|
.gv-activated .gv-flex-shrink-0 {
|
|
flex-shrink: 0;
|
|
}
|
|
.gv-activated .gv-flex-grow {
|
|
flex-grow: 1;
|
|
}
|
|
.gv-activated .gv-flex-grow-0 {
|
|
flex-grow: 0;
|
|
}
|
|
.gv-activated .gv-flex-wrap {
|
|
flex-wrap: wrap;
|
|
}
|
|
.gv-activated .gv-flex-nowrap {
|
|
flex-wrap: nowrap;
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-gap-fluid {
|
|
gap: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-gap-fluid {
|
|
gap: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-gap-fluid {
|
|
gap: 48px;
|
|
}
|
|
}
|
|
.gv-activated .gv-overflow-auto {
|
|
overflow: auto;
|
|
}
|
|
.gv-activated .gv-overflow-x-auto {
|
|
overflow-x: auto;
|
|
}
|
|
.gv-activated .gv-overflow-y-auto {
|
|
overflow-y: auto;
|
|
}
|
|
.gv-activated .gv-overflow-hidden {
|
|
overflow: hidden;
|
|
}
|
|
.gv-activated .gv-overflow-x-hidden {
|
|
overflow-x: hidden;
|
|
}
|
|
.gv-activated .gv-overflow-y-hidden {
|
|
overflow-y: hidden;
|
|
}
|
|
.gv-activated .gv-overflow-scroll {
|
|
overflow: scroll;
|
|
}
|
|
.gv-activated .gv-overflow-x-scroll {
|
|
overflow-x: scroll;
|
|
}
|
|
.gv-activated .gv-overflow-y-scroll {
|
|
overflow-y: scroll;
|
|
}
|
|
.gv-activated .gv-pos-fixed {
|
|
position: fixed;
|
|
}
|
|
.gv-activated .gv-pos-absolute {
|
|
position: absolute;
|
|
}
|
|
.gv-activated .gv-pos-relative {
|
|
position: relative;
|
|
}
|
|
.gv-activated .gv-pos-sticky {
|
|
position: sticky;
|
|
}
|
|
.gv-activated .gv-pos-bottom {
|
|
bottom: 0;
|
|
}
|
|
.gv-activated .gv-pos-left {
|
|
left: 0;
|
|
}
|
|
.gv-activated .gv-pos-right {
|
|
right: 0;
|
|
}
|
|
.gv-activated .gv-pos-top {
|
|
top: 0;
|
|
}
|
|
.gv-activated .gv-shadow-subtle {
|
|
box-shadow: var(--color-shadow-subtle);
|
|
}
|
|
.gv-activated .gv-shadow-elevated {
|
|
box-shadow: var(--color-shadow-elevated);
|
|
}
|
|
.gv-activated .gv-h-full {
|
|
height: 100%;
|
|
}
|
|
.gv-activated .gv-w-auto {
|
|
width: auto;
|
|
}
|
|
.gv-activated .gv-w-full {
|
|
width: 100%;
|
|
}
|
|
.gv-activated .gv-w-max-container {
|
|
max-width: 1536px;
|
|
}
|
|
.gv-activated .gv-text-on-default {
|
|
color: var(--color-body-on-default);
|
|
}
|
|
.gv-activated .gv-text-on-alternative {
|
|
color: var(--color-body-on-alternative);
|
|
}
|
|
.gv-activated .gv-text-on-inverted {
|
|
color: var(--color-body-on-inverted);
|
|
}
|
|
.gv-activated .gv-text-primary {
|
|
color: var(--color-primary);
|
|
}
|
|
.gv-activated .gv-text-secondary {
|
|
color: var(--color-secondary);
|
|
}
|
|
.gv-activated .gv-text-uppercase {
|
|
text-transform: uppercase;
|
|
}
|
|
.gv-activated .gv-text-capitalize {
|
|
text-transform: capitalize;
|
|
}
|
|
.gv-activated .gv-text-truncate {
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
.gv-activated .gv-white-space-nowrap {
|
|
white-space: nowrap;
|
|
}
|
|
.gv-activated .gv-break-word {
|
|
overflow-wrap: break-word;
|
|
}
|
|
.gv-activated .gv-break-all {
|
|
word-break: break-all;
|
|
}
|
|
.gv-activated .gv-text-trim {
|
|
/* Apply values to calculate em_based margins that work with any font size */
|
|
}
|
|
.gv-activated .gv-text-trim::before {
|
|
margin-bottom: calc(-0.375em + 0px);
|
|
}
|
|
.gv-activated .gv-text-trim::after {
|
|
margin-top: calc(-0.3125em + 0px);
|
|
}
|
|
.gv-activated .gv-text-trim::before,
|
|
.gv-activated .gv-text-trim::after {
|
|
content: "";
|
|
display: block;
|
|
height: 0;
|
|
width: 0;
|
|
}
|
|
.gv-activated.gv-pt-nav,
|
|
.gv-activated .gv-pt-nav {
|
|
padding-top: var(--navigation-bar-height);
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-m-fluid {
|
|
margin: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-m-fluid {
|
|
margin: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-m-fluid {
|
|
margin: 48px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-mt-fluid {
|
|
margin-top: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-mt-fluid {
|
|
margin-top: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-mt-fluid {
|
|
margin-top: 48px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-mb-fluid {
|
|
margin-bottom: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-mb-fluid {
|
|
margin-bottom: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-mb-fluid {
|
|
margin-bottom: 48px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-ml-fluid {
|
|
margin-left: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-ml-fluid {
|
|
margin-left: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-ml-fluid {
|
|
margin-left: 48px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-mr-fluid {
|
|
margin-right: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-mr-fluid {
|
|
margin-right: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-mr-fluid {
|
|
margin-right: 48px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-mx-fluid {
|
|
margin-left: 24px;
|
|
margin-right: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-mx-fluid {
|
|
margin-left: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
margin-right: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-mx-fluid {
|
|
margin-left: 48px;
|
|
margin-right: 48px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-my-fluid {
|
|
margin-top: 24px;
|
|
margin-bottom: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-my-fluid {
|
|
margin-top: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
margin-bottom: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-my-fluid {
|
|
margin-top: 48px;
|
|
margin-bottom: 48px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-m-section {
|
|
margin-left: 24px;
|
|
margin-right: 24px;
|
|
margin-top: 48px;
|
|
margin-bottom: 48px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-m-section {
|
|
margin-left: calc(24px + 136 * ((100vw - 360px ) / 1080 ));
|
|
margin-right: calc(24px + 136 * ((100vw - 360px ) / 1080 ));
|
|
margin-top: calc(48px + 48 * ((100vw - 360px ) / 1080 ));
|
|
margin-bottom: calc(48px + 48 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-m-section {
|
|
margin-left: 160px;
|
|
margin-right: 160px;
|
|
margin-top: 96px;
|
|
margin-bottom: 96px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-mt-section {
|
|
margin-top: 48px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-mt-section {
|
|
margin-top: calc(48px + 48 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-mt-section {
|
|
margin-top: 96px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-mb-section {
|
|
margin-bottom: 48px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-mb-section {
|
|
margin-bottom: calc(48px + 48 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-mb-section {
|
|
margin-bottom: 96px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-ml-section {
|
|
margin-left: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-ml-section {
|
|
margin-left: calc(24px + 136 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-ml-section {
|
|
margin-left: 160px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-mr-section {
|
|
margin-right: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-mr-section {
|
|
margin-right: calc(24px + 136 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-mr-section {
|
|
margin-right: 160px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-mx-section {
|
|
margin-left: 24px;
|
|
margin-right: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-mx-section {
|
|
margin-left: calc(24px + 136 * ((100vw - 360px ) / 1080 ));
|
|
margin-right: calc(24px + 136 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-mx-section {
|
|
margin-left: 160px;
|
|
margin-right: 160px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-my-section {
|
|
margin-top: 48px;
|
|
margin-bottom: 48px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-my-section {
|
|
margin-top: calc(48px + 48 * ((100vw - 360px ) / 1080 ));
|
|
margin-bottom: calc(48px + 48 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-my-section {
|
|
margin-top: 96px;
|
|
margin-bottom: 96px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-p-fluid {
|
|
padding: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-p-fluid {
|
|
padding: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-p-fluid {
|
|
padding: 48px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-pt-fluid {
|
|
padding-top: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-pt-fluid {
|
|
padding-top: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-pt-fluid {
|
|
padding-top: 48px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-pb-fluid {
|
|
padding-bottom: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-pb-fluid {
|
|
padding-bottom: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-pb-fluid {
|
|
padding-bottom: 48px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-pl-fluid {
|
|
padding-left: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-pl-fluid {
|
|
padding-left: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-pl-fluid {
|
|
padding-left: 48px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-pr-fluid {
|
|
padding-right: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-pr-fluid {
|
|
padding-right: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-pr-fluid {
|
|
padding-right: 48px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-px-fluid {
|
|
padding-left: 24px;
|
|
padding-right: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-px-fluid {
|
|
padding-left: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
padding-right: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-px-fluid {
|
|
padding-left: 48px;
|
|
padding-right: 48px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-py-fluid {
|
|
padding-top: 24px;
|
|
padding-bottom: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-py-fluid {
|
|
padding-top: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
padding-bottom: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-py-fluid {
|
|
padding-top: 48px;
|
|
padding-bottom: 48px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-p-section {
|
|
padding-left: 24px;
|
|
padding-right: 24px;
|
|
padding-top: 48px;
|
|
padding-bottom: 48px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-p-section {
|
|
padding-left: calc(24px + 136 * ((100vw - 360px ) / 1080 ));
|
|
padding-right: calc(24px + 136 * ((100vw - 360px ) / 1080 ));
|
|
padding-top: calc(48px + 48 * ((100vw - 360px ) / 1080 ));
|
|
padding-bottom: calc(48px + 48 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-p-section {
|
|
padding-left: 160px;
|
|
padding-right: 160px;
|
|
padding-top: 96px;
|
|
padding-bottom: 96px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-pt-section {
|
|
padding-top: 48px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-pt-section {
|
|
padding-top: calc(48px + 48 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-pt-section {
|
|
padding-top: 96px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-pb-section {
|
|
padding-bottom: 48px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-pb-section {
|
|
padding-bottom: calc(48px + 48 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-pb-section {
|
|
padding-bottom: 96px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-pl-section {
|
|
padding-left: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-pl-section {
|
|
padding-left: calc(24px + 136 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-pl-section {
|
|
padding-left: 160px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-pr-section {
|
|
padding-right: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-pr-section {
|
|
padding-right: calc(24px + 136 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-pr-section {
|
|
padding-right: 160px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-px-section {
|
|
padding-left: 24px;
|
|
padding-right: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-px-section {
|
|
padding-left: calc(24px + 136 * ((100vw - 360px ) / 1080 ));
|
|
padding-right: calc(24px + 136 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-px-section {
|
|
padding-left: 160px;
|
|
padding-right: 160px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-py-section {
|
|
padding-top: 48px;
|
|
padding-bottom: 48px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-py-section {
|
|
padding-top: calc(48px + 48 * ((100vw - 360px ) / 1080 ));
|
|
padding-bottom: calc(48px + 48 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-py-section {
|
|
padding-top: 96px;
|
|
padding-bottom: 96px;
|
|
}
|
|
}
|
|
.gv-activated .gv-flex-row {
|
|
flex-direction: row;
|
|
}
|
|
.gv-activated .gv-flex-row-reverse {
|
|
flex-direction: row-reverse;
|
|
}
|
|
.gv-activated .gv-flex-col {
|
|
flex-direction: column;
|
|
}
|
|
.gv-activated .gv-flex-col-reverse {
|
|
flex-direction: column-reverse;
|
|
}
|
|
.gv-activated .gv-content-center {
|
|
align-content: center;
|
|
}
|
|
.gv-activated .gv-items-start {
|
|
align-items: flex-start;
|
|
}
|
|
.gv-activated .gv-items-end {
|
|
align-items: flex-end;
|
|
}
|
|
.gv-activated .gv-items-center {
|
|
align-items: center;
|
|
}
|
|
.gv-activated .gv-items-baseline {
|
|
align-items: baseline;
|
|
}
|
|
.gv-activated .gv-items-stretch {
|
|
align-items: stretch;
|
|
}
|
|
.gv-activated .gv-justify-start {
|
|
justify-content: flex-start;
|
|
}
|
|
.gv-activated .gv-justify-end {
|
|
justify-content: flex-end;
|
|
}
|
|
.gv-activated .gv-justify-center {
|
|
justify-content: center;
|
|
}
|
|
.gv-activated .gv-justify-between {
|
|
justify-content: space-between;
|
|
}
|
|
.gv-activated .gv-justify-around {
|
|
justify-content: space-around;
|
|
}
|
|
.gv-activated .gv-justify-evenly {
|
|
justify-content: space-evenly;
|
|
}
|
|
.gv-activated .gv-order-first {
|
|
order: -1;
|
|
}
|
|
.gv-activated .gv-order-last {
|
|
order: 99;
|
|
}
|
|
.gv-activated .gv-gap-sm {
|
|
gap: 8px;
|
|
}
|
|
.gv-activated .gv-gap-md {
|
|
gap: 16px;
|
|
}
|
|
.gv-activated .gv-gap-lg {
|
|
gap: 24px;
|
|
}
|
|
.gv-activated .gv-gap-0 {
|
|
gap: 0 !important;
|
|
}
|
|
.gv-activated .gv-flex {
|
|
display: flex;
|
|
}
|
|
.gv-activated .gv-block {
|
|
display: block;
|
|
}
|
|
.gv-activated .gv-inline {
|
|
display: inline;
|
|
}
|
|
.gv-activated .gv-inline-block {
|
|
display: inline-block;
|
|
}
|
|
.gv-activated .gv-hidden {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-invisible {
|
|
visibility: hidden;
|
|
}
|
|
.gv-activated .gv-collapse {
|
|
visibility: collapse;
|
|
}
|
|
.gv-activated .gv-m-0 {
|
|
margin: 0 !important;
|
|
}
|
|
.gv-activated .gv-mt-0 {
|
|
margin-top: 0 !important;
|
|
}
|
|
.gv-activated .gv-mb-0 {
|
|
margin-bottom: 0 !important;
|
|
}
|
|
.gv-activated .gv-ml-0 {
|
|
margin-left: 0 !important;
|
|
}
|
|
.gv-activated .gv-mr-0 {
|
|
margin-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-mx-0 {
|
|
margin-left: 0 !important;
|
|
margin-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-my-0 {
|
|
margin-left: 0 !important;
|
|
margin-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-m-sm {
|
|
margin: 8px;
|
|
}
|
|
.gv-activated .gv-mt-sm {
|
|
margin-top: 8px;
|
|
}
|
|
.gv-activated .gv-mb-sm {
|
|
margin-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-ml-sm {
|
|
margin-left: 8px;
|
|
}
|
|
.gv-activated .gv-mr-sm {
|
|
margin-right: 8px;
|
|
}
|
|
.gv-activated .gv-mx-sm {
|
|
margin-left: 8px;
|
|
margin-right: 8px;
|
|
}
|
|
.gv-activated .gv-my-sm {
|
|
margin-top: 8px;
|
|
margin-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-m-md {
|
|
margin: 16px;
|
|
}
|
|
.gv-activated .gv-mt-md {
|
|
margin-top: 16px;
|
|
}
|
|
.gv-activated .gv-mb-md {
|
|
margin-bottom: 16px;
|
|
}
|
|
.gv-activated .gv-ml-md {
|
|
margin-left: 16px;
|
|
}
|
|
.gv-activated .gv-mr-md {
|
|
margin-right: 16px;
|
|
}
|
|
.gv-activated .gv-mx-md {
|
|
margin-left: 16px;
|
|
margin-right: 16px;
|
|
}
|
|
.gv-activated .gv-my-md {
|
|
margin-top: 16px;
|
|
margin-bottom: 16px;
|
|
}
|
|
.gv-activated .gv-m-lg {
|
|
margin: 24px;
|
|
}
|
|
.gv-activated .gv-mt-lg {
|
|
margin-top: 24px;
|
|
}
|
|
.gv-activated .gv-mb-lg {
|
|
margin-bottom: 24px;
|
|
}
|
|
.gv-activated .gv-ml-lg {
|
|
margin-left: 24px;
|
|
}
|
|
.gv-activated .gv-mr-lg {
|
|
margin-right: 24px;
|
|
}
|
|
.gv-activated .gv-mx-lg {
|
|
margin-left: 24px;
|
|
margin-right: 24px;
|
|
}
|
|
.gv-activated .gv-my-lg {
|
|
margin-top: 24px;
|
|
margin-bottom: 24px;
|
|
}
|
|
.gv-activated .gv-m-auto {
|
|
margin: auto;
|
|
}
|
|
.gv-activated .gv-mt-auto {
|
|
margin-top: auto;
|
|
}
|
|
.gv-activated .gv-mb-auto {
|
|
margin-bottom: auto;
|
|
}
|
|
.gv-activated .gv-ml-auto {
|
|
margin-left: auto;
|
|
}
|
|
.gv-activated .gv-mr-auto {
|
|
margin-right: auto;
|
|
}
|
|
.gv-activated .gv-mx-auto {
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
.gv-activated .gv-my-auto {
|
|
margin-top: auto;
|
|
margin-bottom: auto;
|
|
}
|
|
.gv-activated .gv-p-0 {
|
|
padding: 0 !important;
|
|
}
|
|
.gv-activated .gv-pt-0 {
|
|
padding-top: 0 !important;
|
|
}
|
|
.gv-activated .gv-pb-0 {
|
|
padding-bottom: 0 !important;
|
|
}
|
|
.gv-activated .gv-pl-0 {
|
|
padding-left: 0 !important;
|
|
}
|
|
.gv-activated .gv-pr-0 {
|
|
padding-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-px-0 {
|
|
padding-left: 0 !important;
|
|
padding-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-py-0 {
|
|
padding-left: 0 !important;
|
|
padding-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-p-sm {
|
|
padding: 8px;
|
|
}
|
|
.gv-activated .gv-pt-sm {
|
|
padding-top: 8px;
|
|
}
|
|
.gv-activated .gv-pb-sm {
|
|
padding-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-pl-sm {
|
|
padding-left: 8px;
|
|
}
|
|
.gv-activated .gv-pr-sm {
|
|
padding-right: 8px;
|
|
}
|
|
.gv-activated .gv-px-sm {
|
|
padding-left: 8px;
|
|
padding-right: 8px;
|
|
}
|
|
.gv-activated .gv-py-sm {
|
|
padding-top: 8px;
|
|
padding-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-p-md {
|
|
padding: 16px;
|
|
}
|
|
.gv-activated .gv-pt-md {
|
|
padding-top: 16px;
|
|
}
|
|
.gv-activated .gv-pb-md {
|
|
padding-bottom: 16px;
|
|
}
|
|
.gv-activated .gv-pl-md {
|
|
padding-left: 16px;
|
|
}
|
|
.gv-activated .gv-pr-md {
|
|
padding-right: 16px;
|
|
}
|
|
.gv-activated .gv-px-md {
|
|
padding-left: 16px;
|
|
padding-right: 16px;
|
|
}
|
|
.gv-activated .gv-py-md {
|
|
padding-top: 16px;
|
|
padding-bottom: 16px;
|
|
}
|
|
.gv-activated .gv-p-lg {
|
|
padding: 24px;
|
|
}
|
|
.gv-activated .gv-pt-lg {
|
|
padding-top: 24px;
|
|
}
|
|
.gv-activated .gv-pb-lg {
|
|
padding-bottom: 24px;
|
|
}
|
|
.gv-activated .gv-pl-lg {
|
|
padding-left: 24px;
|
|
}
|
|
.gv-activated .gv-pr-lg {
|
|
padding-right: 24px;
|
|
}
|
|
.gv-activated .gv-px-lg {
|
|
padding-left: 24px;
|
|
padding-right: 24px;
|
|
}
|
|
.gv-activated .gv-py-lg {
|
|
padding-top: 24px;
|
|
padding-bottom: 24px;
|
|
}
|
|
.gv-activated .gv-stack-space-sm > *:not(:last-child) {
|
|
margin-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-stack-space-md > *:not(:last-child) {
|
|
margin-bottom: 16px;
|
|
}
|
|
.gv-activated .gv-stack-space-lg > *:not(:last-child) {
|
|
margin-bottom: 24px;
|
|
}
|
|
.gv-activated .gv-text-left {
|
|
text-align: left;
|
|
}
|
|
.gv-activated .gv-text-center {
|
|
text-align: center;
|
|
}
|
|
.gv-activated .gv-text-right {
|
|
text-align: right;
|
|
}
|
|
@media (max-width: 599px ) {
|
|
.gv-activated {
|
|
/* Flexbox and grid */
|
|
/* Hide */
|
|
/* Spacing */
|
|
/* Text */
|
|
}
|
|
.gv-activated .gv-max-mob-flex-row {
|
|
flex-direction: row;
|
|
}
|
|
.gv-activated .gv-max-mob-flex-row-reverse {
|
|
flex-direction: row-reverse;
|
|
}
|
|
.gv-activated .gv-max-mob-flex-col {
|
|
flex-direction: column;
|
|
}
|
|
.gv-activated .gv-max-mob-flex-col-reverse {
|
|
flex-direction: column-reverse;
|
|
}
|
|
.gv-activated .gv-max-mob-content-center {
|
|
align-content: center;
|
|
}
|
|
.gv-activated .gv-max-mob-items-start {
|
|
align-items: flex-start;
|
|
}
|
|
.gv-activated .gv-max-mob-items-end {
|
|
align-items: flex-end;
|
|
}
|
|
.gv-activated .gv-max-mob-items-center {
|
|
align-items: center;
|
|
}
|
|
.gv-activated .gv-max-mob-items-baseline {
|
|
align-items: baseline;
|
|
}
|
|
.gv-activated .gv-max-mob-items-stretch {
|
|
align-items: stretch;
|
|
}
|
|
.gv-activated .gv-max-mob-justify-start {
|
|
justify-content: flex-start;
|
|
}
|
|
.gv-activated .gv-max-mob-justify-end {
|
|
justify-content: flex-end;
|
|
}
|
|
.gv-activated .gv-max-mob-justify-center {
|
|
justify-content: center;
|
|
}
|
|
.gv-activated .gv-max-mob-justify-between {
|
|
justify-content: space-between;
|
|
}
|
|
.gv-activated .gv-max-mob-justify-around {
|
|
justify-content: space-around;
|
|
}
|
|
.gv-activated .gv-max-mob-justify-evenly {
|
|
justify-content: space-evenly;
|
|
}
|
|
.gv-activated .gv-max-mob-order-first {
|
|
order: -1;
|
|
}
|
|
.gv-activated .gv-max-mob-order-last {
|
|
order: 99;
|
|
}
|
|
.gv-activated .gv-max-mob-gap-sm {
|
|
gap: 8px;
|
|
}
|
|
.gv-activated .gv-max-mob-gap-md {
|
|
gap: 16px;
|
|
}
|
|
.gv-activated .gv-max-mob-gap-lg {
|
|
gap: 24px;
|
|
}
|
|
.gv-activated .gv-max-mob-gap-0 {
|
|
gap: 0 !important;
|
|
}
|
|
.gv-activated .gv-max-mob-flex {
|
|
display: flex;
|
|
}
|
|
.gv-activated .gv-max-mob-block {
|
|
display: block;
|
|
}
|
|
.gv-activated .gv-max-mob-inline {
|
|
display: inline;
|
|
}
|
|
.gv-activated .gv-max-mob-inline-block {
|
|
display: inline-block;
|
|
}
|
|
.gv-activated .gv-max-mob-hidden {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-max-mob-invisible {
|
|
visibility: hidden;
|
|
}
|
|
.gv-activated .gv-max-mob-collapse {
|
|
visibility: collapse;
|
|
}
|
|
.gv-activated .gv-max-mob-m-0 {
|
|
margin: 0 !important;
|
|
}
|
|
.gv-activated .gv-max-mob-mt-0 {
|
|
margin-top: 0 !important;
|
|
}
|
|
.gv-activated .gv-max-mob-mb-0 {
|
|
margin-bottom: 0 !important;
|
|
}
|
|
.gv-activated .gv-max-mob-ml-0 {
|
|
margin-left: 0 !important;
|
|
}
|
|
.gv-activated .gv-max-mob-mr-0 {
|
|
margin-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-max-mob-mx-0 {
|
|
margin-left: 0 !important;
|
|
margin-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-max-mob-my-0 {
|
|
margin-left: 0 !important;
|
|
margin-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-max-mob-m-sm {
|
|
margin: 8px;
|
|
}
|
|
.gv-activated .gv-max-mob-mt-sm {
|
|
margin-top: 8px;
|
|
}
|
|
.gv-activated .gv-max-mob-mb-sm {
|
|
margin-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-max-mob-ml-sm {
|
|
margin-left: 8px;
|
|
}
|
|
.gv-activated .gv-max-mob-mr-sm {
|
|
margin-right: 8px;
|
|
}
|
|
.gv-activated .gv-max-mob-mx-sm {
|
|
margin-left: 8px;
|
|
margin-right: 8px;
|
|
}
|
|
.gv-activated .gv-max-mob-my-sm {
|
|
margin-top: 8px;
|
|
margin-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-max-mob-m-md {
|
|
margin: 16px;
|
|
}
|
|
.gv-activated .gv-max-mob-mt-md {
|
|
margin-top: 16px;
|
|
}
|
|
.gv-activated .gv-max-mob-mb-md {
|
|
margin-bottom: 16px;
|
|
}
|
|
.gv-activated .gv-max-mob-ml-md {
|
|
margin-left: 16px;
|
|
}
|
|
.gv-activated .gv-max-mob-mr-md {
|
|
margin-right: 16px;
|
|
}
|
|
.gv-activated .gv-max-mob-mx-md {
|
|
margin-left: 16px;
|
|
margin-right: 16px;
|
|
}
|
|
.gv-activated .gv-max-mob-my-md {
|
|
margin-top: 16px;
|
|
margin-bottom: 16px;
|
|
}
|
|
.gv-activated .gv-max-mob-m-lg {
|
|
margin: 24px;
|
|
}
|
|
.gv-activated .gv-max-mob-mt-lg {
|
|
margin-top: 24px;
|
|
}
|
|
.gv-activated .gv-max-mob-mb-lg {
|
|
margin-bottom: 24px;
|
|
}
|
|
.gv-activated .gv-max-mob-ml-lg {
|
|
margin-left: 24px;
|
|
}
|
|
.gv-activated .gv-max-mob-mr-lg {
|
|
margin-right: 24px;
|
|
}
|
|
.gv-activated .gv-max-mob-mx-lg {
|
|
margin-left: 24px;
|
|
margin-right: 24px;
|
|
}
|
|
.gv-activated .gv-max-mob-my-lg {
|
|
margin-top: 24px;
|
|
margin-bottom: 24px;
|
|
}
|
|
.gv-activated .gv-max-mob-m-auto {
|
|
margin: auto;
|
|
}
|
|
.gv-activated .gv-max-mob-mt-auto {
|
|
margin-top: auto;
|
|
}
|
|
.gv-activated .gv-max-mob-mb-auto {
|
|
margin-bottom: auto;
|
|
}
|
|
.gv-activated .gv-max-mob-ml-auto {
|
|
margin-left: auto;
|
|
}
|
|
.gv-activated .gv-max-mob-mr-auto {
|
|
margin-right: auto;
|
|
}
|
|
.gv-activated .gv-max-mob-mx-auto {
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
.gv-activated .gv-max-mob-my-auto {
|
|
margin-top: auto;
|
|
margin-bottom: auto;
|
|
}
|
|
.gv-activated .gv-max-mob-p-0 {
|
|
padding: 0 !important;
|
|
}
|
|
.gv-activated .gv-max-mob-pt-0 {
|
|
padding-top: 0 !important;
|
|
}
|
|
.gv-activated .gv-max-mob-pb-0 {
|
|
padding-bottom: 0 !important;
|
|
}
|
|
.gv-activated .gv-max-mob-pl-0 {
|
|
padding-left: 0 !important;
|
|
}
|
|
.gv-activated .gv-max-mob-pr-0 {
|
|
padding-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-max-mob-px-0 {
|
|
padding-left: 0 !important;
|
|
padding-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-max-mob-py-0 {
|
|
padding-left: 0 !important;
|
|
padding-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-max-mob-p-sm {
|
|
padding: 8px;
|
|
}
|
|
.gv-activated .gv-max-mob-pt-sm {
|
|
padding-top: 8px;
|
|
}
|
|
.gv-activated .gv-max-mob-pb-sm {
|
|
padding-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-max-mob-pl-sm {
|
|
padding-left: 8px;
|
|
}
|
|
.gv-activated .gv-max-mob-pr-sm {
|
|
padding-right: 8px;
|
|
}
|
|
.gv-activated .gv-max-mob-px-sm {
|
|
padding-left: 8px;
|
|
padding-right: 8px;
|
|
}
|
|
.gv-activated .gv-max-mob-py-sm {
|
|
padding-top: 8px;
|
|
padding-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-max-mob-p-md {
|
|
padding: 16px;
|
|
}
|
|
.gv-activated .gv-max-mob-pt-md {
|
|
padding-top: 16px;
|
|
}
|
|
.gv-activated .gv-max-mob-pb-md {
|
|
padding-bottom: 16px;
|
|
}
|
|
.gv-activated .gv-max-mob-pl-md {
|
|
padding-left: 16px;
|
|
}
|
|
.gv-activated .gv-max-mob-pr-md {
|
|
padding-right: 16px;
|
|
}
|
|
.gv-activated .gv-max-mob-px-md {
|
|
padding-left: 16px;
|
|
padding-right: 16px;
|
|
}
|
|
.gv-activated .gv-max-mob-py-md {
|
|
padding-top: 16px;
|
|
padding-bottom: 16px;
|
|
}
|
|
.gv-activated .gv-max-mob-p-lg {
|
|
padding: 24px;
|
|
}
|
|
.gv-activated .gv-max-mob-pt-lg {
|
|
padding-top: 24px;
|
|
}
|
|
.gv-activated .gv-max-mob-pb-lg {
|
|
padding-bottom: 24px;
|
|
}
|
|
.gv-activated .gv-max-mob-pl-lg {
|
|
padding-left: 24px;
|
|
}
|
|
.gv-activated .gv-max-mob-pr-lg {
|
|
padding-right: 24px;
|
|
}
|
|
.gv-activated .gv-max-mob-px-lg {
|
|
padding-left: 24px;
|
|
padding-right: 24px;
|
|
}
|
|
.gv-activated .gv-max-mob-py-lg {
|
|
padding-top: 24px;
|
|
padding-bottom: 24px;
|
|
}
|
|
.gv-activated .gv-max-mob-stack-space-sm > *:not(:last-child) {
|
|
margin-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-max-mob-stack-space-md > *:not(:last-child) {
|
|
margin-bottom: 16px;
|
|
}
|
|
.gv-activated .gv-max-mob-stack-space-lg > *:not(:last-child) {
|
|
margin-bottom: 24px;
|
|
}
|
|
.gv-activated .gv-max-mob-text-left {
|
|
text-align: left;
|
|
}
|
|
.gv-activated .gv-max-mob-text-center {
|
|
text-align: center;
|
|
}
|
|
.gv-activated .gv-max-mob-text-right {
|
|
text-align: right;
|
|
}
|
|
}
|
|
@media (min-width: 600px ) {
|
|
.gv-activated {
|
|
/* Flexbox and grid */
|
|
/* Hide */
|
|
/* Spacing */
|
|
/* Text */
|
|
}
|
|
.gv-activated .gv-tab-flex-row {
|
|
flex-direction: row;
|
|
}
|
|
.gv-activated .gv-tab-flex-row-reverse {
|
|
flex-direction: row-reverse;
|
|
}
|
|
.gv-activated .gv-tab-flex-col {
|
|
flex-direction: column;
|
|
}
|
|
.gv-activated .gv-tab-flex-col-reverse {
|
|
flex-direction: column-reverse;
|
|
}
|
|
.gv-activated .gv-tab-content-center {
|
|
align-content: center;
|
|
}
|
|
.gv-activated .gv-tab-items-start {
|
|
align-items: flex-start;
|
|
}
|
|
.gv-activated .gv-tab-items-end {
|
|
align-items: flex-end;
|
|
}
|
|
.gv-activated .gv-tab-items-center {
|
|
align-items: center;
|
|
}
|
|
.gv-activated .gv-tab-items-baseline {
|
|
align-items: baseline;
|
|
}
|
|
.gv-activated .gv-tab-items-stretch {
|
|
align-items: stretch;
|
|
}
|
|
.gv-activated .gv-tab-justify-start {
|
|
justify-content: flex-start;
|
|
}
|
|
.gv-activated .gv-tab-justify-end {
|
|
justify-content: flex-end;
|
|
}
|
|
.gv-activated .gv-tab-justify-center {
|
|
justify-content: center;
|
|
}
|
|
.gv-activated .gv-tab-justify-between {
|
|
justify-content: space-between;
|
|
}
|
|
.gv-activated .gv-tab-justify-around {
|
|
justify-content: space-around;
|
|
}
|
|
.gv-activated .gv-tab-justify-evenly {
|
|
justify-content: space-evenly;
|
|
}
|
|
.gv-activated .gv-tab-order-first {
|
|
order: -1;
|
|
}
|
|
.gv-activated .gv-tab-order-last {
|
|
order: 99;
|
|
}
|
|
.gv-activated .gv-tab-gap-sm {
|
|
gap: 8px;
|
|
}
|
|
.gv-activated .gv-tab-gap-md {
|
|
gap: 16px;
|
|
}
|
|
.gv-activated .gv-tab-gap-lg {
|
|
gap: 24px;
|
|
}
|
|
.gv-activated .gv-tab-gap-0 {
|
|
gap: 0 !important;
|
|
}
|
|
.gv-activated .gv-tab-flex {
|
|
display: flex;
|
|
}
|
|
.gv-activated .gv-tab-block {
|
|
display: block;
|
|
}
|
|
.gv-activated .gv-tab-inline {
|
|
display: inline;
|
|
}
|
|
.gv-activated .gv-tab-inline-block {
|
|
display: inline-block;
|
|
}
|
|
.gv-activated .gv-tab-hidden {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-tab-invisible {
|
|
visibility: hidden;
|
|
}
|
|
.gv-activated .gv-tab-collapse {
|
|
visibility: collapse;
|
|
}
|
|
.gv-activated .gv-tab-m-0 {
|
|
margin: 0 !important;
|
|
}
|
|
.gv-activated .gv-tab-mt-0 {
|
|
margin-top: 0 !important;
|
|
}
|
|
.gv-activated .gv-tab-mb-0 {
|
|
margin-bottom: 0 !important;
|
|
}
|
|
.gv-activated .gv-tab-ml-0 {
|
|
margin-left: 0 !important;
|
|
}
|
|
.gv-activated .gv-tab-mr-0 {
|
|
margin-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-tab-mx-0 {
|
|
margin-left: 0 !important;
|
|
margin-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-tab-my-0 {
|
|
margin-left: 0 !important;
|
|
margin-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-tab-m-sm {
|
|
margin: 8px;
|
|
}
|
|
.gv-activated .gv-tab-mt-sm {
|
|
margin-top: 8px;
|
|
}
|
|
.gv-activated .gv-tab-mb-sm {
|
|
margin-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-tab-ml-sm {
|
|
margin-left: 8px;
|
|
}
|
|
.gv-activated .gv-tab-mr-sm {
|
|
margin-right: 8px;
|
|
}
|
|
.gv-activated .gv-tab-mx-sm {
|
|
margin-left: 8px;
|
|
margin-right: 8px;
|
|
}
|
|
.gv-activated .gv-tab-my-sm {
|
|
margin-top: 8px;
|
|
margin-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-tab-m-md {
|
|
margin: 16px;
|
|
}
|
|
.gv-activated .gv-tab-mt-md {
|
|
margin-top: 16px;
|
|
}
|
|
.gv-activated .gv-tab-mb-md {
|
|
margin-bottom: 16px;
|
|
}
|
|
.gv-activated .gv-tab-ml-md {
|
|
margin-left: 16px;
|
|
}
|
|
.gv-activated .gv-tab-mr-md {
|
|
margin-right: 16px;
|
|
}
|
|
.gv-activated .gv-tab-mx-md {
|
|
margin-left: 16px;
|
|
margin-right: 16px;
|
|
}
|
|
.gv-activated .gv-tab-my-md {
|
|
margin-top: 16px;
|
|
margin-bottom: 16px;
|
|
}
|
|
.gv-activated .gv-tab-m-lg {
|
|
margin: 24px;
|
|
}
|
|
.gv-activated .gv-tab-mt-lg {
|
|
margin-top: 24px;
|
|
}
|
|
.gv-activated .gv-tab-mb-lg {
|
|
margin-bottom: 24px;
|
|
}
|
|
.gv-activated .gv-tab-ml-lg {
|
|
margin-left: 24px;
|
|
}
|
|
.gv-activated .gv-tab-mr-lg {
|
|
margin-right: 24px;
|
|
}
|
|
.gv-activated .gv-tab-mx-lg {
|
|
margin-left: 24px;
|
|
margin-right: 24px;
|
|
}
|
|
.gv-activated .gv-tab-my-lg {
|
|
margin-top: 24px;
|
|
margin-bottom: 24px;
|
|
}
|
|
.gv-activated .gv-tab-m-auto {
|
|
margin: auto;
|
|
}
|
|
.gv-activated .gv-tab-mt-auto {
|
|
margin-top: auto;
|
|
}
|
|
.gv-activated .gv-tab-mb-auto {
|
|
margin-bottom: auto;
|
|
}
|
|
.gv-activated .gv-tab-ml-auto {
|
|
margin-left: auto;
|
|
}
|
|
.gv-activated .gv-tab-mr-auto {
|
|
margin-right: auto;
|
|
}
|
|
.gv-activated .gv-tab-mx-auto {
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
.gv-activated .gv-tab-my-auto {
|
|
margin-top: auto;
|
|
margin-bottom: auto;
|
|
}
|
|
.gv-activated .gv-tab-p-0 {
|
|
padding: 0 !important;
|
|
}
|
|
.gv-activated .gv-tab-pt-0 {
|
|
padding-top: 0 !important;
|
|
}
|
|
.gv-activated .gv-tab-pb-0 {
|
|
padding-bottom: 0 !important;
|
|
}
|
|
.gv-activated .gv-tab-pl-0 {
|
|
padding-left: 0 !important;
|
|
}
|
|
.gv-activated .gv-tab-pr-0 {
|
|
padding-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-tab-px-0 {
|
|
padding-left: 0 !important;
|
|
padding-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-tab-py-0 {
|
|
padding-left: 0 !important;
|
|
padding-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-tab-p-sm {
|
|
padding: 8px;
|
|
}
|
|
.gv-activated .gv-tab-pt-sm {
|
|
padding-top: 8px;
|
|
}
|
|
.gv-activated .gv-tab-pb-sm {
|
|
padding-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-tab-pl-sm {
|
|
padding-left: 8px;
|
|
}
|
|
.gv-activated .gv-tab-pr-sm {
|
|
padding-right: 8px;
|
|
}
|
|
.gv-activated .gv-tab-px-sm {
|
|
padding-left: 8px;
|
|
padding-right: 8px;
|
|
}
|
|
.gv-activated .gv-tab-py-sm {
|
|
padding-top: 8px;
|
|
padding-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-tab-p-md {
|
|
padding: 16px;
|
|
}
|
|
.gv-activated .gv-tab-pt-md {
|
|
padding-top: 16px;
|
|
}
|
|
.gv-activated .gv-tab-pb-md {
|
|
padding-bottom: 16px;
|
|
}
|
|
.gv-activated .gv-tab-pl-md {
|
|
padding-left: 16px;
|
|
}
|
|
.gv-activated .gv-tab-pr-md {
|
|
padding-right: 16px;
|
|
}
|
|
.gv-activated .gv-tab-px-md {
|
|
padding-left: 16px;
|
|
padding-right: 16px;
|
|
}
|
|
.gv-activated .gv-tab-py-md {
|
|
padding-top: 16px;
|
|
padding-bottom: 16px;
|
|
}
|
|
.gv-activated .gv-tab-p-lg {
|
|
padding: 24px;
|
|
}
|
|
.gv-activated .gv-tab-pt-lg {
|
|
padding-top: 24px;
|
|
}
|
|
.gv-activated .gv-tab-pb-lg {
|
|
padding-bottom: 24px;
|
|
}
|
|
.gv-activated .gv-tab-pl-lg {
|
|
padding-left: 24px;
|
|
}
|
|
.gv-activated .gv-tab-pr-lg {
|
|
padding-right: 24px;
|
|
}
|
|
.gv-activated .gv-tab-px-lg {
|
|
padding-left: 24px;
|
|
padding-right: 24px;
|
|
}
|
|
.gv-activated .gv-tab-py-lg {
|
|
padding-top: 24px;
|
|
padding-bottom: 24px;
|
|
}
|
|
.gv-activated .gv-tab-stack-space-sm > *:not(:last-child) {
|
|
margin-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-tab-stack-space-md > *:not(:last-child) {
|
|
margin-bottom: 16px;
|
|
}
|
|
.gv-activated .gv-tab-stack-space-lg > *:not(:last-child) {
|
|
margin-bottom: 24px;
|
|
}
|
|
.gv-activated .gv-tab-text-left {
|
|
text-align: left;
|
|
}
|
|
.gv-activated .gv-tab-text-center {
|
|
text-align: center;
|
|
}
|
|
.gv-activated .gv-tab-text-right {
|
|
text-align: right;
|
|
}
|
|
}
|
|
@media (max-width: 767px ) {
|
|
.gv-activated {
|
|
/* Flexbox and grid */
|
|
/* Hide */
|
|
/* Spacing */
|
|
/* Text */
|
|
}
|
|
.gv-activated .gv-max-tab-sm-flex-row {
|
|
flex-direction: row;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-flex-row-reverse {
|
|
flex-direction: row-reverse;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-flex-col {
|
|
flex-direction: column;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-flex-col-reverse {
|
|
flex-direction: column-reverse;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-content-center {
|
|
align-content: center;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-items-start {
|
|
align-items: flex-start;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-items-end {
|
|
align-items: flex-end;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-items-center {
|
|
align-items: center;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-items-baseline {
|
|
align-items: baseline;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-items-stretch {
|
|
align-items: stretch;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-justify-start {
|
|
justify-content: flex-start;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-justify-end {
|
|
justify-content: flex-end;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-justify-center {
|
|
justify-content: center;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-justify-between {
|
|
justify-content: space-between;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-justify-around {
|
|
justify-content: space-around;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-justify-evenly {
|
|
justify-content: space-evenly;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-order-first {
|
|
order: -1;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-order-last {
|
|
order: 99;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-gap-sm {
|
|
gap: 8px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-gap-md {
|
|
gap: 16px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-gap-lg {
|
|
gap: 24px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-gap-0 {
|
|
gap: 0 !important;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-flex {
|
|
display: flex;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-block {
|
|
display: block;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-inline {
|
|
display: inline;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-inline-block {
|
|
display: inline-block;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-hidden {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-invisible {
|
|
visibility: hidden;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-collapse {
|
|
visibility: collapse;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-m-0 {
|
|
margin: 0 !important;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-mt-0 {
|
|
margin-top: 0 !important;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-mb-0 {
|
|
margin-bottom: 0 !important;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-ml-0 {
|
|
margin-left: 0 !important;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-mr-0 {
|
|
margin-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-mx-0 {
|
|
margin-left: 0 !important;
|
|
margin-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-my-0 {
|
|
margin-left: 0 !important;
|
|
margin-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-m-sm {
|
|
margin: 8px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-mt-sm {
|
|
margin-top: 8px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-mb-sm {
|
|
margin-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-ml-sm {
|
|
margin-left: 8px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-mr-sm {
|
|
margin-right: 8px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-mx-sm {
|
|
margin-left: 8px;
|
|
margin-right: 8px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-my-sm {
|
|
margin-top: 8px;
|
|
margin-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-m-md {
|
|
margin: 16px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-mt-md {
|
|
margin-top: 16px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-mb-md {
|
|
margin-bottom: 16px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-ml-md {
|
|
margin-left: 16px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-mr-md {
|
|
margin-right: 16px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-mx-md {
|
|
margin-left: 16px;
|
|
margin-right: 16px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-my-md {
|
|
margin-top: 16px;
|
|
margin-bottom: 16px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-m-lg {
|
|
margin: 24px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-mt-lg {
|
|
margin-top: 24px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-mb-lg {
|
|
margin-bottom: 24px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-ml-lg {
|
|
margin-left: 24px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-mr-lg {
|
|
margin-right: 24px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-mx-lg {
|
|
margin-left: 24px;
|
|
margin-right: 24px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-my-lg {
|
|
margin-top: 24px;
|
|
margin-bottom: 24px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-m-auto {
|
|
margin: auto;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-mt-auto {
|
|
margin-top: auto;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-mb-auto {
|
|
margin-bottom: auto;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-ml-auto {
|
|
margin-left: auto;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-mr-auto {
|
|
margin-right: auto;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-mx-auto {
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-my-auto {
|
|
margin-top: auto;
|
|
margin-bottom: auto;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-p-0 {
|
|
padding: 0 !important;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-pt-0 {
|
|
padding-top: 0 !important;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-pb-0 {
|
|
padding-bottom: 0 !important;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-pl-0 {
|
|
padding-left: 0 !important;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-pr-0 {
|
|
padding-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-px-0 {
|
|
padding-left: 0 !important;
|
|
padding-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-py-0 {
|
|
padding-left: 0 !important;
|
|
padding-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-p-sm {
|
|
padding: 8px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-pt-sm {
|
|
padding-top: 8px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-pb-sm {
|
|
padding-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-pl-sm {
|
|
padding-left: 8px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-pr-sm {
|
|
padding-right: 8px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-px-sm {
|
|
padding-left: 8px;
|
|
padding-right: 8px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-py-sm {
|
|
padding-top: 8px;
|
|
padding-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-p-md {
|
|
padding: 16px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-pt-md {
|
|
padding-top: 16px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-pb-md {
|
|
padding-bottom: 16px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-pl-md {
|
|
padding-left: 16px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-pr-md {
|
|
padding-right: 16px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-px-md {
|
|
padding-left: 16px;
|
|
padding-right: 16px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-py-md {
|
|
padding-top: 16px;
|
|
padding-bottom: 16px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-p-lg {
|
|
padding: 24px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-pt-lg {
|
|
padding-top: 24px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-pb-lg {
|
|
padding-bottom: 24px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-pl-lg {
|
|
padding-left: 24px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-pr-lg {
|
|
padding-right: 24px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-px-lg {
|
|
padding-left: 24px;
|
|
padding-right: 24px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-py-lg {
|
|
padding-top: 24px;
|
|
padding-bottom: 24px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-stack-space-sm > *:not(:last-child) {
|
|
margin-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-stack-space-md > *:not(:last-child) {
|
|
margin-bottom: 16px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-stack-space-lg > *:not(:last-child) {
|
|
margin-bottom: 24px;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-text-left {
|
|
text-align: left;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-text-center {
|
|
text-align: center;
|
|
}
|
|
.gv-activated .gv-max-tab-sm-text-right {
|
|
text-align: right;
|
|
}
|
|
}
|
|
@media (min-width: 768px ) {
|
|
.gv-activated {
|
|
/* Flexbox and grid */
|
|
/* Hide */
|
|
/* Spacing */
|
|
/* Text */
|
|
}
|
|
.gv-activated .gv-tab-lg-flex-row {
|
|
flex-direction: row;
|
|
}
|
|
.gv-activated .gv-tab-lg-flex-row-reverse {
|
|
flex-direction: row-reverse;
|
|
}
|
|
.gv-activated .gv-tab-lg-flex-col {
|
|
flex-direction: column;
|
|
}
|
|
.gv-activated .gv-tab-lg-flex-col-reverse {
|
|
flex-direction: column-reverse;
|
|
}
|
|
.gv-activated .gv-tab-lg-content-center {
|
|
align-content: center;
|
|
}
|
|
.gv-activated .gv-tab-lg-items-start {
|
|
align-items: flex-start;
|
|
}
|
|
.gv-activated .gv-tab-lg-items-end {
|
|
align-items: flex-end;
|
|
}
|
|
.gv-activated .gv-tab-lg-items-center {
|
|
align-items: center;
|
|
}
|
|
.gv-activated .gv-tab-lg-items-baseline {
|
|
align-items: baseline;
|
|
}
|
|
.gv-activated .gv-tab-lg-items-stretch {
|
|
align-items: stretch;
|
|
}
|
|
.gv-activated .gv-tab-lg-justify-start {
|
|
justify-content: flex-start;
|
|
}
|
|
.gv-activated .gv-tab-lg-justify-end {
|
|
justify-content: flex-end;
|
|
}
|
|
.gv-activated .gv-tab-lg-justify-center {
|
|
justify-content: center;
|
|
}
|
|
.gv-activated .gv-tab-lg-justify-between {
|
|
justify-content: space-between;
|
|
}
|
|
.gv-activated .gv-tab-lg-justify-around {
|
|
justify-content: space-around;
|
|
}
|
|
.gv-activated .gv-tab-lg-justify-evenly {
|
|
justify-content: space-evenly;
|
|
}
|
|
.gv-activated .gv-tab-lg-order-first {
|
|
order: -1;
|
|
}
|
|
.gv-activated .gv-tab-lg-order-last {
|
|
order: 99;
|
|
}
|
|
.gv-activated .gv-tab-lg-gap-sm {
|
|
gap: 8px;
|
|
}
|
|
.gv-activated .gv-tab-lg-gap-md {
|
|
gap: 16px;
|
|
}
|
|
.gv-activated .gv-tab-lg-gap-lg {
|
|
gap: 24px;
|
|
}
|
|
.gv-activated .gv-tab-lg-gap-0 {
|
|
gap: 0 !important;
|
|
}
|
|
.gv-activated .gv-tab-lg-flex {
|
|
display: flex;
|
|
}
|
|
.gv-activated .gv-tab-lg-block {
|
|
display: block;
|
|
}
|
|
.gv-activated .gv-tab-lg-inline {
|
|
display: inline;
|
|
}
|
|
.gv-activated .gv-tab-lg-inline-block {
|
|
display: inline-block;
|
|
}
|
|
.gv-activated .gv-tab-lg-hidden {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-tab-lg-invisible {
|
|
visibility: hidden;
|
|
}
|
|
.gv-activated .gv-tab-lg-collapse {
|
|
visibility: collapse;
|
|
}
|
|
.gv-activated .gv-tab-lg-m-0 {
|
|
margin: 0 !important;
|
|
}
|
|
.gv-activated .gv-tab-lg-mt-0 {
|
|
margin-top: 0 !important;
|
|
}
|
|
.gv-activated .gv-tab-lg-mb-0 {
|
|
margin-bottom: 0 !important;
|
|
}
|
|
.gv-activated .gv-tab-lg-ml-0 {
|
|
margin-left: 0 !important;
|
|
}
|
|
.gv-activated .gv-tab-lg-mr-0 {
|
|
margin-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-tab-lg-mx-0 {
|
|
margin-left: 0 !important;
|
|
margin-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-tab-lg-my-0 {
|
|
margin-left: 0 !important;
|
|
margin-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-tab-lg-m-sm {
|
|
margin: 8px;
|
|
}
|
|
.gv-activated .gv-tab-lg-mt-sm {
|
|
margin-top: 8px;
|
|
}
|
|
.gv-activated .gv-tab-lg-mb-sm {
|
|
margin-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-tab-lg-ml-sm {
|
|
margin-left: 8px;
|
|
}
|
|
.gv-activated .gv-tab-lg-mr-sm {
|
|
margin-right: 8px;
|
|
}
|
|
.gv-activated .gv-tab-lg-mx-sm {
|
|
margin-left: 8px;
|
|
margin-right: 8px;
|
|
}
|
|
.gv-activated .gv-tab-lg-my-sm {
|
|
margin-top: 8px;
|
|
margin-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-tab-lg-m-md {
|
|
margin: 16px;
|
|
}
|
|
.gv-activated .gv-tab-lg-mt-md {
|
|
margin-top: 16px;
|
|
}
|
|
.gv-activated .gv-tab-lg-mb-md {
|
|
margin-bottom: 16px;
|
|
}
|
|
.gv-activated .gv-tab-lg-ml-md {
|
|
margin-left: 16px;
|
|
}
|
|
.gv-activated .gv-tab-lg-mr-md {
|
|
margin-right: 16px;
|
|
}
|
|
.gv-activated .gv-tab-lg-mx-md {
|
|
margin-left: 16px;
|
|
margin-right: 16px;
|
|
}
|
|
.gv-activated .gv-tab-lg-my-md {
|
|
margin-top: 16px;
|
|
margin-bottom: 16px;
|
|
}
|
|
.gv-activated .gv-tab-lg-m-lg {
|
|
margin: 24px;
|
|
}
|
|
.gv-activated .gv-tab-lg-mt-lg {
|
|
margin-top: 24px;
|
|
}
|
|
.gv-activated .gv-tab-lg-mb-lg {
|
|
margin-bottom: 24px;
|
|
}
|
|
.gv-activated .gv-tab-lg-ml-lg {
|
|
margin-left: 24px;
|
|
}
|
|
.gv-activated .gv-tab-lg-mr-lg {
|
|
margin-right: 24px;
|
|
}
|
|
.gv-activated .gv-tab-lg-mx-lg {
|
|
margin-left: 24px;
|
|
margin-right: 24px;
|
|
}
|
|
.gv-activated .gv-tab-lg-my-lg {
|
|
margin-top: 24px;
|
|
margin-bottom: 24px;
|
|
}
|
|
.gv-activated .gv-tab-lg-m-auto {
|
|
margin: auto;
|
|
}
|
|
.gv-activated .gv-tab-lg-mt-auto {
|
|
margin-top: auto;
|
|
}
|
|
.gv-activated .gv-tab-lg-mb-auto {
|
|
margin-bottom: auto;
|
|
}
|
|
.gv-activated .gv-tab-lg-ml-auto {
|
|
margin-left: auto;
|
|
}
|
|
.gv-activated .gv-tab-lg-mr-auto {
|
|
margin-right: auto;
|
|
}
|
|
.gv-activated .gv-tab-lg-mx-auto {
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
.gv-activated .gv-tab-lg-my-auto {
|
|
margin-top: auto;
|
|
margin-bottom: auto;
|
|
}
|
|
.gv-activated .gv-tab-lg-p-0 {
|
|
padding: 0 !important;
|
|
}
|
|
.gv-activated .gv-tab-lg-pt-0 {
|
|
padding-top: 0 !important;
|
|
}
|
|
.gv-activated .gv-tab-lg-pb-0 {
|
|
padding-bottom: 0 !important;
|
|
}
|
|
.gv-activated .gv-tab-lg-pl-0 {
|
|
padding-left: 0 !important;
|
|
}
|
|
.gv-activated .gv-tab-lg-pr-0 {
|
|
padding-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-tab-lg-px-0 {
|
|
padding-left: 0 !important;
|
|
padding-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-tab-lg-py-0 {
|
|
padding-left: 0 !important;
|
|
padding-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-tab-lg-p-sm {
|
|
padding: 8px;
|
|
}
|
|
.gv-activated .gv-tab-lg-pt-sm {
|
|
padding-top: 8px;
|
|
}
|
|
.gv-activated .gv-tab-lg-pb-sm {
|
|
padding-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-tab-lg-pl-sm {
|
|
padding-left: 8px;
|
|
}
|
|
.gv-activated .gv-tab-lg-pr-sm {
|
|
padding-right: 8px;
|
|
}
|
|
.gv-activated .gv-tab-lg-px-sm {
|
|
padding-left: 8px;
|
|
padding-right: 8px;
|
|
}
|
|
.gv-activated .gv-tab-lg-py-sm {
|
|
padding-top: 8px;
|
|
padding-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-tab-lg-p-md {
|
|
padding: 16px;
|
|
}
|
|
.gv-activated .gv-tab-lg-pt-md {
|
|
padding-top: 16px;
|
|
}
|
|
.gv-activated .gv-tab-lg-pb-md {
|
|
padding-bottom: 16px;
|
|
}
|
|
.gv-activated .gv-tab-lg-pl-md {
|
|
padding-left: 16px;
|
|
}
|
|
.gv-activated .gv-tab-lg-pr-md {
|
|
padding-right: 16px;
|
|
}
|
|
.gv-activated .gv-tab-lg-px-md {
|
|
padding-left: 16px;
|
|
padding-right: 16px;
|
|
}
|
|
.gv-activated .gv-tab-lg-py-md {
|
|
padding-top: 16px;
|
|
padding-bottom: 16px;
|
|
}
|
|
.gv-activated .gv-tab-lg-p-lg {
|
|
padding: 24px;
|
|
}
|
|
.gv-activated .gv-tab-lg-pt-lg {
|
|
padding-top: 24px;
|
|
}
|
|
.gv-activated .gv-tab-lg-pb-lg {
|
|
padding-bottom: 24px;
|
|
}
|
|
.gv-activated .gv-tab-lg-pl-lg {
|
|
padding-left: 24px;
|
|
}
|
|
.gv-activated .gv-tab-lg-pr-lg {
|
|
padding-right: 24px;
|
|
}
|
|
.gv-activated .gv-tab-lg-px-lg {
|
|
padding-left: 24px;
|
|
padding-right: 24px;
|
|
}
|
|
.gv-activated .gv-tab-lg-py-lg {
|
|
padding-top: 24px;
|
|
padding-bottom: 24px;
|
|
}
|
|
.gv-activated .gv-tab-lg-stack-space-sm > *:not(:last-child) {
|
|
margin-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-tab-lg-stack-space-md > *:not(:last-child) {
|
|
margin-bottom: 16px;
|
|
}
|
|
.gv-activated .gv-tab-lg-stack-space-lg > *:not(:last-child) {
|
|
margin-bottom: 24px;
|
|
}
|
|
.gv-activated .gv-tab-lg-text-left {
|
|
text-align: left;
|
|
}
|
|
.gv-activated .gv-tab-lg-text-center {
|
|
text-align: center;
|
|
}
|
|
.gv-activated .gv-tab-lg-text-right {
|
|
text-align: right;
|
|
}
|
|
}
|
|
@media (max-width: 1023px ) {
|
|
.gv-activated {
|
|
/* Flexbox and grid */
|
|
/* Hide */
|
|
/* Spacing */
|
|
/* Text */
|
|
}
|
|
.gv-activated .gv-max-tab-flex-row {
|
|
flex-direction: row;
|
|
}
|
|
.gv-activated .gv-max-tab-flex-row-reverse {
|
|
flex-direction: row-reverse;
|
|
}
|
|
.gv-activated .gv-max-tab-flex-col {
|
|
flex-direction: column;
|
|
}
|
|
.gv-activated .gv-max-tab-flex-col-reverse {
|
|
flex-direction: column-reverse;
|
|
}
|
|
.gv-activated .gv-max-tab-content-center {
|
|
align-content: center;
|
|
}
|
|
.gv-activated .gv-max-tab-items-start {
|
|
align-items: flex-start;
|
|
}
|
|
.gv-activated .gv-max-tab-items-end {
|
|
align-items: flex-end;
|
|
}
|
|
.gv-activated .gv-max-tab-items-center {
|
|
align-items: center;
|
|
}
|
|
.gv-activated .gv-max-tab-items-baseline {
|
|
align-items: baseline;
|
|
}
|
|
.gv-activated .gv-max-tab-items-stretch {
|
|
align-items: stretch;
|
|
}
|
|
.gv-activated .gv-max-tab-justify-start {
|
|
justify-content: flex-start;
|
|
}
|
|
.gv-activated .gv-max-tab-justify-end {
|
|
justify-content: flex-end;
|
|
}
|
|
.gv-activated .gv-max-tab-justify-center {
|
|
justify-content: center;
|
|
}
|
|
.gv-activated .gv-max-tab-justify-between {
|
|
justify-content: space-between;
|
|
}
|
|
.gv-activated .gv-max-tab-justify-around {
|
|
justify-content: space-around;
|
|
}
|
|
.gv-activated .gv-max-tab-justify-evenly {
|
|
justify-content: space-evenly;
|
|
}
|
|
.gv-activated .gv-max-tab-order-first {
|
|
order: -1;
|
|
}
|
|
.gv-activated .gv-max-tab-order-last {
|
|
order: 99;
|
|
}
|
|
.gv-activated .gv-max-tab-gap-sm {
|
|
gap: 8px;
|
|
}
|
|
.gv-activated .gv-max-tab-gap-md {
|
|
gap: 16px;
|
|
}
|
|
.gv-activated .gv-max-tab-gap-lg {
|
|
gap: 24px;
|
|
}
|
|
.gv-activated .gv-max-tab-gap-0 {
|
|
gap: 0 !important;
|
|
}
|
|
.gv-activated .gv-max-tab-flex {
|
|
display: flex;
|
|
}
|
|
.gv-activated .gv-max-tab-block {
|
|
display: block;
|
|
}
|
|
.gv-activated .gv-max-tab-inline {
|
|
display: inline;
|
|
}
|
|
.gv-activated .gv-max-tab-inline-block {
|
|
display: inline-block;
|
|
}
|
|
.gv-activated .gv-max-tab-hidden {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-max-tab-invisible {
|
|
visibility: hidden;
|
|
}
|
|
.gv-activated .gv-max-tab-collapse {
|
|
visibility: collapse;
|
|
}
|
|
.gv-activated .gv-max-tab-m-0 {
|
|
margin: 0 !important;
|
|
}
|
|
.gv-activated .gv-max-tab-mt-0 {
|
|
margin-top: 0 !important;
|
|
}
|
|
.gv-activated .gv-max-tab-mb-0 {
|
|
margin-bottom: 0 !important;
|
|
}
|
|
.gv-activated .gv-max-tab-ml-0 {
|
|
margin-left: 0 !important;
|
|
}
|
|
.gv-activated .gv-max-tab-mr-0 {
|
|
margin-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-max-tab-mx-0 {
|
|
margin-left: 0 !important;
|
|
margin-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-max-tab-my-0 {
|
|
margin-left: 0 !important;
|
|
margin-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-max-tab-m-sm {
|
|
margin: 8px;
|
|
}
|
|
.gv-activated .gv-max-tab-mt-sm {
|
|
margin-top: 8px;
|
|
}
|
|
.gv-activated .gv-max-tab-mb-sm {
|
|
margin-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-max-tab-ml-sm {
|
|
margin-left: 8px;
|
|
}
|
|
.gv-activated .gv-max-tab-mr-sm {
|
|
margin-right: 8px;
|
|
}
|
|
.gv-activated .gv-max-tab-mx-sm {
|
|
margin-left: 8px;
|
|
margin-right: 8px;
|
|
}
|
|
.gv-activated .gv-max-tab-my-sm {
|
|
margin-top: 8px;
|
|
margin-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-max-tab-m-md {
|
|
margin: 16px;
|
|
}
|
|
.gv-activated .gv-max-tab-mt-md {
|
|
margin-top: 16px;
|
|
}
|
|
.gv-activated .gv-max-tab-mb-md {
|
|
margin-bottom: 16px;
|
|
}
|
|
.gv-activated .gv-max-tab-ml-md {
|
|
margin-left: 16px;
|
|
}
|
|
.gv-activated .gv-max-tab-mr-md {
|
|
margin-right: 16px;
|
|
}
|
|
.gv-activated .gv-max-tab-mx-md {
|
|
margin-left: 16px;
|
|
margin-right: 16px;
|
|
}
|
|
.gv-activated .gv-max-tab-my-md {
|
|
margin-top: 16px;
|
|
margin-bottom: 16px;
|
|
}
|
|
.gv-activated .gv-max-tab-m-lg {
|
|
margin: 24px;
|
|
}
|
|
.gv-activated .gv-max-tab-mt-lg {
|
|
margin-top: 24px;
|
|
}
|
|
.gv-activated .gv-max-tab-mb-lg {
|
|
margin-bottom: 24px;
|
|
}
|
|
.gv-activated .gv-max-tab-ml-lg {
|
|
margin-left: 24px;
|
|
}
|
|
.gv-activated .gv-max-tab-mr-lg {
|
|
margin-right: 24px;
|
|
}
|
|
.gv-activated .gv-max-tab-mx-lg {
|
|
margin-left: 24px;
|
|
margin-right: 24px;
|
|
}
|
|
.gv-activated .gv-max-tab-my-lg {
|
|
margin-top: 24px;
|
|
margin-bottom: 24px;
|
|
}
|
|
.gv-activated .gv-max-tab-m-auto {
|
|
margin: auto;
|
|
}
|
|
.gv-activated .gv-max-tab-mt-auto {
|
|
margin-top: auto;
|
|
}
|
|
.gv-activated .gv-max-tab-mb-auto {
|
|
margin-bottom: auto;
|
|
}
|
|
.gv-activated .gv-max-tab-ml-auto {
|
|
margin-left: auto;
|
|
}
|
|
.gv-activated .gv-max-tab-mr-auto {
|
|
margin-right: auto;
|
|
}
|
|
.gv-activated .gv-max-tab-mx-auto {
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
.gv-activated .gv-max-tab-my-auto {
|
|
margin-top: auto;
|
|
margin-bottom: auto;
|
|
}
|
|
.gv-activated .gv-max-tab-p-0 {
|
|
padding: 0 !important;
|
|
}
|
|
.gv-activated .gv-max-tab-pt-0 {
|
|
padding-top: 0 !important;
|
|
}
|
|
.gv-activated .gv-max-tab-pb-0 {
|
|
padding-bottom: 0 !important;
|
|
}
|
|
.gv-activated .gv-max-tab-pl-0 {
|
|
padding-left: 0 !important;
|
|
}
|
|
.gv-activated .gv-max-tab-pr-0 {
|
|
padding-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-max-tab-px-0 {
|
|
padding-left: 0 !important;
|
|
padding-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-max-tab-py-0 {
|
|
padding-left: 0 !important;
|
|
padding-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-max-tab-p-sm {
|
|
padding: 8px;
|
|
}
|
|
.gv-activated .gv-max-tab-pt-sm {
|
|
padding-top: 8px;
|
|
}
|
|
.gv-activated .gv-max-tab-pb-sm {
|
|
padding-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-max-tab-pl-sm {
|
|
padding-left: 8px;
|
|
}
|
|
.gv-activated .gv-max-tab-pr-sm {
|
|
padding-right: 8px;
|
|
}
|
|
.gv-activated .gv-max-tab-px-sm {
|
|
padding-left: 8px;
|
|
padding-right: 8px;
|
|
}
|
|
.gv-activated .gv-max-tab-py-sm {
|
|
padding-top: 8px;
|
|
padding-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-max-tab-p-md {
|
|
padding: 16px;
|
|
}
|
|
.gv-activated .gv-max-tab-pt-md {
|
|
padding-top: 16px;
|
|
}
|
|
.gv-activated .gv-max-tab-pb-md {
|
|
padding-bottom: 16px;
|
|
}
|
|
.gv-activated .gv-max-tab-pl-md {
|
|
padding-left: 16px;
|
|
}
|
|
.gv-activated .gv-max-tab-pr-md {
|
|
padding-right: 16px;
|
|
}
|
|
.gv-activated .gv-max-tab-px-md {
|
|
padding-left: 16px;
|
|
padding-right: 16px;
|
|
}
|
|
.gv-activated .gv-max-tab-py-md {
|
|
padding-top: 16px;
|
|
padding-bottom: 16px;
|
|
}
|
|
.gv-activated .gv-max-tab-p-lg {
|
|
padding: 24px;
|
|
}
|
|
.gv-activated .gv-max-tab-pt-lg {
|
|
padding-top: 24px;
|
|
}
|
|
.gv-activated .gv-max-tab-pb-lg {
|
|
padding-bottom: 24px;
|
|
}
|
|
.gv-activated .gv-max-tab-pl-lg {
|
|
padding-left: 24px;
|
|
}
|
|
.gv-activated .gv-max-tab-pr-lg {
|
|
padding-right: 24px;
|
|
}
|
|
.gv-activated .gv-max-tab-px-lg {
|
|
padding-left: 24px;
|
|
padding-right: 24px;
|
|
}
|
|
.gv-activated .gv-max-tab-py-lg {
|
|
padding-top: 24px;
|
|
padding-bottom: 24px;
|
|
}
|
|
.gv-activated .gv-max-tab-stack-space-sm > *:not(:last-child) {
|
|
margin-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-max-tab-stack-space-md > *:not(:last-child) {
|
|
margin-bottom: 16px;
|
|
}
|
|
.gv-activated .gv-max-tab-stack-space-lg > *:not(:last-child) {
|
|
margin-bottom: 24px;
|
|
}
|
|
.gv-activated .gv-max-tab-text-left {
|
|
text-align: left;
|
|
}
|
|
.gv-activated .gv-max-tab-text-center {
|
|
text-align: center;
|
|
}
|
|
.gv-activated .gv-max-tab-text-right {
|
|
text-align: right;
|
|
}
|
|
}
|
|
@media (min-width: 1024px ) {
|
|
.gv-activated {
|
|
/* Flexbox and grid */
|
|
/* Hide */
|
|
/* Spacing */
|
|
/* Text */
|
|
}
|
|
.gv-activated .gv-desk-flex-row {
|
|
flex-direction: row;
|
|
}
|
|
.gv-activated .gv-desk-flex-row-reverse {
|
|
flex-direction: row-reverse;
|
|
}
|
|
.gv-activated .gv-desk-flex-col {
|
|
flex-direction: column;
|
|
}
|
|
.gv-activated .gv-desk-flex-col-reverse {
|
|
flex-direction: column-reverse;
|
|
}
|
|
.gv-activated .gv-desk-content-center {
|
|
align-content: center;
|
|
}
|
|
.gv-activated .gv-desk-items-start {
|
|
align-items: flex-start;
|
|
}
|
|
.gv-activated .gv-desk-items-end {
|
|
align-items: flex-end;
|
|
}
|
|
.gv-activated .gv-desk-items-center {
|
|
align-items: center;
|
|
}
|
|
.gv-activated .gv-desk-items-baseline {
|
|
align-items: baseline;
|
|
}
|
|
.gv-activated .gv-desk-items-stretch {
|
|
align-items: stretch;
|
|
}
|
|
.gv-activated .gv-desk-justify-start {
|
|
justify-content: flex-start;
|
|
}
|
|
.gv-activated .gv-desk-justify-end {
|
|
justify-content: flex-end;
|
|
}
|
|
.gv-activated .gv-desk-justify-center {
|
|
justify-content: center;
|
|
}
|
|
.gv-activated .gv-desk-justify-between {
|
|
justify-content: space-between;
|
|
}
|
|
.gv-activated .gv-desk-justify-around {
|
|
justify-content: space-around;
|
|
}
|
|
.gv-activated .gv-desk-justify-evenly {
|
|
justify-content: space-evenly;
|
|
}
|
|
.gv-activated .gv-desk-order-first {
|
|
order: -1;
|
|
}
|
|
.gv-activated .gv-desk-order-last {
|
|
order: 99;
|
|
}
|
|
.gv-activated .gv-desk-gap-sm {
|
|
gap: 8px;
|
|
}
|
|
.gv-activated .gv-desk-gap-md {
|
|
gap: 16px;
|
|
}
|
|
.gv-activated .gv-desk-gap-lg {
|
|
gap: 24px;
|
|
}
|
|
.gv-activated .gv-desk-gap-0 {
|
|
gap: 0 !important;
|
|
}
|
|
.gv-activated .gv-desk-flex {
|
|
display: flex;
|
|
}
|
|
.gv-activated .gv-desk-block {
|
|
display: block;
|
|
}
|
|
.gv-activated .gv-desk-inline {
|
|
display: inline;
|
|
}
|
|
.gv-activated .gv-desk-inline-block {
|
|
display: inline-block;
|
|
}
|
|
.gv-activated .gv-desk-hidden {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-desk-invisible {
|
|
visibility: hidden;
|
|
}
|
|
.gv-activated .gv-desk-collapse {
|
|
visibility: collapse;
|
|
}
|
|
.gv-activated .gv-desk-m-0 {
|
|
margin: 0 !important;
|
|
}
|
|
.gv-activated .gv-desk-mt-0 {
|
|
margin-top: 0 !important;
|
|
}
|
|
.gv-activated .gv-desk-mb-0 {
|
|
margin-bottom: 0 !important;
|
|
}
|
|
.gv-activated .gv-desk-ml-0 {
|
|
margin-left: 0 !important;
|
|
}
|
|
.gv-activated .gv-desk-mr-0 {
|
|
margin-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-desk-mx-0 {
|
|
margin-left: 0 !important;
|
|
margin-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-desk-my-0 {
|
|
margin-left: 0 !important;
|
|
margin-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-desk-m-sm {
|
|
margin: 8px;
|
|
}
|
|
.gv-activated .gv-desk-mt-sm {
|
|
margin-top: 8px;
|
|
}
|
|
.gv-activated .gv-desk-mb-sm {
|
|
margin-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-desk-ml-sm {
|
|
margin-left: 8px;
|
|
}
|
|
.gv-activated .gv-desk-mr-sm {
|
|
margin-right: 8px;
|
|
}
|
|
.gv-activated .gv-desk-mx-sm {
|
|
margin-left: 8px;
|
|
margin-right: 8px;
|
|
}
|
|
.gv-activated .gv-desk-my-sm {
|
|
margin-top: 8px;
|
|
margin-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-desk-m-md {
|
|
margin: 16px;
|
|
}
|
|
.gv-activated .gv-desk-mt-md {
|
|
margin-top: 16px;
|
|
}
|
|
.gv-activated .gv-desk-mb-md {
|
|
margin-bottom: 16px;
|
|
}
|
|
.gv-activated .gv-desk-ml-md {
|
|
margin-left: 16px;
|
|
}
|
|
.gv-activated .gv-desk-mr-md {
|
|
margin-right: 16px;
|
|
}
|
|
.gv-activated .gv-desk-mx-md {
|
|
margin-left: 16px;
|
|
margin-right: 16px;
|
|
}
|
|
.gv-activated .gv-desk-my-md {
|
|
margin-top: 16px;
|
|
margin-bottom: 16px;
|
|
}
|
|
.gv-activated .gv-desk-m-lg {
|
|
margin: 24px;
|
|
}
|
|
.gv-activated .gv-desk-mt-lg {
|
|
margin-top: 24px;
|
|
}
|
|
.gv-activated .gv-desk-mb-lg {
|
|
margin-bottom: 24px;
|
|
}
|
|
.gv-activated .gv-desk-ml-lg {
|
|
margin-left: 24px;
|
|
}
|
|
.gv-activated .gv-desk-mr-lg {
|
|
margin-right: 24px;
|
|
}
|
|
.gv-activated .gv-desk-mx-lg {
|
|
margin-left: 24px;
|
|
margin-right: 24px;
|
|
}
|
|
.gv-activated .gv-desk-my-lg {
|
|
margin-top: 24px;
|
|
margin-bottom: 24px;
|
|
}
|
|
.gv-activated .gv-desk-m-auto {
|
|
margin: auto;
|
|
}
|
|
.gv-activated .gv-desk-mt-auto {
|
|
margin-top: auto;
|
|
}
|
|
.gv-activated .gv-desk-mb-auto {
|
|
margin-bottom: auto;
|
|
}
|
|
.gv-activated .gv-desk-ml-auto {
|
|
margin-left: auto;
|
|
}
|
|
.gv-activated .gv-desk-mr-auto {
|
|
margin-right: auto;
|
|
}
|
|
.gv-activated .gv-desk-mx-auto {
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
.gv-activated .gv-desk-my-auto {
|
|
margin-top: auto;
|
|
margin-bottom: auto;
|
|
}
|
|
.gv-activated .gv-desk-p-0 {
|
|
padding: 0 !important;
|
|
}
|
|
.gv-activated .gv-desk-pt-0 {
|
|
padding-top: 0 !important;
|
|
}
|
|
.gv-activated .gv-desk-pb-0 {
|
|
padding-bottom: 0 !important;
|
|
}
|
|
.gv-activated .gv-desk-pl-0 {
|
|
padding-left: 0 !important;
|
|
}
|
|
.gv-activated .gv-desk-pr-0 {
|
|
padding-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-desk-px-0 {
|
|
padding-left: 0 !important;
|
|
padding-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-desk-py-0 {
|
|
padding-left: 0 !important;
|
|
padding-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-desk-p-sm {
|
|
padding: 8px;
|
|
}
|
|
.gv-activated .gv-desk-pt-sm {
|
|
padding-top: 8px;
|
|
}
|
|
.gv-activated .gv-desk-pb-sm {
|
|
padding-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-desk-pl-sm {
|
|
padding-left: 8px;
|
|
}
|
|
.gv-activated .gv-desk-pr-sm {
|
|
padding-right: 8px;
|
|
}
|
|
.gv-activated .gv-desk-px-sm {
|
|
padding-left: 8px;
|
|
padding-right: 8px;
|
|
}
|
|
.gv-activated .gv-desk-py-sm {
|
|
padding-top: 8px;
|
|
padding-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-desk-p-md {
|
|
padding: 16px;
|
|
}
|
|
.gv-activated .gv-desk-pt-md {
|
|
padding-top: 16px;
|
|
}
|
|
.gv-activated .gv-desk-pb-md {
|
|
padding-bottom: 16px;
|
|
}
|
|
.gv-activated .gv-desk-pl-md {
|
|
padding-left: 16px;
|
|
}
|
|
.gv-activated .gv-desk-pr-md {
|
|
padding-right: 16px;
|
|
}
|
|
.gv-activated .gv-desk-px-md {
|
|
padding-left: 16px;
|
|
padding-right: 16px;
|
|
}
|
|
.gv-activated .gv-desk-py-md {
|
|
padding-top: 16px;
|
|
padding-bottom: 16px;
|
|
}
|
|
.gv-activated .gv-desk-p-lg {
|
|
padding: 24px;
|
|
}
|
|
.gv-activated .gv-desk-pt-lg {
|
|
padding-top: 24px;
|
|
}
|
|
.gv-activated .gv-desk-pb-lg {
|
|
padding-bottom: 24px;
|
|
}
|
|
.gv-activated .gv-desk-pl-lg {
|
|
padding-left: 24px;
|
|
}
|
|
.gv-activated .gv-desk-pr-lg {
|
|
padding-right: 24px;
|
|
}
|
|
.gv-activated .gv-desk-px-lg {
|
|
padding-left: 24px;
|
|
padding-right: 24px;
|
|
}
|
|
.gv-activated .gv-desk-py-lg {
|
|
padding-top: 24px;
|
|
padding-bottom: 24px;
|
|
}
|
|
.gv-activated .gv-desk-stack-space-sm > *:not(:last-child) {
|
|
margin-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-desk-stack-space-md > *:not(:last-child) {
|
|
margin-bottom: 16px;
|
|
}
|
|
.gv-activated .gv-desk-stack-space-lg > *:not(:last-child) {
|
|
margin-bottom: 24px;
|
|
}
|
|
.gv-activated .gv-desk-text-left {
|
|
text-align: left;
|
|
}
|
|
.gv-activated .gv-desk-text-center {
|
|
text-align: center;
|
|
}
|
|
.gv-activated .gv-desk-text-right {
|
|
text-align: right;
|
|
}
|
|
}
|
|
@media (min-width: 1280px ) {
|
|
.gv-activated {
|
|
/* Flexbox and grid */
|
|
/* Hide */
|
|
/* Spacing */
|
|
/* Text */
|
|
}
|
|
.gv-activated .gv-desk-lg-flex-row {
|
|
flex-direction: row;
|
|
}
|
|
.gv-activated .gv-desk-lg-flex-row-reverse {
|
|
flex-direction: row-reverse;
|
|
}
|
|
.gv-activated .gv-desk-lg-flex-col {
|
|
flex-direction: column;
|
|
}
|
|
.gv-activated .gv-desk-lg-flex-col-reverse {
|
|
flex-direction: column-reverse;
|
|
}
|
|
.gv-activated .gv-desk-lg-content-center {
|
|
align-content: center;
|
|
}
|
|
.gv-activated .gv-desk-lg-items-start {
|
|
align-items: flex-start;
|
|
}
|
|
.gv-activated .gv-desk-lg-items-end {
|
|
align-items: flex-end;
|
|
}
|
|
.gv-activated .gv-desk-lg-items-center {
|
|
align-items: center;
|
|
}
|
|
.gv-activated .gv-desk-lg-items-baseline {
|
|
align-items: baseline;
|
|
}
|
|
.gv-activated .gv-desk-lg-items-stretch {
|
|
align-items: stretch;
|
|
}
|
|
.gv-activated .gv-desk-lg-justify-start {
|
|
justify-content: flex-start;
|
|
}
|
|
.gv-activated .gv-desk-lg-justify-end {
|
|
justify-content: flex-end;
|
|
}
|
|
.gv-activated .gv-desk-lg-justify-center {
|
|
justify-content: center;
|
|
}
|
|
.gv-activated .gv-desk-lg-justify-between {
|
|
justify-content: space-between;
|
|
}
|
|
.gv-activated .gv-desk-lg-justify-around {
|
|
justify-content: space-around;
|
|
}
|
|
.gv-activated .gv-desk-lg-justify-evenly {
|
|
justify-content: space-evenly;
|
|
}
|
|
.gv-activated .gv-desk-lg-order-first {
|
|
order: -1;
|
|
}
|
|
.gv-activated .gv-desk-lg-order-last {
|
|
order: 99;
|
|
}
|
|
.gv-activated .gv-desk-lg-gap-sm {
|
|
gap: 8px;
|
|
}
|
|
.gv-activated .gv-desk-lg-gap-md {
|
|
gap: 16px;
|
|
}
|
|
.gv-activated .gv-desk-lg-gap-lg {
|
|
gap: 24px;
|
|
}
|
|
.gv-activated .gv-desk-lg-gap-0 {
|
|
gap: 0 !important;
|
|
}
|
|
.gv-activated .gv-desk-lg-flex {
|
|
display: flex;
|
|
}
|
|
.gv-activated .gv-desk-lg-block {
|
|
display: block;
|
|
}
|
|
.gv-activated .gv-desk-lg-inline {
|
|
display: inline;
|
|
}
|
|
.gv-activated .gv-desk-lg-inline-block {
|
|
display: inline-block;
|
|
}
|
|
.gv-activated .gv-desk-lg-hidden {
|
|
display: none;
|
|
}
|
|
.gv-activated .gv-desk-lg-invisible {
|
|
visibility: hidden;
|
|
}
|
|
.gv-activated .gv-desk-lg-collapse {
|
|
visibility: collapse;
|
|
}
|
|
.gv-activated .gv-desk-lg-m-0 {
|
|
margin: 0 !important;
|
|
}
|
|
.gv-activated .gv-desk-lg-mt-0 {
|
|
margin-top: 0 !important;
|
|
}
|
|
.gv-activated .gv-desk-lg-mb-0 {
|
|
margin-bottom: 0 !important;
|
|
}
|
|
.gv-activated .gv-desk-lg-ml-0 {
|
|
margin-left: 0 !important;
|
|
}
|
|
.gv-activated .gv-desk-lg-mr-0 {
|
|
margin-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-desk-lg-mx-0 {
|
|
margin-left: 0 !important;
|
|
margin-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-desk-lg-my-0 {
|
|
margin-left: 0 !important;
|
|
margin-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-desk-lg-m-sm {
|
|
margin: 8px;
|
|
}
|
|
.gv-activated .gv-desk-lg-mt-sm {
|
|
margin-top: 8px;
|
|
}
|
|
.gv-activated .gv-desk-lg-mb-sm {
|
|
margin-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-desk-lg-ml-sm {
|
|
margin-left: 8px;
|
|
}
|
|
.gv-activated .gv-desk-lg-mr-sm {
|
|
margin-right: 8px;
|
|
}
|
|
.gv-activated .gv-desk-lg-mx-sm {
|
|
margin-left: 8px;
|
|
margin-right: 8px;
|
|
}
|
|
.gv-activated .gv-desk-lg-my-sm {
|
|
margin-top: 8px;
|
|
margin-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-desk-lg-m-md {
|
|
margin: 16px;
|
|
}
|
|
.gv-activated .gv-desk-lg-mt-md {
|
|
margin-top: 16px;
|
|
}
|
|
.gv-activated .gv-desk-lg-mb-md {
|
|
margin-bottom: 16px;
|
|
}
|
|
.gv-activated .gv-desk-lg-ml-md {
|
|
margin-left: 16px;
|
|
}
|
|
.gv-activated .gv-desk-lg-mr-md {
|
|
margin-right: 16px;
|
|
}
|
|
.gv-activated .gv-desk-lg-mx-md {
|
|
margin-left: 16px;
|
|
margin-right: 16px;
|
|
}
|
|
.gv-activated .gv-desk-lg-my-md {
|
|
margin-top: 16px;
|
|
margin-bottom: 16px;
|
|
}
|
|
.gv-activated .gv-desk-lg-m-lg {
|
|
margin: 24px;
|
|
}
|
|
.gv-activated .gv-desk-lg-mt-lg {
|
|
margin-top: 24px;
|
|
}
|
|
.gv-activated .gv-desk-lg-mb-lg {
|
|
margin-bottom: 24px;
|
|
}
|
|
.gv-activated .gv-desk-lg-ml-lg {
|
|
margin-left: 24px;
|
|
}
|
|
.gv-activated .gv-desk-lg-mr-lg {
|
|
margin-right: 24px;
|
|
}
|
|
.gv-activated .gv-desk-lg-mx-lg {
|
|
margin-left: 24px;
|
|
margin-right: 24px;
|
|
}
|
|
.gv-activated .gv-desk-lg-my-lg {
|
|
margin-top: 24px;
|
|
margin-bottom: 24px;
|
|
}
|
|
.gv-activated .gv-desk-lg-m-auto {
|
|
margin: auto;
|
|
}
|
|
.gv-activated .gv-desk-lg-mt-auto {
|
|
margin-top: auto;
|
|
}
|
|
.gv-activated .gv-desk-lg-mb-auto {
|
|
margin-bottom: auto;
|
|
}
|
|
.gv-activated .gv-desk-lg-ml-auto {
|
|
margin-left: auto;
|
|
}
|
|
.gv-activated .gv-desk-lg-mr-auto {
|
|
margin-right: auto;
|
|
}
|
|
.gv-activated .gv-desk-lg-mx-auto {
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
.gv-activated .gv-desk-lg-my-auto {
|
|
margin-top: auto;
|
|
margin-bottom: auto;
|
|
}
|
|
.gv-activated .gv-desk-lg-p-0 {
|
|
padding: 0 !important;
|
|
}
|
|
.gv-activated .gv-desk-lg-pt-0 {
|
|
padding-top: 0 !important;
|
|
}
|
|
.gv-activated .gv-desk-lg-pb-0 {
|
|
padding-bottom: 0 !important;
|
|
}
|
|
.gv-activated .gv-desk-lg-pl-0 {
|
|
padding-left: 0 !important;
|
|
}
|
|
.gv-activated .gv-desk-lg-pr-0 {
|
|
padding-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-desk-lg-px-0 {
|
|
padding-left: 0 !important;
|
|
padding-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-desk-lg-py-0 {
|
|
padding-left: 0 !important;
|
|
padding-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-desk-lg-p-sm {
|
|
padding: 8px;
|
|
}
|
|
.gv-activated .gv-desk-lg-pt-sm {
|
|
padding-top: 8px;
|
|
}
|
|
.gv-activated .gv-desk-lg-pb-sm {
|
|
padding-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-desk-lg-pl-sm {
|
|
padding-left: 8px;
|
|
}
|
|
.gv-activated .gv-desk-lg-pr-sm {
|
|
padding-right: 8px;
|
|
}
|
|
.gv-activated .gv-desk-lg-px-sm {
|
|
padding-left: 8px;
|
|
padding-right: 8px;
|
|
}
|
|
.gv-activated .gv-desk-lg-py-sm {
|
|
padding-top: 8px;
|
|
padding-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-desk-lg-p-md {
|
|
padding: 16px;
|
|
}
|
|
.gv-activated .gv-desk-lg-pt-md {
|
|
padding-top: 16px;
|
|
}
|
|
.gv-activated .gv-desk-lg-pb-md {
|
|
padding-bottom: 16px;
|
|
}
|
|
.gv-activated .gv-desk-lg-pl-md {
|
|
padding-left: 16px;
|
|
}
|
|
.gv-activated .gv-desk-lg-pr-md {
|
|
padding-right: 16px;
|
|
}
|
|
.gv-activated .gv-desk-lg-px-md {
|
|
padding-left: 16px;
|
|
padding-right: 16px;
|
|
}
|
|
.gv-activated .gv-desk-lg-py-md {
|
|
padding-top: 16px;
|
|
padding-bottom: 16px;
|
|
}
|
|
.gv-activated .gv-desk-lg-p-lg {
|
|
padding: 24px;
|
|
}
|
|
.gv-activated .gv-desk-lg-pt-lg {
|
|
padding-top: 24px;
|
|
}
|
|
.gv-activated .gv-desk-lg-pb-lg {
|
|
padding-bottom: 24px;
|
|
}
|
|
.gv-activated .gv-desk-lg-pl-lg {
|
|
padding-left: 24px;
|
|
}
|
|
.gv-activated .gv-desk-lg-pr-lg {
|
|
padding-right: 24px;
|
|
}
|
|
.gv-activated .gv-desk-lg-px-lg {
|
|
padding-left: 24px;
|
|
padding-right: 24px;
|
|
}
|
|
.gv-activated .gv-desk-lg-py-lg {
|
|
padding-top: 24px;
|
|
padding-bottom: 24px;
|
|
}
|
|
.gv-activated .gv-desk-lg-stack-space-sm > *:not(:last-child) {
|
|
margin-bottom: 8px;
|
|
}
|
|
.gv-activated .gv-desk-lg-stack-space-md > *:not(:last-child) {
|
|
margin-bottom: 16px;
|
|
}
|
|
.gv-activated .gv-desk-lg-stack-space-lg > *:not(:last-child) {
|
|
margin-bottom: 24px;
|
|
}
|
|
.gv-activated .gv-desk-lg-text-left {
|
|
text-align: left;
|
|
}
|
|
.gv-activated .gv-desk-lg-text-center {
|
|
text-align: center;
|
|
}
|
|
.gv-activated .gv-desk-lg-text-right {
|
|
text-align: right;
|
|
}
|
|
}
|
|
.gv-activated .gv-margin-sm {
|
|
margin: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-margin-md {
|
|
margin: var(--size-md);
|
|
}
|
|
.gv-activated .gv-margin-lg {
|
|
margin: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-margin-top-sm {
|
|
margin-top: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-margin-top-md {
|
|
margin-top: var(--size-md);
|
|
}
|
|
.gv-activated .gv-margin-top-lg {
|
|
margin-top: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-margin-bottom-sm {
|
|
margin-bottom: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-margin-bottom-md {
|
|
margin-bottom: var(--size-md);
|
|
}
|
|
.gv-activated .gv-margin-bottom-lg {
|
|
margin-bottom: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-margin-left-sm {
|
|
margin-left: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-margin-left-md {
|
|
margin-left: var(--size-md);
|
|
}
|
|
.gv-activated .gv-margin-left-lg {
|
|
margin-left: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-margin-right-sm {
|
|
margin-right: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-margin-right-md {
|
|
margin-right: var(--size-md);
|
|
}
|
|
.gv-activated .gv-margin-right-lg {
|
|
margin-right: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-padding-sm {
|
|
padding: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-padding-md {
|
|
padding: var(--size-md);
|
|
}
|
|
.gv-activated .gv-padding-lg {
|
|
padding: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-padding-top-sm {
|
|
padding-top: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-padding-top-md {
|
|
padding-top: var(--size-md);
|
|
}
|
|
.gv-activated .gv-padding-top-lg {
|
|
padding-top: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-padding-bottom-sm {
|
|
padding-bottom: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-padding-bottom-md {
|
|
padding-bottom: var(--size-md);
|
|
}
|
|
.gv-activated .gv-padding-bottom-lg {
|
|
padding-bottom: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-padding-left-sm {
|
|
padding-left: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-padding-left-md {
|
|
padding-left: var(--size-md);
|
|
}
|
|
.gv-activated .gv-padding-left-lg {
|
|
padding-left: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-padding-right-sm {
|
|
padding-right: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-padding-right-md {
|
|
padding-right: var(--size-md);
|
|
}
|
|
.gv-activated .gv-padding-right-lg {
|
|
padding-right: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-no-margin {
|
|
margin: 0 !important;
|
|
}
|
|
.gv-activated .gv-no-margin-top {
|
|
margin-top: 0 !important;
|
|
}
|
|
.gv-activated .gv-no-margin-bottom {
|
|
margin-bottom: 0 !important;
|
|
}
|
|
.gv-activated .gv-no-margin-top-bottom {
|
|
margin-top: 0 !important;
|
|
margin-bottom: 0 !important;
|
|
}
|
|
.gv-activated .gv-no-margin-left {
|
|
margin-left: 0 !important;
|
|
}
|
|
.gv-activated .gv-no-margin-right {
|
|
margin-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-no-margin-left-right {
|
|
margin-left: 0 !important;
|
|
margin-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-no-padding {
|
|
padding: 0 !important;
|
|
}
|
|
.gv-activated .gv-no-padding-top {
|
|
padding-top: 0 !important;
|
|
}
|
|
.gv-activated .gv-no-padding-bottom {
|
|
padding-bottom: 0 !important;
|
|
}
|
|
.gv-activated .gv-no-padding-top-bottom {
|
|
padding-top: 0 !important;
|
|
padding-bottom: 0 !important;
|
|
}
|
|
.gv-activated .gv-no-padding-left {
|
|
padding-left: 0 !important;
|
|
}
|
|
.gv-activated .gv-no-padding-right {
|
|
padding-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-no-padding-left-right {
|
|
padding-left: 0 !important;
|
|
padding-right: 0 !important;
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-fluid-margin {
|
|
margin: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-fluid-margin {
|
|
margin: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-fluid-margin {
|
|
margin: 48px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-fluid-margin-top {
|
|
margin-top: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-fluid-margin-top {
|
|
margin-top: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-fluid-margin-top {
|
|
margin-top: 48px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-fluid-margin-bottom {
|
|
margin-bottom: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-fluid-margin-bottom {
|
|
margin-bottom: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-fluid-margin-bottom {
|
|
margin-bottom: 48px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-fluid-margin-left {
|
|
margin-left: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-fluid-margin-left {
|
|
margin-left: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-fluid-margin-left {
|
|
margin-left: 48px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-fluid-margin-right {
|
|
margin-right: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-fluid-margin-right {
|
|
margin-right: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-fluid-margin-right {
|
|
margin-right: 48px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-fluid-margin-top-bottom {
|
|
margin-top: 24px;
|
|
margin-bottom: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-fluid-margin-top-bottom {
|
|
margin-top: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
margin-bottom: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-fluid-margin-top-bottom {
|
|
margin-top: 48px;
|
|
margin-bottom: 48px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-fluid-margin-left-right {
|
|
margin-left: 24px;
|
|
margin-right: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-fluid-margin-left-right {
|
|
margin-left: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
margin-right: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-fluid-margin-left-right {
|
|
margin-left: 48px;
|
|
margin-right: 48px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-fluid-padding {
|
|
padding: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-fluid-padding {
|
|
padding: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-fluid-padding {
|
|
padding: 48px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-fluid-padding-top {
|
|
padding-top: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-fluid-padding-top {
|
|
padding-top: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-fluid-padding-top {
|
|
padding-top: 48px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-fluid-padding-bottom {
|
|
padding-bottom: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-fluid-padding-bottom {
|
|
padding-bottom: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-fluid-padding-bottom {
|
|
padding-bottom: 48px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-fluid-padding-left {
|
|
padding-left: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-fluid-padding-left {
|
|
padding-left: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-fluid-padding-left {
|
|
padding-left: 48px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-fluid-padding-right {
|
|
padding-right: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-fluid-padding-right {
|
|
padding-right: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-fluid-padding-right {
|
|
padding-right: 48px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-fluid-padding-top-bottom {
|
|
padding-top: 24px;
|
|
padding-bottom: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-fluid-padding-top-bottom {
|
|
padding-top: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
padding-bottom: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-fluid-padding-top-bottom {
|
|
padding-top: 48px;
|
|
padding-bottom: 48px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px) {
|
|
.gv-activated .gv-fluid-padding-left-right {
|
|
padding-left: 24px;
|
|
padding-right: 24px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 361px) and (max-width: 1439px) {
|
|
.gv-activated .gv-fluid-padding-left-right {
|
|
padding-left: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
padding-right: calc(24px + 24 * ((100vw - 360px ) / 1080 ));
|
|
}
|
|
}
|
|
@media screen and (min-width: 1440px) {
|
|
.gv-activated .gv-fluid-padding-left-right {
|
|
padding-left: 48px;
|
|
padding-right: 48px;
|
|
}
|
|
}
|
|
@media (max-width: 599px ) {
|
|
.gv-activated .gv-mobile-margin-sm {
|
|
margin: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-mobile-margin-md {
|
|
margin: var(--size-md);
|
|
}
|
|
.gv-activated .gv-mobile-margin-lg {
|
|
margin: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-mobile-margin-top-sm {
|
|
margin-top: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-mobile-margin-top-md {
|
|
margin-top: var(--size-md);
|
|
}
|
|
.gv-activated .gv-mobile-margin-top-lg {
|
|
margin-top: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-mobile-margin-bottom-sm {
|
|
margin-bottom: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-mobile-margin-bottom-md {
|
|
margin-bottom: var(--size-md);
|
|
}
|
|
.gv-activated .gv-mobile-margin-bottom-lg {
|
|
margin-bottom: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-mobile-margin-left-sm {
|
|
margin-left: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-mobile-margin-left-md {
|
|
margin-left: var(--size-md);
|
|
}
|
|
.gv-activated .gv-mobile-margin-left-lg {
|
|
margin-left: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-mobile-margin-right-sm {
|
|
margin-right: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-mobile-margin-right-md {
|
|
margin-right: var(--size-md);
|
|
}
|
|
.gv-activated .gv-mobile-margin-right-lg {
|
|
margin-right: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-mobile-padding-sm {
|
|
padding: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-mobile-padding-md {
|
|
padding: var(--size-md);
|
|
}
|
|
.gv-activated .gv-mobile-padding-lg {
|
|
padding: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-mobile-padding-top-sm {
|
|
padding-top: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-mobile-padding-top-md {
|
|
padding-top: var(--size-md);
|
|
}
|
|
.gv-activated .gv-mobile-padding-top-lg {
|
|
padding-top: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-mobile-padding-bottom-sm {
|
|
padding-bottom: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-mobile-padding-bottom-md {
|
|
padding-bottom: var(--size-md);
|
|
}
|
|
.gv-activated .gv-mobile-padding-bottom-lg {
|
|
padding-bottom: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-mobile-padding-left-sm {
|
|
padding-left: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-mobile-padding-left-md {
|
|
padding-left: var(--size-md);
|
|
}
|
|
.gv-activated .gv-mobile-padding-left-lg {
|
|
padding-left: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-mobile-padding-right-sm {
|
|
padding-right: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-mobile-padding-right-md {
|
|
padding-right: var(--size-md);
|
|
}
|
|
.gv-activated .gv-mobile-padding-right-lg {
|
|
padding-right: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-mobile-no-margin {
|
|
margin: 0 !important;
|
|
}
|
|
.gv-activated .gv-mobile-no-margin-top {
|
|
margin-top: 0 !important;
|
|
}
|
|
.gv-activated .gv-mobile-no-margin-bottom {
|
|
margin-bottom: 0 !important;
|
|
}
|
|
.gv-activated .gv-mobile-no-margin-top-bottom {
|
|
margin-top: 0 !important;
|
|
margin-bottom: 0 !important;
|
|
}
|
|
.gv-activated .gv-mobile-no-margin-left {
|
|
margin-left: 0 !important;
|
|
}
|
|
.gv-activated .gv-mobile-no-margin-right {
|
|
margin-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-mobile-no-margin-left-right {
|
|
margin-left: 0 !important;
|
|
margin-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-mobile-no-padding {
|
|
padding: 0 !important;
|
|
}
|
|
.gv-activated .gv-mobile-no-padding-top {
|
|
padding-top: 0 !important;
|
|
}
|
|
.gv-activated .gv-mobile-no-padding-bottom {
|
|
padding-bottom: 0 !important;
|
|
}
|
|
.gv-activated .gv-mobile-no-padding-top-bottom {
|
|
padding-top: 0 !important;
|
|
padding-bottom: 0 !important;
|
|
}
|
|
.gv-activated .gv-mobile-no-padding-left {
|
|
padding-left: 0 !important;
|
|
}
|
|
.gv-activated .gv-mobile-no-padding-right {
|
|
padding-right: 0 !important;
|
|
}
|
|
.gv-activated .gv-mobile-no-padding-left-right {
|
|
padding-left: 0 !important;
|
|
padding-right: 0 !important;
|
|
}
|
|
}
|
|
@media (min-width: 600px ) and (max-width: 1023px ) {
|
|
.gv-activated .gv-tablet-margin-sm {
|
|
margin: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-tablet-margin-md {
|
|
margin: var(--size-md);
|
|
}
|
|
.gv-activated .gv-tablet-margin-lg {
|
|
margin: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-tablet-margin-top-sm {
|
|
margin-top: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-tablet-margin-top-md {
|
|
margin-top: var(--size-md);
|
|
}
|
|
.gv-activated .gv-tablet-margin-top-lg {
|
|
margin-top: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-tablet-margin-bottom-sm {
|
|
margin-bottom: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-tablet-margin-bottom-md {
|
|
margin-bottom: var(--size-md);
|
|
}
|
|
.gv-activated .gv-tablet-margin-bottom-lg {
|
|
margin-bottom: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-tablet-margin-left-sm {
|
|
margin-left: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-tablet-margin-left-md {
|
|
margin-left: var(--size-md);
|
|
}
|
|
.gv-activated .gv-tablet-margin-left-lg {
|
|
margin-left: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-tablet-margin-right-sm {
|
|
margin-right: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-tablet-margin-right-md {
|
|
margin-right: var(--size-md);
|
|
}
|
|
.gv-activated .gv-tablet-margin-right-lg {
|
|
margin-right: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-tablet-padding-sm {
|
|
padding: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-tablet-padding-md {
|
|
padding: var(--size-md);
|
|
}
|
|
.gv-activated .gv-tablet-padding-lg {
|
|
padding: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-tablet-padding-top-sm {
|
|
padding-top: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-tablet-padding-top-md {
|
|
padding-top: var(--size-md);
|
|
}
|
|
.gv-activated .gv-tablet-padding-top-lg {
|
|
padding-top: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-tablet-padding-bottom-sm {
|
|
padding-bottom: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-tablet-padding-bottom-md {
|
|
padding-bottom: var(--size-md);
|
|
}
|
|
.gv-activated .gv-tablet-padding-bottom-lg {
|
|
padding-bottom: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-tablet-padding-left-sm {
|
|
padding-left: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-tablet-padding-left-md {
|
|
padding-left: var(--size-md);
|
|
}
|
|
.gv-activated .gv-tablet-padding-left-lg {
|
|
padding-left: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-tablet-padding-right-sm {
|
|
padding-right: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-tablet-padding-right-md {
|
|
padding-right: var(--size-md);
|
|
}
|
|
.gv-activated .gv-tablet-padding-right-lg {
|
|
padding-right: var(--size-lg);
|
|
}
|
|
}
|
|
@media (min-width: 600px ) and (max-width: 767px ) {
|
|
.gv-activated .gv-tablet-small-margin-sm {
|
|
margin: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-tablet-small-margin-md {
|
|
margin: var(--size-md);
|
|
}
|
|
.gv-activated .gv-tablet-small-margin-lg {
|
|
margin: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-tablet-small-margin-top-sm {
|
|
margin-top: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-tablet-small-margin-top-md {
|
|
margin-top: var(--size-md);
|
|
}
|
|
.gv-activated .gv-tablet-small-margin-top-lg {
|
|
margin-top: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-tablet-small-margin-bottom-sm {
|
|
margin-bottom: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-tablet-small-margin-bottom-md {
|
|
margin-bottom: var(--size-md);
|
|
}
|
|
.gv-activated .gv-tablet-small-margin-bottom-lg {
|
|
margin-bottom: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-tablet-small-margin-left-sm {
|
|
margin-left: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-tablet-small-margin-left-md {
|
|
margin-left: var(--size-md);
|
|
}
|
|
.gv-activated .gv-tablet-small-margin-left-lg {
|
|
margin-left: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-tablet-small-margin-right-sm {
|
|
margin-right: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-tablet-small-margin-right-md {
|
|
margin-right: var(--size-md);
|
|
}
|
|
.gv-activated .gv-tablet-small-margin-right-lg {
|
|
margin-right: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-tablet-small-padding-sm {
|
|
padding: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-tablet-small-padding-md {
|
|
padding: var(--size-md);
|
|
}
|
|
.gv-activated .gv-tablet-small-padding-lg {
|
|
padding: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-tablet-small-padding-top-sm {
|
|
padding-top: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-tablet-small-padding-top-md {
|
|
padding-top: var(--size-md);
|
|
}
|
|
.gv-activated .gv-tablet-small-padding-top-lg {
|
|
padding-top: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-tablet-small-padding-bottom-sm {
|
|
padding-bottom: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-tablet-small-padding-bottom-md {
|
|
padding-bottom: var(--size-md);
|
|
}
|
|
.gv-activated .gv-tablet-small-padding-bottom-lg {
|
|
padding-bottom: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-tablet-small-padding-left-sm {
|
|
padding-left: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-tablet-small-padding-left-md {
|
|
padding-left: var(--size-md);
|
|
}
|
|
.gv-activated .gv-tablet-small-padding-left-lg {
|
|
padding-left: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-tablet-small-padding-right-sm {
|
|
padding-right: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-tablet-small-padding-right-md {
|
|
padding-right: var(--size-md);
|
|
}
|
|
.gv-activated .gv-tablet-small-padding-right-lg {
|
|
padding-right: var(--size-lg);
|
|
}
|
|
}
|
|
@media (min-width: 768px ) and (max-width: 1023px ) {
|
|
.gv-activated .gv-tablet-large-margin-sm {
|
|
margin: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-tablet-large-margin-md {
|
|
margin: var(--size-md);
|
|
}
|
|
.gv-activated .gv-tablet-large-margin-lg {
|
|
margin: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-tablet-large-margin-top-sm {
|
|
margin-top: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-tablet-large-margin-top-md {
|
|
margin-top: var(--size-md);
|
|
}
|
|
.gv-activated .gv-tablet-large-margin-top-lg {
|
|
margin-top: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-tablet-large-margin-bottom-sm {
|
|
margin-bottom: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-tablet-large-margin-bottom-md {
|
|
margin-bottom: var(--size-md);
|
|
}
|
|
.gv-activated .gv-tablet-large-margin-bottom-lg {
|
|
margin-bottom: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-tablet-large-margin-left-sm {
|
|
margin-left: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-tablet-large-margin-left-md {
|
|
margin-left: var(--size-md);
|
|
}
|
|
.gv-activated .gv-tablet-large-margin-left-lg {
|
|
margin-left: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-tablet-large-margin-right-sm {
|
|
margin-right: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-tablet-large-margin-right-md {
|
|
margin-right: var(--size-md);
|
|
}
|
|
.gv-activated .gv-tablet-large-margin-right-lg {
|
|
margin-right: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-tablet-large-padding-sm {
|
|
padding: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-tablet-large-padding-md {
|
|
padding: var(--size-md);
|
|
}
|
|
.gv-activated .gv-tablet-large-padding-lg {
|
|
padding: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-tablet-large-padding-top-sm {
|
|
padding-top: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-tablet-large-padding-top-md {
|
|
padding-top: var(--size-md);
|
|
}
|
|
.gv-activated .gv-tablet-large-padding-top-lg {
|
|
padding-top: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-tablet-large-padding-bottom-sm {
|
|
padding-bottom: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-tablet-large-padding-bottom-md {
|
|
padding-bottom: var(--size-md);
|
|
}
|
|
.gv-activated .gv-tablet-large-padding-bottom-lg {
|
|
padding-bottom: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-tablet-large-padding-left-sm {
|
|
padding-left: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-tablet-large-padding-left-md {
|
|
padding-left: var(--size-md);
|
|
}
|
|
.gv-activated .gv-tablet-large-padding-left-lg {
|
|
padding-left: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-tablet-large-padding-right-sm {
|
|
padding-right: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-tablet-large-padding-right-md {
|
|
padding-right: var(--size-md);
|
|
}
|
|
.gv-activated .gv-tablet-large-padding-right-lg {
|
|
padding-right: var(--size-lg);
|
|
}
|
|
}
|
|
@media (min-width: 1024px ) {
|
|
.gv-activated .gv-desktop-margin-sm {
|
|
margin: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-desktop-margin-md {
|
|
margin: var(--size-md);
|
|
}
|
|
.gv-activated .gv-desktop-margin-lg {
|
|
margin: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-desktop-margin-top-sm {
|
|
margin-top: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-desktop-margin-top-md {
|
|
margin-top: var(--size-md);
|
|
}
|
|
.gv-activated .gv-desktop-margin-top-lg {
|
|
margin-top: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-desktop-margin-bottom-sm {
|
|
margin-bottom: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-desktop-margin-bottom-md {
|
|
margin-bottom: var(--size-md);
|
|
}
|
|
.gv-activated .gv-desktop-margin-bottom-lg {
|
|
margin-bottom: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-desktop-margin-left-sm {
|
|
margin-left: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-desktop-margin-left-md {
|
|
margin-left: var(--size-md);
|
|
}
|
|
.gv-activated .gv-desktop-margin-left-lg {
|
|
margin-left: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-desktop-margin-right-sm {
|
|
margin-right: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-desktop-margin-right-md {
|
|
margin-right: var(--size-md);
|
|
}
|
|
.gv-activated .gv-desktop-margin-right-lg {
|
|
margin-right: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-desktop-padding-sm {
|
|
padding: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-desktop-padding-md {
|
|
padding: var(--size-md);
|
|
}
|
|
.gv-activated .gv-desktop-padding-lg {
|
|
padding: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-desktop-padding-top-sm {
|
|
padding-top: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-desktop-padding-top-md {
|
|
padding-top: var(--size-md);
|
|
}
|
|
.gv-activated .gv-desktop-padding-top-lg {
|
|
padding-top: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-desktop-padding-bottom-sm {
|
|
padding-bottom: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-desktop-padding-bottom-md {
|
|
padding-bottom: var(--size-md);
|
|
}
|
|
.gv-activated .gv-desktop-padding-bottom-lg {
|
|
padding-bottom: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-desktop-padding-left-sm {
|
|
padding-left: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-desktop-padding-left-md {
|
|
padding-left: var(--size-md);
|
|
}
|
|
.gv-activated .gv-desktop-padding-left-lg {
|
|
padding-left: var(--size-lg);
|
|
}
|
|
.gv-activated .gv-desktop-padding-right-sm {
|
|
padding-right: var(--size-sm);
|
|
}
|
|
.gv-activated .gv-desktop-padding-right-md {
|
|
padding-right: var(--size-md);
|
|
}
|
|
.gv-activated .gv-desktop-padding-right-lg {
|
|
padding-right: var(--size-lg);
|
|
}
|
|
}
|
|
/* Deprecated - Margin and padding mixins */
|
|
/* Deprecated - Remove spacing mixin */
|
|
/* Deprecated - Fluid mixin */
|
|
/* Brand bootstrapping */
|
|
.gv-activated {
|
|
/* Universal sizes */
|
|
--size-xs: 4px;
|
|
--size-sm: 8px;
|
|
--size-md: 16px;
|
|
--size-lg: 24px;
|
|
--size-xl: 48px;
|
|
--size-border: 1px;
|
|
/* Icon sizes */
|
|
--size-icon-sm: 20px;
|
|
--size-icon-md: 24px;
|
|
/* Tile sizes */
|
|
--size-tile-sm: 48px;
|
|
--size-tile-md: 72px;
|
|
--size-tile-lg: 96px;
|
|
--size-tile-xl: 144px;
|
|
/* Section sizes */
|
|
--size-section-x-min: 24px;
|
|
--size-section-x-max: 160px;
|
|
--size-section-y-min: 48px;
|
|
--size-section-y-max: 96px;
|
|
/* Font weights */
|
|
--font-weight-regular: 400;
|
|
--font-weight-medium: 500;
|
|
--font-weight-semibold: 600;
|
|
--font-weight-bold: 700;
|
|
/* Line-heights */
|
|
--line-height-body: 1.5;
|
|
--line-height-heading: 1.3;
|
|
/**
|
|
* Generic colors, these are defined by the gravity design system. If you want the brand specific colors, use the
|
|
* "[brand]-styles.less" file.
|
|
*/
|
|
--color-gray-100: #ffffff;
|
|
--color-gray-200: #f7f7f7;
|
|
--color-gray-300: #e2e2e2;
|
|
--color-gray-400: #cecece;
|
|
--color-gray-500: #69686b;
|
|
--color-gray-600: #3a383e;
|
|
--color-gray-700: #282629;
|
|
--color-gray-800: #1e1d1f;
|
|
--color-gray-900: #141414;
|
|
/* On fixed */
|
|
--color-on-fixed-white: var(--color-gray-100);
|
|
--color-on-fixed-black: var(--color-gray-900);
|
|
/* On body */
|
|
--color-body-on-default: var(--color-gray-900);
|
|
--color-body-on-alternative: var(--color-gray-500);
|
|
--color-body-on-inverted: var(--color-gray-200);
|
|
--color-body-on-placeholder: var(--color-gray-500);
|
|
--color-body-on-disabled: rgba(20, 20, 20, 0.5);
|
|
/* Button */
|
|
--color-button-bg-primary: var(--color-primary);
|
|
--color-button-bg-cta: var(--color-cta);
|
|
--color-button-border-secondary: var(--color-primary);
|
|
--color-button-fg-on: var(--color-on-fixed-white);
|
|
--color-button-fg-on-primary: var(--color-button-fg-on);
|
|
--color-button-fg-on-cta: var(--color-button-fg-on);
|
|
/* Link */
|
|
--color-link: var(--color-body-on-default);
|
|
/* Surface */
|
|
--color-surface-bright: var(--color-gray-100);
|
|
--color-surface-dim: var(--color-gray-200);
|
|
--color-surface-muted: var(--color-gray-300);
|
|
--color-surface-inverted: var(--color-gray-700);
|
|
--color-surface-form: var(--color-gray-200);
|
|
--color-surface-form-disabled: rgba(247, 247, 247, 0.5);
|
|
--color-surface-highlight: var(--color-state-active);
|
|
/* Illustration */
|
|
--color-illustration-background: var(--color-gray-100);
|
|
--color-illustration-gray: var(--color-gray-200);
|
|
--color-illustration-line: var(--color-gray-900);
|
|
/* Shades */
|
|
--color-overlay-dark: rgba(20, 20, 20, 0.6);
|
|
--color-overlay-light: rgba(255, 255, 255, 0.8);
|
|
--color-shadow-subtle: 0 1px 1px 0 rgba(20, 20, 20, 0.05);
|
|
--color-shadow-elevated: 0 2px 2px 0 rgba(20, 20, 20, 0.05);
|
|
/* Opacity */
|
|
--opacity-active-elements: 0.7;
|
|
--opacity-disabled-elements: 0.5;
|
|
/**
|
|
* Signal colors, these are not separated by brand.
|
|
* They are used in things like badges and notices.
|
|
* While it may seem like there is duplication here with brand colors, these are fixed between brands.
|
|
*/
|
|
--color-signal-alert: #c70018;
|
|
--color-signal-alert-light: #f8d9dd;
|
|
--color-signal-info: #0066aa;
|
|
--color-signal-info-light: #d9ebf7;
|
|
--color-signal-success: #5d9a18;
|
|
--color-signal-success-light: #ddedca;
|
|
--color-signal-warning: #db7300;
|
|
--color-signal-warning-light: #ffedd9;
|
|
/* Borders */
|
|
--color-border: var(--color-gray-400);
|
|
--color-border-alt: var(--color-gray-300);
|
|
--color-border-form: var(--color-border);
|
|
--color-border-form-disabled: rgba(206, 206, 206, 0.5);
|
|
--border-radius: 4px;
|
|
--button-radius: var(--border-radius);
|
|
--input-radius: var(--border-radius);
|
|
--card-radius: var(--border-radius);
|
|
--notice-radius: var(--border-radius);
|
|
--chip-radius: 100px;
|
|
/* Form */
|
|
--color-state-form-active: #0066aa;
|
|
--color-fg-form-on: var(--color-gray-100);
|
|
--form-element-height: 48px;
|
|
/* Zebra */
|
|
--color-zebra-odd: var(--color-surface-dim);
|
|
--color-zebra-even: var(--color-surface-bright);
|
|
--color-zebra-hover: var(--color-state-hover);
|
|
/* Navigation */
|
|
--navigation-bar-height: 56px;
|
|
--color-primary: #0078c8;
|
|
--color-secondary: #76b82a;
|
|
--color-cta: var(--color-secondary);
|
|
--color-illustration-100: #ebf5df;
|
|
--color-illustration-200: #d9ebf7;
|
|
--color-illustration-300: #a6d0ec;
|
|
--color-state-active: #d9ebf7;
|
|
--color-state-hover: #f2f8fc;
|
|
--color-state-focus: #59a7db;
|
|
--color-loader-primary: var(--color-primary);
|
|
--color-loader-secondary: #b3d7ef;
|
|
}
|
|
.gv-activated.gv-dark-mode {
|
|
/* On body */
|
|
--color-body-on-default: var(--color-gray-200);
|
|
--color-body-on-alternative: var(--color-gray-400);
|
|
--color-body-on-inverted: var(--color-gray-900);
|
|
--color-body-on-placeholder: var(--color-gray-400);
|
|
--color-body-on-disabled: rgba(247, 247, 247, 0.5);
|
|
/* Surface */
|
|
--color-surface-bright: var(--color-gray-700);
|
|
--color-surface-dim: var(--color-gray-800);
|
|
--color-surface-muted: var(--color-gray-600);
|
|
--color-surface-inverted: var(--color-gray-100);
|
|
--color-surface-form: var(--color-gray-600);
|
|
--color-surface-form-disabled: rgba(58, 56, 62, 0.5);
|
|
/* Illustration */
|
|
--color-illustration-background: var(--color-gray-700);
|
|
--color-illustration-gray: var(--color-gray-500);
|
|
--color-illustration-line: var(--color-gray-200);
|
|
/* Shades */
|
|
--color-overlay-light: rgba(20, 20, 20, 0.8);
|
|
/* Signal colors */
|
|
--color-signal-alert: #f18c99;
|
|
--color-signal-alert-light: #850d0a;
|
|
--color-signal-info: #d9ebf7;
|
|
--color-signal-info-light: #235c9d;
|
|
--color-signal-success: #d7f4b5;
|
|
--color-signal-success-light: #186065;
|
|
--color-signal-warning: #febf79;
|
|
--color-signal-warning-light: #856304;
|
|
/* Borders */
|
|
--color-border: var(--color-gray-500);
|
|
--color-border-alt: var(--color-gray-600);
|
|
--color-border-form: var(--color-border);
|
|
--color-border-form-disabled: rgba(105, 104, 107, 0.5);
|
|
/* Form */
|
|
--color-state-form-active: #bfd9ea;
|
|
--color-fg-form-on: var(--color-gray-900);
|
|
--color-illustration-100: #bcc4b2;
|
|
--color-illustration-200: #aebaca;
|
|
--color-illustration-300: #87a1c8;
|
|
--color-state-active: #00548c;
|
|
--color-state-hover: #003c64;
|
|
--color-surface-highlight: #00426e;
|
|
}
|