*
* vim-hybrid theme by w0ng
(
https:
/
/
github.com /w0ng/ vim-hybrid
)
*
* *
/
/*background color*/
.hljs {
display: block;
overflow-x: auto;
padding: 0.5em;
background: #1d1f21;
}
/*selection color*/
.hljs::selection,
.hljs span::selection {
background: #373b41;
}
.hljs::-moz-selection,
.hljs span::-moz-selection {
background: #373b41;
}
/*foreground color*/
.hljs {
color: #c5c8c6;
}
/*color: fg_yellow*/
.hljs-title,
.hljs-name {
color: #f0c674;
}
/*color: fg_comment*/
.hljs-comment,
.hljs-meta,
.hljs-meta .hljs-keyword {
color: #707880;
}
/*color: fg_red*/
.hljs-number,
.hljs-symbol,
.hljs-literal,
.hljs-deletion,
.hljs-link {
color: #cc6666
}
/*color: fg_green*/
.hljs-string,
.hljs-doctag,
.hljs-addition,
.hljs-regexp,
.hljs-selector-attr,
.hljs-selector-pseudo {
color: #b5bd68;
}
/*color: fg_purple*/
.hljs-attribute,
.hljs-code,
.hljs-selector-id {
color: #b294bb;
}
/*color: fg_blue*/
.hljs-keyword,
.hljs-selector-tag,
.hljs-bullet,
.hljs-tag {
color: #81a2be;
}
/*color: fg_aqua*/
.hljs-subst,
.hljs-variable,
.hljs-template-tag,
.hljs-template-variable {
color: #8abeb7;
}
/*color: fg_orange*/
.hljs-type,
.hljs-built_in,
.hljs-builtin-name,
.hljs-quote,
.hljs-section,
.hljs-selector-class {
color: #de935f;
}
.hljs-emphasis {
font-style: italic;
}
.hljs-strong {
font-weight: bold;
}
@charset "UTF-8";
/**
*
* VZRF Docs
*
* - Imports
* - Variables
* - Base Elements
* - Components
* - Media Queries
* --- Base Elements
* --- Components
* */
/*===================================
* Imports
* ===================================*/
/**
* Core Theme Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Imports
* - functions
* - mixins
* - animations
* - fonts
* - font awesome 5
* - Color Definitions
* - Interface
* - General
* - Messaging Types
* - Button
* - Button State
* - Secondary Button
* - Secondary Button State
* - CTA Button
* - Borders
* - Links
* - Fonts
* - Transitions
* - Horizontal Rule
* - Breakpoints
* - Spacers
*
* **/
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* Core Theme Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Imports
* - functions
* - mixins
* - animations
* - fonts
* - font awesome 5
* - Color Definitions
* - Interface
* - General
* - Messaging Types
* - Button
* - Button State
* - Secondary Button
* - Secondary Button State
* - CTA Button
* - Borders
* - Links
* - Fonts
* - Transitions
* - Horizontal Rule
* - Breakpoints
* - Spacers
*
* **/
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */
/* Document
* ========================================================================== */
/**
* * 1. Correct the line height in all browsers.
* * 2. Prevent adjustments of font size after orientation changes in iOS.
* */
html {
line-height: 1.15;
/* 1 */
-webkit-text-size-adjust: 100%;
/* 2 */
}
/* Sections
* ========================================================================== */
/**
* * Remove the margin in all browsers.
* */
body {
margin: 0;
}
/**
* * Correct the font size and margin on `h1` elements within `section` and
* * `article` contexts in Chrome, Firefox, and Safari.
* */
h1 {
font-size: 2em;
margin: 0.67em 0;
}
/* Grouping content
* ========================================================================== */
/**
* * 1. Add the correct box sizing in Firefox.
* * 2. Show the overflow in Edge and IE.
* */
hr {
box-sizing: content-box;
/* 1 */
height: 0;
/* 1 */
overflow: visible;
/* 2 */
}
/**
* * 1. Correct the inheritance and scaling of font size in all browsers.
* * 2. Correct the odd `em` font sizing in all browsers.
* */
pre {
font-family: monospace, monospace;
/* 1 */
font-size: 1em;
/* 2 */
overflow-x: auto;
}
/* Text-level semantics
* ========================================================================== */
/**
* * Remove the gray background on active links in IE 10.
* */
a {
background-color: transparent;
}
/**
* * 1. Remove the bottom border in Chrome 57-
* * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
* */
abbr[title] {
border-bottom: none;
/* 1 */
text-decoration: underline;
/* 2 */
text-decoration: underline dotted;
/* 2 */
}
/**
* * Add the correct font weight in Chrome, Edge, and Safari.
* */
b,
strong {
font-weight: bolder;
}
/**
* * 1. Correct the inheritance and scaling of font size in all browsers.
* * 2. Correct the odd `em` font sizing in all browsers.
* */
code,
kbd,
samp {
font-family: monospace, monospace;
/* 1 */
font-size: 1em;
/* 2 */
}
/**
* * Add the correct font size in all browsers.
* */
small {
font-size: 80%;
}
/**
* * Prevent `sub` and `sup` elements from affecting the line height in
* * all browsers.
* */
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sub {
bottom: -0.25em;
}
sup {
top: -0.5em;
}
/* Embedded content
* ========================================================================== */
/**
* * Remove the border on images inside links in IE 10.
* */
img {
border-style: none;
}
/* Forms
* ========================================================================== */
/**
* * 1. Change the font styles in all browsers.
* * 2. Remove the margin in Firefox and Safari.
* */
button,
input,
optgroup,
select,
textarea {
font-family: inherit;
/* 1 */
font-size: 100%;
/* 1 */
line-height: 1.15;
/* 1 */
margin: 0;
/* 2 */
}
/**
* * Show the overflow in IE.
* * 1. Show the overflow in Edge.
* */
button,
input {
/* 1 */
overflow: visible;
}
/**
* * Remove the inheritance of text transform in Edge, Firefox, and IE.
* * 1. Remove the inheritance of text transform in Firefox.
* */
button,
select {
/* 1 */
text-transform: none;
}
/**
* * Correct the inability to style clickable types in iOS and Safari.
* */
button,
[type="button"],
[type="reset"],
[type="submit"] {
-webkit-appearance: button;
}
/**
* * Remove the inner border and padding in Firefox.
* */
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
border-style: none;
padding: 0;
}
/**
* * Restore the focus styles unset by the previous rule.
* */
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
outline: 0.0625rem dotted ButtonText;
}
/**
* * Correct the padding in Firefox.
* */
fieldset {
padding: 0.35em 0.75em 0.625em;
}
/**
* * 1. Correct the text wrapping in Edge and IE.
* * 2. Correct the color inheritance from `fieldset` elements in IE.
* * 3. Remove the padding so developers are not caught out when they zero out
* * `fieldset` elements in all browsers.
* */
legend {
box-sizing: border-box;
/* 1 */
color: inherit;
/* 2 */
display: table;
/* 1 */
max-width: 100%;
/* 1 */
padding: 0;
/* 3 */
white-space: normal;
/* 1 */
}
/**
* * Add the correct vertical alignment in Chrome, Firefox, and Opera.
* */
progress {
vertical-align: baseline;
}
/**
* * Remove the default vertical scrollbar in IE 10+.
* */
textarea {
overflow: auto;
}
/**
* * 1. Add the correct box sizing in IE 10.
* * 2. Remove the padding in IE 10.
* */
[type="checkbox"],
[type="radio"] {
box-sizing: border-box;
/* 1 */
padding: 0;
/* 2 */
}
/**
* * Correct the cursor style of increment and decrement buttons in Chrome.
* */
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
height: auto;
}
/**
* * 1. Correct the odd appearance in Chrome and Safari.
* * 2. Correct the outline style in Safari.
* */
[type="search"] {
-webkit-appearance: textfield;
/* 1 */
outline-offset: -2px;
/* 2 */
}
/**
* * Remove the inner padding in Chrome and Safari on macOS.
* */
[type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
}
/**
* * 1. Correct the inability to style clickable types in iOS and Safari.
* * 2. Change font properties to `inherit` in Safari.
* */
::-webkit-file-upload-button {
-webkit-appearance: button;
/* 1 */
font: inherit;
/* 2 */
}
/* Interactive
* ========================================================================== */
/*
* * Add the correct display in Edge, IE 10+, and Firefox.
* */
details {
display: block;
}
/*
* * Add the correct display in all browsers.
* */
summary {
display: list-item;
}
/* Misc
* ========================================================================== */
/**
* * Add the correct display in IE 10+.
* */
template {
display: none;
}
/**
* * Add the correct display in IE 10.
* */
[hidden] {
display: none;
}
*,
::before,
::after {
box-sizing: border-box;
}
body {
min-width: 320px;
}
img {
max-width: 100%;
vertical-align: middle;
}
/**
* * This is being used on the site an
* *
* */
/**
* Core Theme Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Imports
* - functions
* - mixins
* - animations
* - fonts
* - font awesome 5
* - Color Definitions
* - Interface
* - General
* - Messaging Types
* - Button
* - Button State
* - Secondary Button
* - Secondary Button State
* - CTA Button
* - Borders
* - Links
* - Fonts
* - Transitions
* - Horizontal Rule
* - Breakpoints
* - Spacers
*
* **/
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* Tooltips Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - General
* - Heading
* - Links
* - Horizontal Rule
* - Default Lists
* - Definition Lists
* - Blockquote
* - Code
*
* **/
/**
* * Typography
* *
* * Reset Typography
* * Base Typography
* * Headers
* * Core Typography
* * Measure
* * Lists
* * Media Query
* *
* */
h1,
h2,
h3,
h4,
h5,
h6,
p,
ul,
ol,
li,
dl,
dt,
dd,
blockquote {
margin: 0;
padding: 0;
}
html {
font-family: "BrandFont-Text", Arial, sans-serif;
font-size: 16px;
font-weight: normal;
font-style: normal;
color: #000000;
line-height: 1.6;
}
body {
font-size: 0.875rem;
}
h1,
h2,
h3,
h4,
h5,
h6 {
font-family: "BrandFont-Display", Arial, sans-serif;
margin-top: 0;
margin-bottom: 0.6em;
}
h1,
.h1 {
font-size: 1.5625rem;
font-weight: bold;
line-height: 1.48;
font-family: "BrandFont-Display", Arial, sans-serif;
}
h2,
.h2 {
font-size: 1rem;
font-weight: bold;
line-height: 1.46875;
font-family: "BrandFont-Display", Arial, sans-serif;
}
h3,
.h3 {
font-size: 0.75rem;
font-weight: bold;
line-height: 1.5;
font-family: "BrandFont-Display", Arial, sans-serif;
}
h4,
.h4 {
font-size: 0.75rem;
font-weight: bold;
line-height: 1.5;
font-family: "BrandFont-Display", Arial, sans-serif;
}
h5,
.h5 {
font-size: 0.75rem;
font-weight: bold;
line-height: 1.5;
font-family: "BrandFont-Display", Arial, sans-serif;
}
h6,
.h6 {
font-size: 0.75rem;
font-weight: normal;
line-height: 1.5;
font-family: "BrandFont-Display", Arial, sans-serif;
}
p {
margin-bottom: 0.875rem;
}
a,
.Link {
color: #000000;
text-decoration: underline;
transition: color 0.15s ease-out;
}
a:hover, a.is-hover,
.Link:hover,
.Link.is-hover {
color: #0088ce;
}
a:active, a.is-active,
.Link:active,
.Link.is-active {
color: #0088ce;
}
blockquote {
margin: 0.875rem 0;
padding: 0 1.25rem 0 1rem;
line-height: 1.625;
border-left: 0.25rem solid #000000;
color: #333333;
}
hr {
margin-top: 0.875rem;
margin-bottom: 0.875rem;
border-left: 0;
border-right: 0;
border-bottom: 0;
border-top: 0.25rem solid #000000;
}
hr.Hr--primary {
border-top: 0.25rem solid #000000;
}
hr.Hr--secondary {
border-top: 0.0625rem solid #000000;
}
hr.Hr--tertiary {
border-top: 0.0625rem solid #d8dada;
}
strong,
b {
font-weight: bold;
line-height: inherit;
}
small {
font-size: 80%;
line-height: inherit;
}
pre,
code,
kbd {
font-family: "Inconsolata", monospace;
font-size: 0.9em;
line-height: 1;
}
kbd {
background: #747676;
border-radius: 0;
color: #ffffff;
display: inline-block;
font-size: 0.7875rem;
line-height: 1;
padding: 0.25rem 0.375rem;
vertical-align: baseline;
}
mark {
background-color: #ffdfa3;
padding: 0.125rem 0.25rem;
line-height: 1;
}
strike,
del {
text-decoration: line-through;
}
u {
text-decoration: underline;
}
cite,
em,
var,
address,
dfn {
font-style: italic;
}
time {
font-family: "Inconsolata", monospace;
}
.List--reset {
list-style-type: none;
margin-left: 0;
padding-left: 0;
}
ul,
ol,
dl {
margin-bottom: 0.875rem;
}
ol,
ul {
padding-left: 1.75rem;
}
ol ul,
ol ol,
ul ul,
ul ol {
margin-top: 0.4375rem;
margin-bottom: 0.4375rem;
}
ol li,
ol dt,
ol dd,
ul li,
ul dt,
ul dd {
margin-bottom: 0.4375rem;
}
ul {
list-style: disc;
}
ul.Ul--square {
list-style-type: square;
}
ul.Ul--circle {
list-style-type: circle;
}
ul.Ul--disc {
list-style-type: disc;
}
ul.Ul--no-bullet {
margin-left: 0;
list-style-type: none;
}
dt {
margin-bottom: 0;
font-weight: bold;
}
dt ~ dt {
margin-top: 0.875rem;
}
dt + dt {
margin-top: 0;
}
dd {
margin-bottom: 0;
}
.Typography-inverted h1, .Typography-inverted h2, .Typography-inverted h3, .Typography-inverted h4, .Typography-inverted h5, .Typography-inverted h6, .Typography-inverted p, .Typography-inverted a, .Typography-inverted * {
color: #ffffff;
}
@media only screen and (min-width: 768px) {
h1,
.h1 {
font-size: 2rem;
line-height: 1.5;
}
h2,
.h2 {
font-size: 1.25rem;
line-height: 1.475;
}
h3,
.h3 {
font-size: 0.875rem;
line-height: 1.51786;
}
h4,
.h4 {
font-size: 0.875rem;
line-height: 1.51786;
}
h5,
.h5 {
font-size: 0.875rem;
line-height: 1.51786;
}
h6,
.h6 {
font-size: 0.875rem;
line-height: 1.51786;
}
}
/**
* Core Theme Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Imports
* - functions
* - mixins
* - animations
* - fonts
* - font awesome 5
* - Color Definitions
* - Interface
* - General
* - Messaging Types
* - Button
* - Button State
* - Secondary Button
* - Secondary Button State
* - CTA Button
* - Borders
* - Links
* - Fonts
* - Transitions
* - Horizontal Rule
* - Breakpoints
* - Spacers
*
* **/
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
select::-ms-expand {
display: none;
}
/**
* Core Theme Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Imports
* - functions
* - mixins
* - animations
* - fonts
* - font awesome 5
* - Color Definitions
* - Interface
* - General
* - Messaging Types
* - Button
* - Button State
* - Secondary Button
* - Secondary Button State
* - CTA Button
* - Borders
* - Links
* - Fonts
* - Transitions
* - Horizontal Rule
* - Breakpoints
* - Spacers
*
* **/
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* Core Theme Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Imports
* - functions
* - mixins
* - animations
* - fonts
* - font awesome 5
* - Color Definitions
* - Interface
* - General
* - Messaging Types
* - Button
* - Button State
* - Secondary Button
* - Secondary Button State
* - CTA Button
* - Borders
* - Links
* - Fonts
* - Transitions
* - Horizontal Rule
* - Breakpoints
* - Spacers
*
* **/
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* Accordion Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Imports
* - General
* **/
.Accordion .Accordion-group {
margin-bottom: 0.4375rem;
border-top: 0.0625rem solid #000000;
}
.Accordion .Accordion-group.is-expanded {
border-top: 0.0625rem solid #000000;
}
.Accordion .Accordion-group.is-expanded + .Accordion-group {
border-top: 0.0625rem solid #000000;
}
.Accordion .Accordion-group.is-expanded .Accordion-summary .Accordion-button::after {
content: "-";
position: absolute;
right: 0;
top: 0;
bottom: 0;
margin-top: auto;
margin-bottom: auto;
font-weight: 400;
font-size: 0.875rem;
line-height: 1;
height: 0.875rem;
width: 0.875rem;
text-align: center;
display: flex;
align-items: center;
justify-content: center;
}
.Accordion .Accordion-group.is-expanded .Accordion-detail {
display: block;
padding: 0 0 1rem;
}
.Accordion .Accordion-group:first-of-type {
border-top: 0.25rem solid #000000;
}
.Accordion .Accordion-summary {
margin-top: 0.4375rem;
}
.Accordion .Accordion-summary .Accordion-button {
font-size: 1.5rem;
padding: 0.21875rem 0;
background: none;
border: 0;
color: #000000;
cursor: pointer;
display: block;
width: 100%;
position: relative;
text-align: left;
}
.Accordion .Accordion-summary .Accordion-button::after {
content: "+";
position: absolute;
right: 0;
top: 0;
bottom: 0;
margin-top: auto;
margin-bottom: auto;
font-weight: 400;
font-size: 0.875rem;
line-height: 1;
height: 0.875rem;
width: 0.875rem;
text-align: center;
display: flex;
align-items: center;
justify-content: center;
}
.Accordion .Accordion-summary .Accordion-button:hover {
color: #000000;
}
.Accordion .Accordion-detail {
display: none;
}
/**
* Core Theme Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Imports
* - functions
* - mixins
* - animations
* - fonts
* - font awesome 5
* - Color Definitions
* - Interface
* - General
* - Messaging Types
* - Button
* - Button State
* - Secondary Button
* - Secondary Button State
* - CTA Button
* - Borders
* - Links
* - Fonts
* - Transitions
* - Horizontal Rule
* - Breakpoints
* - Spacers
*
* **/
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* Alerts Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Imports
* - General
* - Success
* - Info
* - Warning
* - Error
* - Alert close
* **/
.Alert {
position: relative;
display: block;
padding: 0.875rem;
box-sizing: border-box;
background-color: #0088ce;
color: #ffffff;
font-weight: bold;
}
.Alert.Alert--success {
background-color: #00ac3e;
color: #ffffff;
}
.Alert.Alert--info {
background-color: #0088ce;
color: #ffffff;
}
.Alert.Alert--warning {
background-color: #ffbc3d;
color: #000000;
}
.Alert.Alert--error {
background-color: #ed7000;
color: #ffffff;
}
.Alert-close {
position: absolute;
border: 0;
top: 0.875rem;
right: 0.875rem;
padding: 0;
color: inherit;
background: transparent;
margin: 0;
}
.Alert-close:hover, .Alert-close:focus,
.Alert-close .is-active {
background: transparent;
outline-color: #ffffff;
}
.Alert-close::after {
content: "\2715";
display: inline-block;
padding: 0;
background-color: transparent;
color: inherit;
font-size: 0.875rem;
}
/**
* Core Theme Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Imports
* - functions
* - mixins
* - animations
* - fonts
* - font awesome 5
* - Color Definitions
* - Interface
* - General
* - Messaging Types
* - Button
* - Button State
* - Secondary Button
* - Secondary Button State
* - CTA Button
* - Borders
* - Links
* - Fonts
* - Transitions
* - Horizontal Rule
* - Breakpoints
* - Spacers
*
* **/
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* Avatars Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Imports
* - General
* - Small
* - Medium
* - Large
* - Extra Large
* **/
.Avatar {
box-sizing: border-box;
position: relative;
display: inline-block;
margin: 0;
border: none;
font-weight: normal;
line-height: 2;
border-radius: 50%;
color: #ffffff;
background-color: #000000;
text-align: center;
vertical-align: middle;
width: 3rem;
height: 3rem;
font-size: 1.5rem;
}
.Avatar .Avatar-image {
position: relative;
height: 100%;
width: 100%;
border-radius: 50%;
vertical-align: top;
}
.Avatar.Avatar--small {
width: 2rem;
height: 2rem;
font-size: 1rem;
}
.Avatar.Avatar--large {
width: 4rem;
height: 4rem;
font-size: 2rem;
}
.Avatar.Avatar--extraLarge {
width: 5rem;
height: 5rem;
font-size: 2.5rem;
}
/**
* Core Theme Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Imports
* - functions
* - mixins
* - animations
* - fonts
* - font awesome 5
* - Color Definitions
* - Interface
* - General
* - Messaging Types
* - Button
* - Button State
* - Secondary Button
* - Secondary Button State
* - CTA Button
* - Borders
* - Links
* - Fonts
* - Transitions
* - Horizontal Rule
* - Breakpoints
* - Spacers
*
* **/
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* Badges Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Imports
* - General
*
* **/
.Badge {
display: inline-block;
border-radius: 50%;
position: relative;
background-color: #000000;
color: #ffffff;
font-size: 0.75rem;
font-weight: normal;
}
.Badge::before, .Badge::after {
content: '\200B';
display: inline-block;
line-height: 0;
padding-top: 50%;
padding-bottom: 50%;
}
.Badge::before {
padding-left: 0.21875rem;
}
.Badge::after {
padding-right: 0.21875rem;
}
/**
* Core Theme Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Imports
* - functions
* - mixins
* - animations
* - fonts
* - font awesome 5
* - Color Definitions
* - Interface
* - General
* - Messaging Types
* - Button
* - Button State
* - Secondary Button
* - Secondary Button State
* - CTA Button
* - Borders
* - Links
* - Fonts
* - Transitions
* - Horizontal Rule
* - Breakpoints
* - Spacers
*
* **/
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* Bars Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Imports
* - General
*
*
* **/
.Bar {
position: relative;
padding-top: 1.3125rem;
padding-bottom: 0.875rem;
margin-top: 1.3125rem;
border-top: 0.25rem solid #000000;
}
.Bar.Bar--primary {
border-top: 0.25rem solid #000000;
}
.Bar.Bar--secondary {
border-top: 0.0625rem solid #000000;
}
.Bar.Bar--tertiary {
border-top: 0.0625rem solid #d8dada;
}
.Bar.Bar--noMargin {
margin: 0;
}
.Bar.is-active {
border-color: #d52b1e;
}
/**
* Core Theme Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Imports
* - functions
* - mixins
* - animations
* - fonts
* - font awesome 5
* - Color Definitions
* - Interface
* - General
* - Messaging Types
* - Button
* - Button State
* - Secondary Button
* - Secondary Button State
* - CTA Button
* - Borders
* - Links
* - Fonts
* - Transitions
* - Horizontal Rule
* - Breakpoints
* - Spacers
*
* **/
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* Breadcrumbs Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Imports
* - General
* **/
.Breadcrumb {
padding-left: 0;
}
.Breadcrumb li.Breadcrumb-item {
display: inline-block;
}
.Breadcrumb li.Breadcrumb-item a {
text-decoration: none;
}
.Breadcrumb li.Breadcrumb-item.is-active a {
pointer-events: none;
font-weight: bold;
color: #000000;
}
.Breadcrumb li.Breadcrumb-item ~ li.Breadcrumb-item {
margin-left: 1.75rem;
position: relative;
}
.Breadcrumb li.Breadcrumb-item ~ li.Breadcrumb-item::before {
content: '';
height: 75%;
width: 0.0625rem;
left: -0.875rem;
background: #000000;
position: absolute;
transform: rotate(20deg);
margin: auto;
top: 0;
bottom: 0;
}
/**
* Core Theme Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Imports
* - functions
* - mixins
* - animations
* - fonts
* - font awesome 5
* - Color Definitions
* - Interface
* - General
* - Messaging Types
* - Button
* - Button State
* - Secondary Button
* - Secondary Button State
* - CTA Button
* - Borders
* - Links
* - Fonts
* - Transitions
* - Horizontal Rule
* - Breakpoints
* - Spacers
*
* **/
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* Buttons Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
* - Mixins
* - Imports
* - General
* - Primary Disabled
* - Secondary
* - Secondary Disabled
* - CTA
*
* **/
.Button, button, a.Button {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
box-sizing: border-box;
width: auto;
display: inline-block;
position: relative;
vertical-align: middle;
cursor: pointer;
text-decoration: none;
text-align: center;
padding: 1em 3.14em;
margin: 0 0.625rem 0.625rem 0;
border-radius: 624.9375rem;
border: 0.0625rem solid #000000;
color: #ffffff;
font-size: 0.875rem;
font-weight: bold;
background-color: #000000;
font-style: normal;
line-height: 1;
transition-property: color;
transition-duration: 0.2s;
font-family: "BrandFont-Text", Arial, sans-serif
touch-action: manipulation;
}
.Button.disabled, .Button[disabled], .Button.is-disabled, button.disabled, button[disabled], button.is-disabled, a.Button.disabled, a.Button[disabled], a.Button.is-disabled {
pointer-events: none;
cursor: not-allowed;
opacity: .6;
background-color: #d8dada;
color: #ffffff;
border-color: #d8dada;
text-shadow: 0 0 0.0625rem rgba(0, 0, 0, 0.5);
}
.Button.disabled:hover, .Button.disabled:active, .Button.disabled.is-active, .Button.disabled.link.active, .Button.disabled.link.hover, .Button.disabled.link:active, .Button.disabled.link:hover, .Button[disabled]:hover, .Button[disabled]:active, .Button[disabled].is-active, .Button[disabled].link.active, .Button[disabled].link.hover, .Button[disabled].link:active, .Button[disabled].link:hover, .Button.is-disabled:hover, .Button.is-disabled:active, .Button.is-disabled.is-active, .Button.is-disabled.link.active, .Button.is-disabled.link.hover, .Button.is-disabled.link:active, .Button.is-disabled.link:hover, button.disabled:hover, button.disabled:active, button.disabled.is-active, button.disabled.link.active, button.disabled.link.hover, button.disabled.link:active, button.disabled.link:hover, button[disabled]:hover, button[disabled]:active, button[disabled].is-active, button[disabled].link.active, button[disabled].link.hover, button[disabled].link:active, button[disabled].link:hover, button.is-disabled:hover, button.is-disabled:active, button.is-disabled.is-active, button.is-disabled.link.active, button.is-disabled.link.hover, button.is-disabled.link:active, button.is-disabled.link:hover, a.Button.disabled:hover, a.Button.disabled:active, a.Button.disabled.is-active, a.Button.disabled.link.active, a.Button.disabled.link.hover, a.Button.disabled.link:active, a.Button.disabled.link:hover, a.Button[disabled]:hover, a.Button[disabled]:active, a.Button[disabled].is-active, a.Button[disabled].link.active, a.Button[disabled].link.hover, a.Button[disabled].link:active, a.Button[disabled].link:hover, a.Button.is-disabled:hover, a.Button.is-disabled:active, a.Button.is-disabled.is-active, a.Button.is-disabled.link.active, a.Button.is-disabled.link.hover, a.Button.is-disabled.link:active, a.Button.is-disabled.link:hover {
pointer-events: none;
background-color: #d8dada;
color: #ffffff;
border-color: #d8dada;
text-decoration: none;
}
.Button:hover, .Button:focus, .Button:active, .Button.is-active, .Button.link.active, .Button.link.hover, .Button.link:active, .Button.link:hover, button:hover, button:active, button.is-active, button.link.active, button.link.hover, button.link:active, button.link:hover, a.Button:hover, a.Button:active, a.Button.is-active, a.Button.link.active, a.Button.link.hover, a.Button.link:active, a.Button.link:hover {
background-color: #000000;
border-color: #000000;
color: #ffffff;
text-decoration: none;
background-color: #353535;
}
.Button.Button--success, button.Button--success, a.Button.Button--success {
background-color: #00ac3e;
border: 0.0625rem solid #00ac3e;
}
.Button.Button--success:hover, .Button.Button--success:active, .Button.Button--success.is-active, .Button.Button--success.link.active, .Button.Button--success.link.hover, .Button.Button--success.link:active, .Button.Button--success.link:hover, button.Button--success:hover, button.Button--success:active, button.Button--success.is-active, button.Button--success.link.active, button.Button--success.link.hover, button.Button--success.link:active, button.Button--success.link:hover, a.Button.Button--success:hover, a.Button.Button--success:active, a.Button.Button--success.is-active, a.Button.Button--success.link.active, a.Button.Button--success.link.hover, a.Button.Button--success.link:active, a.Button.Button--success.link:hover {
background-color: #00ac3e;
border-color: #00ac3e;
color: #00ac3e;
text-decoration: none;
}
.Button.Button--info, button.Button--info, a.Button.Button--info {
background-color: #0088ce;
border: 0.0625rem solid #0088ce;
}
.Button.Button--info:hover, .Button.Button--info:active, .Button.Button--info.is-active, .Button.Button--info.link.active, .Button.Button--info.link.hover, .Button.Button--info.link:active, .Button.Button--info.link:hover, button.Button--info:hover, button.Button--info:active, button.Button--info.is-active, button.Button--info.link.active, button.Button--info.link.hover, button.Button--info.link:active, button.Button--info.link:hover, a.Button.Button--info:hover, a.Button.Button--info:active, a.Button.Button--info.is-active, a.Button.Button--info.link.active, a.Button.Button--info.link.hover, a.Button.Button--info.link:active, a.Button.Button--info.link:hover {
background-color: #0088ce;
border-color: #0088ce;
color: #0088ce;
text-decoration: none;
}
.Button.Button--warning, button.Button--warning, a.Button.Button--warning {
background-color: #ffbc3d;
border: 0.0625rem solid #ffbc3d;
}
.Button.Button--warning:hover, .Button.Button--warning:active, .Button.Button--warning.is-active, .Button.Button--warning.link.active, .Button.Button--warning.link.hover, .Button.Button--warning.link:active, .Button.Button--warning.link:hover, button.Button--warning:hover, button.Button--warning:active, button.Button--warning.is-active, button.Button--warning.link.active, button.Button--warning.link.hover, button.Button--warning.link:active, button.Button--warning.link:hover, a.Button.Button--warning:hover, a.Button.Button--warning:active, a.Button.Button--warning.is-active, a.Button.Button--warning.link.active, a.Button.Button--warning.link.hover, a.Button.Button--warning.link:active, a.Button.Button--warning.link:hover {
background-color: #ffbc3d;
border-color: #ffbc3d;
color: #ffbc3d;
text-decoration: none;
}
.Button.Button--error, button.Button--error, a.Button.Button--error {
background-color: #ed7000;
border: 0.0625rem solid #ed7000;
}
.Button.Button--error:hover, .Button.Button--error:active, .Button.Button--error.is-active, .Button.Button--error.link.active, .Button.Button--error.link.hover, .Button.Button--error.link:active, .Button.Button--error.link:hover, button.Button--error:hover, button.Button--error:active, button.Button--error.is-active, button.Button--error.link.active, button.Button--error.link.hover, button.Button--error.link:active, button.Button--error.link:hover, a.Button.Button--error:hover, a.Button.Button--error:active, a.Button.Button--error.is-active, a.Button.Button--error.link.active, a.Button.Button--error.link.hover, a.Button.Button--error.link:active, a.Button.Button--error.link:hover {
background-color: #ed7000;
border-color: #ed7000;
color: #ed7000;
text-decoration: none;
}
.Button.Button--secondary, button.Button--secondary, a.Button.Button--secondary {
background-color: #ffffff;
color: #000000;
border-color: #000000;
}
.Button.Button--secondary.disabled, .Button.Button--secondary[disabled], .Button.Button--secondary.is-disabled, button.Button--secondary.disabled, button.Button--secondary[disabled], button.Button--secondary.is-disabled, a.Button.Button--secondary.disabled, a.Button.Button--secondary[disabled], a.Button.Button--secondary.is-disabled {
pointer-events: none;
cursor: not-allowed;
opacity: .6;
background-color: #d8dada;
color: #ffffff;
border-color: #d8dada;
text-shadow: 0 0 0.0625rem rgba(0, 0, 0, 0.5);
}
.Button.Button--secondary.disabled:hover, .Button.Button--secondary.disabled:active, .Button.Button--secondary.disabled.is-active, .Button.Button--secondary.disabled.link.active, .Button.Button--secondary.disabled.link.hover, .Button.Button--secondary.disabled.link:active, .Button.Button--secondary.disabled.link:hover, .Button.Button--secondary[disabled]:hover, .Button.Button--secondary[disabled]:active, .Button.Button--secondary[disabled].is-active, .Button.Button--secondary[disabled].link.active, .Button.Button--secondary[disabled].link.hover, .Button.Button--secondary[disabled].link:active, .Button.Button--secondary[disabled].link:hover, .Button.Button--secondary.is-disabled:hover, .Button.Button--secondary.is-disabled:active, .Button.Button--secondary.is-disabled.is-active, .Button.Button--secondary.is-disabled.link.active, .Button.Button--secondary.is-disabled.link.hover, .Button.Button--secondary.is-disabled.link:active, .Button.Button--secondary.is-disabled.link:hover, button.Button--secondary.disabled:hover, button.Button--secondary.disabled:active, button.Button--secondary.disabled.is-active, button.Button--secondary.disabled.link.active, button.Button--secondary.disabled.link.hover, button.Button--secondary.disabled.link:active, button.Button--secondary.disabled.link:hover, button.Button--secondary[disabled]:hover, button.Button--secondary[disabled]:active, button.Button--secondary[disabled].is-active, button.Button--secondary[disabled].link.active, button.Button--secondary[disabled].link.hover, button.Button--secondary[disabled].link:active, button.Button--secondary[disabled].link:hover, button.Button--secondary.is-disabled:hover, button.Button--secondary.is-disabled:active, button.Button--secondary.is-disabled.is-active, button.Button--secondary.is-disabled.link.active, button.Button--secondary.is-disabled.link.hover, button.Button--secondary.is-disabled.link:active, button.Button--secondary.is-disabled.link:hover, a.Button.Button--secondary.disabled:hover, a.Button.Button--secondary.disabled:active, a.Button.Button--secondary.disabled.is-active, a.Button.Button--secondary.disabled.link.active, a.Button.Button--secondary.disabled.link.hover, a.Button.Button--secondary.disabled.link:active, a.Button.Button--secondary.disabled.link:hover, a.Button.Button--secondary[disabled]:hover, a.Button.Button--secondary[disabled]:active, a.Button.Button--secondary[disabled].is-active, a.Button.Button--secondary[disabled].link.active, a.Button.Button--secondary[disabled].link.hover, a.Button.Button--secondary[disabled].link:active, a.Button.Button--secondary[disabled].link:hover, a.Button.Button--secondary.is-disabled:hover, a.Button.Button--secondary.is-disabled:active, a.Button.Button--secondary.is-disabled.is-active, a.Button.Button--secondary.is-disabled.link.active, a.Button.Button--secondary.is-disabled.link.hover, a.Button.Button--secondary.is-disabled.link:active, a.Button.Button--secondary.is-disabled.link:hover {
pointer-events: none;
background-color: #d8dada;
color: #ffffff;
border-color: #d8dada;
text-decoration: none;
}
.Button.Button--secondary:hover, .Button.Button--secondary:focus, .Button.Button--secondary:active, .Button.Button--secondary.is-active, .Button.Button--secondary.link.active, .Button.Button--secondary.link.hover, .Button.Button--secondary.link:active, .Button.Button--secondary.link:hover, button.Button--secondary:hover, button.Button--secondary:active, button.Button--secondary.is-active, button.Button--secondary.link.active, button.Button--secondary.link.hover, button.Button--secondary.link:active, button.Button--secondary.link:hover, a.Button.Button--secondary:hover, a.Button.Button--secondary:active, a.Button.Button--secondary.is-active, a.Button.Button--secondary.link.active, a.Button.Button--secondary.link.hover, a.Button.Button--secondary.link:active, a.Button.Button--secondary.link:hover {
background-color: #ffffff;
border-color: #000000;
color: #000000;
text-decoration: none;
background-color: #f5eeee;
}
.Button.Button--cta, button.Button--cta, a.Button.Button--cta {
width: auto;
display: inline-block;
position: relative;
vertical-align: middle;
padding: 0;
margin: 0 0 0 0.875rem;
border: 0;
cursor: pointer;
background-image: none;
background-color: transparent;
text-decoration: none;
font-size: 1.125rem;
font-weight: bold;
font-style: normal;
line-height: 1;
color: #000000;
transition: opacity 0.15s ease-in;
touch-action: manipulation;
}
.Button.Button--cta:hover, button.Button--cta:hover, a.Button.Button--cta:hover {
background-color: transparent;
color: #000000;
text-decoration: none;
}
.Button.Button--cta:active, .Button.Button--cta.is-active, button.Button--cta:active, button.Button--cta.is-active, a.Button.Button--cta:active, a.Button.Button--cta.is-active {
opacity: 0.77;
transition: opacity 0.15s ease-out;
}
.Button.Button--cta.is-disabled, button.Button--cta.is-disabled, a.Button.Button--cta.is-disabled {
pointer-events: none;
cursor: not-allowed;
color: #d8dada;
text-shadow: none;
}
.Button.Button--cta.is-disabled:hover, button.Button--cta.is-disabled:hover, a.Button.Button--cta.is-disabled:hover {
background-color: transparent;
}
.Button.Button--cta.is-disabled::after, button.Button--cta.is-disabled::after, a.Button.Button--cta.is-disabled::after {
background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 15 24' xmlns='http://www.w3.org/2000/svg'%3E %3Cpath stroke='#d8dada' stroke-width='3' d='M1.607 1l10.606 10.607L1.607 22.213' fill='none' fill-rule='evenodd'/%3E %3C/svg%3E");
}
.Button.Button--cta:focus, .Button.Button--cta.is-focused, button.Button--cta:focus, button.Button--cta.is-focused, a.Button.Button--cta:focus, a.Button.Button--cta.is-focused {
text-decoration: underline;
}
.Button.Button--cta::after, button.Button--cta::after, a.Button.Button--cta::after {
background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 15 24' xmlns='http://www.w3.org/2000/svg'%3E %3Cpath stroke='#000000' stroke-width='3' d='M1.607 1l10.606 10.607L1.607 22.213' fill='none' fill-rule='evenodd'/%3E %3C/svg%3E");
content: " ";
display: inline-block;
width: 0.9em;
height: 0.9em;
background-position: 0 0;
background-repeat: no-repeat;
background-size: 100% 100%;
margin-left: 1ex;
position: relative;
vertical-align: top;
top: 6.25%;
font-size: inherit;
line-height: inherit;
}
.Button.Button--tiny, button.Button--tiny, a.Button.Button--tiny {
font-size: 0.6875rem;
padding: 0.375rem 0.6875rem;
}
.Button.Button--small, button.Button--small, a.Button.Button--small {
font-size: 0.6875rem;
}
.Button.Button--large, button.Button--large, a.Button.Button--large {
font-size: 1rem;
}
.Button.Button--block, button.Button--block, a.Button.Button--block {
display: block;
width: 100%;
}
/**
* Core Theme Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Imports
* - functions
* - mixins
* - animations
* - fonts
* - font awesome 5
* - Color Definitions
* - Interface
* - General
* - Messaging Types
* - Button
* - Button State
* - Secondary Button
* - Secondary Button State
* - CTA Button
* - Borders
* - Links
* - Fonts
* - Transitions
* - Horizontal Rule
* - Breakpoints
* - Spacers
*
* **/
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* Callout Configuration File.
* **/
.Callout {
position: relative;
padding: 0.875rem;
background-color: #f6f6f6;
}
.Callout p {
font-size: 1.125rem;
}
.Callout.Callout--center, .Callout.Callout--left, .Callout.Callout--right {
display: block;
}
.Callout.Callout--overlay {
background-repeat: no-repeat;
background-size: cover;
background-position: center;
}
.Callout.Callout--overlay::before {
content: '';
display: block;
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.4);
z-index: 1;
}
.Callout.Callout--overlay.Callout--light {
color: #000000;
}
.Callout.Callout--overlay.Callout--light::before {
background: rgba(250, 250, 250, 0.75);
}
.Callout.Callout--overlay.Callout--light .Callout-content {
color: #000000;
}
.Callout.Callout--overlay .Callout-content {
position: relative;
color: #ffffff;
z-index: 2;
}
@media screen and (min-width: 768px) {
.Callout.Callout--center, .Callout.Callout--left, .Callout.Callout--right {
display: flex;
}
.Callout.Callout--center .Callout-content, .Callout.Callout--left .Callout-content, .Callout.Callout--right .Callout-content {
padding: 0.875rem;
max-width: 60%;
flex-basis: 60%;
}
.Callout.Callout--left {
justify-content: flex-start;
}
.Callout.Callout--left .Callout-content {
margin-left: 0.875rem;
}
.Callout.Callout--right {
justify-content: flex-end;
}
.Callout.Callout--right .Callout-content {
margin-right: 0.875rem;
}
.Callout.Callout--center {
justify-content: center;
text-align: center;
}
.Callout.Callout--center .Callout-content {
max-width: 80%;
flex-basis: 80%;
}
}
@media screen and (min-width: 991px) {
.Callout {
padding: 0.875rem;
}
}
/**
* Core Theme Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Imports
* - functions
* - mixins
* - animations
* - fonts
* - font awesome 5
* - Color Definitions
* - Interface
* - General
* - Messaging Types
* - Button
* - Button State
* - Secondary Button
* - Secondary Button State
* - CTA Button
* - Borders
* - Links
* - Fonts
* - Transitions
* - Horizontal Rule
* - Breakpoints
* - Spacers
*
* **/
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* Dropdown Menu Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - General
*
* **/
.Dropdown {
position: relative;
display: inline-block;
margin-right: 0.875rem;
margin-bottom: 0.875rem;
}
.Dropdown.Dropdown--block {
width: 100%;
display: block;
}
.Dropdown.Dropdown--block .Dropdown-trigger a, .Dropdown.Dropdown--block .Dropdown-trigger button {
width: 100%;
}
.Dropdown.Dropdown--block .Dropdown-trigger a::after, .Dropdown.Dropdown--block .Dropdown-trigger button::after {
right: 0;
top: 0;
bottom: 0;
margin: auto;
position: absolute;
}
.Dropdown.is-selected .Dropdown-trigger a, .Dropdown.is-selected .Dropdown-trigger button {
color: #000000;
}
.Dropdown.is-selected .Dropdown-trigger a::after, .Dropdown.is-selected .Dropdown-trigger button::after {
transition: fill 250ms;
background-image: url('data:image/svg+xml;utf8,');
}
.Dropdown.is-active .Dropdown-list {
display: block;
}
.Dropdown.is-error .Dropdown-trigger {
border-bottom: 0.25rem solid #ed7000;
}
.Dropdown.is-disabled {
pointer-events: none;
outline: none;
}
.Dropdown.is-disabled .Dropdown-trigger {
border-bottom: 0.0625rem solid #d8dada;
}
.Dropdown.is-disabled .Dropdown-trigger a, .Dropdown.is-disabled .Dropdown-trigger button {
color: #d8dada;
}
.Dropdown.is-disabled .Dropdown-trigger a::after, .Dropdown.is-disabled .Dropdown-trigger button::after {
transition: fill 250ms;
background-image: url('data:image/svg+xml;utf8,');
transition: fill 250ms;
}
.Dropdown .Dropdown-label, .Dropdown .Dropdown-value {
display: none;
}
.Dropdown .Dropdown-trigger {
border-bottom: 0.0625rem solid #747676;
}
.Dropdown .Dropdown-trigger:hover a, .Dropdown .Dropdown-trigger:hover button {
color: #000000;
transition: color 250ms;
}
.Dropdown .Dropdown-trigger:hover a::after, .Dropdown .Dropdown-trigger:hover button::after {
transition: fill 250ms;
background-image: url('data:image/svg+xml;utf8,');
transition: fill 250ms;
}
.Dropdown .Dropdown-trigger a, .Dropdown .Dropdown-trigger button {
background: none;
text-align: left;
border-radius: 0;
padding: 0;
margin: 0;
font-size: 1.5625rem;
color: #747676;
border: none;
font-family: inherit;
}
.Dropdown .Dropdown-trigger a::after, .Dropdown .Dropdown-trigger button::after {
transition: fill 250ms;
background-image: url('data:image/svg+xml;utf8,');
transition: fill 250ms;
content: '';
width: 1ch;
height: 1ch;
position: relative;
margin-left: 1ch;
display: inline-block;
background-repeat: no-repeat;
background-size: 100%;
background-position: center;
transition: transform 400ms;
transform: rotateX(0deg);
}
.Dropdown .Dropdown-list {
display: none;
position: absolute;
width: 100%;
}
.Dropdown .Dropdown-list .Dropdown-item {
border: 0.0625rem solid #d8dada;
border-top: none;
background: #ffffff;
}
.Dropdown .Dropdown-list .Dropdown-item:hover a, .Dropdown .Dropdown-list .Dropdown-item:hover button {
color: #000000;
}
.Dropdown .Dropdown-list a, .Dropdown .Dropdown-list button {
background: none;
text-align: left;
border-radius: 0;
padding: 0.875rem;
margin: 0;
font-size: 1.125rem;
color: #747676;
border: none;
font-family: inherit;
width: 100%;
}
.Dropdown .Dropdown-message {
padding: 0.4375rem 0;
font-size: 0.65625rem;
margin-bottom: 0;
}
/**
* Core Theme Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Imports
* - functions
* - mixins
* - animations
* - fonts
* - font awesome 5
* - Color Definitions
* - Interface
* - General
* - Messaging Types
* - Button
* - Button State
* - Secondary Button
* - Secondary Button State
* - CTA Button
* - Borders
* - Links
* - Fonts
* - Transitions
* - Horizontal Rule
* - Breakpoints
* - Spacers
*
* **/
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* Forms Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Imports
* - Form Groups
* - General
* - Form Help
* - Labels
* - Text Inputs
* - Text Input
* - Input Focus
* - Input Icons
* - Selects
* - Controls
* - Text Area
*
* **/
.Form {
display: block;
margin: 0;
}
.Form-group {
margin-bottom: 0.875rem;
}
.Form-label {
font-size: 0.625rem;
display: flex;
margin-bottom: 0;
color: #747676;
line-height: 1;
}
.Form-label--disabled {
color: #d8dada;
}
.Form-label + .Form-input {
display: inline-flex;
margin-top: 0.4375rem;
}
.Form-input {
-webkit-appearance: none;
-moz-appearance: none;
position: relative;
display: inline-block;
box-sizing: border-box;
vertical-align: top;
margin: 0 0.25rem 0.5ch 0;
padding: 1.5ch;
background-color: #ffffff;
border-radius: 0;
color: #000000;
font-size: 0.875rem;
font-weight: normal;
line-height: 1;
transition: border 250ms;
border-top: 0.0625rem solid #d8dada;
border-right: 0.0625rem solid #d8dada;
border-bottom: 0.125rem solid #000000;
border-left: 0.0625rem solid #d8dada;
height: 2.625rem;
width: 8.4375rem;
}
.Form-input::-webkit-input-placeholder {
color: #747676;
}
.Form-input::-moz-placeholder {
color: #747676;
}
.Form-input:-ms-input-placeholder {
color: #747676;
}
.Form-input:-moz-placeholder {
color: #747676;
}
.Form-input:disabled, .Form-input.is-disabled {
border-color: #d8dada;
}
.Form-input:focus, .Form-input.is-focused {
transition: border 250ms;
outline: none;
border-top: 0.0625rem solid #000000;
border-left: 0.0625rem solid #000000;
border-right: 0.0625rem solid #000000;
}
.Form-input.is-disabled, .Form-input[disabled] {
pointer-events: none;
border-color: #d8dada;
border-bottom: 0.0625rem solid #d8dada;
}
.Form-input.is-locked, .Form-input.is-locked[disabled] {
pointer-events: none;
color: #000000;
}
.Form-input.is-success {
border-color: #00ac3e;
border-bottom-width: 0.25rem;
}
.Form-input.is-success[type="date"], .Form-input.is-success[type="datetime-local"], .Form-input.is-success[type="email"], .Form-input.is-success[type="month"], .Form-input.is-success[type="number"], .Form-input.is-success[type="password"], .Form-input.is-success[type="search"], .Form-input.is-success[type="tel"], .Form-input.is-success[type="text"], .Form-input.is-success[type="time"], .Form-input.is-success[type="url"], .Form-input.is-success[type="week"] {
border-color: #00ac3e;
}
.Form-input.is-success:focus, .Form-input.is-success.is-focused {
transition: border 250ms;
outline: none;
border-top: 0.0625rem solid #000000;
border-left: 0.0625rem solid #000000;
border-right: 0.0625rem solid #000000;
}
.Form-input.is-info {
border-color: #0088ce;
border-bottom-width: 0.25rem;
}
.Form-input.is-info[type="date"], .Form-input.is-info[type="datetime-local"], .Form-input.is-info[type="email"], .Form-input.is-info[type="month"], .Form-input.is-info[type="number"], .Form-input.is-info[type="password"], .Form-input.is-info[type="search"], .Form-input.is-info[type="tel"], .Form-input.is-info[type="text"], .Form-input.is-info[type="time"], .Form-input.is-info[type="url"], .Form-input.is-info[type="week"] {
border-color: #0088ce;
}
.Form-input.is-info:focus, .Form-input.is-info.is-focused {
transition: border 250ms;
outline: none;
border-top: 0.0625rem solid #000000;
border-left: 0.0625rem solid #000000;
border-right: 0.0625rem solid #000000;
}
.Form-input.is-warning {
border-color: #ffbc3d;
border-bottom-width: 0.25rem;
}
.Form-input.is-warning[type="date"], .Form-input.is-warning[type="datetime-local"], .Form-input.is-warning[type="email"], .Form-input.is-warning[type="month"], .Form-input.is-warning[type="number"], .Form-input.is-warning[type="password"], .Form-input.is-warning[type="search"], .Form-input.is-warning[type="tel"], .Form-input.is-warning[type="text"], .Form-input.is-warning[type="time"], .Form-input.is-warning[type="url"], .Form-input.is-warning[type="week"] {
border-color: #ffbc3d;
}
.Form-input.is-warning:focus, .Form-input.is-warning.is-focused {
transition: border 250ms;
outline: none;
border-top: 0.0625rem solid #000000;
border-left: 0.0625rem solid #000000;
border-right: 0.0625rem solid #000000;
}
.Form-input.is-error {
border-color: #ed7000;
border-bottom-width: 0.25rem;
}
.Form-input.is-error[type="date"], .Form-input.is-error[type="datetime-local"], .Form-input.is-error[type="email"], .Form-input.is-error[type="month"], .Form-input.is-error[type="number"], .Form-input.is-error[type="password"], .Form-input.is-error[type="search"], .Form-input.is-error[type="tel"], .Form-input.is-error[type="text"], .Form-input.is-error[type="time"], .Form-input.is-error[type="url"], .Form-input.is-error[type="week"] {
border-color: #ed7000;
}
.Form-input.is-error:focus, .Form-input.is-error.is-focused {
transition: border 250ms;
outline: none;
border-top: 0.0625rem solid #000000;
border-left: 0.0625rem solid #000000;
border-right: 0.0625rem solid #000000;
}
textarea.Form-input {
padding: 1.5ch;
width: 100%;
}
textarea.Form-input.is-success {
border-color: #00ac3e;
border-bottom-width: 0.25rem;
}
textarea.Form-input.is-info {
border-color: #0088ce;
border-bottom-width: 0.25rem;
}
textarea.Form-input.is-warning {
border-color: #ffbc3d;
border-bottom-width: 0.25rem;
}
textarea.Form-input.is-error {
border-color: #ed7000;
border-bottom-width: 0.25rem;
}
.Form-checkbox--inline, .Form-radio--inline {
display: inline-block;
}
.Form-checkbox input[type="checkbox"], .Form-checkbox input[type="radio"], .Form-radio input[type="checkbox"], .Form-radio input[type="radio"] {
opacity: 0;
margin-left: -1.3125rem;
}
.Form-checkbox label, .Form-radio label {
display: inline-block;
position: relative;
padding: 0.3125rem 0.3125rem 0.625rem calc(1.3125rem + 1ch);
margin: 0 1ch 1ch 0.3125rem;
}
.Form-checkbox label:focus, .Form-radio label:focus {
outline: none;
}
.Form-checkbox label::before, .Form-radio label::before {
position: absolute;
content: '';
background-repeat: no-repeat;
background-size: cover;
width: 1.3125rem;
height: 1.3125rem;
left: 0;
top: 0;
bottom: 0.3125rem;
margin: auto;
}
@supports (-ms-ime-align: auto) {
.Form-checkbox label::before, .Form-radio label::before {
width: 1.5rem;
height: 1.5rem;
left: -2;
top: -2;
}
}
.Form-checkbox input[type="checkbox"] + label::before {
background-image: url("data:image/svg+xml,%3Csvg width='999px' height='999px' viewBox='0 0 999 999' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3C!-- Generator: Sketch 51.3 (57544) - http://www.bohemiancoding.com/sketch --%3E%3Ctitle%3Echeckbox-default%3C/title%3E%3Cdesc%3ECreated with Sketch.%3C/desc%3E%3Cdefs%3E%3C/defs%3E%3Cg id='checkbox-default' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cpath d='M0,0 L999,0 L999,999 L0,999 L0,0 Z M50,50 L50,950 L950,950 L950,50 L50,50 Z' id='Combined-Shape' fill='%23000000'%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
}
.Form-checkbox input[type="checkbox"]:focus + label::before {
background-image: url("data:image/svg+xml,%3Csvg width='999px' height='999px' viewBox='0 0 999 999' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3C!-- Generator: Sketch 51.3 (57544) - http://www.bohemiancoding.com/sketch --%3E%3Ctitle%3Echeckbox-focus%3C/title%3E%3Cdesc%3ECreated with Sketch.%3C/desc%3E%3Cdefs%3E%3C/defs%3E%3Cg id='checkbox-focus' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cpath d='M0,0 L999,0 L999,999 L0,999 L0,0 Z M85,85 L85,915 L915,915 L915,85 L85,85 Z' id='Combined-Shape' fill='%23000000'%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
}
.Form-checkbox input[type="checkbox"]:checked + label::before {
background-image: url("data:image/svg+xml,%3Csvg width='999px' height='999px' viewBox='0 0 999 999' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3C!-- Generator: Sketch 51.3 (57544) - http://www.bohemiancoding.com/sketch --%3E%3Ctitle%3Echeckbox-selected%3C/title%3E%3Cdesc%3ECreated with Sketch.%3C/desc%3E%3Cdefs%3E%3C/defs%3E%3Cg id='checkbox-selected' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cpath d='M422.494634,642.014224 L719.047695,324 L732.579709,336.618808 L433.532014,657.308198 L433.324642,657.114821 L421.956631,668.092782 L265.501266,506.078508 L278.81099,493.225456 L422.494634,642.014224 Z M0,0 L999,0 L999,999 L0,999 L0,0 Z M50,50 L50,950 L950,950 L950,50 L50,50 Z' id='Combined-Shape' fill='%23000000'%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
}
.Form-checkbox input[type="checkbox"]:checked:focus + label::before {
background-image: url("data:image/svg+xml,%3Csvg width='999px' height='999px' viewBox='0 0 999 999' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3C!-- Generator: Sketch 51.3 (57544) - http://www.bohemiancoding.com/sketch --%3E%3Ctitle%3Echeckbox-selected-focus%3C/title%3E%3Cdesc%3ECreated with Sketch.%3C/desc%3E%3Cdefs%3E%3C/defs%3E%3Cg id='checkbox-selected-focus' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cpath d='M422.494634,642.014224 L719.047695,324 L732.579709,336.618808 L433.532014,657.308198 L433.324642,657.114821 L421.956631,668.092782 L265.501266,506.078508 L278.81099,493.225456 L422.494634,642.014224 Z M0,0 L999,0 L999,999 L0,999 L0,0 Z M85,85 L85,915 L915,915 L915,85 L85,85 Z' id='Combined-Shape' fill='%23000000'%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
}
.Form-checkbox.is-error input[type="checkbox"] + label::before {
background-image: url("data:image/svg+xml,%3Csvg width='999px' height='999px' viewBox='0 0 999 999' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3C!-- Generator: Sketch 51.3 (57544) - http://www.bohemiancoding.com/sketch --%3E%3Ctitle%3Echeckbox-default-error%3C/title%3E%3Cdesc%3ECreated with Sketch.%3C/desc%3E%3Cdefs%3E%3C/defs%3E%3Cg id='checkbox-default-error' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cpath d='M0,0 L999,0 L999,999 L0,999 L0,0 Z M50,50 L50,950 L950,950 L950,50 L50,50 Z' id='Combined-Shape' fill='%23EC7002'%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
}
.Form-checkbox.is-error input[type="checkbox"]:checked + label::before {
background-image: url("data:image/svg+xml,%3Csvg width='999px' height='999px' viewBox='0 0 999 999' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3C!-- Generator: Sketch 51.3 (57544) - http://www.bohemiancoding.com/sketch --%3E%3Ctitle%3Echeckbox-selected-error%3C/title%3E%3Cdesc%3ECreated with Sketch.%3C/desc%3E%3Cdefs%3E%3C/defs%3E%3Cg id='checkbox-selected-error' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Crect fill='%23FFFFFF' x='0' y='0' width='999' height='999'%3E%3C/rect%3E%3Cpath d='M422.494634,642.014224 L719.047695,324 L732.579709,336.618808 L433.532014,657.308198 L433.324642,657.114821 L421.956631,668.092782 L265.501266,506.078508 L278.81099,493.225456 L422.494634,642.014224 Z M0,0 L999,0 L999,999 L0,999 L0,0 Z M50,50 L50,950 L950,950 L950,50 L50,50 Z' id='Combined-Shape' fill='%23EC7002'%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
}
.Form-checkbox.is-error input[type="checkbox"]:focus + label::before {
background-image: url("data:image/svg+xml,%3Csvg width='999px' height='999px' viewBox='0 0 999 999' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3C!-- Generator: Sketch 51.3 (57544) - http://www.bohemiancoding.com/sketch --%3E%3Ctitle%3Echeckbox-focus-error%3C/title%3E%3Cdesc%3ECreated with Sketch.%3C/desc%3E%3Cdefs%3E%3C/defs%3E%3Cg id='checkbox-focus-error' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cpath d='M0,0 L999,0 L999,999 L0,999 L0,0 Z M85,85 L85,915 L915,915 L915,85 L85,85 Z' id='Combined-Shape' fill='%23EC7002'%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
}
.Form-checkbox.is-error input[type="checkbox"]:checked:focus + label::before {
background-image: url("data:image/svg+xml,%3Csvg width='999px' height='999px' viewBox='0 0 999 999' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3C!-- Generator: Sketch 51.3 (57544) - http://www.bohemiancoding.com/sketch --%3E%3Ctitle%3Echeckbox-selected-focus-error%3C/title%3E%3Cdesc%3ECreated with Sketch.%3C/desc%3E%3Cdefs%3E%3C/defs%3E%3Cg id='checkbox-selected-focus-error' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cpath d='M422.494634,642.014224 L719.047695,324 L732.579709,336.618808 L433.532014,657.308198 L433.324642,657.114821 L421.956631,668.092782 L265.501266,506.078508 L278.81099,493.225456 L422.494634,642.014224 Z M0,0 L999,0 L999,999 L0,999 L0,0 Z M85,85 L85,915 L915,915 L915,85 L85,85 Z' id='Combined-Shape' fill='%23EC7002'%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
}
.Form-checkbox.is-disabled input[type="checkbox"] + label::before {
background-image: url("data:image/svg+xml,%3Csvg width='999px' height='999px' viewBox='0 0 999 999' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3C!-- Generator: Sketch 51.3 (57544) - http://www.bohemiancoding.com/sketch --%3E%3Ctitle%3Echeckbox-default-disabled%3C/title%3E%3Cdesc%3ECreated with Sketch.%3C/desc%3E%3Cdefs%3E%3C/defs%3E%3Cg id='checkbox-default-disabled' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cpath d='M0,0 L999,0 L999,999 L0,999 L0,0 Z M50,50 L50,950 L950,950 L950,50 L50,50 Z' id='Combined-Shape' fill='%23DADCDC'%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
}
.Form-checkbox.is-disabled input[type="checkbox"]:checked + label::before {
background-image: url("data:image/svg+xml,%3Csvg width='999px' height='999px' viewBox='0 0 999 999' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3C!-- Generator: Sketch 51.3 (57544) - http://www.bohemiancoding.com/sketch --%3E%3Ctitle%3Echeckbox-selected-disabled%3C/title%3E%3Cdesc%3ECreated with Sketch.%3C/desc%3E%3Cdefs%3E%3C/defs%3E%3Cg id='checkbox-selected-disabled' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cpath d='M376.149042,714.326585 L786.255635,274.541107 L805.638479,292.615901 L377.291696,751.961588 L367.348575,742.689478 L367.010738,743.015723 L360.785614,736.569418 L357.908852,733.886794 L358.049442,733.736029 L142.908852,510.951426 L161.973295,492.541107 L376.149042,714.326585 Z M0,0 L999,0 L999,999 L0,999 L0,0 Z M50,50 L50,950 L950,950 L950,50 L50,50 Z' id='Combined-Shape' fill='%23DADCDC'%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
}
.Form-checkbox.is-disabled input[type="checkbox"]:focus + label::before {
background-image: url("data:image/svg+xml,%3Csvg width='999px' height='999px' viewBox='0 0 999 999' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3C!-- Generator: Sketch 51.3 (57544) - http://www.bohemiancoding.com/sketch --%3E%3Ctitle%3Echeckbox-focus-disabled%3C/title%3E%3Cdesc%3ECreated with Sketch.%3C/desc%3E%3Cdefs%3E%3C/defs%3E%3Cg id='checkbox-focus-disabled' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cpath d='M0,0 L999,0 L999,999 L0,999 L0,0 Z M85,85 L85,915 L915,915 L915,85 L85,85 Z' id='Combined-Shape' fill='%23DADCDC'%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
}
.Form-checkbox.is-disabled input[type="checkbox"]:checked:focus + label::before {
background-image: url("data:image/svg+xml,%3Csvg width='999px' height='999px' viewBox='0 0 999 999' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3C!-- Generator: Sketch 51.3 (57544) - http://www.bohemiancoding.com/sketch --%3E%3Ctitle%3Echeckbox-selected-focus-disabled%3C/title%3E%3Cdesc%3ECreated with Sketch.%3C/desc%3E%3Cdefs%3E%3C/defs%3E%3Cg id='checkbox-selected-focus-disabled' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cpath d='M422.494634,642.014224 L719.047695,324 L732.579709,336.618808 L433.532014,657.308198 L433.324642,657.114821 L421.956631,668.092782 L265.501266,506.078508 L278.81099,493.225456 L422.494634,642.014224 Z M0,0 L999,0 L999,999 L0,999 L0,0 Z M85,85 L85,915 L915,915 L915,85 L85,85 Z' id='Combined-Shape' fill='%23DADCDC'%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
}
.Form-radio input[type="radio"] + label::before {
background-image: url("data:image/svg+xml,%3Csvg width='999px' height='999px' viewBox='0 0 999 999' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3C!-- Generator: Sketch 51.3 (57544) - http://www.bohemiancoding.com/sketch --%3E%3Ctitle%3Eradio-default%3C/title%3E%3Cdesc%3ECreated with Sketch.%3C/desc%3E%3Cdefs%3E%3C/defs%3E%3Cg id='radio-default' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cpath d='M499.5,999 C223.633767,999 0,775.366233 0,499.5 C0,223.633767 223.633767,0 499.5,0 C775.366233,0 999,223.633767 999,499.5 C999,775.366233 775.366233,999 499.5,999 Z M500.00201,949.803015 C746.202226,949.803015 945.786935,748.420246 945.786935,500.00201 C945.786935,251.583775 746.202226,50.201005 500.00201,50.201005 C253.801794,50.201005 54.2170854,251.583775 54.2170854,500.00201 C54.2170854,748.420246 253.801794,949.803015 500.00201,949.803015 Z' id='Combined-Shape' fill='%23000000'%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
}
.Form-radio input[type="radio"]:focus + label::before {
background-image: url("data:image/svg+xml,%3Csvg width='999px' height='999px' viewBox='0 0 999 999' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3C!-- Generator: Sketch 51.3 (57544) - http://www.bohemiancoding.com/sketch --%3E%3Ctitle%3Eradio-focus%3C/title%3E%3Cdesc%3ECreated with Sketch.%3C/desc%3E%3Cdefs%3E%3C/defs%3E%3Cg id='radio-focus' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cpath d='M499.5,999 C223.633767,999 0,775.366233 0,499.5 C0,223.633767 223.633767,0 499.5,0 C775.366233,0 999,223.633767 999,499.5 C999,775.366233 775.366233,999 499.5,999 Z M499.294643,915 C726.446402,915 910.589286,729.198171 910.589286,500 C910.589286,270.801829 726.446402,85 499.294643,85 C272.142884,85 88,270.801829 88,500 C88,729.198171 272.142884,915 499.294643,915 Z' id='Combined-Shape' fill='%23000000'%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
}
.Form-radio input[type="radio"]:checked + label::before {
background-image: url("data:image/svg+xml,%3Csvg width='999px' height='999px' viewBox='0 0 999 999' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3C!-- Generator: Sketch 51.3 (57544) - http://www.bohemiancoding.com/sketch --%3E%3Ctitle%3Eradio-selected%3C/title%3E%3Cdesc%3ECreated with Sketch.%3C/desc%3E%3Cdefs%3E%3C/defs%3E%3Cg id='radio-selected' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cpath d='M499.5,999 C223.633767,999 0,775.366233 0,499.5 C0,223.633767 223.633767,0 499.5,0 C775.366233,0 999,223.633767 999,499.5 C999,775.366233 775.366233,999 499.5,999 Z M500.00201,949.803015 C746.202226,949.803015 945.786935,748.420246 945.786935,500.00201 C945.786935,251.583775 746.202226,50.201005 500.00201,50.201005 C253.801794,50.201005 54.2170854,251.583775 54.2170854,500.00201 C54.2170854,748.420246 253.801794,949.803015 500.00201,949.803015 Z M499.5,705.826131 C388.876254,705.826131 299.19799,615.248836 299.19799,503.51608 C299.19799,391.783325 388.876254,301.20603 499.5,301.20603 C610.123746,301.20603 699.80201,391.783325 699.80201,503.51608 C699.80201,615.248836 610.123746,705.826131 499.5,705.826131 Z' id='Combined-Shape' fill='%23000000'%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
}
.Form-radio input[type="radio"]:checked:focus + label::before {
background-image: url("data:image/svg+xml,%3Csvg width='999px' height='999px' viewBox='0 0 999 999' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3C!-- Generator: Sketch 51.3 (57544) - http://www.bohemiancoding.com/sketch --%3E%3Ctitle%3Eradio-focus-selected%3C/title%3E%3Cdesc%3ECreated with Sketch.%3C/desc%3E%3Cdefs%3E%3C/defs%3E%3Cg id='radio-focus-selected' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cpath d='M499.5,999 C223.633767,999 0,775.366233 0,499.5 C0,223.633767 223.633767,0 499.5,0 C775.366233,0 999,223.633767 999,499.5 C999,775.366233 775.366233,999 499.5,999 Z M499.294643,915 C726.446402,915 910.589286,729.198171 910.589286,500 C910.589286,270.801829 726.446402,85 499.294643,85 C272.142884,85 88,270.801829 88,500 C88,729.198171 272.142884,915 499.294643,915 Z M499.30201,701.620101 C388.678265,701.620101 299,611.042806 299,499.31005 C299,387.577295 388.678265,297 499.30201,297 C609.925756,297 699.60402,387.577295 699.60402,499.31005 C699.60402,611.042806 609.925756,701.620101 499.30201,701.620101 Z' id='Combined-Shape' fill='%23000000'%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
}
.Form-radio.is-error input[type="radio"] + label::before {
background-image: url("data:image/svg+xml,%3Csvg width='999px' height='999px' viewBox='0 0 999 999' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3C!-- Generator: Sketch 51.3 (57544) - http://www.bohemiancoding.com/sketch --%3E%3Ctitle%3Eradio-default-error%3C/title%3E%3Cdesc%3ECreated with Sketch.%3C/desc%3E%3Cdefs%3E%3C/defs%3E%3Cg id='radio-default-error' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cpath d='M499.5,999 C223.633767,999 0,775.366233 0,499.5 C0,223.633767 223.633767,0 499.5,0 C775.366233,0 999,223.633767 999,499.5 C999,775.366233 775.366233,999 499.5,999 Z M500.00201,949.803015 C746.202226,949.803015 945.786935,748.420246 945.786935,500.00201 C945.786935,251.583775 746.202226,50.201005 500.00201,50.201005 C253.801794,50.201005 54.2170854,251.583775 54.2170854,500.00201 C54.2170854,748.420246 253.801794,949.803015 500.00201,949.803015 Z' id='Combined-Shape' fill='%23EC7002'%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
}
.Form-radio.is-error input[type="radio"]:checked + label::before {
background-image: url("data:image/svg+xml,%3Csvg width='1002px' height='1005px' viewBox='0 0 1002 1005' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3C!-- Generator: Sketch 51.3 (57544) - http://www.bohemiancoding.com/sketch --%3E%3Ctitle%3Eradio-selected-error%3C/title%3E%3Cdesc%3ECreated with Sketch.%3C/desc%3E%3Cdefs%3E%3C/defs%3E%3Cg id='radio-selected-error' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cpath d='M501.5,1001 C225.633767,1001 2,777.366233 2,501.5 C2,225.633767 225.633767,2 501.5,2 C777.366233,2 1001,225.633767 1001,501.5 C1001,777.366233 777.366233,1001 501.5,1001 Z M502.00201,951.803015 C748.202226,951.803015 947.786935,750.420246 947.786935,502.00201 C947.786935,253.583775 748.202226,52.201005 502.00201,52.201005 C255.801794,52.201005 56.2170854,253.583775 56.2170854,502.00201 C56.2170854,750.420246 255.801794,951.803015 502.00201,951.803015 Z M501.5,707.826131 C390.876254,707.826131 301.19799,617.248836 301.19799,505.51608 C301.19799,393.783325 390.876254,303.20603 501.5,303.20603 C612.123746,303.20603 701.80201,393.783325 701.80201,505.51608 C701.80201,617.248836 612.123746,707.826131 501.5,707.826131 Z' id='Combined-Shape' fill='%23EC7002'%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
}
.Form-radio.is-error input[type="radio"]:focus + label::before {
background-image: url("data:image/svg+xml,%3Csvg width='999px' height='999px' viewBox='0 0 999 999' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3C!-- Generator: Sketch 51.3 (57544) - http://www.bohemiancoding.com/sketch --%3E%3Ctitle%3Eradio-focus-error%3C/title%3E%3Cdesc%3ECreated with Sketch.%3C/desc%3E%3Cdefs%3E%3C/defs%3E%3Cg id='radio-focus-error' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cpath d='M499.5,999 C223.633767,999 0,775.366233 0,499.5 C0,223.633767 223.633767,0 499.5,0 C775.366233,0 999,223.633767 999,499.5 C999,775.366233 775.366233,999 499.5,999 Z M499.294643,915 C726.446402,915 910.589286,729.198171 910.589286,500 C910.589286,270.801829 726.446402,85 499.294643,85 C272.142884,85 88,270.801829 88,500 C88,729.198171 272.142884,915 499.294643,915 Z' id='Combined-Shape' fill='%23EC7002'%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
}
.Form-radio.is-error input[type="radio"]:checked:focus + label::before {
background-image: url("data:image/svg+xml,%3Csvg width='999px' height='999px' viewBox='0 0 999 999' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3C!-- Generator: Sketch 51.3 (57544) - http://www.bohemiancoding.com/sketch --%3E%3Ctitle%3Eradio-selected-focus-error%3C/title%3E%3Cdesc%3ECreated with Sketch.%3C/desc%3E%3Cdefs%3E%3C/defs%3E%3Cg id='radio-selected-focus-error' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cpath d='M499.5,999 C223.633767,999 0,775.366233 0,499.5 C0,223.633767 223.633767,0 499.5,0 C775.366233,0 999,223.633767 999,499.5 C999,775.366233 775.366233,999 499.5,999 Z M499.294643,915 C726.446402,915 910.589286,729.198171 910.589286,500 C910.589286,270.801829 726.446402,85 499.294643,85 C272.142884,85 88,270.801829 88,500 C88,729.198171 272.142884,915 499.294643,915 Z M499.30201,701.620101 C388.678265,701.620101 299,611.042806 299,499.31005 C299,387.577295 388.678265,297 499.30201,297 C609.925756,297 699.60402,387.577295 699.60402,499.31005 C699.60402,611.042806 609.925756,701.620101 499.30201,701.620101 Z' id='Combined-Shape' fill='%23EC7002'%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
}
.Form-radio.is-disabled input[type="radio"] + label::before {
background-image: url("data:image/svg+xml,%3Csvg width='999px' height='999px' viewBox='0 0 999 999' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3C!-- Generator: Sketch 51.3 (57544) - http://www.bohemiancoding.com/sketch --%3E%3Ctitle%3Eradio-default-disabled%3C/title%3E%3Cdesc%3ECreated with Sketch.%3C/desc%3E%3Cdefs%3E%3C/defs%3E%3Cg id='radio-default-disabled' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cpath d='M499.5,999 C223.633767,999 0,775.366233 0,499.5 C0,223.633767 223.633767,0 499.5,0 C775.366233,0 999,223.633767 999,499.5 C999,775.366233 775.366233,999 499.5,999 Z M500.00201,949.803015 C746.202226,949.803015 945.786935,748.420246 945.786935,500.00201 C945.786935,251.583775 746.202226,50.201005 500.00201,50.201005 C253.801794,50.201005 54.2170854,251.583775 54.2170854,500.00201 C54.2170854,748.420246 253.801794,949.803015 500.00201,949.803015 Z' id='Combined-Shape' fill='%23DADCDC'%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
}
.Form-radio.is-disabled input[type="radio"]:checked + label::before {
background-image: url("data:image/svg+xml,%3Csvg width='1002px' height='1005px' viewBox='0 0 1002 1005' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3C!-- Generator: Sketch 51.3 (57544) - http://www.bohemiancoding.com/sketch --%3E%3Ctitle%3Eradio-selected-disabled%3C/title%3E%3Cdesc%3ECreated with Sketch.%3C/desc%3E%3Cdefs%3E%3C/defs%3E%3Cg id='radio-selected-disabled' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cpath d='M501.5,1001 C225.633767,1001 2,777.366233 2,501.5 C2,225.633767 225.633767,2 501.5,2 C777.366233,2 1001,225.633767 1001,501.5 C1001,777.366233 777.366233,1001 501.5,1001 Z M502.00201,951.803015 C748.202226,951.803015 947.786935,750.420246 947.786935,502.00201 C947.786935,253.583775 748.202226,52.201005 502.00201,52.201005 C255.801794,52.201005 56.2170854,253.583775 56.2170854,502.00201 C56.2170854,750.420246 255.801794,951.803015 502.00201,951.803015 Z M501.5,707.826131 C390.876254,707.826131 301.19799,617.248836 301.19799,505.51608 C301.19799,393.783325 390.876254,303.20603 501.5,303.20603 C612.123746,303.20603 701.80201,393.783325 701.80201,505.51608 C701.80201,617.248836 612.123746,707.826131 501.5,707.826131 Z' id='Combined-Shape' fill='%23DADCDC'%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
}
.Form-radio.is-disabled input[type="radio"]:focus + label::before {
background-image: url("data:image/svg+xml,%3Csvg width='999px' height='999px' viewBox='0 0 999 999' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3C!-- Generator: Sketch 51.3 (57544) - http://www.bohemiancoding.com/sketch --%3E%3Ctitle%3Eradio-focus-disabled%3C/title%3E%3Cdesc%3ECreated with Sketch.%3C/desc%3E%3Cdefs%3E%3C/defs%3E%3Cg id='radio-focus-disabled' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cpath d='M499.5,999 C223.633767,999 0,775.366233 0,499.5 C0,223.633767 223.633767,0 499.5,0 C775.366233,0 999,223.633767 999,499.5 C999,775.366233 775.366233,999 499.5,999 Z M499.294643,915 C726.446402,915 910.589286,729.198171 910.589286,500 C910.589286,270.801829 726.446402,85 499.294643,85 C272.142884,85 88,270.801829 88,500 C88,729.198171 272.142884,915 499.294643,915 Z' id='Combined-Shape' fill='%23DADCDC'%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
}
.Form-radio.is-disabled input[type="radio"]:checked:focus + label::before {
background-image: url("data:image/svg+xml,%3Csvg width='999px' height='999px' viewBox='0 0 999 999' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3C!-- Generator: Sketch 51.3 (57544) - http://www.bohemiancoding.com/sketch --%3E%3Ctitle%3Eradio-selected-focus-disabled%3C/title%3E%3Cdesc%3ECreated with Sketch.%3C/desc%3E%3Cdefs%3E%3C/defs%3E%3Cg id='radio-selected-focus-disabled' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cpath d='M499.5,999 C223.633767,999 0,775.366233 0,499.5 C0,223.633767 223.633767,0 499.5,0 C775.366233,0 999,223.633767 999,499.5 C999,775.366233 775.366233,999 499.5,999 Z M499.294643,915 C726.446402,915 910.589286,729.198171 910.589286,500 C910.589286,270.801829 726.446402,85 499.294643,85 C272.142884,85 88,270.801829 88,500 C88,729.198171 272.142884,915 499.294643,915 Z M499.30201,701.620101 C388.678265,701.620101 299,611.042806 299,499.31005 C299,387.577295 388.678265,297 499.30201,297 C609.925756,297 699.60402,387.577295 699.60402,499.31005 C699.60402,611.042806 609.925756,701.620101 499.30201,701.620101 Z' id='Combined-Shape' fill='%23DADCDC'%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
}
select.Form-input:not([multiple]) {
background-color: transparent;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13 8'%3E%3Cpath d='M5.5 5.5l-.354.354.354.353.354-.353L5.5 5.5zM-.354.354l5.5 5.5.708-.708-5.5-5.5-.708.708zm6.208 5.5l5.5-5.5-.708-.708-5.5 5.5.708.708z'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: right 0.875rem center;
background-size: 1.125rem;
padding: 0 3rem 0 1.5ch;
line-height: 1rem;
cursor: pointer;
}
select.Form-input:not([multiple]).is-success {
border-color: #00ac3e;
border-bottom-width: 0.25rem;
}
select.Form-input:not([multiple]).is-info {
border-color: #0088ce;
border-bottom-width: 0.25rem;
}
select.Form-input:not([multiple]).is-warning {
border-color: #ffbc3d;
border-bottom-width: 0.25rem;
}
select.Form-input:not([multiple]).is-error {
border-color: #ed7000;
border-bottom-width: 0.25rem;
}
select.Form-input[multiple] {
height: auto;
padding: 1.5ch;
}
.Form-switch {
border-radius: 1rem;
margin: 1rem 1rem 0;
display: inline-block;
position: relative;
}
.Form-switch input[type="checkbox"],
.Form-switch input[type="radio"] {
clip: rect(0 0 0 0);
position: absolute;
width: 0.0625rem;
height: 0.0625rem;
overflow: hidden;
margin: -0.0625rem;
padding: 0;
border: 0;
}
.Form-switch input[type="checkbox"] + label::before, .Form-switch input[type="checkbox"]:checked + label::before,
.Form-switch input[type="radio"] + label::before,
.Form-switch input[type="radio"]:checked + label::before {
background-image: none;
}
.Form-switch input[type="checkbox"]:focus + .Form-toggle,
.Form-switch input[type="radio"]:focus + .Form-toggle {
border: 0.125rem solid #000000;
outline: none;
}
.Form-switch input[type="checkbox"]:checked + .Form-toggle,
.Form-switch input[type="radio"]:checked + .Form-toggle {
background-color: #00ac3e;
transition: background-color 250ms;
}
.Form-switch input[type="checkbox"]:checked + .Form-toggle::before,
.Form-switch input[type="radio"]:checked + .Form-toggle::before {
transition: left 250ms;
left: calc(100% - 1rem);
content: '';
}
.Form-switch .Form-toggle {
width: 2rem;
background-color: #a7a7a7;
transition: background-color 250ms;
border: 0.125rem solid transparent;
border-radius: 1rem;
min-height: 1.25rem;
display: inline-block;
cursor: pointer;
position: relative;
margin: 0;
left: 0;
}
.Form-switch .Form-toggle::before {
background-image: none;
padding-left: 0;
transition: left 250ms;
left: 0;
content: '';
height: 1rem;
width: 1rem;
background: #ffffff;
border-radius: 50%;
top: 0;
bottom: 0;
margin-top: auto;
margin-bottom: auto;
position: absolute;
}
.Form-switch.Form-switch--block {
display: block;
}
.Form-switch.Form-switch--block.Form-switch--withLabel {
display: flex;
}
.Form-switch.Form-switch--withLabel {
display: inline-flex;
align-items: center;
}
.Form-switch.Form-switch--withLabel label {
margin-bottom: 0;
}
.Form-switch.Form-switch--withLabel .Form-label, .Form-switch.Form-switch--withLabel label {
display: inline-block;
}
.Form-switch.Form-switch--withLabel .Form-label--primary {
margin-right: 1ch;
}
.Form-switch.Form-switch--withLabel .Form-label--secondary {
margin-left: 1ch;
}
.Form-switch.is-disabled .Form-toggle {
background-color: #d8dada;
cursor: auto;
}
.Form-text {
display: block;
margin-top: 0.4375rem;
font-size: 0.75rem;
color: #747676;
}
/**
* Core Theme Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Imports
* - functions
* - mixins
* - animations
* - fonts
* - font awesome 5
* - Color Definitions
* - Interface
* - General
* - Messaging Types
* - Button
* - Button State
* - Secondary Button
* - Secondary Button State
* - CTA Button
* - Borders
* - Links
* - Fonts
* - Transitions
* - Horizontal Rule
* - Breakpoints
* - Spacers
*
* **/
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* Grids Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Imports
* - General
*
* **/
.Grid {
box-sizing: border-box;
display: flex;
flex-flow: row wrap;
margin: 0 -8px;
padding: 0;
}
.Grid.Grid--vertical {
flex-flow: column nowrap;
}
.Grid.Grid--gapless {
margin: 0;
}
.Grid.Grid--gapless > .Col {
padding: 0;
}
.Grid.Grid--gapless > .Row {
padding: 0;
}
.Col {
position: relative;
box-sizing: inherit;
flex-basis: 100%;
max-width: 100%;
min-width: 0;
padding: 0 8px 16px;
}
.Row {
position: relative;
box-sizing: inherit;
flex-basis: 100%;
max-height: 100%;
min-width: 0;
padding: 8px 0;
}
.Row--1 {
flex-basis: 8.33333%;
max-height: 8.33333%;
}
.Row--2 {
flex-basis: 16.66667%;
max-height: 16.66667%;
}
.Row--3 {
flex-basis: 25%;
max-height: 25%;
}
.Row--4 {
flex-basis: 33.33333%;
max-height: 33.33333%;
}
.Row--5 {
flex-basis: 41.66667%;
max-height: 41.66667%;
}
.Row--6 {
flex-basis: 50%;
max-height: 50%;
}
.Row--7 {
flex-basis: 58.33333%;
max-height: 58.33333%;
}
.Row--8 {
flex-basis: 66.66667%;
max-height: 66.66667%;
}
.Row--9 {
flex-basis: 75%;
max-height: 75%;
}
.Row--10 {
flex-basis: 83.33333%;
max-height: 83.33333%;
}
.Row--11 {
flex-basis: 91.66667%;
max-height: 91.66667%;
}
.Row--12 {
flex-basis: 100%;
max-height: 100%;
}
.Col--1 {
flex-basis: 8.33333%;
max-width: 8.33333%;
}
.Col--2 {
flex-basis: 16.66667%;
max-width: 16.66667%;
}
.Col--3 {
flex-basis: 25%;
max-width: 25%;
}
.Col--4 {
flex-basis: 33.33333%;
max-width: 33.33333%;
}
.Col--5 {
flex-basis: 41.66667%;
max-width: 41.66667%;
}
.Col--6 {
flex-basis: 50%;
max-width: 50%;
}
.Col--7 {
flex-basis: 58.33333%;
max-width: 58.33333%;
}
.Col--8 {
flex-basis: 66.66667%;
max-width: 66.66667%;
}
.Col--9 {
flex-basis: 75%;
max-width: 75%;
}
.Col--10 {
flex-basis: 83.33333%;
max-width: 83.33333%;
}
.Col--11 {
flex-basis: 91.66667%;
max-width: 91.66667%;
}
.Col--12 {
flex-basis: 100%;
max-width: 100%;
}
@media screen and (min-width: 320px) {
.Col--xs1 {
flex-basis: 8.33333%;
max-width: 8.33333%;
}
.Col--xs2 {
flex-basis: 16.66667%;
max-width: 16.66667%;
}
.Col--xs3 {
flex-basis: 25%;
max-width: 25%;
}
.Col--xs4 {
flex-basis: 33.33333%;
max-width: 33.33333%;
}
.Col--xs5 {
flex-basis: 41.66667%;
max-width: 41.66667%;
}
.Col--xs6 {
flex-basis: 50%;
max-width: 50%;
}
.Col--xs7 {
flex-basis: 58.33333%;
max-width: 58.33333%;
}
.Col--xs8 {
flex-basis: 66.66667%;
max-width: 66.66667%;
}
.Col--xs9 {
flex-basis: 75%;
max-width: 75%;
}
.Col--xs10 {
flex-basis: 83.33333%;
max-width: 83.33333%;
}
.Col--xs11 {
flex-basis: 91.66667%;
max-width: 91.66667%;
}
.Col--xs12 {
flex-basis: 100%;
max-width: 100%;
}
}
@media screen and (min-width: 544px) {
.Col--sm1 {
flex-basis: 8.33333%;
max-width: 8.33333%;
}
.Col--sm2 {
flex-basis: 16.66667%;
max-width: 16.66667%;
}
.Col--sm3 {
flex-basis: 25%;
max-width: 25%;
}
.Col--sm4 {
flex-basis: 33.33333%;
max-width: 33.33333%;
}
.Col--sm5 {
flex-basis: 41.66667%;
max-width: 41.66667%;
}
.Col--sm6 {
flex-basis: 50%;
max-width: 50%;
}
.Col--sm7 {
flex-basis: 58.33333%;
max-width: 58.33333%;
}
.Col--sm8 {
flex-basis: 66.66667%;
max-width: 66.66667%;
}
.Col--sm9 {
flex-basis: 75%;
max-width: 75%;
}
.Col--sm10 {
flex-basis: 83.33333%;
max-width: 83.33333%;
}
.Col--sm11 {
flex-basis: 91.66667%;
max-width: 91.66667%;
}
.Col--sm12 {
flex-basis: 100%;
max-width: 100%;
}
}
@media screen and (min-width: 768px) {
.Col--md1 {
flex-basis: 8.33333%;
max-width: 8.33333%;
}
.Col--md2 {
flex-basis: 16.66667%;
max-width: 16.66667%;
}
.Col--md3 {
flex-basis: 25%;
max-width: 25%;
}
.Col--md4 {
flex-basis: 33.33333%;
max-width: 33.33333%;
}
.Col--md5 {
flex-basis: 41.66667%;
max-width: 41.66667%;
}
.Col--md6 {
flex-basis: 50%;
max-width: 50%;
}
.Col--md7 {
flex-basis: 58.33333%;
max-width: 58.33333%;
}
.Col--md8 {
flex-basis: 66.66667%;
max-width: 66.66667%;
}
.Col--md9 {
flex-basis: 75%;
max-width: 75%;
}
.Col--md10 {
flex-basis: 83.33333%;
max-width: 83.33333%;
}
.Col--md11 {
flex-basis: 91.66667%;
max-width: 91.66667%;
}
.Col--md12 {
flex-basis: 100%;
max-width: 100%;
}
}
@media screen and (min-width: 991px) {
.Col--lg1 {
flex-basis: 8.33333%;
max-width: 8.33333%;
}
.Col--lg2 {
flex-basis: 16.66667%;
max-width: 16.66667%;
}
.Col--lg3 {
flex-basis: 25%;
max-width: 25%;
}
.Col--lg4 {
flex-basis: 33.33333%;
max-width: 33.33333%;
}
.Col--lg5 {
flex-basis: 41.66667%;
max-width: 41.66667%;
}
.Col--lg6 {
flex-basis: 50%;
max-width: 50%;
}
.Col--lg7 {
flex-basis: 58.33333%;
max-width: 58.33333%;
}
.Col--lg8 {
flex-basis: 66.66667%;
max-width: 66.66667%;
}
.Col--lg9 {
flex-basis: 75%;
max-width: 75%;
}
.Col--lg10 {
flex-basis: 83.33333%;
max-width: 83.33333%;
}
.Col--lg11 {
flex-basis: 91.66667%;
max-width: 91.66667%;
}
.Col--lg12 {
flex-basis: 100%;
max-width: 100%;
}
}
@media screen and (min-width: 1200px) {
.Col--xl1 {
flex-basis: 8.33333%;
max-width: 8.33333%;
}
.Col--xl2 {
flex-basis: 16.66667%;
max-width: 16.66667%;
}
.Col--xl3 {
flex-basis: 25%;
max-width: 25%;
}
.Col--xl4 {
flex-basis: 33.33333%;
max-width: 33.33333%;
}
.Col--xl5 {
flex-basis: 41.66667%;
max-width: 41.66667%;
}
.Col--xl6 {
flex-basis: 50%;
max-width: 50%;
}
.Col--xl7 {
flex-basis: 58.33333%;
max-width: 58.33333%;
}
.Col--xl8 {
flex-basis: 66.66667%;
max-width: 66.66667%;
}
.Col--xl9 {
flex-basis: 75%;
max-width: 75%;
}
.Col--xl10 {
flex-basis: 83.33333%;
max-width: 83.33333%;
}
.Col--xl11 {
flex-basis: 91.66667%;
max-width: 91.66667%;
}
.Col--xl12 {
flex-basis: 100%;
max-width: 100%;
}
}
@media screen and (min-width: 991px) {
.Grid {
margin: 0 -10px;
}
.Grid > .Col {
padding: 0 10px 20px;
}
}
/**
* Core Theme Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Imports
* - functions
* - mixins
* - animations
* - fonts
* - font awesome 5
* - Color Definitions
* - Interface
* - General
* - Messaging Types
* - Button
* - Button State
* - Secondary Button
* - Secondary Button State
* - CTA Button
* - Borders
* - Links
* - Fonts
* - Transitions
* - Horizontal Rule
* - Breakpoints
* - Spacers
*
* **/
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* Loaders Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Imports
* - General
*
* **/
@keyframes loading {
from {
transform: rotate(0);
}
to {
transform: rotate(360deg);
}
}
.Loader {
display: none;
}
.Loader::after {
content: '';
position: absolute;
top: 50%;
left: 50%;
width: 1.75rem;
height: 1.75rem;
display: block;
z-index: 6;
background-image: url("data:image/svg+xml,%3Csvg stroke='%23000000' viewBox='0 0 18 18' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m9 16.9c-4.3 0-7.9-3.5-7.9-7.9s3.6-7.9 7.9-7.9v-1.1c-5 0-9 4-9 9s4 9 9 9 9-4 9-9h-1.1c0 4.3-3.6 7.9-7.9 7.9z'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-size: cover;
border-top-color: transparent;
border-radius: 50%;
transform: translate(-50%, -50%);
animation: loading 0.5s infinite linear;
}
.Loader.is-active {
display: block;
}
.Loader--overlay {
background-color: rgba(255, 255, 255, 0.7);
top: 0;
width: 100%;
height: 100%;
position: absolute;
z-index: 5;
}
/**
* Core Theme Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Imports
* - functions
* - mixins
* - animations
* - fonts
* - font awesome 5
* - Color Definitions
* - Interface
* - General
* - Messaging Types
* - Button
* - Button State
* - Secondary Button
* - Secondary Button State
* - CTA Button
* - Borders
* - Links
* - Fonts
* - Transitions
* - Horizontal Rule
* - Breakpoints
* - Spacers
*
* **/
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* Modal Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Import
* - General
* - Modal Close
* - Modal Overlay
*
* **/
@keyframes modal-down {
0% {
opacity: 0;
transform: translateY(-9.375rem);
}
100% {
opacity: 1;
transform: translateY(0);
}
}
.Modal-container {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
display: none;
align-items: center;
justify-content: center;
}
.Modal-container.is-active {
display: flex;
}
.Modal {
position: relative;
width: 50%;
padding: 0.875rem;
z-index: 99;
overflow: hidden;
display: flex;
background-color: #ffffff;
animation: modal-down 0.4s ease;
justify-content: space-between;
flex-flow: column nowrap;
}
.Modal-overlay {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
opacity: 0;
background-color: rgba(0, 0, 0, 0.5);
}
.Modal-overlay.is-active {
opacity: 1;
display: block;
}
.Modal-close {
appearance: none;
position: absolute;
top: 0.875rem;
right: 0.875rem;
border: 0;
padding: 0;
background: transparent;
color: inherit;
}
.Modal-close:hover, .Modal-close:active, .Modal-close:focus {
background: transparent;
color: inherit;
}
.Modal-close::after {
font-family: inherit;
content: "\2715";
display: inline-block;
padding: 0;
color: inherit;
font-size: 1.125rem;
background-color: transparent;
}
footer.Modal-footer {
min-height: 0;
}
footer.Modal-footer--confirm {
display: flex;
justify-content: flex-end;
}
/**
* Core Theme Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Imports
* - functions
* - mixins
* - animations
* - fonts
* - font awesome 5
* - Color Definitions
* - Interface
* - General
* - Messaging Types
* - Button
* - Button State
* - Secondary Button
* - Secondary Button State
* - CTA Button
* - Borders
* - Links
* - Fonts
* - Transitions
* - Horizontal Rule
* - Breakpoints
* - Spacers
*
* **/
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* Notifications Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Import
* - General
* - Success
* - Info
* - Warning
* - Error
* **/
.Notifications {
position: absolute;
bottom: 0.875rem;
right: 0.875rem;
max-width: 40%;
min-width: 23.4375rem;
height: 3.625rem;
}
.Notifications.Notification--fixed {
position: fixed;
}
.Notification {
position: relative;
padding: 0.875rem 2.625rem 0.875rem 1.0625rem;
margin-bottom: 0.4375rem;
background-color: #0088ce;
color: #ffffff;
font-weight: bold;
text-align: left;
line-height: 0.875rem;
}
.Notification.Notification--success {
color: #ffffff;
background-color: #00ac3e;
}
.Notification.Notification--info {
color: #ffffff;
background-color: #0088ce;
}
.Notification.Notification--warning {
color: #000000;
background-color: #ffbc3d;
}
.Notification.Notification--error {
color: #ffffff;
background-color: #ed7000;
}
.Notification-close {
-webkit-appearance: none;
-moz-appearance: none;
position: absolute;
border: 0;
top: 0;
right: 0.875rem;
padding: 0;
background: transparent;
border-radius: 0;
color: inherit;
margin: 0;
height: 100%;
}
.Notification-close:hover, .Notification-close:focus {
background: transparent;
color: inherit;
outline: none;
}
.Notification-close::after {
color: inherit;
display: inline-block;
background-color: transparent;
content: "\2715";
font-size: 1.5rem;
}
/**
* Core Theme Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Imports
* - functions
* - mixins
* - animations
* - fonts
* - font awesome 5
* - Color Definitions
* - Interface
* - General
* - Messaging Types
* - Button
* - Button State
* - Secondary Button
* - Secondary Button State
* - CTA Button
* - Borders
* - Links
* - Fonts
* - Transitions
* - Horizontal Rule
* - Breakpoints
* - Spacers
*
* **/
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* Pagination Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - General
* - Pagination Item
* **/
.Pagination {
padding: 0;
margin: 0;
display: flex;
text-align: center;
justify-content: center;
align-items: center;
white-space: nowrap;
list-style-type: none;
}
.Pagination .Pagination-item {
text-align: center;
margin: 0 0.175rem;
}
.Pagination .Pagination-item a {
padding: 0.4375rem 0.875rem;
border-radius: 0;
text-decoration: none;
display: inline-block;
color: #000000;
}
.Pagination .Pagination-item[disabled], .Pagination .Pagination-item.is-disabled {
cursor: not-allowed;
color: #d8dada;
}
.Pagination .Pagination-item.is-active a {
color: #ffffff;
background-color: #000000;
border: #000000;
}
/**
* Core Theme Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Imports
* - functions
* - mixins
* - animations
* - fonts
* - font awesome 5
* - Color Definitions
* - Interface
* - General
* - Messaging Types
* - Button
* - Button State
* - Secondary Button
* - Secondary Button State
* - CTA Button
* - Borders
* - Links
* - Fonts
* - Transitions
* - Horizontal Rule
* - Breakpoints
* - Spacers
*
* **/
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* Pagination Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - General
* **/
.Progress {
box-sizing: border-box;
padding: 0;
margin: 0;
display: flex;
overflow: hidden;
border: 0;
border-radius: 0;
background-color: #d8dada;
}
.ProgressLabel {
margin-bottom: 0.4375rem;
}
.Progress-meter {
height: 1.3125rem;
display: flex;
align-items: center;
justify-content: center;
background-color: #d52b1e;
color: #ffffff;
font-size: 0.75rem;
font-family: inherit;
line-height: 1;
}
.Progress-meter.Progress-meter--textLeft {
justify-content: flex-start;
}
.Progress-meter.Progress-meter--textLeft::before {
content: ' ';
display: inline-block;
padding-left: 0.25rem;
}
.Progress-meter.Progress-meter--textRight {
justify-content: flex-end;
}
.Progress-meter.Progress-meter--textRight::after {
content: ' ';
display: inline-block;
padding-right: 0.25rem;
}
.Progress-meter.Progress-meter--success {
background-color: #00ac3e;
}
.Progress-meter.Progress-meter--info {
background-color: #0088ce;
}
.Progress-meter.Progress-meter--warning {
background-color: #ffbc3d;
color: #000000;
}
.Progress-meter.Progress-meter--error {
background-color: #ed7000;
}
/**
* Core Theme Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Imports
* - functions
* - mixins
* - animations
* - fonts
* - font awesome 5
* - Color Definitions
* - Interface
* - General
* - Messaging Types
* - Button
* - Button State
* - Secondary Button
* - Secondary Button State
* - CTA Button
* - Borders
* - Links
* - Fonts
* - Transitions
* - Horizontal Rule
* - Breakpoints
* - Spacers
*
* **/
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* Ratings Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - General
* **/
.Rating input[type="radio"] {
display: none;
-webkit-appearance: none;
-moz-appearance: none;
}
.Rating label {
background-image: url("data:image/svg+xml,%3Csvg width='1792' height='1792' viewBox='0 0 1792 1792' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1728 647q0 22-26 48l-363 354 86 500q1 7 1 20 0 21-10.5 35.5t-30.5 14.5q-19 0-40-12l-449-236-449 236q-22 12-40 12-21 0-31.5-14.5t-10.5-35.5q0-6 2-20l86-500-364-354q-25-27-25-48 0-37 56-46l502-73 225-455q19-41 49-41t49 41l225 455 502 73q56 9 56 46z'/%3E%3C/svg%3E");
width: 0.875rem;
height: 0.875rem;
background-size: 0.875rem;
display: inline-block;
cursor: pointer;
background-repeat: no-repeat;
}
.Rating input[type="radio"]:checked + label ~ label {
background-image: url("data:image/svg+xml,%3Csvg width='1792' height='1792' viewBox='0 0 1792 1792' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1201 1004l306-297-422-62-189-382-189 382-422 62 306 297-73 421 378-199 377 199zm527-357q0 22-26 48l-363 354 86 500q1 7 1 20 0 50-41 50-19 0-40-12l-449-236-449 236q-22 12-40 12-21 0-31.5-14.5t-10.5-35.5q0-6 2-20l86-500-364-354q-25-27-25-48 0-37 56-46l502-73 225-455q19-41 49-41t49 41l225 455 502 73q56 9 56 46z'/%3E%3C/svg%3E");
}
.Rating input[type="radio"]:focus + label {
outline: 0.0625rem dashed #000000;
}
.Rating input[type="radio"]:checked + label.Rating-half {
background-image: url("data:image/svg+xml,%3Csvg width='1792' height='1792' viewBox='0 0 1792 1792' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1250 957l257-250-356-52-66-10-30-60-159-322v963l59 31 318 168-60-355-12-66zm452-262l-363 354 86 500q5 33-6 51.5t-34 18.5q-17 0-40-12l-449-236-449 236q-23 12-40 12-23 0-34-18.5t-6-51.5l86-500-364-354q-32-32-23-59.5t54-34.5l502-73 225-455q20-41 49-41 28 0 49 41l225 455 502 73q45 7 54 34.5t-24 59.5z'/%3E%3C/svg%3E");
}
.Rating.Rating--static {
pointer-events: none;
}
/**
* Core Theme Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Imports
* - functions
* - mixins
* - animations
* - fonts
* - font awesome 5
* - Color Definitions
* - Interface
* - General
* - Messaging Types
* - Button
* - Button State
* - Secondary Button
* - Secondary Button State
* - CTA Button
* - Borders
* - Links
* - Fonts
* - Transitions
* - Horizontal Rule
* - Breakpoints
* - Spacers
*
* **/
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* Steps Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Import
* - Step
* - Steps
* - Step Arrow
*
* **/
.Steps ol {
display: flex;
padding-left: 0;
list-style: none;
justify-content: space-between;
align-items: stretch;
counter-reset: Steps-item;
}
.Steps li {
align-items: center;
justify-content: center;
height: 2.625rem;
width: 100%;
}
.Steps.Steps--auto .Steps-item .Steps-control::before {
counter-increment: Steps-item;
content: counter(Steps-item) ". ";
}
.Steps .Steps-item .Steps-control {
display: inline-flex;
align-items: center;
justify-content: center;
background: #000000;
color: #ffffff;
position: relative;
cursor: pointer;
-webkit-appearance: none;
-moz-appearance: none;
width: 100%;
height: 100%;
white-space: nowrap;
border-radius: 0;
border-top: 0.0625rem solid #000000;
border-bottom: 0.0625rem solid #000000;
border-right: 0.0625rem solid #000000;
border-left: transparent;
font-family: inherit;
font-weight: normal;
text-decoration: none;
margin: 0;
padding: 0;
text-align: center;
line-height: 1.25;
vertical-align: top;
}
.Steps .Steps-item .Steps-control:focus {
outline: 0.0625rem dashed #747676;
}
.Steps .Steps-item .Steps-title {
display: none;
}
.Steps .Steps-item.is-active .Steps-title {
display: inline;
}
.Steps .Steps-item.is-active .Steps-control {
background-color: #d8dada;
color: #000000;
border-top: 0.0625rem solid #d8dada;
border-bottom: 0.0625rem solid #d8dada;
border-right: 0.0625rem solid #d8dada;
}
.Steps .Steps-item.is-active .Steps-control::after {
border-color: transparent transparent transparent #d8dada;
}
.Steps .Steps-item.is-active ~ .Steps-item .Steps-control {
background-color: #ffffff;
color: #000000;
border-top: 0.0625rem solid #d8dada;
border-bottom: 0.0625rem solid #d8dada;
border-right: 0.0625rem solid #d8dada;
}
.Steps .Steps-item.is-active ~ .Steps-item .Steps-control::after {
border-color: transparent transparent transparent #ffffff;
}
@media screen and (min-width: 544px) {
.Steps .Steps-item .Steps-title {
display: inline;
}
.Steps .Steps-item .Steps-control::after {
content: '';
position: absolute;
width: 0;
height: 0;
border-style: solid;
border-width: 1.3125rem 0 1.3125rem 0.875rem;
border-color: transparent transparent transparent #000000;
right: -0.875rem;
top: 0;
bottom: 0;
margin: auto;
z-index: 2;
}
.Steps .Steps-item.is-active ~ .Steps-item .Steps-control::after {
display: none;
}
.Steps .Steps-item:last-child *::after {
content: none;
}
}
/**
* Core Theme Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Imports
* - functions
* - mixins
* - animations
* - fonts
* - font awesome 5
* - Color Definitions
* - Interface
* - General
* - Messaging Types
* - Button
* - Button State
* - Secondary Button
* - Secondary Button State
* - CTA Button
* - Borders
* - Links
* - Fonts
* - Transitions
* - Horizontal Rule
* - Breakpoints
* - Spacers
*
* **/
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* Swiper Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Import
* - General
* **/
.Swiper {
position: relative;
background-color: #ffffff;
display: block;
border: 0.0625rem solid #d8dada;
height: 28.125rem;
}
.Swiper-slides {
position: relative;
display: flex;
align-items: stretch;
overflow: hidden;
height: 100%;
}
.Swiper-slide {
visibility: hidden;
position: absolute;
top: 0;
left: 0;
width: calc(100% - 4.375rem);
height: 100%;
display: flex;
flex-direction: column;
background-color: #ffffff;
border-left: 0.0625rem solid #d8dada;
padding: 0.875rem;
}
.Swiper-slide * {
opacity: .5;
}
.Swiper-slide.is-current {
visibility: visible;
position: relative;
}
.Swiper-slide.is-current * {
opacity: 1;
}
.Swiper-slide.is-next {
position: absolute;
left: calc(100% - 4.375rem);
visibility: visible;
}
.Swiper-progress {
position: absolute;
bottom: 0.875rem;
display: flex;
align-items: center;
justify-content: center;
width: calc(100% - 4.375rem);
}
.Swiper-progress ul {
display: flex;
align-items: center;
justify-content: space-between;
padding-left: 0;
margin-bottom: 0;
}
.Swiper-progress li {
position: relative;
display: block;
width: 3rem;
bottom: 0.5rem;
padding-bottom: 0.5rem;
margin-right: 0.5rem;
cursor: pointer;
}
.Swiper-progress li::after {
content: '';
position: absolute;
height: 0.25rem;
bottom: 0%;
left: 0;
right: 0;
background-color: #d8dada;
transition: height 250ms, transform 250ms;
}
.Swiper-progress li:last-child {
margin-right: 0;
}
.Swiper-progress li:hover::after, .Swiper-progress li:focus::after {
height: 0.5rem;
transition: height 250ms, transform 250ms;
}
.Swiper-progress li:focus {
outline: 0.0625rem dashed #000000;
}
.Swiper-progress li.is-active::after {
height: 0.5rem;
background-color: #000000;
}
.Swiper-progress.Swiper-progress--dark:focus {
outline: 0.0625rem dashed #ffffff;
}
.Swiper-progress.Swiper-progress--dark li.is-active::after {
background-color: #ffffff;
}
.Swiper-control {
position: absolute;
top: 0;
bottom: 0;
display: flex;
align-items: center;
justify-content: center;
}
.Swiper-control button:focus {
outline: 0.0625rem dashed #000000;
}
.Swiper-control.Swiper-control--dark button:focus {
outline: 0.0625rem dashed #ffffff;
}
.Swiper-control.Swiper-control--dark .Swiper-next {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 34 32' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cuse xlink:href='%23a'/%3E%3Cdefs%3E%3Cpath id='a' fill='%23ffffff' d='M16.635.158c.19-.2.505-.212.707-.023l16 15c.202.19.212.505.023.707l-15 16c-.19.2-.505.212-.707.023-.202-.19-.212-.505-.023-.707L31.845 16H0v-1h31.736L16.658.865c-.202-.19-.212-.506-.023-.707z'/%3E%3C/defs%3E%3C/svg%3E");
}
.Swiper-control.Swiper-control--dark .Swiper-previous {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 34 32' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cuse xlink:href='%23a' transform='rotate(-180 16.75 16)'/%3E%3Cdefs%3E%3Cpath id='a' fill='%23ffffff' d='M16.635.158c.19-.2.505-.212.707-.023l16 15c.202.19.212.505.023.707l-15 16c-.19.2-.505.212-.707.023-.202-.19-.212-.505-.023-.707L31.845 16H0v-1h31.736L16.658.865c-.202-.19-.212-.506-.023-.707z'/%3E%3C/defs%3E%3C/svg%3E");
}
.Swiper-control--next {
right: 0.4375rem;
}
.Swiper-control--previous {
left: 0.4375rem;
}
.Swiper-next,
.Swiper-previous {
-webkit-appearance: none;
-moz-appearance: none;
border: 0;
background-color: transparent;
background-repeat: no-repeat;
background-position: center center;
background-size: 2.0625rem;
cursor: pointer;
border-radius: 0;
padding: 1.75rem;
margin: 0;
}
.Swiper-next:hover,
.Swiper-previous:hover {
background-color: transparent;
}
.Swiper-next {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 34 32' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cuse xlink:href='%23a'/%3E%3Cdefs%3E%3Cpath id='a' d='M16.635.158c.19-.2.505-.212.707-.023l16 15c.202.19.212.505.023.707l-15 16c-.19.2-.505.212-.707.023-.202-.19-.212-.505-.023-.707L31.845 16H0v-1h31.736L16.658.865c-.202-.19-.212-.506-.023-.707z'/%3E%3C/defs%3E%3C/svg%3E");
}
.Swiper-previous {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 34 32' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cuse xlink:href='%23a' transform='rotate(-180 16.75 16)'/%3E%3Cdefs%3E%3Cpath id='a' d='M16.635.158c.19-.2.505-.212.707-.023l16 15c.202.19.212.505.023.707l-15 16c-.19.2-.505.212-.707.023-.202-.19-.212-.505-.023-.707L31.845 16H0v-1h31.736L16.658.865c-.202-.19-.212-.506-.023-.707z'/%3E%3C/defs%3E%3C/svg%3E");
}
/**
* Core Theme Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Imports
* - functions
* - mixins
* - animations
* - fonts
* - font awesome 5
* - Color Definitions
* - Interface
* - General
* - Messaging Types
* - Button
* - Button State
* - Secondary Button
* - Secondary Button State
* - CTA Button
* - Borders
* - Links
* - Fonts
* - Transitions
* - Horizontal Rule
* - Breakpoints
* - Spacers
*
* **/
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* Table Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Import
* - Table
* - Table Head
* - Table Body
* - Table Modifier
*
* **/
table,
.Table {
border-collapse: collapse;
border-spacing: 0;
text-align: left;
width: 100%;
margin-bottom: 1.3125rem;
border: 0.0625rem solid #000000;
}
table th,
table td,
.Table th,
.Table td {
border-collapse: collapse;
border-spacing: 0;
vertical-align: center;
}
table th,
.Table th {
padding: 0.875rem;
background-color: #000000;
color: #ffffff;
border-right: 0.0625rem solid #ffffff;
border-bottom: 0.0625rem solid #ffffff;
}
table th:last-of-type,
.Table th:last-of-type {
border-right-color: #000000;
}
table td,
.Table td {
padding: 0.875rem;
background-color: #ffffff;
color: #000000;
border: 0.0625rem solid #000000;
}
.Table--hover tbody tr:hover td {
background-color: #d8dada;
}
.Table--noBorder {
border-color: transparent;
}
.Table--noBorder th,
.Table--noBorder td {
border-color: transparent;
}
.Table--striped tbody tr:nth-child(2) td {
background-color: #d8dada;
}
/**
* Core Theme Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Imports
* - functions
* - mixins
* - animations
* - fonts
* - font awesome 5
* - Color Definitions
* - Interface
* - General
* - Messaging Types
* - Button
* - Button State
* - Secondary Button
* - Secondary Button State
* - CTA Button
* - Borders
* - Links
* - Fonts
* - Transitions
* - Horizontal Rule
* - Breakpoints
* - Spacers
*
* **/
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* Tabs Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Import
* - Tab
* - Tab List
* - Tab Line
*
* **/
.Tabs-list {
display: flex;
margin: 0;
padding: 0;
list-style-type: none;
border-top: 0.0625rem solid transparent;
border-bottom: 0.0625rem solid #d8dada;
}
.Tab {
position: relative;
display: inline-block;
margin-bottom: 0;
margin-right: 0.875rem;
min-width: 5rem;
}
.Tab a, .Tab button {
position: relative;
border: 0;
display: inline-block;
padding: 0.1875rem 0;
margin: 0;
color: #000000;
font-weight: bold;
font-size: 0.875rem;
text-decoration: none;
cursor: pointer;
background-color: transparent;
-webkit-appearance: none;
-moz-appearance: none;
border-radius: 0;
line-height: 1.2;
border-top: 0.1875rem solid transparent;
border-bottom: 0.1875rem solid transparent;
font-family: inherit;
text-align: left;
}
.Tab a:focus, .Tab button:focus {
outline: 0.0625rem solid #d8dada;
}
.Tab a:hover, .Tab button:hover {
color: #000000;
background-color: transparent;
border-top-color: transparent;
border-bottom-color: #747676;
}
.Tab.is-active a, .Tab.is-active button {
background-color: transparent;
color: #000000;
border-top-color: transparent;
border-bottom-color: #d52b1e;
}
.Tab.is-active a:hover, .Tab.is-active button:hover {
background-color: transparent;
color: #000000;
border-top-color: transparent;
border-bottom-color: #d52b1e;
}
.Tabs.Tabs--borderHide .Tabs-list {
border-bottom-color: transparent;
}
.Tabs.Tabs--borderTop .Tabs-list {
border-top-color: #d8dada;
border-bottom-color: transparent;
}
.Tabs.Tabs--accentTop .Tab.is-active a, .Tabs.Tabs--accentTop .Tab.is-active button, .Tabs.Tabs--accentTop .Tab:hover a, .Tabs.Tabs--accentTop .Tab:hover button, .Tabs.Tabs--accentTop .Tab.is-active:hover a, .Tabs.Tabs--accentTop .Tab.is-active:hover button {
background-color: transparent;
color: #000000;
border-bottom-color: transparent;
border-top-color: #d52b1e;
}
.Tabs.Tabs--accentTop .Tab:hover a, .Tabs.Tabs--accentTop .Tab:hover button {
border-bottom-color: transparent;
border-top-color: #747676;
}
.Tabs.Tabs--accentFill .Tab a, .Tabs.Tabs--accentFill .Tab button {
padding-right: 0px;
margin-right: 0.875rem;
width: 100%;
}
.Tabs.Tabs--centered .Tabs-list {
justify-content: center;
}
.Tabs.Tabs--centered .Tab, .Tabs.Tabs--centered .Tab a, .Tabs.Tabs--centered .Tab button {
text-align: center;
}
/**
* Core Theme Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Imports
* - functions
* - mixins
* - animations
* - fonts
* - font awesome 5
* - Color Definitions
* - Interface
* - General
* - Messaging Types
* - Button
* - Button State
* - Secondary Button
* - Secondary Button State
* - CTA Button
* - Borders
* - Links
* - Fonts
* - Transitions
* - Horizontal Rule
* - Breakpoints
* - Spacers
*
* **/
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* Tags Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Import
* - General
* - Success
* - Info
* - Warning
* - Error
*
* **/
.Tag {
display: inline-block;
vertical-align: middle;
border-radius: 0.125rem;
padding: 0.21875rem 0.4375rem;
font-size: 0.9em;
line-height: 1;
background-color: #747676;
color: #ffffff;
}
.Tag.Tag--success {
background-color: #00ac3e;
color: #ffffff;
}
.Tag.Tag--info {
background-color: #0088ce;
color: #ffffff;
}
.Tag.Tag--warning {
background-color: #ffbc3d;
color: #000000;
}
.Tag.Tag--error {
background-color: #ed7000;
color: #ffffff;
}
/**
* Core Theme Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Imports
* - functions
* - mixins
* - animations
* - fonts
* - font awesome 5
* - Color Definitions
* - Interface
* - General
* - Messaging Types
* - Button
* - Button State
* - Secondary Button
* - Secondary Button State
* - CTA Button
* - Borders
* - Links
* - Fonts
* - Transitions
* - Horizontal Rule
* - Breakpoints
* - Spacers
*
* **/
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* Tooltips Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - General
*
* **/
.Tooltip {
display: none;
position: absolute;
background: #ffffff;
border: 0.0625rem solid #000000;
color: #000000;
padding: 0.875rem;
width: 18.75rem;
}
.Tooltip.is-active {
display: block;
}
.Tooltip.Tooltip--top, .Tooltip.Tooltip--fullTop {
margin-bottom: 0.75rem;
transform: translateY(-0.75rem);
}
.Tooltip.Tooltip--top::after, .Tooltip.Tooltip--fullTop::after {
transform: rotate(135deg);
content: "";
width: 0.875rem;
height: 0.875rem;
border-top: 0.0625rem solid black;
border-right: 0.0625rem solid black;
bottom: 0;
left: 0;
right: 0;
margin: 0 auto;
position: absolute;
background-color: #ffffff;
}
.Tooltip.Tooltip--top::after, .Tooltip.Tooltip--fullTop::after {
top: auto;
bottom: -0.5rem;
}
.Tooltip.Tooltip--right {
margin-left: 0.75rem;
transform: translateX(-0.75rem);
}
.Tooltip.Tooltip--right::after {
transform: rotate(-135deg);
content: "";
width: 0.875rem;
height: 0.875rem;
border-top: 0.0625rem solid black;
border-right: 0.0625rem solid black;
bottom: 0;
left: 0;
right: 0;
margin: 0 auto;
position: absolute;
background-color: #ffffff;
}
.Tooltip.Tooltip--right::after {
margin: auto 0;
right: auto;
left: -0.5rem;
top: 0;
bottom: 0;
}
.Tooltip.Tooltip--bottom, .Tooltip.Tooltip--fullBottom {
margin-top: 0.75rem;
transform: translateY(0.75rem);
}
.Tooltip.Tooltip--bottom::after, .Tooltip.Tooltip--fullBottom::after {
transform: rotate(-45deg);
content: "";
width: 0.875rem;
height: 0.875rem;
border-top: 0.0625rem solid black;
border-right: 0.0625rem solid black;
bottom: 0;
left: 0;
right: 0;
margin: 0 auto;
position: absolute;
background-color: #ffffff;
}
.Tooltip.Tooltip--bottom::after, .Tooltip.Tooltip--fullBottom::after {
top: -0.5rem;
bottom: auto;
}
.Tooltip.Tooltip--left {
margin-right: 0.75rem;
transform: translateX(0.75rem);
}
.Tooltip.Tooltip--left::after {
transform: rotate(45deg);
content: "";
width: 0.875rem;
height: 0.875rem;
border-top: 0.0625rem solid black;
border-right: 0.0625rem solid black;
bottom: 0;
left: 0;
right: 0;
margin: 0 auto;
position: absolute;
background-color: #ffffff;
}
.Tooltip.Tooltip--left::after {
margin: auto 0;
left: auto;
right: -0.5rem;
top: 0;
bottom: 0;
}
.Tooltip.Tooltip--fullTop {
width: 100%;
left: 0;
right: 0;
}
.Tooltip.Tooltip--fullBottom {
width: 100%;
left: 0;
right: 0;
}
.u-alignTop {
vertical-align: top !important;
}
.u-alignMiddle {
vertical-align: middle !important;
}
.u-alignBottom {
vertical-align: bottom !important;
}
.u-alignBaseline {
vertical-align: baseline !important;
}
/**
* Core Theme Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Imports
* - functions
* - mixins
* - animations
* - fonts
* - font awesome 5
* - Color Definitions
* - Interface
* - General
* - Messaging Types
* - Button
* - Button State
* - Secondary Button
* - Secondary Button State
* - CTA Button
* - Borders
* - Links
* - Fonts
* - Transitions
* - Horizontal Rule
* - Breakpoints
* - Spacers
*
* **/
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
.u-colorPrimary {
color: #000000 !important;
}
.u-colorSecondary {
color: #ffffff !important;
}
.u-colorAccent {
color: #d52b1e !important;
}
.u-colorError {
color: #ed7000 !important;
}
.u-colorWarning {
color: #ffbc3d !important;
}
.u-colorSuccess {
color: #00ac3e !important;
}
.u-colorInfo {
color: #0088ce !important;
}
.u-colorError--66 {
color: #F3A157 !important;
}
.u-colorWarning--66 {
color: #FFD37F !important;
}
.u-colorSuccess--66 {
color: #57C880 !important;
}
.u-colorInfo--66 {
color: #57B1DF !important;
}
.u-colorError--33 {
color: #F9D0AB !important;
}
.u-colorWarning--33 {
color: #FFE9BF !important;
}
.u-colorSuccess--33 {
color: #ABE4BF !important;
}
.u-colorInfo--33 {
color: #ABD8EF !important;
}
.u-colorGray {
color: #747676 !important;
}
.u-colorGray--1 {
color: #f6f6f6 !important;
}
.u-colorGray--3 {
color: #d8dada !important;
}
.u-colorGray--10 {
color: #333333 !important;
}
.u-colorBackgroundPrimary {
background-color: #000000 !important;
}
.u-colorBackgroundSecondary {
background-color: #ffffff !important;
}
.u-colorBackgroundAccent {
background-color: #d52b1e !important;
}
.u-colorBackgroundError {
background-color: #ed7000 !important;
}
.u-colorBackgroundWarning {
background-color: #ffbc3d !important;
}
.u-colorBackgroundSuccess {
background-color: #00ac3e !important;
}
.u-colorBackgroundInfo {
background-color: #0088ce !important;
}
.u-colorBackgroundError--66 {
background-color: #F3A157 !important;
}
.u-colorBackgroundWarning--66 {
background-color: #FFD37F !important;
}
.u-colorBackgroundSuccess--66 {
background-color: #57C880 !important;
}
.u-colorBackgroundInfo--66 {
background-color: #57B1DF !important;
}
.u-colorBackgroundError--33 {
background-color: #F9D0AB !important;
}
.u-colorBackgroundWarning--33 {
background-color: #FFE9BF !important;
}
.u-colorBackgroundSuccess--33 {
background-color: #ABE4BF !important;
}
.u-colorBackgroundInfo--33 {
background-color: #ABD8EF !important;
}
.u-colorBackgroundGray {
background-color: #747676 !important;
}
.u-colorBackgroundGray--1 {
background-color: #f6f6f6 !important;
}
.u-colorBackgroundGray--3 {
background-color: #d8dada !important;
}
.u-colorBackgroundGray--10 {
background-color: #333333 !important;
}
.u-displayBlock {
display: block !important;
}
.u-displayInline {
display: inline !important;
}
.u-displayFlex {
display: flex !important;
}
.u-displayInlineBlock {
display: inline-block !important;
}
.u-displayTable {
display: table !important;
}
.u-displayTableCell {
display: table-cell !important;
}
/**
*
* Using the flex utility library from suitcss. This is the most complete flexbox
* utility library and achieve all of our goals.
*
* https://github.com/suitcss/utils-flex
*
* */
/** @define utilities */
/* Applies to flex container
* ========================================================================== */
/**
* * Container
* */
.u-flex {
display: flex !important;
}
.u-flexInline {
display: inline-flex !important;
}
/**
* * Direction: row
* */
.u-flexRow {
flex-direction: row !important;
}
.u-flexRowReverse {
flex-direction: row-reverse !important;
}
/**
* * Direction: column
* */
.u-flexColumn {
flex-direction: column !important;
}
.u-flexColumnReverse {
flex-direction: column-reverse !important;
}
/**
* * Wrap
* */
.u-flexWrap {
flex-wrap: wrap !important;
}
.u-flexNoWrap {
flex-wrap: nowrap !important;
}
.u-flexWrapReverse {
flex-wrap: wrap-reverse !important;
}
/**
* * Align items along the main axis of the current line of the flex container
* */
.u-flexJustifyStart {
justify-content: flex-start !important;
}
.u-flexJustifyEnd {
justify-content: flex-end !important;
}
.u-flexJustifyCenter {
justify-content: center !important;
}
.u-flexJustifyBetween {
justify-content: space-between !important;
}
.u-flexJustifyAround {
justify-content: space-around !important;
}
/**
* * Align items in the cross axis of the current line of the flex container
* * Similar to `justify-content` but in the perpendicular direction
* */
.u-flexAlignItemsStart {
align-items: flex-start !important;
}
.u-flexAlignItemsEnd {
align-items: flex-end !important;
}
.u-flexAlignItemsCenter {
align-items: center !important;
}
.u-flexAlignItemsStretch {
align-items: stretch !important;
}
.u-flexAlignItemsBaseline {
align-items: baseline !important;
}
/**
* * Aligns items within the flex container when there is extra
* * space in the cross-axis
* *
* * Has no effect when there is only one line of flex items.
* */
.u-flexAlignContentStart {
align-content: flex-start !important;
}
.u-flexAlignContentEnd {
align-content: flex-end !important;
}
.u-flexAlignContentCenter {
align-content: center !important;
}
.u-flexAlignContentStretch {
align-content: stretch !important;
}
.u-flexAlignContentBetween {
align-content: space-between !important;
}
.u-flexAlignContentAround {
align-content: space-around !important;
}
/* Applies to flex items
* ========================================================================== */
/**
* * Override default alignment of single item when specified by `align-items`
* */
.u-flexAlignSelfStart {
align-self: flex-start !important;
}
.u-flexAlignSelfEnd {
align-self: flex-end !important;
}
.u-flexAlignSelfCenter {
align-self: center !important;
}
.u-flexAlignSelfStretch {
align-self: stretch !important;
}
.u-flexAlignSelfBaseline {
align-self: baseline !important;
}
.u-flexAlignSelfAuto {
align-self: auto !important;
}
/**
* * Change order without editing underlying HTML
* */
.u-flexOrderFirst {
order: -1 !important;
}
.u-flexOrderLast {
order: 1 !important;
}
.u-flexOrderNone {
order: 0 !important;
}
/**
* * Specify the flex grow factor, which determines how much the flex item will
* * grow relative to the rest of the flex items in the flex container.
* *
* * Supports 1-5 proportions
* *
* * 1. Provide all values to avoid IE10 bug with shorthand flex
* * - http://git.io/vllC7
* *
* * Use `0%` to avoid bug in IE10/11 with unitless flex basis. Using this
* * instead of `auto` as this matches what the default would be with `flex`
* * shorthand - http://git.io/vllWx
* */
.u-flexGrow1 {
flex: 1 1 0% !important;
/* 1 */
}
.u-flexGrow2 {
flex: 2 1 0% !important;
}
.u-flexGrow3 {
flex: 3 1 0% !important;
}
.u-flexGrow4 {
flex: 4 1 0% !important;
}
.u-flexGrow5 {
flex: 5 1 0% !important;
}
/**
* * Specify the flex shrink factor, which determines how much the flex item will
* * shrink relative to the rest of the flex items in the flex container.
* */
.u-flexShrink0 {
flex-shrink: 0 !important;
}
.u-flexShrink1 {
flex-shrink: 1 !important;
}
.u-flexShrink2 {
flex-shrink: 2 !important;
}
.u-flexShrink3 {
flex-shrink: 3 !important;
}
.u-flexShrink4 {
flex-shrink: 4 !important;
}
.u-flexShrink5 {
flex-shrink: 5 !important;
}
/**
* * Aligning with `auto` margins
* * http://www.w3.org/TR/css-flexbox-1/#auto-margins
* */
.u-flexExpand {
margin: auto !important;
}
.u-flexExpandLeft {
margin-left: auto !important;
}
.u-flexExpandRight {
margin-right: auto !important;
}
.u-flexExpandTop {
margin-top: auto !important;
}
.u-flexExpandBottom {
margin-bottom: auto !important;
}
/**
* * Basis
* */
.u-flexBasisAuto {
flex-basis: auto !important;
}
.u-flexBasis0 {
flex-basis: 0 !important;
}
/*
* * Shorthand
* *
* * Declares all values instead of keywords like 'initial' to work around IE10
* * https://www.w3.org/TR/css-flexbox-1/#flex-common
* *
* * 1. Fixes issue in IE 10 where flex-basis is ignored - https://git.io/vllMt
* * This ensures it overrides flex-basis set in other utilities.
* */
/*
* * Sizes the item based on the width/height properties
* */
.u-flexInitial {
flex: 0 1 auto !important;
flex-basis: auto !important;
/* 1 */
}
/*
* * Sizes the item based on the width/height properties, but makes them fully
* * flexible, so that they absorb any free space along the main axis.
* */
.u-flexAuto {
flex: 1 1 auto !important;
flex-basis: auto !important;
/* 1 */
}
/*
* * Sizes the item according to the width/height properties, but makes the flex
* * item fully inflexible. Similar to initial, except that flex items are
* * not allowed to shrink, even in overflow situations.
* */
.u-flexNone {
flex: 0 0 auto !important;
flex-basis: auto !important;
/* 1 */
}
.u-floatClearFix::before,
.u-floatClearFix::after {
content: " ";
display: table;
}
.u-floatClearFix::after {
clear: both;
}
.u-floatLeft {
float: left !important;
}
.u-floatRight {
float: right !important;
}
.u-opacity25 {
opacity: 0.25 !important;
}
.u-opacity50 {
opacity: 0.5 !important;
}
.u-opacity75 {
opacity: 0.75 !important;
}
.u-opacity100 {
opacity: 1 !important;
}
/**
* Core Theme Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Imports
* - functions
* - mixins
* - animations
* - fonts
* - font awesome 5
* - Color Definitions
* - Interface
* - General
* - Messaging Types
* - Button
* - Button State
* - Secondary Button
* - Secondary Button State
* - CTA Button
* - Borders
* - Links
* - Fonts
* - Transitions
* - Horizontal Rule
* - Breakpoints
* - Spacers
*
* **/
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
.u-marginAllNone {
margin-top: 0 !important;
margin-right: 0 !important;
margin-bottom: 0 !important;
margin-left: 0 !important;
}
.u-marginAllExtraSmall {
margin-top: 0.21875rem !important;
margin-right: 0.21875rem !important;
margin-bottom: 0.21875rem !important;
margin-left: 0.21875rem !important;
}
.u-marginAllSmall {
margin-top: 0.4375rem !important;
margin-right: 0.4375rem !important;
margin-bottom: 0.4375rem !important;
margin-left: 0.4375rem !important;
}
.u-marginAllMedium {
margin-top: 0.875rem !important;
margin-right: 0.875rem !important;
margin-bottom: 0.875rem !important;
margin-left: 0.875rem !important;
}
.u-marginAllLarge {
margin-top: 1.3125rem !important;
margin-right: 1.3125rem !important;
margin-bottom: 1.3125rem !important;
margin-left: 1.3125rem !important;
}
.u-marginAllExtraLarge {
margin-top: 1.75rem !important;
margin-right: 1.75rem !important;
margin-bottom: 1.75rem !important;
margin-left: 1.75rem !important;
}
.u-marginAllAuto {
margin-top: auto !important;
margin-right: auto !important;
margin-bottom: auto !important;
margin-left: auto !important;
}
.u-marginXNone {
margin-right: 0 !important;
margin-left: 0 !important;
}
.u-marginXExtraSmall {
margin-right: 0.21875rem !important;
margin-left: 0.21875rem !important;
}
.u-marginXSmall {
margin-right: 0.4375rem !important;
margin-left: 0.4375rem !important;
}
.u-marginXMedium {
margin-right: 0.875rem !important;
margin-left: 0.875rem !important;
}
.u-marginXLarge {
margin-right: 1.3125rem !important;
margin-left: 1.3125rem !important;
}
.u-marginXExtraLarge {
margin-right: 1.75rem !important;
margin-left: 1.75rem !important;
}
.u-marginXAuto {
margin-right: auto !important;
margin-left: auto !important;
}
.u-marginYNone {
margin-top: 0 !important;
margin-bottom: 0 !important;
}
.u-marginYExtraSmall {
margin-top: 0.21875rem !important;
margin-bottom: 0.21875rem !important;
}
.u-marginYSmall {
margin-top: 0.4375rem !important;
margin-bottom: 0.4375rem !important;
}
.u-marginYMedium {
margin-top: 0.875rem !important;
margin-bottom: 0.875rem !important;
}
.u-marginYLarge {
margin-top: 1.3125rem !important;
margin-bottom: 1.3125rem !important;
}
.u-marginYExtraLarge {
margin-top: 1.75rem !important;
margin-bottom: 1.75rem !important;
}
.u-marginYAuto {
margin-top: auto !important;
margin-bottom: auto !important;
}
.u-marginTopNone {
margin-top: 0 !important;
}
.u-marginTopExtraSmall {
margin-top: 0.21875rem !important;
}
.u-marginTopSmall {
margin-top: 0.4375rem !important;
}
.u-marginTopMedium {
margin-top: 0.875rem !important;
}
.u-marginTopLarge {
margin-top: 1.3125rem !important;
}
.u-marginTopExtraLarge {
margin-top: 1.75rem !important;
}
.u-marginTopAuto {
margin-top: auto !important;
}
.u-marginRightNone {
margin-right: 0 !important;
}
.u-marginRightExtraSmall {
margin-right: 0.21875rem !important;
}
.u-marginRightSmall {
margin-right: 0.4375rem !important;
}
.u-marginRightMedium {
margin-right: 0.875rem !important;
}
.u-marginRightLarge {
margin-right: 1.3125rem !important;
}
.u-marginRightExtraLarge {
margin-right: 1.75rem !important;
}
.u-marginRightAuto {
margin-right: auto !important;
}
.u-marginBottomNone {
margin-bottom: 0 !important;
}
.u-marginBottomExtraSmall {
margin-bottom: 0.21875rem !important;
}
.u-marginBottomSmall {
margin-bottom: 0.4375rem !important;
}
.u-marginBottomMedium {
margin-bottom: 0.875rem !important;
}
.u-marginBottomLarge {
margin-bottom: 1.3125rem !important;
}
.u-marginBottomExtraLarge {
margin-bottom: 1.75rem !important;
}
.u-marginBottomAuto {
margin-bottom: auto !important;
}
.u-marginLeftNone {
margin-left: 0 !important;
}
.u-marginLeftExtraSmall {
margin-left: 0.21875rem !important;
}
.u-marginLeftSmall {
margin-left: 0.4375rem !important;
}
.u-marginLeftMedium {
margin-left: 0.875rem !important;
}
.u-marginLeftLarge {
margin-left: 1.3125rem !important;
}
.u-marginLeftExtraLarge {
margin-left: 1.75rem !important;
}
.u-marginLeftAuto {
margin-left: auto !important;
}
.u-paddingAllNone {
padding-top: 0 !important;
padding-right: 0 !important;
padding-bottom: 0 !important;
padding-left: 0 !important;
}
.u-paddingAllExtraSmall {
padding-top: 0.21875rem !important;
padding-right: 0.21875rem !important;
padding-bottom: 0.21875rem !important;
padding-left: 0.21875rem !important;
}
.u-paddingAllSmall {
padding-top: 0.4375rem !important;
padding-right: 0.4375rem !important;
padding-bottom: 0.4375rem !important;
padding-left: 0.4375rem !important;
}
.u-paddingAllMedium {
padding-top: 0.875rem !important;
padding-right: 0.875rem !important;
padding-bottom: 0.875rem !important;
padding-left: 0.875rem !important;
}
.u-paddingAllLarge {
padding-top: 1.3125rem !important;
padding-right: 1.3125rem !important;
padding-bottom: 1.3125rem !important;
padding-left: 1.3125rem !important;
}
.u-paddingAllExtraLarge {
padding-top: 1.75rem !important;
padding-right: 1.75rem !important;
padding-bottom: 1.75rem !important;
padding-left: 1.75rem !important;
}
.u-paddingAllAuto {
padding-top: auto !important;
padding-right: auto !important;
padding-bottom: auto !important;
padding-left: auto !important;
}
.u-paddingXNone {
padding-right: 0 !important;
padding-left: 0 !important;
}
.u-paddingXExtraSmall {
padding-right: 0.21875rem !important;
padding-left: 0.21875rem !important;
}
.u-paddingXSmall {
padding-right: 0.4375rem !important;
padding-left: 0.4375rem !important;
}
.u-paddingXMedium {
padding-right: 0.875rem !important;
padding-left: 0.875rem !important;
}
.u-paddingXLarge {
padding-right: 1.3125rem !important;
padding-left: 1.3125rem !important;
}
.u-paddingXExtraLarge {
padding-right: 1.75rem !important;
padding-left: 1.75rem !important;
}
.u-paddingXAuto {
padding-right: auto !important;
padding-left: auto !important;
}
.u-paddingYNone {
padding-top: 0 !important;
padding-bottom: 0 !important;
}
.u-paddingYExtraSmall {
padding-top: 0.21875rem !important;
padding-bottom: 0.21875rem !important;
}
.u-paddingYSmall {
padding-top: 0.4375rem !important;
padding-bottom: 0.4375rem !important;
}
.u-paddingYMedium {
padding-top: 0.875rem !important;
padding-bottom: 0.875rem !important;
}
.u-paddingYLarge {
padding-top: 1.3125rem !important;
padding-bottom: 1.3125rem !important;
}
.u-paddingYExtraLarge {
padding-top: 1.75rem !important;
padding-bottom: 1.75rem !important;
}
.u-paddingYAuto {
padding-top: auto !important;
padding-bottom: auto !important;
}
.u-paddingTopNone {
padding-top: 0 !important;
}
.u-paddingTopExtraSmall {
padding-top: 0.21875rem !important;
}
.u-paddingTopSmall {
padding-top: 0.4375rem !important;
}
.u-paddingTopMedium {
padding-top: 0.875rem !important;
}
.u-paddingTopLarge {
padding-top: 1.3125rem !important;
}
.u-paddingTopExtraLarge {
padding-top: 1.75rem !important;
}
.u-paddingTopAuto {
padding-top: auto !important;
}
.u-paddingRightNone {
padding-right: 0 !important;
}
.u-paddingRightExtraSmall {
padding-right: 0.21875rem !important;
}
.u-paddingRightSmall {
padding-right: 0.4375rem !important;
}
.u-paddingRightMedium {
padding-right: 0.875rem !important;
}
.u-paddingRightLarge {
padding-right: 1.3125rem !important;
}
.u-paddingRightExtraLarge {
padding-right: 1.75rem !important;
}
.u-paddingRightAuto {
padding-right: auto !important;
}
.u-paddingBottomNone {
padding-bottom: 0 !important;
}
.u-paddingBottomExtraSmall {
padding-bottom: 0.21875rem !important;
}
.u-paddingBottomSmall {
padding-bottom: 0.4375rem !important;
}
.u-paddingBottomMedium {
padding-bottom: 0.875rem !important;
}
.u-paddingBottomLarge {
padding-bottom: 1.3125rem !important;
}
.u-paddingBottomExtraLarge {
padding-bottom: 1.75rem !important;
}
.u-paddingBottomAuto {
padding-bottom: auto !important;
}
.u-paddingLeftNone {
padding-left: 0 !important;
}
.u-paddingLeftExtraSmall {
padding-left: 0.21875rem !important;
}
.u-paddingLeftSmall {
padding-left: 0.4375rem !important;
}
.u-paddingLeftMedium {
padding-left: 0.875rem !important;
}
.u-paddingLeftLarge {
padding-left: 1.3125rem !important;
}
.u-paddingLeftExtraLarge {
padding-left: 1.75rem !important;
}
.u-paddingLeftAuto {
padding-left: auto !important;
}
/**
* Core Theme Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Imports
* - functions
* - mixins
* - animations
* - fonts
* - font awesome 5
* - Color Definitions
* - Interface
* - General
* - Messaging Types
* - Button
* - Button State
* - Secondary Button
* - Secondary Button State
* - CTA Button
* - Borders
* - Links
* - Fonts
* - Transitions
* - Horizontal Rule
* - Breakpoints
* - Spacers
*
* **/
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
.u-textNormal {
font-style: normal !important;
}
.u-textItalic {
font-style: italic !important;
}
.u-textOblique {
font-style: oblique !important;
}
.u-textRegular {
font-weight: normal !important;
}
.u-textMedium {
font-weight: 500 !important;
}
.u-textBold {
font-weight: bold !important;
}
.u-textLeft {
text-align: left !important;
}
.u-textRight {
text-align: right !important;
}
.u-textCenter {
text-align: center !important;
}
.u-textJustify {
text-align: justify !important;
}
.u-textStart {
text-align: start !important;
}
.u-textEnd {
text-align: end !important;
}
.u-textCapitalize {
text-transform: capitalize !important;
}
.u-textUppercase {
text-transform: uppercase !important;
}
.u-textLowercase {
text-transform: lowercase !important;
}
.u-textTransformNone {
text-transform: none !important;
}
.u-textUnderline {
text-decoration: underline !important;
}
.u-textOverline {
text-decoration: overline !important;
}
.u-textDecorationNone {
text-decoration: none !important;
}
.u-textLineThrough {
text-decoration: line-through !important;
}
.u-textBreakNormal {
word-break: normal !important;
}
.u-textBreakWrap {
word-break: break-all !important;
}
.u-textBreakNoWrap {
word-break: keep-all !important;
white-space: nowrap !important;
}
.u-textLineHeightNormal {
line-height: 1.2 !important;
}
.u-textLineHeightTight {
line-height: 1 !important;
}
.u-textLineHeightLoose {
line-height: 1.5 !important;
}
.u-screenReaderOnly {
border: 0 !important;
clip: rect(1px, 1px, 1px, 1px) !important;
-webkit-clip-path: inset(50%) !important;
clip-path: inset(50%) !important;
height: 0.0625rem !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
width: 0.0625rem !important;
white-space: nowrap !important;
}
.u-screenReaderOnlyFocusable:focus,
.u-screenReaderOnlyFocusable:active {
clip: auto !important;
-webkit-clip-path: none !important;
clip-path: none !important;
height: auto !important;
overflow: visible !important;
width: auto !important;
white-space: normal !important;
}
/**
* Core Theme Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Imports
* - functions
* - mixins
* - animations
* - fonts
* - font awesome 5
* - Color Definitions
* - Interface
* - General
* - Messaging Types
* - Button
* - Button State
* - Secondary Button
* - Secondary Button State
* - CTA Button
* - Borders
* - Links
* - Fonts
* - Transitions
* - Horizontal Rule
* - Breakpoints
* - Spacers
*
* **/
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
.u-touchable {
padding: 0.4375rem !important;
margin: -0.4375rem !important;
}
.u-video {
height: 0;
overflow: hidden;
padding-bottom: 67.5% !important;
position: relative;
}
.u-video iframe {
height: 100%;
position: absolute;
width: 100%;
}
/**
* Core Theme Configuration File.
*
* Naming Convention:
* $Namespace-propertyDescription--modifier
*
* - Imports
* - functions
* - mixins
* - animations
* - fonts
* - font awesome 5
* - Color Definitions
* - Interface
* - General
* - Messaging Types
* - Button
* - Button State
* - Secondary Button
* - Secondary Button State
* - CTA Button
* - Borders
* - Links
* - Fonts
* - Transitions
* - Horizontal Rule
* - Breakpoints
* - Spacers
*
* **/
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
/**
* * @defaults:
* */
/**
* * @prop:
* * @return: value without unit of measure
* */
/**
* * @prop:
* * @return: value in rems
* */
.u-showForExtraSmallUp {
display: none !important;
}
@media screen and (min-width: 320px) {
.u-showForExtraSmallUp {
display: inherit !important;
}
}
.u-showForSmallUp {
display: none !important;
}
@media screen and (min-width: 544px) {
.u-showForSmallUp {
display: inherit !important;
}
}
.u-showForMediumUp {
display: none !important;
}
@media screen and (min-width: 768px) {
.u-showForMediumUp {
display: inherit !important;
}
}
.u-showForLargeUp {
display: none !important;
}
@media screen and (min-width: 991px) {
.u-showForLargeUp {
display: inherit !important;
}
}
.u-showForExtraLargeUp {
display: none !important;
}
@media screen and (min-width: 1200px) {
.u-showForExtraLargeUp {
display: inherit !important;
}
}
.u-showForExtraSmallDown {
display: none !important;
}
@media screen and (max-width: 320px) {
.u-showForExtraSmallDown {
display: inherit !important;
}
}
.u-showForSmallDown {
display: none !important;
}
@media screen and (max-width: 544px) {
.u-showForSmallDown {
display: inherit !important;
}
}
.u-showForMediumDown {
display: none !important;
}
@media screen and (max-width: 768px) {
.u-showForMediumDown {
display: inherit !important;
}
}
.u-showForLargeDown {
display: none !important;
}
@media screen and (max-width: 991px) {
.u-showForLargeDown {
display: inherit !important;
}
}
.u-showForExtraLargeDown {
display: none !important;
}
@media screen and (max-width: 1200px) {
.u-showForExtraLargeDown {
display: inherit !important;
}
}
.u-showForExtraSmallOnly {
display: none !important;
}
@media screen and (min-width: 320px) and (max-width: 544px) {
.u-showForExtraSmallOnly {
display: inherit !important;
}
}
.u-showForSmallOnly {
display: none !important;
}
@media screen and (min-width: 544px) and (max-width: 768px) {
.u-showForSmallOnly {
display: inherit !important;
}
}
.u-showForMediumOnly {
display: none !important;
}
@media screen and (min-width: 768px) and (max-width: 991px) {
.u-showForMediumOnly {
display: inherit !important;
}
}
.u-showForLargeOnly {
display: none !important;
}
@media screen and (min-width: 991px) and (max-width: 1200px) {
.u-showForLargeOnly {
display: inherit !important;
}
}
.u-showForExtraLargeOnly {
display: none !important;
}
@media screen and (min-width: 1200px) {
.u-showForExtraLargeOnly {
display: inherit !important;
}
}
.u-hideForExtraSmallUp {
display: inherit !important;
}
@media screen and (min-width: 320px) {
.u-hideForExtraSmallUp {
display: none !important;
}
}
.u-hideForSmallUp {
display: inherit !important;
}
@media screen and (min-width: 544px) {
.u-hideForSmallUp {
display: none !important;
}
}
.u-hideForMediumUp {
display: inherit !important;
}
@media screen and (min-width: 768px) {
.u-hideForMediumUp {
display: none !important;
}
}
.u-hideForLargeUp {
display: inherit !important;
}
@media screen and (min-width: 991px) {
.u-hideForLargeUp {
display: none !important;
}
}
.u-hideForExtraLargeUp {
display: inherit !important;
}
@media screen and (min-width: 1200px) {
.u-hideForExtraLargeUp {
display: none !important;
}
}
.u-hideForExtraSmallDown {
display: inherit !important;
}
@media screen and (max-width: 320px) {
.u-hideForExtraSmallDown {
display: none !important;
}
}
.u-hideForSmallDown {
display: inherit !important;
}
@media screen and (max-width: 544px) {
.u-hideForSmallDown {
display: none !important;
}
}
.u-hideForMediumDown {
display: inherit !important;
}
@media screen and (max-width: 768px) {
.u-hideForMediumDown {
display: none !important;
}
}
.u-hideForLargeDown {
display: inherit !important;
}
@media screen and (max-width: 991px) {
.u-hideForLargeDown {
display: none !important;
}
}
.u-hideForExtraLargeDown {
display: inherit !important;
}
@media screen and (max-width: 1200px) {
.u-hideForExtraLargeDown {
display: none !important;
}
}
.u-hideForExtraSmallOnly {
display: inherit !important;
}
@media screen and (min-width: 320px) and (max-width: 544px) {
.u-hideForExtraSmallOnly {
display: none !important;
}
}
.u-hideForSmallOnly {
display: inherit !important;
}
@media screen and (min-width: 544px) and (max-width: 768px) {
.u-hideForSmallOnly {
display: none !important;
}
}
.u-hideForMediumOnly {
display: inherit !important;
}
@media screen and (min-width: 768px) and (max-width: 991px) {
.u-hideForMediumOnly {
display: none !important;
}
}
.u-hideForLargeOnly {
display: inherit !important;
}
@media screen and (min-width: 991px) and (max-width: 1200px) {
.u-hideForLargeOnly {
display: none !important;
}
}
.u-hideForExtraLargeOnly {
display: inherit !important;
}
@media screen and (min-width: 1200px) {
.u-hideForExtraLargeOnly {
display: none !important;
}
}
/*
* This will hide the focus indicator if the element receives focus via the mouse,
* but it will still show up on keyboard focus.
* */
.js-focus-visible :focus:not(.focus-visible) {
outline: none;
}
.js-focus-visible :focus:not([data-focus-visible-added]) {
outline: none;
}
/*===================================
* Variables
* ===================================*/
/*===================================
* Base Elements
* ===================================*/
html,
body {
height: 100%;
position: relative;
}
body {
min-width: 320px;
position: relative;
width: 100%;
}
main {
min-height: 100%;
display: block;
position: relative;
margin-top: 55px;
background-color: #fff;
}
pre {
overflow: auto;
}
code {
border-radius: 3px;
background-color: #d8dada;
display: inline-block;
padding: 2.5px 5px;
text-decoration: inherit;
vertical-align: baseline;
white-space: pre-wrap;
}
pre code {
border-radius: 0;
padding: 0;
margin: 0;
display: block;
color: #333;
background: #f3f3f3;
border: 0.0625rem solid #e6e6e6;
font-size: 0.875rem;
line-height: 1.5;
}
h1 a,
h2 a,
h3 a,
h4 a,
h5 a {
text-decoration: none;
}
h1 a:hover,
h2 a:hover,
h3 a:hover,
h4 a:hover,
h5 a:hover {
color: #000000;
}
section,
.Section {
background-color: #fff;
padding-bottom: 3rem;
}
section.Section--primary,
.Section.Section--primary {
background-color: #000;
}
section.Section--secondary,
.Section.Section--secondary {
background-color: #f1f1f1;
}
section.Section--tertiary,
.Section.Section--tertiary {
background-color: #fff;
}
/*===================================
* Helpers
* ===================================*/
.is-hidden {
display: none;
}
/*===================================
* Layout
* ===================================*/
.GridContainer {
padding-right: 0;
padding-left: 0;
max-width: 90rem;
margin: 0 auto;
position: relative;
}
.Main-content-title {
padding: 0;
}
.Main-content-title p {
margin: 0;
font-size: 18px;
}
.Main-content-title .Main-content-title-body {
padding: 32px 20px 112px;
}
header.Header--Primary {
position: fixed;
z-index: 5;
top: 0;
left: 0;
width: 100%;
background-color: #ffffff;
border-bottom: 1px solid #efefef;
padding: 1rem 1rem 0 1rem;
border-bottom: 1px solid #d8d8d8;
}
footer.Footer--primary {
border-top: 1px solid #d8d8d8;
width: 100%;
padding: 2rem 20px;
position: relative;
z-index: 2;
}
footer.Footer--primary.Footer--primary .Footer-content {
background-color: black;
padding: 1rem;
color: #ffffff;
}
.Wrapper {
padding: 1rem;
}
.Main-wrapper {
display: flex;
height: 100%;
max-width: 1400px;
}
.Main-wrapper .Main-sidebar {
display: none;
}
.Main-wrapper .Main-content {
min-height: 100vh;
flex-basis: 100%;
max-width: 100%;
}
.Main-wrapper .Main-content-title {
background-color: #000;
padding: 32px 20px 112px;
}
.Main-wrapper .Main-content-title h1,
.Main-wrapper .Main-content-title a {
color: #ffffff;
display: block;
font-size: 2.75rem;
}
.Main-wrapper .Main-content-title h1:hover,
.Main-wrapper .Main-content-title a:hover {
color: #d8dada;
}
.Main-wrapper .Main-content-body {
padding: 32px 20px 112px;
}
/*===================================
* Page Specific
* ===================================*/
#Home .Main-wrapper {
padding-right: 0;
padding-left: 0;
max-width: 90rem;
margin: 0 auto;
}
#Home .Main-content {
padding: 0;
}
#Home #Particles {
display: none;
position: absolute;
width: 100%;
height: 600px;
}
#Home .Hero {
position: relative;
height: 600px;
padding-bottom: 0;
margin-bottom: 0;
border-bottom: none;
background: #ffffff;
overflow: hidden;
}
#Home .Hero .LogoImage {
width: 50vw;
max-width: 660px;
height: 92px;
}
#Home .Hero .TextHidden {
font-size: 0;
width: 1px;
height: 1px;
display: inline-block;
overflow: hidden;
position: absolute !important;
border: 0 !important;
padding: 0 !important;
margin: 0 !important;
clip: rect(1px, 1px, 1px, 1px);
}
#Home .Hero .Callout {
background: transparent;
padding: 0;
text-align: center;
}
#Home .Hero .Callout p {
font-size: 18px;
}
#Home .Hero::after {
content: '';
background: #fff;
height: 300px;
width: 100%;
position: absolute;
bottom: 0;
left: 0;
right: 0;
z-index: 1;
}
#Home .Hero-content {
position: absolute;
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
flex-flow: column;
z-index: 2;
}
#Home .Hero-content img {
margin-bottom: 2rem;
}
#Home .Content > section {
padding: 1rem;
margin: auto;
position: relative;
left: 0;
right: 0;
max-width: 1200px;
margin-bottom: 3rem;
}
#Home .Libraries .Library {
padding: 1rem;
text-align: center;
display: flex;
justify-content: space-between;
flex-flow: column wrap;
}
#Home .Libraries .Library .Library-installation {
text-align: left;
}
#Home .Libraries .Library .Library-logo {
height: 110px;
}
#Home .Libraries .Library .Library-logo img {
width: 100px;
}
/* Defects & Requests */
.LabelDefect {
height: 22rem;
}
/*===================================
* Components
* ===================================*/
.ComponentTile-tile {
background-color: #000000;
color: #ffffff;
display: block;
font-size: 2.75rem;
padding: 32px 20px 112px;
}
.ComponentTile-tile:hover {
color: #d8dada;
}
.ExampleBlock {
background: #d8dada;
border: 1px solid #fff;
}
.ExampleOverflow {
overflow: hidden;
}
.DocImages {
display: block;
width: 200px;
}
.DocImages--password {
width: 250px;
margin-bottom: 2rem;
}
.DocImages--npmrc {
width: 100%;
margin: 2rem 0;
}
.DocImages--distribution {
max-width: 45rem;
}
.DocImages--migration {
width: 400px;
margin-bottom: 1rem;
}
.Navigation-container {
display: flex;
justify-content: space-between;
align-items: center;
}
.Navigation-container .Navigation-primary {
position: relative;
display: flex;
align-items: center;
justify-content: space-between;
height: 65px;
z-index: 3;
align-items: flex-end;
padding-bottom: 16px;
}
.Navigation-container .Navigation-primary .Navigation-logo {
display: none;
width: 5rem;
}
.Navigation-container .Navigation-primary .Navigation-links {
display: none;
}
.Navigation-container .Navigation-primary .Navigation-links a {
color: #000000;
padding: 20px 0px 6px;
font-size: 14px;
text-decoration: none;
margin-top: 5px;
margin-right: 6px;
border-bottom: 4px solid transparent;
white-space: nowrap;
}
.Navigation-container .Navigation-primary .Navigation-links a:hover {
color: #000000;
}
.Navigation-container .Navigation-primary .Navigation-links a:active {
color: #000000;
}
.Navigation-container .Navigation-primary .Navigation-links :hover,
.Navigation-container .Navigation-primary .Navigation-links .is-active,
.Navigation-container .Navigation-primary .Navigation-links .active {
border-bottom-color: #d52b1e;
}
.Navigation-container .Navigation-links--social {
display: none;
white-space: nowrap;
margin-top: -5px;
}
.Navigation-container .Navigation-links--social a {
font-size: 1.5rem;
text-decoration: none;
}
.Navigation-container .Navigation-links--social img {
height: 1.5rem;
padding-left: 0.5rem;
filter: grayscale(100%);
}
.Navigation-container .Navigation-links--social img:hover {
filter: none;
}
.Navigation-container .Navigation-Trigger {
border: none;
padding: 0;
padding-left: 0.75rem;
padding-top: 0.25rem;
vertical-align: top;
text-transform: uppercase;
background-color: transparent;
color: #000;
}
.Navigation-container .Navigation-Trigger:hover, .Navigation-container .Navigation-Trigger:focus, .Navigation-container .Navigation-Trigger.is-active {
background-color: transparent;
color: #000000;
}
.Navigation-container .Navigation-Trigger i.Icon {
font-size: 1.5rem;
}
.Navigation-container .Navigation-Trigger i.Icon.isHidden {
display: none;
}
.Navigation-versions {
display: flex;
flex-flow: row nowrap;
background-color: #fff;
}
.Navigation-versions select.Form-input.Subtree-version {
height: 28px;
width: auto;
padding: 0 1.75rem 0 1ch;
background-position: top 0.6rem right 0.25rem;
background-size: 1rem;
}
.Navigation-versions select::-ms-expand {
display: none;
}
.Navigation-secondary {
display: flex;
justify-content: flex-end;
align-items: center;
}
.Subtree-version {
margin-right: 5px;
}
.Versions-wrapper {
position: relative;
}
.Versions-icon {
position: relative;
margin: 5px 5px 10px 0px;
font-size: 1rem;
}
.Versions-info {
display: none;
top: 17px;
margin-left: -143px;
}
#TopButton {
display: none;
position: fixed;
top: calc(100vh - 5rem);
right: 2rem;
z-index: 10;
}
#TopButton.show {
display: block;
}
.MobileNav {
background: #fff;
overflow: hidden;
border-top: 1px solid #ffffff;
z-index: 2;
display: none;
position: absolute;
width: 100%;
left: 0;
}
.MobileNav.is-active {
border-top: 1px solid #e6e6e6;
border-bottom: 1px solid #e6e6e6;
display: block;
box-shadow: 0 3px 7px rgba(0, 0, 0, 0.15);
}
.MobileNav h3 {
display: inline-block;
margin-bottom: 0;
}
.MobileNav nav > ul > li {
padding: 0.5rem 0;
}
.MobileNav nav > ul > li > a {
font-weight: bold;
padding: 0.75rem 1rem;
display: block;
}
.MobileNav nav ul {
padding-left: 0;
margin-bottom: 0;
margin-top: 0;
}
.MobileNav nav li {
margin-bottom: 0;
margin-top: 0;
border-bottom: none;
border-top: none;
list-style: none;
position: relative;
}
.MobileNav nav li a {
text-decoration: none;
padding: 0.5rem 1rem;
display: block;
color: #000000;
}
.MobileNav nav li button.Accordion-button,
.MobileNav nav li h3 {
padding: 0 1rem;
margin-bottom: 0;
}
.MobileNav nav li button.Accordion-button::after,
.MobileNav nav li h3::after {
height: 1rem;
}
.MobileNav nav li .Accordion-group {
border-top: 1px solid #d8dada;
}
.Snippet {
/* margin-bottom: 1.5rem; */
margin: 0;
}
.Snippet pre {
overflow-x: auto;
overflow-y: hidden;
background: #f3f3f3;
border: 1px solid #e6e6e6;
/* padding: 1rem; */
}
.Snippet code {
font-size: 14px;
line-height: 1.5;
white-space: pre-wrap;
}
.source {
padding: 1rem 0;
display: none;
}
.source.show {
display: block;
}
.source ~ pre {
margin-top: 0;
}
.Subscribe {
margin: 2em auto;
text-align: center;
}
.Subscribe .Subscribe-hero-image {
max-width: 208px;
width: 100%;
margin-bottom: 2em;
margin-left: auto;
margin-right: auto;
}
.Subscribe .Subscribe-instruction {
margin-bottom: 2rem;
}
.Subscribe .Subscribe-logo {
width: 8rem;
}
.Markdown {
margin-left: 10%;
margin-right: 10%;
}
.Swatch {
width: 50px;
height: 25px;
border: 1px solid #ffffff;
box-shadow: 1px 1px 5px #dcdcdc;
}
.ComponentExampleTabs .ComponentExampleTabList {
margin-bottom: 1.5rem;
padding-left: 0;
border-bottom: 1px solid #d8dada;
}
.ComponentExampleTabs .ComponentExampleTabList a.ComponentExampleTab {
display: inline-flex;
color: #000000;
font-size: 1.25rem;
font-weight: bold;
text-decoration: none;
margin-right: 1rem;
padding-bottom: 0.125rem;
border-bottom: 0.25rem solid transparent;
}
.ComponentExampleTabs .ComponentExampleTabList a.ComponentExampleTab:hover, .ComponentExampleTabs .ComponentExampleTabList a.ComponentExampleTab.is-active, .ComponentExampleTabs .ComponentExampleTabList a.ComponentExampleTab.active {
color: #000000;
border-bottom: 4px solid #d52b1e;
}
.ComponentExampleTabs .ComponentExampleTabList a.ComponentExampleTab.is-disabled {
pointer-events: none;
color: #747676;
}
.ComponentExampleTabs .ComponentExampleTabList a.ComponentExampleTab.is-disabled:hover {
border-bottom-color: transparent;
}
.ComponentExampleTabs .ComponentExampleTabList a.ComponentExampleTab.ComponentExampleTab::before {
display: inline-block;
height: 1rem;
width: 1rem;
background-size: cover;
content: '';
margin-right: 4px;
margin-top: 7px;
}
.ComponentExampleTabs .ComponentExampleTabList a.ComponentExampleTab.ComponentExampleTab--angular::before {
background-image: url("/images/vendor/angular_logo.svg");
}
.ComponentExampleTabs .ComponentExampleTabList a.ComponentExampleTab.ComponentExampleTab--core::before {
background-image: url("/images/vendor/css_logo.svg");
}
.ComponentExampleTabs .ComponentExampleTabList a.ComponentExampleTab.ComponentExampleTab--react::before {
background-image: url("/images/vendor/react_logo.svg");
}
.ComponentExampleTabs .ComponentExampleTabList a.ComponentExampleTab.ComponentExampleTab--vue::before {
background-image: url("/images/vendor/vue_logo.svg");
}
.ComponentExampleTabs .ComponentExamplePanel {
padding-top: 1rem;
padding-bottom: 3rem;
width: 100%;
}
.ComponentExampleTabs .ComponentExamplePanel iframe {
border: 0;
padding-right: 0;
width: 100%;
min-height: 500px;
}
.ComponentExample, .ComponentExampleWithTag {
position: relative;
padding: 1rem;
border: 2px solid #d8dada;
}
.ComponentExample--fixed {
min-height: 350px;
}
.ComponentExample--fixedSmall {
min-height: 100px;
}
.ComponentExampleTag {
display: inline-block;
background: #d8dada;
color: #333333;
padding: 0 6px;
left: -2px;
}
.ComponentExampleTag a {
color: #333333;
text-decoration: none;
}
.ComponentExampleWithTag ::before {
content: 'Example';
display: block;
position: absolute;
top: -18px;
background: #d8dada;
color: #333333;
padding: 0 6px;
left: -2px;
}
select.Form-input.Component-version {
background-color: #fff;
bottom: -2px;
background-position: right 0.25rem center;
display: flex;
flex-flow: row nowrap;
height: 28px;
padding-right: 1.5rem;
}
select.Form-input.Component-version select.Form-input.Subtree-version {
height: 28px;
width: auto;
padding: 0 1.75rem 0 1ch;
background-position: top 0.6rem right 0.25rem;
background-size: 1rem;
}
select.Form-input.Component-version select::-ms-expand {
display: none;
}
.ExampleWrapper {
margin-bottom: 2rem;
}
.ExampleWrapper.ExampleWrapper--tab::before {
content: 'Example';
display: inline-block;
top: -1.5rem;
background: #d8dada;
color: #333333;
padding: 0 6px;
left: -2px;
}
.ExampleCode {
position: relative;
}
.ExampleCode.ExampleCode--border {
padding: 1rem 0.75rem 1rem 0.75rem;
border: 2px solid #d8dada;
}
.ExampleCode ~ .ExampleCode {
border-top: none;
}
.ExampleVendorLogoImg {
height: 42px;
padding-right: 10px;
}
.ExamplePanelTitle {
display: flex;
align-items: flex-end;
justify-content: flex-start;
}
.ExampleComingSoon {
margin-top: 1rem;
margin-bottom: 2rem;
padding: 1em;
text-align: center;
font-size: 3em;
color: #00ac3e;
background-color: #d8dada;
}
#Search {
position: relative;
padding-top: 0.25rem;
}
.SearchInput {
position: relative;
margin-right: 0.5rem;
}
.SearchInput input {
padding-right: 2rem;
padding-left: 1rem;
padding-top: 0.5rem;
padding-bottom: 0.5rem;
height: 28px;
}
.SearchInput input:focus + i {
opacity: 1;
transition: opacity 300ms;
}
.SearchInput i {
transition: opacity 300ms, font-size 300ms;
transition: opacity 300ms;
opacity: 0.5;
position: absolute;
top: 0;
bottom: 0;
right: 0.5rem;
margin: auto;
height: 1.5rem;
width: 1.5rem;
font-size: 1rem;
}
.SearchResults {
z-index: 3;
position: absolute;
overflow-y: auto;
right: 0px;
margin-top: 10px;
min-width: 250px;
max-height: calc(100vh - 5rem);
box-shadow: 0px 0px 3px 1px rgba(0, 0, 0, 0.15);
}
.SearchResults .Grid {
margin: 0;
padding: 0;
}
.SearchResults div {
margin-top: 0;
margin-bottom: 0;
}
.SearchResults a {
display: block;
text-decoration: none;
color: #000000;
}
.SearchResults .SearchCategory, .SearchResults .SearchInfo, .SearchResults .SearchWait,
.SearchResults .SearchNotFound, .SearchResults .SearchError {
padding-top: 0.5rem;
padding-bottom: 0.5rem;
padding-left: 1rem;
color: #ffffff;
}
.SearchResults .SearchInfo {
color: #ffffff;
background-color: #000000;
}
.SearchResults .SearchWait,
.SearchResults .SearchNotFound {
color: #000000;
background-color: #ffbc3d;
}
.SearchResults .SearchError {
color: #ffffff;
background-color: #ed7000;
}
.SearchResults .SearchPages {
width: 100%;
}
.SearchResults .SearchPage {
border-bottom: 1px solid #bfbfbf;
}
.SearchResults .SearchPage:last-child {
border-bottom: none;
}
.SearchResults .SearchPage a {
display: block;
width: 100%;
height: 100%;
}
.SearchResults .SearchItem {
vertical-align: top;
border-bottom: 1px solid #d8dada;
}
.SearchResults .SearchItem:last-child {
border-bottom: none;
}
.SearchResults .SearchItem a {
padding: 0.5rem;
}
.SearchResults .SearchItem a:hover {
background-color: #f2f2f2;
}
.SearchResults .SearchItem .SearchHighlight {
background-color: #abd8ef;
}
.SearchResults .SearchPageName,
.SearchResults .SearchPageLocation {
padding: 0;
vertical-align: top;
}
.SearchResults .SearchPageName {
padding-top: 0.5rem;
padding-left: 0.5rem;
background-color: #d8dada;
}
.SearchResults .SearchPageLocation {
vertical-align: top;
background-color: #ffffff;
}
.TestBlock {
padding: 5px;
color: #f00;
background-color: #ccc;
border: 2px solid #00f;
}
.Main-sidebar {
background: #fff;
padding: 2.5rem 2rem 1rem;
}
.Main-sidebar ul {
list-style-type: none;
margin: 0;
line-height: 1em;
padding-left: 0;
}
.Main-sidebar ul li {
margin-bottom: 0;
}
.Main-sidebar ul li.Main-sidebar-separator::before {
content: '';
display: block;
margin: 1rem 0;
border-top: 0.0625rem solid #d8dada;
}
.Main-sidebar ul li.Main-sidebar-separator-bottom::after {
content: '';
display: block;
margin-top: 0.5rem;
margin-bottom: 2rem;
border-bottom: 0.0625rem solid #d8dada;
}
.Main-sidebar ul li a {
text-decoration: none;
width: 100%;
color: #000000;
display: inline-block;
padding: 0 0 1.5ch;
position: relative;
cursor: pointer;
transition: font-weight 300ms;
}
.Main-sidebar ul li a.sideBarItem::before {
/* Greater Than Symbol */
}
.Main-sidebar ul li:hover a, .Main-sidebar ul li.active a {
transition: font-weight 300ms;
font-weight: bold;
}
.Main-sidebar ul li.is-open a.sideBarItem::before {
position: absolute;
top: -3px;
left: -10px;
content: url("/images/sidebar-active.svg");
/* Greater Than Symbol */
/* Greater Than Symbol */
/* Rotate to Down V Symbol */
}
.Main-sidebar ul li div.SubBar {
margin-top: -1.25rem;
margin-bottom: 0;
padding: 0.625rem 0.625rem 0.625rem 1.25rem;
}
.Main-sidebar ul li div.SubBar li a {
color: #757575;
transition: font-weight 0ms;
margin: 0.25rem 0.25rem;
padding: 0.25rem 0.25rem;
font-weight: normal;
}
.Main-sidebar ul li div.SubBar li.active a {
color: black;
}
.SubBar-divider {
width: 103%;
font-weight: bold;
padding: 0.25rem;
}
.gridContainer {
width: 100%;
border: 1px solid black;
}
.verticalContainer {
width: 100%;
border: 1px solid black;
height: 400px;
}
.gridBlock,
.grid-block {
background: #d0d0d0;
display: block;
text-align: center;
padding: 10px 10px;
margin-right: 16px;
margin-bottom: 30px;
}
.LoaderContainer {
position: relative;
width: 25%;
height: 50px;
padding: 1rem;
background-color: #e5e5e5;
}
.Loader,
.Loader::after {
position: inherit;
}
.Loader--overlay,
.Loader--overlay::after {
position: absolute;
}
/*===================================
* Styles scoped to rendered component README
* ===================================*/
.ComponentReadme h2, .ComponentReadme h3 {
font-size: 1.5em;
}
.ComponentReadme table {
border: none;
border-collapse: collapse;
text-align: left;
width: 100%;
font-size: 0.875rem;
margin-bottom: 2rem;
padding-top: 1.125rem;
border-spacing: 0px;
border-top: 0.25rem solid black;
}
.ComponentReadme th {
color: #000000;
background-color: #ffffff;
font-size: 0.75rem;
line-height: 0.9rem;
text-align: left;
vertical-align: top;
padding: 1.125rem 1.3125rem 2.25rem 0px;
}
.ComponentReadme th:last-of-type {
border-right: none;
}
.ComponentReadme tr {
border-bottom: 0.0625rem solid #d8dada;
}
.ComponentReadme td {
border: none;
line-height: 0.9rem;
font-size: 0.75rem;
text-align: left;
vertical-align: top;
padding: 2.625rem 1.3125rem 2.625rem 0px;
}
@media (min-width: 768px) {
.ComponentReadme th {
line-height: 1.05rem;
font-size: 0.875rem;
}
.ComponentReadme td {
line-height: 1.05rem;
font-size: 0.875rem;
}
}
/*===================================
* Media Queries
* ===================================*/
@media only screen and (max-width: 544px) {
.Navigation-container div:last-child {
padding-top: 0;
}
.Navigation-container .Navigation-Trigger {
padding-top: 0.1875rem;
}
.Navigation-Trigger {
padding-top: 0.1875rem;
}
}
@media (min-width: 544px) {
.Navigation-container .Navigation-primary .Navigation-logo {
display: block;
margin-right: 1rem;
padding-top: 0;
width: 57px;
}
.Navigation-container .Navigation-primary .Navigation-logo img {
width: 57px;
padding-bottom: 4px;
height: auto;
}
.SearchResults {
right: 0;
min-width: 350px;
}
}
@media only screen and (min-width: 768px) {
/*===================================
* Layout
* ===================================*/
.Main-wrapper .Main-sidebar {
flex-basis: 250px;
max-width: 250px;
display: block;
position: fixed;
width: 250px;
overflow: auto;
height: calc(100vh - 80px);
top: 80px;
z-index: 1;
}
.Main-wrapper .Main-content {
flex-basis: calc(100% - 250px);
max-width: calc(100% - 250px);
margin-left: 250px;
border-left: 1px solid #d8d8d8;
position: relative;
}
.Main-wrapper .Main-content.Main-content--full {
flex-basis: 100%;
max-width: 100%;
left: 0;
border: 0;
margin-left: 0;
}
/*===================================
* Components
* ===================================*/
.MobileNav.is-active {
display: none;
}
#Search {
position: relative;
padding-top: 0;
padding-right: 0.25rem;
}
.SearchResults {
right: 14px;
top: 25px;
min-width: 450px;
}
}
@media only screen and (min-width: 768px) {
.Navigation-container .Navigation-primary {
padding-top: 0;
flex-direction: row;
justify-content: start;
}
.Navigation-container .Navigation-primary .Navigation-links {
display: inline-block;
white-space: nowrap;
margin-top: -5px;
padding-top: 0;
}
.Navigation-container .Navigation-Trigger {
display: none;
}
}
@media only screen and (min-width: 850px) {
.Navigation-container .Navigation-primary .Navigation-links {
width: 455px;
}
.Navigation-container .Navigation-primary .Navigation-links a {
padding: 20px 4px 6px;
font-size: 16px;
}
}
@media only screen and (min-width: 991px) {
main {
margin-top: 80px;
}
/*===================================
* Layout
* ===================================*/
footer.Footer--primary {
border: 1px solid #d8d8d8;
background-color: #fff;
}
footer.Footer--primary .Callout.Callout--split > div {
flex-basis: 50%;
max-width: 50%;
}
footer.Footer--primary .Callout.Callout--split > div:last-of-type {
display: block;
}
/*===================================
* Page Specific Styles
* ===================================*/
#Home main {
box-shadow: none;
overflow: visible;
margin-top: 0;
}
#Home .Header.Header--Primary {
background-color: transparent;
box-shadow: none;
border-bottom-color: transparent;
border-bottom-color: #d8d8d8;
}
#Home .Header.Header--Primary.is-active {
background-color: #ffffff;
}
#Home .Main-content {
left: 0;
position: relative;
}
#Home .Features .Feature {
padding: 1rem 1.5rem;
}
#Home footer.Footer--primary {
padding-left: 0;
}
.Navigation-container .Navigation-links {
width: 535px;
}
.Navigation-container .Navigation-links--social {
display: inline-block;
margin-top: -10px;
padding-top: 0;
}
}
@media only screen and (min-width: 650px) and (max-width: 767px) {
.Navigation-container .Navigation-links--social {
display: inline-block;
margin-top: -10px;
padding-top: 0;
}
}
@media only screen and (max-width: 350px) {
.SearchResults {
margin-right: -20px;
}
}
@media only screen and (max-width: 380px) {
.SearchInput input {
width: 10rem;
}
}